@vialiq/web-components 0.17.0 → 0.18.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/base/draggable-mixin.d.ts +2 -0
  2. package/base/draggable-mixin.d.ts.map +1 -1
  3. package/base/overlay-manager.d.ts +7 -6
  4. package/base/overlay-manager.d.ts.map +1 -1
  5. package/base/resizable-mixin.d.ts +28 -0
  6. package/base/resizable-mixin.d.ts.map +1 -0
  7. package/index.js +4 -1299
  8. package/{overlay-manager-CZSDXl6Z.js → overlay-manager-xco6S92C.js} +27 -26
  9. package/package.json +2 -2
  10. package/tooltip/vi-tooltip.js +1 -1
package/index.js CHANGED
@@ -1,9 +1,8 @@
1
- import { V as ViElement } from './vi-element-C6GfDPs3.js';
1
+ export { V as ViElement } from './vi-element-C6GfDPs3.js';
2
2
  export { ViButton } from './button/vi-button.js';
3
3
  export { ViInput } from './input/vi-input.js';
4
4
  export { ViIcon } from './icons/vi-icon.js';
5
- import { registerIcons } from './icons/registry.js';
6
- export { getIcon } from './icons/registry.js';
5
+ export { getIcon, registerIcons } from './icons/registry.js';
7
6
  export { ViRadio } from './radio/vi-radio.js';
8
7
  export { ViRadioGroup } from './radio/vi-radio-group.js';
9
8
  export { ViCheckbox } from './checkbox/vi-checkbox.js';
@@ -16,1299 +15,5 @@ export { ViAlert } from './alert/vi-alert.js';
16
15
  export { ViChip } from './chip/vi-chip.js';
17
16
  export { ViChipGroup } from './chip/vi-chip-group.js';
18
17
  export { ViAnimation } from './animation/vi-animation.js';
19
- import { unsafeCSS, css, nothing, html } from 'lit';
20
- import { customElement, property } from 'lit/decorators.js';
21
- import { classMap } from 'lit/directives/class-map.js';
22
- import { xIcon, checkIcon } from '@vialiq/icons';
23
- import { F as FocusableMixin } from './focusable-mixin-CmxOyPX5.js';
24
- import { V as ValidityMixin } from './validity-mixin-DO0ycRH2.js';
25
-
26
- const tagStyles = "@charset \"UTF-8\";@layer reset,components,utilities;@layer components{:host,:root{--vi-tag-height: 24px;--vi-tag-padding-x: 10px;--vi-tag-border-radius: 4px;--vi-tag-font-size: var(--vi-font-size-xs, var(--vi-font-size-xs, 12px));--vi-tag-font-weight: var(--vi-font-weight-medium, var(--vi-font-weight-medium, 500));--vi-tag-gap: 6px;--vi-tag-remove-size: 16px;--vi-tag-dot-size: 6px;--vi-tag-avatar-size: 14px;--vi-tag-icon-size: 14px;--vi-tag-transition: all .15s cubic-bezier(.4, 0, .2, 1);--vi-tag-disabled-opacity: .5;--vi-tag-max-width: 100%}.tag{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;height:var(--vi-tag-height);padding-inline:var(--vi-tag-padding-x);border-radius:var(--vi-tag-border-radius);font-family:var(--vi-font-family-base, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif);font-size:var(--vi-tag-font-size);font-weight:var(--vi-tag-font-weight);line-height:1;gap:var(--vi-tag-gap);transition:var(--vi-tag-transition);-webkit-user-select:none;user-select:none;border:var(--vi-border-width-thin, 1px) solid transparent;cursor:default;max-width:var(--vi-tag-max-width);vertical-align:middle;position:relative}.tag.tag--pill{border-radius:9999px}.tag.tag--removable{padding-inline-end:calc(var(--vi-tag-padding-x) - 4px)}.tag .tag-content-wrapper{display:inline-flex;align-items:center;justify-content:center;gap:var(--vi-tag-gap);min-width:0;flex:1 1 auto;height:100%;line-height:1;outline:none;border-radius:inherit}.tag .tag-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;line-height:1;display:inline-block}.tag .tag-icon,.tag .tag-avatar,.tag .tag-checkmark{display:inline-flex;align-items:center;justify-content:center;line-height:1;flex-shrink:0}.tag .tag-avatar ::slotted(*){width:var(--vi-tag-avatar-size, calc(var(--vi-tag-height) - 10px));height:var(--vi-tag-avatar-size, calc(var(--vi-tag-height) - 10px));border-radius:50%;object-fit:cover;display:block}.tag .tag-dot{display:inline-block;width:var(--vi-tag-dot-size);height:var(--vi-tag-dot-size);border-radius:50%;background-color:currentColor;flex-shrink:0}.tag .tag-count{display:inline-flex;align-items:center;justify-content:center;padding-inline:5px;height:calc(var(--vi-tag-height) - 10px);min-width:calc(var(--vi-tag-height) - 10px);font-size:10px;font-weight:var(--vi-font-weight-semibold, 600);border-radius:9999px;background-color:#00000014;color:inherit;line-height:1;flex-shrink:0;margin-inline-start:2px}.tag.tag-clickable{cursor:pointer}.tag.tag-clickable:hover{transform:translateY(-1px)}.tag.tag-clickable:active{transform:translateY(0) scale(.98)}.tag.appearance-subtle.variant-neutral{background-color:var(--vi-tag-neutral-bg, var(--vi-layer-02, #f3f4f6));color:var(--vi-tag-neutral-color, var(--vi-text-primary, #111827));border-color:var(--vi-tag-neutral-border, var(--vi-border-03, #e0e0e0))}.tag.appearance-subtle.variant-neutral.tag-clickable:hover{background-color:var(--vi-tag-neutral-hover-bg, var(--vi-layer-03, #e5e7eb));border-color:var(--vi-tag-neutral-hover-border, var(--vi-border-04, #bdbdbd))}.tag.appearance-subtle.variant-neutral.tag-selected{background-color:var(--vi-tag-neutral-selected-bg, var(--vi-layer-03, #e5e7eb));border-color:var(--vi-tag-neutral-selected-border, var(--vi-color-primary, #3676d0));color:var(--vi-tag-neutral-selected-color, var(--vi-color-primary, #3676d0))}.tag.appearance-subtle.variant-primary{background-color:var(--vi-tag-primary-bg, var(--vi-bg-info, #e3f2fd));color:var(--vi-tag-primary-color, var(--vi-text-info, #3676d0));border-color:var(--vi-tag-primary-border, var(--vi-color-blue-300, #a3d1fa))}.tag.appearance-subtle.variant-primary.tag-clickable:hover{background-color:var(--vi-tag-primary-hover-bg, var(--vi-color-blue-100, #ebf5ff));border-color:var(--vi-tag-primary-hover-border, var(--vi-color-blue-400, #74b6f4))}.tag.appearance-subtle.variant-primary.tag-selected{background-color:var(--vi-tag-primary-selected-bg, var(--vi-color-blue-100, #ebf5ff));border-color:var(--vi-tag-primary-selected-border, var(--vi-color-primary, #3676d0));color:var(--vi-tag-primary-selected-color, var(--vi-color-blue-800, #2d5fa8))}.tag.appearance-subtle.variant-success{background-color:var(--vi-tag-success-bg, var(--vi-bg-success, #e6f9f0));color:var(--vi-tag-success-color, var(--vi-text-success, #265a3d));border-color:var(--vi-tag-success-border, var(--vi-color-green-300, #96c4ab))}.tag.appearance-subtle.variant-success.tag-clickable:hover{background-color:var(--vi-tag-success-hover-bg, var(--vi-color-green-100, #e6f0eb));border-color:var(--vi-tag-success-hover-border, var(--vi-color-green-400, #6eab88))}.tag.appearance-subtle.variant-success.tag-selected{background-color:var(--vi-tag-success-selected-bg, var(--vi-color-green-100, #e6f0eb));border-color:var(--vi-tag-success-selected-border, var(--vi-color-success, #489167));color:var(--vi-tag-success-selected-color, var(--vi-color-green-800, #17402a))}.tag.appearance-subtle.variant-warning{background-color:var(--vi-tag-warning-bg, var(--vi-bg-warning, #fff8e1));color:var(--vi-tag-warning-color, var(--vi-text-warning, #e68300));border-color:var(--vi-tag-warning-border, var(--vi-color-yellow-300, #ffd359))}.tag.appearance-subtle.variant-warning.tag-clickable:hover{background-color:var(--vi-tag-warning-hover-bg, var(--vi-color-yellow-100, #ffeab1));border-color:var(--vi-tag-warning-hover-border, var(--vi-color-yellow-400, #ffc72e))}.tag.appearance-subtle.variant-warning.tag-selected{background-color:var(--vi-tag-warning-selected-bg, var(--vi-color-yellow-100, #ffeab1));border-color:var(--vi-tag-warning-selected-border, var(--vi-color-warning, #ffba00));color:var(--vi-tag-warning-selected-color, var(--vi-color-yellow-800, #e68300))}.tag.appearance-subtle.variant-danger{background-color:var(--vi-tag-danger-bg, var(--vi-bg-error, #ffebee));color:var(--vi-tag-danger-color, var(--vi-text-error, #db231b));border-color:var(--vi-tag-danger-border, var(--vi-color-red-300, #ee6f68))}.tag.appearance-subtle.variant-danger.tag-clickable:hover{background-color:var(--vi-tag-danger-hover-bg, var(--vi-color-red-100, #ffccce));border-color:var(--vi-tag-danger-hover-border, var(--vi-color-red-400, #f74d40))}.tag.appearance-subtle.variant-danger.tag-selected{background-color:var(--vi-tag-danger-selected-bg, var(--vi-color-red-100, #ffccce));border-color:var(--vi-tag-danger-selected-border, var(--vi-color-error, #ef4444));color:var(--vi-tag-danger-selected-color, var(--vi-color-red-800, #ce1a12))}.tag.appearance-subtle.variant-info{background-color:var(--vi-tag-info-bg, var(--vi-color-blue-100, #ebf5ff));color:var(--vi-tag-info-color, var(--vi-color-blue-700, #3676d0));border-color:var(--vi-tag-info-border, var(--vi-color-blue-300, #a3d1fa))}.tag.appearance-subtle.variant-info.tag-clickable:hover{background-color:var(--vi-tag-info-hover-bg, var(--vi-color-blue-200, #cee6ff));border-color:var(--vi-tag-info-hover-border, var(--vi-color-blue-500, #3f96f1))}.tag.appearance-subtle.variant-info.tag-selected{background-color:var(--vi-tag-info-selected-bg, var(--vi-color-blue-200, #cee6ff));border-color:var(--vi-tag-info-selected-border, var(--vi-color-blue-700, #3676d0));color:var(--vi-tag-info-selected-color, var(--vi-color-blue-900, #254882))}.tag.appearance-subtle.variant-contrast{background-color:var(--vi-tag-contrast-bg, var(--vi-text-primary, #111827));color:var(--vi-tag-contrast-color, var(--vi-text-primary-inverse, #ffffff));border-color:var(--vi-tag-contrast-border, var(--vi-text-primary, #111827))}.tag.appearance-subtle.variant-contrast .tag-count{background-color:#fff3}.tag.appearance-outline{background-color:transparent}.tag.appearance-outline.variant-neutral{color:var(--vi-tag-outline-neutral-color, var(--vi-text-primary, #111827));border-color:var(--vi-tag-outline-neutral-border, var(--vi-border-04, #bdbdbd))}.tag.appearance-outline.variant-neutral.tag-clickable:hover,.tag.appearance-outline.variant-neutral.tag-selected{background-color:var(--vi-tag-outline-neutral-hover-bg, var(--vi-layer-02, #f3f4f6))}.tag.appearance-outline.variant-primary{color:var(--vi-tag-outline-primary-color, var(--vi-color-primary, #3676d0));border-color:var(--vi-tag-outline-primary-border, var(--vi-color-primary, #3676d0))}.tag.appearance-outline.variant-primary.tag-clickable:hover,.tag.appearance-outline.variant-primary.tag-selected{background-color:var(--vi-tag-outline-primary-hover-bg, var(--vi-bg-info, #e3f2fd))}.tag.appearance-outline.variant-success{color:var(--vi-tag-outline-success-color, var(--vi-color-success, #489167));border-color:var(--vi-tag-outline-success-border, var(--vi-color-success, #489167))}.tag.appearance-outline.variant-success.tag-clickable:hover,.tag.appearance-outline.variant-success.tag-selected{background-color:var(--vi-tag-outline-success-hover-bg, var(--vi-bg-success, #e6f9f0))}.tag.appearance-outline.variant-warning{color:var(--vi-tag-outline-warning-color, var(--vi-color-warning, #ffba00));border-color:var(--vi-tag-outline-warning-border, var(--vi-color-warning, #ffba00))}.tag.appearance-outline.variant-warning.tag-clickable:hover,.tag.appearance-outline.variant-warning.tag-selected{background-color:var(--vi-tag-outline-warning-hover-bg, var(--vi-bg-warning, #fff8e1))}.tag.appearance-outline.variant-danger{color:var(--vi-tag-outline-danger-color, var(--vi-color-error, #ef4444));border-color:var(--vi-tag-outline-danger-border, var(--vi-color-error, #ef4444))}.tag.appearance-outline.variant-danger.tag-clickable:hover,.tag.appearance-outline.variant-danger.tag-selected{background-color:var(--vi-tag-outline-danger-hover-bg, var(--vi-bg-error, #ffebee))}.tag.appearance-outline.variant-info{color:var(--vi-tag-outline-info-color, var(--vi-color-blue-700, #3676d0));border-color:var(--vi-tag-outline-info-border, var(--vi-color-blue-500, #3f96f1))}.tag.appearance-outline.variant-info.tag-clickable:hover,.tag.appearance-outline.variant-info.tag-selected{background-color:var(--vi-tag-outline-info-hover-bg, var(--vi-color-blue-100, #ebf5ff))}.tag.appearance-outline.variant-contrast{color:var(--vi-tag-outline-contrast-color, var(--vi-text-primary, #111827));border-color:var(--vi-tag-outline-contrast-border, var(--vi-text-primary, #111827))}.tag.appearance-outline.variant-contrast.tag-clickable:hover,.tag.appearance-outline.variant-contrast.tag-selected{background-color:var(--vi-tag-outline-contrast-hover-bg, var(--vi-layer-02, #f3f4f6))}.tag.appearance-solid{border-color:transparent;box-shadow:0 1px 2px #0000000d}.tag.appearance-solid.variant-neutral{background-color:var(--vi-tag-solid-neutral-bg, var(--vi-border-inverse-03, #757575));color:var(--vi-tag-solid-neutral-color, var(--vi-text-primary-inverse, #ffffff))}.tag.appearance-solid.variant-neutral.tag-clickable:hover,.tag.appearance-solid.variant-neutral.tag-selected{background-color:var(--vi-tag-solid-neutral-hover-bg, var(--vi-text-primary, #111827))}.tag.appearance-solid.variant-primary{background-color:var(--vi-tag-solid-primary-bg, var(--vi-color-primary, #3676d0));color:var(--vi-tag-solid-primary-color, var(--vi-text-primary-inverse, #ffffff))}.tag.appearance-solid.variant-primary.tag-clickable:hover,.tag.appearance-solid.variant-primary.tag-selected{background-color:var(--vi-tag-solid-primary-hover-bg, var(--vi-color-blue-800, #2d5fa8))}.tag.appearance-solid.variant-success{background-color:var(--vi-tag-solid-success-bg, var(--vi-color-success, #489167));color:var(--vi-tag-solid-success-color, var(--vi-text-primary-inverse, #ffffff))}.tag.appearance-solid.variant-success.tag-clickable:hover,.tag.appearance-solid.variant-success.tag-selected{background-color:var(--vi-tag-solid-success-hover-bg, var(--vi-color-green-700, #265a3d))}.tag.appearance-solid.variant-warning{background-color:var(--vi-tag-solid-warning-bg, var(--vi-color-warning, #ffba00));color:var(--vi-tag-solid-warning-color, var(--vi-text-primary-inverse, #ffffff))}.tag.appearance-solid.variant-warning.tag-clickable:hover,.tag.appearance-solid.variant-warning.tag-selected{background-color:var(--vi-tag-solid-warning-hover-bg, var(--vi-color-yellow-700, #ff9900))}.tag.appearance-solid.variant-danger{background-color:var(--vi-tag-solid-danger-bg, var(--vi-color-error, #ef4444));color:var(--vi-tag-solid-danger-color, var(--vi-text-primary-inverse, #ffffff))}.tag.appearance-solid.variant-danger.tag-clickable:hover,.tag.appearance-solid.variant-danger.tag-selected{background-color:var(--vi-tag-solid-danger-hover-bg, var(--vi-color-red-700, #db231b))}.tag.appearance-solid.variant-info{background-color:var(--vi-tag-solid-info-bg, var(--vi-color-blue-600, #3b86de));color:var(--vi-tag-solid-info-color, var(--vi-text-primary-inverse, #ffffff))}.tag.appearance-solid.variant-info.tag-clickable:hover,.tag.appearance-solid.variant-info.tag-selected{background-color:var(--vi-tag-solid-info-hover-bg, var(--vi-color-blue-800, #2d5fa8))}.tag.appearance-solid.variant-contrast{background-color:var(--vi-tag-solid-contrast-bg, var(--vi-text-primary, #111827));color:var(--vi-tag-solid-contrast-color, var(--vi-text-primary-inverse, #ffffff))}.tag.appearance-solid .tag-count{background-color:#ffffff40}.tag.size-xs{--vi-tag-height: 18px;--vi-tag-font-size: 10px;--vi-tag-padding-x: 6px;--vi-tag-gap: 4px;--vi-tag-remove-size: 12px;--vi-tag-dot-size: 4px;--vi-tag-avatar-size: 10px;--vi-tag-icon-size: 10px}.tag.size-sm{--vi-tag-height: 20px;--vi-tag-font-size: 11px;--vi-tag-padding-x: 8px;--vi-tag-gap: 5px;--vi-tag-remove-size: 14px;--vi-tag-dot-size: 5px;--vi-tag-avatar-size: 12px;--vi-tag-icon-size: 12px}.tag.size-lg{--vi-tag-height: 28px;--vi-tag-font-size: 13px;--vi-tag-padding-x: 12px;--vi-tag-gap: 8px;--vi-tag-remove-size: 18px;--vi-tag-dot-size: 7px;--vi-tag-avatar-size: 18px;--vi-tag-icon-size: 16px}.tag.is-disabled{opacity:var(--vi-tag-disabled-opacity);pointer-events:none;cursor:not-allowed;box-shadow:none!important;transform:none!important}.tag-remove-btn{display:inline-flex;align-items:center;justify-content:center;width:var(--vi-tag-remove-size);height:var(--vi-tag-remove-size);min-width:var(--vi-tag-remove-size);padding:0;border-radius:50%;margin-inline-start:2px;margin-inline-end:0;cursor:pointer;background:transparent;border:none;color:inherit;transition:var(--vi-tag-transition);flex-shrink:0;line-height:1}.tag-remove-btn:hover{background-color:#0000001f}.tag-remove-btn:active{transform:scale(.92)}}:host{display:inline-flex;vertical-align:middle;margin-inline-end:var(--vi-tag-margin-end, 6px);margin-block:var(--vi-tag-margin-block, 2px);outline:none}:host([disabled]){cursor:not-allowed;pointer-events:none}::slotted(vi-icon),::slotted(svg){display:block}::slotted(img){display:block;width:14px;height:14px;border-radius:50%;object-fit:cover}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}";
27
-
28
- function applyDecs2203RFactory$1() {
29
- function createAddInitializerMethod(initializers, decoratorFinishedRef) {
30
- return function addInitializer(initializer) {
31
- assertNotFinished(decoratorFinishedRef, "addInitializer");
32
- assertCallable(initializer, "An initializer");
33
- initializers.push(initializer);
34
- };
35
- }
36
- function memberDec(dec, name, desc, initializers, kind, isStatic, isPrivate, metadata, value) {
37
- var kindStr;
38
- switch(kind){
39
- case 1:
40
- kindStr = "accessor";
41
- break;
42
- case 2:
43
- kindStr = "method";
44
- break;
45
- case 3:
46
- kindStr = "getter";
47
- break;
48
- case 4:
49
- kindStr = "setter";
50
- break;
51
- default:
52
- kindStr = "field";
53
- }
54
- var ctx = {
55
- kind: kindStr,
56
- name: isPrivate ? "#" + name : name,
57
- static: isStatic,
58
- private: isPrivate,
59
- metadata: metadata
60
- };
61
- var decoratorFinishedRef = {
62
- v: false
63
- };
64
- ctx.addInitializer = createAddInitializerMethod(initializers, decoratorFinishedRef);
65
- var get, set;
66
- if (kind === 0) {
67
- if (isPrivate) {
68
- get = desc.get;
69
- set = desc.set;
70
- } else {
71
- get = function() {
72
- return this[name];
73
- };
74
- set = function(v) {
75
- this[name] = v;
76
- };
77
- }
78
- } else if (kind === 2) {
79
- get = function() {
80
- return desc.value;
81
- };
82
- } else {
83
- if (kind === 1 || kind === 3) {
84
- get = function() {
85
- return desc.get.call(this);
86
- };
87
- }
88
- if (kind === 1 || kind === 4) {
89
- set = function(v) {
90
- desc.set.call(this, v);
91
- };
92
- }
93
- }
94
- ctx.access = get && set ? {
95
- get: get,
96
- set: set
97
- } : get ? {
98
- get: get
99
- } : {
100
- set: set
101
- };
102
- try {
103
- return dec(value, ctx);
104
- } finally{
105
- decoratorFinishedRef.v = true;
106
- }
107
- }
108
- function assertNotFinished(decoratorFinishedRef, fnName) {
109
- if (decoratorFinishedRef.v) {
110
- throw new Error("attempted to call " + fnName + " after decoration was finished");
111
- }
112
- }
113
- function assertCallable(fn, hint) {
114
- if (typeof fn !== "function") {
115
- throw new TypeError(hint + " must be a function");
116
- }
117
- }
118
- function assertValidReturnValue(kind, value) {
119
- var type = typeof value;
120
- if (kind === 1) {
121
- if (type !== "object" || value === null) {
122
- throw new TypeError("accessor decorators must return an object with get, set, or init properties or void 0");
123
- }
124
- if (value.get !== undefined) {
125
- assertCallable(value.get, "accessor.get");
126
- }
127
- if (value.set !== undefined) {
128
- assertCallable(value.set, "accessor.set");
129
- }
130
- if (value.init !== undefined) {
131
- assertCallable(value.init, "accessor.init");
132
- }
133
- } else if (type !== "function") {
134
- var hint;
135
- if (kind === 0) {
136
- hint = "field";
137
- } else if (kind === 10) {
138
- hint = "class";
139
- } else {
140
- hint = "method";
141
- }
142
- throw new TypeError(hint + " decorators must return a function or void 0");
143
- }
144
- }
145
- function applyMemberDec(ret, base, decInfo, name, kind, isStatic, isPrivate, initializers, metadata) {
146
- var decs = decInfo[0];
147
- var desc, init, value;
148
- if (isPrivate) {
149
- if (kind === 0 || kind === 1) {
150
- desc = {
151
- get: decInfo[3],
152
- set: decInfo[4]
153
- };
154
- } else if (kind === 3) {
155
- desc = {
156
- get: decInfo[3]
157
- };
158
- } else if (kind === 4) {
159
- desc = {
160
- set: decInfo[3]
161
- };
162
- } else {
163
- desc = {
164
- value: decInfo[3]
165
- };
166
- }
167
- } else if (kind !== 0) {
168
- desc = Object.getOwnPropertyDescriptor(base, name);
169
- }
170
- if (kind === 1) {
171
- value = {
172
- get: desc.get,
173
- set: desc.set
174
- };
175
- } else if (kind === 2) {
176
- value = desc.value;
177
- } else if (kind === 3) {
178
- value = desc.get;
179
- } else if (kind === 4) {
180
- value = desc.set;
181
- }
182
- var newValue, get, set;
183
- if (typeof decs === "function") {
184
- newValue = memberDec(decs, name, desc, initializers, kind, isStatic, isPrivate, metadata, value);
185
- if (newValue !== void 0) {
186
- assertValidReturnValue(kind, newValue);
187
- if (kind === 0) {
188
- init = newValue;
189
- } else if (kind === 1) {
190
- init = newValue.init;
191
- get = newValue.get || value.get;
192
- set = newValue.set || value.set;
193
- value = {
194
- get: get,
195
- set: set
196
- };
197
- } else {
198
- value = newValue;
199
- }
200
- }
201
- } else {
202
- for(var i = decs.length - 1; i >= 0; i--){
203
- var dec = decs[i];
204
- newValue = memberDec(dec, name, desc, initializers, kind, isStatic, isPrivate, metadata, value);
205
- if (newValue !== void 0) {
206
- assertValidReturnValue(kind, newValue);
207
- var newInit;
208
- if (kind === 0) {
209
- newInit = newValue;
210
- } else if (kind === 1) {
211
- newInit = newValue.init;
212
- get = newValue.get || value.get;
213
- set = newValue.set || value.set;
214
- value = {
215
- get: get,
216
- set: set
217
- };
218
- } else {
219
- value = newValue;
220
- }
221
- if (newInit !== void 0) {
222
- if (init === void 0) {
223
- init = newInit;
224
- } else if (typeof init === "function") {
225
- init = [
226
- init,
227
- newInit
228
- ];
229
- } else {
230
- init.push(newInit);
231
- }
232
- }
233
- }
234
- }
235
- }
236
- if (kind === 0 || kind === 1) {
237
- if (init === void 0) {
238
- init = function(instance, init) {
239
- return init;
240
- };
241
- } else if (typeof init !== "function") {
242
- var ownInitializers = init;
243
- init = function(instance, init) {
244
- var value = init;
245
- for(var i = 0; i < ownInitializers.length; i++){
246
- value = ownInitializers[i].call(instance, value);
247
- }
248
- return value;
249
- };
250
- } else {
251
- var originalInitializer = init;
252
- init = function(instance, init) {
253
- return originalInitializer.call(instance, init);
254
- };
255
- }
256
- ret.push(init);
257
- }
258
- if (kind !== 0) {
259
- if (kind === 1) {
260
- desc.get = value.get;
261
- desc.set = value.set;
262
- } else if (kind === 2) {
263
- desc.value = value;
264
- } else if (kind === 3) {
265
- desc.get = value;
266
- } else if (kind === 4) {
267
- desc.set = value;
268
- }
269
- if (isPrivate) {
270
- if (kind === 1) {
271
- ret.push(function(instance, args) {
272
- return value.get.call(instance, args);
273
- });
274
- ret.push(function(instance, args) {
275
- return value.set.call(instance, args);
276
- });
277
- } else if (kind === 2) {
278
- ret.push(value);
279
- } else {
280
- ret.push(function(instance, args) {
281
- return value.call(instance, args);
282
- });
283
- }
284
- } else {
285
- Object.defineProperty(base, name, desc);
286
- }
287
- }
288
- }
289
- function applyMemberDecs(Class, decInfos, metadata) {
290
- var ret = [];
291
- var protoInitializers;
292
- var staticInitializers;
293
- var existingProtoNonFields = new Map();
294
- var existingStaticNonFields = new Map();
295
- for(var i = 0; i < decInfos.length; i++){
296
- var decInfo = decInfos[i];
297
- if (!Array.isArray(decInfo)) continue;
298
- var kind = decInfo[1];
299
- var name = decInfo[2];
300
- var isPrivate = decInfo.length > 3;
301
- var isStatic = kind >= 5;
302
- var base;
303
- var initializers;
304
- if (isStatic) {
305
- base = Class;
306
- kind = kind - 5;
307
- staticInitializers = staticInitializers || [];
308
- initializers = staticInitializers;
309
- } else {
310
- base = Class.prototype;
311
- protoInitializers = protoInitializers || [];
312
- initializers = protoInitializers;
313
- }
314
- if (kind !== 0 && !isPrivate) {
315
- var existingNonFields = isStatic ? existingStaticNonFields : existingProtoNonFields;
316
- var existingKind = existingNonFields.get(name) || 0;
317
- if (existingKind === true || existingKind === 3 && kind !== 4 || existingKind === 4 && kind !== 3) {
318
- throw new Error("Attempted to decorate a public method/accessor that has the same name as a previously decorated public method/accessor. This is not currently supported by the decorators plugin. Property name was: " + name);
319
- } else if (!existingKind && kind > 2) {
320
- existingNonFields.set(name, kind);
321
- } else {
322
- existingNonFields.set(name, true);
323
- }
324
- }
325
- applyMemberDec(ret, base, decInfo, name, kind, isStatic, isPrivate, initializers, metadata);
326
- }
327
- pushInitializers(ret, protoInitializers);
328
- pushInitializers(ret, staticInitializers);
329
- return ret;
330
- }
331
- function pushInitializers(ret, initializers) {
332
- if (initializers) {
333
- ret.push(function(instance) {
334
- for(var i = 0; i < initializers.length; i++){
335
- initializers[i].call(instance);
336
- }
337
- return instance;
338
- });
339
- }
340
- }
341
- function applyClassDecs(targetClass, classDecs, metadata) {
342
- if (classDecs.length > 0) {
343
- var initializers = [];
344
- var newClass = targetClass;
345
- var name = targetClass.name;
346
- for(var i = classDecs.length - 1; i >= 0; i--){
347
- var decoratorFinishedRef = {
348
- v: false
349
- };
350
- try {
351
- var nextNewClass = classDecs[i](newClass, {
352
- kind: "class",
353
- name: name,
354
- addInitializer: createAddInitializerMethod(initializers, decoratorFinishedRef),
355
- metadata
356
- });
357
- } finally{
358
- decoratorFinishedRef.v = true;
359
- }
360
- if (nextNewClass !== undefined) {
361
- assertValidReturnValue(10, nextNewClass);
362
- newClass = nextNewClass;
363
- }
364
- }
365
- return [
366
- defineMetadata(newClass, metadata),
367
- function() {
368
- for(var i = 0; i < initializers.length; i++){
369
- initializers[i].call(newClass);
370
- }
371
- }
372
- ];
373
- }
374
- }
375
- function defineMetadata(Class, metadata) {
376
- return Object.defineProperty(Class, Symbol.metadata || Symbol.for("Symbol.metadata"), {
377
- configurable: true,
378
- enumerable: true,
379
- value: metadata
380
- });
381
- }
382
- return function applyDecs2203R(targetClass, memberDecs, classDecs, parentClass) {
383
- if (parentClass !== void 0) {
384
- var parentMetadata = parentClass[Symbol.metadata || Symbol.for("Symbol.metadata")];
385
- }
386
- var metadata = Object.create(parentMetadata === void 0 ? null : parentMetadata);
387
- var e = applyMemberDecs(targetClass, memberDecs, metadata);
388
- if (!classDecs.length) defineMetadata(targetClass, metadata);
389
- return {
390
- e: e,
391
- get c () {
392
- return applyClassDecs(targetClass, classDecs, metadata);
393
- }
394
- };
395
- };
396
- }
397
- function _apply_decs_2203_r$1(targetClass, memberDecs, classDecs, parentClass) {
398
- return (_apply_decs_2203_r$1 = applyDecs2203RFactory$1())(targetClass, memberDecs, classDecs, parentClass);
399
- }
400
- function _identity$1(x) {
401
- return x;
402
- }
403
- var _dec$1, _initClass$1, _ViElement, _dec1$1, _dec2$1, _dec3$1, _dec4$1, _dec5$1, _dec6$1, _dec7$1, _dec8$1, _dec9$1, _dec10, /** Colour variant */ _init_variant, /** Visual appearance mode */ _init_appearance, /** Size scale */ _init_size$1, /** Fully rounded pill shape (9999px radius) */ _init_pill, /** Status dot indicator prefix */ _init_dot, /** Suffix count badge value */ _init_count, /** Show remove button */ _init_removable, /** Interactive selectable filter mode */ _init_selectable, /** Selected/active state */ _init_selected, /** Disable interactions */ _init_disabled$1, _initProto$1;
404
- let _ViTag;
405
- _dec$1 = customElement('vi-tag'), _dec1$1 = property({
406
- type: String,
407
- reflect: true
408
- }), _dec2$1 = property({
409
- type: String,
410
- reflect: true
411
- }), _dec3$1 = property({
412
- type: String,
413
- reflect: true
414
- }), _dec4$1 = property({
415
- type: Boolean,
416
- reflect: true
417
- }), _dec5$1 = property({
418
- type: Boolean,
419
- reflect: true
420
- }), _dec6$1 = property({
421
- type: Number
422
- }), _dec7$1 = property({
423
- type: Boolean
424
- }), _dec8$1 = property({
425
- type: Boolean,
426
- reflect: true
427
- }), _dec9$1 = property({
428
- type: Boolean,
429
- reflect: true
430
- }), _dec10 = property({
431
- type: Boolean,
432
- reflect: true
433
- });
434
- new class extends _identity$1 {
435
- constructor(){
436
- super(_ViTag), _initClass$1();
437
- }
438
- static{
439
- class ViTag extends (_ViElement = ViElement) {
440
- static{
441
- ({ e: [_init_variant, _init_appearance, _init_size$1, _init_pill, _init_dot, _init_count, _init_removable, _init_selectable, _init_selected, _init_disabled$1, _initProto$1], c: [_ViTag, _initClass$1] } = _apply_decs_2203_r$1(this, [
442
- [
443
- _dec1$1,
444
- 1,
445
- "variant"
446
- ],
447
- [
448
- _dec2$1,
449
- 1,
450
- "appearance"
451
- ],
452
- [
453
- _dec3$1,
454
- 1,
455
- "size"
456
- ],
457
- [
458
- _dec4$1,
459
- 1,
460
- "pill"
461
- ],
462
- [
463
- _dec5$1,
464
- 1,
465
- "dot"
466
- ],
467
- [
468
- _dec6$1,
469
- 1,
470
- "count"
471
- ],
472
- [
473
- _dec7$1,
474
- 1,
475
- "removable"
476
- ],
477
- [
478
- _dec8$1,
479
- 1,
480
- "selectable"
481
- ],
482
- [
483
- _dec9$1,
484
- 1,
485
- "selected"
486
- ],
487
- [
488
- _dec10,
489
- 1,
490
- "disabled"
491
- ]
492
- ], [
493
- _dec$1
494
- ], _ViElement));
495
- }
496
- static styles = css`
497
- ${unsafeCSS(tagStyles)}
498
- `;
499
- #___private_variant_1 = (_initProto$1(this), _init_variant(this, 'neutral'));
500
- get variant() {
501
- return this.#___private_variant_1;
502
- }
503
- set variant(_v) {
504
- this.#___private_variant_1 = _v;
505
- }
506
- #___private_appearance_2 = _init_appearance(this, 'subtle');
507
- get appearance() {
508
- return this.#___private_appearance_2;
509
- }
510
- set appearance(_v) {
511
- this.#___private_appearance_2 = _v;
512
- }
513
- #___private_size_3 = _init_size$1(this, 'md');
514
- get size() {
515
- return this.#___private_size_3;
516
- }
517
- set size(_v) {
518
- this.#___private_size_3 = _v;
519
- }
520
- #___private_pill_4 = _init_pill(this, false);
521
- get pill() {
522
- return this.#___private_pill_4;
523
- }
524
- set pill(_v) {
525
- this.#___private_pill_4 = _v;
526
- }
527
- #___private_dot_5 = _init_dot(this, false);
528
- get dot() {
529
- return this.#___private_dot_5;
530
- }
531
- set dot(_v) {
532
- this.#___private_dot_5 = _v;
533
- }
534
- #___private_count_6 = _init_count(this, undefined);
535
- get count() {
536
- return this.#___private_count_6;
537
- }
538
- set count(_v) {
539
- this.#___private_count_6 = _v;
540
- }
541
- #___private_removable_7 = _init_removable(this, false);
542
- get removable() {
543
- return this.#___private_removable_7;
544
- }
545
- set removable(_v) {
546
- this.#___private_removable_7 = _v;
547
- }
548
- #___private_selectable_8 = _init_selectable(this, false);
549
- get selectable() {
550
- return this.#___private_selectable_8;
551
- }
552
- set selectable(_v) {
553
- this.#___private_selectable_8 = _v;
554
- }
555
- #___private_selected_9 = _init_selected(this, false);
556
- get selected() {
557
- return this.#___private_selected_9;
558
- }
559
- set selected(_v) {
560
- this.#___private_selected_9 = _v;
561
- }
562
- #___private_disabled_10 = _init_disabled$1(this, false);
563
- get disabled() {
564
- return this.#___private_disabled_10;
565
- }
566
- set disabled(_v) {
567
- this.#___private_disabled_10 = _v;
568
- }
569
- static _iconsRegistered = false;
570
- connectedCallback() {
571
- super.connectedCallback();
572
- if (!ViTag._iconsRegistered) {
573
- registerIcons([
574
- xIcon,
575
- checkIcon
576
- ]);
577
- ViTag._iconsRegistered = true;
578
- }
579
- if (this.closest('[role="list"]') !== null && !this.hasAttribute('role')) {
580
- this.setAttribute('role', 'listitem');
581
- }
582
- }
583
- _handleTagClick(_e) {
584
- if (this.disabled || !this.selectable) return;
585
- this.selected = !this.selected;
586
- this.dispatchEvent(new CustomEvent('vi-tag-select', {
587
- bubbles: true,
588
- composed: true,
589
- detail: {
590
- selected: this.selected
591
- }
592
- }));
593
- }
594
- _handleRemoveClick(e) {
595
- e.stopPropagation();
596
- if (this.disabled) return;
597
- this._fireRemoveEvent();
598
- }
599
- _handleKeyDown(e) {
600
- if (this.disabled) return;
601
- if (this.removable && (e.key === 'Delete' || e.key === 'Backspace')) {
602
- e.preventDefault();
603
- this._fireRemoveEvent();
604
- } else if ((e.key === 'Enter' || e.key === ' ') && this.selectable) {
605
- e.preventDefault();
606
- this._handleTagClick();
607
- }
608
- }
609
- _handleSlotChange() {
610
- this.requestUpdate();
611
- }
612
- _fireRemoveEvent() {
613
- this.dispatchEvent(new CustomEvent('vi-tag-remove', {
614
- bubbles: true,
615
- composed: true
616
- }));
617
- }
618
- get _removeLabel() {
619
- return `Remove ${this.textContent?.trim() || 'tag'}`;
620
- }
621
- render() {
622
- const isTabbable = (this.selectable || this.removable) && !this.disabled;
623
- const classes = {
624
- 'tag': true,
625
- [`variant-${this.variant}`]: true,
626
- [`appearance-${this.appearance}`]: true,
627
- [`size-${this.size}`]: true,
628
- 'tag--pill': this.pill,
629
- 'tag--removable': this.removable,
630
- 'tag-clickable': !this.disabled && this.selectable,
631
- 'tag-selected': this.selected,
632
- 'is-disabled': this.disabled
633
- };
634
- return html`
635
- <span
636
- part="tag"
637
- class=${classMap(classes)}
638
- aria-disabled=${this.disabled ? 'true' : 'false'}
639
- >
640
- <span
641
- class="tag-content-wrapper"
642
- role=${this.selectable ? 'button' : nothing}
643
- tabindex=${this.disabled ? '-1' : isTabbable ? 0 : nothing}
644
- aria-disabled=${this.disabled ? 'true' : 'false'}
645
- aria-pressed=${this.selectable ? this.selected ? 'true' : 'false' : nothing}
646
- @click=${this.selectable ? this._handleTagClick : nothing}
647
- @keydown=${this._handleKeyDown}
648
- >
649
- ${this.dot ? html`<span part="dot" class="tag-dot" aria-hidden="true"></span>` : ''}
650
- ${this.selectable && this.selected ? html`
651
- <span part="checkmark" class="tag-checkmark" aria-hidden="true">
652
- <vi-icon name="check" size="12"></vi-icon>
653
- </span>
654
- ` : ''}
655
- <span part="avatar" class="tag-avatar">
656
- <slot name="avatar"></slot>
657
- </span>
658
- <span part="icon" class="tag-icon">
659
- <slot name="icon"></slot>
660
- </span>
661
- <span part="label" class="tag-label">
662
- <slot @slotchange=${this._handleSlotChange}></slot>
663
- </span>
664
- ${this.count !== undefined ? html`<span part="count" class="tag-count">${this.count}</span>` : ''}
665
- <slot name="suffix"></slot>
666
- </span>
667
- ${this.removable ? html`
668
- <vi-button
669
- part="remove-btn"
670
- exportparts="button: remove-btn-button, icon: remove-btn-icon"
671
- class="tag-remove-btn"
672
- variant="ghost"
673
- size="xs"
674
- icon-only
675
- ?disabled=${this.disabled}
676
- @click=${this._handleRemoveClick}
677
- >
678
- <vi-icon slot="icon" name="x" size="12" aria-hidden="true"></vi-icon>
679
- <span class="sr-only">${this._removeLabel}</span>
680
- </vi-button>
681
- ` : ''}
682
- </span>
683
- `;
684
- }
685
- }
686
- }
687
- }();
688
-
689
- const switchStyles = "@charset \"UTF-8\";@layer reset,components,utilities;@layer components{.switch-wrapper{display:inline-flex;align-items:flex-start;gap:var(--vi-switch-label-gap, 8px);cursor:pointer;font-family:var(--vi-font-family-base, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif);font-size:var(--vi-switch-label-font-size, var(--vi-font-size-base, 16px));line-height:var(--vi-line-height-normal, 1.5);color:var(--vi-switch-label-color, var(--vi-text-primary, #111827));-webkit-user-select:none;user-select:none}.switch-label{flex:1 1 auto;min-width:0;word-break:break-word;overflow-wrap:break-word}.switch-input{position:absolute!important;clip-path:inset(50%)!important;overflow:hidden!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;border:0!important;white-space:nowrap!important}.switch-track{box-sizing:border-box;position:relative;width:var(--vi-switch-track-width, 44px);height:var(--vi-switch-track-height, 24px);background-color:var(--vi-switch-track-color-off, var(--vi-border-03, #e0e0e0));border-radius:var(--vi-border-radius-full, 9999px);transition:background-color var(--vi-switch-transition-duration, .15s) ease;flex-shrink:0;margin-top:calc((1em * var(--vi-line-height-normal, 1.5) - var(--vi-switch-track-height, 24px)) / 2)}.switch-thumb{position:absolute;top:50%;left:var(--vi-switch-thumb-offset, 2px);transform:translateY(-50%);width:var(--vi-switch-thumb-size, 18px);height:var(--vi-switch-thumb-size, 18px);background-color:var(--vi-switch-thumb-color, var(--vi-text-primary-inverse, #ffffff));border-radius:50%;box-shadow:var(--vi-switch-thumb-shadow, 0 1px 3px rgba(0, 0, 0, .2));transition:left var(--vi-switch-transition-duration, .15s) ease}.switch-input:checked~.switch-track{background-color:var(--vi-switch-track-color-on, var(--vi-color-primary, #3676d0))}.switch-input:checked~.switch-track .switch-thumb{left:calc(100% - var(--vi-switch-thumb-size, 18px) - var(--vi-switch-thumb-offset, 2px))}.switch-input:focus-visible~.switch-track{outline:var(--vi-border-width-base, 2px) solid var(--vi-switch-focus-ring-color, var(--vi-focus, #3676d0));outline-offset:2px;box-shadow:0 0 0 3px var(--vi-switch-focus-ring-glow, var(--vi-color-blue-200, #cee6ff))}.switch-wrapper--disabled{cursor:not-allowed;opacity:var(--vi-switch-disabled-opacity, .5)}.switch-wrapper--disabled .switch-track{background-color:var(--vi-border-03, #e0e0e0)}.switch-wrapper--disabled .switch-input:checked~.switch-track{background-color:var(--vi-text-disabled, #9e9e9e)}@media(prefers-reduced-motion:reduce){.switch-track,.switch-thumb{transition:none}}}:host{display:inline-block;outline:none}:host([disabled]){cursor:not-allowed;pointer-events:none}::slotted(*){font-family:inherit;font-size:inherit;color:inherit}:host([size=sm]){--vi-switch-track-width: 36px;--vi-switch-track-height: 20px;--vi-switch-thumb-size: 14px}:host([size=md]){--vi-switch-track-width: 44px;--vi-switch-track-height: 24px;--vi-switch-thumb-size: 18px}:host([size=lg]){--vi-switch-track-width: 52px;--vi-switch-track-height: 28px;--vi-switch-thumb-size: 22px}";
690
-
691
- function applyDecs2203RFactory() {
692
- function createAddInitializerMethod(initializers, decoratorFinishedRef) {
693
- return function addInitializer(initializer) {
694
- assertNotFinished(decoratorFinishedRef, "addInitializer");
695
- assertCallable(initializer, "An initializer");
696
- initializers.push(initializer);
697
- };
698
- }
699
- function memberDec(dec, name, desc, initializers, kind, isStatic, isPrivate, metadata, value) {
700
- var kindStr;
701
- switch(kind){
702
- case 1:
703
- kindStr = "accessor";
704
- break;
705
- case 2:
706
- kindStr = "method";
707
- break;
708
- case 3:
709
- kindStr = "getter";
710
- break;
711
- case 4:
712
- kindStr = "setter";
713
- break;
714
- default:
715
- kindStr = "field";
716
- }
717
- var ctx = {
718
- kind: kindStr,
719
- name: isPrivate ? "#" + name : name,
720
- static: isStatic,
721
- private: isPrivate,
722
- metadata: metadata
723
- };
724
- var decoratorFinishedRef = {
725
- v: false
726
- };
727
- ctx.addInitializer = createAddInitializerMethod(initializers, decoratorFinishedRef);
728
- var get, set;
729
- if (kind === 0) {
730
- if (isPrivate) {
731
- get = desc.get;
732
- set = desc.set;
733
- } else {
734
- get = function() {
735
- return this[name];
736
- };
737
- set = function(v) {
738
- this[name] = v;
739
- };
740
- }
741
- } else if (kind === 2) {
742
- get = function() {
743
- return desc.value;
744
- };
745
- } else {
746
- if (kind === 1 || kind === 3) {
747
- get = function() {
748
- return desc.get.call(this);
749
- };
750
- }
751
- if (kind === 1 || kind === 4) {
752
- set = function(v) {
753
- desc.set.call(this, v);
754
- };
755
- }
756
- }
757
- ctx.access = get && set ? {
758
- get: get,
759
- set: set
760
- } : get ? {
761
- get: get
762
- } : {
763
- set: set
764
- };
765
- try {
766
- return dec(value, ctx);
767
- } finally{
768
- decoratorFinishedRef.v = true;
769
- }
770
- }
771
- function assertNotFinished(decoratorFinishedRef, fnName) {
772
- if (decoratorFinishedRef.v) {
773
- throw new Error("attempted to call " + fnName + " after decoration was finished");
774
- }
775
- }
776
- function assertCallable(fn, hint) {
777
- if (typeof fn !== "function") {
778
- throw new TypeError(hint + " must be a function");
779
- }
780
- }
781
- function assertValidReturnValue(kind, value) {
782
- var type = typeof value;
783
- if (kind === 1) {
784
- if (type !== "object" || value === null) {
785
- throw new TypeError("accessor decorators must return an object with get, set, or init properties or void 0");
786
- }
787
- if (value.get !== undefined) {
788
- assertCallable(value.get, "accessor.get");
789
- }
790
- if (value.set !== undefined) {
791
- assertCallable(value.set, "accessor.set");
792
- }
793
- if (value.init !== undefined) {
794
- assertCallable(value.init, "accessor.init");
795
- }
796
- } else if (type !== "function") {
797
- var hint;
798
- if (kind === 0) {
799
- hint = "field";
800
- } else if (kind === 10) {
801
- hint = "class";
802
- } else {
803
- hint = "method";
804
- }
805
- throw new TypeError(hint + " decorators must return a function or void 0");
806
- }
807
- }
808
- function applyMemberDec(ret, base, decInfo, name, kind, isStatic, isPrivate, initializers, metadata) {
809
- var decs = decInfo[0];
810
- var desc, init, value;
811
- if (isPrivate) {
812
- if (kind === 0 || kind === 1) {
813
- desc = {
814
- get: decInfo[3],
815
- set: decInfo[4]
816
- };
817
- } else if (kind === 3) {
818
- desc = {
819
- get: decInfo[3]
820
- };
821
- } else if (kind === 4) {
822
- desc = {
823
- set: decInfo[3]
824
- };
825
- } else {
826
- desc = {
827
- value: decInfo[3]
828
- };
829
- }
830
- } else if (kind !== 0) {
831
- desc = Object.getOwnPropertyDescriptor(base, name);
832
- }
833
- if (kind === 1) {
834
- value = {
835
- get: desc.get,
836
- set: desc.set
837
- };
838
- } else if (kind === 2) {
839
- value = desc.value;
840
- } else if (kind === 3) {
841
- value = desc.get;
842
- } else if (kind === 4) {
843
- value = desc.set;
844
- }
845
- var newValue, get, set;
846
- if (typeof decs === "function") {
847
- newValue = memberDec(decs, name, desc, initializers, kind, isStatic, isPrivate, metadata, value);
848
- if (newValue !== void 0) {
849
- assertValidReturnValue(kind, newValue);
850
- if (kind === 0) {
851
- init = newValue;
852
- } else if (kind === 1) {
853
- init = newValue.init;
854
- get = newValue.get || value.get;
855
- set = newValue.set || value.set;
856
- value = {
857
- get: get,
858
- set: set
859
- };
860
- } else {
861
- value = newValue;
862
- }
863
- }
864
- } else {
865
- for(var i = decs.length - 1; i >= 0; i--){
866
- var dec = decs[i];
867
- newValue = memberDec(dec, name, desc, initializers, kind, isStatic, isPrivate, metadata, value);
868
- if (newValue !== void 0) {
869
- assertValidReturnValue(kind, newValue);
870
- var newInit;
871
- if (kind === 0) {
872
- newInit = newValue;
873
- } else if (kind === 1) {
874
- newInit = newValue.init;
875
- get = newValue.get || value.get;
876
- set = newValue.set || value.set;
877
- value = {
878
- get: get,
879
- set: set
880
- };
881
- } else {
882
- value = newValue;
883
- }
884
- if (newInit !== void 0) {
885
- if (init === void 0) {
886
- init = newInit;
887
- } else if (typeof init === "function") {
888
- init = [
889
- init,
890
- newInit
891
- ];
892
- } else {
893
- init.push(newInit);
894
- }
895
- }
896
- }
897
- }
898
- }
899
- if (kind === 0 || kind === 1) {
900
- if (init === void 0) {
901
- init = function(instance, init) {
902
- return init;
903
- };
904
- } else if (typeof init !== "function") {
905
- var ownInitializers = init;
906
- init = function(instance, init) {
907
- var value = init;
908
- for(var i = 0; i < ownInitializers.length; i++){
909
- value = ownInitializers[i].call(instance, value);
910
- }
911
- return value;
912
- };
913
- } else {
914
- var originalInitializer = init;
915
- init = function(instance, init) {
916
- return originalInitializer.call(instance, init);
917
- };
918
- }
919
- ret.push(init);
920
- }
921
- if (kind !== 0) {
922
- if (kind === 1) {
923
- desc.get = value.get;
924
- desc.set = value.set;
925
- } else if (kind === 2) {
926
- desc.value = value;
927
- } else if (kind === 3) {
928
- desc.get = value;
929
- } else if (kind === 4) {
930
- desc.set = value;
931
- }
932
- if (isPrivate) {
933
- if (kind === 1) {
934
- ret.push(function(instance, args) {
935
- return value.get.call(instance, args);
936
- });
937
- ret.push(function(instance, args) {
938
- return value.set.call(instance, args);
939
- });
940
- } else if (kind === 2) {
941
- ret.push(value);
942
- } else {
943
- ret.push(function(instance, args) {
944
- return value.call(instance, args);
945
- });
946
- }
947
- } else {
948
- Object.defineProperty(base, name, desc);
949
- }
950
- }
951
- }
952
- function applyMemberDecs(Class, decInfos, metadata) {
953
- var ret = [];
954
- var protoInitializers;
955
- var staticInitializers;
956
- var existingProtoNonFields = new Map();
957
- var existingStaticNonFields = new Map();
958
- for(var i = 0; i < decInfos.length; i++){
959
- var decInfo = decInfos[i];
960
- if (!Array.isArray(decInfo)) continue;
961
- var kind = decInfo[1];
962
- var name = decInfo[2];
963
- var isPrivate = decInfo.length > 3;
964
- var isStatic = kind >= 5;
965
- var base;
966
- var initializers;
967
- if (isStatic) {
968
- base = Class;
969
- kind = kind - 5;
970
- staticInitializers = staticInitializers || [];
971
- initializers = staticInitializers;
972
- } else {
973
- base = Class.prototype;
974
- protoInitializers = protoInitializers || [];
975
- initializers = protoInitializers;
976
- }
977
- if (kind !== 0 && !isPrivate) {
978
- var existingNonFields = isStatic ? existingStaticNonFields : existingProtoNonFields;
979
- var existingKind = existingNonFields.get(name) || 0;
980
- if (existingKind === true || existingKind === 3 && kind !== 4 || existingKind === 4 && kind !== 3) {
981
- throw new Error("Attempted to decorate a public method/accessor that has the same name as a previously decorated public method/accessor. This is not currently supported by the decorators plugin. Property name was: " + name);
982
- } else if (!existingKind && kind > 2) {
983
- existingNonFields.set(name, kind);
984
- } else {
985
- existingNonFields.set(name, true);
986
- }
987
- }
988
- applyMemberDec(ret, base, decInfo, name, kind, isStatic, isPrivate, initializers, metadata);
989
- }
990
- pushInitializers(ret, protoInitializers);
991
- pushInitializers(ret, staticInitializers);
992
- return ret;
993
- }
994
- function pushInitializers(ret, initializers) {
995
- if (initializers) {
996
- ret.push(function(instance) {
997
- for(var i = 0; i < initializers.length; i++){
998
- initializers[i].call(instance);
999
- }
1000
- return instance;
1001
- });
1002
- }
1003
- }
1004
- function applyClassDecs(targetClass, classDecs, metadata) {
1005
- if (classDecs.length > 0) {
1006
- var initializers = [];
1007
- var newClass = targetClass;
1008
- var name = targetClass.name;
1009
- for(var i = classDecs.length - 1; i >= 0; i--){
1010
- var decoratorFinishedRef = {
1011
- v: false
1012
- };
1013
- try {
1014
- var nextNewClass = classDecs[i](newClass, {
1015
- kind: "class",
1016
- name: name,
1017
- addInitializer: createAddInitializerMethod(initializers, decoratorFinishedRef),
1018
- metadata
1019
- });
1020
- } finally{
1021
- decoratorFinishedRef.v = true;
1022
- }
1023
- if (nextNewClass !== undefined) {
1024
- assertValidReturnValue(10, nextNewClass);
1025
- newClass = nextNewClass;
1026
- }
1027
- }
1028
- return [
1029
- defineMetadata(newClass, metadata),
1030
- function() {
1031
- for(var i = 0; i < initializers.length; i++){
1032
- initializers[i].call(newClass);
1033
- }
1034
- }
1035
- ];
1036
- }
1037
- }
1038
- function defineMetadata(Class, metadata) {
1039
- return Object.defineProperty(Class, Symbol.metadata || Symbol.for("Symbol.metadata"), {
1040
- configurable: true,
1041
- enumerable: true,
1042
- value: metadata
1043
- });
1044
- }
1045
- return function applyDecs2203R(targetClass, memberDecs, classDecs, parentClass) {
1046
- if (parentClass !== void 0) {
1047
- var parentMetadata = parentClass[Symbol.metadata || Symbol.for("Symbol.metadata")];
1048
- }
1049
- var metadata = Object.create(parentMetadata === void 0 ? null : parentMetadata);
1050
- var e = applyMemberDecs(targetClass, memberDecs, metadata);
1051
- if (!classDecs.length) defineMetadata(targetClass, metadata);
1052
- return {
1053
- e: e,
1054
- get c () {
1055
- return applyClassDecs(targetClass, classDecs, metadata);
1056
- }
1057
- };
1058
- };
1059
- }
1060
- function _apply_decs_2203_r(targetClass, memberDecs, classDecs, parentClass) {
1061
- return (_apply_decs_2203_r = applyDecs2203RFactory())(targetClass, memberDecs, classDecs, parentClass);
1062
- }
1063
- function _identity(x) {
1064
- return x;
1065
- }
1066
- var _dec, _initClass, _ValidityMixin, _dec1, _dec2, _dec3, _dec4, _dec5, _dec6, _dec7, _dec8, _dec9, // ── ValidityMixin contract ───────────────────────────────────────────────
1067
- _init_status, _init_required, _init_validityMessage, // ── Public API ────────────────────────────────────────────────────────────
1068
- /** Checked state. */ _init_checked, /** Size scale — controls size, padding, and font-size. */ _init_size, /** Label position relative to switch. */ _init_labelPlacement, /** Form submission value when checked. */ _init_value, /** Form field name. */ _init_name, /** Disables the switch. */ _init_disabled, _initProto;
1069
- let _ViSwitch;
1070
- _dec = customElement('vi-switch'), _dec1 = property({
1071
- reflect: true
1072
- }), _dec2 = property({
1073
- type: Boolean,
1074
- reflect: true
1075
- }), _dec3 = property(), _dec4 = property({
1076
- type: Boolean,
1077
- reflect: true
1078
- }), _dec5 = property({
1079
- type: String,
1080
- reflect: true
1081
- }), _dec6 = property({
1082
- type: String,
1083
- reflect: true,
1084
- attribute: 'label-placement'
1085
- }), _dec7 = property(), _dec8 = property(), _dec9 = property({
1086
- type: Boolean,
1087
- reflect: true
1088
- });
1089
- new class extends _identity {
1090
- constructor(){
1091
- super(_ViSwitch), _initClass();
1092
- }
1093
- static{
1094
- class ViSwitch extends (_ValidityMixin = ValidityMixin(FocusableMixin(ViElement))) {
1095
- static{
1096
- ({ e: [_init_status, _init_required, _init_validityMessage, _init_checked, _init_size, _init_labelPlacement, _init_value, _init_name, _init_disabled, _initProto], c: [_ViSwitch, _initClass] } = _apply_decs_2203_r(this, [
1097
- [
1098
- _dec1,
1099
- 1,
1100
- "status"
1101
- ],
1102
- [
1103
- _dec2,
1104
- 1,
1105
- "required"
1106
- ],
1107
- [
1108
- _dec3,
1109
- 1,
1110
- "validityMessage"
1111
- ],
1112
- [
1113
- _dec4,
1114
- 1,
1115
- "checked"
1116
- ],
1117
- [
1118
- _dec5,
1119
- 1,
1120
- "size"
1121
- ],
1122
- [
1123
- _dec6,
1124
- 1,
1125
- "labelPlacement"
1126
- ],
1127
- [
1128
- _dec7,
1129
- 1,
1130
- "value"
1131
- ],
1132
- [
1133
- _dec8,
1134
- 1,
1135
- "name"
1136
- ],
1137
- [
1138
- _dec9,
1139
- 1,
1140
- "disabled"
1141
- ]
1142
- ], [
1143
- _dec
1144
- ], _ValidityMixin));
1145
- }
1146
- static styles = css`
1147
- ${unsafeCSS(switchStyles)}
1148
- `;
1149
- _initialChecked = (_initProto(this), false);
1150
- get _focusableElement() {
1151
- return this.shadowRoot?.querySelector('input') ?? null;
1152
- }
1153
- #___private_status_1 = _init_status(this, 'default');
1154
- get status() {
1155
- return this.#___private_status_1;
1156
- }
1157
- set status(_v) {
1158
- this.#___private_status_1 = _v;
1159
- }
1160
- #___private_required_2 = _init_required(this, false);
1161
- get required() {
1162
- return this.#___private_required_2;
1163
- }
1164
- set required(_v) {
1165
- this.#___private_required_2 = _v;
1166
- }
1167
- #___private_validityMessage_3 = _init_validityMessage(this, '');
1168
- get validityMessage() {
1169
- return this.#___private_validityMessage_3;
1170
- }
1171
- set validityMessage(_v) {
1172
- this.#___private_validityMessage_3 = _v;
1173
- }
1174
- #___private_checked_4 = _init_checked(this, false);
1175
- get checked() {
1176
- return this.#___private_checked_4;
1177
- }
1178
- set checked(_v) {
1179
- this.#___private_checked_4 = _v;
1180
- }
1181
- #___private_size_5 = _init_size(this, 'md');
1182
- get size() {
1183
- return this.#___private_size_5;
1184
- }
1185
- set size(_v) {
1186
- this.#___private_size_5 = _v;
1187
- }
1188
- #___private_labelPlacement_6 = _init_labelPlacement(this, 'end');
1189
- get labelPlacement() {
1190
- return this.#___private_labelPlacement_6;
1191
- }
1192
- set labelPlacement(_v) {
1193
- this.#___private_labelPlacement_6 = _v;
1194
- }
1195
- #___private_value_7 = _init_value(this, 'on');
1196
- get value() {
1197
- return this.#___private_value_7;
1198
- }
1199
- set value(_v) {
1200
- this.#___private_value_7 = _v;
1201
- }
1202
- #___private_name_8 = _init_name(this, '');
1203
- get name() {
1204
- return this.#___private_name_8;
1205
- }
1206
- set name(_v) {
1207
- this.#___private_name_8 = _v;
1208
- }
1209
- #___private_disabled_9 = _init_disabled(this, false);
1210
- get disabled() {
1211
- return this.#___private_disabled_9;
1212
- }
1213
- set disabled(_v) {
1214
- this.#___private_disabled_9 = _v;
1215
- }
1216
- // ── ValidityMixin hook ───────────────────────────────────────────────────
1217
- _testValidity() {
1218
- const input = this._focusableElement;
1219
- if (input) {
1220
- if (input.checked !== this.checked) {
1221
- input.checked = this.checked;
1222
- }
1223
- const validity = input.validity;
1224
- if (!validity.valid) {
1225
- this.validityMessage = input.validationMessage;
1226
- return {
1227
- customError: validity.customError
1228
- };
1229
- }
1230
- }
1231
- this.validityMessage = '';
1232
- return {};
1233
- }
1234
- // ── Lifecycle ──────────────────────────────────────────────────────────────
1235
- connectedCallback() {
1236
- super.connectedCallback();
1237
- this._initialChecked = this.hasAttribute('checked');
1238
- }
1239
- updated(changed) {
1240
- super.updated(changed);
1241
- // Sync form value for form submission participation
1242
- if (changed.has('checked') || changed.has('value')) {
1243
- this._internals.setFormValue(this.checked ? this.value : null);
1244
- }
1245
- // Centralize host focusability via FocusableMixin
1246
- if (changed.has('disabled')) {
1247
- this._setHostFocusable(!this.disabled);
1248
- }
1249
- }
1250
- /** Resets value and validation state when the associated form resets. */ formResetCallback() {
1251
- this.checked = this._initialChecked;
1252
- this.status = 'default';
1253
- this.validityMessage = '';
1254
- }
1255
- /** Keeps disabled in sync when a containing fieldset or form is disabled. */ formDisabledCallback(disabled) {
1256
- this.disabled = disabled;
1257
- }
1258
- // ── Event Handlers ─────────────────────────────────────────────────────────
1259
- _onChange(e) {
1260
- e.stopPropagation();
1261
- if (this.disabled) return;
1262
- const input = e.target;
1263
- this.checked = input.checked;
1264
- this.dispatchEvent(new CustomEvent('vi-switch-change', {
1265
- detail: {
1266
- checked: this.checked
1267
- },
1268
- bubbles: true,
1269
- composed: true
1270
- }));
1271
- }
1272
- // ── Render ─────────────────────────────────────────────────────────────────
1273
- render() {
1274
- const isValDisabled = this.disabled;
1275
- const inputClasses = classMap({
1276
- 'switch-input': true,
1277
- 'sr-only': true
1278
- });
1279
- const wrapperClasses = classMap({
1280
- 'switch-wrapper': true,
1281
- 'switch-wrapper--disabled': isValDisabled
1282
- });
1283
- return html`
1284
- <label class=${wrapperClasses} data-placement=${this.labelPlacement}>
1285
- ${this.labelPlacement === 'start' ? html`
1286
- <span part="label" class="switch-label"><slot></slot></span>
1287
- ` : nothing}
1288
-
1289
- <input
1290
- type="checkbox"
1291
- role="switch"
1292
- class=${inputClasses}
1293
- .name=${this.name}
1294
- .value=${this.value}
1295
- ?checked=${this.checked}
1296
- ?disabled=${isValDisabled}
1297
- aria-checked=${this.checked ? 'true' : 'false'}
1298
- @change=${this._onChange}
1299
- />
1300
- <span part="track" class="switch-track" aria-hidden="true">
1301
- <span part="thumb" class="switch-thumb"></span>
1302
- </span>
1303
-
1304
- ${this.labelPlacement === 'end' ? html`
1305
- <span part="label" class="switch-label"><slot></slot></span>
1306
- ` : nothing}
1307
- </label>
1308
- `;
1309
- }
1310
- }
1311
- }
1312
- }();
1313
-
1314
- export { ViElement, _ViSwitch as ViSwitch, _ViTag as ViTag, registerIcons };
18
+ export { ViTag } from './tag/vi-tag.js';
19
+ export { ViSwitch } from './switch/vi-switch.js';