@progress/kendo-angular-buttons 21.4.1-develop.1 → 22.0.0-develop.1

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 (73) hide show
  1. package/fesm2022/progress-kendo-angular-buttons.mjs +105 -105
  2. package/listbutton/list-button.d.ts +1 -1
  3. package/package.json +11 -19
  4. package/splitbutton/localization/messages.d.ts +1 -1
  5. package/esm2022/button/button-settings.mjs +0 -5
  6. package/esm2022/button/button.component.mjs +0 -558
  7. package/esm2022/button/button.module.mjs +0 -43
  8. package/esm2022/button/button.service.mjs +0 -22
  9. package/esm2022/button/selection-settings.mjs +0 -5
  10. package/esm2022/buttongroup/buttongroup.component.mjs +0 -340
  11. package/esm2022/buttongroup/buttongroup.module.mjs +0 -49
  12. package/esm2022/buttons.module.mjs +0 -58
  13. package/esm2022/chip/chip-content-click-event-args.interface.mjs +0 -5
  14. package/esm2022/chip/chip-list-remove-event-args.interface.mjs +0 -5
  15. package/esm2022/chip/chip-list.component.mjs +0 -360
  16. package/esm2022/chip/chip-remove-event-args.interface.mjs +0 -5
  17. package/esm2022/chip/chip.component.mjs +0 -585
  18. package/esm2022/chip/chip.module.mjs +0 -45
  19. package/esm2022/chip/models/avatar-settings.interface.mjs +0 -5
  20. package/esm2022/chip/models/selection.mjs +0 -5
  21. package/esm2022/common/models/arrow-settings.mjs +0 -5
  22. package/esm2022/common/models/fillmode.mjs +0 -5
  23. package/esm2022/common/models/rounded.mjs +0 -5
  24. package/esm2022/common/models/size.mjs +0 -5
  25. package/esm2022/common/models/styling-classes.mjs +0 -5
  26. package/esm2022/common/models/theme-color.mjs +0 -5
  27. package/esm2022/common/models.mjs +0 -10
  28. package/esm2022/direction.mjs +0 -5
  29. package/esm2022/directives.mjs +0 -176
  30. package/esm2022/dropdownbutton/dropdownbutton.component.mjs +0 -482
  31. package/esm2022/dropdownbutton/dropdownbutton.module.mjs +0 -50
  32. package/esm2022/floatingactionbutton/animations/animations.mjs +0 -33
  33. package/esm2022/floatingactionbutton/dial-item.component.mjs +0 -161
  34. package/esm2022/floatingactionbutton/dial-list.component.mjs +0 -98
  35. package/esm2022/floatingactionbutton/floatingactionbutton.component.mjs +0 -954
  36. package/esm2022/floatingactionbutton/floatingactionbutton.module.mjs +0 -47
  37. package/esm2022/floatingactionbutton/models/align.mjs +0 -5
  38. package/esm2022/floatingactionbutton/models/item-animation.interface.mjs +0 -5
  39. package/esm2022/floatingactionbutton/models/item-click.event.mjs +0 -5
  40. package/esm2022/floatingactionbutton/models/item.interface.mjs +0 -5
  41. package/esm2022/floatingactionbutton/models/offset.mjs +0 -5
  42. package/esm2022/floatingactionbutton/models/position-mode.mjs +0 -5
  43. package/esm2022/floatingactionbutton/templates/dial-item-template.directive.mjs +0 -37
  44. package/esm2022/floatingactionbutton/templates/fab-template.directive.mjs +0 -38
  45. package/esm2022/floatingactionbutton/utils.mjs +0 -38
  46. package/esm2022/focusable/focus.service.mjs +0 -38
  47. package/esm2022/focusable/focusable.directive.mjs +0 -67
  48. package/esm2022/index.mjs +0 -33
  49. package/esm2022/listbutton/button-item-template.directive.mjs +0 -47
  50. package/esm2022/listbutton/container.service.mjs +0 -18
  51. package/esm2022/listbutton/list-button.mjs +0 -461
  52. package/esm2022/listbutton/list-item-model.mjs +0 -5
  53. package/esm2022/listbutton/list.component.mjs +0 -177
  54. package/esm2022/listbutton/popup-settings.mjs +0 -5
  55. package/esm2022/navigation/key-events.mjs +0 -13
  56. package/esm2022/navigation/navigation-action.mjs +0 -20
  57. package/esm2022/navigation/navigation-config.mjs +0 -9
  58. package/esm2022/navigation/navigation.service.mjs +0 -111
  59. package/esm2022/package-metadata.mjs +0 -16
  60. package/esm2022/preventable-event.mjs +0 -25
  61. package/esm2022/progress-kendo-angular-buttons.mjs +0 -8
  62. package/esm2022/speechtotextbutton/models/error-event.mjs +0 -5
  63. package/esm2022/speechtotextbutton/models/integration-mode.mjs +0 -5
  64. package/esm2022/speechtotextbutton/models/result-event.mjs +0 -5
  65. package/esm2022/speechtotextbutton/models/speechtotextbutton-settings.mjs +0 -5
  66. package/esm2022/speechtotextbutton/speechtotextbutton.component.mjs +0 -532
  67. package/esm2022/speechtotextbutton/speechtotextbutton.module.mjs +0 -31
  68. package/esm2022/splitbutton/localization/custom-messages.component.mjs +0 -40
  69. package/esm2022/splitbutton/localization/localized-messages.directive.mjs +0 -39
  70. package/esm2022/splitbutton/localization/messages.mjs +0 -50
  71. package/esm2022/splitbutton/splitbutton.component.mjs +0 -761
  72. package/esm2022/splitbutton/splitbutton.module.mjs +0 -37
  73. package/esm2022/util.mjs +0 -108
@@ -1,585 +0,0 @@
1
- /**-----------------------------------------------------------------------------------------
2
- * Copyright © 2026 Progress Software Corporation. All rights reserved.
3
- * Licensed under commercial license. See LICENSE.md in the project root for more information
4
- *-------------------------------------------------------------------------------------------*/
5
- import { Component, HostBinding, Input, Output, EventEmitter, ElementRef, Renderer2, NgZone, isDevMode } from '@angular/core';
6
- import { Subscription } from 'rxjs';
7
- import { isDocumentAvailable, Keys, normalizeKeys } from '@progress/kendo-angular-common';
8
- import { LocalizationService, L10N_PREFIX } from '@progress/kendo-angular-l10n';
9
- import { validatePackage } from '@progress/kendo-licensing';
10
- import { packageMetadata } from '../package-metadata';
11
- import { closest, getStylingClasses, getThemeColorClasses, isObjectEmpty } from '../util';
12
- import { moreVerticalIcon, xCircleIcon } from '@progress/kendo-svg-icons';
13
- import { IconWrapperComponent } from '@progress/kendo-angular-icons';
14
- import { NgStyle } from '@angular/common';
15
- import * as i0 from "@angular/core";
16
- import * as i1 from "@progress/kendo-angular-l10n";
17
- const DEFAULT_SIZE = 'medium';
18
- const DEFAULT_ROUNDED = 'medium';
19
- const DEFAULT_THEME_COLOR = 'base';
20
- const DEFAULT_FILL_MODE = 'solid';
21
- /**
22
- * Displays a Chip that represents an input, attribute, or action.
23
- *
24
- * @example
25
- * ```html
26
- * <kendo-chip label="Chip Label"></kendo-chip>
27
- * ```
28
- */
29
- export class ChipComponent {
30
- element;
31
- renderer;
32
- ngZone;
33
- localizationService;
34
- /**
35
- * Sets the label text of the Chip.
36
- */
37
- label;
38
- /**
39
- * Defines the name for an existing icon in a Kendo UI theme.
40
- * The icon is rendered inside the Chip by a `span.k-icon` element.
41
- */
42
- icon;
43
- /**
44
- * Defines an [`SVGIcon`](slug:api_icons_svgicon) to render inside the Chip using
45
- * a [`KendoSVGIcon`](slug:api_icons_svgiconcomponent) component.
46
- */
47
- svgIcon;
48
- /**
49
- * Defines a CSS class, or multiple classes separated by spaces,
50
- * applied to a `span` element. Use the `iconClass` to add custom icons.
51
- */
52
- iconClass;
53
- /**
54
- * Use these settings to render an avatar within the Chip.
55
- */
56
- avatarSettings;
57
- /**
58
- * Specifies the selected state of the Chip.
59
- * @default false
60
- */
61
- selected = false;
62
- /**
63
- * Specifies if the Chip is removable.
64
- * If set to `true`, the Chip renders a remove icon.
65
- * @default false
66
- */
67
- removable = false;
68
- /**
69
- * Specifies a custom remove font icon class to render when the Chip is removable.
70
- * [see example]({% slug icons %})
71
- */
72
- removeIcon;
73
- /**
74
- * Specifies a custom remove SVG icon to render when the Chip is removable.
75
- */
76
- removeSvgIcon;
77
- /**
78
- * @hidden
79
- *
80
- * Determines whether the Chip has a menu.
81
- */
82
- hasMenu = false;
83
- /**
84
- * @hidden
85
- *
86
- * Specifies a custom menu font icon class to render when the Chip has a menu.
87
- */
88
- menuIcon;
89
- /**
90
- * @hidden
91
- *
92
- * Specifies a custom menu SVG icon to render when the Chip has a menu.
93
- */
94
- menuSvgIcon;
95
- /**
96
- * If set to `true`, the Chip is disabled.
97
- * @default false
98
- */
99
- disabled = false;
100
- /**
101
- * Sets the padding of the Chip.
102
- * See [Chip Appearance]({% slug appearance_chip %}#size).
103
- *
104
- * @default 'medium'
105
- */
106
- set size(size) {
107
- const newSize = size || DEFAULT_SIZE;
108
- if (!this.sizeIsSet) {
109
- this.sizeIsSet = true;
110
- }
111
- this.handleClasses(newSize, 'size');
112
- this._size = newSize;
113
- }
114
- get size() {
115
- return this._size;
116
- }
117
- /**
118
- * Sets the border radius of the Chip.
119
- * See [Chip Appearance](slug:appearance_chip#roundness).
120
- *
121
- * @default 'medium'
122
- */
123
- set rounded(rounded) {
124
- const newRounded = rounded || DEFAULT_ROUNDED;
125
- this.handleClasses(newRounded, 'rounded');
126
- this._rounded = newRounded;
127
- }
128
- get rounded() {
129
- return this._rounded;
130
- }
131
- /**
132
- * Sets the background and border styles of the Chip.
133
- * See [Chip Appearance](slug:appearance_chip#fill-mode).
134
- *
135
- * @default 'solid'
136
- */
137
- set fillMode(fillMode) {
138
- const newFillMode = fillMode || DEFAULT_FILL_MODE;
139
- this.handleClasses(newFillMode, 'fillMode');
140
- this._fillMode = newFillMode;
141
- }
142
- get fillMode() {
143
- return this._fillMode;
144
- }
145
- /**
146
- * Sets a predefined theme color for the Chip.
147
- * The theme color applies as a background and border color and adjusts the text color.
148
- * See [Chip Appearance](slug:appearance_chip#theme-colors).
149
- *
150
- * @default 'base'
151
- */
152
- set themeColor(themeColor) {
153
- const newThemeColor = themeColor || DEFAULT_THEME_COLOR;
154
- this.handleThemeColor(newThemeColor);
155
- this._themeColor = newThemeColor;
156
- }
157
- get themeColor() {
158
- return this._themeColor;
159
- }
160
- /**
161
- * Fires when the user clicks the remove icon of the Chip.
162
- */
163
- remove = new EventEmitter();
164
- /**
165
- * @hidden
166
- *
167
- * Fires when the user clicks the menu icon of the Chip.
168
- */
169
- menuToggle = new EventEmitter();
170
- /**
171
- * Fires when the user clicks the content of the Chip.
172
- */
173
- contentClick = new EventEmitter();
174
- tabIndex = 0;
175
- hostClass = true;
176
- get hasIconClass() {
177
- return Boolean(this.icon || this.iconClass || (this.avatarSettings && !isObjectEmpty(this.avatarSettings)));
178
- }
179
- get disabledClass() {
180
- return this.disabled;
181
- }
182
- get selectedClass() {
183
- return this.selected;
184
- }
185
- get focusedClass() {
186
- return this.focused;
187
- }
188
- /**
189
- * @hidden
190
- */
191
- direction;
192
- /**
193
- * @hidden
194
- */
195
- defaultRemoveIcon = xCircleIcon;
196
- /**
197
- * @hidden
198
- */
199
- defaultMenuIcon = moreVerticalIcon;
200
- /**
201
- * @hidden
202
- */
203
- sizeIsSet = false;
204
- _size = 'medium';
205
- _rounded = 'medium';
206
- _fillMode = 'solid';
207
- _themeColor = 'base';
208
- focused = false;
209
- subs = new Subscription();
210
- constructor(element, renderer, ngZone, localizationService) {
211
- this.element = element;
212
- this.renderer = renderer;
213
- this.ngZone = ngZone;
214
- this.localizationService = localizationService;
215
- validatePackage(packageMetadata);
216
- this.direction = localizationService.rtl ? 'rtl' : 'ltr';
217
- }
218
- ngOnInit() {
219
- this.subs.add(this.localizationService.changes
220
- .subscribe(({ rtl }) => this.direction = rtl ? 'rtl' : 'ltr'));
221
- this.renderer.setAttribute(this.element.nativeElement, 'role', 'button');
222
- }
223
- ngOnDestroy() {
224
- this.subs.unsubscribe();
225
- }
226
- ngOnChanges(changes) {
227
- if (changes?.['selected']) {
228
- const hasAriaSelected = this.element.nativeElement.hasAttribute('aria-selected');
229
- if (!hasAriaSelected) {
230
- this.renderer.setAttribute(this.element.nativeElement, 'aria-pressed', `${this.selected}`);
231
- }
232
- }
233
- }
234
- ngAfterViewInit() {
235
- const chip = this.element.nativeElement;
236
- const stylingOptions = ['size', 'rounded', 'fillMode'];
237
- stylingOptions.forEach(input => {
238
- this.handleClasses(this[input], input);
239
- });
240
- this.attachElementEventHandlers(chip);
241
- }
242
- /**
243
- * @hidden
244
- */
245
- get kendoIconClass() {
246
- this.verifyIconSettings([this.iconClass]);
247
- return `k-i-${this.icon}`;
248
- }
249
- /**
250
- * @hidden
251
- */
252
- get customIconClass() {
253
- this.verifyIconSettings([this.icon]);
254
- return this.iconClass;
255
- }
256
- /**
257
- * @hidden
258
- */
259
- get removeIconClass() {
260
- return this.removeIcon ? this.removeIcon : 'k-i-x-circle';
261
- }
262
- /**
263
- * Focuses the Chip component.
264
- */
265
- focus() {
266
- if (isDocumentAvailable()) {
267
- this.element.nativeElement.focus();
268
- }
269
- }
270
- /**
271
- * Blurs the Chip component.
272
- */
273
- blur() {
274
- if (isDocumentAvailable()) {
275
- this.element.nativeElement.blur();
276
- }
277
- }
278
- /**
279
- * @hidden
280
- */
281
- onRemoveClick(e) {
282
- if (this.removable) {
283
- this.remove.emit({ sender: this, originalEvent: e });
284
- }
285
- }
286
- /**
287
- * @hidden
288
- */
289
- onMenuClick(e) {
290
- if (this.hasMenu) {
291
- this.menuToggle.emit({ sender: this, originalEvent: e });
292
- }
293
- }
294
- attachElementEventHandlers(chip) {
295
- this.ngZone.runOutsideAngular(() => {
296
- this.subs.add(this.renderer.listen(chip, 'focus', () => {
297
- this.renderer.addClass(chip, 'k-focus');
298
- }));
299
- this.subs.add(this.renderer.listen(chip, 'blur', () => {
300
- this.renderer.removeClass(chip, 'k-focus');
301
- }));
302
- this.subs.add(this.renderer.listen(chip, 'click', (e) => {
303
- const isActionClicked = closest(e.target, '.k-chip-action');
304
- if (!isActionClicked) {
305
- this.ngZone.run(() => {
306
- this.contentClick.emit({ sender: this, originalEvent: e });
307
- });
308
- }
309
- }));
310
- this.subs.add(this.renderer.listen(chip, 'keydown', this.keyDownHandler.bind(this)));
311
- });
312
- }
313
- /**
314
- * @hidden
315
- */
316
- verifyIconSettings(iconsToCheck) {
317
- if (isDevMode()) {
318
- if (iconsToCheck.filter(icon => icon !== null && icon !== undefined).length > 0) {
319
- this.renderer.removeClass(this.element.nativeElement, 'k-chip-has-icon');
320
- throw new Error('Invalid configuration: Having multiple icons is not supported. Only a single icon on a chip can be displayed.');
321
- }
322
- }
323
- }
324
- handleClasses(value, input) {
325
- const elem = this.element.nativeElement;
326
- const classes = getStylingClasses('chip', input, this[input], value);
327
- if (input === 'fillMode') {
328
- this.handleThemeColor(this.themeColor, this[input], value);
329
- }
330
- if (classes.toRemove) {
331
- this.renderer.removeClass(elem, classes.toRemove);
332
- }
333
- if (classes.toAdd) {
334
- this.renderer.addClass(elem, classes.toAdd);
335
- }
336
- }
337
- handleThemeColor(value, prevFillMode, fillMode) {
338
- const elem = this.element.nativeElement;
339
- const removeFillMode = prevFillMode || this.fillMode;
340
- const addFillMode = fillMode || this.fillMode;
341
- const themeColorClass = getThemeColorClasses('chip', removeFillMode, addFillMode, this.themeColor, value);
342
- this.renderer.removeClass(elem, themeColorClass.toRemove);
343
- if (addFillMode !== 'none' && fillMode !== 'none') {
344
- if (themeColorClass.toAdd) {
345
- this.renderer.addClass(elem, themeColorClass.toAdd);
346
- }
347
- }
348
- }
349
- keyDownHandler(e) {
350
- const code = normalizeKeys(e);
351
- const isEnterOrSpace = code === Keys.Enter || code === Keys.Space;
352
- const isDeleteOrBackspace = code === Keys.Delete || code === Keys.Backspace;
353
- if (this.disabled) {
354
- return;
355
- }
356
- if (isEnterOrSpace) {
357
- this.ngZone.run(() => {
358
- this.contentClick.emit({ sender: this, originalEvent: e });
359
- });
360
- }
361
- else if (isDeleteOrBackspace && this.removable) {
362
- this.ngZone.run(() => {
363
- this.remove.emit({ sender: this, originalEvent: e });
364
- });
365
- }
366
- }
367
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ChipComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.NgZone }, { token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
368
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ChipComponent, isStandalone: true, selector: "kendo-chip", inputs: { label: "label", icon: "icon", svgIcon: "svgIcon", iconClass: "iconClass", avatarSettings: "avatarSettings", selected: "selected", removable: "removable", removeIcon: "removeIcon", removeSvgIcon: "removeSvgIcon", hasMenu: "hasMenu", menuIcon: "menuIcon", menuSvgIcon: "menuSvgIcon", disabled: "disabled", size: "size", rounded: "rounded", fillMode: "fillMode", themeColor: "themeColor" }, outputs: { remove: "remove", menuToggle: "menuToggle", contentClick: "contentClick" }, host: { properties: { "attr.tabindex": "this.tabIndex", "class.k-chip": "this.hostClass", "class.k-chip-has-icon": "this.hasIconClass", "attr.aria-disabled": "this.disabledClass", "class.k-disabled": "this.disabledClass", "class.k-selected": "this.selectedClass", "class.k-focus": "this.focusedClass", "attr.dir": "this.direction" } }, providers: [
369
- LocalizationService,
370
- {
371
- provide: L10N_PREFIX,
372
- useValue: 'kendo.chip'
373
- }
374
- ], usesOnChanges: true, ngImport: i0, template: `
375
- @if (icon || svgIcon) {
376
- <kendo-icon-wrapper
377
- size="small"
378
- innerCssClass="k-chip-icon"
379
- [name]="icon"
380
- [svgIcon]="svgIcon"></kendo-icon-wrapper>
381
- }
382
-
383
- @if (iconClass) {
384
- <kendo-icon-wrapper
385
- size="small"
386
- innerCssClass="k-chip-icon"
387
- [customFontClass]="customIconClass"></kendo-icon-wrapper>
388
- }
389
- @if (avatarSettings) {
390
- <span
391
- class="k-chip-avatar k-avatar k-avatar-sm k-avatar-solid k-avatar-solid-primary k-rounded-full"
392
- [ngStyle]="avatarSettings.cssStyle">
393
- @if (avatarSettings?.imageSrc) {
394
- <span class="k-avatar-image">
395
- <img src="{{ avatarSettings.imageSrc }}" [ngStyle]="avatarSettings.imageCssStyle" [attr.alt]="avatarSettings.imageAltText" />
396
- </span>
397
- }
398
- @if (avatarSettings?.initials) {
399
- <span class="k-avatar-text" [ngStyle]="avatarSettings.initialsCssStyle">{{ avatarSettings.initials.substring(0, 2) }}</span>
400
- }
401
- </span>
402
- }
403
-
404
- <span class="k-chip-content">
405
- @if (label) {
406
- <span class="k-chip-label">
407
- {{ label }}
408
- </span>
409
- }
410
- @if (!label) {
411
- <ng-content></ng-content>
412
- }
413
- </span>
414
-
415
- @if (hasMenu || removable) {
416
- <span class="k-chip-actions">
417
- @if (hasMenu) {
418
- <span class="k-chip-action k-chip-more-action"
419
- (click)="onMenuClick($event)">
420
- <kendo-icon-wrapper
421
- name="more-vertical"
422
- size="small"
423
- [svgIcon]="defaultMenuIcon || menuSvgIcon"
424
- [customFontClass]="menuIcon"></kendo-icon-wrapper>
425
- </span>
426
- }
427
- @if (removable) {
428
- <span class="k-chip-action k-chip-remove-action"
429
- (click)="onRemoveClick($event)">
430
- <kendo-icon-wrapper
431
- name="x-circle"
432
- size="small"
433
- [svgIcon]="removeSvgIcon || defaultRemoveIcon"
434
- [customFontClass]="removeIcon"></kendo-icon-wrapper>
435
- </span>
436
- }
437
- </span>
438
- }
439
- `, isInline: true, dependencies: [{ kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }] });
440
- }
441
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ChipComponent, decorators: [{
442
- type: Component,
443
- args: [{
444
- selector: 'kendo-chip',
445
- template: `
446
- @if (icon || svgIcon) {
447
- <kendo-icon-wrapper
448
- size="small"
449
- innerCssClass="k-chip-icon"
450
- [name]="icon"
451
- [svgIcon]="svgIcon"></kendo-icon-wrapper>
452
- }
453
-
454
- @if (iconClass) {
455
- <kendo-icon-wrapper
456
- size="small"
457
- innerCssClass="k-chip-icon"
458
- [customFontClass]="customIconClass"></kendo-icon-wrapper>
459
- }
460
- @if (avatarSettings) {
461
- <span
462
- class="k-chip-avatar k-avatar k-avatar-sm k-avatar-solid k-avatar-solid-primary k-rounded-full"
463
- [ngStyle]="avatarSettings.cssStyle">
464
- @if (avatarSettings?.imageSrc) {
465
- <span class="k-avatar-image">
466
- <img src="{{ avatarSettings.imageSrc }}" [ngStyle]="avatarSettings.imageCssStyle" [attr.alt]="avatarSettings.imageAltText" />
467
- </span>
468
- }
469
- @if (avatarSettings?.initials) {
470
- <span class="k-avatar-text" [ngStyle]="avatarSettings.initialsCssStyle">{{ avatarSettings.initials.substring(0, 2) }}</span>
471
- }
472
- </span>
473
- }
474
-
475
- <span class="k-chip-content">
476
- @if (label) {
477
- <span class="k-chip-label">
478
- {{ label }}
479
- </span>
480
- }
481
- @if (!label) {
482
- <ng-content></ng-content>
483
- }
484
- </span>
485
-
486
- @if (hasMenu || removable) {
487
- <span class="k-chip-actions">
488
- @if (hasMenu) {
489
- <span class="k-chip-action k-chip-more-action"
490
- (click)="onMenuClick($event)">
491
- <kendo-icon-wrapper
492
- name="more-vertical"
493
- size="small"
494
- [svgIcon]="defaultMenuIcon || menuSvgIcon"
495
- [customFontClass]="menuIcon"></kendo-icon-wrapper>
496
- </span>
497
- }
498
- @if (removable) {
499
- <span class="k-chip-action k-chip-remove-action"
500
- (click)="onRemoveClick($event)">
501
- <kendo-icon-wrapper
502
- name="x-circle"
503
- size="small"
504
- [svgIcon]="removeSvgIcon || defaultRemoveIcon"
505
- [customFontClass]="removeIcon"></kendo-icon-wrapper>
506
- </span>
507
- }
508
- </span>
509
- }
510
- `,
511
- providers: [
512
- LocalizationService,
513
- {
514
- provide: L10N_PREFIX,
515
- useValue: 'kendo.chip'
516
- }
517
- ],
518
- standalone: true,
519
- imports: [NgStyle, IconWrapperComponent]
520
- }]
521
- }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.NgZone }, { type: i1.LocalizationService }], propDecorators: { label: [{
522
- type: Input
523
- }], icon: [{
524
- type: Input
525
- }], svgIcon: [{
526
- type: Input
527
- }], iconClass: [{
528
- type: Input
529
- }], avatarSettings: [{
530
- type: Input
531
- }], selected: [{
532
- type: Input
533
- }], removable: [{
534
- type: Input
535
- }], removeIcon: [{
536
- type: Input
537
- }], removeSvgIcon: [{
538
- type: Input
539
- }], hasMenu: [{
540
- type: Input
541
- }], menuIcon: [{
542
- type: Input
543
- }], menuSvgIcon: [{
544
- type: Input
545
- }], disabled: [{
546
- type: Input
547
- }], size: [{
548
- type: Input
549
- }], rounded: [{
550
- type: Input
551
- }], fillMode: [{
552
- type: Input
553
- }], themeColor: [{
554
- type: Input
555
- }], remove: [{
556
- type: Output
557
- }], menuToggle: [{
558
- type: Output
559
- }], contentClick: [{
560
- type: Output
561
- }], tabIndex: [{
562
- type: HostBinding,
563
- args: ['attr.tabindex']
564
- }], hostClass: [{
565
- type: HostBinding,
566
- args: ['class.k-chip']
567
- }], hasIconClass: [{
568
- type: HostBinding,
569
- args: ['class.k-chip-has-icon']
570
- }], disabledClass: [{
571
- type: HostBinding,
572
- args: ['attr.aria-disabled']
573
- }, {
574
- type: HostBinding,
575
- args: ['class.k-disabled']
576
- }], selectedClass: [{
577
- type: HostBinding,
578
- args: ['class.k-selected']
579
- }], focusedClass: [{
580
- type: HostBinding,
581
- args: ['class.k-focus']
582
- }], direction: [{
583
- type: HostBinding,
584
- args: ['attr.dir']
585
- }] } });
@@ -1,45 +0,0 @@
1
- /**-----------------------------------------------------------------------------------------
2
- * Copyright © 2026 Progress Software Corporation. All rights reserved.
3
- * Licensed under commercial license. See LICENSE.md in the project root for more information
4
- *-------------------------------------------------------------------------------------------*/
5
- import { NgModule } from '@angular/core';
6
- import { KENDO_CHIPLIST } from '../directives';
7
- import { IconsService } from '@progress/kendo-angular-icons';
8
- import * as i0 from "@angular/core";
9
- import * as i1 from "./chip.component";
10
- import * as i2 from "./chip-list.component";
11
- //IMPORTANT: NgModule export kept for backwards compatibility
12
- /**
13
- * Represents the [NgModule](link:site.data.urls.angular['ngmoduleapi'])
14
- * definition for the Chip and ChipList components.
15
- *
16
- * Required for adding Chip and ChipList features in NgModule-based Angular applications.
17
- *
18
- * @example
19
- * ```typescript
20
- * import { ChipModule } from '@progress/kendo-angular-buttons';
21
- * import { NgModule } from '@angular/core';
22
- * import { BrowserModule } from '@angular/platform-browser';
23
- * import { AppComponent } from './app.component';
24
- *
25
- * @NgModule({
26
- * declarations: [AppComponent],
27
- * imports: [BrowserModule, ChipModule],
28
- * bootstrap: [AppComponent]
29
- * })
30
- * export class AppModule {}
31
- * ```
32
- */
33
- export class ChipModule {
34
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ChipModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
35
- static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: ChipModule, imports: [i1.ChipComponent, i2.ChipListComponent], exports: [i1.ChipComponent, i2.ChipListComponent] });
36
- static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ChipModule, providers: [IconsService], imports: [i1.ChipComponent] });
37
- }
38
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ChipModule, decorators: [{
39
- type: NgModule,
40
- args: [{
41
- exports: [...KENDO_CHIPLIST],
42
- imports: [...KENDO_CHIPLIST],
43
- providers: [IconsService]
44
- }]
45
- }] });
@@ -1,5 +0,0 @@
1
- /**-----------------------------------------------------------------------------------------
2
- * Copyright © 2026 Progress Software Corporation. All rights reserved.
3
- * Licensed under commercial license. See LICENSE.md in the project root for more information
4
- *-------------------------------------------------------------------------------------------*/
5
- export {};
@@ -1,5 +0,0 @@
1
- /**-----------------------------------------------------------------------------------------
2
- * Copyright © 2026 Progress Software Corporation. All rights reserved.
3
- * Licensed under commercial license. See LICENSE.md in the project root for more information
4
- *-------------------------------------------------------------------------------------------*/
5
- export {};
@@ -1,5 +0,0 @@
1
- /**-----------------------------------------------------------------------------------------
2
- * Copyright © 2026 Progress Software Corporation. All rights reserved.
3
- * Licensed under commercial license. See LICENSE.md in the project root for more information
4
- *-------------------------------------------------------------------------------------------*/
5
- export {};
@@ -1,5 +0,0 @@
1
- /**-----------------------------------------------------------------------------------------
2
- * Copyright © 2026 Progress Software Corporation. All rights reserved.
3
- * Licensed under commercial license. See LICENSE.md in the project root for more information
4
- *-------------------------------------------------------------------------------------------*/
5
- export {};
@@ -1,5 +0,0 @@
1
- /**-----------------------------------------------------------------------------------------
2
- * Copyright © 2026 Progress Software Corporation. All rights reserved.
3
- * Licensed under commercial license. See LICENSE.md in the project root for more information
4
- *-------------------------------------------------------------------------------------------*/
5
- export {};
@@ -1,5 +0,0 @@
1
- /**-----------------------------------------------------------------------------------------
2
- * Copyright © 2026 Progress Software Corporation. All rights reserved.
3
- * Licensed under commercial license. See LICENSE.md in the project root for more information
4
- *-------------------------------------------------------------------------------------------*/
5
- export {};
@@ -1,5 +0,0 @@
1
- /**-----------------------------------------------------------------------------------------
2
- * Copyright © 2026 Progress Software Corporation. All rights reserved.
3
- * Licensed under commercial license. See LICENSE.md in the project root for more information
4
- *-------------------------------------------------------------------------------------------*/
5
- export {};
@@ -1,5 +0,0 @@
1
- /**-----------------------------------------------------------------------------------------
2
- * Copyright © 2026 Progress Software Corporation. All rights reserved.
3
- * Licensed under commercial license. See LICENSE.md in the project root for more information
4
- *-------------------------------------------------------------------------------------------*/
5
- export {};