@vonage/vivid 3.54.0 → 3.56.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.
- package/accordion/index.cjs +0 -14
- package/accordion/index.js +0 -14
- package/accordion-item/index.cjs +0 -11
- package/accordion-item/index.js +0 -11
- package/action-group/index.cjs +0 -2
- package/action-group/index.js +0 -2
- package/alert/index.cjs +0 -23
- package/alert/index.js +0 -23
- package/appearance-ui/index.cjs +11 -12
- package/appearance-ui/index.js +11 -12
- package/audio-player/index.cjs +0 -28
- package/audio-player/index.js +0 -28
- package/avatar/index.cjs +0 -6
- package/avatar/index.js +0 -6
- package/badge/index.cjs +0 -9
- package/badge/index.js +0 -9
- package/banner/index.cjs +0 -22
- package/banner/index.js +0 -22
- package/breadcrumb/index.cjs +0 -8
- package/breadcrumb/index.js +0 -8
- package/breadcrumb-item/index.cjs +0 -15
- package/breadcrumb-item/index.js +0 -15
- package/button/index.cjs +0 -18
- package/button/index.js +0 -18
- package/calendar/index.cjs +0 -4
- package/calendar/index.js +0 -4
- package/calendar-event/index.cjs +0 -4
- package/calendar-event/index.js +0 -4
- package/card/index.cjs +0 -9
- package/card/index.js +0 -9
- package/checkbox/index.cjs +0 -14
- package/checkbox/index.js +0 -14
- package/combobox/index.cjs +0 -31
- package/combobox/index.js +0 -31
- package/custom-elements.json +169 -141
- package/data-grid/index.cjs +0 -11
- package/data-grid/index.js +0 -11
- package/date-picker/index.cjs +0 -34
- package/date-picker/index.js +0 -34
- package/date-range-picker/index.cjs +0 -34
- package/date-range-picker/index.js +0 -34
- package/dial-pad/index.cjs +0 -28
- package/dial-pad/index.js +0 -28
- package/dialog/index.cjs +0 -23
- package/dialog/index.js +0 -23
- package/divider/index.cjs +0 -3
- package/divider/index.js +0 -3
- package/elevation/index.cjs +0 -2
- package/elevation/index.js +0 -2
- package/empty-state/index.cjs +0 -7
- package/empty-state/index.js +0 -7
- package/fab/index.cjs +0 -15
- package/fab/index.js +0 -15
- package/file-picker/index.cjs +0 -23
- package/file-picker/index.js +0 -23
- package/header/index.cjs +0 -3
- package/header/index.js +0 -3
- package/icon/index.cjs +0 -5
- package/icon/index.js +0 -5
- package/index.cjs +0 -44
- package/index.js +0 -44
- package/layout/index.cjs +0 -2
- package/layout/index.js +0 -2
- package/lib/button/button.d.ts +1 -1
- package/lib/combobox/combobox.d.ts +1 -0
- package/lib/dial-pad/dial-pad.d.ts +1 -0
- package/lib/menu/menu.d.ts +1 -3
- package/lib/slider/slider.d.ts +4 -0
- package/listbox/index.cjs +1 -15
- package/listbox/index.js +1 -15
- package/locales/de-DE.cjs +329 -0
- package/locales/de-DE.d.ts +3 -0
- package/locales/de-DE.js +327 -0
- package/locales/en-GB.cjs +4 -0
- package/locales/en-GB.js +4 -0
- package/locales/en-US.cjs +4 -0
- package/locales/en-US.js +4 -0
- package/locales/ja-JP.cjs +4 -0
- package/locales/ja-JP.js +4 -0
- package/locales/zh-CN.cjs +4 -0
- package/locales/zh-CN.js +4 -0
- package/menu/index.cjs +0 -25
- package/menu/index.js +0 -25
- package/menu-item/index.cjs +0 -15
- package/menu-item/index.js +0 -15
- package/nav/index.cjs +0 -1
- package/nav/index.js +0 -1
- package/nav-disclosure/index.cjs +0 -10
- package/nav-disclosure/index.js +0 -10
- package/nav-item/index.cjs +0 -15
- package/nav-item/index.js +0 -15
- package/note/index.cjs +0 -11
- package/note/index.js +0 -11
- package/number-field/index.cjs +0 -26
- package/number-field/index.js +0 -26
- package/option/index.cjs +0 -13
- package/option/index.js +0 -13
- package/package.json +1 -1
- package/pagination/index.cjs +0 -21
- package/pagination/index.js +0 -21
- package/popup/index.cjs +0 -20
- package/popup/index.js +0 -20
- package/progress/index.cjs +0 -4
- package/progress/index.js +0 -4
- package/progress-ring/index.cjs +0 -4
- package/progress-ring/index.js +0 -4
- package/radio/index.cjs +0 -6
- package/radio/index.js +0 -6
- package/radio-group/index.cjs +0 -9
- package/radio-group/index.js +0 -9
- package/range-slider/index.cjs +0 -17
- package/range-slider/index.js +0 -17
- package/select/index.cjs +0 -31
- package/select/index.js +0 -31
- package/selectable-box/index.cjs +0 -18
- package/selectable-box/index.js +0 -18
- package/shared/affix.cjs +6 -7
- package/shared/affix.js +6 -7
- package/shared/anchored.cjs +39 -46
- package/shared/anchored.js +39 -46
- package/shared/calendar-event.cjs +10 -11
- package/shared/calendar-event.js +10 -11
- package/shared/definition.cjs +8 -9
- package/shared/definition.js +8 -9
- package/shared/definition10.cjs +1 -1
- package/shared/definition10.js +1 -1
- package/shared/definition11.cjs +20 -21
- package/shared/definition11.js +20 -21
- package/shared/definition12.cjs +1 -1
- package/shared/definition12.js +1 -1
- package/shared/definition13.cjs +9 -14
- package/shared/definition13.js +9 -14
- package/shared/definition14.cjs +13 -14
- package/shared/definition14.js +13 -14
- package/shared/definition15.cjs +1 -1
- package/shared/definition15.js +1 -1
- package/shared/definition16.cjs +16 -3
- package/shared/definition16.js +16 -3
- package/shared/definition17.cjs +155 -166
- package/shared/definition17.js +155 -166
- package/shared/definition19.cjs +2 -2
- package/shared/definition19.js +2 -2
- package/shared/definition2.cjs +1 -1
- package/shared/definition2.js +1 -1
- package/shared/definition20.cjs +22 -19
- package/shared/definition20.js +22 -19
- package/shared/definition21.cjs +17 -18
- package/shared/definition21.js +17 -18
- package/shared/definition22.cjs +2 -2
- package/shared/definition22.js +2 -2
- package/shared/definition23.cjs +7 -8
- package/shared/definition23.js +7 -8
- package/shared/definition24.cjs +7 -8
- package/shared/definition24.js +7 -8
- package/shared/definition25.cjs +29 -4
- package/shared/definition25.js +29 -4
- package/shared/definition26.cjs +6 -7
- package/shared/definition26.js +6 -7
- package/shared/definition27.cjs +2 -2
- package/shared/definition27.js +2 -2
- package/shared/definition28.cjs +9 -10
- package/shared/definition28.js +9 -10
- package/shared/definition29.cjs +23 -49
- package/shared/definition29.js +23 -49
- package/shared/definition3.cjs +9 -10
- package/shared/definition3.js +9 -10
- package/shared/definition30.cjs +4 -2
- package/shared/definition30.js +4 -2
- package/shared/definition31.cjs +9 -10
- package/shared/definition31.js +9 -10
- package/shared/definition32.cjs +1 -1
- package/shared/definition32.js +1 -1
- package/shared/definition33.cjs +1 -1
- package/shared/definition33.js +1 -1
- package/shared/definition34.cjs +6 -7
- package/shared/definition34.js +6 -7
- package/shared/definition35.cjs +1 -1
- package/shared/definition35.js +1 -1
- package/shared/definition36.cjs +6 -7
- package/shared/definition36.js +6 -7
- package/shared/definition37.cjs +1 -1
- package/shared/definition37.js +1 -1
- package/shared/definition38.cjs +7 -8
- package/shared/definition38.js +7 -8
- package/shared/definition39.cjs +8 -9
- package/shared/definition39.js +8 -9
- package/shared/definition4.cjs +14 -15
- package/shared/definition4.js +14 -15
- package/shared/definition40.cjs +7 -8
- package/shared/definition40.js +7 -8
- package/shared/definition41.cjs +1 -1
- package/shared/definition41.js +1 -1
- package/shared/definition42.cjs +4 -4
- package/shared/definition42.js +4 -4
- package/shared/definition43.cjs +1 -1
- package/shared/definition43.js +1 -1
- package/shared/definition44.cjs +11 -12
- package/shared/definition44.js +11 -12
- package/shared/definition45.cjs +8 -9
- package/shared/definition45.js +8 -9
- package/shared/definition46.cjs +18 -10
- package/shared/definition46.js +18 -10
- package/shared/definition47.cjs +15 -16
- package/shared/definition47.js +15 -16
- package/shared/definition48.cjs +6 -7
- package/shared/definition48.js +6 -7
- package/shared/definition5.cjs +37 -35
- package/shared/definition5.js +37 -35
- package/shared/definition50.cjs +9 -10
- package/shared/definition50.js +9 -10
- package/shared/definition51.cjs +8 -9
- package/shared/definition51.js +8 -9
- package/shared/definition52.cjs +5 -6
- package/shared/definition52.js +5 -6
- package/shared/definition53.cjs +12 -13
- package/shared/definition53.js +12 -13
- package/shared/definition54.cjs +2 -2
- package/shared/definition54.js +2 -2
- package/shared/definition55.cjs +1 -11
- package/shared/definition55.js +1 -11
- package/shared/definition56.cjs +1 -1
- package/shared/definition56.js +1 -1
- package/shared/definition57.cjs +1 -1
- package/shared/definition57.js +1 -1
- package/shared/definition58.cjs +1 -1
- package/shared/definition58.js +1 -1
- package/shared/definition59.cjs +5 -6
- package/shared/definition59.js +5 -6
- package/shared/definition6.cjs +10 -11
- package/shared/definition6.js +10 -11
- package/shared/definition60.cjs +1 -1
- package/shared/definition60.js +1 -1
- package/shared/definition61.cjs +11 -15
- package/shared/definition61.js +11 -15
- package/shared/definition62.cjs +6 -7
- package/shared/definition62.js +6 -7
- package/shared/definition63.cjs +11 -15
- package/shared/definition63.js +11 -15
- package/shared/definition7.cjs +8 -9
- package/shared/definition7.js +8 -9
- package/shared/definition8.cjs +13 -14
- package/shared/definition8.js +13 -14
- package/shared/definition9.cjs +5 -6
- package/shared/definition9.js +5 -6
- package/shared/icon.cjs +4 -8
- package/shared/icon.js +4 -8
- package/shared/index.cjs +38 -19
- package/shared/index.js +38 -19
- package/shared/index2.cjs +16 -19
- package/shared/index2.js +16 -19
- package/shared/listbox.cjs +6 -7
- package/shared/listbox.js +6 -7
- package/shared/localization/Locale.d.ts +4 -0
- package/shared/presentationDate.cjs +40 -50
- package/shared/presentationDate.js +40 -50
- package/shared/radio.cjs +6 -7
- package/shared/radio.js +6 -7
- package/shared/slider.template.cjs +1 -1
- package/shared/slider.template.js +1 -1
- package/shared/text-anchor.cjs +6 -7
- package/shared/text-anchor.js +6 -7
- package/shared/text-field.cjs +1 -1
- package/shared/text-field.js +1 -1
- package/side-drawer/index.cjs +0 -3
- package/side-drawer/index.js +0 -3
- package/slider/index.cjs +0 -10
- package/slider/index.js +0 -10
- package/split-button/index.cjs +0 -13
- package/split-button/index.js +0 -13
- package/styles/core/all.css +1 -1
- package/styles/core/theme.css +1 -1
- package/styles/core/typography.css +1 -1
- package/styles/tokens/theme-dark.css +4 -4
- package/styles/tokens/theme-light.css +4 -4
- package/styles/tokens/vivid-2-compat.css +1 -1
- package/switch/index.cjs +0 -8
- package/switch/index.js +0 -8
- package/tab/index.cjs +0 -9
- package/tab/index.js +0 -9
- package/tab-panel/index.cjs +0 -1
- package/tab-panel/index.js +0 -1
- package/tabs/index.cjs +0 -16
- package/tabs/index.js +0 -16
- package/tag/index.cjs +0 -9
- package/tag/index.js +0 -9
- package/tag-group/index.cjs +0 -2
- package/tag-group/index.js +0 -2
- package/text-anchor/index.cjs +0 -10
- package/text-anchor/index.js +0 -10
- package/text-area/index.cjs +0 -19
- package/text-area/index.js +0 -19
- package/text-field/index.cjs +0 -20
- package/text-field/index.js +0 -20
- package/time-picker/index.cjs +0 -31
- package/time-picker/index.js +0 -31
- package/toggletip/index.cjs +0 -22
- package/toggletip/index.js +0 -22
- package/tooltip/index.cjs +0 -22
- package/tooltip/index.js +0 -22
- package/tree-item/index.cjs +0 -14
- package/tree-item/index.js +0 -14
- package/tree-view/index.cjs +0 -9
- package/tree-view/index.js +0 -9
- package/video-player/index.cjs +0 -12
- package/video-player/index.js +0 -12
- package/vivid.api.json +10 -1
package/shared/definition4.js
CHANGED
|
@@ -11,16 +11,15 @@ import { B as Button$1 } from './button.js';
|
|
|
11
11
|
import { w as when } from './when.js';
|
|
12
12
|
import { c as classNames } from './class-names.js';
|
|
13
13
|
|
|
14
|
-
const styles = ".control{position:fixed;z-index:10;border-radius:8px;inline-size:max-content;inset-block-end:0;inset-inline:0 0;margin-block:16px;margin-inline:auto;max-inline-size:var(--alert-max-inline-size, fit-content);min-inline-size:var(--alert-min-inline-size, 420px);transition:opacity .15s cubic-bezier(0,0,.2,1) 0ms,transform .15s cubic-bezier(0,0,.2,1) 0ms}.control.placement-top,.control.placement-top-start,.control.placement-top-end{inset-block:0 auto}.control.placement-top-start,.control.placement-bottom-start{right:auto;inset-inline-end:auto;margin-inline:16px}.control.placement-top-end,.control.placement-bottom-end{inset-inline-start:auto;margin-inline:16px}.control:where(.strategy-static){position:static;margin:0;inline-size:auto}.control:not(.open){opacity:0;transform:scale(.8)}.control.open{opacity:1;transform:scale(1)}@media (width <= 768px){.control{min-inline-size:var(--alert-min-inline-size, auto)}}.base{display:flex;align-items:center;padding:16px;border-radius:8px;background-color:var(--vvd-color-neutral-50);color:var(--vvd-color-canvas-text);column-gap:16px}.base.connotation-success{--_connotation-color-primary: var(--vvd-alert-success-primary, var(--vvd-color-success-500));--_connotation-color-primary-text: var(--vvd-alert-success-primary-text, var(--vvd-color-canvas))}.base.connotation-information{--_connotation-color-primary: var(--vvd-alert-information-primary, var(--vvd-color-information-500));--_connotation-color-primary-text: var(--vvd-alert-information-primary-text, var(--vvd-color-canvas))}.base.connotation-alert{--_connotation-color-primary: var(--vvd-alert-alert-primary, var(--vvd-color-alert-500));--_connotation-color-primary-text: var(--vvd-alert-alert-primary-text, var(--vvd-color-canvas))}.base.connotation-warning{--_connotation-color-primary: var(--vvd-alert-warning-primary, var(--vvd-color-warning-300));--_connotation-color-primary-text: var(--vvd-alert-warning-primary-text, var(--vvd-color-canvas-text))}.base:not(.connotation-success,.connotation-information,.connotation-alert,.connotation-warning){--_connotation-color-primary: var(--vvd-alert-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-alert-accent-primary-text, var(--vvd-color-canvas))}.base{--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary);--_appearance-color-outline: transparent}.base .alert-text{margin-inline-end:auto}.base .alert-text .headline{font:var(--vvd-typography-base-bold);margin-block-end:4px}.base .alert-text .main-text{font:var(--vvd-typography-base)}.base slot[name=icon]{flex-shrink:0;color:var(--_appearance-color-fill);font-size:24px;line-height:1}.base .dismiss-button{border-left:1px solid var(--vvd-color-neutral-200);padding-inline-start:8px}
|
|
14
|
+
const styles = ".control{position:fixed;z-index:10;border-radius:8px;inline-size:max-content;inset-block-end:0;inset-inline:0 0;margin-block:16px;margin-inline:auto;max-inline-size:var(--alert-max-inline-size, fit-content);min-inline-size:var(--alert-min-inline-size, 420px);transition:opacity .15s cubic-bezier(0,0,.2,1) 0ms,transform .15s cubic-bezier(0,0,.2,1) 0ms}.control.placement-top,.control.placement-top-start,.control.placement-top-end{inset-block:0 auto}.control.placement-top-start,.control.placement-bottom-start{right:auto;inset-inline-end:auto;margin-inline:16px}.control.placement-top-end,.control.placement-bottom-end{inset-inline-start:auto;margin-inline:16px}.control:where(.strategy-static){position:static;margin:0;inline-size:auto}.control:not(.open){opacity:0;transform:scale(.8)}.control.open{opacity:1;transform:scale(1)}@media (width <= 768px){.control{min-inline-size:var(--alert-min-inline-size, auto)}}.base{display:flex;align-items:center;padding:16px;border-radius:8px;background-color:var(--vvd-color-neutral-50);color:var(--vvd-color-canvas-text);column-gap:16px}.base.connotation-success{--_connotation-color-primary: var(--vvd-alert-success-primary, var(--vvd-color-success-500));--_connotation-color-primary-text: var(--vvd-alert-success-primary-text, var(--vvd-color-canvas))}.base.connotation-information{--_connotation-color-primary: var(--vvd-alert-information-primary, var(--vvd-color-information-500));--_connotation-color-primary-text: var(--vvd-alert-information-primary-text, var(--vvd-color-canvas))}.base.connotation-alert{--_connotation-color-primary: var(--vvd-alert-alert-primary, var(--vvd-color-alert-500));--_connotation-color-primary-text: var(--vvd-alert-alert-primary-text, var(--vvd-color-canvas))}.base.connotation-warning{--_connotation-color-primary: var(--vvd-alert-warning-primary, var(--vvd-color-warning-300));--_connotation-color-primary-text: var(--vvd-alert-warning-primary-text, var(--vvd-color-canvas-text))}.base:not(.connotation-success,.connotation-information,.connotation-alert,.connotation-warning){--_connotation-color-primary: var(--vvd-alert-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-alert-accent-primary-text, var(--vvd-color-canvas))}.base{--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary);--_appearance-color-outline: transparent}.base .alert-text{margin-inline-end:auto}.base .alert-text .headline{font:var(--vvd-typography-base-bold);margin-block-end:4px}.base .alert-text .main-text{font:var(--vvd-typography-base)}.base slot[name=icon]{flex-shrink:0;color:var(--_appearance-color-fill);font-size:24px;line-height:1}.base .dismiss-button{border-left:1px solid var(--vvd-color-neutral-200);padding-inline-start:8px}";
|
|
15
15
|
|
|
16
16
|
var __defProp = Object.defineProperty;
|
|
17
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
18
17
|
var __decorateClass = (decorators, target, key, kind) => {
|
|
19
|
-
var result =
|
|
18
|
+
var result = void 0 ;
|
|
20
19
|
for (var i = decorators.length - 1, decorator; i >= 0; i--)
|
|
21
20
|
if (decorator = decorators[i])
|
|
22
|
-
result = (
|
|
23
|
-
if (
|
|
21
|
+
result = (decorator(target, key, result) ) || result;
|
|
22
|
+
if (result)
|
|
24
23
|
__defProp(target, key, result);
|
|
25
24
|
return result;
|
|
26
25
|
};
|
|
@@ -108,37 +107,37 @@ class Alert extends FoundationElement {
|
|
|
108
107
|
}
|
|
109
108
|
__decorateClass([
|
|
110
109
|
attr({ attribute: "dismiss-button-aria-label" })
|
|
111
|
-
], Alert.prototype, "dismissButtonAriaLabel"
|
|
110
|
+
], Alert.prototype, "dismissButtonAriaLabel");
|
|
112
111
|
__decorateClass([
|
|
113
112
|
attr({ mode: "boolean" })
|
|
114
|
-
], Alert.prototype, "removable"
|
|
113
|
+
], Alert.prototype, "removable");
|
|
115
114
|
__decorateClass([
|
|
116
115
|
attr({ mode: "fromView" })
|
|
117
|
-
], Alert.prototype, "placement"
|
|
116
|
+
], Alert.prototype, "placement");
|
|
118
117
|
__decorateClass([
|
|
119
118
|
attr
|
|
120
|
-
], Alert.prototype, "headline"
|
|
119
|
+
], Alert.prototype, "headline");
|
|
121
120
|
__decorateClass([
|
|
122
121
|
attr
|
|
123
|
-
], Alert.prototype, "text"
|
|
122
|
+
], Alert.prototype, "text");
|
|
124
123
|
__decorateClass([
|
|
125
124
|
attr
|
|
126
|
-
], Alert.prototype, "icon"
|
|
125
|
+
], Alert.prototype, "icon");
|
|
127
126
|
__decorateClass([
|
|
128
127
|
attr({
|
|
129
128
|
mode: "fromView",
|
|
130
129
|
converter: nullableNumberConverter
|
|
131
130
|
})
|
|
132
|
-
], Alert.prototype, "timeoutms"
|
|
131
|
+
], Alert.prototype, "timeoutms");
|
|
133
132
|
__decorateClass([
|
|
134
133
|
attr
|
|
135
|
-
], Alert.prototype, "connotation"
|
|
134
|
+
], Alert.prototype, "connotation");
|
|
136
135
|
__decorateClass([
|
|
137
136
|
attr
|
|
138
|
-
], Alert.prototype, "strategy"
|
|
137
|
+
], Alert.prototype, "strategy");
|
|
139
138
|
__decorateClass([
|
|
140
139
|
attr({ mode: "boolean" })
|
|
141
|
-
], Alert.prototype, "open"
|
|
140
|
+
], Alert.prototype, "open");
|
|
142
141
|
applyMixins(Alert, AffixIcon);
|
|
143
142
|
applyMixins(Alert, Localized);
|
|
144
143
|
|
package/shared/definition40.cjs
CHANGED
|
@@ -3,11 +3,11 @@
|
|
|
3
3
|
const index = require('./index.cjs');
|
|
4
4
|
const direction = require('./direction.cjs');
|
|
5
5
|
const keyCodes = require('./key-codes.cjs');
|
|
6
|
-
const aria = require('./
|
|
6
|
+
const aria = require('./aria2.cjs');
|
|
7
7
|
const radio = require('./radio.cjs');
|
|
8
8
|
const slotted = require('./slotted.cjs');
|
|
9
9
|
const when = require('./when.cjs');
|
|
10
|
-
const aria$1 = require('./
|
|
10
|
+
const aria$1 = require('./aria.cjs');
|
|
11
11
|
|
|
12
12
|
/**
|
|
13
13
|
* An Radio Group Custom HTML Element.
|
|
@@ -395,16 +395,15 @@ index.__decorate([
|
|
|
395
395
|
index.observable
|
|
396
396
|
], RadioGroup$1.prototype, "slottedRadioButtons", void 0);
|
|
397
397
|
|
|
398
|
-
const styles = ".positioning-region{display:flex;flex-wrap:wrap;gap:8px}.positioning-region.vertical{flex-direction:column}label+.positioning-region{margin-block-start:8px}label{color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base)}
|
|
398
|
+
const styles = ".positioning-region{display:flex;flex-wrap:wrap;gap:8px}.positioning-region.vertical{flex-direction:column}label+.positioning-region{margin-block-start:8px}label{color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base)}";
|
|
399
399
|
|
|
400
400
|
var __defProp = Object.defineProperty;
|
|
401
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
402
401
|
var __decorateClass = (decorators, target, key, kind) => {
|
|
403
|
-
var result =
|
|
402
|
+
var result = void 0 ;
|
|
404
403
|
for (var i = decorators.length - 1, decorator; i >= 0; i--)
|
|
405
404
|
if (decorator = decorators[i])
|
|
406
|
-
result = (
|
|
407
|
-
if (
|
|
405
|
+
result = (decorator(target, key, result) ) || result;
|
|
406
|
+
if (result)
|
|
408
407
|
__defProp(target, key, result);
|
|
409
408
|
return result;
|
|
410
409
|
};
|
|
@@ -412,7 +411,7 @@ class RadioGroup extends RadioGroup$1 {
|
|
|
412
411
|
}
|
|
413
412
|
__decorateClass([
|
|
414
413
|
index.attr
|
|
415
|
-
], RadioGroup.prototype, "label"
|
|
414
|
+
], RadioGroup.prototype, "label");
|
|
416
415
|
|
|
417
416
|
const RadioGroupTemplate = (context) => {
|
|
418
417
|
return index.html`
|
package/shared/definition40.js
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { F as FoundationElement, _ as __decorate, a as attr, o as observable, h as html, r as registerFactory } from './index.js';
|
|
2
2
|
import { D as Direction, g as getDirection } from './direction.js';
|
|
3
3
|
import { h as keyArrowRight, i as keyArrowLeft, A as ArrowKeys, e as keyArrowUp, f as keyArrowDown, k as keyEnter } from './key-codes.js';
|
|
4
|
-
import { O as Orientation } from './
|
|
4
|
+
import { O as Orientation } from './aria2.js';
|
|
5
5
|
import { R as Radio } from './radio.js';
|
|
6
6
|
import { s as slotted, e as elements } from './slotted.js';
|
|
7
7
|
import { w as when } from './when.js';
|
|
8
|
-
import { O as Orientation$1 } from './
|
|
8
|
+
import { O as Orientation$1 } from './aria.js';
|
|
9
9
|
|
|
10
10
|
/**
|
|
11
11
|
* An Radio Group Custom HTML Element.
|
|
@@ -393,16 +393,15 @@ __decorate([
|
|
|
393
393
|
observable
|
|
394
394
|
], RadioGroup$1.prototype, "slottedRadioButtons", void 0);
|
|
395
395
|
|
|
396
|
-
const styles = ".positioning-region{display:flex;flex-wrap:wrap;gap:8px}.positioning-region.vertical{flex-direction:column}label+.positioning-region{margin-block-start:8px}label{color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base)}
|
|
396
|
+
const styles = ".positioning-region{display:flex;flex-wrap:wrap;gap:8px}.positioning-region.vertical{flex-direction:column}label+.positioning-region{margin-block-start:8px}label{color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base)}";
|
|
397
397
|
|
|
398
398
|
var __defProp = Object.defineProperty;
|
|
399
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
400
399
|
var __decorateClass = (decorators, target, key, kind) => {
|
|
401
|
-
var result =
|
|
400
|
+
var result = void 0 ;
|
|
402
401
|
for (var i = decorators.length - 1, decorator; i >= 0; i--)
|
|
403
402
|
if (decorator = decorators[i])
|
|
404
|
-
result = (
|
|
405
|
-
if (
|
|
403
|
+
result = (decorator(target, key, result) ) || result;
|
|
404
|
+
if (result)
|
|
406
405
|
__defProp(target, key, result);
|
|
407
406
|
return result;
|
|
408
407
|
};
|
|
@@ -410,7 +409,7 @@ class RadioGroup extends RadioGroup$1 {
|
|
|
410
409
|
}
|
|
411
410
|
__decorateClass([
|
|
412
411
|
attr
|
|
413
|
-
], RadioGroup.prototype, "label"
|
|
412
|
+
], RadioGroup.prototype, "label");
|
|
414
413
|
|
|
415
414
|
const RadioGroupTemplate = (context) => {
|
|
416
415
|
return html`
|
package/shared/definition41.cjs
CHANGED
|
@@ -5,7 +5,7 @@ const radio = require('./radio.cjs');
|
|
|
5
5
|
const when = require('./when.cjs');
|
|
6
6
|
const classNames = require('./class-names.cjs');
|
|
7
7
|
|
|
8
|
-
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;border-radius:50%;block-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)));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;border-radius:inherit;background-color:var(--_appearance-color-outline);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;border-radius:inherit;block-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)));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}
|
|
8
|
+
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;border-radius:50%;block-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)));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;border-radius:inherit;background-color:var(--_appearance-color-outline);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;border-radius:inherit;block-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)));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}";
|
|
9
9
|
|
|
10
10
|
const getClasses = ({ connotation, checked, readOnly, disabled }) => classNames.classNames(
|
|
11
11
|
"base",
|
package/shared/definition41.js
CHANGED
|
@@ -3,7 +3,7 @@ import { R as Radio } from './radio.js';
|
|
|
3
3
|
import { w as when } from './when.js';
|
|
4
4
|
import { c as classNames } from './class-names.js';
|
|
5
5
|
|
|
6
|
-
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;border-radius:50%;block-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)));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;border-radius:inherit;background-color:var(--_appearance-color-outline);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;border-radius:inherit;block-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)));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}
|
|
6
|
+
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;border-radius:50%;block-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)));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;border-radius:inherit;background-color:var(--_appearance-color-outline);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;border-radius:inherit;block-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)));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}";
|
|
7
7
|
|
|
8
8
|
const getClasses = ({ connotation, checked, readOnly, disabled }) => classNames(
|
|
9
9
|
"base",
|
package/shared/definition42.cjs
CHANGED
|
@@ -8,12 +8,12 @@ const localized = require('./localized.cjs');
|
|
|
8
8
|
const formAssociated = require('./form-associated.cjs');
|
|
9
9
|
const slider_template = require('./slider.template.cjs');
|
|
10
10
|
const applyMixins = require('./apply-mixins.cjs');
|
|
11
|
-
const aria = require('./
|
|
11
|
+
const aria = require('./aria.cjs');
|
|
12
12
|
const ref = require('./ref.cjs');
|
|
13
13
|
const when = require('./when.cjs');
|
|
14
14
|
const classNames = require('./class-names.cjs');
|
|
15
15
|
|
|
16
|
-
const styles = ":host{display:inline-block}:host(:not([orientation=vertical])){inline-size:100%}:host([orientation=vertical]){block-size:100%;min-block-size:calc(var(--_thumb-interaction-indicator-size) * 5)}:host([disabled]){cursor:not-allowed}.control{--_thumb-size: 12px;--_thumb-interaction-indicator-size: 36px;--_track-start-inset-inline-start: 0;--_track-start-inset-block-start: 0;cursor:pointer;outline:none;user-select:none}.control.connotation-cta{--_connotation-color-primary: var(--vvd-slider-cta-primary, var(--vvd-color-cta-500))}.control:not(.connotation-cta){--_connotation-color-primary: var(--vvd-slider-accent-primary, var(--vvd-color-canvas-text))}.control{--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary);--_appearance-color-outline: transparent}.control .positioning-region{position:relative}.control .track{position:absolute;border-radius:4px;background:var(--_track-background-color)}.control .track-start{position:absolute;border-radius:inherit;background:var(--_track-start-background-color);block-size:100%;inset-inline-start:var(--_track-start-inset-inline-start)}.control.horizontal{block-size:var(--_thumb-interaction-indicator-size);inline-size:calc(100% - var(--_thumb-size));margin-inline-start:calc(var(--_thumb-size) / 2);min-inline-size:var(--_thumb-size)}.control.horizontal .track{top:calc((var(--_thumb-interaction-indicator-size) - 2px) / 2);right:0;left:0;block-size:2px}.control.horizontal .track .mark{block-size:4px;inline-size:100%}.control.vertical{margin-top:calc(var(--_thumb-interaction-indicator-size) / 2);block-size:calc(100% - var(--_thumb-interaction-indicator-size));inline-size:var(--_thumb-interaction-indicator-size);min-block-size:var(--_thumb-interaction-indicator-size)}.control.vertical .positioning-region{block-size:100%}.control.vertical .track{left:calc((var(--_thumb-interaction-indicator-size) - 2px) / 2);block-size:100%;inline-size:2px}.control.vertical .track .mark{block-size:100%;inline-size:4px}.control.vertical .track-start{block-size:auto;inline-size:100%;inset-block-start:var(--_track-start-inset-block-start)}.control.disabled{--_track-background-color: var(--vvd-color-neutral-100);--_track-start-background-color: var(--vvd-color-neutral-300);pointer-events:none}.control:not(.disabled){--_track-background-color: var(--vvd-color-neutral-300);--_track-start-background-color: var(--_appearance-color-fill)}.thumb-container{position:absolute;border-radius:50%;block-size:var(--_thumb-interaction-indicator-size);cursor:inherit;inline-size:var(--_thumb-interaction-indicator-size);outline-color:transparent;touch-action:none}:focus-visible .thumb-container,.thumb-container:focus-visible{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));--focus-stroke-gap-color: transparent;--_thumb-interaction-indicator-alpha: .05;border-radius:50%}.control.horizontal .thumb-container{transform:translate(calc(var(--_thumb-interaction-indicator-size) / 2))}.control.vertical .thumb-container{transform:translateY(calc(var(--_thumb-interaction-indicator-size) / 2))}.control:not(.disabled) .thumb-container:hover{--_thumb-interaction-indicator-alpha: .12}.control:not(.disabled) .thumb-container:active{--_thumb-interaction-indicator-alpha: .25}.thumb-container:before{position:absolute;display:block;border-radius:inherit;background-color:var(--_track-start-background-color);block-size:var(--_thumb-interaction-indicator-size);content:\"\";inline-size:var(--_thumb-interaction-indicator-size);opacity:var(--_thumb-interaction-indicator-alpha, 0);transition:opacity .2s ease-out 0s}.thumb-container:after{position:absolute;display:block;border-radius:inherit;background-color:var(--_track-start-background-color);block-size:var(--_thumb-size);content:\"\";inline-size:var(--_thumb-size);inset:calc((var(--_thumb-interaction-indicator-size) - var(--_thumb-size)) / 2)}.control{--_track-start-inset-inline-start: auto;--_track-start-inset-block-start: auto}
|
|
16
|
+
const styles = ":host{display:inline-block}:host(:not([orientation=vertical])){inline-size:100%}:host([orientation=vertical]){block-size:100%;min-block-size:calc(var(--_thumb-interaction-indicator-size) * 5)}:host([disabled]){cursor:not-allowed}.control{--_thumb-size: 12px;--_thumb-interaction-indicator-size: 36px;--_track-start-inset-inline-start: 0;--_track-start-inset-block-start: 0;cursor:pointer;outline:none;user-select:none}.control.connotation-cta{--_connotation-color-primary: var(--vvd-slider-cta-primary, var(--vvd-color-cta-500))}.control:not(.connotation-cta){--_connotation-color-primary: var(--vvd-slider-accent-primary, var(--vvd-color-canvas-text))}.control{--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary);--_appearance-color-outline: transparent}.control .positioning-region{position:relative}.control .track{position:absolute;border-radius:4px;background:var(--_track-background-color)}.control .track-start{position:absolute;border-radius:inherit;background:var(--_track-start-background-color);block-size:100%;inset-inline-start:var(--_track-start-inset-inline-start)}.control.horizontal{block-size:var(--_thumb-interaction-indicator-size);inline-size:calc(100% - var(--_thumb-size));margin-inline-start:calc(var(--_thumb-size) / 2);min-inline-size:var(--_thumb-size)}.control.horizontal .track{top:calc((var(--_thumb-interaction-indicator-size) - 2px) / 2);right:0;left:0;block-size:2px}.control.horizontal .track .mark{block-size:4px;inline-size:100%}.control.vertical{margin-top:calc(var(--_thumb-interaction-indicator-size) / 2);block-size:calc(100% - var(--_thumb-interaction-indicator-size));inline-size:var(--_thumb-interaction-indicator-size);min-block-size:var(--_thumb-interaction-indicator-size)}.control.vertical .positioning-region{block-size:100%}.control.vertical .track{left:calc((var(--_thumb-interaction-indicator-size) - 2px) / 2);block-size:100%;inline-size:2px}.control.vertical .track .mark{block-size:100%;inline-size:4px}.control.vertical .track-start{block-size:auto;inline-size:100%;inset-block-start:var(--_track-start-inset-block-start)}.control.disabled{--_track-background-color: var(--vvd-color-neutral-100);--_track-start-background-color: var(--vvd-color-neutral-300);pointer-events:none}.control:not(.disabled){--_track-background-color: var(--vvd-color-neutral-300);--_track-start-background-color: var(--_appearance-color-fill)}.thumb-container{position:absolute;border-radius:50%;block-size:var(--_thumb-interaction-indicator-size);cursor:inherit;inline-size:var(--_thumb-interaction-indicator-size);outline-color:transparent;touch-action:none}:focus-visible .thumb-container,.thumb-container:focus-visible{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));--focus-stroke-gap-color: transparent;--_thumb-interaction-indicator-alpha: .05;border-radius:50%}.control.horizontal .thumb-container{transform:translate(calc(var(--_thumb-interaction-indicator-size) / 2))}.control.vertical .thumb-container{transform:translateY(calc(var(--_thumb-interaction-indicator-size) / 2))}.control:not(.disabled) .thumb-container:hover{--_thumb-interaction-indicator-alpha: .12}.control:not(.disabled) .thumb-container:active{--_thumb-interaction-indicator-alpha: .25}.thumb-container:before{position:absolute;display:block;border-radius:inherit;background-color:var(--_track-start-background-color);block-size:var(--_thumb-interaction-indicator-size);content:\"\";inline-size:var(--_thumb-interaction-indicator-size);opacity:var(--_thumb-interaction-indicator-alpha, 0);transition:opacity .2s ease-out 0s}.thumb-container:after{position:absolute;display:block;border-radius:inherit;background-color:var(--_track-start-background-color);block-size:var(--_thumb-size);content:\"\";inline-size:var(--_thumb-size);inset:calc((var(--_thumb-interaction-indicator-size) - var(--_thumb-size)) / 2)}.control{--_track-start-inset-inline-start: auto;--_track-start-inset-block-start: auto}";
|
|
17
17
|
|
|
18
18
|
class _RangeSlider extends index.FoundationElement {
|
|
19
19
|
}
|
|
@@ -69,7 +69,7 @@ var __privateAdd = (obj, member, value) => {
|
|
|
69
69
|
};
|
|
70
70
|
var __privateSet = (obj, member, value, setter) => {
|
|
71
71
|
__accessCheck(obj, member, "write to private field");
|
|
72
|
-
|
|
72
|
+
member.set(obj, value);
|
|
73
73
|
return value;
|
|
74
74
|
};
|
|
75
75
|
var __privateMethod = (obj, member, method) => {
|
|
@@ -109,7 +109,7 @@ let RangeSlider = class extends FormAssociatedRangeSlider {
|
|
|
109
109
|
this.ariaStartLabel = null;
|
|
110
110
|
this.ariaEndLabel = null;
|
|
111
111
|
this.markers = false;
|
|
112
|
-
this.valueTextFormatter = (value) => value;
|
|
112
|
+
this.valueTextFormatter = (value) => parseFloat(value).toLocaleString(this.locale.lang);
|
|
113
113
|
// --- Thumbs ---
|
|
114
114
|
/**
|
|
115
115
|
* @internal
|
package/shared/definition42.js
CHANGED
|
@@ -6,12 +6,12 @@ import { L as Localized } from './localized.js';
|
|
|
6
6
|
import { F as FormAssociated } from './form-associated.js';
|
|
7
7
|
import { l as limit, g as getMarkersTemplate } from './slider.template.js';
|
|
8
8
|
import { a as applyMixins } from './apply-mixins.js';
|
|
9
|
-
import { O as Orientation } from './
|
|
9
|
+
import { O as Orientation } from './aria.js';
|
|
10
10
|
import { r as ref } from './ref.js';
|
|
11
11
|
import { w as when } from './when.js';
|
|
12
12
|
import { c as classNames } from './class-names.js';
|
|
13
13
|
|
|
14
|
-
const styles = ":host{display:inline-block}:host(:not([orientation=vertical])){inline-size:100%}:host([orientation=vertical]){block-size:100%;min-block-size:calc(var(--_thumb-interaction-indicator-size) * 5)}:host([disabled]){cursor:not-allowed}.control{--_thumb-size: 12px;--_thumb-interaction-indicator-size: 36px;--_track-start-inset-inline-start: 0;--_track-start-inset-block-start: 0;cursor:pointer;outline:none;user-select:none}.control.connotation-cta{--_connotation-color-primary: var(--vvd-slider-cta-primary, var(--vvd-color-cta-500))}.control:not(.connotation-cta){--_connotation-color-primary: var(--vvd-slider-accent-primary, var(--vvd-color-canvas-text))}.control{--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary);--_appearance-color-outline: transparent}.control .positioning-region{position:relative}.control .track{position:absolute;border-radius:4px;background:var(--_track-background-color)}.control .track-start{position:absolute;border-radius:inherit;background:var(--_track-start-background-color);block-size:100%;inset-inline-start:var(--_track-start-inset-inline-start)}.control.horizontal{block-size:var(--_thumb-interaction-indicator-size);inline-size:calc(100% - var(--_thumb-size));margin-inline-start:calc(var(--_thumb-size) / 2);min-inline-size:var(--_thumb-size)}.control.horizontal .track{top:calc((var(--_thumb-interaction-indicator-size) - 2px) / 2);right:0;left:0;block-size:2px}.control.horizontal .track .mark{block-size:4px;inline-size:100%}.control.vertical{margin-top:calc(var(--_thumb-interaction-indicator-size) / 2);block-size:calc(100% - var(--_thumb-interaction-indicator-size));inline-size:var(--_thumb-interaction-indicator-size);min-block-size:var(--_thumb-interaction-indicator-size)}.control.vertical .positioning-region{block-size:100%}.control.vertical .track{left:calc((var(--_thumb-interaction-indicator-size) - 2px) / 2);block-size:100%;inline-size:2px}.control.vertical .track .mark{block-size:100%;inline-size:4px}.control.vertical .track-start{block-size:auto;inline-size:100%;inset-block-start:var(--_track-start-inset-block-start)}.control.disabled{--_track-background-color: var(--vvd-color-neutral-100);--_track-start-background-color: var(--vvd-color-neutral-300);pointer-events:none}.control:not(.disabled){--_track-background-color: var(--vvd-color-neutral-300);--_track-start-background-color: var(--_appearance-color-fill)}.thumb-container{position:absolute;border-radius:50%;block-size:var(--_thumb-interaction-indicator-size);cursor:inherit;inline-size:var(--_thumb-interaction-indicator-size);outline-color:transparent;touch-action:none}:focus-visible .thumb-container,.thumb-container:focus-visible{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));--focus-stroke-gap-color: transparent;--_thumb-interaction-indicator-alpha: .05;border-radius:50%}.control.horizontal .thumb-container{transform:translate(calc(var(--_thumb-interaction-indicator-size) / 2))}.control.vertical .thumb-container{transform:translateY(calc(var(--_thumb-interaction-indicator-size) / 2))}.control:not(.disabled) .thumb-container:hover{--_thumb-interaction-indicator-alpha: .12}.control:not(.disabled) .thumb-container:active{--_thumb-interaction-indicator-alpha: .25}.thumb-container:before{position:absolute;display:block;border-radius:inherit;background-color:var(--_track-start-background-color);block-size:var(--_thumb-interaction-indicator-size);content:\"\";inline-size:var(--_thumb-interaction-indicator-size);opacity:var(--_thumb-interaction-indicator-alpha, 0);transition:opacity .2s ease-out 0s}.thumb-container:after{position:absolute;display:block;border-radius:inherit;background-color:var(--_track-start-background-color);block-size:var(--_thumb-size);content:\"\";inline-size:var(--_thumb-size);inset:calc((var(--_thumb-interaction-indicator-size) - var(--_thumb-size)) / 2)}.control{--_track-start-inset-inline-start: auto;--_track-start-inset-block-start: auto}
|
|
14
|
+
const styles = ":host{display:inline-block}:host(:not([orientation=vertical])){inline-size:100%}:host([orientation=vertical]){block-size:100%;min-block-size:calc(var(--_thumb-interaction-indicator-size) * 5)}:host([disabled]){cursor:not-allowed}.control{--_thumb-size: 12px;--_thumb-interaction-indicator-size: 36px;--_track-start-inset-inline-start: 0;--_track-start-inset-block-start: 0;cursor:pointer;outline:none;user-select:none}.control.connotation-cta{--_connotation-color-primary: var(--vvd-slider-cta-primary, var(--vvd-color-cta-500))}.control:not(.connotation-cta){--_connotation-color-primary: var(--vvd-slider-accent-primary, var(--vvd-color-canvas-text))}.control{--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary);--_appearance-color-outline: transparent}.control .positioning-region{position:relative}.control .track{position:absolute;border-radius:4px;background:var(--_track-background-color)}.control .track-start{position:absolute;border-radius:inherit;background:var(--_track-start-background-color);block-size:100%;inset-inline-start:var(--_track-start-inset-inline-start)}.control.horizontal{block-size:var(--_thumb-interaction-indicator-size);inline-size:calc(100% - var(--_thumb-size));margin-inline-start:calc(var(--_thumb-size) / 2);min-inline-size:var(--_thumb-size)}.control.horizontal .track{top:calc((var(--_thumb-interaction-indicator-size) - 2px) / 2);right:0;left:0;block-size:2px}.control.horizontal .track .mark{block-size:4px;inline-size:100%}.control.vertical{margin-top:calc(var(--_thumb-interaction-indicator-size) / 2);block-size:calc(100% - var(--_thumb-interaction-indicator-size));inline-size:var(--_thumb-interaction-indicator-size);min-block-size:var(--_thumb-interaction-indicator-size)}.control.vertical .positioning-region{block-size:100%}.control.vertical .track{left:calc((var(--_thumb-interaction-indicator-size) - 2px) / 2);block-size:100%;inline-size:2px}.control.vertical .track .mark{block-size:100%;inline-size:4px}.control.vertical .track-start{block-size:auto;inline-size:100%;inset-block-start:var(--_track-start-inset-block-start)}.control.disabled{--_track-background-color: var(--vvd-color-neutral-100);--_track-start-background-color: var(--vvd-color-neutral-300);pointer-events:none}.control:not(.disabled){--_track-background-color: var(--vvd-color-neutral-300);--_track-start-background-color: var(--_appearance-color-fill)}.thumb-container{position:absolute;border-radius:50%;block-size:var(--_thumb-interaction-indicator-size);cursor:inherit;inline-size:var(--_thumb-interaction-indicator-size);outline-color:transparent;touch-action:none}:focus-visible .thumb-container,.thumb-container:focus-visible{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));--focus-stroke-gap-color: transparent;--_thumb-interaction-indicator-alpha: .05;border-radius:50%}.control.horizontal .thumb-container{transform:translate(calc(var(--_thumb-interaction-indicator-size) / 2))}.control.vertical .thumb-container{transform:translateY(calc(var(--_thumb-interaction-indicator-size) / 2))}.control:not(.disabled) .thumb-container:hover{--_thumb-interaction-indicator-alpha: .12}.control:not(.disabled) .thumb-container:active{--_thumb-interaction-indicator-alpha: .25}.thumb-container:before{position:absolute;display:block;border-radius:inherit;background-color:var(--_track-start-background-color);block-size:var(--_thumb-interaction-indicator-size);content:\"\";inline-size:var(--_thumb-interaction-indicator-size);opacity:var(--_thumb-interaction-indicator-alpha, 0);transition:opacity .2s ease-out 0s}.thumb-container:after{position:absolute;display:block;border-radius:inherit;background-color:var(--_track-start-background-color);block-size:var(--_thumb-size);content:\"\";inline-size:var(--_thumb-size);inset:calc((var(--_thumb-interaction-indicator-size) - var(--_thumb-size)) / 2)}.control{--_track-start-inset-inline-start: auto;--_track-start-inset-block-start: auto}";
|
|
15
15
|
|
|
16
16
|
class _RangeSlider extends FoundationElement {
|
|
17
17
|
}
|
|
@@ -67,7 +67,7 @@ var __privateAdd = (obj, member, value) => {
|
|
|
67
67
|
};
|
|
68
68
|
var __privateSet = (obj, member, value, setter) => {
|
|
69
69
|
__accessCheck(obj, member, "write to private field");
|
|
70
|
-
|
|
70
|
+
member.set(obj, value);
|
|
71
71
|
return value;
|
|
72
72
|
};
|
|
73
73
|
var __privateMethod = (obj, member, method) => {
|
|
@@ -107,7 +107,7 @@ let RangeSlider = class extends FormAssociatedRangeSlider {
|
|
|
107
107
|
this.ariaStartLabel = null;
|
|
108
108
|
this.ariaEndLabel = null;
|
|
109
109
|
this.markers = false;
|
|
110
|
-
this.valueTextFormatter = (value) => value;
|
|
110
|
+
this.valueTextFormatter = (value) => parseFloat(value).toLocaleString(this.locale.lang);
|
|
111
111
|
// --- Thumbs ---
|
|
112
112
|
/**
|
|
113
113
|
* @internal
|
package/shared/definition43.cjs
CHANGED
|
@@ -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 = ":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;border-radius:var(--_select-control-border-radius);background-color:var(--_appearance-color-fill);block-size:calc(1px*(40 + 4*clamp(-1,var(--vvd-size-density, 0),2)));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: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)}.control:where(.error):where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-alert-50);--_appearance-color-outline: transparent}.control: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)}.control:where(.success):where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-success-50);--_appearance-color-outline: transparent}.control{--_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-faint: var(--vvd-select-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-soft: var(--vvd-select-accent-soft, var(--vvd-color-neutral-100));--_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}.feedback-wrapper{display:contents}::part(popup-base){inline-size:max-content;min-inline-size:var(--_select-fixed-width, 100%)}:host([multiple]) ::part(popup-base){position:static}
|
|
519
|
+
const styles = ":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;border-radius:var(--_select-control-border-radius);background-color:var(--_appearance-color-fill);block-size:calc(1px*(40 + 4*clamp(-1,var(--vvd-size-density, 0),2)));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: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)}.control:where(.error):where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-alert-50);--_appearance-color-outline: transparent}.control: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)}.control:where(.success):where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-success-50);--_appearance-color-outline: transparent}.control{--_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-faint: var(--vvd-select-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-soft: var(--vvd-select-accent-soft, var(--vvd-color-neutral-100));--_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}.feedback-wrapper{display:contents}::part(popup-base){inline-size:max-content;min-inline-size:var(--_select-fixed-width, 100%)}:host([multiple]) ::part(popup-base){position:static}";
|
|
520
520
|
|
|
521
521
|
var __defProp = Object.defineProperty;
|
|
522
522
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
package/shared/definition43.js
CHANGED
|
@@ -514,7 +514,7 @@ __decorate([
|
|
|
514
514
|
applyMixins(DelegatesARIASelect, DelegatesARIAListbox);
|
|
515
515
|
applyMixins(Select$1, StartEnd, DelegatesARIASelect);
|
|
516
516
|
|
|
517
|
-
const styles = ":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;border-radius:var(--_select-control-border-radius);background-color:var(--_appearance-color-fill);block-size:calc(1px*(40 + 4*clamp(-1,var(--vvd-size-density, 0),2)));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: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)}.control:where(.error):where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-alert-50);--_appearance-color-outline: transparent}.control: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)}.control:where(.success):where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-success-50);--_appearance-color-outline: transparent}.control{--_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-faint: var(--vvd-select-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-soft: var(--vvd-select-accent-soft, var(--vvd-color-neutral-100));--_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}.feedback-wrapper{display:contents}::part(popup-base){inline-size:max-content;min-inline-size:var(--_select-fixed-width, 100%)}:host([multiple]) ::part(popup-base){position:static}
|
|
517
|
+
const styles = ":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;border-radius:var(--_select-control-border-radius);background-color:var(--_appearance-color-fill);block-size:calc(1px*(40 + 4*clamp(-1,var(--vvd-size-density, 0),2)));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: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)}.control:where(.error):where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-alert-50);--_appearance-color-outline: transparent}.control: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)}.control:where(.success):where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-success-50);--_appearance-color-outline: transparent}.control{--_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-faint: var(--vvd-select-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-soft: var(--vvd-select-accent-soft, var(--vvd-color-neutral-100));--_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}.feedback-wrapper{display:contents}::part(popup-base){inline-size:max-content;min-inline-size:var(--_select-fixed-width, 100%)}:host([multiple]) ::part(popup-base){position:static}";
|
|
518
518
|
|
|
519
519
|
var __defProp = Object.defineProperty;
|
|
520
520
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
package/shared/definition44.cjs
CHANGED
|
@@ -8,16 +8,15 @@ const radio$1 = require('./radio.cjs');
|
|
|
8
8
|
const classNames = require('./class-names.cjs');
|
|
9
9
|
const when = require('./when.cjs');
|
|
10
10
|
|
|
11
|
-
const styles = ":host{display:flex}.base{position:relative;padding:var(--selectable-box-spacing, 16px);border:1px solid var(--_appearance-color-outline);border-radius:8px;background-color:var(--_appearance-color-fill);inline-size:100%;padding-block-start:calc(var(--selectable-box-spacing, 16px) + 36px);text-align:start}.base.connotation-cta{--_connotation-color-firm-all: var(--vvd-selectable-box-cta-firm-all, var(--vvd-color-cta-600));--_connotation-color-pale: var(--vvd-selectable-box-cta-pale, var(--vvd-color-cta-300));--_connotation-color-fierce: var(--vvd-selectable-box-cta-fierce, var(--vvd-color-cta-700));--_connotation-color-faint: var(--vvd-selectable-box-cta-faint, var(--vvd-color-cta-50));--_connotation-color-soft: var(--vvd-selectable-box-cta-soft, var(--vvd-color-cta-100))}.base:not(.connotation-cta){--_connotation-color-firm-all: var(--vvd-selectable-box-accent-firm-all, var(--vvd-color-neutral-600));--_connotation-color-pale: var(--vvd-selectable-box-accent-pale, var(--vvd-color-neutral-300));--_connotation-color-fierce: var(--vvd-selectable-box-accent-fierce, var(--vvd-color-neutral-700));--_connotation-color-faint: var(--vvd-selectable-box-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-soft: var(--vvd-selectable-box-accent-soft, var(--vvd-color-neutral-100))}.base{--_appearance-color-text: var(--_connotation-color-firm-all);--_appearance-color-fill: transparent;--_appearance-color-outline: var(--_connotation-color-pale)}.base:where(.hover,:hover):where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-firm-all);--_appearance-color-fill: transparent;--_appearance-color-outline: var(--_connotation-color-firm-all)}.base:where(.selected):where(:not(.disabled,:disabled)){--_appearance-color-text: var(--_connotation-color-firm-all);--_appearance-color-fill: var(--_connotation-color-soft);--_appearance-color-outline: var(--_connotation-color-pale)}.base:where(.selected):where(.hover,:hover):where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-firm-all);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: var(--_connotation-color-firm-all)}.base:focus-visible{--focus-stroke-gap-color: transparent;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))}.base.tight{overflow:hidden;min-height:calc(var(--selectable-box-spacing, 16px) * 2 + 22px);padding:0}.base.clickable{cursor:pointer}.control{position:absolute;inset-block-start:var(--selectable-box-spacing, 16px);inset-inline-end:var(--selectable-box-spacing, 16px)}
|
|
11
|
+
const styles = ":host{display:flex}.base{position:relative;padding:var(--selectable-box-spacing, 16px);border:1px solid var(--_appearance-color-outline);border-radius:8px;background-color:var(--_appearance-color-fill);inline-size:100%;padding-block-start:calc(var(--selectable-box-spacing, 16px) + 36px);text-align:start}.base.connotation-cta{--_connotation-color-firm-all: var(--vvd-selectable-box-cta-firm-all, var(--vvd-color-cta-600));--_connotation-color-pale: var(--vvd-selectable-box-cta-pale, var(--vvd-color-cta-300));--_connotation-color-fierce: var(--vvd-selectable-box-cta-fierce, var(--vvd-color-cta-700));--_connotation-color-faint: var(--vvd-selectable-box-cta-faint, var(--vvd-color-cta-50));--_connotation-color-soft: var(--vvd-selectable-box-cta-soft, var(--vvd-color-cta-100))}.base:not(.connotation-cta){--_connotation-color-firm-all: var(--vvd-selectable-box-accent-firm-all, var(--vvd-color-neutral-600));--_connotation-color-pale: var(--vvd-selectable-box-accent-pale, var(--vvd-color-neutral-300));--_connotation-color-fierce: var(--vvd-selectable-box-accent-fierce, var(--vvd-color-neutral-700));--_connotation-color-faint: var(--vvd-selectable-box-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-soft: var(--vvd-selectable-box-accent-soft, var(--vvd-color-neutral-100))}.base{--_appearance-color-text: var(--_connotation-color-firm-all);--_appearance-color-fill: transparent;--_appearance-color-outline: var(--_connotation-color-pale)}.base:where(.hover,:hover):where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-firm-all);--_appearance-color-fill: transparent;--_appearance-color-outline: var(--_connotation-color-firm-all)}.base:where(.selected):where(:not(.disabled,:disabled)){--_appearance-color-text: var(--_connotation-color-firm-all);--_appearance-color-fill: var(--_connotation-color-soft);--_appearance-color-outline: var(--_connotation-color-pale)}.base:where(.selected):where(.hover,:hover):where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-firm-all);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: var(--_connotation-color-firm-all)}.base:focus-visible{--focus-stroke-gap-color: transparent;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))}.base.tight{overflow:hidden;min-height:calc(var(--selectable-box-spacing, 16px) * 2 + 22px);padding:0}.base.clickable{cursor:pointer}.control{position:absolute;inset-block-start:var(--selectable-box-spacing, 16px);inset-inline-end:var(--selectable-box-spacing, 16px)}";
|
|
12
12
|
|
|
13
13
|
var __defProp = Object.defineProperty;
|
|
14
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
15
14
|
var __decorateClass = (decorators, target, key, kind) => {
|
|
16
|
-
var result =
|
|
15
|
+
var result = void 0 ;
|
|
17
16
|
for (var i = decorators.length - 1, decorator; i >= 0; i--)
|
|
18
17
|
if (decorator = decorators[i])
|
|
19
|
-
result = (
|
|
20
|
-
if (
|
|
18
|
+
result = (decorator(target, key, result) ) || result;
|
|
19
|
+
if (result)
|
|
21
20
|
__defProp(target, key, result);
|
|
22
21
|
return result;
|
|
23
22
|
};
|
|
@@ -51,25 +50,25 @@ class SelectableBox extends index.FoundationElement {
|
|
|
51
50
|
}
|
|
52
51
|
__decorateClass([
|
|
53
52
|
index.attr({ attribute: "aria-label" })
|
|
54
|
-
], SelectableBox.prototype, "ariaLabel"
|
|
53
|
+
], SelectableBox.prototype, "ariaLabel");
|
|
55
54
|
__decorateClass([
|
|
56
55
|
index.attr({ mode: "boolean" })
|
|
57
|
-
], SelectableBox.prototype, "checked"
|
|
56
|
+
], SelectableBox.prototype, "checked");
|
|
58
57
|
__decorateClass([
|
|
59
58
|
index.attr({ mode: "boolean" })
|
|
60
|
-
], SelectableBox.prototype, "clickable"
|
|
59
|
+
], SelectableBox.prototype, "clickable");
|
|
61
60
|
__decorateClass([
|
|
62
61
|
index.attr({ attribute: "clickable-box", mode: "boolean" })
|
|
63
|
-
], SelectableBox.prototype, "clickableBox"
|
|
62
|
+
], SelectableBox.prototype, "clickableBox");
|
|
64
63
|
__decorateClass([
|
|
65
64
|
index.attr
|
|
66
|
-
], SelectableBox.prototype, "connotation"
|
|
65
|
+
], SelectableBox.prototype, "connotation");
|
|
67
66
|
__decorateClass([
|
|
68
67
|
index.attr({ attribute: "control-type" })
|
|
69
|
-
], SelectableBox.prototype, "controlType"
|
|
68
|
+
], SelectableBox.prototype, "controlType");
|
|
70
69
|
__decorateClass([
|
|
71
70
|
index.attr({ mode: "boolean" })
|
|
72
|
-
], SelectableBox.prototype, "tight"
|
|
71
|
+
], SelectableBox.prototype, "tight");
|
|
73
72
|
|
|
74
73
|
const getClasses = ({
|
|
75
74
|
connotation,
|
package/shared/definition44.js
CHANGED
|
@@ -6,16 +6,15 @@ import { R as Radio } from './radio.js';
|
|
|
6
6
|
import { c as classNames } from './class-names.js';
|
|
7
7
|
import { w as when } from './when.js';
|
|
8
8
|
|
|
9
|
-
const styles = ":host{display:flex}.base{position:relative;padding:var(--selectable-box-spacing, 16px);border:1px solid var(--_appearance-color-outline);border-radius:8px;background-color:var(--_appearance-color-fill);inline-size:100%;padding-block-start:calc(var(--selectable-box-spacing, 16px) + 36px);text-align:start}.base.connotation-cta{--_connotation-color-firm-all: var(--vvd-selectable-box-cta-firm-all, var(--vvd-color-cta-600));--_connotation-color-pale: var(--vvd-selectable-box-cta-pale, var(--vvd-color-cta-300));--_connotation-color-fierce: var(--vvd-selectable-box-cta-fierce, var(--vvd-color-cta-700));--_connotation-color-faint: var(--vvd-selectable-box-cta-faint, var(--vvd-color-cta-50));--_connotation-color-soft: var(--vvd-selectable-box-cta-soft, var(--vvd-color-cta-100))}.base:not(.connotation-cta){--_connotation-color-firm-all: var(--vvd-selectable-box-accent-firm-all, var(--vvd-color-neutral-600));--_connotation-color-pale: var(--vvd-selectable-box-accent-pale, var(--vvd-color-neutral-300));--_connotation-color-fierce: var(--vvd-selectable-box-accent-fierce, var(--vvd-color-neutral-700));--_connotation-color-faint: var(--vvd-selectable-box-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-soft: var(--vvd-selectable-box-accent-soft, var(--vvd-color-neutral-100))}.base{--_appearance-color-text: var(--_connotation-color-firm-all);--_appearance-color-fill: transparent;--_appearance-color-outline: var(--_connotation-color-pale)}.base:where(.hover,:hover):where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-firm-all);--_appearance-color-fill: transparent;--_appearance-color-outline: var(--_connotation-color-firm-all)}.base:where(.selected):where(:not(.disabled,:disabled)){--_appearance-color-text: var(--_connotation-color-firm-all);--_appearance-color-fill: var(--_connotation-color-soft);--_appearance-color-outline: var(--_connotation-color-pale)}.base:where(.selected):where(.hover,:hover):where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-firm-all);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: var(--_connotation-color-firm-all)}.base:focus-visible{--focus-stroke-gap-color: transparent;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))}.base.tight{overflow:hidden;min-height:calc(var(--selectable-box-spacing, 16px) * 2 + 22px);padding:0}.base.clickable{cursor:pointer}.control{position:absolute;inset-block-start:var(--selectable-box-spacing, 16px);inset-inline-end:var(--selectable-box-spacing, 16px)}
|
|
9
|
+
const styles = ":host{display:flex}.base{position:relative;padding:var(--selectable-box-spacing, 16px);border:1px solid var(--_appearance-color-outline);border-radius:8px;background-color:var(--_appearance-color-fill);inline-size:100%;padding-block-start:calc(var(--selectable-box-spacing, 16px) + 36px);text-align:start}.base.connotation-cta{--_connotation-color-firm-all: var(--vvd-selectable-box-cta-firm-all, var(--vvd-color-cta-600));--_connotation-color-pale: var(--vvd-selectable-box-cta-pale, var(--vvd-color-cta-300));--_connotation-color-fierce: var(--vvd-selectable-box-cta-fierce, var(--vvd-color-cta-700));--_connotation-color-faint: var(--vvd-selectable-box-cta-faint, var(--vvd-color-cta-50));--_connotation-color-soft: var(--vvd-selectable-box-cta-soft, var(--vvd-color-cta-100))}.base:not(.connotation-cta){--_connotation-color-firm-all: var(--vvd-selectable-box-accent-firm-all, var(--vvd-color-neutral-600));--_connotation-color-pale: var(--vvd-selectable-box-accent-pale, var(--vvd-color-neutral-300));--_connotation-color-fierce: var(--vvd-selectable-box-accent-fierce, var(--vvd-color-neutral-700));--_connotation-color-faint: var(--vvd-selectable-box-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-soft: var(--vvd-selectable-box-accent-soft, var(--vvd-color-neutral-100))}.base{--_appearance-color-text: var(--_connotation-color-firm-all);--_appearance-color-fill: transparent;--_appearance-color-outline: var(--_connotation-color-pale)}.base:where(.hover,:hover):where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-firm-all);--_appearance-color-fill: transparent;--_appearance-color-outline: var(--_connotation-color-firm-all)}.base:where(.selected):where(:not(.disabled,:disabled)){--_appearance-color-text: var(--_connotation-color-firm-all);--_appearance-color-fill: var(--_connotation-color-soft);--_appearance-color-outline: var(--_connotation-color-pale)}.base:where(.selected):where(.hover,:hover):where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-firm-all);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: var(--_connotation-color-firm-all)}.base:focus-visible{--focus-stroke-gap-color: transparent;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))}.base.tight{overflow:hidden;min-height:calc(var(--selectable-box-spacing, 16px) * 2 + 22px);padding:0}.base.clickable{cursor:pointer}.control{position:absolute;inset-block-start:var(--selectable-box-spacing, 16px);inset-inline-end:var(--selectable-box-spacing, 16px)}";
|
|
10
10
|
|
|
11
11
|
var __defProp = Object.defineProperty;
|
|
12
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
13
12
|
var __decorateClass = (decorators, target, key, kind) => {
|
|
14
|
-
var result =
|
|
13
|
+
var result = void 0 ;
|
|
15
14
|
for (var i = decorators.length - 1, decorator; i >= 0; i--)
|
|
16
15
|
if (decorator = decorators[i])
|
|
17
|
-
result = (
|
|
18
|
-
if (
|
|
16
|
+
result = (decorator(target, key, result) ) || result;
|
|
17
|
+
if (result)
|
|
19
18
|
__defProp(target, key, result);
|
|
20
19
|
return result;
|
|
21
20
|
};
|
|
@@ -49,25 +48,25 @@ class SelectableBox extends FoundationElement {
|
|
|
49
48
|
}
|
|
50
49
|
__decorateClass([
|
|
51
50
|
attr({ attribute: "aria-label" })
|
|
52
|
-
], SelectableBox.prototype, "ariaLabel"
|
|
51
|
+
], SelectableBox.prototype, "ariaLabel");
|
|
53
52
|
__decorateClass([
|
|
54
53
|
attr({ mode: "boolean" })
|
|
55
|
-
], SelectableBox.prototype, "checked"
|
|
54
|
+
], SelectableBox.prototype, "checked");
|
|
56
55
|
__decorateClass([
|
|
57
56
|
attr({ mode: "boolean" })
|
|
58
|
-
], SelectableBox.prototype, "clickable"
|
|
57
|
+
], SelectableBox.prototype, "clickable");
|
|
59
58
|
__decorateClass([
|
|
60
59
|
attr({ attribute: "clickable-box", mode: "boolean" })
|
|
61
|
-
], SelectableBox.prototype, "clickableBox"
|
|
60
|
+
], SelectableBox.prototype, "clickableBox");
|
|
62
61
|
__decorateClass([
|
|
63
62
|
attr
|
|
64
|
-
], SelectableBox.prototype, "connotation"
|
|
63
|
+
], SelectableBox.prototype, "connotation");
|
|
65
64
|
__decorateClass([
|
|
66
65
|
attr({ attribute: "control-type" })
|
|
67
|
-
], SelectableBox.prototype, "controlType"
|
|
66
|
+
], SelectableBox.prototype, "controlType");
|
|
68
67
|
__decorateClass([
|
|
69
68
|
attr({ mode: "boolean" })
|
|
70
|
-
], SelectableBox.prototype, "tight"
|
|
69
|
+
], SelectableBox.prototype, "tight");
|
|
71
70
|
|
|
72
71
|
const getClasses = ({
|
|
73
72
|
connotation,
|
package/shared/definition45.cjs
CHANGED
|
@@ -5,13 +5,12 @@ const when = require('./when.cjs');
|
|
|
5
5
|
const classNames = require('./class-names.cjs');
|
|
6
6
|
|
|
7
7
|
var __defProp = Object.defineProperty;
|
|
8
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
9
8
|
var __decorateClass = (decorators, target, key, kind) => {
|
|
10
|
-
var result =
|
|
9
|
+
var result = void 0 ;
|
|
11
10
|
for (var i = decorators.length - 1, decorator; i >= 0; i--)
|
|
12
11
|
if (decorator = decorators[i])
|
|
13
|
-
result = (
|
|
14
|
-
if (
|
|
12
|
+
result = (decorator(target, key, result) ) || result;
|
|
13
|
+
if (result)
|
|
15
14
|
__defProp(target, key, result);
|
|
16
15
|
return result;
|
|
17
16
|
};
|
|
@@ -42,24 +41,24 @@ __decorateClass([
|
|
|
42
41
|
index.attr({
|
|
43
42
|
mode: "boolean"
|
|
44
43
|
})
|
|
45
|
-
], SideDrawer.prototype, "alternate"
|
|
44
|
+
], SideDrawer.prototype, "alternate");
|
|
46
45
|
__decorateClass([
|
|
47
46
|
index.attr({
|
|
48
47
|
mode: "boolean"
|
|
49
48
|
})
|
|
50
|
-
], SideDrawer.prototype, "modal"
|
|
49
|
+
], SideDrawer.prototype, "modal");
|
|
51
50
|
__decorateClass([
|
|
52
51
|
index.attr({
|
|
53
52
|
mode: "boolean"
|
|
54
53
|
})
|
|
55
|
-
], SideDrawer.prototype, "open"
|
|
54
|
+
], SideDrawer.prototype, "open");
|
|
56
55
|
__decorateClass([
|
|
57
56
|
index.attr({
|
|
58
57
|
mode: "boolean"
|
|
59
58
|
})
|
|
60
|
-
], SideDrawer.prototype, "trailing"
|
|
59
|
+
], SideDrawer.prototype, "trailing");
|
|
61
60
|
|
|
62
|
-
const styles = ":host{display:block}.side-drawer-app-content{block-size:100%}.control{position:fixed;z-index:1;background-color:var(--vvd-color-canvas);color:var(--vvd-color-canvas-text);inline-size:280px;inset-block:0;overflow-y:auto}.control[part~=vvd-theme-alternate]{background-color:var(--vvd-color-canvas);color:var(--vvd-color-canvas-text);color-scheme:var(--vvd-color-scheme)}.control.trailing{inset-inline-end:0}.control:not(.open).trailing{transform:translate(100%)}.control:not(.open):not(.trailing){transform:translate(-100%)}.control.open:not(.modal).trailing+.side-drawer-app-content{margin-inline-end:var(--side-drawer-app-content-offset, 280px)}.control.open:not(.modal):not(.trailing)+.side-drawer-app-content{margin-inline-start:var(--side-drawer-app-content-offset, 280px)}@media (prefers-reduced-motion: no-preference){.control{transition:transform .2s cubic-bezier(.4,0,.2,1)}}.scrim{background-color:var(--vvd-color-canvas-text, currentColor);opacity:.5;position:fixed;inset:0}.scrim:not(.open){display:none}
|
|
61
|
+
const styles = ":host{display:block}.side-drawer-app-content{block-size:100%}.control{position:fixed;z-index:1;background-color:var(--vvd-color-canvas);color:var(--vvd-color-canvas-text);inline-size:280px;inset-block:0;overflow-y:auto}.control[part~=vvd-theme-alternate]{background-color:var(--vvd-color-canvas);color:var(--vvd-color-canvas-text);color-scheme:var(--vvd-color-scheme)}.control.trailing{inset-inline-end:0}.control:not(.open).trailing{transform:translate(100%)}.control:not(.open):not(.trailing){transform:translate(-100%)}.control.open:not(.modal).trailing+.side-drawer-app-content{margin-inline-end:var(--side-drawer-app-content-offset, 280px)}.control.open:not(.modal):not(.trailing)+.side-drawer-app-content{margin-inline-start:var(--side-drawer-app-content-offset, 280px)}@media (prefers-reduced-motion: no-preference){.control{transition:transform .2s cubic-bezier(.4,0,.2,1)}}.scrim{background-color:var(--vvd-color-canvas-text, currentColor);opacity:.5;position:fixed;inset:0}.scrim:not(.open){display:none}";
|
|
63
62
|
|
|
64
63
|
const getClasses = ({ modal, open, trailing }) => classNames.classNames(
|
|
65
64
|
"control",
|
package/shared/definition45.js
CHANGED
|
@@ -3,13 +3,12 @@ import { w as when } from './when.js';
|
|
|
3
3
|
import { c as classNames } from './class-names.js';
|
|
4
4
|
|
|
5
5
|
var __defProp = Object.defineProperty;
|
|
6
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
7
6
|
var __decorateClass = (decorators, target, key, kind) => {
|
|
8
|
-
var result =
|
|
7
|
+
var result = void 0 ;
|
|
9
8
|
for (var i = decorators.length - 1, decorator; i >= 0; i--)
|
|
10
9
|
if (decorator = decorators[i])
|
|
11
|
-
result = (
|
|
12
|
-
if (
|
|
10
|
+
result = (decorator(target, key, result) ) || result;
|
|
11
|
+
if (result)
|
|
13
12
|
__defProp(target, key, result);
|
|
14
13
|
return result;
|
|
15
14
|
};
|
|
@@ -40,24 +39,24 @@ __decorateClass([
|
|
|
40
39
|
attr({
|
|
41
40
|
mode: "boolean"
|
|
42
41
|
})
|
|
43
|
-
], SideDrawer.prototype, "alternate"
|
|
42
|
+
], SideDrawer.prototype, "alternate");
|
|
44
43
|
__decorateClass([
|
|
45
44
|
attr({
|
|
46
45
|
mode: "boolean"
|
|
47
46
|
})
|
|
48
|
-
], SideDrawer.prototype, "modal"
|
|
47
|
+
], SideDrawer.prototype, "modal");
|
|
49
48
|
__decorateClass([
|
|
50
49
|
attr({
|
|
51
50
|
mode: "boolean"
|
|
52
51
|
})
|
|
53
|
-
], SideDrawer.prototype, "open"
|
|
52
|
+
], SideDrawer.prototype, "open");
|
|
54
53
|
__decorateClass([
|
|
55
54
|
attr({
|
|
56
55
|
mode: "boolean"
|
|
57
56
|
})
|
|
58
|
-
], SideDrawer.prototype, "trailing"
|
|
57
|
+
], SideDrawer.prototype, "trailing");
|
|
59
58
|
|
|
60
|
-
const styles = ":host{display:block}.side-drawer-app-content{block-size:100%}.control{position:fixed;z-index:1;background-color:var(--vvd-color-canvas);color:var(--vvd-color-canvas-text);inline-size:280px;inset-block:0;overflow-y:auto}.control[part~=vvd-theme-alternate]{background-color:var(--vvd-color-canvas);color:var(--vvd-color-canvas-text);color-scheme:var(--vvd-color-scheme)}.control.trailing{inset-inline-end:0}.control:not(.open).trailing{transform:translate(100%)}.control:not(.open):not(.trailing){transform:translate(-100%)}.control.open:not(.modal).trailing+.side-drawer-app-content{margin-inline-end:var(--side-drawer-app-content-offset, 280px)}.control.open:not(.modal):not(.trailing)+.side-drawer-app-content{margin-inline-start:var(--side-drawer-app-content-offset, 280px)}@media (prefers-reduced-motion: no-preference){.control{transition:transform .2s cubic-bezier(.4,0,.2,1)}}.scrim{background-color:var(--vvd-color-canvas-text, currentColor);opacity:.5;position:fixed;inset:0}.scrim:not(.open){display:none}
|
|
59
|
+
const styles = ":host{display:block}.side-drawer-app-content{block-size:100%}.control{position:fixed;z-index:1;background-color:var(--vvd-color-canvas);color:var(--vvd-color-canvas-text);inline-size:280px;inset-block:0;overflow-y:auto}.control[part~=vvd-theme-alternate]{background-color:var(--vvd-color-canvas);color:var(--vvd-color-canvas-text);color-scheme:var(--vvd-color-scheme)}.control.trailing{inset-inline-end:0}.control:not(.open).trailing{transform:translate(100%)}.control:not(.open):not(.trailing){transform:translate(-100%)}.control.open:not(.modal).trailing+.side-drawer-app-content{margin-inline-end:var(--side-drawer-app-content-offset, 280px)}.control.open:not(.modal):not(.trailing)+.side-drawer-app-content{margin-inline-start:var(--side-drawer-app-content-offset, 280px)}@media (prefers-reduced-motion: no-preference){.control{transition:transform .2s cubic-bezier(.4,0,.2,1)}}.scrim{background-color:var(--vvd-color-canvas-text, currentColor);opacity:.5;position:fixed;inset:0}.scrim:not(.open){display:none}";
|
|
61
60
|
|
|
62
61
|
const getClasses = ({ modal, open, trailing }) => classNames(
|
|
63
62
|
"control",
|