@progress/kendo-angular-toolbar 24.0.0-develop.1 → 24.0.0-develop.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/NOTICE.txt +2599 -172
  2. package/codemods/{utils.js → libs/common/src/codemods/utils.js} +53 -30
  3. package/codemods/{v19 → libs/toolbar/codemods/v19}/toolbar-button-showicon.js +8 -30
  4. package/codemods/{v19 → libs/toolbar/codemods/v19}/toolbar-button-showtext.js +8 -30
  5. package/fesm2022/progress-kendo-angular-toolbar.mjs +72 -56
  6. package/package-metadata.mjs +2 -2
  7. package/package.json +11 -13
  8. package/toolbar.component.d.ts +9 -0
package/codemods/{utils.js → libs/common/src/codemods/utils.js} RENAMED
@@ -3,29 +3,6 @@
3
3
  * Licensed under commercial license. See LICENSE.md in the project root for more information
4
4
  *-------------------------------------------------------------------------------------------*/
5
5
  "use strict";
6
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
7
- if (k2 === undefined) k2 = k;
8
- var desc = Object.getOwnPropertyDescriptor(m, k);
9
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
10
- desc = { enumerable: true, get: function() { return m[k]; } };
11
- }
12
- Object.defineProperty(o, k2, desc);
13
- }) : (function(o, m, k, k2) {
14
- if (k2 === undefined) k2 = k;
15
- o[k2] = m[k];
16
- }));
17
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
18
- Object.defineProperty(o, "default", { enumerable: true, value: v });
19
- }) : function(o, v) {
20
- o["default"] = v;
21
- });
22
- var __importStar = (this && this.__importStar) || function (mod) {
23
- if (mod && mod.__esModule) return mod;
24
- var result = {};
25
- if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
26
- __setModuleDefault(result, mod);
27
- return result;
28
- };
29
6
  Object.defineProperty(exports, "__esModule", { value: true });
30
7
  exports.tsInterfaceTransformer = exports.tsPropertyValueTransformer = exports.tsPropertyTransformer = exports.tsComponentPropertyRemoval = exports.attributeRemoval = exports.attributeValueUpdate = exports.attributeNameValueUpdate = exports.attributeNameUpdate = exports.eventUpdate = exports.htmlTransformer = exports.blockTextElements = void 0;
31
8
  exports.hasKendoInTemplate = hasKendoInTemplate;
@@ -35,8 +12,12 @@ exports.makePattern = makePattern;
35
12
  exports.writeInstructionMarker = writeInstructionMarker;
36
13
  exports.isApiChangeTarget = isApiChangeTarget;
37
14
  exports.isRenderingChangeTarget = isRenderingChangeTarget;
38
- const fs = __importStar(require("node:fs"));
39
- const path = __importStar(require("node:path"));
15
+ exports.executeCodemodTest = executeCodemodTest;
16
+ const tslib_1 = require("tslib");
17
+ /// <reference types="node" />
18
+ const fs = tslib_1.__importStar(require("fs"));
19
+ const os = tslib_1.__importStar(require("os"));
20
+ const path = tslib_1.__importStar(require("path"));
40
21
  exports.blockTextElements = {
41
22
  script: true,
42
23
  noscript: true,
@@ -320,12 +301,12 @@ const attributeRemoval = (templateContent, tagName, attributeName, propertyToRem
320
301
  // If no propertyToRemove is specified, remove the entire attribute
321
302
  if (!propertyToRemove) {
322
303
  // Remove bound attributes [attribute]="value"
323
- const boundAttributePattern = new RegExp(`(\\s+)\\[${escapedAttr}\\]\\s*=\\s*("(?:[^"\\\\]|\\\\.)*?"|'(?:[^'\\\\]|\\\\.)*?'|[^\\s>]+)`, 'gi');
304
+ const boundAttributePattern = new RegExp(`(<${escapedTag}[^>]*?)\\s+\\[${escapedAttr}\\]\\s*=\\s*("(?:[^"\\\\]|\\\\.)*?"|'(?:[^'\\\\]|\\\\.)*?'|[^\\s>]+)([^>]*?>)`, 'gi');
324
305
  // Remove static attributes attribute="value"
325
- const staticAttributePattern = new RegExp(`(\\s+)${escapedAttr}\\s*=\\s*("(?:[^"\\\\]|\\\\.)*?"|'(?:[^'\\\\]|\\\\.)*?'|[^\\s>]+)`, 'gi');
326
- // Apply removals
327
- let result = templateContent.replace(boundAttributePattern, '');
328
- result = result.replace(staticAttributePattern, '');
306
+ const staticAttributePattern = new RegExp(`(<${escapedTag}[^>]*?)\\s+${escapedAttr}\\s*=\\s*("(?:[^"\\\\]|\\\\.)*?"|'(?:[^'\\\\]|\\\\.)*?'|[^\\s>]+)([^>]*?>)`, 'gi');
307
+ // Apply removals - keep tag prefix and suffix, remove the attribute
308
+ let result = templateContent.replace(boundAttributePattern, '$1$3');
309
+ result = result.replace(staticAttributePattern, '$1$3');
329
310
  return result;
330
311
  }
331
312
  // Remove specific property from object literal attributes
@@ -1428,3 +1409,45 @@ function isRenderingChangeTarget(filePath) {
1428
1409
  const ext = path.extname(filePath);
1429
1410
  return ext === '.ts' || ext === '.html' || ext === '.css' || ext === '.scss' || ext === '.sass' || ext === '.less';
1430
1411
  }
1412
+ /**
1413
+ * Executes a codemod transformation and compares the result with expected output
1414
+ *
1415
+ * @param codemod - The codemod function to execute
1416
+ * @param testDir - Directory containing the test files (__dirname from test file)
1417
+ * @param exampleFileName - Name of the input file (default: 'example.ts')
1418
+ * @param expectedFileName - Name of the expected output file (default: 'expected.ts')
1419
+ * @returns Object containing the transformation result and expected content
1420
+ */
1421
+ function executeCodemodTest(codemod, testDir, exampleFileName = 'example.ts', expectedFileName = 'expected.ts') {
1422
+ const exampleFile = path.join(testDir, exampleFileName);
1423
+ const expectedFile = path.join(testDir, expectedFileName);
1424
+ const sourceCode = fs.readFileSync(exampleFile, 'utf-8');
1425
+ const tmpDir = fs.mkdtempSync(path.join(os.tmpdir(), 'codemod-test-'));
1426
+ const tmpFile = path.join(tmpDir, path.basename(exampleFile));
1427
+ fs.writeFileSync(tmpFile, sourceCode, 'utf-8');
1428
+ try {
1429
+ const fileInfo = {
1430
+ path: tmpFile,
1431
+ source: sourceCode
1432
+ };
1433
+ const jscodeshift = require('jscodeshift').withParser('tsx');
1434
+ const api = {
1435
+ jscodeshift,
1436
+ j: jscodeshift
1437
+ };
1438
+ const result = codemod(fileInfo, api);
1439
+ const expectedContent = fs.readFileSync(expectedFile, 'utf-8').trim();
1440
+ return {
1441
+ result: result?.trim(),
1442
+ expected: expectedContent,
1443
+ sourceCode,
1444
+ transformedSuccessfully: result !== undefined
1445
+ };
1446
+ }
1447
+ finally {
1448
+ try {
1449
+ fs.rmSync(tmpDir, { recursive: true });
1450
+ }
1451
+ catch { }
1452
+ }
1453
+ }
package/codemods/{v19 → libs/toolbar/codemods/v19}/toolbar-button-showicon.js RENAMED
@@ -3,40 +3,18 @@
3
3
  * Licensed under commercial license. See LICENSE.md in the project root for more information
4
4
  *-------------------------------------------------------------------------------------------*/
5
5
  "use strict";
6
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
7
- if (k2 === undefined) k2 = k;
8
- var desc = Object.getOwnPropertyDescriptor(m, k);
9
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
10
- desc = { enumerable: true, get: function() { return m[k]; } };
11
- }
12
- Object.defineProperty(o, k2, desc);
13
- }) : (function(o, m, k, k2) {
14
- if (k2 === undefined) k2 = k;
15
- o[k2] = m[k];
16
- }));
17
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
18
- Object.defineProperty(o, "default", { enumerable: true, value: v });
19
- }) : function(o, v) {
20
- o["default"] = v;
21
- });
22
- var __importStar = (this && this.__importStar) || function (mod) {
23
- if (mod && mod.__esModule) return mod;
24
- var result = {};
25
- if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
26
- __setModuleDefault(result, mod);
27
- return result;
28
- };
29
6
  Object.defineProperty(exports, "__esModule", { value: true });
30
7
  exports.aiInstructions = void 0;
31
8
  exports.default = default_1;
32
- const utils_1 = require("../utils");
33
- const fs = __importStar(require("fs"));
9
+ const tslib_1 = require("tslib");
10
+ const codemods_1 = require("@progress/kendo-angular-common/codemods");
11
+ const fs = tslib_1.__importStar(require("fs"));
34
12
  function default_1(fileInfo, api) {
35
13
  const filePath = fileInfo.path;
36
14
  // Handle HTML files and inline templates
37
- const htmlResult = (0, utils_1.htmlTransformer)(fileInfo, api, (templateContent) => {
38
- let result = (0, utils_1.attributeValueUpdate)(templateContent, 'kendo-toolbar-button', 'showIcon', 'overflow', 'menu');
39
- result = (0, utils_1.attributeValueUpdate)(result, 'kendo-toolbar-button', 'showIcon', 'both', 'always');
15
+ const htmlResult = (0, codemods_1.htmlTransformer)(fileInfo, api, (templateContent) => {
16
+ let result = (0, codemods_1.attributeValueUpdate)(templateContent, 'kendo-toolbar-button', 'showIcon', 'overflow', 'menu');
17
+ result = (0, codemods_1.attributeValueUpdate)(result, 'kendo-toolbar-button', 'showIcon', 'both', 'always');
40
18
  return result;
41
19
  });
42
20
  if (filePath.endsWith('.html')) {
@@ -49,8 +27,8 @@ function default_1(fileInfo, api) {
49
27
  // Handle TypeScript property transformations
50
28
  const j = api.jscodeshift;
51
29
  const rootSource = j(htmlResult || fileInfo.source);
52
- (0, utils_1.tsPropertyValueTransformer)(fileInfo.source, rootSource, j, '@progress/kendo-angular-toolbar', 'DisplayMode', 'overflow', 'menu');
53
- (0, utils_1.tsPropertyValueTransformer)(fileInfo.source, rootSource, j, '@progress/kendo-angular-toolbar', 'DisplayMode', 'both', 'always');
30
+ (0, codemods_1.tsPropertyValueTransformer)(fileInfo.source, rootSource, j, '@progress/kendo-angular-toolbar', 'DisplayMode', 'overflow', 'menu');
31
+ (0, codemods_1.tsPropertyValueTransformer)(fileInfo.source, rootSource, j, '@progress/kendo-angular-toolbar', 'DisplayMode', 'both', 'always');
54
32
  return rootSource.toSource({ quote: 'single' });
55
33
  }
56
34
  exports.aiInstructions = `The 'showIcon' property on 'kendo-toolbar-button' has changed accepted values: 'overflow' is now 'menu', and 'both' is now 'always'.
package/codemods/{v19 → libs/toolbar/codemods/v19}/toolbar-button-showtext.js RENAMED
@@ -3,40 +3,18 @@
3
3
  * Licensed under commercial license. See LICENSE.md in the project root for more information
4
4
  *-------------------------------------------------------------------------------------------*/
5
5
  "use strict";
6
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
7
- if (k2 === undefined) k2 = k;
8
- var desc = Object.getOwnPropertyDescriptor(m, k);
9
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
10
- desc = { enumerable: true, get: function() { return m[k]; } };
11
- }
12
- Object.defineProperty(o, k2, desc);
13
- }) : (function(o, m, k, k2) {
14
- if (k2 === undefined) k2 = k;
15
- o[k2] = m[k];
16
- }));
17
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
18
- Object.defineProperty(o, "default", { enumerable: true, value: v });
19
- }) : function(o, v) {
20
- o["default"] = v;
21
- });
22
- var __importStar = (this && this.__importStar) || function (mod) {
23
- if (mod && mod.__esModule) return mod;
24
- var result = {};
25
- if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
26
- __setModuleDefault(result, mod);
27
- return result;
28
- };
29
6
  Object.defineProperty(exports, "__esModule", { value: true });
30
7
  exports.aiInstructions = void 0;
31
8
  exports.default = default_1;
32
- const utils_1 = require("../utils");
33
- const fs = __importStar(require("fs"));
9
+ const tslib_1 = require("tslib");
10
+ const codemods_1 = require("@progress/kendo-angular-common/codemods");
11
+ const fs = tslib_1.__importStar(require("fs"));
34
12
  function default_1(fileInfo, api) {
35
13
  const filePath = fileInfo.path;
36
14
  // Handle HTML files and inline templates
37
- const htmlResult = (0, utils_1.htmlTransformer)(fileInfo, api, (templateContent) => {
38
- let result = (0, utils_1.attributeValueUpdate)(templateContent, 'kendo-toolbar-button', 'showText', 'overflow', 'menu');
39
- result = (0, utils_1.attributeValueUpdate)(result, 'kendo-toolbar-button', 'showText', 'both', 'always');
15
+ const htmlResult = (0, codemods_1.htmlTransformer)(fileInfo, api, (templateContent) => {
16
+ let result = (0, codemods_1.attributeValueUpdate)(templateContent, 'kendo-toolbar-button', 'showText', 'overflow', 'menu');
17
+ result = (0, codemods_1.attributeValueUpdate)(result, 'kendo-toolbar-button', 'showText', 'both', 'always');
40
18
  return result;
41
19
  });
42
20
  if (filePath.endsWith('.html')) {
@@ -49,8 +27,8 @@ function default_1(fileInfo, api) {
49
27
  // Handle TypeScript property transformations
50
28
  const j = api.jscodeshift;
51
29
  const rootSource = j(htmlResult || fileInfo.source);
52
- (0, utils_1.tsPropertyValueTransformer)(fileInfo.source, rootSource, j, '@progress/kendo-angular-toolbar', 'DisplayMode', 'overflow', 'menu');
53
- (0, utils_1.tsPropertyValueTransformer)(fileInfo.source, rootSource, j, '@progress/kendo-angular-toolbar', 'DisplayMode', 'both', 'always');
30
+ (0, codemods_1.tsPropertyValueTransformer)(fileInfo.source, rootSource, j, '@progress/kendo-angular-toolbar', 'DisplayMode', 'overflow', 'menu');
31
+ (0, codemods_1.tsPropertyValueTransformer)(fileInfo.source, rootSource, j, '@progress/kendo-angular-toolbar', 'DisplayMode', 'both', 'always');
54
32
  return rootSource.toSource({ quote: 'single' });
55
33
  }
56
34
  exports.aiInstructions = `The 'showText' property on 'kendo-toolbar-button' has changed accepted values: 'overflow' is now 'menu', and 'both' is now 'always'.
package/fesm2022/progress-kendo-angular-toolbar.mjs CHANGED
@@ -6,7 +6,7 @@ import * as i0 from '@angular/core';
6
6
  import { EventEmitter, Injectable, inject, ElementRef, Input, ViewChild, Directive, Output, forwardRef, HostBinding, Component, ViewContainerRef, HostListener, ContentChildren, isDevMode, ViewChildren, NgModule } from '@angular/core';
7
7
  import * as i2 from '@progress/kendo-angular-popup';
8
8
  import { PopupService } from '@progress/kendo-angular-popup';
9
- import { normalizeKeys, Keys, isPresent as isPresent$1, isDocumentAvailable, guid, parseCSSClassNames, ResizeSensorComponent, ResizeBatchService } from '@progress/kendo-angular-common';
9
+ import { normalizeKeys, Keys, isPresent as isPresent$1, isDocumentAvailable, getLicenseMessage, shouldShowValidationUI, guid, parseCSSClassNames, ResizeSensorComponent, WatermarkOverlayComponent, ResizeBatchService } from '@progress/kendo-angular-common';
10
10
  import * as i1 from '@progress/kendo-angular-l10n';
11
11
  import { ComponentMessages, LocalizationService, L10N_PREFIX } from '@progress/kendo-angular-l10n';
12
12
  import { validatePackage } from '@progress/kendo-licensing';
@@ -26,8 +26,8 @@ const packageMetadata = {
26
26
  productName: 'Kendo UI for Angular',
27
27
  productCode: 'KENDOUIANGULAR',
28
28
  productCodes: ['KENDOUIANGULAR'],
29
- publishDate: 1776779013,
30
- version: '24.0.0-develop.1',
29
+ publishDate: 1777399592,
30
+ version: '24.0.0-develop.11',
31
31
  licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
32
32
  };
33
33
 
@@ -1435,6 +1435,14 @@ class ToolBarComponent {
1435
1435
  get resizableClass() {
1436
1436
  return this.resizable;
1437
1437
  }
1438
+ /**
1439
+ * @hidden
1440
+ */
1441
+ showLicenseWatermark = false;
1442
+ /**
1443
+ * @hidden
1444
+ */
1445
+ licenseMessage;
1438
1446
  constructor(localization, popupService, refreshService, navigationService,
1439
1447
  // Needs to be public as it is being accessed in the Editor component
1440
1448
  element, zone, renderer, _cdr, toolsService, scrollService) {
@@ -1448,7 +1456,9 @@ class ToolBarComponent {
1448
1456
  this._cdr = _cdr;
1449
1457
  this.toolsService = toolsService;
1450
1458
  this.scrollService = scrollService;
1451
- validatePackage(packageMetadata);
1459
+ const isValid = validatePackage(packageMetadata);
1460
+ this.licenseMessage = getLicenseMessage(packageMetadata);
1461
+ this.showLicenseWatermark = shouldShowValidationUI(isValid);
1452
1462
  this.direction = localization.rtl ? 'rtl' : 'ltr';
1453
1463
  this.scrollService.owner = this;
1454
1464
  }
@@ -2179,36 +2189,36 @@ class ToolBarComponent {
2179
2189
  @if (isScrollMode) {
2180
2190
  <div class="k-toolbar-items k-toolbar-items-scroll" tabindex="-1" #scrollContainer>
2181
2191
  @for (tool of allTools; track tool; let index = $index) {
2192
+ <ng-template #wrapper>
2193
+ <div class="k-toolbar-item">
2194
+ <ng-container [ngTemplateOutlet]="tool.toolbarTemplate"></ng-container>
2195
+ </div>
2196
+ </ng-template>
2182
2197
  <ng-container
2183
- kendoToolbarRenderer
2184
- [tool]="tool"
2185
- location="toolbar"
2186
- [resizable]="resizable"
2187
- (rendererClick)="onRendererClick($event)"
2188
- [ngTemplateOutlet]="tool.isBuiltInTool ? tool.toolbarTemplate : wrapper">
2189
- <ng-template #wrapper>
2190
- <div class="k-toolbar-item">
2191
- <ng-container [ngTemplateOutlet]="tool.toolbarTemplate"></ng-container>
2192
- </div>
2193
- </ng-template>
2194
- </ng-container>
2195
- }
2196
- </div>
2198
+ kendoToolbarRenderer
2199
+ [tool]="tool"
2200
+ location="toolbar"
2201
+ [resizable]="resizable"
2202
+ (rendererClick)="onRendererClick($event)"
2203
+ [ngTemplateOutlet]="tool.isBuiltInTool ? tool.toolbarTemplate : wrapper">
2204
+ </ng-container>
2205
+ }
2206
+ </div>
2197
2207
  } @else {
2198
2208
  @for (tool of allTools; track tool; let index = $index) {
2199
- <ng-container
2200
- kendoToolbarRenderer
2201
- [tool]="tool"
2202
- location="toolbar"
2203
- [resizable]="resizable"
2204
- (rendererClick)="onRendererClick($event)"
2205
- [ngTemplateOutlet]="tool.isBuiltInTool ? tool.toolbarTemplate : wrapper">
2206
2209
  <ng-template #wrapper>
2207
2210
  <div class="k-toolbar-item">
2208
2211
  <ng-container [ngTemplateOutlet]="tool.toolbarTemplate"></ng-container>
2209
2212
  </div>
2210
2213
  </ng-template>
2211
- </ng-container>
2214
+ <ng-container
2215
+ kendoToolbarRenderer
2216
+ [tool]="tool"
2217
+ location="toolbar"
2218
+ [resizable]="resizable"
2219
+ (rendererClick)="onRendererClick($event)"
2220
+ [ngTemplateOutlet]="tool.isBuiltInTool ? tool.toolbarTemplate : wrapper">
2221
+ </ng-container>
2212
2222
  }
2213
2223
  }
2214
2224
  @if (showOverflowSeparator) {
@@ -2317,6 +2327,9 @@ class ToolBarComponent {
2317
2327
  [attr.dir]="direction === 'rtl' ? 'rtl' : null"
2318
2328
  [attr.aria-labelledby]="overflowBtnId">
2319
2329
  @for (tool of overflowTools; track tool; let index = $index) {
2330
+ <ng-template #wrapper>
2331
+ <ng-container [ngTemplateOutlet]="tool.sectionTemplate"></ng-container>
2332
+ </ng-template>
2320
2333
  <ng-container
2321
2334
  kendoToolbarRenderer
2322
2335
  [tool]="tool"
@@ -2324,9 +2337,6 @@ class ToolBarComponent {
2324
2337
  [resizable]="resizable"
2325
2338
  (rendererClick)="onRendererClick($event)"
2326
2339
  [ngTemplateOutlet]="tool.isBuiltInTool ? tool.sectionTemplate : wrapper">
2327
- <ng-template #wrapper>
2328
- <ng-container [ngTemplateOutlet]="tool.sectionTemplate"></ng-container>
2329
- </ng-template>
2330
2340
  </ng-container>
2331
2341
  }
2332
2342
  </span>
@@ -2335,7 +2345,10 @@ class ToolBarComponent {
2335
2345
  @if (overflowEnabled) {
2336
2346
  <kendo-resize-sensor #resizeSensor></kendo-resize-sensor>
2337
2347
  }
2338
- `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: LocalizedToolbarMessagesDirective, selector: "[kendoToolbarLocalizedMessages]" }, { kind: "directive", type: ToolBarRendererComponent, selector: "[kendoToolbarRenderer]", inputs: ["tool", "location", "resizable"], outputs: ["rendererClick"] }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }, { kind: "component", type: ToolbarScrollableButtonComponent, selector: "[kendoToolbarScrollableButton]", inputs: ["prev", "overflow"], outputs: ["onClick"] }] });
2348
+ @if (showLicenseWatermark) {
2349
+ <div kendoWatermarkOverlay [licenseMessage]="licenseMessage"></div>
2350
+ }
2351
+ `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: LocalizedToolbarMessagesDirective, selector: "[kendoToolbarLocalizedMessages]" }, { kind: "directive", type: ToolBarRendererComponent, selector: "[kendoToolbarRenderer]", inputs: ["tool", "location", "resizable"], outputs: ["rendererClick"] }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }, { kind: "component", type: ToolbarScrollableButtonComponent, selector: "[kendoToolbarScrollableButton]", inputs: ["prev", "overflow"], outputs: ["onClick"] }, { kind: "component", type: WatermarkOverlayComponent, selector: "div[kendoWatermarkOverlay], kendo-watermark-overlay", inputs: ["licenseMessage"] }] });
2339
2352
  }
2340
2353
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ToolBarComponent, decorators: [{
2341
2354
  type: Component,
@@ -2416,36 +2429,36 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
2416
2429
  @if (isScrollMode) {
2417
2430
  <div class="k-toolbar-items k-toolbar-items-scroll" tabindex="-1" #scrollContainer>
2418
2431
  @for (tool of allTools; track tool; let index = $index) {
2432
+ <ng-template #wrapper>
2433
+ <div class="k-toolbar-item">
2434
+ <ng-container [ngTemplateOutlet]="tool.toolbarTemplate"></ng-container>
2435
+ </div>
2436
+ </ng-template>
2419
2437
  <ng-container
2420
- kendoToolbarRenderer
2421
- [tool]="tool"
2422
- location="toolbar"
2423
- [resizable]="resizable"
2424
- (rendererClick)="onRendererClick($event)"
2425
- [ngTemplateOutlet]="tool.isBuiltInTool ? tool.toolbarTemplate : wrapper">
2426
- <ng-template #wrapper>
2427
- <div class="k-toolbar-item">
2428
- <ng-container [ngTemplateOutlet]="tool.toolbarTemplate"></ng-container>
2429
- </div>
2430
- </ng-template>
2431
- </ng-container>
2432
- }
2433
- </div>
2438
+ kendoToolbarRenderer
2439
+ [tool]="tool"
2440
+ location="toolbar"
2441
+ [resizable]="resizable"
2442
+ (rendererClick)="onRendererClick($event)"
2443
+ [ngTemplateOutlet]="tool.isBuiltInTool ? tool.toolbarTemplate : wrapper">
2444
+ </ng-container>
2445
+ }
2446
+ </div>
2434
2447
  } @else {
2435
2448
  @for (tool of allTools; track tool; let index = $index) {
2436
- <ng-container
2437
- kendoToolbarRenderer
2438
- [tool]="tool"
2439
- location="toolbar"
2440
- [resizable]="resizable"
2441
- (rendererClick)="onRendererClick($event)"
2442
- [ngTemplateOutlet]="tool.isBuiltInTool ? tool.toolbarTemplate : wrapper">
2443
2449
  <ng-template #wrapper>
2444
2450
  <div class="k-toolbar-item">
2445
2451
  <ng-container [ngTemplateOutlet]="tool.toolbarTemplate"></ng-container>
2446
2452
  </div>
2447
2453
  </ng-template>
2448
- </ng-container>
2454
+ <ng-container
2455
+ kendoToolbarRenderer
2456
+ [tool]="tool"
2457
+ location="toolbar"
2458
+ [resizable]="resizable"
2459
+ (rendererClick)="onRendererClick($event)"
2460
+ [ngTemplateOutlet]="tool.isBuiltInTool ? tool.toolbarTemplate : wrapper">
2461
+ </ng-container>
2449
2462
  }
2450
2463
  }
2451
2464
  @if (showOverflowSeparator) {
@@ -2554,6 +2567,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
2554
2567
  [attr.dir]="direction === 'rtl' ? 'rtl' : null"
2555
2568
  [attr.aria-labelledby]="overflowBtnId">
2556
2569
  @for (tool of overflowTools; track tool; let index = $index) {
2570
+ <ng-template #wrapper>
2571
+ <ng-container [ngTemplateOutlet]="tool.sectionTemplate"></ng-container>
2572
+ </ng-template>
2557
2573
  <ng-container
2558
2574
  kendoToolbarRenderer
2559
2575
  [tool]="tool"
@@ -2561,9 +2577,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
2561
2577
  [resizable]="resizable"
2562
2578
  (rendererClick)="onRendererClick($event)"
2563
2579
  [ngTemplateOutlet]="tool.isBuiltInTool ? tool.sectionTemplate : wrapper">
2564
- <ng-template #wrapper>
2565
- <ng-container [ngTemplateOutlet]="tool.sectionTemplate"></ng-container>
2566
- </ng-template>
2567
2580
  </ng-container>
2568
2581
  }
2569
2582
  </span>
@@ -2572,9 +2585,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
2572
2585
  @if (overflowEnabled) {
2573
2586
  <kendo-resize-sensor #resizeSensor></kendo-resize-sensor>
2574
2587
  }
2588
+ @if (showLicenseWatermark) {
2589
+ <div kendoWatermarkOverlay [licenseMessage]="licenseMessage"></div>
2590
+ }
2575
2591
  `,
2576
2592
  standalone: true,
2577
- imports: [NgTemplateOutlet, LocalizedToolbarMessagesDirective, ToolBarRendererComponent, ButtonComponent, NgClass, ResizeSensorComponent, ToolbarScrollableButtonComponent]
2593
+ imports: [NgTemplateOutlet, LocalizedToolbarMessagesDirective, ToolBarRendererComponent, ButtonComponent, NgClass, ResizeSensorComponent, ToolbarScrollableButtonComponent, WatermarkOverlayComponent]
2578
2594
  }]
2579
2595
  }], ctorParameters: () => [{ type: i1.LocalizationService }, { type: i2.PopupService }, { type: RefreshService }, { type: NavigationService }, { type: i0.ElementRef }, { type: i0.NgZone }, { type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }, { type: ToolbarToolsService }, { type: ScrollService }], propDecorators: { overflow: [{
2580
2596
  type: Input
package/package-metadata.mjs CHANGED
@@ -7,7 +7,7 @@ export const packageMetadata = {
7
7
  "productCodes": [
8
8
  "KENDOUIANGULAR"
9
9
  ],
10
- "publishDate": 1776779013,
11
- "version": "24.0.0-develop.1",
10
+ "publishDate": 1777399592,
11
+ "version": "24.0.0-develop.11",
12
12
  "licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/"
13
13
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@progress/kendo-angular-toolbar",
3
- "version": "24.0.0-develop.1",
3
+ "version": "24.0.0-develop.11",
4
4
  "description": "Kendo UI Angular Toolbar component - a single UI element that organizes buttons and other navigation elements",
5
5
  "license": "SEE LICENSE IN LICENSE.md",
6
6
  "author": "Progress",
@@ -31,13 +31,11 @@
31
31
  "19": [
32
32
  {
33
33
  "description": "Migrate showIcon's overflow value to menu and both value to always",
34
- "file": "codemods/v19/toolbar-button-showicon.js",
35
- "prompt": "false"
34
+ "file": "codemods/v19/toolbar-button-showicon.js"
36
35
  },
37
36
  {
38
37
  "description": "Migrate showText's overflow value to menu and both value to always",
39
- "file": "codemods/v19/toolbar-button-showtext.js",
40
- "prompt": "false"
38
+ "file": "codemods/v19/toolbar-button-showtext.js"
41
39
  }
42
40
  ]
43
41
  }
@@ -45,7 +43,7 @@
45
43
  "package": {
46
44
  "productName": "Kendo UI for Angular",
47
45
  "productCode": "KENDOUIANGULAR",
48
- "publishDate": 1776779013,
46
+ "publishDate": 1777399592,
49
47
  "licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/"
50
48
  }
51
49
  },
@@ -55,17 +53,17 @@
55
53
  "@angular/core": "19 - 21",
56
54
  "@angular/platform-browser": "19 - 21",
57
55
  "@progress/kendo-licensing": "^1.11.0",
58
- "@progress/kendo-angular-buttons": "24.0.0-develop.1",
59
- "@progress/kendo-angular-common": "24.0.0-develop.1",
60
- "@progress/kendo-angular-l10n": "24.0.0-develop.1",
61
- "@progress/kendo-angular-icons": "24.0.0-develop.1",
62
- "@progress/kendo-angular-indicators": "24.0.0-develop.1",
63
- "@progress/kendo-angular-popup": "24.0.0-develop.1",
56
+ "@progress/kendo-angular-buttons": "24.0.0-develop.11",
57
+ "@progress/kendo-angular-common": "24.0.0-develop.11",
58
+ "@progress/kendo-angular-l10n": "24.0.0-develop.11",
59
+ "@progress/kendo-angular-icons": "24.0.0-develop.11",
60
+ "@progress/kendo-angular-indicators": "24.0.0-develop.11",
61
+ "@progress/kendo-angular-popup": "24.0.0-develop.11",
64
62
  "rxjs": "^6.5.3 || ^7.0.0"
65
63
  },
66
64
  "dependencies": {
67
65
  "tslib": "^2.3.1",
68
- "@progress/kendo-angular-schematics": "24.0.0-develop.1"
66
+ "@progress/kendo-angular-schematics": "24.0.0-develop.11"
69
67
  },
70
68
  "schematics": "./schematics/collection.json",
71
69
  "module": "fesm2022/progress-kendo-angular-toolbar.mjs",
package/toolbar.component.d.ts CHANGED
@@ -6,6 +6,7 @@ import { TemplateRef, ElementRef, QueryList, EventEmitter, ViewContainerRef, NgZ
6
6
  import { PopupService, PopupRef } from '@progress/kendo-angular-popup';
7
7
  import { ResizeSensorComponent } from '@progress/kendo-angular-common';
8
8
  import { LocalizationService } from '@progress/kendo-angular-l10n';
9
+ import { LicenseMessage } from '@progress/kendo-licensing';
9
10
  import { RefreshService } from './refresh.service';
10
11
  import { NavigationService } from './navigation.service';
11
12
  import { PopupSettings } from './popup-settings';
@@ -216,6 +217,14 @@ export declare class ToolBarComponent {
216
217
  role: string;
217
218
  get getDir(): string;
218
219
  get resizableClass(): boolean;
220
+ /**
221
+ * @hidden
222
+ */
223
+ showLicenseWatermark: boolean;
224
+ /**
225
+ * @hidden
226
+ */
227
+ licenseMessage?: LicenseMessage;
219
228
  constructor(localization: LocalizationService, popupService: PopupService, refreshService: RefreshService, navigationService: NavigationService, element: ElementRef, zone: NgZone, renderer: Renderer2, _cdr: ChangeDetectorRef, toolsService: ToolbarToolsService, scrollService: ScrollService);
220
229
  ngAfterContentInit(): void;
221
230
  ngAfterViewInit(): void;