@bryntum/schedulerpro-vue-3-thin 7.2.4 → 7.3.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 (138) hide show
  1. package/README.md +7 -7
  2. package/lib/chunks/{D4JDuI0s.js → B4dVznPx.js} +1 -8
  3. package/lib/chunks/B4dVznPx.js.map +1 -0
  4. package/lib/chunks/{BhUeT19h.js → BFFz1c24.js} +5 -5
  5. package/lib/chunks/BFFz1c24.js.map +1 -0
  6. package/lib/chunks/{BJPdcix1.js → BIkGnHve.js} +3 -3
  7. package/lib/chunks/BIkGnHve.js.map +1 -0
  8. package/lib/chunks/{BRGc8bUJ.js → BNBuOpUp.js} +8 -7
  9. package/lib/chunks/BNBuOpUp.js.map +1 -0
  10. package/lib/chunks/{BjTPjWi9.js → Bp7aU5Ia.js} +6 -6
  11. package/lib/chunks/Bp7aU5Ia.js.map +1 -0
  12. package/lib/chunks/{CuODT2-U.js → C3Dz-ovY.js} +3 -3
  13. package/lib/chunks/C3Dz-ovY.js.map +1 -0
  14. package/lib/chunks/{BTT_cGQU.js → CPjow0gO.js} +8 -9
  15. package/lib/chunks/CPjow0gO.js.map +1 -0
  16. package/lib/chunks/{DYBe70El.js → CqtUB81W.js} +18 -11
  17. package/lib/chunks/CqtUB81W.js.map +1 -0
  18. package/lib/chunks/{C41opZKx.js → CvNpXefN.js} +18 -11
  19. package/lib/chunks/CvNpXefN.js.map +1 -0
  20. package/lib/chunks/{BbI7XKMd.js → D0hJ3P6L.js} +5 -3
  21. package/lib/chunks/D0hJ3P6L.js.map +1 -0
  22. package/lib/chunks/{BpAvqwr_.js → D1a3F6m-.js} +23 -13
  23. package/lib/chunks/D1a3F6m-.js.map +1 -0
  24. package/lib/chunks/{CGbW6pgm.js → DPA-xEW5.js} +8 -9
  25. package/lib/chunks/DPA-xEW5.js.map +1 -0
  26. package/lib/chunks/{MOjUZ-Rj.js → DdbMybqv.js} +5 -5
  27. package/lib/chunks/DdbMybqv.js.map +1 -0
  28. package/lib/chunks/{DGV7a5Xo.js → DjFBhm9P.js} +6 -6
  29. package/lib/chunks/DjFBhm9P.js.map +1 -0
  30. package/lib/chunks/{Dz-up1_i.js → DmFXOMJ5.js} +5 -5
  31. package/lib/chunks/DmFXOMJ5.js.map +1 -0
  32. package/lib/chunks/{DwzPrR90.js → Pb5GbfMi.js} +5 -5
  33. package/lib/chunks/Pb5GbfMi.js.map +1 -0
  34. package/lib/chunks/{M0cBUV91.js → W-pa3HyX.js} +6 -6
  35. package/lib/chunks/W-pa3HyX.js.map +1 -0
  36. package/lib/chunks/{CJFZbm_i.js → b8yreHIz.js} +23 -13
  37. package/lib/chunks/b8yreHIz.js.map +1 -0
  38. package/lib/chunks/{9jfNe_y3.js → oM3gO3yH.js} +14 -8
  39. package/lib/chunks/oM3gO3yH.js.map +1 -0
  40. package/lib/chunks/{BO8FwQoh.js → p1r0F5YC.js} +6 -6
  41. package/lib/chunks/p1r0F5YC.js.map +1 -0
  42. package/lib/chunks/{DlNFp5e-.js → s35t-2ke.js} +10 -10
  43. package/lib/chunks/s35t-2ke.js.map +1 -0
  44. package/lib/chunks/{j8JzZ-07.js → yF4wtntA.js} +4 -4
  45. package/lib/chunks/yF4wtntA.js.map +1 -0
  46. package/lib/components/BryntumCalendarEditor.js +1 -1
  47. package/lib/components/BryntumCalendarField.js +1 -1
  48. package/lib/components/BryntumConstraintTypePicker.js +1 -1
  49. package/lib/components/BryntumCostAccrualField.js +1 -1
  50. package/lib/components/BryntumDependencyTypePicker.js +1 -1
  51. package/lib/components/BryntumEffortField.js +1 -1
  52. package/lib/components/BryntumEndDateField.js +1 -1
  53. package/lib/components/BryntumModelCombo.js +1 -1
  54. package/lib/components/BryntumRateTableField.js +1 -1
  55. package/lib/components/BryntumResourceEditor.js +1 -1
  56. package/lib/components/BryntumResourceGrid.js +1 -1
  57. package/lib/components/BryntumResourceHistogram.js +1 -1
  58. package/lib/components/BryntumResourceTypeField.js +1 -1
  59. package/lib/components/BryntumResourceUtilization.js +1 -1
  60. package/lib/components/BryntumSchedulerPro.js +1 -1
  61. package/lib/components/BryntumSchedulerProBase.js +1 -1
  62. package/lib/components/BryntumSchedulerProProjectModel.js +1 -1
  63. package/lib/components/BryntumSchedulingDirectionPicker.js +1 -1
  64. package/lib/components/BryntumSchedulingModePicker.js +1 -1
  65. package/lib/components/BryntumStartDateField.js +1 -1
  66. package/lib/components/BryntumThemeCombo.js +57 -0
  67. package/lib/components/BryntumThemeCombo.js.map +1 -0
  68. package/lib/components/BryntumTimeline.js +1 -1
  69. package/lib/components/BryntumVersionGrid.js +1 -1
  70. package/lib/index.js +22 -22
  71. package/package.json +1 -1
  72. package/src/components/BryntumCalendarEditor.vue +127 -186
  73. package/src/components/BryntumCalendarEditorProps.ts +123 -177
  74. package/src/components/BryntumCalendarField.vue +91 -151
  75. package/src/components/BryntumCalendarFieldProps.ts +87 -143
  76. package/src/components/BryntumConstraintTypePicker.vue +91 -151
  77. package/src/components/BryntumConstraintTypePickerProps.ts +87 -143
  78. package/src/components/BryntumCostAccrualField.vue +91 -151
  79. package/src/components/BryntumCostAccrualFieldProps.ts +87 -143
  80. package/src/components/BryntumDependencyTypePicker.vue +91 -151
  81. package/src/components/BryntumDependencyTypePickerProps.ts +87 -143
  82. package/src/components/BryntumEffortField.vue +79 -124
  83. package/src/components/BryntumEffortFieldProps.ts +73 -114
  84. package/src/components/BryntumEndDateField.vue +79 -122
  85. package/src/components/BryntumEndDateFieldProps.ts +75 -114
  86. package/src/components/BryntumModelCombo.vue +91 -151
  87. package/src/components/BryntumModelComboProps.ts +87 -143
  88. package/src/components/BryntumRateTableField.vue +91 -151
  89. package/src/components/BryntumRateTableFieldProps.ts +87 -143
  90. package/src/components/BryntumResourceEditor.vue +126 -184
  91. package/src/components/BryntumResourceEditorProps.ts +122 -175
  92. package/src/components/BryntumResourceGrid.vue +204 -293
  93. package/src/components/BryntumResourceGridProps.ts +187 -263
  94. package/src/components/BryntumResourceHistogram.vue +335 -458
  95. package/src/components/BryntumResourceHistogramProps.ts +287 -402
  96. package/src/components/BryntumResourceTypeField.vue +91 -151
  97. package/src/components/BryntumResourceTypeFieldProps.ts +87 -143
  98. package/src/components/BryntumResourceUtilization.vue +335 -458
  99. package/src/components/BryntumResourceUtilizationProps.ts +288 -404
  100. package/src/components/BryntumSchedulerPro.vue +504 -643
  101. package/src/components/BryntumSchedulerProBase.vue +504 -643
  102. package/src/components/BryntumSchedulerProBaseProps.ts +408 -556
  103. package/src/components/BryntumSchedulerProProjectModel.vue +63 -107
  104. package/src/components/BryntumSchedulerProProjectModelProps.ts +55 -85
  105. package/src/components/BryntumSchedulerProProps.ts +408 -556
  106. package/src/components/BryntumSchedulingDirectionPicker.vue +91 -151
  107. package/src/components/BryntumSchedulingDirectionPickerProps.ts +87 -143
  108. package/src/components/BryntumSchedulingModePicker.vue +92 -153
  109. package/src/components/BryntumSchedulingModePickerProps.ts +88 -145
  110. package/src/components/BryntumStartDateField.vue +81 -126
  111. package/src/components/BryntumStartDateFieldProps.ts +77 -118
  112. package/src/components/BryntumThemeCombo.vue +60 -0
  113. package/src/components/BryntumTimeline.vue +425 -594
  114. package/src/components/BryntumTimelineProps.ts +366 -519
  115. package/src/components/BryntumVersionGrid.vue +203 -290
  116. package/src/components/BryntumVersionGridProps.ts +186 -261
  117. package/lib/chunks/9jfNe_y3.js.map +0 -1
  118. package/lib/chunks/BJPdcix1.js.map +0 -1
  119. package/lib/chunks/BO8FwQoh.js.map +0 -1
  120. package/lib/chunks/BRGc8bUJ.js.map +0 -1
  121. package/lib/chunks/BTT_cGQU.js.map +0 -1
  122. package/lib/chunks/BbI7XKMd.js.map +0 -1
  123. package/lib/chunks/BhUeT19h.js.map +0 -1
  124. package/lib/chunks/BjTPjWi9.js.map +0 -1
  125. package/lib/chunks/BpAvqwr_.js.map +0 -1
  126. package/lib/chunks/C41opZKx.js.map +0 -1
  127. package/lib/chunks/CGbW6pgm.js.map +0 -1
  128. package/lib/chunks/CJFZbm_i.js.map +0 -1
  129. package/lib/chunks/CuODT2-U.js.map +0 -1
  130. package/lib/chunks/D4JDuI0s.js.map +0 -1
  131. package/lib/chunks/DGV7a5Xo.js.map +0 -1
  132. package/lib/chunks/DYBe70El.js.map +0 -1
  133. package/lib/chunks/DlNFp5e-.js.map +0 -1
  134. package/lib/chunks/DwzPrR90.js.map +0 -1
  135. package/lib/chunks/Dz-up1_i.js.map +0 -1
  136. package/lib/chunks/M0cBUV91.js.map +0 -1
  137. package/lib/chunks/MOjUZ-Rj.js.map +0 -1
  138. package/lib/chunks/j8JzZ-07.js.map +0 -1
@@ -1,4 +1,4 @@
1
- import type { AlignSpec, Base, Color, DatePickerConfig, DurationConfig, Field, FieldContainer, FieldContainerConfig, FieldTriggerConfig, KeyMapConfig, MaskConfig, Rectangle, TabConfig, TimeField, TooltipConfig, Widget } from '@bryntum/core-thin';
1
+ import type { AlignSpec, Base, Color, DatePickerConfig, DurationConfig, Field, FieldContainerConfig, FieldTriggerConfig, KeyMapConfig, MaskConfig, Rectangle, TabConfig, TimeField, TooltipConfig, Widget } from '@bryntum/core-thin';
2
2
  import type { SchedulerProContainerItemConfig, EventModel, ProjectModel, StartDateFieldListeners } from '@bryntum/schedulerpro-thin';
3
3
 
4
4
  export declare type BryntumStartDateFieldProps = {
@@ -6,14 +6,12 @@ export declare type BryntumStartDateFieldProps = {
6
6
  /**
7
7
  * Element (or element id) to adopt as this Widget's encapsulating element. The widget's
8
8
  * content will be placed inside this element.
9
- * ...
10
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-adopt)
9
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-adopt)
11
10
  */
12
11
  adopt ? : HTMLElement|string
13
12
  /**
14
13
  * *Only valid if this Widget is [floating](https://bryntum.com/products/schedulerpro/docs/api/Core/widget/Widget#config-floating).*
15
- * ...
16
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-align)
14
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-align)
17
15
  */
18
16
  align ? : AlignSpec|string
19
17
  /**
@@ -35,15 +33,13 @@ export declare type BryntumStartDateFieldProps = {
35
33
  /**
36
34
  * A localizable string (May contain `'L{}'` tokens which resolve in the locale file) to inject
37
35
  * into an element which will be linked using the `aria-describedby` attribute.
38
- * ...
39
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-ariaDescription)
36
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-ariaDescription)
40
37
  */
41
38
  ariaDescription ? : string
42
39
  /**
43
40
  * A localizable string (May contain `'L{}'` tokens which resolve in the locale file) to inject as
44
41
  * the `aria-label` attribute.
45
- * ...
46
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-ariaLabel)
42
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-ariaLabel)
47
43
  */
48
44
  ariaLabel ? : string
49
45
  /**
@@ -66,21 +62,18 @@ export declare type BryntumStartDateFieldProps = {
66
62
  /**
67
63
  * An object where property names with a truthy value indicate which events should bubble up the ownership
68
64
  * hierarchy when triggered.
69
- * ...
70
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-bubbleEvents)
65
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-bubbleEvents)
71
66
  */
72
67
  bubbleEvents ? : object
73
68
  /**
74
69
  * Set to `false` to not call onXXX method names (e.g. `onShow`, `onClick`), as an easy way to listen for events.
75
- * ...
76
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-callOnFunctions)
70
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-callOnFunctions)
77
71
  */
78
72
  callOnFunctions ? : Boolean
79
73
  /**
80
74
  * By default, if an event handler throws an exception, the error propagates up the stack and the
81
75
  * application state is undefined. Code which follows the event handler will *not* be executed.
82
- * ...
83
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-catchEventHandlerExceptions)
76
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-catchEventHandlerExceptions)
84
77
  */
85
78
  catchEventHandlerExceptions ? : Boolean
86
79
  /**
@@ -98,15 +91,13 @@ export declare type BryntumStartDateFieldProps = {
98
91
  * Custom CSS classes to add to element.
99
92
  * May be specified as a space separated string, or as an object in which property names
100
93
  * with truthy values are used as the class names:
101
- * ...
102
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-cls)
94
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-cls)
103
95
  */
104
96
  cls ? : string|object
105
97
  /**
106
98
  * Applies the specified color to the widget, by setting the `--b-primary` CSS variable in the widgets
107
99
  * `style` block.
108
- * ...
109
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-color)
100
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-color)
110
101
  */
111
102
  color ? : Color
112
103
  /**
@@ -123,15 +114,13 @@ export declare type BryntumStartDateFieldProps = {
123
114
  * The configuration for additional items associated to this field. This is typically used to add contextual
124
115
  * fields related to a [checkbox](https://bryntum.com/products/schedulerpro/docs/api/Core/widget/Checkbox) or [radio button](#Core/widget/Radio). See
125
116
  * these classes for examples of nested fields.
126
- * ...
127
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-container)
117
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-container)
128
118
  */
129
- container ? : Record<string, SchedulerProContainerItemConfig>|SchedulerProContainerItemConfig[]|FieldContainerConfig|FieldContainer
119
+ container ? : Record<string, SchedulerProContainerItemConfig>|SchedulerProContainerItemConfig[]|FieldContainerConfig
130
120
  /**
131
121
  * The config controls how the value of nested items are handled when a parent container gets or sets its
132
122
  * [values](https://bryntum.com/products/schedulerpro/docs/api/Core/widget/Container#property-values).
133
- * ...
134
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-containValues)
123
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-containValues)
135
124
  * @param {Core.widget.Field} field Field instance
136
125
  * @returns {boolean}
137
126
  */
@@ -140,8 +129,7 @@ export declare type BryntumStartDateFieldProps = {
140
129
  * Custom CSS classes to add to the [contentElement](https://bryntum.com/products/schedulerpro/docs/api/Core/widget/Widget#property-contentElement).
141
130
  * May be specified as a space separated string, or as an object in which property names
142
131
  * with truthy values are used as the class names:
143
- * ...
144
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-contentElementCls)
132
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-contentElementCls)
145
133
  */
146
134
  contentElementCls ? : string|object
147
135
  /**
@@ -159,16 +147,15 @@ export declare type BryntumStartDateFieldProps = {
159
147
  */
160
148
  defaultBindProperty ? : string
161
149
  /**
162
- * Check for CSS compatibility issues when upgrading to v7. Performs the following checks:
163
- * ...
164
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-detectCSSCompatibilityIssues)
150
+ * Check for CSS compatibility and inclusion related issues and try to auto fix them. Performs the following
151
+ * checks:
152
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-detectCSSCompatibilityIssues)
165
153
  */
166
154
  detectCSSCompatibilityIssues ? : Boolean
167
155
  /**
168
156
  * Disable or enable the widget. It is similar to [readOnly](https://bryntum.com/products/schedulerpro/docs/api/Core/widget/Widget#config-readOnly) except a disabled widget
169
157
  * cannot be focused, uses a different rendition (usually greyish) and does not allow selecting its value.
170
- * ...
171
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-disabled)
158
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-disabled)
172
159
  */
173
160
  disabled ? : Boolean|'inert'
174
161
  /**
@@ -176,20 +163,17 @@ export declare type BryntumStartDateFieldProps = {
176
163
  * [strips collection](https://bryntum.com/products/schedulerpro/docs/api/Core/widget/Panel#config-strips). Typical values for this config are `'top'`,
177
164
  * `'bottom'`, `'left'`, or `'right'`, which cause the widget to be placed on that side of the panel's
178
165
  * body. Such widgets are called "edge strips".
179
- * ...
180
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-dock)
166
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-dock)
181
167
  */
182
168
  dock ? : 'top'|'bottom'|'left'|'right'|'start'|'end'|'header'|'pre-header'|object
183
169
  /**
184
170
  * *Only valid if this Widget is [floating](https://bryntum.com/products/schedulerpro/docs/api/Core/widget/Widget#config-floating).*
185
171
  * Set to `true` to be able to drag a widget freely on the page. Or set to an object with a ´handleSelector´
186
172
  * property which controls when a drag should start.
187
- * ...
188
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-draggable)
173
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-draggable)
174
+ * @property {string} handleSelector CSS selector used to determine if drag can be started from a mouse-downed element inside the widget
189
175
  */
190
- draggable ? : Boolean|{
191
- handleSelector?: string
192
- }
176
+ draggable ? : Boolean|object
193
177
  /**
194
178
  * User can edit text in text field (otherwise only pick from attached picker)
195
179
  */
@@ -197,8 +181,7 @@ export declare type BryntumStartDateFieldProps = {
197
181
  /**
198
182
  * An object specifying attributes to assign to the root element of this widget.
199
183
  * Set `null` value to attribute to remove it.
200
- * ...
201
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-elementAttributes)
184
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-elementAttributes)
202
185
  */
203
186
  elementAttributes ? : Record<string, string|null>
204
187
  /**
@@ -235,8 +218,7 @@ export declare type BryntumStartDateFieldProps = {
235
218
  hidden ? : Boolean
236
219
  /**
237
220
  * *Only valid if this Widget is [floating](https://bryntum.com/products/schedulerpro/docs/api/Core/widget/Widget#config-floating).*
238
- * ...
239
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-hideAnimation)
221
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-hideAnimation)
240
222
  */
241
223
  hideAnimation ? : Boolean|object
242
224
  /**
@@ -246,8 +228,7 @@ export declare type BryntumStartDateFieldProps = {
246
228
  /**
247
229
  * An optional string to display inside the input field as an overlay. This can be useful for displaying
248
230
  * a field's units.
249
- * ...
250
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-hint)
231
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-hint)
251
232
  * @param {object} data A data object
252
233
  * @param {Core.widget.Field} data.source A reference to the field instance
253
234
  * @param {any} data.value The current value of the field
@@ -258,8 +239,7 @@ export declare type BryntumStartDateFieldProps = {
258
239
  * This config is similar to [hint](https://bryntum.com/products/schedulerpro/docs/api/Core/widget/Field#config-hint) except that this config is used to display HTML content.
259
240
  * Since this can allow malicious content to be executed, be sure not to include user-entered data or to
260
241
  * encode such data (see [encodeHtml](https://bryntum.com/products/schedulerpro/docs/api/Core/helper/StringHelper#function-encodeHtml-static)).
261
- * ...
262
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-hintHtml)
242
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-hintHtml)
263
243
  * @param {object} data A data object
264
244
  * @param {Core.widget.Field} data.source A reference to the field instance
265
245
  * @param {any} data.value The current value of the field
@@ -272,16 +252,14 @@ export declare type BryntumStartDateFieldProps = {
272
252
  id ? : string
273
253
  /**
274
254
  * Determines if the widgets read-only state should be controlled by its parent.
275
- * ...
276
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-ignoreParentReadOnly)
255
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-ignoreParentReadOnly)
277
256
  */
278
257
  ignoreParentReadOnly ? : Boolean
279
258
  /**
280
259
  * Set this config to `true` to always display items horizontally along with this field. This assigns an
281
260
  * [hbox](https://bryntum.com/products/schedulerpro/docs/api/Core/widget/layout/Box) as the [layout](#Core/widget/Container#config-layout) to the
282
261
  * [container](https://bryntum.com/products/schedulerpro/docs/api/Core/widget/Field#config-container).
283
- * ...
284
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-inline)
262
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-inline)
285
263
  */
286
264
  inline ? : Boolean
287
265
  /**
@@ -320,24 +298,21 @@ export declare type BryntumStartDateFieldProps = {
320
298
  /**
321
299
  * A flag which indicates what time should be used for selected date.
322
300
  * `sod` by default which adjusts user provided value time to start of the working day.
323
- * ...
324
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-keepTime)
301
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-keepTime)
325
302
  */
326
303
  keepTime ? : Boolean|Date|string
327
304
  /**
328
305
  * An object whose keys are the [key](https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/key) name
329
306
  * and optional modifier prefixes: `'Ctrl+'`, `'Alt+'`, `'Meta+'`, and `'Shift+'` (case-insensitive). The values
330
307
  * are the name of the instance method to call when the keystroke is received.
331
- * ...
332
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-keyMap)
308
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-keyMap)
333
309
  */
334
310
  keyMap ? : Record<string, KeyMapConfig>
335
311
  /**
336
312
  * The delay in milliseconds to wait after the last keystroke before triggering a change event.
337
313
  * Set to 0 to not trigger change events from keystrokes (listen for input event instead to have
338
314
  * immediate feedback, change will still be triggered on blur).
339
- * ...
340
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-keyStrokeChangeDelay)
315
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-keyStrokeChangeDelay)
341
316
  */
342
317
  keyStrokeChangeDelay ? : number
343
318
  /**
@@ -350,15 +325,15 @@ export declare type BryntumStartDateFieldProps = {
350
325
  labelCls ? : string|object
351
326
  /**
352
327
  * Label position, either 'before' the field or 'above' the field
353
- * ...
354
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-labelPosition)
328
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-labelPosition)
355
329
  */
356
330
  labelPosition ? : 'before'|'above'|null
357
331
  /**
358
332
  * The labels to add either before or after the input field.
359
333
  * Each label may have the following properties:
360
- * ...
361
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-labels)
334
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-labels)
335
+ * @property {string} html Label text
336
+ * @property {'start','end'} align Which end of the file the label should go
362
337
  */
363
338
  labels ? : object[]
364
339
  /**
@@ -367,16 +342,14 @@ export declare type BryntumStartDateFieldProps = {
367
342
  labelWidth ? : string|number
368
343
  /**
369
344
  * The listener set for this object.
370
- * ...
371
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-listeners)
345
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-listeners)
372
346
  */
373
347
  listeners ? : StartDateFieldListeners
374
348
  /**
375
349
  * A class translations of which are used for translating this entity.
376
350
  * This is often used when translations of an item are defined on its container class.
377
351
  * For example:
378
- * ...
379
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-localeClass)
352
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-localeClass)
380
353
  */
381
354
  localeClass ? : typeof Base
382
355
  /**
@@ -388,8 +361,7 @@ export declare type BryntumStartDateFieldProps = {
388
361
  * In case there is a need to localize not typical value (not a String value or a field with re-defined setter/getter),
389
362
  * you could use 'localeKey' meta configuration.
390
363
  * Example:
391
- * ...
392
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-localizableProperties)
364
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-localizableProperties)
393
365
  */
394
366
  localizableProperties ? : string[]
395
367
  /**
@@ -416,8 +388,7 @@ export declare type BryntumStartDateFieldProps = {
416
388
  * Number of milliseconds to add to the project's start date. Then, during editing,
417
389
  * the resulting date is assigned to the [max](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-max) property of the field,
418
390
  * preventing the user from entering too high values.
419
- * ...
420
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-maxDateDelta)
391
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-maxDateDelta)
421
392
  */
422
393
  maxDateDelta ? : number|string
423
394
  /**
@@ -427,8 +398,7 @@ export declare type BryntumStartDateFieldProps = {
427
398
  maxHeight ? : string|number
428
399
  /**
429
400
  * *Only valid if this Widget is [floating](https://bryntum.com/products/schedulerpro/docs/api/Core/widget/Widget#config-floating).*
430
- * ...
431
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-maximizeOnMobile)
401
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-maximizeOnMobile)
432
402
  */
433
403
  maximizeOnMobile ? : number|string
434
404
  /**
@@ -448,8 +418,7 @@ export declare type BryntumStartDateFieldProps = {
448
418
  * Number of milliseconds to add to the project's start date (should be negative). Then, during editing,
449
419
  * the resulting date is assigned to the [min](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-min) property of the field,
450
420
  * preventing the user from entering too low values.
451
- * ...
452
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-minDateDelta)
421
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-minDateDelta)
453
422
  */
454
423
  minDateDelta ? : number|string
455
424
  /**
@@ -470,32 +439,27 @@ export declare type BryntumStartDateFieldProps = {
470
439
  * When this is configured as `true` a [ResizeObserver](https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver)
471
440
  * is used to monitor this element for size changes caused by either style manipulation, or by CSS
472
441
  * layout.
473
- * ...
474
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-monitorResize)
442
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-monitorResize)
443
+ * @property {boolean} immediate Set to `true` to receive resize notifications immediately.
475
444
  */
476
- monitorResize ? : Boolean|{
477
- immediate?: Boolean
478
- }
445
+ monitorResize ? : Boolean|object
479
446
  /**
480
447
  * Name of the field which is used as a key to get/set values from/to the field.
481
448
  * Used prior to [ref](https://bryntum.com/products/schedulerpro/docs/api/Core/widget/Widget#config-ref) and [id](#Core/widget/Widget#config-id) in
482
449
  * [Container.values](https://bryntum.com/products/schedulerpro/docs/api/Core/widget/Container#property-values).
483
- * ...
484
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-name)
450
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-name)
485
451
  */
486
452
  name ? : string
487
453
  /**
488
454
  * A reference to a partner TimeField which this DateField should sync its value with.
489
455
  * When the TimeField's value is changed, this DateField's value is updated to match.
490
456
  * When this DateField's value is changed, the TimeField's value is updated to match.
491
- * ...
492
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-partner)
457
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-partner)
493
458
  */
494
459
  partner ? : string|TimeField
495
460
  /**
496
461
  * A config object used to configure the [datePicker](https://bryntum.com/products/schedulerpro/docs/api/Core/widget/DatePicker).
497
- * ...
498
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-picker)
462
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-picker)
499
463
  */
500
464
  picker ? : DatePickerConfig
501
465
  /**
@@ -514,8 +478,7 @@ export declare type BryntumStartDateFieldProps = {
514
478
  * Set to `true` when a widget is rendered into another widget's [contentElement](https://bryntum.com/products/schedulerpro/docs/api/Core/widget/Widget#property-contentElement), but must
515
479
  * not participate in the standard layout of that widget, and must be positioned relatively to that
516
480
  * widget's [contentElement](https://bryntum.com/products/schedulerpro/docs/api/Core/widget/Widget#property-contentElement).
517
- * ...
518
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-positioned)
481
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-positioned)
519
482
  */
520
483
  positioned ? : Boolean
521
484
  /**
@@ -530,15 +493,13 @@ export declare type BryntumStartDateFieldProps = {
530
493
  /**
531
494
  * Makes the field unmodifiable by user action. The input area is not editable, and triggers
532
495
  * are unresponsive.
533
- * ...
534
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-readOnly)
496
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-readOnly)
535
497
  */
536
498
  readOnly ? : Boolean
537
499
  relayStoreEvents ? : Boolean
538
500
  /**
539
501
  * Predefined style to use for the field. Possible values are:
540
- * ...
541
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-rendition)
502
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-rendition)
542
503
  */
543
504
  rendition ? : 'outlined'|'filled'|string
544
505
  /**
@@ -557,23 +518,26 @@ export declare type BryntumStartDateFieldProps = {
557
518
  * Configure as `true` to have the component display a translucent ripple when its
558
519
  * [focusElement](https://bryntum.com/products/schedulerpro/docs/api/Core/widget/Widget#property-focusElement), or [element](#Core/widget/Widget#property-element) is tapped <em>if the
559
520
  * current theme supports ripples</em>. Out of the box, only the Material theme supports ripples.
560
- * ...
561
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-ripple)
521
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-ripple)
522
+ * @property {string} [delegate] A CSS selector to filter which child elements trigger ripples. By default, the ripple is clipped to the triggering element.
523
+ * @property {string} [color] A CSS color name or specification.
524
+ * @property {number} [radius] The ending radius of the ripple. Note that it will be clipped by the target element by default.
525
+ * @property {string} [clip] A string which describes how to clip the ripple if it is not to be clipped to the default element. Either the property of the widget to use as the clipping element, or a selector to allow clipping to the closest matching ancestor to the target element.
562
526
  */
563
- ripple ? : Boolean|{
564
- delegate?: string
565
- color?: string
566
- radius?: number
567
- clip?: string
568
- }
527
+ ripple ? : Boolean|object
528
+ /**
529
+ * The ARIA role to apply to this widget's element. By default, this is set to `'presentation'` to avoid
530
+ * accidentally applying a role which may interfere with screen readers.
531
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-role)
532
+ */
533
+ role ? : string
569
534
  /**
570
535
  * If you are rendering this widget to a shadow root inside a web component, set this config to the shadowRoot. If not inside a web component, set it to `document.body`
571
536
  */
572
537
  rootElement ? : ShadowRoot|HTMLElement
573
538
  /**
574
539
  * This may be configured as `true` to make the widget's element use the `direction:rtl` style.
575
- * ...
576
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-rtl)
540
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-rtl)
577
541
  */
578
542
  rtl ? : Boolean
579
543
  /**
@@ -583,8 +547,7 @@ export declare type BryntumStartDateFieldProps = {
583
547
  scrollAction ? : 'hide'|'realign'|null
584
548
  /**
585
549
  * *Only valid if this Widget is [floating](https://bryntum.com/products/schedulerpro/docs/api/Core/widget/Widget#config-floating).*
586
- * ...
587
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-showAnimation)
550
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-showAnimation)
588
551
  */
589
552
  showAnimation ? : Boolean|object
590
553
  /**
@@ -625,16 +588,14 @@ export declare type BryntumStartDateFieldProps = {
625
588
  /**
626
589
  * A flag which indicates whether the date parsing should be strict - meaning if the date
627
590
  * is missing a year/month/day part - parsing fails.
628
- * ...
629
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-strictParsing)
591
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-strictParsing)
630
592
  */
631
593
  strictParsing ? : Boolean
632
594
  /**
633
595
  * A configuration for the [tab](https://bryntum.com/products/schedulerpro/docs/api/Core/widget/Tab) created for this widget when it is placed in a
634
596
  * [TabPanel](https://bryntum.com/products/schedulerpro/docs/api/Core/widget/TabPanel). For example, this config can be used to control the icon of the `tab` for
635
597
  * this widget:
636
- * ...
637
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-tab)
598
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-tab)
638
599
  */
639
600
  tab ? : Boolean|TabConfig
640
601
  /**
@@ -642,14 +603,12 @@ export declare type BryntumStartDateFieldProps = {
642
603
  * is equivalent to natural tab order, but is unnecessary for fields since they are naturally tabbable
643
604
  * (i.e., accessible via the TAB key). Setting to `-1` disables tabbability but allows for focus to be set
644
605
  * to the element programmatically.
645
- * ...
646
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-tabIndex)
606
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-tabIndex)
647
607
  */
648
608
  tabIndex ? : number
649
609
  /**
650
610
  * Text alignment: 'left', 'center' or 'right'. Also accepts direction neutral 'start' and 'end'.
651
- * ...
652
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-textAlign)
611
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-textAlign)
653
612
  */
654
613
  textAlign ? : 'left'|'center'|'right'|'start'|'end'
655
614
  /**
@@ -658,22 +617,24 @@ export declare type BryntumStartDateFieldProps = {
658
617
  title ? : string
659
618
  /**
660
619
  * Tooltip for the widget, either as a string or as a Tooltip config object.
661
- * ...
662
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-tooltip)
620
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-tooltip)
663
621
  */
664
622
  tooltip ? : string|TooltipConfig|null
665
623
  /**
666
624
  * Widgets that trigger functionality upon click. Each trigger icon is a [Widget](https://bryntum.com/products/schedulerpro/docs/api/Core/widget/Widget) instance
667
625
  * which may be hidden, shown and observed and styled just like any other widget.
626
+ * @property {FieldTriggerConfig} triggers.expand Expands the date picker to select a date
627
+ * @property {FieldTriggerConfig} triggers.back Subtracts the [step](https://bryntum.com/products/schedulerpro/docs/api/Core/widget/DateField#config-step) from the current date
628
+ * @property {FieldTriggerConfig} triggers.forward Adds the [step](https://bryntum.com/products/schedulerpro/docs/api/Core/widget/DateField#config-step) to the current date
629
+ * @property {FieldTriggerConfig} triggers.clear Clears the field value, only available if this field is [clearable](https://bryntum.com/products/schedulerpro/docs/api/Core/widget/DateField#config-clearable)
668
630
  */
669
- triggers ? : Record<string, FieldTriggerConfig>|Record<string, Widget>
631
+ triggers ? : Record<string, FieldTriggerConfig>
670
632
  type ? : 'startdatefield'|'startdate'
671
633
  /**
672
634
  * Custom CSS class name suffixes to apply to the elements rendered by this widget. This may be specified
673
635
  * as a space separated string, an array of strings, or as an object in which property names with truthy
674
636
  * values are used as the class names.
675
- * ...
676
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-ui)
637
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-ui)
677
638
  */
678
639
  ui ? : string|object
679
640
  /**
@@ -704,14 +665,12 @@ export declare type BryntumStartDateFieldProps = {
704
665
  width ? : string|number
705
666
  /**
706
667
  * The x position for the widget.
707
- * ...
708
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-x)
668
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-x)
709
669
  */
710
670
  x ? : number
711
671
  /**
712
672
  * The y position for the widget.
713
- * ...
714
- * [View online docs...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-y)
673
+ * [More...](https://bryntum.com/products/schedulerpro/docs/api/SchedulerPro/widget/StartDateField#config-y)
715
674
  */
716
675
  y ? : number
717
676
 
@@ -0,0 +1,60 @@
1
+ <template>
2
+ <div ref="refElement" />
3
+ </template>
4
+
5
+ <script setup lang="ts">
6
+ import { onBeforeUnmount, onMounted, ref } from 'vue';
7
+ import { Combo, DomHelper, BrowserHelper } from '@bryntum/core-thin';
8
+
9
+ const refElement = ref<HTMLElement | null>(null);
10
+ let combo: Combo | null = null;
11
+
12
+ onMounted(() => {
13
+ combo = new Combo({
14
+ appendTo : refElement.value as HTMLElement,
15
+ store : {
16
+ data : [
17
+ { id : 'svalbard-light', text : 'Svalbard Light' },
18
+ { id : 'svalbard-dark', text : 'Svalbard Dark' },
19
+ { id : 'visby-light', text : 'Visby Light' },
20
+ { id : 'visby-dark', text : 'Visby Dark' },
21
+ { id : 'stockholm-light', text : 'Stockholm Light' },
22
+ { id : 'stockholm-dark', text : 'Stockholm Dark' },
23
+ { id : 'material3-light', text : 'Material3 Light' },
24
+ { id : 'material3-dark', text : 'Material3 Dark' },
25
+ { id : 'fluent2-light', text : 'Fluent2 Light' },
26
+ { id : 'fluent2-dark', text : 'Fluent2 Dark' },
27
+ { id : 'high-contrast-light', text : 'High Contrast Light' },
28
+ { id : 'high-contrast-dark', text : 'High Contrast Dark' }
29
+ ]
30
+ },
31
+ label : 'Theme',
32
+ width : '16em',
33
+ value : 'svalbard-light',
34
+ editable : false,
35
+ labelPosition : 'before',
36
+ ref : 'themeCombo',
37
+ listeners : {
38
+ change({ value }: { value: string }) {
39
+ DomHelper.setTheme(value).then((context: any) => {
40
+ if (context) {
41
+ const { theme, prev } = context;
42
+ document.body.classList.remove(`b-theme-${prev}`);
43
+ document.body.classList.add(`b-theme-${theme}`);
44
+ }
45
+ });
46
+ }
47
+ }
48
+ });
49
+
50
+ // Apply from search param
51
+ const theme = BrowserHelper.searchParam('theme');
52
+ if (theme) {
53
+ combo.value = theme;
54
+ }
55
+ });
56
+
57
+ onBeforeUnmount(() => {
58
+ combo?.destroy();
59
+ });
60
+ </script>