Skip to content

Commit cd696dc

Browse files
LanaDXLanaDX
authored
V24 2 beta update (#2)
* - Updated to v24.2 Beta API. - Added classes for custom context/toolbar items. - ❗ Readme update required.
1 parent ab92eaf commit cd696dc

File tree

11 files changed

+246
-164
lines changed

11 files changed

+246
-164
lines changed

‎CS/DevExpress.AI.Samples.Blazor.Editors/Components/AdditionalItems/ShakespeareAIContextMenuItem.cs‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
using DevExpress.AIIntegration;
2+
using DevExpress.AIIntegration.Blazor.RichEdit;
3+
using DevExpress.AIIntegration.Extensions;
4+
using Microsoft.AspNetCore.Components;
5+
6+
namespace DevExpress.AI.Samples.Blazor.Editors.Components.AdditionalItems {
7+
public class ShakespeareAIContextMenuItem : BaseAIContextMenuItem {
8+
[Inject] IAIExtensionsContainer? aIExtensionsContainer { get; set; }
9+
10+
protected override string DefaultItemText => "Rewrite like Shakespeare";
11+
12+
protected override Task<TextResponse> GetCommandTextResult(string text) {
13+
var customExtension = aIExtensionsContainer.CreateCustomPromptExtension();
14+
return customExtension.ExecuteAsync(new CustomPromptRequest("Rewrite the following text in William Shakespeare style.", text));
15+
}
16+
}
17+
}

‎CS/DevExpress.AI.Samples.Blazor.Editors/Components/AdditionalItems/ShakespeareAIToolbarItem.cs‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
using DevExpress.AIIntegration;
2+
using DevExpress.AIIntegration.Blazor.HtmlEditor;
3+
using DevExpress.AIIntegration.Extensions;
4+
using Microsoft.AspNetCore.Components;
5+
6+
namespace DevExpress.AI.Samples.Blazor.Editors.Components.AdditionalItems {
7+
public class ShakespeareAIToolbarItem: BaseAIToolbarItem {
8+
[Inject] IAIExtensionsContainer? aIExtensionsContainer { get; set; }
9+
10+
protected override string DefaultItemText => "Rewrite like Shakespeare";
11+
12+
protected override Task<TextResponse> GetCommandTextResult(string text) {
13+
var customExtension = aIExtensionsContainer.CreateCustomPromptExtension();
14+
return customExtension.ExecuteAsync(new CustomPromptRequest("Rewrite the following text in William Shakespeare style.", text));
15+
}
16+
}
17+
}

‎CS/DevExpress.AI.Samples.Blazor.Editors/Components/App.razor‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -12,8 +12,8 @@
1212
</head>
1313

1414
<body>
15-
<Routes @rendermode="InteractiveServer" />
16-
<script src="_framework/blazor.web.js"></script>
15+
<Routes @rendermode="InteractiveServer" />
16+
<script src="_framework/blazor.web.js"></script>
1717
</body>
1818

19-
</html>
19+
</html>

‎CS/DevExpress.AI.Samples.Blazor.Editors/Components/Pages/HtmlEditor.razor‎

Lines changed: 73 additions & 72 deletions
Original file line numberDiff line numberDiff line change
@@ -1,73 +1,74 @@
1-
@page "/htmleditor"
2-
@using DevExpress.AIIntegration.Blazor.HtmlEditor
3-
@using System.Reflection
4-
5-
<DxHtmlEditor @bind-Markup="Value" CssClass="my-editor" BindMarkupMode="HtmlEditorBindMarkupMode.OnLostFocus">
6-
<AdditionalSettings>
7-
<SummaryAISettings />
8-
<ExplainAISettings />
9-
<ProofreadAISettings />
10-
<ExpandAISettings />
11-
<ShortenAISettings />
12-
<CustomAISettings />
13-
<RewriteAISettings />
14-
<ToneAISettings />
15-
<TranslateAISettings Languages="@("German, French, Chinese")" />
16-
</AdditionalSettings>
17-
</DxHtmlEditor>
18-
19-
@code {
20-
public string Value { get; set; } = @"<h2>
21-
HTML Editor
22-
</h2><br>
23-
<p>The HTML Editor component for Blazor is a WYSIWYG (what you see is what you get) text editor that allows users to format text and add graphics. The document can use HTML or Markdown format.</p>
24-
<p>Supported features:</p>
25-
<ul>
26-
<li>Inline formats:
27-
<ul>
28-
<li><strong>Bold</strong>, <em>italic</em>, <s>strikethrough</s> text formatting</li>
29-
<li>Font, size, color changes (HTML only)</li>
30-
</ul>
31-
</li>
32-
<li>Block formats:
33-
<ul>
34-
<li>Headings</li>
35-
<li>Text alignment</li>
36-
<li>Lists (bullet and numbered)</li>
37-
<li>Code blocks</li>
38-
<li>Quotes</li>
39-
</ul>
40-
</li>
41-
<li>HTML and Markdown support</li>
42-
<li>Variable support: produce documents based on templates</li>
43-
<li>Toolbar with adaptive layout support</li>
44-
<li>Insert images: specify a URL or upload from the local file system</li>
45-
<li>Table support</li>
46-
</ul>
47-
<p>Supported browsers:
48-
<table>
49-
<tbody>
50-
<tr>
51-
<td><strong>Google Chrome (including Android)</strong></td>
52-
<td>Latest</td>
53-
</tr>
54-
<tr>
55-
<td><strong>Apple Safari (including iOS)</strong></td>
56-
<td>Latest</td>
57-
</tr>
58-
<tr>
59-
<td><strong>Mozilla Firefox</strong></td>
60-
<td>Latest</td>
61-
</tr>
62-
<tr>
63-
<td><strong>Microsoft Edge</strong></td>
64-
<td>Latest</td>
65-
</tr>
66-
<tr>
67-
<td><strong><a href='https://support.microsoft.com/en-us/microsoft-edge/what-is-microsoft-edge-legacy-3e779e55-4c55-08e6-ecc8-2333768c0fb0' rel='noopener noreferrer' target='_blank'>Microsoft Edge Legacy</a></strong></td>
68-
<td>Not supported</td>
69-
</tr>
70-
</tbody>
71-
</table>
72-
<br>";
1+
@page "/htmleditor"
2+
@using DevExpress.AI.Samples.Blazor.Editors.Components.AdditionalItems
3+
@using DevExpress.AIIntegration.Blazor.HtmlEditor
4+
5+
<DxHtmlEditor @bind-Markup="Value" CssClass="my-editor" BindMarkupMode="HtmlEditorBindMarkupMode.OnLostFocus">
6+
<AdditionalItems>
7+
<ShakespeareAIToolbarItem />
8+
<SummarizeAIToolbarItem />
9+
<ExplainAIToolbarItem />
10+
<ProofreadAIToolbarItem />
11+
<ExpandAIToolbarItem />
12+
<ShortenAIToolbarItem />
13+
<AskAssistantAIToolbarItem />
14+
<ChangeStyleAIToolbarItem />
15+
<ChangeToneAIToolbarItem />
16+
<TranslateAIToolbarItem Languages="@("German, French, Chinese")" />
17+
</AdditionalItems>
18+
</DxHtmlEditor>
19+
20+
@code {
21+
public string Value { get; set; } = @"<h2>
22+
HTML Editor
23+
</h2><br>
24+
<p>The HTML Editor component for Blazor is a WYSIWYG (what you see is what you get) text editor that allows users to format text and add graphics. The document can use HTML or Markdown format.</p>
25+
<p>Supported features:</p>
26+
<ul>
27+
<li>Inline formats:
28+
<ul>
29+
<li><strong>Bold</strong>, <em>italic</em>, <s>strikethrough</s> text formatting</li>
30+
<li>Font, size, color changes (HTML only)</li>
31+
</ul>
32+
</li>
33+
<li>Block formats:
34+
<ul>
35+
<li>Headings</li>
36+
<li>Text alignment</li>
37+
<li>Lists (bullet and numbered)</li>
38+
<li>Code blocks</li>
39+
<li>Quotes</li>
40+
</ul>
41+
</li>
42+
<li>HTML and Markdown support</li>
43+
<li>Variable support: produce documents based on templates</li>
44+
<li>Toolbar with adaptive layout support</li>
45+
<li>Insert images: specify a URL or upload from the local file system</li>
46+
<li>Table support</li>
47+
</ul>
48+
<p>Supported browsers:
49+
<table>
50+
<tbody>
51+
<tr>
52+
<td><strong>Google Chrome (including Android)</strong></td>
53+
<td>Latest</td>
54+
</tr>
55+
<tr>
56+
<td><strong>Apple Safari (including iOS)</strong></td>
57+
<td>Latest</td>
58+
</tr>
59+
<tr>
60+
<td><strong>Mozilla Firefox</strong></td>
61+
<td>Latest</td>
62+
</tr>
63+
<tr>
64+
<td><strong>Microsoft Edge</strong></td>
65+
<td>Latest</td>
66+
</tr>
67+
<tr>
68+
<td><strong><a href='https://support.microsoft.com/en-us/microsoft-edge/what-is-microsoft-edge-legacy-3e779e55-4c55-08e6-ecc8-2333768c0fb0' rel='noopener noreferrer' target='_blank'>Microsoft Edge Legacy</a></strong></td>
69+
<td>Not supported</td>
70+
</tr>
71+
</tbody>
72+
</table>
73+
<br>";
7374
}

‎CS/DevExpress.AI.Samples.Blazor.Editors/Components/Pages/RichEdit.razor‎

Lines changed: 19 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,31 +1,36 @@
11
@page "/"
22
@using DevExpress.AIIntegration.Blazor.RichEdit
3+
@using DevExpress.AI.Samples.Blazor.Editors.Components.AdditionalItems
34
@using DevExpress.Blazor.RichEdit
45
@using System.Reflection
56

67
<DxRichEdit DocumentContent="DocumentContent" CssClass="my-editor">
7-
<AdditionalSettings>
8-
<SummaryAISettings />
9-
<ExplainAISettings />
10-
<ProofreadAISettings />
11-
<ExpandAISettings />
12-
<ShortenAISettings />
13-
<CustomAISettings />
14-
<RewriteAISettings />
15-
<ToneAISettings />
16-
<TranslateAISettings Languages="@("German, French, Chinese")" />
17-
</AdditionalSettings>
8+
<AdditionalItems>
9+
<ShakespeareAIContextMenuItem />
10+
<SummarizeAIContextMenuItem />
11+
<ExplainAIContextMenuItem />
12+
<ProofreadAIContextMenuItem />
13+
<ExpandAIContextMenuItem />
14+
<ShortenAIContextMenuItem />
15+
<AskAssistantAIContextMenuItem />
16+
<ChangeStyleAIContextMenuItem />
17+
<ChangeToneAIContextMenuItem />
18+
<TranslateAIContextMenuItem Languages="@("German, French, Chinese")" />
19+
</AdditionalItems>
1820
</DxRichEdit>
1921

2022
@code {
2123
const string DocumentResourceName = "DevExpress.AI.Samples.Blazor.Editors.Docs.Example.docx";
2224
byte[] DocumentContent { get; set; }
23-
protected override void OnInitialized() {
24-
using(MemoryStream ms = new MemoryStream()) {
25+
protected override void OnInitialized()
26+
{
27+
using (var ms = new MemoryStream())
28+
{
2529
var stream = Assembly.GetExecutingAssembly().GetManifestResourceStream(DocumentResourceName);
26-
stream.CopyTo(ms);
30+
stream?.CopyTo(ms);
2731
DocumentContent = ms.ToArray();
2832
}
33+
2934
base.OnInitialized();
3035
}
3136
}

‎CS/DevExpress.AI.Samples.Blazor.Editors/Components/_Imports.razor‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,4 +9,4 @@
99
@using DevExpress.AI.Samples.Blazor.Editors
1010
@using DevExpress.AI.Samples.Blazor.Editors.Components
1111
@using DevExpress.Blazor
12-
@* @using DevExpress.AIIntegration.Blazor.Components.ChatUI.Models *@
12+
@using DevExpress.Blazor.Office

‎CS/DevExpress.AI.Samples.Blazor.Editors/DevExpress.AI.Samples.Blazor.Editors.csproj‎

Lines changed: 10 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -6,19 +6,21 @@
66
<ImplicitUsings>enable</ImplicitUsings>
77
</PropertyGroup>
88

9-
<ItemGroup>
10-
<None Remove="Docs\Example.docx" />
9+
<ItemGroup>
10+
<None Remove="Docs\Example.docx" />
1111
</ItemGroup>
1212

13-
<ItemGroup>
14-
<EmbeddedResource Include="Docs\Example.docx" />
13+
<ItemGroup>
14+
<EmbeddedResource Include="Docs\Example.docx" />
1515
</ItemGroup>
1616

1717
<ItemGroup>
18-
<PackageReference Include="DevExpress.AIIntegration.Azure.OpenAI" Version="24.2.1-alpha-24246" />
19-
<PackageReference Include="DevExpress.AIIntegration.Blazor.HtmlEditor" Version="24.2.1-alpha-24246" />
20-
<PackageReference Include="DevExpress.AIIntegration.Blazor.RichEdit" Version="24.2.1-alpha-24246" />
21-
<PackageReference Include="DevExpress.AIIntegration.Web" Version="24.2.1-alpha-24246" />
18+
<PackageReference Include="Azure.AI.OpenAI" Version="2.1.0-beta.2" />
19+
<PackageReference Include="Azure.Identity" Version="1.13.1" />
20+
<PackageReference Include="DevExpress.AIIntegration.Blazor" Version="24.2.1-alpha-24319" />
21+
<PackageReference Include="DevExpress.Blazor.RichEdit" Version="24.2.1-alpha-24319" />
2222
<PackageReference Include="Markdig" Version="0.37.0" />
23+
<PackageReference Include="Microsoft.Extensions.AI" Version="9.0.0-preview.9.24556.5" />
24+
<PackageReference Include="Microsoft.Extensions.AI.OpenAI" Version="9.0.0-preview.9.24556.5" />
2325
</ItemGroup>
2426
</Project>

‎CS/DevExpress.AI.Samples.Blazor.Editors/Program.cs‎

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,25 @@
1-
using Azure.AI.OpenAI;
2-
using Azure;
1+
using Azure;
2+
using Azure.AI.OpenAI;
33
using DevExpress.AI.Samples.Blazor.Editors.Components;
4-
using DevExpress.AIIntegration;
4+
using Microsoft.Extensions.AI;
55

66
var builder = WebApplication.CreateBuilder(args);
77

88
// Add services to the container.
99
builder.Services.AddRazorComponents()
10-
.AddInteractiveServerComponents();
10+
.AddInteractiveServerComponents();
1111

12-
string azureOpenAIEndpoint = Environment.GetEnvironmentVariable("AZURE_OPENAI_ENDPOINT");
12+
string azureOpenAIEndpoint = Environment.GetEnvironmentVariable("AZURE_OPENAI_ENDPOINT");
1313
string azureOpenAIKey = Environment.GetEnvironmentVariable("AZURE_OPENAI_API_KEY");
14+
string deploymentName = string.Empty;
15+
16+
IChatClient chatClient = new AzureOpenAIClient(
17+
new Uri(azureOpenAIEndpoint),
18+
new AzureKeyCredential(azureOpenAIKey)).AsChatClient(deploymentName);
1419

1520
builder.Services.AddDevExpressBlazor();
16-
builder.Services.AddDevExpressAI((config) => {
17-
var client = new AzureOpenAIClient(
18-
new Uri(azureOpenAIEndpoint),
19-
new AzureKeyCredential(azureOpenAIKey));
20-
config.RegisterChatClientOpenAIService(client, "gpt4o");
21-
config.RegisterOpenAIAssistants(client, "gpt4o");
22-
});
21+
builder.Services.AddChatClient(config => config.Use(chatClient));
22+
builder.Services.AddDevExpressAI();
2323
var app = builder.Build();
2424

2525
// Configure the HTTP request pipeline.
@@ -37,4 +37,4 @@
3737
app.MapRazorComponents<App>()
3838
.AddInteractiveServerRenderMode();
3939

40-
app.Run();
40+
app.Run();

0 commit comments

Comments
 (0)