Skip to content

Commit 139a15e

Browse files
committed
Sync with Kendo UI Professional
1 parent 794b066 commit 139a15e

File tree

692 files changed

+5436
-4394
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

692 files changed

+5436
-4394
lines changed

docs-aspnet/_contentTemplates/mvc/add-client-side-resources.md

Lines changed: 50 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -6,62 +6,67 @@ Before you can use a Telerik UI component, you must include the theme, the jQuer
66

77
1. Go to `~\Views\Shared\_Layout.cshtml` and add the Kendo UI theme of your choice to the `<head>` of the document. Since Microsoft's project template uses Bootstrap, you can use the Kendo UI SASS Bootstrap theme to match it.
88

9-
<head>
10-
<meta charset="utf-8" />
11-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
12-
<title>@ViewBag.Title - My ASP.NET Application</title>
13-
@Styles.Render("~/Content/css")
14-
@Scripts.Render("~/bundles/modernizr")
15-
16-
@* Add the Kendo SASS Bootstrap theme: *@
17-
<link href="https://kendo.cdn.telerik.com/themes/{{ site.themesCdnVersion }}/bootstrap/bootstrap-main.css" rel="stylesheet" type="text/css" />
18-
</head>
9+
```HTML
10+
<head>
11+
<meta charset="utf-8" />
12+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
13+
<title>@ViewBag.Title - My ASP.NET Application</title>
14+
@Styles.Render("~/Content/css")
15+
@Scripts.Render("~/bundles/modernizr")
16+
17+
@* Add the Kendo SASS Bootstrap theme: *@
18+
<link href="https://kendo.cdn.telerik.com/themes/{{ site.themesCdnVersion }}/bootstrap/bootstrap-main.css" rel="stylesheet" type="text/css" />
19+
</head>
20+
```
1921

2022
1. In the `_Layout.cshtml` file, locate the `@Scripts.Render("~/bundles/jquery")` line in the `<body>` of the document and delete it. This jQuery script reference comes with the Microsoft ASP.NET Web Application template.
2123

2224
Removing this script is crucial because in the next step you add the jQuery script provided by Telerik. Having more than one script references causes errors.
2325

2426
1. Add the jQuery script to the `<head>` tag.
2527

26-
<head>
27-
...
28-
<link href="https://kendo.cdn.telerik.com/themes/{{ site.themesCdnVersion }}/bootstrap/bootstrap-main.css" rel="stylesheet" type="text/css" />
29-
30-
@* Add the jQuery script from the jQuery CDN: *@
31-
<script src="https://code.jquery.com/jquery-3.7.0.min.js"></script>
32-
</head>
33-
28+
```HTML
29+
<head>
30+
...
31+
<link href="https://kendo.cdn.telerik.com/themes/{{ site.themesCdnVersion }}/bootstrap/bootstrap-main.css" rel="stylesheet" type="text/css" />
32+
33+
@* Add the jQuery script from the jQuery CDN: *@
34+
<script src="https://code.jquery.com/jquery-3.7.0.min.js"></script>
35+
</head>
36+
```
3437
1. Add the Kendo UI scripts. The Kendo UI script files required by UI for ASP.NET MVC must be loaded in the `<head>` tag *after* the jQuery script.
3538

36-
<head>
37-
...
38-
<link href="https://kendo.cdn.telerik.com/themes/{{ site.themesCdnVersion }}/bootstrap/bootstrap-main.css" rel="stylesheet" type="text/css" />
39-
<script src="https://code.jquery.com/jquery-3.7.0.min.js"></script>
40-
41-
@* Add the Kendo UI scripts: *@
42-
<script src="https://unpkg.com/jszip/dist/jszip.min.js"></script>
43-
<script src="https://kendo.cdn.telerik.com/{{ site.mvcCoreVersion }}/js/kendo.all.min.js"></script>
44-
<script src="https://kendo.cdn.telerik.com/{{ site.mvcCoreVersion }}/js/kendo.aspnetmvc.min.js"></script>
45-
</head>
46-
39+
```HTML
40+
<head>
41+
...
42+
<link href="https://kendo.cdn.telerik.com/themes/{{ site.themesCdnVersion }}/bootstrap/bootstrap-main.css" rel="stylesheet" type="text/css" />
43+
<script src="https://code.jquery.com/jquery-3.7.0.min.js"></script>
44+
45+
@* Add the Kendo UI scripts: *@
46+
<script src="https://unpkg.com/jszip/dist/jszip.min.js"></script>
47+
<script src="https://kendo.cdn.telerik.com/{{ site.mvcCoreVersion }}/js/kendo.all.min.js"></script>
48+
<script src="https://kendo.cdn.telerik.com/{{ site.mvcCoreVersion }}/js/kendo.aspnetmvc.min.js"></script>
49+
</head>
50+
```
4751
1. Finally, add the `bootstrap.min.js` script available in Microsoft's ASP.NET Web Application template, and the `<head>` will look like this.
4852

49-
<head>
50-
<meta charset="utf-8" />
51-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
52-
<title>@ViewBag.Title - My Telerik MVC Application</title>
53-
@Styles.Render("~/Content/css")
54-
@Scripts.Render("~/bundles/modernizr")
55-
<link href="https://kendo.cdn.telerik.com/themes/{{ site.themesCdnVersion }}/bootstrap/bootstrap-main.css" rel="stylesheet" type="text/css" />
56-
<script src="https://code.jquery.com/jquery-3.7.0.min.js"></script>
57-
<script src="https://unpkg.com/jszip/dist/jszip.min.js"></script>
58-
<script src="https://kendo.cdn.telerik.com/{{ site.mvcCoreVersion }}/js/kendo.all.min.js"></script>
59-
<script src="https://kendo.cdn.telerik.com/{{ site.mvcCoreVersion }}/js/kendo.aspnetmvc.min.js"></script>
60-
61-
@* Add the bootstrap.min.js script: *@
62-
<script src="@Url.Content("~/Scripts/bootstrap.min.js")"></script>
63-
</head>
64-
53+
```HTML
54+
<head>
55+
<meta charset="utf-8" />
56+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
57+
<title>@ViewBag.Title - My Telerik MVC Application</title>
58+
@Styles.Render("~/Content/css")
59+
@Scripts.Render("~/bundles/modernizr")
60+
<link href="https://kendo.cdn.telerik.com/themes/{{ site.themesCdnVersion }}/bootstrap/bootstrap-main.css" rel="stylesheet" type="text/css" />
61+
<script src="https://code.jquery.com/jquery-3.7.0.min.js"></script>
62+
<script src="https://unpkg.com/jszip/dist/jszip.min.js"></script>
63+
<script src="https://kendo.cdn.telerik.com/{{ site.mvcCoreVersion }}/js/kendo.all.min.js"></script>
64+
<script src="https://kendo.cdn.telerik.com/{{ site.mvcCoreVersion }}/js/kendo.aspnetmvc.min.js"></script>
65+
66+
@* Add the bootstrap.min.js script: *@
67+
<script src="@Url.Content("~/Scripts/bootstrap.min.js")"></script>
68+
</head>
69+
```
6570
>Always observe the following rules when adding client-side resources to your project:
6671
> * Put the Kendo UI script files (`kendo.all.min.js` and `kendo.aspnetmvc.min.js`) after the `jquery.min.js` script.
6772
> * A jQuery script must be loaded only once. It must be placed only in the `<head>` tag of the `_Layout.cshtml` file. Make sure there are no duplicate jQuery references elsewhere in the `_Layout` file.

docs-aspnet/backwards-compatibility/2021-backwards-compatibility.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -51,7 +51,7 @@ Reverting to the previous appearance is possible by:
5151

5252
- setting the Search Panel as the last element in the toolbar
5353

54-
```
54+
```Razor
5555
.ToolBar(toolbar =>
5656
{
5757
toolbar.Excel();
@@ -62,7 +62,7 @@ Reverting to the previous appearance is possible by:
6262

6363
- utilizing the following styles:
6464

65-
```
65+
```CSS
6666
<style>
6767
.k-grid .k-grid-search {
6868
margin-left: auto;

docs-aspnet/backwards-compatibility/2023-backwards-compatibility.md

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ This article lists the breaking or important changes in the 2023 releases of {{
1414

1515
As of the 2023 R3 release, the font icons have been detached from the [Kendo UI Themes CDN]({% slug cdnservices_core %}) and have been extracted to a separate package. To continue using the font icons, reference the following stylesheet in your application:
1616

17-
```
17+
```HTML
1818
<link rel="stylesheet" href="https://unpkg.com/@progress/kendo-font-icons/dist/index.css" />
1919
```
2020

@@ -106,15 +106,15 @@ The component's value is wrapped within a `<span>` element annotated with the `.
106106
* The sorting icons will be replaced with their `.k-i-sort-asc-small` and `.k-i-sort-desc-small` general names instead of their `.k-i-sort-asc-sm` and `.k-i-sort-desc-sm` aliases.
107107
* The sorting icon is now wrapped in a `<span>` element:
108108

109-
```
109+
```HTML
110110
<span class="k-sort-icon">
111111
<span class="k-icon k-i-sort-asc-small"></span>
112112
</span>
113113
```
114114

115115
* The headings of the Grid are now updated with the new header [rendering](#unified-rendering):
116116

117-
```Versions-Before-2023.1.314
117+
```HTML Versions-Before-2023.1.314
118118
<!--- Default header cell --->
119119
<th class="k-header">
120120
<a class="k-link">
@@ -150,7 +150,7 @@ The component's value is wrapped within a `<span>` element annotated with the `.
150150
</a>
151151
</th>
152152
```
153-
```Versions-After-2023.1.314
153+
```HTML Versions-After-2023.1.314
154154
<!--- Default header cell --->
155155
<th class="k-header">
156156
<span class="k-cell-inner">
@@ -227,13 +227,13 @@ The CheckBox is wrapped in a `<span>` element annotated with the `.k-checkbox-wr
227227
* The `k-notification-wrap` class has also been removed.
228228
* The closable `<a class="k-icon k-i-close"></a>` notification icon is now replaced with a `<span>` element and the icon class `.k-i-close` name has been changed to `.k-i-x`.
229229

230-
```
230+
```HTML
231231
<span class="k-icon k-i-x">...</span>
232232
```
233233

234234
* A `.k-notification-actions` container added wrapping to the closable icon.
235235

236-
```
236+
```HTML
237237
<span class="k-notification-actions">
238238
<span class="k-notification-action k-notification-close-action">
239239
<span class="k-icon k-i-x">...</span>
@@ -250,13 +250,13 @@ The `.k-button-rectangle` class is now removed.
250250

251251
* The **Upload** button and input are no longer nested but are on the same level, wrapped inside a `<div>` element.
252252

253-
```Versions-Before-2023.1.314
253+
```HTML Versions-Before-2023.1.314
254254
<div class="k-button k-upload-button" aria-label="Select files...">
255255
<input name="files" id="upload-input">
256256
<span>Select files...</span>
257257
</div>
258258
```
259-
```Versions-After-2023.1.314
259+
```HTML Versions-After-2023.1.314
260260
<div class="k-upload-button-wrap">
261261
<label for="upload-input"> <!-->optional element<-->
262262
<button class="k-upload-button k-button k-button-md k-button-solid k-button-solid-base k-rounded-md">
@@ -325,7 +325,7 @@ The `.k-button-rectangle` class is now removed.
325325
* The `.k-dialog-buttongroup` and `.k-dialog-buttons` classes are now replaced with `.k-dialog-actions`.
326326
* A new `.k-dialog-{value}` theme color property has been added to the `.k-window` element. It supports the `primary`, `dark`, and `light` theme colors.
327327
328-
```
328+
```HTML
329329
<!-- Primary themeColor -->
330330
<div class="k-window k-dialog k-dialog-primary">...</div>
331331
@@ -369,7 +369,7 @@ As of the R1 2023 release, the `Load` method of the `Telerik.Web.PDF` assembly i
369369
370370
* The tools in the ToolBar are actual component instances instead of ToolBar items. As a result, the `click` and `toggle` event argument objects no longer hold a reference to the ToolBar item (`e.item`). From that release on, the component instance of the tool can be taken by using the `kendo.widgetInstance()` method. When rendered in the `OverflowMenu` or the popup of a DropDownButton or a SplitButton those tools are menu items. Hence, they are not Kendo UI controls. A reference to the jQuery elements is still available in those cases in the `e.target` event argument in the ToolBar's `Click` and `Toggle` event handlers.
371371
372-
```html
372+
```JavaScript
373373
<script>
374374
function onClick(e) {
375375
console.log("click:");

docs-aspnet/backwards-compatibility/2024-backwards-compatibility.md

Lines changed: 14 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -17,11 +17,11 @@ This article lists the breaking or important changes in the 2024 releases of {{
1717
For a while, the [CSS Utilities](https://www.telerik.com/design-system/docs/utils/get-started/introduction/) were bundled with the Kendo UI themes. Starting with version Q4 2024, the CSS Utilities are no longer included in the [Kendo UI themes]({% slug sassbasedthemes_overview %}).
1818
The Kendo UI theme stylesheet still contains all the necessary styles. However, in case you need to create an additional layout, dependent on the utility classes, you need to include the additional stylesheet `kendo-theme-utils.css`, which is available in the `styles` folder of the {{ site.product }} distribution and through the Kendo CDN service.
1919

20-
```LocalFiles
20+
```HTML LocalFiles
2121
<link rel="stylesheet" href="~/lib/kendo/styles/default-ocean-blue.css" />
2222
<link rel="stylesheet" href="~/lib/kendo/styles/kendo-theme-utils.css" />
2323
```
24-
```CDN
24+
```HTML CDN
2525
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/themes/{{ site.themesCdnVersion }}/default/default-ocean-blue.css" />
2626
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/themes/{{ site.themesCdnVersion }}/utils/all.css"/>
2727
```
@@ -343,21 +343,21 @@ As of the Q1 2024 release, the following APIs will be deprecated.
343343
{% if site.core %}
344344
* `ChartSeriesBuilder.Type(string)`
345345

346-
```Deprecated
346+
```Razor Deprecated
347347
.Series(series => series
348348
.Bar(new double[] { 3.907 })
349349
.Type("bar")
350350
)
351351
```
352-
```Alternative
352+
```Razor Alternative
353353
.Series(series => series
354354
.Bar(new double[] { 3.907 }) // Type is determined by the declared Series builder.
355355
)
356356
```
357357
358358
* `ChartSeriesLineSettingsBuilder.Width(string)`, `ChartSeriesLineSettingsBuilder.Style(ChartAreaStyle)`, `ChartSeriesLineSettingsBuilder.Style(ChartPolarAreaStyle)`, `ChartSeriesLineSettingsBuilder.Style(ChartRadarAreaStyle)`
359359
360-
```Deprecated
360+
```Razor Deprecated
361361
.Series(series => series
362362
.Bar(new double[] { 3.907 })
363363
.Line(line => line
@@ -368,7 +368,7 @@ As of the Q1 2024 release, the following APIs will be deprecated.
368368
)
369369
)
370370
```
371-
```Alternative
371+
```Razor Alternative
372372
.Series(series => series
373373
.Bar(new double[] { 3.907 })
374374
.Line(line => line
@@ -380,13 +380,13 @@ As of the Q1 2024 release, the following APIs will be deprecated.
380380
381381
* `ChartSeriesOverlaySettingsBuilder.Gradient`
382382
383-
```Deprecated
383+
```Razor Deprecated
384384
.Series(series => series
385385
.Bar(new double[] { 3.907 })
386386
.Overlay(overlay => overlay.Gradient(ChartBarGradient.Glass))
387387
)
388388
```
389-
```Alternative
389+
```Razor Alternative
390390
.Series(series => series
391391
.Bar(new double[] { 3.907 })
392392
.Overlay(overlay => overlay.Gradient(ChartSeriesGradient.Glass))
@@ -395,13 +395,13 @@ As of the Q1 2024 release, the following APIs will be deprecated.
395395
396396
* `SplitterEventBuilder.LayoutChange`
397397
398-
```Deprecated
398+
```Razor Deprecated
399399
.Events(events => events
400400
.LayoutChange("change")
401401
.LayoutChange(@<text>function () { return; }</text>)
402402
)
403403
```
404-
```Alternative
404+
```Razor Alternative
405405
.Events(events => events
406406
.Render("change")
407407
.Render(@<text>function () { return; }</text>)
@@ -413,26 +413,26 @@ As of the Q1 2024 release, the following APIs will be deprecated.
413413
414414
* `ChartSeriesBuilderBase.GroupNameTemplate`
415415
416-
```Deprecated
416+
```Razor Deprecated
417417
.Series(series => series.Bar(s => s.Sales)
418418
.Name("Sales")
419419
.GroupNameTemplate("#= series.name # for #= group.field # #= group.value #")
420420
)
421421
```
422-
```Alternative
422+
```Razor Alternative
423423
.Series(series => series.Bar(s => s.Sales)
424424
.Name("#= series.name # for #= group.field # #= group.value #")
425425
)
426426
```
427427
428428
* `EditorMessages.FormatBlock`, `EditorMessages.Styles`
429-
```Deprecated
429+
```Razor Deprecated
430430
.Messages(messages => messages
431431
.FormatBlock("Format")
432432
.Styles("Style")
433433
)
434434
```
435-
```Alternative
435+
```Razor Alternative
436436
.Messages(messages => messages
437437
.Formatting("Format")
438438
.Style("Style")

docs-aspnet/backwards-compatibility/2025-backwards-compatibility.md

Lines changed: 35 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,8 +10,42 @@ position: 1
1010

1111
This article lists the breaking or important changes in the 2025 releases of {{ site.product }}.
1212

13+
{% if site.core %}
14+
## {{ site.product }} Q2 2025
15+
16+
### PopOver
17+
18+
The [`IconClass()`](/api/kendo.mvc.ui.fluent/popoveractionbuilder#iconclasssystemstring) option of the PopOver HtmlHelper and the [`icon-class`](/api/kendo.mvc.taghelpers/popoveractiontaghelper#attributes) attribute of the PopOver TagHelper now expect a `string` instead of a JavaScript handler or a template delegate (`System.Func<Object,Object>`).
19+
20+
```HtmlHelper
21+
<span id="target">Hover</span>
22+
23+
@(Html.Kendo().Popover()
24+
.For("#target")
25+
.Body("Content description")
26+
.Actions(a =>
27+
{
28+
// "IconClass" adds a CSS class to the icon element inside the action button.
29+
a.Add().Text("refresh").Icon("arrow-rotate-cw").IconClass("refresh-icon");
30+
})
31+
)
32+
```
33+
```TagHelper
34+
@addTagHelper *, Kendo.Mvc
35+
36+
<span id="target">Hover</span>
37+
38+
<kendo-popover for="#target" body="Content description">
39+
<actions>
40+
<!-- "icon-class" adds a CSS class to the icon element inside the action button.-->
41+
<action text="refresh" icon="arrow-rotate-cw" icon-class="refresh-icon"></action>
42+
</actions>
43+
</kendo-popover>
44+
```
45+
{% endif %}
46+
1347
## {{ site.product }} Q1 2025
1448

1549
### License Activation
1650

17-
Starting with 2025 Q1, all users of {{ site.product }} will need to apply a valid license key file to both new and existing projects. For details, see our [Licensing Documentation]({% slug installation_license_key_aspnetcore %}).
51+
Starting with 2025 Q1, all users of {{ site.product }} will need to apply a valid license key file to both new and existing projects. For details, see our [Licensing Documentation]({% slug installation_license_key_aspnetcore %}).

docs-aspnet/cloud-integration/amazon-web-services/dynamodb.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@ Once you have a user with the necessary permissions, you can proceed with config
3333
1. Load the Amazon AWS SDK script.
3434
1. Configure the AWS authentication by passing the user details to the `AWS.config.update` method.
3535

36-
```
36+
```Razor
3737
<head>
3838
<meta charset="utf-8">
3939
<meta name="viewport" content="width=device-width, initial-scale=1">
@@ -61,7 +61,7 @@ Once you have a user with the necessary permissions, you can proceed with config
6161

6262
1. In the view, add a `<button>`, which you can use to create a table in DynamoDB on click.
6363

64-
```
64+
```Razor
6565
<button class="k-button" id="btn">Click to create a 'Movies' table</button>
6666
```
6767

@@ -70,7 +70,7 @@ Once you have a user with the necessary permissions, you can proceed with config
7070

7171
The declaration of the Grid and the view model it uses are shown in the example below.
7272

73-
```csharp
73+
```View
7474
@(Html.Kendo().Grid<GridDynamoDB.Models.MovieViewModel>()
7575
.Name("grid")
7676
.Columns(columns =>

0 commit comments

Comments
 (0)