@ckeditor/ckeditor5-ui 48.2.0 → 48.3.0-alpha.0

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 (117) hide show
  1. package/dist/arialiveannouncer.d.ts +90 -90
  2. package/dist/augmentation.d.ts +86 -86
  3. package/dist/autocomplete/autocompleteview.d.ts +70 -70
  4. package/dist/badge/badge.d.ts +119 -121
  5. package/dist/bindings/addkeyboardhandlingforgrid.d.ts +22 -22
  6. package/dist/bindings/clickoutsidehandler.d.ts +25 -25
  7. package/dist/bindings/csstransitiondisablermixin.d.ts +47 -36
  8. package/dist/bindings/draggableviewmixin.d.ts +45 -37
  9. package/dist/bindings/preventdefault.d.ts +30 -30
  10. package/dist/bindings/submithandler.d.ts +49 -49
  11. package/dist/button/button.d.ts +167 -167
  12. package/dist/button/buttonlabel.d.ts +28 -28
  13. package/dist/button/buttonlabelview.d.ts +26 -26
  14. package/dist/button/buttonview.d.ts +192 -192
  15. package/dist/button/filedialogbuttonview.d.ts +107 -99
  16. package/dist/button/listitembuttonview.d.ts +73 -73
  17. package/dist/button/switchbuttonview.d.ts +40 -40
  18. package/dist/collapsible/collapsibleview.d.ts +63 -63
  19. package/dist/colorgrid/colorgridview.d.ts +117 -117
  20. package/dist/colorgrid/colortileview.d.ts +21 -21
  21. package/dist/colorgrid/utils.d.ts +35 -35
  22. package/dist/colorpicker/colorpickerview.d.ts +155 -157
  23. package/dist/colorpicker/utils.d.ts +37 -37
  24. package/dist/colorselector/colorgridsfragmentview.d.ts +191 -191
  25. package/dist/colorselector/colorpickerfragmentview.d.ts +129 -129
  26. package/dist/colorselector/colorselectorview.d.ts +227 -229
  27. package/dist/colorselector/documentcolorcollection.d.ts +52 -59
  28. package/dist/componentfactory.d.ts +76 -76
  29. package/dist/dialog/dialog.d.ts +311 -288
  30. package/dist/dialog/dialogactionsview.d.ts +62 -62
  31. package/dist/dialog/dialogcontentview.d.ts +22 -22
  32. package/dist/dialog/dialogview.d.ts +255 -251
  33. package/dist/dropdown/button/dropdownbutton.d.ts +17 -17
  34. package/dist/dropdown/button/dropdownbuttonview.d.ts +41 -41
  35. package/dist/dropdown/button/splitbuttonview.d.ts +155 -155
  36. package/dist/dropdown/dropdownpanelfocusable.d.ts +16 -16
  37. package/dist/dropdown/dropdownpanelview.d.ts +56 -56
  38. package/dist/dropdown/dropdownview.d.ts +326 -326
  39. package/dist/dropdown/menu/dropdownmenubehaviors.d.ts +43 -43
  40. package/dist/dropdown/menu/dropdownmenubuttonview.d.ts +29 -29
  41. package/dist/dropdown/menu/dropdownmenulistitembuttonview.d.ts +12 -12
  42. package/dist/dropdown/menu/dropdownmenulistitemview.d.ts +17 -17
  43. package/dist/dropdown/menu/dropdownmenulistview.d.ts +19 -19
  44. package/dist/dropdown/menu/dropdownmenunestedmenupanelview.d.ts +28 -28
  45. package/dist/dropdown/menu/dropdownmenunestedmenuview.d.ts +126 -126
  46. package/dist/dropdown/menu/dropdownmenurootlistview.d.ts +132 -132
  47. package/dist/dropdown/menu/utils.d.ts +112 -112
  48. package/dist/dropdown/utils.d.ts +272 -272
  49. package/dist/editableui/editableuiview.d.ts +78 -78
  50. package/dist/editableui/inline/inlineeditableuiview.d.ts +38 -38
  51. package/dist/editorui/accessibilityhelp/accessibilityhelp.d.ts +50 -50
  52. package/dist/editorui/accessibilityhelp/accessibilityhelpcontentview.d.ts +30 -30
  53. package/dist/editorui/bodycollection.d.ts +86 -86
  54. package/dist/editorui/boxed/boxededitoruiview.d.ts +35 -35
  55. package/dist/editorui/editorui.d.ts +348 -351
  56. package/dist/editorui/editoruiview.d.ts +53 -53
  57. package/dist/editorui/evaluationbadge.d.ts +28 -28
  58. package/dist/editorui/poweredby.d.ts +25 -25
  59. package/dist/focuscycler.d.ts +265 -270
  60. package/dist/formheader/formheaderview.d.ts +53 -53
  61. package/dist/formrow/formrowview.d.ts +52 -52
  62. package/dist/highlightedtext/buttonlabelwithhighlightview.d.ts +25 -25
  63. package/dist/highlightedtext/highlightedtextview.d.ts +33 -33
  64. package/dist/highlightedtext/labelwithhighlightview.d.ts +21 -21
  65. package/dist/icon/iconview.d.ts +83 -83
  66. package/dist/iframe/iframeview.d.ts +42 -42
  67. package/dist/index.css.map +1 -1
  68. package/dist/index.d.ts +136 -136
  69. package/dist/index.js +16467 -17751
  70. package/dist/index.js.map +1 -1
  71. package/dist/input/inputbase.d.ts +114 -114
  72. package/dist/input/inputview.d.ts +28 -28
  73. package/dist/inputnumber/inputnumberview.d.ts +44 -44
  74. package/dist/inputtext/inputtextview.d.ts +13 -13
  75. package/dist/label/labelview.d.ts +31 -31
  76. package/dist/labeledfield/labeledfieldview.d.ts +180 -180
  77. package/dist/labeledfield/utils.d.ts +112 -112
  78. package/dist/labeledinput/labeledinputview.d.ts +120 -120
  79. package/dist/legacyerrors.d.ts +0 -4
  80. package/dist/list/listitemgroupview.d.ts +54 -54
  81. package/dist/list/listitemview.d.ts +31 -31
  82. package/dist/list/listseparatorview.d.ts +13 -13
  83. package/dist/list/listview.d.ts +119 -119
  84. package/dist/menubar/menubarmenubuttonview.d.ts +28 -28
  85. package/dist/menubar/menubarmenulistitembuttonview.d.ts +16 -16
  86. package/dist/menubar/menubarmenulistitemfiledialogbuttonview.d.ts +18 -18
  87. package/dist/menubar/menubarmenulistitemview.d.ts +20 -20
  88. package/dist/menubar/menubarmenulistview.d.ts +24 -24
  89. package/dist/menubar/menubarmenupanelview.d.ts +47 -47
  90. package/dist/menubar/menubarmenuview.d.ts +113 -113
  91. package/dist/menubar/menubarview.d.ts +145 -145
  92. package/dist/menubar/utils.d.ts +455 -455
  93. package/dist/model.d.ts +19 -18
  94. package/dist/notification/notification.d.ts +200 -200
  95. package/dist/panel/balloon/balloonpanelview.d.ts +692 -692
  96. package/dist/panel/balloon/contextualballoon.d.ts +298 -298
  97. package/dist/panel/sticky/stickypanelview.d.ts +151 -151
  98. package/dist/search/filteredview.d.ts +23 -23
  99. package/dist/search/filtergroupanditemnames.d.ts +11 -11
  100. package/dist/search/searchinfoview.d.ts +39 -39
  101. package/dist/search/searchresultsview.d.ts +49 -49
  102. package/dist/search/text/searchtextqueryview.d.ts +63 -63
  103. package/dist/search/text/searchtextview.d.ts +203 -203
  104. package/dist/spinner/spinnerview.d.ts +20 -20
  105. package/dist/template.d.ts +897 -902
  106. package/dist/textarea/textareaview.d.ts +96 -96
  107. package/dist/toolbar/balloon/balloontoolbar.d.ts +122 -122
  108. package/dist/toolbar/block/blockbuttonview.d.ts +30 -30
  109. package/dist/toolbar/block/blocktoolbar.d.ts +166 -166
  110. package/dist/toolbar/normalizetoolbarconfig.d.ts +35 -35
  111. package/dist/toolbar/toolbarlinebreakview.d.ts +13 -13
  112. package/dist/toolbar/toolbarseparatorview.d.ts +13 -13
  113. package/dist/toolbar/toolbarview.d.ts +271 -271
  114. package/dist/tooltipmanager.d.ts +190 -193
  115. package/dist/view.d.ts +385 -388
  116. package/dist/viewcollection.d.ts +134 -134
  117. package/package.json +6 -6
@@ -1,81 +1,81 @@
1
1
  /**
2
- * @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
3
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
4
- */
2
+ * @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
3
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
4
+ */
5
5
  /**
6
- * @module ui/button/listitembuttonview
7
- */
8
- import type { Locale } from '@ckeditor/ckeditor5-utils';
9
- import { type ButtonLabel } from './buttonlabel.js';
10
- import { type ViewCollection } from '../viewcollection.js';
11
- import { ButtonView } from './buttonview.js';
12
- import { View } from '../view.js';
13
- import '../../theme/components/button/listitembutton.css';
6
+ * @module ui/button/listitembuttonview
7
+ */
8
+ import type { Locale } from "@ckeditor/ckeditor5-utils";
9
+ import { type ButtonLabel } from "./buttonlabel.js";
10
+ import { type ViewCollection } from "../viewcollection.js";
11
+ import { ButtonView } from "./buttonview.js";
12
+ import { View } from "../view.js";
13
+ import "../../theme/components/button/listitembutton.css";
14
14
  /**
15
- * Button that is used as dropdown list item entry.
16
- */
15
+ * Button that is used as dropdown list item entry.
16
+ */
17
17
  export declare class ListItemButtonView extends ButtonView {
18
- /**
19
- * Indicates whether the button view has reserved space for a check holder.
20
- *
21
- * @observable
22
- */
23
- hasCheckSpace: boolean;
24
- /**
25
- * The flag that indicates if the button should render a check holder.
26
- *
27
- * @internal
28
- * @readonly
29
- * @observable
30
- */
31
- _hasCheck: boolean;
32
- /**
33
- * Holds the view for the check icon of a button list item.
34
- */
35
- private readonly _checkIconHolderView;
36
- /**
37
- * @inheritDoc
38
- */
39
- constructor(locale?: Locale, labelView?: ButtonLabel);
40
- /**
41
- * @inheritDoc
42
- */
43
- render(): void;
44
- /**
45
- * Renders the check icon if the button is toggleable.
46
- */
47
- private _watchCheckIconHolderMount;
18
+ /**
19
+ * Indicates whether the button view has reserved space for a check holder.
20
+ *
21
+ * @observable
22
+ */
23
+ hasCheckSpace: boolean;
24
+ /**
25
+ * The flag that indicates if the button should render a check holder.
26
+ *
27
+ * @internal
28
+ * @readonly
29
+ * @observable
30
+ */
31
+ _hasCheck: boolean;
32
+ /**
33
+ * Holds the view for the check icon of a button list item.
34
+ */
35
+ private readonly _checkIconHolderView;
36
+ /**
37
+ * @inheritDoc
38
+ */
39
+ constructor(locale?: Locale, labelView?: ButtonLabel);
40
+ /**
41
+ * @inheritDoc
42
+ */
43
+ override render(): void;
44
+ /**
45
+ * Renders the check icon if the button is toggleable.
46
+ */
47
+ private _watchCheckIconHolderMount;
48
48
  }
49
49
  /**
50
- * @internal
51
- */
50
+ * @internal
51
+ */
52
52
  export declare class CheckIconHolderView extends View {
53
- /**
54
- * Collection of child views.
55
- */
56
- readonly children: ViewCollection<View>;
57
- /**
58
- * Indicates whether the button is in the "on" state.
59
- */
60
- isOn: boolean;
61
- /**
62
- * The view for the check icon of the button list item.
63
- */
64
- private readonly _checkIconView;
65
- /**
66
- * @inheritDoc
67
- */
68
- constructor();
69
- /**
70
- * @inheritDoc
71
- */
72
- render(): void;
73
- /**
74
- * Renders the check icon if the button is toggleable.
75
- */
76
- private _watchCheckIconMount;
77
- /**
78
- * Creates a check icon view.
79
- */
80
- private _createCheckIconView;
53
+ /**
54
+ * Collection of child views.
55
+ */
56
+ readonly children: ViewCollection<View>;
57
+ /**
58
+ * Indicates whether the button is in the "on" state.
59
+ */
60
+ isOn: boolean;
61
+ /**
62
+ * The view for the check icon of the button list item.
63
+ */
64
+ private readonly _checkIconView;
65
+ /**
66
+ * @inheritDoc
67
+ */
68
+ constructor();
69
+ /**
70
+ * @inheritDoc
71
+ */
72
+ override render(): void;
73
+ /**
74
+ * Renders the check icon if the button is toggleable.
75
+ */
76
+ private _watchCheckIconMount;
77
+ /**
78
+ * Creates a check icon view.
79
+ */
80
+ private _createCheckIconView;
81
81
  }
@@ -1,45 +1,45 @@
1
1
  /**
2
- * @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
3
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
4
- */
2
+ * @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
3
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
4
+ */
5
5
  /**
6
- * @module ui/button/switchbuttonview
7
- */
8
- import { View } from '../view.js';
9
- import { ButtonView } from './buttonview.js';
10
- import type { Locale } from '@ckeditor/ckeditor5-utils';
11
- import '../../theme/components/button/switchbutton.css';
6
+ * @module ui/button/switchbuttonview
7
+ */
8
+ import { View } from "../view.js";
9
+ import { ButtonView } from "./buttonview.js";
10
+ import type { Locale } from "@ckeditor/ckeditor5-utils";
11
+ import "../../theme/components/button/switchbutton.css";
12
12
  /**
13
- * The switch button view class.
14
- *
15
- * ```ts
16
- * const view = new SwitchButtonView();
17
- *
18
- * view.set( {
19
- * withText: true,
20
- * label: 'Switch me!'
21
- * } );
22
- *
23
- * view.render();
24
- *
25
- * document.body.append( view.element );
26
- * ```
27
- */
13
+ * The switch button view class.
14
+ *
15
+ * ```ts
16
+ * const view = new SwitchButtonView();
17
+ *
18
+ * view.set( {
19
+ * withText: true,
20
+ * label: 'Switch me!'
21
+ * } );
22
+ *
23
+ * view.render();
24
+ *
25
+ * document.body.append( view.element );
26
+ * ```
27
+ */
28
28
  export declare class SwitchButtonView extends ButtonView {
29
- /**
30
- * The toggle switch of the button.
31
- */
32
- readonly toggleSwitchView: View;
33
- /**
34
- * @inheritDoc
35
- */
36
- constructor(locale?: Locale);
37
- /**
38
- * @inheritDoc
39
- */
40
- render(): void;
41
- /**
42
- * Creates a toggle child view.
43
- */
44
- private _createToggleView;
29
+ /**
30
+ * The toggle switch of the button.
31
+ */
32
+ readonly toggleSwitchView: View;
33
+ /**
34
+ * @inheritDoc
35
+ */
36
+ constructor(locale?: Locale);
37
+ /**
38
+ * @inheritDoc
39
+ */
40
+ override render(): void;
41
+ /**
42
+ * Creates a toggle child view.
43
+ */
44
+ private _createToggleView;
45
45
  }
@@ -1,67 +1,67 @@
1
1
  /**
2
- * @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
3
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
4
- */
5
- import { View } from '../view.js';
6
- import { ButtonView } from '../button/buttonview.js';
7
- import { type ViewCollection } from '../viewcollection.js';
8
- import type { FocusableView } from '../focuscycler.js';
9
- import type { Locale } from '@ckeditor/ckeditor5-utils';
10
- import '../../theme/components/collapsible/collapsible.css';
2
+ * @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
3
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
4
+ */
5
+ import { View } from "../view.js";
6
+ import { ButtonView } from "../button/buttonview.js";
7
+ import { type ViewCollection } from "../viewcollection.js";
8
+ import type { FocusableView } from "../focuscycler.js";
9
+ import type { Locale } from "@ckeditor/ckeditor5-utils";
10
+ import "../../theme/components/collapsible/collapsible.css";
11
11
  /**
12
- * A collapsible UI component. Consists of a labeled button and a container which can be collapsed
13
- * by clicking the button. The collapsible container can be a host to other UI views.
14
- *
15
- * @internal
16
- */
12
+ * A collapsible UI component. Consists of a labeled button and a container which can be collapsed
13
+ * by clicking the button. The collapsible container can be a host to other UI views.
14
+ *
15
+ * @internal
16
+ */
17
17
  export declare class CollapsibleView extends View {
18
- /**
19
- * `true` when the container with {@link #children} is collapsed. `false` otherwise.
20
- *
21
- * @observable
22
- */
23
- isCollapsed: boolean;
24
- /**
25
- * The text label of the {@link #buttonView}.
26
- *
27
- * @observable
28
- * @default 'Show more'
29
- */
30
- label: string;
31
- /**
32
- * The ID of the label inside the {@link #buttonView} that describes the collapsible
33
- * container for assistive technologies. Set after the button was {@link #render rendered}.
34
- *
35
- * @internal
36
- * @readonly
37
- * @observable
38
- */
39
- _collapsibleAriaLabelUid: string | undefined;
40
- /**
41
- * The main button that, when clicked, collapses or expands the container with {@link #children}.
42
- */
43
- readonly buttonView: ButtonView;
44
- /**
45
- * A collection of the child views that can be collapsed by clicking the {@link #buttonView}.
46
- */
47
- readonly children: ViewCollection<FocusableView>;
48
- /**
49
- * Creates an instance of the collapsible view.
50
- *
51
- * @param locale The {@link module:core/editor/editor~Editor#locale} instance.
52
- * @param childViews An optional array of initial child views to be inserted into the collapsible.
53
- */
54
- constructor(locale: Locale, childViews?: Array<FocusableView>);
55
- /**
56
- * @inheritDoc
57
- */
58
- render(): void;
59
- /**
60
- * Focuses the first focusable.
61
- */
62
- focus(): void;
63
- /**
64
- * Creates the main {@link #buttonView} of the collapsible.
65
- */
66
- private _createButtonView;
18
+ /**
19
+ * `true` when the container with {@link #children} is collapsed. `false` otherwise.
20
+ *
21
+ * @observable
22
+ */
23
+ isCollapsed: boolean;
24
+ /**
25
+ * The text label of the {@link #buttonView}.
26
+ *
27
+ * @observable
28
+ * @default 'Show more'
29
+ */
30
+ label: string;
31
+ /**
32
+ * The ID of the label inside the {@link #buttonView} that describes the collapsible
33
+ * container for assistive technologies. Set after the button was {@link #render rendered}.
34
+ *
35
+ * @internal
36
+ * @readonly
37
+ * @observable
38
+ */
39
+ _collapsibleAriaLabelUid: string | undefined;
40
+ /**
41
+ * The main button that, when clicked, collapses or expands the container with {@link #children}.
42
+ */
43
+ readonly buttonView: ButtonView;
44
+ /**
45
+ * A collection of the child views that can be collapsed by clicking the {@link #buttonView}.
46
+ */
47
+ readonly children: ViewCollection<FocusableView>;
48
+ /**
49
+ * Creates an instance of the collapsible view.
50
+ *
51
+ * @param locale The {@link module:core/editor/editor~Editor#locale} instance.
52
+ * @param childViews An optional array of initial child views to be inserted into the collapsible.
53
+ */
54
+ constructor(locale: Locale, childViews?: Array<FocusableView>);
55
+ /**
56
+ * @inheritDoc
57
+ */
58
+ override render(): void;
59
+ /**
60
+ * Focuses the first focusable.
61
+ */
62
+ focus(): void;
63
+ /**
64
+ * Creates the main {@link #buttonView} of the collapsible.
65
+ */
66
+ private _createButtonView;
67
67
  }
@@ -1,132 +1,132 @@
1
1
  /**
2
- * @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
3
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
4
- */
2
+ * @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
3
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
4
+ */
5
5
  /**
6
- * @module ui/colorgrid/colorgridview
7
- */
8
- import { View } from '../view.js';
9
- import { ColorTileView } from './colortileview.js';
10
- import { type DropdownPanelFocusable } from '../dropdown/dropdownpanelfocusable.js';
11
- import { type ViewCollection } from '../viewcollection.js';
12
- import { FocusTracker, KeystrokeHandler, type Locale } from '@ckeditor/ckeditor5-utils';
13
- import '../../theme/components/colorgrid/colorgrid.css';
6
+ * @module ui/colorgrid/colorgridview
7
+ */
8
+ import { View } from "../view.js";
9
+ import { ColorTileView } from "./colortileview.js";
10
+ import { type DropdownPanelFocusable } from "../dropdown/dropdownpanelfocusable.js";
11
+ import { type ViewCollection } from "../viewcollection.js";
12
+ import { FocusTracker, KeystrokeHandler, type Locale } from "@ckeditor/ckeditor5-utils";
13
+ import "../../theme/components/colorgrid/colorgrid.css";
14
14
  /**
15
- * A grid of {@link module:ui/colorgrid/colortileview~ColorTileView color tiles}.
16
- */
15
+ * A grid of {@link module:ui/colorgrid/colortileview~ColorTileView color tiles}.
16
+ */
17
17
  export declare class ColorGridView extends View implements DropdownPanelFocusable {
18
- /**
19
- * A number of columns for the tiles grid.
20
- */
21
- readonly columns: number;
22
- /**
23
- * Collection of the child tile views.
24
- */
25
- readonly items: ViewCollection<ColorTileView>;
26
- /**
27
- * Tracks information about DOM focus in the grid.
28
- */
29
- readonly focusTracker: FocusTracker;
30
- /**
31
- * Instance of the {@link module:utils/keystrokehandler~KeystrokeHandler}.
32
- */
33
- readonly keystrokes: KeystrokeHandler;
34
- /**
35
- * The color of the currently selected color tile in {@link #items}.
36
- *
37
- * @observable
38
- */
39
- selectedColor: string | undefined | null;
40
- /**
41
- * Creates an instance of a color grid containing {@link module:ui/colorgrid/colortileview~ColorTileView tiles}.
42
- *
43
- * @fires execute
44
- * @param locale The localization services instance.
45
- * @param options Component configuration
46
- * @param options.colorDefinitions Array with definitions
47
- * required to create the {@link module:ui/colorgrid/colortileview~ColorTileView tiles}.
48
- * @param options.columns A number of columns to display the tiles.
49
- */
50
- constructor(locale?: Locale, options?: {
51
- colorDefinitions?: Array<ColorDefinition>;
52
- columns?: number;
53
- });
54
- /**
55
- * Focuses the first focusable in {@link #items}.
56
- */
57
- focus(): void;
58
- /**
59
- * Focuses the last focusable in {@link #items}.
60
- */
61
- focusLast(): void;
62
- /**
63
- * @inheritDoc
64
- */
65
- render(): void;
66
- /**
67
- * @inheritDoc
68
- */
69
- destroy(): void;
18
+ /**
19
+ * A number of columns for the tiles grid.
20
+ */
21
+ readonly columns: number;
22
+ /**
23
+ * Collection of the child tile views.
24
+ */
25
+ readonly items: ViewCollection<ColorTileView>;
26
+ /**
27
+ * Tracks information about DOM focus in the grid.
28
+ */
29
+ readonly focusTracker: FocusTracker;
30
+ /**
31
+ * Instance of the {@link module:utils/keystrokehandler~KeystrokeHandler}.
32
+ */
33
+ readonly keystrokes: KeystrokeHandler;
34
+ /**
35
+ * The color of the currently selected color tile in {@link #items}.
36
+ *
37
+ * @observable
38
+ */
39
+ selectedColor: string | undefined | null;
40
+ /**
41
+ * Creates an instance of a color grid containing {@link module:ui/colorgrid/colortileview~ColorTileView tiles}.
42
+ *
43
+ * @fires execute
44
+ * @param locale The localization services instance.
45
+ * @param options Component configuration
46
+ * @param options.colorDefinitions Array with definitions
47
+ * required to create the {@link module:ui/colorgrid/colortileview~ColorTileView tiles}.
48
+ * @param options.columns A number of columns to display the tiles.
49
+ */
50
+ constructor(locale?: Locale, options?: {
51
+ colorDefinitions?: Array<ColorDefinition>;
52
+ columns?: number;
53
+ });
54
+ /**
55
+ * Focuses the first focusable in {@link #items}.
56
+ */
57
+ focus(): void;
58
+ /**
59
+ * Focuses the last focusable in {@link #items}.
60
+ */
61
+ focusLast(): void;
62
+ /**
63
+ * @inheritDoc
64
+ */
65
+ override render(): void;
66
+ /**
67
+ * @inheritDoc
68
+ */
69
+ override destroy(): void;
70
70
  }
71
71
  /**
72
- * A color definition used to create a {@link module:ui/colorgrid/colortileview~ColorTileView}.
73
- *
74
- * ```json
75
- * {
76
- * color: 'hsl(0, 0%, 75%)',
77
- * label: 'Light Grey',
78
- * options: {
79
- * hasBorder: true
80
- * }
81
- * }
82
- * ```
83
- */
72
+ * A color definition used to create a {@link module:ui/colorgrid/colortileview~ColorTileView}.
73
+ *
74
+ * ```json
75
+ * {
76
+ * color: 'hsl(0, 0%, 75%)',
77
+ * label: 'Light Grey',
78
+ * options: {
79
+ * hasBorder: true
80
+ * }
81
+ * }
82
+ * ```
83
+ */
84
84
  export interface ColorDefinition {
85
- /**
86
- * String representing a color.
87
- * It is used as value of background-color style in {@link module:ui/colorgrid/colortileview~ColorTileView}.
88
- */
89
- color: string;
90
- /**
91
- * String used as label for {@link module:ui/colorgrid/colortileview~ColorTileView}.
92
- */
93
- label: string;
94
- /**
95
- * Additional options passed to create a {@link module:ui/colorgrid/colortileview~ColorTileView}.
96
- */
97
- options: {
98
- /**
99
- * A flag that indicates if special a CSS class should be added
100
- * to {@link module:ui/colorgrid/colortileview~ColorTileView}, which renders a border around it.
101
- */
102
- hasBorder: boolean;
103
- };
85
+ /**
86
+ * String representing a color.
87
+ * It is used as value of background-color style in {@link module:ui/colorgrid/colortileview~ColorTileView}.
88
+ */
89
+ color: string;
90
+ /**
91
+ * String used as label for {@link module:ui/colorgrid/colortileview~ColorTileView}.
92
+ */
93
+ label: string;
94
+ /**
95
+ * Additional options passed to create a {@link module:ui/colorgrid/colortileview~ColorTileView}.
96
+ */
97
+ options: {
98
+ /**
99
+ * A flag that indicates if special a CSS class should be added
100
+ * to {@link module:ui/colorgrid/colortileview~ColorTileView}, which renders a border around it.
101
+ */
102
+ hasBorder: boolean;
103
+ };
104
104
  }
105
105
  /**
106
- * Fired when the `ColorTileView` for the picked item is executed.
107
- *
108
- * @eventName ~ColorGridView#execute
109
- * @param data Additional information about the event.
106
+ * Fired when the `ColorTileView` for the picked item is executed.
107
+ *
108
+ * @eventName ~ColorGridView#execute
109
+ * @param data Additional information about the event.
110
110
  */
111
111
  export type ColorGridViewExecuteEvent = {
112
- name: 'execute';
113
- args: [data: ColorGridViewExecuteEventData];
112
+ name: "execute";
113
+ args: [data: ColorGridViewExecuteEventData];
114
114
  };
115
115
  /**
116
- * The data of {@link ~ColorGridViewExecuteEvent execute event}.
117
- */
116
+ * The data of {@link ~ColorGridViewExecuteEvent execute event}.
117
+ */
118
118
  export interface ColorGridViewExecuteEventData {
119
- /**
120
- * The value of the selected color ({@link module:ui/colorgrid/colorgridview~ColorDefinition#color `color.color`}).
121
- */
122
- value: string;
123
- /**
124
- * The `hasBorder` property of the selected color
125
- * ({@link module:ui/colorgrid/colorgridview~ColorDefinition#options `color.options.hasBorder`}).
126
- */
127
- hasBorder: boolean;
128
- /**
129
- * The label of the selected color ({@link module:ui/colorgrid/colorgridview~ColorDefinition#label `color.label`})
130
- */
131
- label: string;
119
+ /**
120
+ * The value of the selected color ({@link module:ui/colorgrid/colorgridview~ColorDefinition#color `color.color`}).
121
+ */
122
+ value: string;
123
+ /**
124
+ * The `hasBorder` property of the selected color
125
+ * ({@link module:ui/colorgrid/colorgridview~ColorDefinition#options `color.options.hasBorder`}).
126
+ */
127
+ hasBorder: boolean;
128
+ /**
129
+ * The label of the selected color ({@link module:ui/colorgrid/colorgridview~ColorDefinition#label `color.label`})
130
+ */
131
+ label: string;
132
132
  }