@vonage/vivid 5.3.0 → 5.5.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 (263) hide show
  1. package/accordion-item/definition.js +1 -1
  2. package/alert/definition.cjs +1 -1
  3. package/alert/definition.js +2 -2
  4. package/badge/definition.js +1 -1
  5. package/banner/definition.js +1 -1
  6. package/bundled/base-color-picker.cjs +18 -13
  7. package/bundled/base-color-picker.js +98 -81
  8. package/bundled/calendar-picker.template.cjs +7 -7
  9. package/bundled/calendar-picker.template.js +102 -102
  10. package/bundled/char-count.cjs +1 -1
  11. package/bundled/char-count.js +1 -1
  12. package/bundled/definition10.cjs +1 -1
  13. package/bundled/definition10.js +2 -2
  14. package/bundled/definition11.cjs +12 -19
  15. package/bundled/definition11.js +87 -66
  16. package/bundled/definition12.cjs +19 -10
  17. package/bundled/definition12.js +217 -36
  18. package/bundled/definition13.cjs +10 -1
  19. package/bundled/definition13.js +38 -14
  20. package/bundled/definition14.cjs +1 -5
  21. package/bundled/definition14.js +15 -24
  22. package/bundled/definition15.cjs +5 -30
  23. package/bundled/definition15.js +22 -73
  24. package/bundled/definition16.cjs +30 -19
  25. package/bundled/definition16.js +74 -97
  26. package/bundled/definition17.cjs +19 -13
  27. package/bundled/definition17.js +83 -117
  28. package/bundled/definition18.cjs +13 -12
  29. package/bundled/definition18.js +114 -71
  30. package/bundled/definition19.cjs +26 -27
  31. package/bundled/definition19.js +171 -180
  32. package/bundled/definition2.cjs +9 -9
  33. package/bundled/definition2.js +84 -129
  34. package/bundled/definition3.cjs +1 -1
  35. package/bundled/definition3.js +1 -1
  36. package/bundled/definition6.cjs +3 -3
  37. package/bundled/definition6.js +19 -19
  38. package/bundled/definition9.cjs +5 -5
  39. package/bundled/definition9.js +394 -392
  40. package/bundled/listbox.cjs +1 -1
  41. package/bundled/listbox.js +82 -102
  42. package/bundled/localized.cjs +1 -1
  43. package/bundled/localized.js +48 -31
  44. package/bundled/mixins.cjs +1 -1
  45. package/bundled/mixins.js +1 -1
  46. package/bundled/picker-field.template.cjs +14 -14
  47. package/bundled/picker-field.template.js +35 -56
  48. package/bundled/time-selection-picker.template.cjs +12 -12
  49. package/bundled/time-selection-picker.template.js +13 -12
  50. package/bundled/trapped-focus.cjs +1 -0
  51. package/bundled/trapped-focus.js +26 -0
  52. package/bundled/vivid-element.cjs +5 -1
  53. package/bundled/vivid-element.js +401 -358
  54. package/calendar/index.cjs +13 -13
  55. package/calendar/index.js +171 -143
  56. package/card/definition.cjs +1 -1
  57. package/card/definition.js +1 -1
  58. package/color-picker/definition.cjs +209 -113
  59. package/color-picker/definition.js +209 -113
  60. package/color-picker/index.cjs +104 -75
  61. package/color-picker/index.js +412 -326
  62. package/combobox/definition.cjs +7 -27
  63. package/combobox/definition.js +8 -28
  64. package/combobox/index.cjs +6 -6
  65. package/combobox/index.js +57 -71
  66. package/contextual-help/index.cjs +1 -1
  67. package/contextual-help/index.js +1 -1
  68. package/custom-elements.json +354 -2
  69. package/data-grid/index.cjs +1 -1
  70. package/data-grid/index.js +1 -1
  71. package/date-picker/definition.cjs +1 -1
  72. package/date-picker/definition.js +1 -1
  73. package/date-picker/index.cjs +1 -1
  74. package/date-picker/index.js +2 -2
  75. package/date-range-picker/definition.cjs +1 -1
  76. package/date-range-picker/definition.js +1 -1
  77. package/date-range-picker/index.cjs +1 -1
  78. package/date-range-picker/index.js +2 -2
  79. package/date-time-picker/definition.cjs +1 -1
  80. package/date-time-picker/definition.js +1 -1
  81. package/date-time-picker/index.cjs +1 -1
  82. package/date-time-picker/index.js +2 -2
  83. package/dial-pad/definition.cjs +139 -0
  84. package/dial-pad/definition.js +139 -0
  85. package/dial-pad/index.cjs +27 -20
  86. package/dial-pad/index.js +177 -100
  87. package/dialog/definition.cjs +2 -2
  88. package/dialog/definition.js +2 -2
  89. package/dialog/index.cjs +7 -7
  90. package/dialog/index.js +6 -6
  91. package/divider/index.cjs +1 -1
  92. package/divider/index.js +1 -1
  93. package/elevation/definition.cjs +1 -1
  94. package/elevation/definition.js +1 -1
  95. package/fab/definition.js +1 -1
  96. package/header/definition.cjs +1 -1
  97. package/header/definition.js +1 -1
  98. package/icon/definition.cjs +56 -22
  99. package/icon/definition.js +56 -22
  100. package/index.cjs +3 -4
  101. package/index.js +2 -3
  102. package/lib/accordion/accordion.d.ts +1 -1
  103. package/lib/accordion/definition.d.ts +1 -1
  104. package/lib/audio-player/audio-player.d.ts +1 -1
  105. package/lib/color-picker/color-picker.d.ts +390 -12
  106. package/lib/color-picker/locale.d.ts +4 -0
  107. package/lib/combobox/combobox.d.ts +1 -0
  108. package/lib/combobox/combobox.options.d.ts +1 -1
  109. package/lib/date-picker/date-picker.d.ts +38 -38
  110. package/lib/date-range-picker/date-range-picker.d.ts +20 -20
  111. package/lib/date-time-picker/date-time-picker.d.ts +40 -40
  112. package/lib/dial-pad/dial-pad.d.ts +1 -0
  113. package/lib/divider/divider.d.ts +1 -1
  114. package/lib/icon/icon.d.ts +1 -0
  115. package/lib/menu-item/menu-item-role.d.ts +1 -1
  116. package/lib/popup/popup.d.ts +1 -1
  117. package/lib/searchable-select/locale.d.ts +4 -0
  118. package/lib/searchable-select/searchable-select.d.ts +3 -0
  119. package/lib/select/select.d.ts +3 -1
  120. package/lib/simple-color-picker/simple-color-picker.d.ts +2 -1
  121. package/lib/slider/slider.d.ts +1 -1
  122. package/lib/tabs/tabs.d.ts +2 -2
  123. package/lib/text-area/text-area.d.ts +1 -1
  124. package/lib/text-field/text-field.d.ts +1 -1
  125. package/lib/time-picker/time-picker.d.ts +20 -20
  126. package/locales/de-DE.cjs +20 -3
  127. package/locales/de-DE.js +20 -3
  128. package/locales/en-GB.cjs +21 -4
  129. package/locales/en-GB.js +21 -4
  130. package/locales/en-US.cjs +21 -4
  131. package/locales/en-US.js +21 -4
  132. package/locales/ja-JP.cjs +20 -3
  133. package/locales/ja-JP.js +20 -3
  134. package/locales/zh-CN.cjs +19 -2
  135. package/locales/zh-CN.js +19 -2
  136. package/menu/definition.cjs +4 -4
  137. package/menu/definition.js +4 -4
  138. package/nav-disclosure/definition.js +1 -1
  139. package/nav-item/definition.js +1 -1
  140. package/note/definition.js +1 -1
  141. package/number-field/definition.js +1 -1
  142. package/number-field/index.cjs +1 -1
  143. package/number-field/index.js +3 -3
  144. package/option/definition.cjs +6 -77
  145. package/option/definition.js +3 -78
  146. package/option/index.cjs +1 -1
  147. package/option/index.js +1 -1
  148. package/package.json +31 -5
  149. package/popup/definition.cjs +2 -2
  150. package/popup/definition.js +2 -2
  151. package/progress-ring/index.cjs +1 -1
  152. package/progress-ring/index.js +1 -1
  153. package/radio/index.cjs +1 -1
  154. package/radio/index.js +1 -1
  155. package/radio-group/index.cjs +1 -1
  156. package/radio-group/index.js +1 -1
  157. package/range-slider/definition.cjs +1 -1
  158. package/range-slider/definition.js +1 -1
  159. package/rich-text-editor/definition.cjs +2 -3
  160. package/rich-text-editor/definition.js +1 -2
  161. package/rich-text-editor/index.cjs +27 -27
  162. package/rich-text-editor/index.js +1209 -1199
  163. package/searchable-select/definition.cjs +103 -11
  164. package/searchable-select/definition.js +103 -11
  165. package/searchable-select/index.cjs +81 -69
  166. package/searchable-select/index.js +359 -273
  167. package/select/definition.cjs +30 -44
  168. package/select/definition.js +30 -44
  169. package/selectable-box/definition.cjs +1 -1
  170. package/selectable-box/definition.js +1 -1
  171. package/selectable-box/index.cjs +1 -1
  172. package/selectable-box/index.js +2 -2
  173. package/shared/aria/aria-mixin.d.ts +1 -1
  174. package/shared/color-picker/base-color-picker.d.ts +2 -1
  175. package/shared/foundation/listbox/listbox.d.ts +4 -0
  176. package/shared/picker-field/mixins/calendar-picker.d.ts +10 -10
  177. package/shared/picker-field/mixins/calendar-picker.template.d.ts +10 -10
  178. package/shared/picker-field/mixins/min-max-calendar-picker.d.ts +20 -20
  179. package/shared/picker-field/mixins/single-date-picker.d.ts +28 -28
  180. package/shared/picker-field/mixins/single-value-picker.d.ts +8 -8
  181. package/shared/picker-field/mixins/time-selection-picker.d.ts +20 -20
  182. package/shared/picker-field/mixins/time-selection-picker.template.d.ts +20 -20
  183. package/simple-color-picker/definition.cjs +9 -7
  184. package/simple-color-picker/definition.js +9 -7
  185. package/simple-color-picker/index.cjs +6 -6
  186. package/simple-color-picker/index.js +41 -39
  187. package/slider/definition.cjs +1 -1
  188. package/slider/definition.js +1 -1
  189. package/split-button/definition.js +1 -1
  190. package/styles/core/all.css +1 -1
  191. package/styles/core/theme.css +1 -1
  192. package/styles/core/typography.css +1 -1
  193. package/styles/tokens/theme-dark.css +4 -4
  194. package/styles/tokens/theme-light.css +4 -4
  195. package/styles/tokens/vivid-2-compat.css +1 -1
  196. package/tab/definition.js +1 -1
  197. package/tag/definition.cjs +34 -14
  198. package/tag/definition.js +35 -15
  199. package/tag/index.cjs +25 -12
  200. package/tag/index.js +64 -47
  201. package/tag-group/definition.cjs +1 -2
  202. package/tag-group/definition.js +1 -2
  203. package/tag-group/index.cjs +1 -1
  204. package/tag-group/index.js +11 -12
  205. package/text-area/index.cjs +1 -1
  206. package/text-area/index.js +2 -2
  207. package/text-field/definition.js +1 -1
  208. package/time-picker/definition.cjs +1 -1
  209. package/time-picker/definition.js +1 -1
  210. package/time-picker/index.cjs +1 -1
  211. package/time-picker/index.js +1 -1
  212. package/toggletip/definition.cjs +1 -1
  213. package/toggletip/definition.js +1 -1
  214. package/toggletip/index.cjs +1 -1
  215. package/toggletip/index.js +1 -1
  216. package/tooltip/definition.cjs +3 -3
  217. package/tooltip/definition.js +3 -3
  218. package/tooltip/index.cjs +1 -1
  219. package/tooltip/index.js +1 -1
  220. package/tree-item/definition.cjs +1 -1
  221. package/tree-item/definition.js +1 -1
  222. package/tree-view/definition.cjs +1 -1
  223. package/tree-view/definition.js +1 -1
  224. package/unbundled/affix.js +1 -1
  225. package/unbundled/base-color-picker.cjs +36 -18
  226. package/unbundled/base-color-picker.js +36 -18
  227. package/unbundled/calendar-picker.template.cjs +2 -2
  228. package/unbundled/calendar-picker.template.js +2 -2
  229. package/unbundled/definition.js +1 -1
  230. package/unbundled/definition2.js +1 -1
  231. package/unbundled/definition3.cjs +222 -141
  232. package/unbundled/definition3.js +220 -139
  233. package/unbundled/definition4.cjs +145 -235
  234. package/unbundled/definition4.js +143 -233
  235. package/unbundled/definition5.cjs +269 -27
  236. package/unbundled/definition5.js +267 -26
  237. package/unbundled/definition6.cjs +56 -0
  238. package/unbundled/definition6.js +52 -0
  239. package/unbundled/listbox.cjs +41 -63
  240. package/unbundled/listbox.js +39 -61
  241. package/unbundled/picker-field.template.cjs +3 -36
  242. package/unbundled/picker-field.template.js +3 -35
  243. package/unbundled/slider.template.cjs +1 -1
  244. package/unbundled/slider.template.js +1 -1
  245. package/unbundled/time-selection-picker.template.cjs +2 -1
  246. package/unbundled/time-selection-picker.template.js +2 -1
  247. package/unbundled/trapped-focus.cjs +37 -0
  248. package/unbundled/trapped-focus.js +34 -0
  249. package/unbundled/vivid-element.cjs +1 -1
  250. package/unbundled/vivid-element.js +1 -1
  251. package/video-player/definition.cjs +56 -16
  252. package/video-player/definition.js +56 -16
  253. package/video-player/index.cjs +36 -36
  254. package/video-player/index.js +2461 -2445
  255. package/visually-hidden/index.cjs +1 -1
  256. package/visually-hidden/index.js +1 -1
  257. package/vivid.api.json +285 -38
  258. package/bundled/_has.cjs +0 -1
  259. package/bundled/_has.js +0 -34
  260. package/bundled/option.cjs +0 -1
  261. package/bundled/option.js +0 -158
  262. package/unbundled/option.cjs +0 -217
  263. package/unbundled/option.js +0 -214
@@ -1,217 +0,0 @@
1
- 'use strict';
2
-
3
- const fastElement = require('@microsoft/fast-element');
4
- const fastWebUtilities = require('@microsoft/fast-web-utilities');
5
- const affix = require('./affix.cjs');
6
- const vividElement = require('./vivid-element.cjs');
7
- const hostSemantics = require('./host-semantics.cjs');
8
-
9
- var __defProp = Object.defineProperty;
10
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
11
- var __decorateClass = (decorators, target, key, kind) => {
12
- var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
13
- for (var i = decorators.length - 1, decorator; i >= 0; i--)
14
- if (decorator = decorators[i])
15
- result = (kind ? decorator(target, key, result) : decorator(result)) || result;
16
- if (kind && result) __defProp(target, key, result);
17
- return result;
18
- };
19
- function isListboxOption(el) {
20
- return fastWebUtilities.isHTMLElement(el) && (el.getAttribute("role") === "option" || el instanceof HTMLOptionElement || el instanceof ListboxOption);
21
- }
22
- class ListboxOption extends hostSemantics.HostSemantics(
23
- affix.AffixIconWithTrailing(vividElement.VividElement)
24
- ) {
25
- constructor(text, value, defaultSelected, selected) {
26
- super();
27
- this.defaultSelected = false;
28
- /**
29
- * Tracks whether the "selected" property has been changed.
30
- * @internal
31
- */
32
- this.dirtySelected = false;
33
- // eslint-disable-next-line @repo/repo/no-attribute-default-value
34
- this.value = "";
35
- this._highlighted = false;
36
- this._displayCheckmark = false;
37
- this._vvdSearchText = "";
38
- this._isNotMatching = false;
39
- if (text) {
40
- this.text = text;
41
- }
42
- if (value) {
43
- this.value = value;
44
- }
45
- if (defaultSelected) {
46
- this.defaultSelected = defaultSelected;
47
- }
48
- if (selected) {
49
- this.selected = selected;
50
- }
51
- this.proxy = new Option(
52
- this.text,
53
- this.value,
54
- this.defaultSelected,
55
- this.selected
56
- );
57
- this.proxy.disabled = this.disabled;
58
- }
59
- defaultSelectedChanged() {
60
- if (!this.dirtySelected) {
61
- this.selected = this.defaultSelected;
62
- if (this.proxy instanceof HTMLOptionElement) {
63
- this.proxy.selected = this.defaultSelected;
64
- }
65
- }
66
- if (this.proxy instanceof HTMLOptionElement) {
67
- this.proxy.defaultSelected = this.defaultSelected;
68
- }
69
- }
70
- disabledChanged() {
71
- if (this.proxy instanceof HTMLOptionElement) {
72
- this.proxy.disabled = this.disabled;
73
- }
74
- }
75
- /**
76
- * @deprecated Use `defaultSelected` instead.
77
- */
78
- get selectedAttribute() {
79
- return this.defaultSelected;
80
- }
81
- set selectedAttribute(value) {
82
- this.defaultSelected = value;
83
- }
84
- selectedChanged() {
85
- if (!this.dirtySelected) {
86
- this.dirtySelected = true;
87
- }
88
- if (this.proxy instanceof HTMLOptionElement) {
89
- this.proxy.selected = this.selected;
90
- }
91
- }
92
- valueChanged() {
93
- if (typeof this.value !== "string") {
94
- this.value = "";
95
- return;
96
- }
97
- if (this.proxy instanceof HTMLOptionElement) {
98
- this.proxy.value = this.value;
99
- }
100
- }
101
- get label() {
102
- return this._label ?? this.text;
103
- }
104
- set label(value) {
105
- this._label = value;
106
- }
107
- set text(value) {
108
- this._text = value;
109
- }
110
- get text() {
111
- return this._text ?? "";
112
- }
113
- /**
114
- * Provides an accessible name for use by parent components.
115
- * Note: Does not implement full accessible name computation, e.g. slotted content is missed.
116
- * @internal
117
- */
118
- _getAccessibleName() {
119
- return this.ariaLabel || `${this.text}${this.textSecondary ? ` ${this.textSecondary}` : ""}`;
120
- }
121
- get form() {
122
- return null;
123
- }
124
- get _hasMatchedText() {
125
- return Boolean(this.matchedText ?? this._vvdSearchText);
126
- }
127
- get _matchedRange() {
128
- const matchedText = this.matchedText ?? this._vvdSearchText;
129
- if (matchedText) {
130
- const matchIndex = this.text.toLowerCase().indexOf(matchedText.toLowerCase());
131
- return matchIndex === -1 ? { from: 0, to: 0 } : {
132
- from: matchIndex,
133
- to: matchIndex + matchedText.length
134
- };
135
- }
136
- return { from: 0, to: 0 };
137
- }
138
- /**
139
- * @internal
140
- */
141
- connectedCallback() {
142
- super.connectedCallback();
143
- if (!this.dirtySelected) {
144
- this.selected = this.defaultSelected;
145
- this.dirtySelected = false;
146
- }
147
- }
148
- }
149
- __decorateClass([
150
- fastElement.attr({
151
- converter: {
152
- fromView: (value) => {
153
- if (value === true || value === "true") {
154
- return true;
155
- }
156
- if (value === false || value === "false") {
157
- return false;
158
- }
159
- return void 0;
160
- },
161
- toView: (value) => value
162
- }
163
- })
164
- ], ListboxOption.prototype, "checked", 2);
165
- __decorateClass([
166
- fastElement.attr({ attribute: "selected", mode: "boolean" })
167
- ], ListboxOption.prototype, "defaultSelected", 2);
168
- // @ts-expect-error Type is incorrectly non-optional
169
- __decorateClass([
170
- fastElement.attr({ mode: "boolean" })
171
- ], ListboxOption.prototype, "disabled", 2);
172
- __decorateClass([
173
- fastElement.attr({ attribute: "current-selected", mode: "boolean" })
174
- ], ListboxOption.prototype, "selected", 2);
175
- __decorateClass([
176
- fastElement.attr({ attribute: "value" })
177
- ], ListboxOption.prototype, "value", 2);
178
- __decorateClass([
179
- fastElement.attr({
180
- attribute: "label"
181
- })
182
- ], ListboxOption.prototype, "_label", 2);
183
- __decorateClass([
184
- fastElement.attr({
185
- attribute: "text"
186
- })
187
- ], ListboxOption.prototype, "_text", 2);
188
- __decorateClass([
189
- fastElement.attr({ attribute: "text-secondary" })
190
- ], ListboxOption.prototype, "textSecondary", 2);
191
- __decorateClass([
192
- fastElement.observable
193
- ], ListboxOption.prototype, "_highlighted", 2);
194
- __decorateClass([
195
- fastElement.observable
196
- ], ListboxOption.prototype, "_displayCheckmark", 2);
197
- __decorateClass([
198
- fastElement.attr({ attribute: "matched-text" })
199
- ], ListboxOption.prototype, "matchedText", 2);
200
- __decorateClass([
201
- fastElement.observable
202
- ], ListboxOption.prototype, "_vvdSearchText", 2);
203
- __decorateClass([
204
- fastElement.volatile
205
- ], ListboxOption.prototype, "_hasMatchedText", 1);
206
- __decorateClass([
207
- fastElement.observable
208
- ], ListboxOption.prototype, "_isNotMatching", 2);
209
- __decorateClass([
210
- fastElement.volatile
211
- ], ListboxOption.prototype, "_matchedRange", 1);
212
- __decorateClass([
213
- fastElement.attr({ attribute: "tag-connotation" })
214
- ], ListboxOption.prototype, "tagConnotation", 2);
215
-
216
- exports.ListboxOption = ListboxOption;
217
- exports.isListboxOption = isListboxOption;
@@ -1,214 +0,0 @@
1
- import { attr, observable, volatile } from '@microsoft/fast-element';
2
- import { isHTMLElement } from '@microsoft/fast-web-utilities';
3
- import { A as AffixIconWithTrailing } from './affix.js';
4
- import { V as VividElement } from './vivid-element.js';
5
- import { H as HostSemantics } from './host-semantics.js';
6
-
7
- var __defProp = Object.defineProperty;
8
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
9
- var __decorateClass = (decorators, target, key, kind) => {
10
- var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
11
- for (var i = decorators.length - 1, decorator; i >= 0; i--)
12
- if (decorator = decorators[i])
13
- result = (kind ? decorator(target, key, result) : decorator(result)) || result;
14
- if (kind && result) __defProp(target, key, result);
15
- return result;
16
- };
17
- function isListboxOption(el) {
18
- return isHTMLElement(el) && (el.getAttribute("role") === "option" || el instanceof HTMLOptionElement || el instanceof ListboxOption);
19
- }
20
- class ListboxOption extends HostSemantics(
21
- AffixIconWithTrailing(VividElement)
22
- ) {
23
- constructor(text, value, defaultSelected, selected) {
24
- super();
25
- this.defaultSelected = false;
26
- /**
27
- * Tracks whether the "selected" property has been changed.
28
- * @internal
29
- */
30
- this.dirtySelected = false;
31
- // eslint-disable-next-line @repo/repo/no-attribute-default-value
32
- this.value = "";
33
- this._highlighted = false;
34
- this._displayCheckmark = false;
35
- this._vvdSearchText = "";
36
- this._isNotMatching = false;
37
- if (text) {
38
- this.text = text;
39
- }
40
- if (value) {
41
- this.value = value;
42
- }
43
- if (defaultSelected) {
44
- this.defaultSelected = defaultSelected;
45
- }
46
- if (selected) {
47
- this.selected = selected;
48
- }
49
- this.proxy = new Option(
50
- this.text,
51
- this.value,
52
- this.defaultSelected,
53
- this.selected
54
- );
55
- this.proxy.disabled = this.disabled;
56
- }
57
- defaultSelectedChanged() {
58
- if (!this.dirtySelected) {
59
- this.selected = this.defaultSelected;
60
- if (this.proxy instanceof HTMLOptionElement) {
61
- this.proxy.selected = this.defaultSelected;
62
- }
63
- }
64
- if (this.proxy instanceof HTMLOptionElement) {
65
- this.proxy.defaultSelected = this.defaultSelected;
66
- }
67
- }
68
- disabledChanged() {
69
- if (this.proxy instanceof HTMLOptionElement) {
70
- this.proxy.disabled = this.disabled;
71
- }
72
- }
73
- /**
74
- * @deprecated Use `defaultSelected` instead.
75
- */
76
- get selectedAttribute() {
77
- return this.defaultSelected;
78
- }
79
- set selectedAttribute(value) {
80
- this.defaultSelected = value;
81
- }
82
- selectedChanged() {
83
- if (!this.dirtySelected) {
84
- this.dirtySelected = true;
85
- }
86
- if (this.proxy instanceof HTMLOptionElement) {
87
- this.proxy.selected = this.selected;
88
- }
89
- }
90
- valueChanged() {
91
- if (typeof this.value !== "string") {
92
- this.value = "";
93
- return;
94
- }
95
- if (this.proxy instanceof HTMLOptionElement) {
96
- this.proxy.value = this.value;
97
- }
98
- }
99
- get label() {
100
- return this._label ?? this.text;
101
- }
102
- set label(value) {
103
- this._label = value;
104
- }
105
- set text(value) {
106
- this._text = value;
107
- }
108
- get text() {
109
- return this._text ?? "";
110
- }
111
- /**
112
- * Provides an accessible name for use by parent components.
113
- * Note: Does not implement full accessible name computation, e.g. slotted content is missed.
114
- * @internal
115
- */
116
- _getAccessibleName() {
117
- return this.ariaLabel || `${this.text}${this.textSecondary ? ` ${this.textSecondary}` : ""}`;
118
- }
119
- get form() {
120
- return null;
121
- }
122
- get _hasMatchedText() {
123
- return Boolean(this.matchedText ?? this._vvdSearchText);
124
- }
125
- get _matchedRange() {
126
- const matchedText = this.matchedText ?? this._vvdSearchText;
127
- if (matchedText) {
128
- const matchIndex = this.text.toLowerCase().indexOf(matchedText.toLowerCase());
129
- return matchIndex === -1 ? { from: 0, to: 0 } : {
130
- from: matchIndex,
131
- to: matchIndex + matchedText.length
132
- };
133
- }
134
- return { from: 0, to: 0 };
135
- }
136
- /**
137
- * @internal
138
- */
139
- connectedCallback() {
140
- super.connectedCallback();
141
- if (!this.dirtySelected) {
142
- this.selected = this.defaultSelected;
143
- this.dirtySelected = false;
144
- }
145
- }
146
- }
147
- __decorateClass([
148
- attr({
149
- converter: {
150
- fromView: (value) => {
151
- if (value === true || value === "true") {
152
- return true;
153
- }
154
- if (value === false || value === "false") {
155
- return false;
156
- }
157
- return void 0;
158
- },
159
- toView: (value) => value
160
- }
161
- })
162
- ], ListboxOption.prototype, "checked", 2);
163
- __decorateClass([
164
- attr({ attribute: "selected", mode: "boolean" })
165
- ], ListboxOption.prototype, "defaultSelected", 2);
166
- // @ts-expect-error Type is incorrectly non-optional
167
- __decorateClass([
168
- attr({ mode: "boolean" })
169
- ], ListboxOption.prototype, "disabled", 2);
170
- __decorateClass([
171
- attr({ attribute: "current-selected", mode: "boolean" })
172
- ], ListboxOption.prototype, "selected", 2);
173
- __decorateClass([
174
- attr({ attribute: "value" })
175
- ], ListboxOption.prototype, "value", 2);
176
- __decorateClass([
177
- attr({
178
- attribute: "label"
179
- })
180
- ], ListboxOption.prototype, "_label", 2);
181
- __decorateClass([
182
- attr({
183
- attribute: "text"
184
- })
185
- ], ListboxOption.prototype, "_text", 2);
186
- __decorateClass([
187
- attr({ attribute: "text-secondary" })
188
- ], ListboxOption.prototype, "textSecondary", 2);
189
- __decorateClass([
190
- observable
191
- ], ListboxOption.prototype, "_highlighted", 2);
192
- __decorateClass([
193
- observable
194
- ], ListboxOption.prototype, "_displayCheckmark", 2);
195
- __decorateClass([
196
- attr({ attribute: "matched-text" })
197
- ], ListboxOption.prototype, "matchedText", 2);
198
- __decorateClass([
199
- observable
200
- ], ListboxOption.prototype, "_vvdSearchText", 2);
201
- __decorateClass([
202
- volatile
203
- ], ListboxOption.prototype, "_hasMatchedText", 1);
204
- __decorateClass([
205
- observable
206
- ], ListboxOption.prototype, "_isNotMatching", 2);
207
- __decorateClass([
208
- volatile
209
- ], ListboxOption.prototype, "_matchedRange", 1);
210
- __decorateClass([
211
- attr({ attribute: "tag-connotation" })
212
- ], ListboxOption.prototype, "tagConnotation", 2);
213
-
214
- export { ListboxOption as L, isListboxOption as i };