@vonage/vivid 3.49.0-preview.1 → 3.50.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 (205) hide show
  1. package/accordion/index.cjs +1 -1
  2. package/accordion/index.js +1 -1
  3. package/accordion-item/index.cjs +1 -1
  4. package/accordion-item/index.js +1 -1
  5. package/alert/index.cjs +2 -2
  6. package/alert/index.js +2 -2
  7. package/appearance-ui/index.cjs +1 -1
  8. package/appearance-ui/index.js +1 -1
  9. package/audio-player/index.cjs +1 -1
  10. package/audio-player/index.js +1 -1
  11. package/banner/index.cjs +1 -1
  12. package/banner/index.js +1 -1
  13. package/breadcrumb-item/index.cjs +1 -1
  14. package/breadcrumb-item/index.js +1 -1
  15. package/button/index.cjs +1 -1
  16. package/button/index.js +1 -1
  17. package/card/index.cjs +1 -1
  18. package/card/index.js +1 -1
  19. package/checkbox/index.cjs +1 -2
  20. package/checkbox/index.js +1 -2
  21. package/combobox/index.cjs +3 -3
  22. package/combobox/index.js +3 -3
  23. package/custom-elements.json +859 -146
  24. package/date-picker/index.cjs +4 -3
  25. package/date-picker/index.js +4 -3
  26. package/date-range-picker/index.cjs +3 -2
  27. package/date-range-picker/index.js +3 -2
  28. package/dialog/index.cjs +2 -2
  29. package/dialog/index.js +2 -2
  30. package/elevation/index.cjs +1 -1
  31. package/elevation/index.js +1 -1
  32. package/fab/index.cjs +1 -1
  33. package/fab/index.js +1 -1
  34. package/file-picker/index.cjs +1 -1
  35. package/file-picker/index.js +1 -1
  36. package/focus/index.cjs +1 -1
  37. package/focus/index.js +1 -1
  38. package/header/index.cjs +1 -1
  39. package/header/index.js +1 -1
  40. package/index.cjs +21 -16
  41. package/index.js +10 -8
  42. package/lib/components.d.ts +1 -0
  43. package/lib/time-picker/definition.d.ts +3 -0
  44. package/lib/time-picker/locale.d.ts +12 -0
  45. package/lib/time-picker/time/picker.d.ts +9 -0
  46. package/lib/time-picker/time/presentationTime.d.ts +5 -0
  47. package/lib/time-picker/time/time.d.ts +15 -0
  48. package/lib/time-picker/time-picker.d.ts +16 -0
  49. package/lib/time-picker/time-picker.form-associated.d.ts +10 -0
  50. package/lib/time-picker/time-picker.template.d.ts +4 -0
  51. package/listbox/index.cjs +2 -2
  52. package/listbox/index.js +2 -2
  53. package/locales/en-GB.cjs +15 -0
  54. package/locales/en-GB.js +15 -0
  55. package/locales/en-US.cjs +15 -0
  56. package/locales/en-US.js +15 -0
  57. package/locales/ja-JP.cjs +15 -0
  58. package/locales/ja-JP.js +15 -0
  59. package/locales/zh-CN.cjs +15 -0
  60. package/locales/zh-CN.js +15 -0
  61. package/menu/index.cjs +3 -3
  62. package/menu/index.js +3 -3
  63. package/menu-item/index.cjs +1 -1
  64. package/menu-item/index.js +1 -1
  65. package/nav-disclosure/index.cjs +1 -1
  66. package/nav-disclosure/index.js +1 -1
  67. package/nav-item/index.cjs +1 -1
  68. package/nav-item/index.js +1 -1
  69. package/number-field/index.cjs +1 -1
  70. package/number-field/index.js +1 -1
  71. package/option/index.cjs +1 -1
  72. package/option/index.js +1 -1
  73. package/package.json +1 -1
  74. package/pagination/index.cjs +1 -1
  75. package/pagination/index.js +1 -1
  76. package/popup/index.cjs +3 -3
  77. package/popup/index.js +3 -3
  78. package/radio/index.cjs +1 -2
  79. package/radio/index.js +1 -2
  80. package/select/index.cjs +3 -3
  81. package/select/index.js +3 -3
  82. package/selectable-box/index.cjs +2 -2
  83. package/selectable-box/index.js +2 -2
  84. package/shared/date-picker/date-picker-base.d.ts +2 -2
  85. package/shared/definition.cjs +1 -1
  86. package/shared/definition.js +1 -1
  87. package/shared/definition11.cjs +1 -1
  88. package/shared/definition11.js +1 -1
  89. package/shared/definition14.cjs +1 -1
  90. package/shared/definition14.js +1 -1
  91. package/shared/definition15.cjs +2 -5
  92. package/shared/definition15.js +2 -5
  93. package/shared/definition16.cjs +3 -3
  94. package/shared/definition16.js +3 -3
  95. package/shared/definition18.cjs +2 -2
  96. package/shared/definition18.js +2 -2
  97. package/shared/definition19.cjs +2 -2
  98. package/shared/definition19.js +2 -2
  99. package/shared/definition20.cjs +1 -1
  100. package/shared/definition20.js +1 -1
  101. package/shared/definition23.cjs +1 -1
  102. package/shared/definition23.js +1 -1
  103. package/shared/definition24.cjs +1 -1
  104. package/shared/definition24.js +1 -1
  105. package/shared/definition25.cjs +1 -1
  106. package/shared/definition25.js +1 -1
  107. package/shared/definition28.cjs +1 -1
  108. package/shared/definition28.js +1 -1
  109. package/shared/definition29.cjs +1 -1
  110. package/shared/definition29.js +1 -1
  111. package/shared/definition3.cjs +1 -1
  112. package/shared/definition3.js +1 -1
  113. package/shared/definition30.cjs +1 -1
  114. package/shared/definition30.js +1 -1
  115. package/shared/definition31.cjs +1 -1
  116. package/shared/definition31.js +1 -1
  117. package/shared/definition34.cjs +1 -1
  118. package/shared/definition34.js +1 -1
  119. package/shared/definition35.cjs +1 -1
  120. package/shared/definition35.js +1 -1
  121. package/shared/definition4.cjs +4 -2
  122. package/shared/definition4.js +4 -2
  123. package/shared/definition40.cjs +3 -6
  124. package/shared/definition40.js +3 -6
  125. package/shared/definition41.cjs +3 -3
  126. package/shared/definition41.js +3 -3
  127. package/shared/definition42.cjs +1 -1
  128. package/shared/definition42.js +1 -1
  129. package/shared/definition44.cjs +1 -1
  130. package/shared/definition44.js +1 -1
  131. package/shared/definition45.cjs +1 -1
  132. package/shared/definition45.js +1 -1
  133. package/shared/definition46.cjs +2 -2
  134. package/shared/definition46.js +2 -2
  135. package/shared/definition48.cjs +1 -1
  136. package/shared/definition48.js +1 -1
  137. package/shared/definition5.cjs +1 -1
  138. package/shared/definition5.js +1 -1
  139. package/shared/definition51.cjs +1 -1
  140. package/shared/definition51.js +1 -1
  141. package/shared/definition52.cjs +2 -2
  142. package/shared/definition52.js +2 -2
  143. package/shared/definition53.cjs +3 -3
  144. package/shared/definition53.js +3 -3
  145. package/shared/definition54.cjs +769 -91
  146. package/shared/definition54.js +768 -90
  147. package/shared/definition55.cjs +76 -58
  148. package/shared/definition55.js +75 -57
  149. package/shared/definition56.cjs +100 -71
  150. package/shared/definition56.js +99 -70
  151. package/shared/definition57.cjs +80 -291
  152. package/shared/definition57.js +81 -292
  153. package/shared/definition58.cjs +303 -13
  154. package/shared/definition58.js +302 -13
  155. package/shared/definition59.cjs +11 -42
  156. package/shared/definition59.js +11 -41
  157. package/shared/definition60.cjs +23 -1782
  158. package/shared/definition60.js +22 -1781
  159. package/shared/definition61.cjs +1810 -0
  160. package/shared/definition61.js +1806 -0
  161. package/shared/definition9.cjs +1 -1
  162. package/shared/definition9.js +1 -1
  163. package/shared/localization/Locale.d.ts +2 -0
  164. package/shared/patterns/index.d.ts +1 -0
  165. package/shared/patterns/trapped-focus.d.ts +4 -0
  166. package/shared/presentationDate.cjs +11 -25
  167. package/shared/presentationDate.js +11 -25
  168. package/shared/text-field.cjs +1 -1
  169. package/shared/text-field.js +1 -1
  170. package/shared/trapped-focus.cjs +29 -0
  171. package/shared/trapped-focus.js +27 -0
  172. package/slider/index.cjs +1 -1
  173. package/slider/index.js +1 -1
  174. package/split-button/index.cjs +1 -1
  175. package/split-button/index.js +1 -1
  176. package/style.css +1 -1
  177. package/styles/core/all.css +1 -1
  178. package/styles/core/theme.css +1 -1
  179. package/styles/core/typography.css +1 -1
  180. package/styles/tokens/theme-dark.css +4 -4
  181. package/styles/tokens/theme-light.css +4 -4
  182. package/styles/tokens/vivid-2-compat.css +1 -1
  183. package/switch/index.cjs +1 -1
  184. package/switch/index.js +1 -1
  185. package/tab/index.cjs +1 -1
  186. package/tab/index.js +1 -1
  187. package/tabs/index.cjs +1 -1
  188. package/tabs/index.js +1 -1
  189. package/tag/index.cjs +1 -1
  190. package/tag/index.js +1 -1
  191. package/text-area/index.cjs +1 -1
  192. package/text-area/index.js +1 -1
  193. package/text-field/index.cjs +1 -1
  194. package/text-field/index.js +1 -1
  195. package/time-picker/index.cjs +38 -0
  196. package/time-picker/index.js +36 -0
  197. package/toggletip/index.cjs +4 -4
  198. package/toggletip/index.js +4 -4
  199. package/tooltip/index.cjs +4 -4
  200. package/tooltip/index.js +4 -4
  201. package/tree-item/index.cjs +2 -2
  202. package/tree-item/index.js +2 -2
  203. package/tree-view/index.cjs +1 -1
  204. package/tree-view/index.js +1 -1
  205. package/vivid.api.json +105 -0
@@ -1,7 +1,7 @@
1
1
  import { D as DOM, O as Observable, _ as __decorate, a as attr, o as observable, h as html, r as registerFactory } from './index.js';
2
2
  import { a as iconRegistries } from './definition26.js';
3
- import { P as Popup, p as popupRegistries } from './definition60.js';
4
- import { f as focusRegistries } from './definition58.js';
3
+ import { P as Popup, p as popupRegistries } from './definition61.js';
4
+ import { f as focusRegistries } from './definition59.js';
5
5
  import { a as listboxOptionRegistries } from './definition35.js';
6
6
  import { s as styles$1 } from './text-field.js';
7
7
  import { A as AffixIcon, a as affixIconTemplateFactory } from './affix.js';
@@ -621,7 +621,7 @@ __decorate([
621
621
  applyMixins(DelegatesARIACombobox, DelegatesARIAListbox);
622
622
  applyMixins(Combobox$1, StartEnd, DelegatesARIACombobox);
623
623
 
624
- const styles = ":host{position:relative}.base{--_text-field-gutter-end: 44px}.icon{inset-inline-end:16px;inset-inline-start:unset}:not(.disabled) .icon{cursor:pointer}.disabled .icon{cursor:not-allowed}.listbox{padding:4px;background-color:var(--_appearance-color-fill);border-radius:8px;box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);contain:paint}.listbox{--_connotation-color-backdrop: var(--vvd-combobox-accent-backdrop, var(--vvd-color-canvas));--_connotation-color-intermediate: var(--vvd-combobox-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-primary: var(--vvd-combobox-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-soft: var(--vvd-combobox-accent-soft, var(--vvd-color-neutral-100))}.listbox{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--_connotation-color-backdrop);--_appearance-color-outline: var(--_connotation-color-intermediate)}.listbox.appearance-ghost{--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.listbox:where(:disabled,.disabled){--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.listbox:where(:disabled,.disabled).appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}::part(popup-base){inline-size:100%}\n";
624
+ const styles = ":host{position:relative}.base{--_text-field-gutter-end: 44px}.icon{inset-inline-end:16px;inset-inline-start:unset}:not(.disabled) .icon{cursor:pointer}.disabled .icon{cursor:not-allowed}.listbox{padding:4px;background-color:var(--_appearance-color-fill);border-radius:8px;box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);contain:paint}.listbox{--_connotation-color-intermediate: var(--vvd-combobox-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-primary: var(--vvd-combobox-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-soft: var(--vvd-combobox-accent-soft, var(--vvd-color-neutral-100))}.listbox{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--_connotation-color-intermediate)}.listbox.appearance-ghost{--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.listbox:where(:disabled,.disabled){--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.listbox:where(:disabled,.disabled).appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}::part(popup-base){inline-size:100%}\n";
625
625
 
626
626
  var __defProp = Object.defineProperty;
627
627
  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -1,8 +1,8 @@
1
1
  'use strict';
2
2
 
3
3
  const index = require('./index.cjs');
4
- const definition$1 = require('./definition60.cjs');
5
- const definition$3 = require('./definition58.cjs');
4
+ const definition$1 = require('./definition61.cjs');
5
+ const definition$3 = require('./definition59.cjs');
6
6
  const definition = require('./definition11.cjs');
7
7
  const definition$2 = require('./definition53.cjs');
8
8
  const definition$4 = require('./definition21.cjs');
@@ -1,6 +1,6 @@
1
1
  import { v as volatile, r as registerFactory } from './index.js';
2
- import { p as popupRegistries } from './definition60.js';
3
- import { f as focusRegistries } from './definition58.js';
2
+ import { p as popupRegistries } from './definition61.js';
3
+ import { f as focusRegistries } from './definition59.js';
4
4
  import { a as buttonRegistries } from './definition11.js';
5
5
  import { a as textFieldRegistries } from './definition53.js';
6
6
  import { a as dividerRegistries } from './definition21.js';
@@ -2,9 +2,9 @@
2
2
 
3
3
  const index = require('./index.cjs');
4
4
  const definition = require('./definition11.cjs');
5
- const definition$1 = require('./definition60.cjs');
5
+ const definition$1 = require('./definition61.cjs');
6
6
  const definition$2 = require('./definition53.cjs');
7
- const definition$3 = require('./definition58.cjs');
7
+ const definition$3 = require('./definition59.cjs');
8
8
  const definition$4 = require('./definition21.cjs');
9
9
  const presentationDate = require('./presentationDate.cjs');
10
10
  require('./affix.cjs');
@@ -1,8 +1,8 @@
1
1
  import { a as attr, o as observable, v as volatile, r as registerFactory } from './index.js';
2
2
  import { a as buttonRegistries } from './definition11.js';
3
- import { p as popupRegistries } from './definition60.js';
3
+ import { p as popupRegistries } from './definition61.js';
4
4
  import { a as textFieldRegistries } from './definition53.js';
5
- import { f as focusRegistries } from './definition58.js';
5
+ import { f as focusRegistries } from './definition59.js';
6
6
  import { a as dividerRegistries } from './definition21.js';
7
7
  import { f as formatPresentationDate, p as parsePresentationDate, D as DatePickerBase, i as isValidDateStr, c as compareDateStr, a as DatePickerBaseTemplate, s as styles } from './presentationDate.js';
8
8
  import './affix.js';
@@ -3,7 +3,7 @@
3
3
  const index = require('./index.cjs');
4
4
  const definition$2 = require('./definition26.cjs');
5
5
  const definition$1 = require('./definition11.cjs');
6
- const definition = require('./definition59.cjs');
6
+ const definition = require('./definition60.cjs');
7
7
  require('./affix.cjs');
8
8
  require('./index2.cjs');
9
9
  const localized = require('./localized.cjs');
@@ -1,7 +1,7 @@
1
1
  import { a as attr, F as FoundationElement, o as observable, h as html, r as registerFactory } from './index.js';
2
2
  import { a as iconRegistries } from './definition26.js';
3
3
  import { B as Button, a as buttonRegistries } from './definition11.js';
4
- import { E as Elevation, e as elevationRegistries } from './definition59.js';
4
+ import { E as Elevation, e as elevationRegistries } from './definition60.js';
5
5
  import './affix.js';
6
6
  import './index2.js';
7
7
  import { L as Localized } from './localized.js';
@@ -2,7 +2,7 @@
2
2
 
3
3
  const index = require('./index.cjs');
4
4
  const definition = require('./definition26.cjs');
5
- const definition$1 = require('./definition58.cjs');
5
+ const definition$1 = require('./definition59.cjs');
6
6
  const affix = require('./affix.cjs');
7
7
  const applyMixins = require('./apply-mixins.cjs');
8
8
  const button = require('./button.cjs');
@@ -1,6 +1,6 @@
1
1
  import { a as attr, h as html, r as registerFactory } from './index.js';
2
2
  import { a as iconRegistries } from './definition26.js';
3
- import { f as focusRegistries } from './definition58.js';
3
+ import { f as focusRegistries } from './definition59.js';
4
4
  import { b as AffixIconWithTrailing, a as affixIconTemplateFactory, I as IconWrapper } from './affix.js';
5
5
  import { a as applyMixins } from './apply-mixins.js';
6
6
  import { B as Button$1 } from './button.js';
@@ -2,7 +2,7 @@
2
2
 
3
3
  const index = require('./index.cjs');
4
4
  const definition$1 = require('./definition26.cjs');
5
- const definition$2 = require('./definition58.cjs');
5
+ const definition$2 = require('./definition59.cjs');
6
6
  const definition = require('./definition11.cjs');
7
7
  const enums = require('./enums.cjs');
8
8
  require('./affix.cjs');
@@ -1,6 +1,6 @@
1
1
  import { F as FoundationElement, a as attr, h as html, r as registerFactory } from './index.js';
2
2
  import { a as iconRegistries } from './definition26.js';
3
- import { f as focusRegistries } from './definition58.js';
3
+ import { f as focusRegistries } from './definition59.js';
4
4
  import { B as Button, a as buttonRegistries } from './definition11.js';
5
5
  import { C as Connotation } from './enums.js';
6
6
  import './affix.js';
@@ -1,7 +1,7 @@
1
1
  'use strict';
2
2
 
3
3
  const index = require('./index.cjs');
4
- const definition = require('./definition59.cjs');
4
+ const definition = require('./definition60.cjs');
5
5
  const classNames = require('./class-names.cjs');
6
6
 
7
7
  const styles = ".base{z-index:1;block-size:calc(1px*(40 + 4*clamp(-1,var(--vvd-size-density, 0),2)) + 1px*(24 + 4*clamp(-1,var(--vvd-size-density, 0),2)));font:var(--vvd-typography-heading-4);inline-size:100%}.base .header-content{display:inline-flex;align-items:center;column-gap:4px}.container{display:flex;box-sizing:border-box;justify-content:space-between;background-color:var(--header-bg-color, var(--vvd-color-canvas));block-size:inherit;color:var(--vvd-color-canvas-text);column-gap:12px;padding-block:8px;padding-inline:16px}.container[part~=vvd-theme-alternate]{color-scheme:var(--vvd-color-scheme)}.app-content{--vvd-header-block-size:calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2)) + 1px*(24 + 4*clamp(-1, var(--vvd-size-density, 0), 2)))}\n";
@@ -1,5 +1,5 @@
1
1
  import { a as attr, F as FoundationElement, h as html, r as registerFactory } from './index.js';
2
- import { E as Elevation, e as elevationRegistries } from './definition59.js';
2
+ import { E as Elevation, e as elevationRegistries } from './definition60.js';
3
3
  import { c as classNames } from './class-names.js';
4
4
 
5
5
  const styles = ".base{z-index:1;block-size:calc(1px*(40 + 4*clamp(-1,var(--vvd-size-density, 0),2)) + 1px*(24 + 4*clamp(-1,var(--vvd-size-density, 0),2)));font:var(--vvd-typography-heading-4);inline-size:100%}.base .header-content{display:inline-flex;align-items:center;column-gap:4px}.container{display:flex;box-sizing:border-box;justify-content:space-between;background-color:var(--header-bg-color, var(--vvd-color-canvas));block-size:inherit;color:var(--vvd-color-canvas-text);column-gap:12px;padding-block:8px;padding-inline:16px}.container[part~=vvd-theme-alternate]{color-scheme:var(--vvd-color-scheme)}.app-content{--vvd-header-block-size:calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2)) + 1px*(24 + 4*clamp(-1, var(--vvd-size-density, 0), 2)))}\n";
@@ -2,7 +2,7 @@
2
2
 
3
3
  const index = require('./index.cjs');
4
4
  const definition = require('./definition26.cjs');
5
- const definition$1 = require('./definition58.cjs');
5
+ const definition$1 = require('./definition59.cjs');
6
6
  const affix = require('./affix.cjs');
7
7
  const applyMixins = require('./apply-mixins.cjs');
8
8
  const startEnd = require('./start-end.cjs');
@@ -1,6 +1,6 @@
1
1
  import { F as FoundationElement, D as DOM, _ as __decorate, a as attr, o as observable, h as html, r as registerFactory } from './index.js';
2
2
  import { a as iconRegistries } from './definition26.js';
3
- import { f as focusRegistries } from './definition58.js';
3
+ import { f as focusRegistries } from './definition59.js';
4
4
  import { A as AffixIcon, a as affixIconTemplateFactory } from './affix.js';
5
5
  import { a as applyMixins } from './apply-mixins.js';
6
6
  import { S as StartEnd } from './start-end.js';
@@ -1,7 +1,7 @@
1
1
  'use strict';
2
2
 
3
3
  const index = require('./index.cjs');
4
- const definition = require('./definition60.cjs');
4
+ const definition = require('./definition61.cjs');
5
5
  const definition$1 = require('./definition28.cjs');
6
6
  const slotted = require('./slotted.cjs');
7
7
  const classNames = require('./class-names.cjs');
@@ -1,5 +1,5 @@
1
1
  import { h as html, r as registerFactory } from './index.js';
2
- import { P as Popup, p as popupRegistries } from './definition60.js';
2
+ import { P as Popup, p as popupRegistries } from './definition61.js';
3
3
  import { b as Menu, a as menuItemRegistries } from './definition28.js';
4
4
  import { s as slotted } from './slotted.js';
5
5
  import { c as classNames } from './class-names.js';
@@ -3,7 +3,7 @@
3
3
  const index = require('./index.cjs');
4
4
  const classNames = require('./class-names.cjs');
5
5
 
6
- const styles = ":host{display:inline-block}.base{position:relative;display:flex;box-sizing:border-box;align-items:center;background-color:var(--_appearance-color-fill);inline-size:inherit;vertical-align:middle}.base{--_connotation-color-backdrop: var(--vvd-action-group-accent-backdrop, var(--vvd-color-canvas));--_connotation-color-primary: var(--vvd-action-group-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-intermediate: var(--vvd-action-group-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-faint: var(--vvd-action-group-accent-faint, var(--vvd-color-neutral-50))}.base{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--_connotation-color-backdrop);--_appearance-color-outline: var(--_connotation-color-intermediate)}.base.appearance-ghost{--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.base:before{position:absolute;z-index:1;border-radius:inherit;box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);content:\"\";inset:0;pointer-events:none}.base:not(.tight){padding:4px;column-gap:4px}.base:not(.shape-pill){border-radius:8px}.base.shape-pill{border-radius:24px}::slotted([role=separator]){align-self:stretch;margin-block:4px}\n";
6
+ const styles = ":host{display:inline-block}.base{position:relative;display:flex;box-sizing:border-box;align-items:center;background-color:var(--_appearance-color-fill);inline-size:inherit;vertical-align:middle}.base{--_connotation-color-primary: var(--vvd-action-group-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-intermediate: var(--vvd-action-group-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-faint: var(--vvd-action-group-accent-faint, var(--vvd-color-neutral-50))}.base{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--_connotation-color-intermediate)}.base.appearance-ghost{--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.base:before{position:absolute;z-index:1;border-radius:inherit;box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);content:\"\";inset:0;pointer-events:none}.base:not(.tight){padding:4px;column-gap:4px}.base:not(.shape-pill){border-radius:8px}.base.shape-pill{border-radius:24px}::slotted([role=separator]){align-self:stretch;margin-block:4px}\n";
7
7
 
8
8
  var __defProp = Object.defineProperty;
9
9
  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -1,7 +1,7 @@
1
1
  import { a as attr, F as FoundationElement, h as html, r as registerFactory } from './index.js';
2
2
  import { c as classNames } from './class-names.js';
3
3
 
4
- const styles = ":host{display:inline-block}.base{position:relative;display:flex;box-sizing:border-box;align-items:center;background-color:var(--_appearance-color-fill);inline-size:inherit;vertical-align:middle}.base{--_connotation-color-backdrop: var(--vvd-action-group-accent-backdrop, var(--vvd-color-canvas));--_connotation-color-primary: var(--vvd-action-group-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-intermediate: var(--vvd-action-group-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-faint: var(--vvd-action-group-accent-faint, var(--vvd-color-neutral-50))}.base{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--_connotation-color-backdrop);--_appearance-color-outline: var(--_connotation-color-intermediate)}.base.appearance-ghost{--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.base:before{position:absolute;z-index:1;border-radius:inherit;box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);content:\"\";inset:0;pointer-events:none}.base:not(.tight){padding:4px;column-gap:4px}.base:not(.shape-pill){border-radius:8px}.base.shape-pill{border-radius:24px}::slotted([role=separator]){align-self:stretch;margin-block:4px}\n";
4
+ const styles = ":host{display:inline-block}.base{position:relative;display:flex;box-sizing:border-box;align-items:center;background-color:var(--_appearance-color-fill);inline-size:inherit;vertical-align:middle}.base{--_connotation-color-primary: var(--vvd-action-group-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-intermediate: var(--vvd-action-group-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-faint: var(--vvd-action-group-accent-faint, var(--vvd-color-neutral-50))}.base{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--_connotation-color-intermediate)}.base.appearance-ghost{--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.base:before{position:absolute;z-index:1;border-radius:inherit;box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);content:\"\";inset:0;pointer-events:none}.base:not(.tight){padding:4px;column-gap:4px}.base:not(.shape-pill){border-radius:8px}.base.shape-pill{border-radius:24px}::slotted([role=separator]){align-self:stretch;margin-block:4px}\n";
5
5
 
6
6
  var __defProp = Object.defineProperty;
7
7
  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -2,7 +2,7 @@
2
2
 
3
3
  const index = require('./index.cjs');
4
4
  const definition = require('./definition26.cjs');
5
- const definition$1 = require('./definition58.cjs');
5
+ const definition$1 = require('./definition59.cjs');
6
6
  const affix = require('./affix.cjs');
7
7
  const applyMixins = require('./apply-mixins.cjs');
8
8
  const icon = require('./icon.cjs');
@@ -1,6 +1,6 @@
1
1
  import { a as attr, F as FoundationElement, h as html, r as registerFactory } from './index.js';
2
2
  import { a as iconRegistries } from './definition26.js';
3
- import { f as focusRegistries } from './definition58.js';
3
+ import { f as focusRegistries } from './definition59.js';
4
4
  import { A as AffixIcon, a as affixIconTemplateFactory, I as IconWrapper } from './affix.js';
5
5
  import { a as applyMixins } from './apply-mixins.js';
6
6
  import { I as Icon } from './icon.js';
@@ -2,7 +2,7 @@
2
2
 
3
3
  const index = require('./index.cjs');
4
4
  const definition = require('./definition26.cjs');
5
- const definition$1 = require('./definition58.cjs');
5
+ const definition$1 = require('./definition59.cjs');
6
6
  const affix = require('./affix.cjs');
7
7
  const textAnchor = require('./text-anchor.cjs');
8
8
  const applyMixins = require('./apply-mixins.cjs');
@@ -1,6 +1,6 @@
1
1
  import { h as html, r as registerFactory } from './index.js';
2
2
  import { a as iconRegistries } from './definition26.js';
3
- import { f as focusRegistries } from './definition58.js';
3
+ import { f as focusRegistries } from './definition59.js';
4
4
  import { A as AffixIcon } from './affix.js';
5
5
  import { T as TextAnchor } from './text-anchor.js';
6
6
  import { a as applyMixins } from './apply-mixins.js';
@@ -313,7 +313,7 @@ index.__decorate([
313
313
  ], NumberField$1.prototype, "defaultSlottedNodes", void 0);
314
314
  applyMixins.applyMixins(NumberField$1, startEnd.StartEnd, textField.DelegatesARIATextbox);
315
315
 
316
- const styles = ":host{display:inline-block}.base{--_text-field-gutter-start:calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))*.4);--_text-field-gutter-end:calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))*.4);--_text-field-icon-size:calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))/2);display:inline-grid;width:100%;gap:4px;grid-template-columns:min-content 1fr max-content}.base{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--_connotation-color-backdrop);--_appearance-color-outline: var(--_connotation-color-intermediate)}.base.appearance-ghost{--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.base:where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--_connotation-color-backdrop);--_appearance-color-outline: var(--_connotation-color-firm)}.base:where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)).appearance-ghost{--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: transparent}.base:where(:disabled,.disabled){--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.base:where(:disabled,.disabled).appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.base:where(.readonly):where(:not(:disabled,.disabled)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-neutral-200);--_appearance-color-outline: var(--vvd-color-neutral-400)}.base:where(.readonly):where(:not(:disabled,.disabled)).appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-600);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.base:where(.error):where(:not(:disabled,.disabled)){--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-alert-50);--_appearance-color-outline: var(--vvd-color-alert-500)}.base:where(.error):where(:not(:disabled,.disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-alert-50);--_appearance-color-outline: transparent}.base:where(.success):where(:not(:disabled,.disabled)){--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-success-50);--_appearance-color-outline: var(--vvd-color-success-500)}.base:where(.success):where(:not(:disabled,.disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-success-50);--_appearance-color-outline: transparent}.base.connotation-success{--_connotation-color-primary: var(--vvd-text-field-success-primary, var(--vvd-color-success-500));--_connotation-color-backdrop: var(--vvd-text-field-success-backdrop, var(--vvd-color-success-50));--_connotation-color-intermediate: var(--vvd-text-field-success-intermediate, var(--vvd-color-success-500));--_connotation-color-firm: var(--vvd-text-field-success-firm, var(--vvd-color-success-600));--_connotation-color-faint: var(--vvd-text-field-success-faint, var(--vvd-color-success-50));--_connotation-color-soft: var(--vvd-text-field-success-soft, var(--vvd-color-success-100))}.base.connotation-alert{--_connotation-color-primary: var(--vvd-text-field-alert-primary, var(--vvd-color-alert-500));--_connotation-color-backdrop: var(--vvd-text-field-alert-backdrop, var(--vvd-color-alert-50));--_connotation-color-intermediate: var(--vvd-text-field-alert-intermediate, var(--vvd-color-alert-500));--_connotation-color-firm: var(--vvd-text-field-alert-firm, var(--vvd-color-alert-600));--_connotation-color-faint: var(--vvd-text-field-alert-faint, var(--vvd-color-alert-50));--_connotation-color-soft: var(--vvd-text-field-alert-soft, var(--vvd-color-alert-100))}.base:not(.connotation-success,.connotation-alert){--_connotation-color-primary: var(--vvd-text-field-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-backdrop: var(--vvd-text-field-accent-backdrop, var(--vvd-color-canvas));--_connotation-color-intermediate: var(--vvd-text-field-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-firm: var(--vvd-text-field-accent-firm, var(--vvd-color-canvas-text));--_connotation-color-faint: var(--vvd-text-field-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-soft: var(--vvd-text-field-accent-soft, var(--vvd-color-neutral-100))}@supports (user-select: none){.base{user-select:none}}.base:not(.disabled){--_low-ink-color: var(--vvd-color-neutral-600)}.base.disabled{--_low-ink-color: var(--_appearance-color-text)}.label:not(slot),.label::slotted(label){box-sizing:initial!important;padding:initial!important;margin:initial!important;color:var(--vvd-color-canvas-text)!important;contain:inline-size!important;font:var(--vvd-typography-base);grid-column:1/4;grid-row:1}.char-count+.label:not(slot),.char-count+.label::slotted(label){grid-column:1/3}.char-count{color:var(--_low-ink-color);font:var(--vvd-typography-base);grid-column:3/4}.fieldset{position:relative;display:flex;align-items:center;background-color:var(--_appearance-color-fill);font:var(--vvd-typography-base);grid-column:1/4;padding-block:0;transition:color .2s,background-color .2s}.fieldset:after{position:absolute;display:block;block-size:100%;border-radius:inherit;box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);content:\"\";inline-size:100%;pointer-events:none;transition:box-shadow .2s}.fieldset:focus-visible{outline:none}.base>.fieldset{block-size:calc(1px*(40 + 4*clamp(-1,var(--vvd-size-density, 0),2)))}.base:not(.shape-pill) .fieldset{border-radius:8px}.base.shape-pill .fieldset{border-radius:24px}.wrapper{block-size:100%;border-radius:inherit;inline-size:100%}.wrapper:focus-visible{outline:none}.control:not(slot),.control::slotted(input){width:100%!important;box-sizing:border-box!important;border:0 none!important;margin:initial!important;appearance:none!important;background-color:transparent!important;block-size:100%!important;border-radius:inherit!important;color:inherit!important;font:inherit;padding-block:0!important;padding-inline-end:var(--_text-field-gutter-end)!important;padding-inline-start:var(--_text-field-gutter-start)!important}.control:not(slot):disabled,.control::slotted(input:disabled){cursor:not-allowed!important;opacity:1!important;-webkit-text-fill-color:var(--_appearance-color-text)!important}.control:not(slot)::placeholder{opacity:1!important;-webkit-text-fill-color:var(--_low-ink-color)!important}.control:not(slot):focus-visible,.control::slotted(input:focus-visible){outline:none}.has-icon .control:not(slot),.has-icon .control::slotted(input){padding-inline-start:calc(var(--_text-field-icon-size) + var(--_text-field-gutter-start) * 2)!important}.icon{position:absolute;z-index:1;color:var(--_low-ink-color);font-size:var(--_text-field-icon-size);inset-block-start:50%;inset-inline-start:calc(100% + var(--_text-field-gutter-start));line-height:1;transform:translateY(-50%)}.leading-items-wrapper{position:relative}.base.no-leading .leading-items-wrapper{display:none}.action-items-wrapper{margin-inline-end:4px}.base:not(.action-items) .action-items-wrapper{display:none}.focus-indicator{--focus-stroke-gap-color: transparent;pointer-events:none}.wrapper:not(:focus-visible,:focus-within)>.focus-indicator,.fieldset:not(:focus-visible,:focus-within)>.focus-indicator{display:none}.base{--_text-field-gutter-end: 70px}.control::-webkit-outer-spin-button,.control::-webkit-inner-spin-button{appearance:none}.control-buttons{position:absolute;z-index:1;right:3px;display:flex}.readonly .control-buttons,.disabled .control-buttons{pointer-events:none}.control-buttons .divider{margin-block:8px}.control-buttons>*{flex-shrink:0}.disabled .focus-indicator{display:none;pointer-events:none}\n";
316
+ const styles = ":host{display:inline-block}.base{--_text-field-gutter-start:calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))*.4);--_text-field-gutter-end:calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))*.4);--_text-field-icon-size:calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))/2);display:inline-grid;width:100%;gap:4px;grid-template-columns:min-content 1fr max-content}.base{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--_connotation-color-intermediate)}.base.appearance-ghost{--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.base:where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--_connotation-color-fierce)}.base:where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)).appearance-ghost{--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: transparent}.base:where(:disabled,.disabled){--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.base:where(:disabled,.disabled).appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.base:where(.readonly):where(:not(:disabled,.disabled)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-neutral-200);--_appearance-color-outline: var(--vvd-color-neutral-400)}.base:where(.readonly):where(:not(:disabled,.disabled)).appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-600);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.base:where(.error):where(:not(:disabled,.disabled)){--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-alert-50);--_appearance-color-outline: var(--vvd-color-alert-500)}.base:where(.error):where(:not(:disabled,.disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-alert-50);--_appearance-color-outline: transparent}.base:where(.success):where(:not(:disabled,.disabled)){--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-success-50);--_appearance-color-outline: var(--vvd-color-success-500)}.base:where(.success):where(:not(:disabled,.disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-success-50);--_appearance-color-outline: transparent}.base.connotation-success{--_connotation-color-primary: var(--vvd-text-field-success-primary, var(--vvd-color-success-500));--_connotation-color-primary-text: var(--vvd-text-field-success-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-text-field-success-primary-increment, var(--vvd-color-success-600));--_connotation-color-intermediate: var(--vvd-text-field-success-intermediate, var(--vvd-color-success-500));--_connotation-color-firm: var(--vvd-text-field-success-firm, var(--vvd-color-success-600));--_connotation-color-faint: var(--vvd-text-field-success-faint, var(--vvd-color-success-50));--_connotation-color-soft: var(--vvd-text-field-success-soft, var(--vvd-color-success-100));--_connotation-color-fierce: var(--vvd-text-field-success-fierce, var(--vvd-color-success-700))}.base.connotation-alert{--_connotation-color-primary: var(--vvd-text-field-alert-primary, var(--vvd-color-alert-500));--_connotation-color-primary-text: var(--vvd-text-field-alert-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-text-field-alert-primary-increment, var(--vvd-color-alert-600));--_connotation-color-intermediate: var(--vvd-text-field-alert-intermediate, var(--vvd-color-alert-500));--_connotation-color-firm: var(--vvd-text-field-alert-firm, var(--vvd-color-alert-600));--_connotation-color-faint: var(--vvd-text-field-alert-faint, var(--vvd-color-alert-50));--_connotation-color-soft: var(--vvd-text-field-alert-soft, var(--vvd-color-alert-100));--_connotation-color-fierce: var(--vvd-text-field-alert-fierce, var(--vvd-color-alert-700))}.base:not(.connotation-success,.connotation-alert){--_connotation-color-primary: var(--vvd-text-field-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-text-field-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-text-field-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-intermediate: var(--vvd-text-field-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-firm: var(--vvd-text-field-accent-firm, var(--vvd-color-canvas-text));--_connotation-color-faint: var(--vvd-text-field-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-soft: var(--vvd-text-field-accent-soft, var(--vvd-color-neutral-100));--_connotation-color-fierce: var(--vvd-text-field-accent-fierce, var(--vvd-color-neutral-700))}@supports (user-select: none){.base{user-select:none}}.base:not(.disabled){--_low-ink-color: var(--vvd-color-neutral-600)}.base.disabled{--_low-ink-color: var(--_appearance-color-text)}.label:not(slot),.label::slotted(label){box-sizing:initial!important;padding:initial!important;margin:initial!important;color:var(--vvd-color-canvas-text)!important;contain:inline-size!important;font:var(--vvd-typography-base);grid-column:1/4;grid-row:1}.char-count+.label:not(slot),.char-count+.label::slotted(label){grid-column:1/3}.char-count{color:var(--_low-ink-color);font:var(--vvd-typography-base);grid-column:3/4}.fieldset{position:relative;display:flex;align-items:center;background-color:var(--_appearance-color-fill);font:var(--vvd-typography-base);grid-column:1/4;padding-block:0;transition:color .2s,background-color .2s}.fieldset:after{position:absolute;display:block;block-size:100%;border-radius:inherit;box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);content:\"\";inline-size:100%;pointer-events:none;transition:box-shadow .2s}.fieldset:focus-visible{outline:none}.base>.fieldset{block-size:calc(1px*(40 + 4*clamp(-1,var(--vvd-size-density, 0),2)))}.base:not(.shape-pill) .fieldset{border-radius:8px}.base.shape-pill .fieldset{border-radius:24px}.wrapper{block-size:100%;border-radius:inherit;inline-size:100%}.wrapper:focus-visible{outline:none}.control:not(slot),.control::slotted(input){width:100%!important;box-sizing:border-box!important;border:0 none!important;margin:initial!important;appearance:none!important;background-color:transparent!important;block-size:100%!important;border-radius:inherit!important;color:inherit!important;font:inherit;padding-block:0!important;padding-inline-end:var(--_text-field-gutter-end)!important;padding-inline-start:var(--_text-field-gutter-start)!important}.control:not(slot):disabled,.control::slotted(input:disabled){cursor:not-allowed!important;opacity:1!important;-webkit-text-fill-color:var(--_appearance-color-text)!important}.control:not(slot)::placeholder{opacity:1!important;-webkit-text-fill-color:var(--_low-ink-color)!important}.control:not(slot):focus-visible,.control::slotted(input:focus-visible){outline:none}.has-icon .control:not(slot),.has-icon .control::slotted(input){padding-inline-start:calc(var(--_text-field-icon-size) + var(--_text-field-gutter-start) * 2)!important}.icon{position:absolute;z-index:1;color:var(--_low-ink-color);font-size:var(--_text-field-icon-size);inset-block-start:50%;inset-inline-start:calc(100% + var(--_text-field-gutter-start));line-height:1;transform:translateY(-50%)}.leading-items-wrapper{position:relative}.base.no-leading .leading-items-wrapper{display:none}.action-items-wrapper{margin-inline-end:4px}.base:not(.action-items) .action-items-wrapper{display:none}.focus-indicator{--focus-stroke-gap-color: transparent;pointer-events:none}.wrapper:not(:focus-visible,:focus-within)>.focus-indicator,.fieldset:not(:focus-visible,:focus-within)>.focus-indicator{display:none}.base{--_text-field-gutter-end: 70px}.control::-webkit-outer-spin-button,.control::-webkit-inner-spin-button{appearance:none}.control-buttons{position:absolute;z-index:1;right:3px;display:flex}.readonly .control-buttons,.disabled .control-buttons{pointer-events:none}.control-buttons .divider{margin-block:8px}.control-buttons>*{flex-shrink:0}.disabled .focus-indicator{display:none;pointer-events:none}\n";
317
317
 
318
318
  var __defProp = Object.defineProperty;
319
319
  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -311,7 +311,7 @@ __decorate([
311
311
  ], NumberField$1.prototype, "defaultSlottedNodes", void 0);
312
312
  applyMixins(NumberField$1, StartEnd, DelegatesARIATextbox);
313
313
 
314
- const styles = ":host{display:inline-block}.base{--_text-field-gutter-start:calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))*.4);--_text-field-gutter-end:calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))*.4);--_text-field-icon-size:calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))/2);display:inline-grid;width:100%;gap:4px;grid-template-columns:min-content 1fr max-content}.base{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--_connotation-color-backdrop);--_appearance-color-outline: var(--_connotation-color-intermediate)}.base.appearance-ghost{--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.base:where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--_connotation-color-backdrop);--_appearance-color-outline: var(--_connotation-color-firm)}.base:where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)).appearance-ghost{--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: transparent}.base:where(:disabled,.disabled){--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.base:where(:disabled,.disabled).appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.base:where(.readonly):where(:not(:disabled,.disabled)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-neutral-200);--_appearance-color-outline: var(--vvd-color-neutral-400)}.base:where(.readonly):where(:not(:disabled,.disabled)).appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-600);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.base:where(.error):where(:not(:disabled,.disabled)){--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-alert-50);--_appearance-color-outline: var(--vvd-color-alert-500)}.base:where(.error):where(:not(:disabled,.disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-alert-50);--_appearance-color-outline: transparent}.base:where(.success):where(:not(:disabled,.disabled)){--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-success-50);--_appearance-color-outline: var(--vvd-color-success-500)}.base:where(.success):where(:not(:disabled,.disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-success-50);--_appearance-color-outline: transparent}.base.connotation-success{--_connotation-color-primary: var(--vvd-text-field-success-primary, var(--vvd-color-success-500));--_connotation-color-backdrop: var(--vvd-text-field-success-backdrop, var(--vvd-color-success-50));--_connotation-color-intermediate: var(--vvd-text-field-success-intermediate, var(--vvd-color-success-500));--_connotation-color-firm: var(--vvd-text-field-success-firm, var(--vvd-color-success-600));--_connotation-color-faint: var(--vvd-text-field-success-faint, var(--vvd-color-success-50));--_connotation-color-soft: var(--vvd-text-field-success-soft, var(--vvd-color-success-100))}.base.connotation-alert{--_connotation-color-primary: var(--vvd-text-field-alert-primary, var(--vvd-color-alert-500));--_connotation-color-backdrop: var(--vvd-text-field-alert-backdrop, var(--vvd-color-alert-50));--_connotation-color-intermediate: var(--vvd-text-field-alert-intermediate, var(--vvd-color-alert-500));--_connotation-color-firm: var(--vvd-text-field-alert-firm, var(--vvd-color-alert-600));--_connotation-color-faint: var(--vvd-text-field-alert-faint, var(--vvd-color-alert-50));--_connotation-color-soft: var(--vvd-text-field-alert-soft, var(--vvd-color-alert-100))}.base:not(.connotation-success,.connotation-alert){--_connotation-color-primary: var(--vvd-text-field-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-backdrop: var(--vvd-text-field-accent-backdrop, var(--vvd-color-canvas));--_connotation-color-intermediate: var(--vvd-text-field-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-firm: var(--vvd-text-field-accent-firm, var(--vvd-color-canvas-text));--_connotation-color-faint: var(--vvd-text-field-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-soft: var(--vvd-text-field-accent-soft, var(--vvd-color-neutral-100))}@supports (user-select: none){.base{user-select:none}}.base:not(.disabled){--_low-ink-color: var(--vvd-color-neutral-600)}.base.disabled{--_low-ink-color: var(--_appearance-color-text)}.label:not(slot),.label::slotted(label){box-sizing:initial!important;padding:initial!important;margin:initial!important;color:var(--vvd-color-canvas-text)!important;contain:inline-size!important;font:var(--vvd-typography-base);grid-column:1/4;grid-row:1}.char-count+.label:not(slot),.char-count+.label::slotted(label){grid-column:1/3}.char-count{color:var(--_low-ink-color);font:var(--vvd-typography-base);grid-column:3/4}.fieldset{position:relative;display:flex;align-items:center;background-color:var(--_appearance-color-fill);font:var(--vvd-typography-base);grid-column:1/4;padding-block:0;transition:color .2s,background-color .2s}.fieldset:after{position:absolute;display:block;block-size:100%;border-radius:inherit;box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);content:\"\";inline-size:100%;pointer-events:none;transition:box-shadow .2s}.fieldset:focus-visible{outline:none}.base>.fieldset{block-size:calc(1px*(40 + 4*clamp(-1,var(--vvd-size-density, 0),2)))}.base:not(.shape-pill) .fieldset{border-radius:8px}.base.shape-pill .fieldset{border-radius:24px}.wrapper{block-size:100%;border-radius:inherit;inline-size:100%}.wrapper:focus-visible{outline:none}.control:not(slot),.control::slotted(input){width:100%!important;box-sizing:border-box!important;border:0 none!important;margin:initial!important;appearance:none!important;background-color:transparent!important;block-size:100%!important;border-radius:inherit!important;color:inherit!important;font:inherit;padding-block:0!important;padding-inline-end:var(--_text-field-gutter-end)!important;padding-inline-start:var(--_text-field-gutter-start)!important}.control:not(slot):disabled,.control::slotted(input:disabled){cursor:not-allowed!important;opacity:1!important;-webkit-text-fill-color:var(--_appearance-color-text)!important}.control:not(slot)::placeholder{opacity:1!important;-webkit-text-fill-color:var(--_low-ink-color)!important}.control:not(slot):focus-visible,.control::slotted(input:focus-visible){outline:none}.has-icon .control:not(slot),.has-icon .control::slotted(input){padding-inline-start:calc(var(--_text-field-icon-size) + var(--_text-field-gutter-start) * 2)!important}.icon{position:absolute;z-index:1;color:var(--_low-ink-color);font-size:var(--_text-field-icon-size);inset-block-start:50%;inset-inline-start:calc(100% + var(--_text-field-gutter-start));line-height:1;transform:translateY(-50%)}.leading-items-wrapper{position:relative}.base.no-leading .leading-items-wrapper{display:none}.action-items-wrapper{margin-inline-end:4px}.base:not(.action-items) .action-items-wrapper{display:none}.focus-indicator{--focus-stroke-gap-color: transparent;pointer-events:none}.wrapper:not(:focus-visible,:focus-within)>.focus-indicator,.fieldset:not(:focus-visible,:focus-within)>.focus-indicator{display:none}.base{--_text-field-gutter-end: 70px}.control::-webkit-outer-spin-button,.control::-webkit-inner-spin-button{appearance:none}.control-buttons{position:absolute;z-index:1;right:3px;display:flex}.readonly .control-buttons,.disabled .control-buttons{pointer-events:none}.control-buttons .divider{margin-block:8px}.control-buttons>*{flex-shrink:0}.disabled .focus-indicator{display:none;pointer-events:none}\n";
314
+ const styles = ":host{display:inline-block}.base{--_text-field-gutter-start:calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))*.4);--_text-field-gutter-end:calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))*.4);--_text-field-icon-size:calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))/2);display:inline-grid;width:100%;gap:4px;grid-template-columns:min-content 1fr max-content}.base{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--_connotation-color-intermediate)}.base.appearance-ghost{--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.base:where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--_connotation-color-fierce)}.base:where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)).appearance-ghost{--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: transparent}.base:where(:disabled,.disabled){--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.base:where(:disabled,.disabled).appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.base:where(.readonly):where(:not(:disabled,.disabled)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-neutral-200);--_appearance-color-outline: var(--vvd-color-neutral-400)}.base:where(.readonly):where(:not(:disabled,.disabled)).appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-600);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.base:where(.error):where(:not(:disabled,.disabled)){--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-alert-50);--_appearance-color-outline: var(--vvd-color-alert-500)}.base:where(.error):where(:not(:disabled,.disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-alert-50);--_appearance-color-outline: transparent}.base:where(.success):where(:not(:disabled,.disabled)){--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-success-50);--_appearance-color-outline: var(--vvd-color-success-500)}.base:where(.success):where(:not(:disabled,.disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-success-50);--_appearance-color-outline: transparent}.base.connotation-success{--_connotation-color-primary: var(--vvd-text-field-success-primary, var(--vvd-color-success-500));--_connotation-color-primary-text: var(--vvd-text-field-success-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-text-field-success-primary-increment, var(--vvd-color-success-600));--_connotation-color-intermediate: var(--vvd-text-field-success-intermediate, var(--vvd-color-success-500));--_connotation-color-firm: var(--vvd-text-field-success-firm, var(--vvd-color-success-600));--_connotation-color-faint: var(--vvd-text-field-success-faint, var(--vvd-color-success-50));--_connotation-color-soft: var(--vvd-text-field-success-soft, var(--vvd-color-success-100));--_connotation-color-fierce: var(--vvd-text-field-success-fierce, var(--vvd-color-success-700))}.base.connotation-alert{--_connotation-color-primary: var(--vvd-text-field-alert-primary, var(--vvd-color-alert-500));--_connotation-color-primary-text: var(--vvd-text-field-alert-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-text-field-alert-primary-increment, var(--vvd-color-alert-600));--_connotation-color-intermediate: var(--vvd-text-field-alert-intermediate, var(--vvd-color-alert-500));--_connotation-color-firm: var(--vvd-text-field-alert-firm, var(--vvd-color-alert-600));--_connotation-color-faint: var(--vvd-text-field-alert-faint, var(--vvd-color-alert-50));--_connotation-color-soft: var(--vvd-text-field-alert-soft, var(--vvd-color-alert-100));--_connotation-color-fierce: var(--vvd-text-field-alert-fierce, var(--vvd-color-alert-700))}.base:not(.connotation-success,.connotation-alert){--_connotation-color-primary: var(--vvd-text-field-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-text-field-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-text-field-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-intermediate: var(--vvd-text-field-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-firm: var(--vvd-text-field-accent-firm, var(--vvd-color-canvas-text));--_connotation-color-faint: var(--vvd-text-field-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-soft: var(--vvd-text-field-accent-soft, var(--vvd-color-neutral-100));--_connotation-color-fierce: var(--vvd-text-field-accent-fierce, var(--vvd-color-neutral-700))}@supports (user-select: none){.base{user-select:none}}.base:not(.disabled){--_low-ink-color: var(--vvd-color-neutral-600)}.base.disabled{--_low-ink-color: var(--_appearance-color-text)}.label:not(slot),.label::slotted(label){box-sizing:initial!important;padding:initial!important;margin:initial!important;color:var(--vvd-color-canvas-text)!important;contain:inline-size!important;font:var(--vvd-typography-base);grid-column:1/4;grid-row:1}.char-count+.label:not(slot),.char-count+.label::slotted(label){grid-column:1/3}.char-count{color:var(--_low-ink-color);font:var(--vvd-typography-base);grid-column:3/4}.fieldset{position:relative;display:flex;align-items:center;background-color:var(--_appearance-color-fill);font:var(--vvd-typography-base);grid-column:1/4;padding-block:0;transition:color .2s,background-color .2s}.fieldset:after{position:absolute;display:block;block-size:100%;border-radius:inherit;box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);content:\"\";inline-size:100%;pointer-events:none;transition:box-shadow .2s}.fieldset:focus-visible{outline:none}.base>.fieldset{block-size:calc(1px*(40 + 4*clamp(-1,var(--vvd-size-density, 0),2)))}.base:not(.shape-pill) .fieldset{border-radius:8px}.base.shape-pill .fieldset{border-radius:24px}.wrapper{block-size:100%;border-radius:inherit;inline-size:100%}.wrapper:focus-visible{outline:none}.control:not(slot),.control::slotted(input){width:100%!important;box-sizing:border-box!important;border:0 none!important;margin:initial!important;appearance:none!important;background-color:transparent!important;block-size:100%!important;border-radius:inherit!important;color:inherit!important;font:inherit;padding-block:0!important;padding-inline-end:var(--_text-field-gutter-end)!important;padding-inline-start:var(--_text-field-gutter-start)!important}.control:not(slot):disabled,.control::slotted(input:disabled){cursor:not-allowed!important;opacity:1!important;-webkit-text-fill-color:var(--_appearance-color-text)!important}.control:not(slot)::placeholder{opacity:1!important;-webkit-text-fill-color:var(--_low-ink-color)!important}.control:not(slot):focus-visible,.control::slotted(input:focus-visible){outline:none}.has-icon .control:not(slot),.has-icon .control::slotted(input){padding-inline-start:calc(var(--_text-field-icon-size) + var(--_text-field-gutter-start) * 2)!important}.icon{position:absolute;z-index:1;color:var(--_low-ink-color);font-size:var(--_text-field-icon-size);inset-block-start:50%;inset-inline-start:calc(100% + var(--_text-field-gutter-start));line-height:1;transform:translateY(-50%)}.leading-items-wrapper{position:relative}.base.no-leading .leading-items-wrapper{display:none}.action-items-wrapper{margin-inline-end:4px}.base:not(.action-items) .action-items-wrapper{display:none}.focus-indicator{--focus-stroke-gap-color: transparent;pointer-events:none}.wrapper:not(:focus-visible,:focus-within)>.focus-indicator,.fieldset:not(:focus-visible,:focus-within)>.focus-indicator{display:none}.base{--_text-field-gutter-end: 70px}.control::-webkit-outer-spin-button,.control::-webkit-inner-spin-button{appearance:none}.control-buttons{position:absolute;z-index:1;right:3px;display:flex}.readonly .control-buttons,.disabled .control-buttons{pointer-events:none}.control-buttons .divider{margin-block:8px}.control-buttons>*{flex-shrink:0}.disabled .focus-indicator{display:none;pointer-events:none}\n";
315
315
 
316
316
  var __defProp = Object.defineProperty;
317
317
  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -2,7 +2,7 @@
2
2
 
3
3
  const index = require('./index.cjs');
4
4
  const definition = require('./definition26.cjs');
5
- const definition$1 = require('./definition58.cjs');
5
+ const definition$1 = require('./definition59.cjs');
6
6
  const affix = require('./affix.cjs');
7
7
  const ariaGlobal = require('./aria-global.cjs');
8
8
  const startEnd = require('./start-end.cjs');
@@ -1,6 +1,6 @@
1
1
  import { F as FoundationElement, O as Observable, _ as __decorate, o as observable, a as attr, h as html, r as registerFactory } from './index.js';
2
2
  import { a as iconRegistries } from './definition26.js';
3
- import { f as focusRegistries } from './definition58.js';
3
+ import { f as focusRegistries } from './definition59.js';
4
4
  import { b as AffixIconWithTrailing, a as affixIconTemplateFactory, I as IconWrapper } from './affix.js';
5
5
  import { A as ARIAGlobalStatesAndProperties } from './aria-global.js';
6
6
  import { S as StartEnd } from './start-end.js';
@@ -2,7 +2,7 @@
2
2
 
3
3
  const index = require('./index.cjs');
4
4
  const definition$2 = require('./definition11.cjs');
5
- const definition = require('./definition59.cjs');
5
+ const definition = require('./definition60.cjs');
6
6
  const definition$1 = require('./definition26.cjs');
7
7
  const enums = require('./enums.cjs');
8
8
  const affix = require('./affix.cjs');
@@ -48,6 +48,8 @@ class Alert extends index.FoundationElement {
48
48
  this.#onTransitionEnd = () => {
49
49
  if (!this.open) {
50
50
  this.style.display = "none";
51
+ } else {
52
+ this.style.display = "contents";
51
53
  }
52
54
  };
53
55
  }
@@ -59,7 +61,7 @@ class Alert extends index.FoundationElement {
59
61
  this.$emit(newValue ? "open" : "close");
60
62
  this.#setupTimeout();
61
63
  if (newValue) {
62
- this.style.display = "inline";
64
+ this.style.display = "contents";
63
65
  const alertText = this.shadowRoot.querySelector(".alert-text");
64
66
  if (this.removable && alertText) {
65
67
  alertText.setAttribute("tabindex", "0");
@@ -1,6 +1,6 @@
1
1
  import { a as attr, F as FoundationElement, n as nullableNumberConverter, h as html, r as registerFactory } from './index.js';
2
2
  import { a as buttonRegistries } from './definition11.js';
3
- import { E as Elevation, e as elevationRegistries } from './definition59.js';
3
+ import { E as Elevation, e as elevationRegistries } from './definition60.js';
4
4
  import { a as iconRegistries } from './definition26.js';
5
5
  import { C as Connotation } from './enums.js';
6
6
  import { A as AffixIcon, a as affixIconTemplateFactory } from './affix.js';
@@ -46,6 +46,8 @@ class Alert extends FoundationElement {
46
46
  this.#onTransitionEnd = () => {
47
47
  if (!this.open) {
48
48
  this.style.display = "none";
49
+ } else {
50
+ this.style.display = "contents";
49
51
  }
50
52
  };
51
53
  }
@@ -57,7 +59,7 @@ class Alert extends FoundationElement {
57
59
  this.$emit(newValue ? "open" : "close");
58
60
  this.#setupTimeout();
59
61
  if (newValue) {
60
- this.style.display = "inline";
62
+ this.style.display = "contents";
61
63
  const alertText = this.shadowRoot.querySelector(".alert-text");
62
64
  if (this.removable && alertText) {
63
65
  alertText.setAttribute("tabindex", "0");
@@ -1,13 +1,12 @@
1
1
  'use strict';
2
2
 
3
3
  const index = require('./index.cjs');
4
- const definition = require('./definition58.cjs');
4
+ const definition = require('./definition59.cjs');
5
5
  const radio = require('./radio.cjs');
6
- const focus = require('./focus2.cjs');
7
6
  const when = require('./when.cjs');
8
7
  const classNames = require('./class-names.cjs');
9
8
 
10
- const styles = "@supports selector(:focus-visible){:host(:focus-visible){outline:none}}:host([disabled]){cursor:not-allowed}.base{display:inline-flex;align-items:center;cursor:pointer;gap:8px}.base.connotation-cta{--_connotation-color-primary: var(--vvd-radio-cta-primary, var(--vvd-color-cta-500));--_connotation-color-primary-text: var(--vvd-radio-cta-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-radio-cta-primary-increment, var(--vvd-color-cta-600));--_connotation-color-intermediate: var(--vvd-radio-cta-intermediate, var(--vvd-color-cta-500));--_connotation-color-backdrop: var(--vvd-radio-cta-backdrop, var(--vvd-color-cta-50));--_connotation-color-firm: var(--vvd-radio-cta-firm, var(--vvd-color-cta-600))}.base:not(.connotation-cta){--_connotation-color-primary: var(--vvd-radio-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-radio-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-radio-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-intermediate: var(--vvd-radio-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-backdrop: var(--vvd-radio-accent-backdrop, var(--vvd-color-canvas));--_connotation-color-firm: var(--vvd-radio-accent-firm, var(--vvd-color-canvas-text))}.base{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--_connotation-color-backdrop);--_appearance-color-outline: var(--_connotation-color-intermediate)}.base:where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--_connotation-color-backdrop);--_appearance-color-outline: var(--_connotation-color-firm)}.base:where(:checked,.checked):where(:not(:disabled,.disabled)){--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary);--_appearance-color-outline: var(--_connotation-color-primary)}.base:where(:checked,.checked):where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary-increment);--_appearance-color-outline: var(--_connotation-color-primary)}.base:where(:disabled,.disabled){--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.base:where(.readonly):where(:not(:disabled,.disabled)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-neutral-200);--_appearance-color-outline: var(--vvd-color-neutral-400)}@supports (user-select: none){.base{user-select:none}}.base.disabled{pointer-events:none}.control{position:relative;flex-shrink:0;block-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)));border-radius:50%;box-shadow:inset 0 0 0 2px var(--_appearance-color-outline);inline-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)))}.base:not(.checked) .control{background-color:var(--_appearance-color-fill)}.control:after{position:absolute;background-color:var(--_appearance-color-outline);border-radius:inherit;content:\"\";inset:5px;opacity:1;transition:opacity .2s}.base:not(.checked) .control:after{opacity:0}label{color:var(--vvd-color-canvas-text);cursor:pointer;font:var(--vvd-typography-base)}.focus-indicator{--focus-inset: -3px;--focus-stroke-gap-color: transparent;border-radius:50%}:host(:not(:focus-visible)) .focus-indicator{display:none}\n";
9
+ const styles = ":host(:focus-visible){outline:none}:host([disabled]){cursor:not-allowed}.base{display:inline-flex;align-items:center;cursor:pointer;gap:8px}.base.connotation-cta{--_connotation-color-primary: var(--vvd-radio-cta-primary, var(--vvd-color-cta-500));--_connotation-color-primary-text: var(--vvd-radio-cta-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-radio-cta-primary-increment, var(--vvd-color-cta-600));--_connotation-color-intermediate: var(--vvd-radio-cta-intermediate, var(--vvd-color-cta-500));--_connotation-color-firm: var(--vvd-radio-cta-firm, var(--vvd-color-cta-600));--_connotation-color-fierce: var(--vvd-radio-cta-fierce, var(--vvd-color-cta-700))}.base:not(.connotation-cta){--_connotation-color-primary: var(--vvd-radio-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-radio-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-radio-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-intermediate: var(--vvd-radio-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-firm: var(--vvd-radio-accent-firm, var(--vvd-color-canvas-text));--_connotation-color-fierce: var(--vvd-radio-accent-fierce, var(--vvd-color-neutral-700))}.base{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--_connotation-color-intermediate)}.base:where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--_connotation-color-fierce)}.base:where(:checked,.checked):where(:not(:disabled,.disabled)){--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary);--_appearance-color-outline: var(--_connotation-color-primary)}.base:where(:checked,.checked):where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary-increment);--_appearance-color-outline: var(--_connotation-color-primary-increment)}.base:where(:disabled,.disabled){--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.base:where(.readonly):where(:not(:disabled,.disabled)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-neutral-200);--_appearance-color-outline: var(--vvd-color-neutral-400)}@supports (user-select: none){.base{user-select:none}}.base.disabled{pointer-events:none}.control{position:relative;flex-shrink:0;block-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)));border-radius:50%;box-shadow:inset 0 0 0 2px var(--_appearance-color-outline);inline-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)))}.base:not(.checked) .control{background-color:var(--_appearance-color-fill)}.control:after{position:absolute;background-color:var(--_appearance-color-outline);border-radius:inherit;content:\"\";inset:5px;opacity:1;transition:opacity .2s}.base:not(.checked) .control:after{opacity:0}:host(:focus-visible) .control{--focus-inset: -3px;--focus-stroke-gap-color: transparent}:host(:focus-visible) .control:before{box-shadow:inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:2px solid var(--focus-stroke-color, var(--vvd-color-canvas-text));outline-offset:calc(-2px - var(--focus-inset, 0px));position:absolute;display:block;block-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)));border-radius:inherit;content:\"\";inline-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)))}label{color:var(--vvd-color-canvas-text);cursor:pointer;font:var(--vvd-typography-base)}.focus-indicator{--focus-inset: -3px;--focus-stroke-gap-color: transparent;border-radius:50%}:host(:not(:focus-visible)) .focus-indicator{display:none}\n";
11
10
 
12
11
  const getClasses = ({ connotation, checked, readOnly, disabled }) => classNames.classNames(
13
12
  "base",
@@ -16,8 +15,7 @@ const getClasses = ({ connotation, checked, readOnly, disabled }) => classNames.
16
15
  ["readonly", Boolean(readOnly)],
17
16
  ["disabled", Boolean(disabled)]
18
17
  );
19
- const RadioTemplate = (context) => {
20
- const focusTemplate = focus.focusTemplateFactory(context);
18
+ const RadioTemplate = () => {
21
19
  return index.html`<template role="${(x) => x.ariaLabel ? "presentation" : null}">
22
20
  <div class="${getClasses}"
23
21
  role="radio"
@@ -29,7 +27,6 @@ const RadioTemplate = (context) => {
29
27
  @click="${(x, c) => x.clickHandler(c.event)}"
30
28
  >
31
29
  <div class="control">
32
- ${() => focusTemplate}
33
30
  </div>
34
31
  ${when.when((x) => x.label, index.html`<label class="label">${(x) => x.label}</label>`)}
35
32
  </div>
@@ -1,11 +1,10 @@
1
1
  import { h as html, r as registerFactory } from './index.js';
2
- import { f as focusRegistries } from './definition58.js';
2
+ import { f as focusRegistries } from './definition59.js';
3
3
  import { R as Radio } from './radio.js';
4
- import { f as focusTemplateFactory } from './focus2.js';
5
4
  import { w as when } from './when.js';
6
5
  import { c as classNames } from './class-names.js';
7
6
 
8
- const styles = "@supports selector(:focus-visible){:host(:focus-visible){outline:none}}:host([disabled]){cursor:not-allowed}.base{display:inline-flex;align-items:center;cursor:pointer;gap:8px}.base.connotation-cta{--_connotation-color-primary: var(--vvd-radio-cta-primary, var(--vvd-color-cta-500));--_connotation-color-primary-text: var(--vvd-radio-cta-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-radio-cta-primary-increment, var(--vvd-color-cta-600));--_connotation-color-intermediate: var(--vvd-radio-cta-intermediate, var(--vvd-color-cta-500));--_connotation-color-backdrop: var(--vvd-radio-cta-backdrop, var(--vvd-color-cta-50));--_connotation-color-firm: var(--vvd-radio-cta-firm, var(--vvd-color-cta-600))}.base:not(.connotation-cta){--_connotation-color-primary: var(--vvd-radio-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-radio-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-radio-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-intermediate: var(--vvd-radio-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-backdrop: var(--vvd-radio-accent-backdrop, var(--vvd-color-canvas));--_connotation-color-firm: var(--vvd-radio-accent-firm, var(--vvd-color-canvas-text))}.base{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--_connotation-color-backdrop);--_appearance-color-outline: var(--_connotation-color-intermediate)}.base:where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--_connotation-color-backdrop);--_appearance-color-outline: var(--_connotation-color-firm)}.base:where(:checked,.checked):where(:not(:disabled,.disabled)){--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary);--_appearance-color-outline: var(--_connotation-color-primary)}.base:where(:checked,.checked):where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary-increment);--_appearance-color-outline: var(--_connotation-color-primary)}.base:where(:disabled,.disabled){--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.base:where(.readonly):where(:not(:disabled,.disabled)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-neutral-200);--_appearance-color-outline: var(--vvd-color-neutral-400)}@supports (user-select: none){.base{user-select:none}}.base.disabled{pointer-events:none}.control{position:relative;flex-shrink:0;block-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)));border-radius:50%;box-shadow:inset 0 0 0 2px var(--_appearance-color-outline);inline-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)))}.base:not(.checked) .control{background-color:var(--_appearance-color-fill)}.control:after{position:absolute;background-color:var(--_appearance-color-outline);border-radius:inherit;content:\"\";inset:5px;opacity:1;transition:opacity .2s}.base:not(.checked) .control:after{opacity:0}label{color:var(--vvd-color-canvas-text);cursor:pointer;font:var(--vvd-typography-base)}.focus-indicator{--focus-inset: -3px;--focus-stroke-gap-color: transparent;border-radius:50%}:host(:not(:focus-visible)) .focus-indicator{display:none}\n";
7
+ const styles = ":host(:focus-visible){outline:none}:host([disabled]){cursor:not-allowed}.base{display:inline-flex;align-items:center;cursor:pointer;gap:8px}.base.connotation-cta{--_connotation-color-primary: var(--vvd-radio-cta-primary, var(--vvd-color-cta-500));--_connotation-color-primary-text: var(--vvd-radio-cta-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-radio-cta-primary-increment, var(--vvd-color-cta-600));--_connotation-color-intermediate: var(--vvd-radio-cta-intermediate, var(--vvd-color-cta-500));--_connotation-color-firm: var(--vvd-radio-cta-firm, var(--vvd-color-cta-600));--_connotation-color-fierce: var(--vvd-radio-cta-fierce, var(--vvd-color-cta-700))}.base:not(.connotation-cta){--_connotation-color-primary: var(--vvd-radio-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-radio-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-radio-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-intermediate: var(--vvd-radio-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-firm: var(--vvd-radio-accent-firm, var(--vvd-color-canvas-text));--_connotation-color-fierce: var(--vvd-radio-accent-fierce, var(--vvd-color-neutral-700))}.base{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--_connotation-color-intermediate)}.base:where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--_connotation-color-fierce)}.base:where(:checked,.checked):where(:not(:disabled,.disabled)){--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary);--_appearance-color-outline: var(--_connotation-color-primary)}.base:where(:checked,.checked):where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary-increment);--_appearance-color-outline: var(--_connotation-color-primary-increment)}.base:where(:disabled,.disabled){--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.base:where(.readonly):where(:not(:disabled,.disabled)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-neutral-200);--_appearance-color-outline: var(--vvd-color-neutral-400)}@supports (user-select: none){.base{user-select:none}}.base.disabled{pointer-events:none}.control{position:relative;flex-shrink:0;block-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)));border-radius:50%;box-shadow:inset 0 0 0 2px var(--_appearance-color-outline);inline-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)))}.base:not(.checked) .control{background-color:var(--_appearance-color-fill)}.control:after{position:absolute;background-color:var(--_appearance-color-outline);border-radius:inherit;content:\"\";inset:5px;opacity:1;transition:opacity .2s}.base:not(.checked) .control:after{opacity:0}:host(:focus-visible) .control{--focus-inset: -3px;--focus-stroke-gap-color: transparent}:host(:focus-visible) .control:before{box-shadow:inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:2px solid var(--focus-stroke-color, var(--vvd-color-canvas-text));outline-offset:calc(-2px - var(--focus-inset, 0px));position:absolute;display:block;block-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)));border-radius:inherit;content:\"\";inline-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)))}label{color:var(--vvd-color-canvas-text);cursor:pointer;font:var(--vvd-typography-base)}.focus-indicator{--focus-inset: -3px;--focus-stroke-gap-color: transparent;border-radius:50%}:host(:not(:focus-visible)) .focus-indicator{display:none}\n";
9
8
 
10
9
  const getClasses = ({ connotation, checked, readOnly, disabled }) => classNames(
11
10
  "base",
@@ -14,8 +13,7 @@ const getClasses = ({ connotation, checked, readOnly, disabled }) => classNames(
14
13
  ["readonly", Boolean(readOnly)],
15
14
  ["disabled", Boolean(disabled)]
16
15
  );
17
- const RadioTemplate = (context) => {
18
- const focusTemplate = focusTemplateFactory(context);
16
+ const RadioTemplate = () => {
19
17
  return html`<template role="${(x) => x.ariaLabel ? "presentation" : null}">
20
18
  <div class="${getClasses}"
21
19
  role="radio"
@@ -27,7 +25,6 @@ const RadioTemplate = (context) => {
27
25
  @click="${(x, c) => x.clickHandler(c.event)}"
28
26
  >
29
27
  <div class="control">
30
- ${() => focusTemplate}
31
28
  </div>
32
29
  ${when((x) => x.label, html`<label class="label">${(x) => x.label}</label>`)}
33
30
  </div>
@@ -1,8 +1,8 @@
1
1
  'use strict';
2
2
 
3
3
  const index = require('./index.cjs');
4
- const definition$2 = require('./definition58.cjs');
5
- const definition = require('./definition60.cjs');
4
+ const definition$2 = require('./definition59.cjs');
5
+ const definition = require('./definition61.cjs');
6
6
  const definition$3 = require('./definition26.cjs');
7
7
  const definition$1 = require('./definition35.cjs');
8
8
  const affix = require('./affix.cjs');
@@ -516,7 +516,7 @@ index.__decorate([
516
516
  applyMixins.applyMixins(DelegatesARIASelect, listbox.DelegatesARIAListbox);
517
517
  applyMixins.applyMixins(Select$1, startEnd.StartEnd, DelegatesARIASelect);
518
518
 
519
- const styles = "@supports selector(:focus-visible){:host(:focus-visible){outline:none}}:host{display:inline-flex;flex-direction:column;gap:4px;--_low-ink-color: var(--vvd-color-neutral-600);--focus-stroke-gap-color: transparent}:host([disabled]){--_low-ink-color: var(--vvd-color-neutral-400);cursor:not-allowed}.label{color:var(--vvd-color-canvas-text);contain:inline-size;font:var(--vvd-typography-base)}.control{display:flex;align-items:center;justify-content:space-between;background-color:var(--_appearance-color-fill);block-size:calc(1px*(40 + 4*clamp(-1,var(--vvd-size-density, 0),2)));border-radius:var(--_select-control-border-radius);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);font:var(--vvd-typography-base);gap:8px;padding-inline:16px;transition:box-shadow .2s,background-color .2s}.control{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--_connotation-color-backdrop);--_appearance-color-outline: var(--_connotation-color-intermediate)}.control.appearance-ghost{--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.control:where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--_connotation-color-backdrop);--_appearance-color-outline: var(--_connotation-color-firm)}.control:where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)).appearance-ghost{--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: transparent}.control:where(:disabled,.disabled){--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.control:where(:disabled,.disabled).appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.control:where(.readonly):where(:not(:disabled,.disabled)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-neutral-200);--_appearance-color-outline: var(--vvd-color-neutral-400)}.control:where(.readonly):where(:not(:disabled,.disabled)).appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-600);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.control.connotation-success{--_connotation-color-primary: var(--vvd-select-success-primary, var(--vvd-color-success-500));--_connotation-color-backdrop: var(--vvd-select-success-backdrop, var(--vvd-color-success-50));--_connotation-color-intermediate: var(--vvd-select-success-intermediate, var(--vvd-color-success-500));--_connotation-color-firm: var(--vvd-select-success-firm, var(--vvd-color-success-600))}.control.connotation-alert{--_connotation-color-primary: var(--vvd-select-alert-primary, var(--vvd-color-alert-500));--_connotation-color-backdrop: var(--vvd-select-alert-backdrop, var(--vvd-color-alert-50));--_connotation-color-intermediate: var(--vvd-select-alert-intermediate, var(--vvd-color-alert-500));--_connotation-color-firm: var(--vvd-select-alert-firm, var(--vvd-color-alert-600))}.control:not(.connotation-success,.connotation-alert){--_connotation-color-primary: var(--vvd-select-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-backdrop: var(--vvd-select-accent-backdrop, var(--vvd-color-canvas));--_connotation-color-intermediate: var(--vvd-select-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-firm: var(--vvd-select-accent-firm, var(--vvd-color-canvas-text))}.control-wrapper{position:relative}.control:not(.disabled){cursor:pointer}.control.disabled{pointer-events:none}.control:not(.shape-pill){--_select-control-border-radius: 8px}.control.shape-pill{--_select-control-border-radius: 24px}:host(:focus-visible) .control{box-shadow:inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:2px solid var(--focus-stroke-color, var(--vvd-color-canvas-text));outline-offset:calc(-2px - var(--focus-inset, 0px))}.listbox{display:flex;max-height:var(--select-height, 408px);flex-direction:column;padding:4px;gap:2px;overflow-y:auto}:host([multiple]:focus-visible) .listbox{box-shadow:inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:2px solid var(--focus-stroke-color, var(--vvd-color-canvas-text));outline-offset:calc(-2px - var(--focus-inset, 0px));border-radius:8px}.icon{display:flex;flex-shrink:0}.selected-value{display:flex;overflow:hidden;flex-grow:1;align-items:center;column-gap:12px;white-space:nowrap}.selected-value .text{overflow:hidden;max-inline-size:100%;text-overflow:ellipsis}.selected-value slot[name=icon]{flex:0 0 20px;font-size:20px;line-height:1}.control.has-meta .selected-value{padding-inline-end:8px}::part(popup-base){inline-size:max-content;min-inline-size:var(--_select-fixed-width, 100%)}:host([multiple]) ::part(popup-base){position:static}\n";
519
+ const styles = "@supports selector(:focus-visible){:host(:focus-visible){outline:none}}:host{display:inline-flex;flex-direction:column;gap:4px;--_low-ink-color: var(--vvd-color-neutral-600);--focus-stroke-gap-color: transparent}:host([disabled]){--_low-ink-color: var(--vvd-color-neutral-400);cursor:not-allowed}.label{color:var(--vvd-color-canvas-text);contain:inline-size;font:var(--vvd-typography-base)}.control{display:flex;align-items:center;justify-content:space-between;background-color:var(--_appearance-color-fill);block-size:calc(1px*(40 + 4*clamp(-1,var(--vvd-size-density, 0),2)));border-radius:var(--_select-control-border-radius);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);font:var(--vvd-typography-base);gap:8px;padding-inline:16px;transition:box-shadow .2s,background-color .2s}.control{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--_connotation-color-intermediate)}.control.appearance-ghost{--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.control:where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--_connotation-color-fierce)}.control:where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)).appearance-ghost{--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: transparent}.control:where(:disabled,.disabled){--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.control:where(:disabled,.disabled).appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.control:where(.readonly):where(:not(:disabled,.disabled)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-neutral-200);--_appearance-color-outline: var(--vvd-color-neutral-400)}.control:where(.readonly):where(:not(:disabled,.disabled)).appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-600);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.control.connotation-success{--_connotation-color-primary: var(--vvd-select-success-primary, var(--vvd-color-success-500));--_connotation-color-primary-text: var(--vvd-select-success-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-select-success-primary-increment, var(--vvd-color-success-600));--_connotation-color-intermediate: var(--vvd-select-success-intermediate, var(--vvd-color-success-500));--_connotation-color-firm: var(--vvd-select-success-firm, var(--vvd-color-success-600));--_connotation-color-fierce: var(--vvd-select-success-fierce, var(--vvd-color-success-700))}.control.connotation-alert{--_connotation-color-primary: var(--vvd-select-alert-primary, var(--vvd-color-alert-500));--_connotation-color-primary-text: var(--vvd-select-alert-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-select-alert-primary-increment, var(--vvd-color-alert-600));--_connotation-color-intermediate: var(--vvd-select-alert-intermediate, var(--vvd-color-alert-500));--_connotation-color-firm: var(--vvd-select-alert-firm, var(--vvd-color-alert-600));--_connotation-color-fierce: var(--vvd-select-alert-fierce, var(--vvd-color-alert-700))}.control:not(.connotation-success,.connotation-alert){--_connotation-color-primary: var(--vvd-select-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-select-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-select-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-intermediate: var(--vvd-select-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-firm: var(--vvd-select-accent-firm, var(--vvd-color-canvas-text));--_connotation-color-fierce: var(--vvd-select-accent-fierce, var(--vvd-color-neutral-700))}.control-wrapper{position:relative}.control:not(.disabled){cursor:pointer}.control.disabled{pointer-events:none}.control:not(.shape-pill){--_select-control-border-radius: 8px}.control.shape-pill{--_select-control-border-radius: 24px}:host(:focus-visible) .control{box-shadow:inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:2px solid var(--focus-stroke-color, var(--vvd-color-canvas-text));outline-offset:calc(-2px - var(--focus-inset, 0px))}.listbox{display:flex;max-height:var(--select-height, 408px);flex-direction:column;padding:4px;gap:2px;overflow-y:auto}:host([multiple]:focus-visible) .listbox{box-shadow:inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:2px solid var(--focus-stroke-color, var(--vvd-color-canvas-text));outline-offset:calc(-2px - var(--focus-inset, 0px));border-radius:8px}.icon{display:flex;flex-shrink:0}.selected-value{display:flex;overflow:hidden;flex-grow:1;align-items:center;column-gap:12px;white-space:nowrap}.selected-value .text{overflow:hidden;max-inline-size:100%;text-overflow:ellipsis}.selected-value slot[name=icon]{flex:0 0 20px;font-size:20px;line-height:1}.control.has-meta .selected-value{padding-inline-end:8px}::part(popup-base){inline-size:max-content;min-inline-size:var(--_select-fixed-width, 100%)}:host([multiple]) ::part(popup-base){position:static}\n";
520
520
 
521
521
  var __defProp = Object.defineProperty;
522
522
  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;