xv-webcomponents 0.1.17 → 0.1.19
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/LICENSE +21 -21
- package/README.md +129 -129
- package/dist/types/components/xv-checkbox/xv-checkbox.d.ts +66 -2
- package/dist/types/components/xv-table/defs.d.ts +16 -0
- package/dist/types/components/xv-table/xv-table-col/xv-table-col.d.ts +3 -0
- package/dist/types/components/xv-table/xv-table-header-row/xv-table-header-row.d.ts +25 -0
- package/dist/types/components/xv-table/xv-table-row/xv-table-row.d.ts +59 -0
- package/dist/types/components/xv-table/xv-table.d.ts +40 -0
- package/dist/types/components.d.ts +342 -0
- package/dist/types/types/enum.d.ts +7 -0
- package/dist/types/utils/utils.d.ts +7 -0
- package/dist/xv-webcomponents/index-90b82796.js +3971 -0
- package/dist/xv-webcomponents/index-90b82796.js.map +1 -0
- package/dist/xv-webcomponents/index.esm.js +12 -1
- package/dist/xv-webcomponents/index.esm.js.map +1 -1
- package/dist/xv-webcomponents/utils-e6dc0550.js +17 -0
- package/dist/xv-webcomponents/utils-e6dc0550.js.map +1 -0
- package/dist/xv-webcomponents/xv-accordion-v2-item.entry.js +35 -0
- package/dist/xv-webcomponents/xv-accordion-v2-item.entry.js.map +1 -0
- package/dist/xv-webcomponents/xv-accordion-v2.entry.js +40 -0
- package/dist/xv-webcomponents/xv-accordion-v2.entry.js.map +1 -0
- package/dist/xv-webcomponents/xv-breadcrumbs-v2.entry.js +17 -0
- package/dist/xv-webcomponents/xv-breadcrumbs-v2.entry.js.map +1 -0
- package/dist/xv-webcomponents/xv-button-v2.entry.js +33 -0
- package/dist/xv-webcomponents/xv-button-v2.entry.js.map +1 -0
- package/dist/xv-webcomponents/xv-card-v2.entry.js +18 -0
- package/dist/xv-webcomponents/xv-card-v2.entry.js.map +1 -0
- package/dist/xv-webcomponents/xv-checkbox-v2.entry.js +99 -0
- package/dist/xv-webcomponents/xv-checkbox-v2.entry.js.map +1 -0
- package/dist/xv-webcomponents/xv-link-v2.entry.js +26 -0
- package/dist/xv-webcomponents/xv-link-v2.entry.js.map +1 -0
- package/dist/xv-webcomponents/xv-progress-indicator-v2-item.entry.js +19 -0
- package/dist/xv-webcomponents/xv-progress-indicator-v2-item.entry.js.map +1 -0
- package/dist/xv-webcomponents/xv-progress-indicator-v2.entry.js +39 -0
- package/dist/xv-webcomponents/xv-progress-indicator-v2.entry.js.map +1 -0
- package/dist/xv-webcomponents/xv-table-v2-col.entry.js +17 -0
- package/dist/xv-webcomponents/xv-table-v2-col.entry.js.map +1 -0
- package/dist/xv-webcomponents/xv-table-v2-header-row.entry.js +34 -0
- package/dist/xv-webcomponents/xv-table-v2-header-row.entry.js.map +1 -0
- package/dist/xv-webcomponents/xv-table-v2-row.entry.js +112 -0
- package/dist/xv-webcomponents/xv-table-v2-row.entry.js.map +1 -0
- package/dist/xv-webcomponents/xv-table-v2.entry.js +114 -0
- package/dist/xv-webcomponents/xv-table-v2.entry.js.map +1 -0
- package/dist/xv-webcomponents/xv-tag-v2.entry.js +28 -0
- package/dist/xv-webcomponents/xv-tag-v2.entry.js.map +1 -0
- package/dist/xv-webcomponents/xv-tooltip-v2.entry.js +23 -0
- package/dist/xv-webcomponents/xv-tooltip-v2.entry.js.map +1 -0
- package/dist/xv-webcomponents/xv-webcomponents.esm.js +48 -1
- package/dist/xv-webcomponents/xv-webcomponents.esm.js.map +1 -1
- package/package.json +51 -51
- package/dist/cjs/app-globals-3a1e7e63.js +0 -7
- package/dist/cjs/app-globals-3a1e7e63.js.map +0 -1
- package/dist/cjs/index-4d938647.js +0 -1483
- package/dist/cjs/index-4d938647.js.map +0 -1
- package/dist/cjs/index.cjs.js +0 -11
- package/dist/cjs/index.cjs.js.map +0 -1
- package/dist/cjs/loader.cjs.js +0 -17
- package/dist/cjs/loader.cjs.js.map +0 -1
- package/dist/cjs/utils-c7652b74.js +0 -13
- package/dist/cjs/utils-c7652b74.js.map +0 -1
- package/dist/cjs/xv-accordion-v2_10.cjs.entry.js +0 -265
- package/dist/cjs/xv-accordion-v2_10.cjs.entry.js.map +0 -1
- package/dist/cjs/xv-breadcrumbs-v2.cjs.entry.js +0 -22
- package/dist/cjs/xv-breadcrumbs-v2.cjs.entry.js.map +0 -1
- package/dist/cjs/xv-webcomponents.cjs.js +0 -27
- package/dist/cjs/xv-webcomponents.cjs.js.map +0 -1
- package/dist/collection/collection-manifest.json +0 -22
- package/dist/collection/components/xv-accordion/xv-accordion.css +0 -3
- package/dist/collection/components/xv-accordion/xv-accordion.js +0 -163
- package/dist/collection/components/xv-accordion/xv-accordion.js.map +0 -1
- package/dist/collection/components/xv-accordion-item/xv-accordion-item.css +0 -68
- package/dist/collection/components/xv-accordion-item/xv-accordion-item.js +0 -132
- package/dist/collection/components/xv-accordion-item/xv-accordion-item.js.map +0 -1
- package/dist/collection/components/xv-breadcrumbs/xv-breadcrumbs.css +0 -3
- package/dist/collection/components/xv-breadcrumbs/xv-breadcrumbs.js +0 -19
- package/dist/collection/components/xv-breadcrumbs/xv-breadcrumbs.js.map +0 -1
- package/dist/collection/components/xv-button/xv-button-v2.css +0 -153
- package/dist/collection/components/xv-button/xv-button.js +0 -138
- package/dist/collection/components/xv-button/xv-button.js.map +0 -1
- package/dist/collection/components/xv-card/xv-card.css +0 -63
- package/dist/collection/components/xv-card/xv-card.js +0 -122
- package/dist/collection/components/xv-card/xv-card.js.map +0 -1
- package/dist/collection/components/xv-checkbox/xv-checkbox.js +0 -22
- package/dist/collection/components/xv-checkbox/xv-checkbox.js.map +0 -1
- package/dist/collection/components/xv-link/xv-link.css +0 -60
- package/dist/collection/components/xv-link/xv-link.js +0 -132
- package/dist/collection/components/xv-link/xv-link.js.map +0 -1
- package/dist/collection/components/xv-progress-indicator/xv-progress-indicator.css +0 -7
- package/dist/collection/components/xv-progress-indicator/xv-progress-indicator.js +0 -70
- package/dist/collection/components/xv-progress-indicator/xv-progress-indicator.js.map +0 -1
- package/dist/collection/components/xv-progress-indicator-item/xv-progress-indicator-item.css +0 -66
- package/dist/collection/components/xv-progress-indicator-item/xv-progress-indicator-item.js +0 -47
- package/dist/collection/components/xv-progress-indicator-item/xv-progress-indicator-item.js.map +0 -1
- package/dist/collection/components/xv-tag/xv-tag.css +0 -97
- package/dist/collection/components/xv-tag/xv-tag.js +0 -158
- package/dist/collection/components/xv-tag/xv-tag.js.map +0 -1
- package/dist/collection/components/xv-tooltip/xv-tooltip.css +0 -154
- package/dist/collection/components/xv-tooltip/xv-tooltip.js +0 -70
- package/dist/collection/components/xv-tooltip/xv-tooltip.js.map +0 -1
- package/dist/collection/index.js +0 -11
- package/dist/collection/index.js.map +0 -1
- package/dist/collection/utils/utils.js +0 -7
- package/dist/collection/utils/utils.js.map +0 -1
- package/dist/esm/index-60f5a964.js +0 -1454
- package/dist/esm/index-60f5a964.js.map +0 -1
- package/dist/esm/index.js +0 -3
- package/dist/esm/index.js.map +0 -1
- package/dist/esm/loader.js +0 -13
- package/dist/esm/loader.js.map +0 -1
- package/dist/esm/utils-9bb6333b.js +0 -10
- package/dist/esm/utils-9bb6333b.js.map +0 -1
- package/dist/esm/xv-accordion-v2_10.entry.js +0 -252
- package/dist/esm/xv-accordion-v2_10.entry.js.map +0 -1
- package/dist/esm/xv-breadcrumbs-v2.entry.js +0 -18
- package/dist/esm/xv-breadcrumbs-v2.entry.js.map +0 -1
- package/dist/esm/xv-webcomponents.js +0 -22
- package/dist/esm/xv-webcomponents.js.map +0 -1
- package/dist/index.cjs.js +0 -1
- package/dist/index.js +0 -1
- package/dist/xv-webcomponents/p-08297c60.entry.js +0 -2
- package/dist/xv-webcomponents/p-08297c60.entry.js.map +0 -1
- package/dist/xv-webcomponents/p-543fe755.js +0 -3
- package/dist/xv-webcomponents/p-543fe755.js.map +0 -1
- package/dist/xv-webcomponents/p-6fe85516.entry.js +0 -2
- package/dist/xv-webcomponents/p-6fe85516.entry.js.map +0 -1
- package/dist/xv-webcomponents/p-a0b74d3c.js +0 -2
- package/dist/xv-webcomponents/p-a0b74d3c.js.map +0 -1
- package/dist/xv-webcomponents/p-e1255160.js +0 -2
- package/dist/xv-webcomponents/p-e1255160.js.map +0 -1
- /package/dist/{esm → xv-webcomponents}/app-globals-0f993ce5.js +0 -0
- /package/dist/{esm → xv-webcomponents}/app-globals-0f993ce5.js.map +0 -0
|
@@ -1,252 +0,0 @@
|
|
|
1
|
-
import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-60f5a964.js';
|
|
2
|
-
import { u as uidGenerator } from './utils-9bb6333b.js';
|
|
3
|
-
|
|
4
|
-
const xvAccordionCss = ":host{display:block}";
|
|
5
|
-
const XvAccordionV2Style0 = xvAccordionCss;
|
|
6
|
-
|
|
7
|
-
const XvAccordion = class {
|
|
8
|
-
constructor(hostRef) {
|
|
9
|
-
registerInstance(this, hostRef);
|
|
10
|
-
this.accordionChange = createEvent(this, "accordionChange", 7);
|
|
11
|
-
this.multiple = false;
|
|
12
|
-
this.xvId = uidGenerator();
|
|
13
|
-
this.opened = new Set();
|
|
14
|
-
}
|
|
15
|
-
async toggleItem(value) {
|
|
16
|
-
if (this.opened.has(value)) {
|
|
17
|
-
this.opened.delete(value);
|
|
18
|
-
}
|
|
19
|
-
else {
|
|
20
|
-
if (!this.multiple)
|
|
21
|
-
this.opened.clear();
|
|
22
|
-
this.value = value;
|
|
23
|
-
this.opened.add(this.value);
|
|
24
|
-
}
|
|
25
|
-
this.accordionChange.emit({ opened: this.opened, id: this.xvId });
|
|
26
|
-
return { opened: this.opened, id: this.xvId };
|
|
27
|
-
}
|
|
28
|
-
componentWillLoad() {
|
|
29
|
-
if (this.value) {
|
|
30
|
-
return this.toggleItem(this.value);
|
|
31
|
-
}
|
|
32
|
-
}
|
|
33
|
-
render() {
|
|
34
|
-
return (h(Host, { key: '66ebac5125b765878f7e21225f60f254bde5e07f', class: "xv-accordion", "data-id": this.xvId }, h("slot", { key: 'b5081e54395f14436a7f066fee6e75a48c9b797f' })));
|
|
35
|
-
}
|
|
36
|
-
};
|
|
37
|
-
XvAccordion.style = XvAccordionV2Style0;
|
|
38
|
-
|
|
39
|
-
const xvAccordionItemCss = ":host{border-top:1px solid var(--border-subtle-01);display:flex;flex-direction:column;font-family:var(--ff-body, inherit)}:host(.disabled) .label{color:var(--text-disabled)}:host(.disabled) .label:hover{cursor:initial;background-color:transparent}.label{padding:14px 16px;display:inline-flex;align-items:center;column-gap:20px;justify-content:space-between;text-align:left;color:var(--text-primary);font-size:14px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:0.16px;background-color:transparent;transition:background-color 200ms ease-in-out}.label>span{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical}.label:hover{cursor:pointer;background-color:var(--layer-hover-01)}.label:after{content:\"\";border:solid black;border-width:0 2px 2px 0;display:inline-block;padding:4.66px;transition:transform 100ms ease-in-out;transform:rotate(45deg)}.label.opened:after{transform:rotate(-135deg)}.content{padding:0 16px;text-align:left;color:var(--text-primary);font-size:14px;overflow:hidden;max-height:0;transition:max-height 300ms ease-in-out, padding 250ms ease 50ms}.content.opened{padding:14px 16px;max-height:500px}";
|
|
40
|
-
const XvAccordionV2ItemStyle0 = xvAccordionItemCss;
|
|
41
|
-
|
|
42
|
-
const XvAccordionItem = class {
|
|
43
|
-
constructor(hostRef) {
|
|
44
|
-
registerInstance(this, hostRef);
|
|
45
|
-
this.itemToggle = createEvent(this, "itemToggle", 7);
|
|
46
|
-
this.disabled = false;
|
|
47
|
-
this.isOpen = false;
|
|
48
|
-
}
|
|
49
|
-
handleAccordionChange(event) {
|
|
50
|
-
var _a;
|
|
51
|
-
const parentAccordionId = (_a = this.el.closest('[data-id]')) === null || _a === void 0 ? void 0 : _a.getAttribute('data-id');
|
|
52
|
-
if (event.detail.id !== parentAccordionId)
|
|
53
|
-
return;
|
|
54
|
-
this.isOpen = event.detail.opened.has(this.value);
|
|
55
|
-
}
|
|
56
|
-
toggle() {
|
|
57
|
-
var _a, _b;
|
|
58
|
-
if (this.disabled)
|
|
59
|
-
return;
|
|
60
|
-
this.isOpen = !this.isOpen;
|
|
61
|
-
(_b = (_a = this.el.closest('xv-accordion-v2')) === null || _a === void 0 ? void 0 : _a.toggleItem) === null || _b === void 0 ? void 0 : _b.call(_a, this.value);
|
|
62
|
-
}
|
|
63
|
-
render() {
|
|
64
|
-
return (h(Host, { key: '7d536c27a29b4f1e5a54ffb38c485102a4b22301', class: `${this.disabled ? 'disabled' : ''}` }, h("label", { key: 'bd35f139baa3fa9449e4391acb26ceffbeee61c4', class: `label ${this.isOpen ? 'opened' : 'closed'}`, onClick: this.toggle.bind(this) }, h("span", { key: '4b2a948ec962246557b480308e1a7df9712806a1' }, this.label)), h("div", { key: 'b88b7c9c9c724b6d6468c59df391c7ec41c99e97', class: `content ${this.isOpen ? 'opened' : 'closed'}` }, h("slot", { key: '61cb22aabcf159a31bab0a6cca01dc5478a580f1' }))));
|
|
65
|
-
}
|
|
66
|
-
get el() { return getElement(this); }
|
|
67
|
-
};
|
|
68
|
-
XvAccordionItem.style = XvAccordionV2ItemStyle0;
|
|
69
|
-
|
|
70
|
-
const xvButtonV2Css = "@charset \"UTF-8\";:host{--focus-border-width:2px;--focus-border-style:solid;--button-ghost:tarnsparent;--text-disabled-opacity:0.25;--button-border-radius:3px;--button-border-width:1px;--button-border-style:solid;--button-border-color-accent:#97BF0D;--button-border-color-primary:#273435;--button-border-color-secondary:#D1D1D1;--button-border-color-ghost:tarnsparent;--button-ghost-hover:tarnsparent;--button-ghost-active:rgba(139, 139, 139, 0.5);--button-accent-disabled:#D1D1D1;--button-primary-disabled:#D1D1D1;--button-secondary-disabled:#D1D1D1;--button-tertiary-disabled:tarnsparent;--button-ghost-disabled:tarnsparent}:host button{font-family:inherit;font-size:16px;font-weight:700;padding:0 20px;min-height:40px;line-height:40px;cursor:pointer;box-sizing:border-box;transition:background-color 0.2s ease-in-out, filter 0.2s ease-in-out, transform 0.1s ease-in-out, border-color 0.2s ease-in-out, border-width 0.2s ease-in-out, box-shadow 0.2s ease-in-out}:host button.xv-button-block{width:100%}.xv-button{}.xv-button.accent{background-color:var(--button-accent);color:var(--text-on-color);border:var(--button-border-width) var(--button-border-style) var(--button-border-color-accent);border-radius:var(--button-border-radius)}.xv-button.accent:hover{background-color:var(--button-accent-hover)}.xv-button.accent:active{background-color:var(--button-accent-active);color:var(--text-on-color)}.xv-button.accent:focus{outline:none;border:var(--focus-border-width) var(--focus-border-style) var(--focus);transition:border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out}.xv-button.accent:disabled{background-color:var(--button-accent-disabled);color:var(--text-on-color-disabled);border:var(--button-border-width) var(--button-border-style) var(--button-accent-disabled)}.xv-button.primary{background-color:var(--button-primary);color:var(--text-on-color);border:var(--button-border-width) var(--button-border-style) var(--button-border-color-primary);border-radius:var(--button-border-radius)}.xv-button.primary:hover{background-color:var(--button-primary-hover)}.xv-button.primary:active{background-color:var(--button-primary-active)}.xv-button.primary:focus{outline:none;border:var(--focus-border-width) var(--focus-border-style) var(--focus);transition:border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out}.xv-button.primary:disabled{background-color:var(--button-primary-disabled);color:var(--text-on-color-disabled);border:var(--button-border-width) var(--button-border-style) var(--button-primary-disabled)}.xv-button.secondary{background-color:var(--button-secondary);color:var(--text-primary);border:var(--button-border-width) var(--button-border-style) var(--button-border-color-secondary);border-radius:var(--button-border-radius)}.xv-button.secondary:hover{background-color:var(--button-secondary-hover)}.xv-button.secondary:active{background-color:var(--button-secondary-active)}.xv-button.secondary:focus{outline:none;border:var(--focus-border-width) var(--focus-border-style) var(--focus);transition:border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out}.xv-button.secondary:disabled{background-color:var(--button-secondary-disabled);color:var(--text-on-color-disabled)}.xv-button.tertiary{background-color:var(--button-ghost);color:var(--text-primary);border:var(--button-border-width) var(--button-border-style) var(--button-tertiary);border-radius:var(--button-border-radius)}.xv-button.tertiary:hover{background-color:var(--button-tertiary-hover)}.xv-button.tertiary:active{background-color:var(--button-tertiary-active)}.xv-button.tertiary:focus{outline:none;border:var(--focus-border-width) var(--focus-border-style) var(--focus);transition:border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out}.xv-button.tertiary:disabled{background-color:var(--button-tertiary-disabled);color:var(--text-disabled);opacity:var(--text-disabled-opacity)}.xv-button.ghost{background-color:var(--button-ghost);color:var(--text-primary);border:var(--button-border-width) var(--button-border-style) var(--button-border-color-ghost);border-radius:var(--button-border-radius)}.xv-button.ghost:hover{background-color:var(--button-ghost-hover)}.xv-button.ghost:active{background-color:var(--button-ghost-active)}.xv-button.ghost:focus{outline:none;border:var(--focus-border-width) var(--focus-border-style) var(--focus);transition:border-color 0.2s ease-in-out}.xv-button.ghost:disabled{background-color:var(--button-ghost-disabled);color:var(--text-disabled);opacity:var(--text-disabled-opacity)}";
|
|
71
|
-
const XvButtonV2Style0 = xvButtonV2Css;
|
|
72
|
-
|
|
73
|
-
const XvButton = class {
|
|
74
|
-
constructor(hostRef) {
|
|
75
|
-
registerInstance(this, hostRef);
|
|
76
|
-
this.buttonClick = createEvent(this, "buttonClick", 7);
|
|
77
|
-
/** Button label */
|
|
78
|
-
this.label = '';
|
|
79
|
-
/** Container width Button */
|
|
80
|
-
this.block = false;
|
|
81
|
-
/** Variant */
|
|
82
|
-
this.variant = 'primary';
|
|
83
|
-
/** Disabled state */
|
|
84
|
-
this.disabled = false;
|
|
85
|
-
/** Handle click only if not disabled */
|
|
86
|
-
this.handleClick = () => {
|
|
87
|
-
if (this.disabled) {
|
|
88
|
-
return;
|
|
89
|
-
}
|
|
90
|
-
this.buttonClick.emit();
|
|
91
|
-
};
|
|
92
|
-
}
|
|
93
|
-
render() {
|
|
94
|
-
return (h("button", { key: '4b6d2d71bd297a7b1e2a00ba36c8e4380395e696', class: `xv-button ${this.variant} ${this.block ? 'xv-button-block' : ''}`, disabled: this.disabled, onClick: this.handleClick }, h("slot", { key: '2934a04fa4aae539014f0a283444903dc9807888', name: "icon-left" }), h("slot", { key: '7139fa048b1f6e10f45853f7d1ff3b8cef1b9db6' }, this.label), h("slot", { key: 'ff326b3d02d3c4102f85132b890a595fcfec08d4', name: "icon-right" })));
|
|
95
|
-
}
|
|
96
|
-
};
|
|
97
|
-
XvButton.style = XvButtonV2Style0;
|
|
98
|
-
|
|
99
|
-
const xvCardCss = ":host{display:flex;flex-direction:column;border-radius:8px;border:1px solid var(--border-subtle-00);background:var(--layer-layer-02);box-shadow:0 1px 3px 1px rgba(39, 52, 53, 0.15), 0 1px 2px 0 rgba(39, 52, 53, 0.3);font-family:var(--ff-body, inherit);overflow:visible !important}:host(.xv-card_vertical){width:100% !important}:host(.xv-card_horizontal){flex-direction:row;display:flex;width:max-content}:host(.xv-card_horizontal) .xv-card_media__content,:host(.xv-card_horizontal) .xv-card_media ::slotted([slot=media]){min-height:100%;max-height:100%;max-width:160px;min-width:160px}.xv-card_content{padding:16px;display:flex;flex-direction:column;flex:1;text-align:left}.xv-card_media__content,.xv-card_media ::slotted([slot=media]){max-width:100%;min-width:100%;min-height:199px;max-height:199px;object-fit:cover;object-position:center}.xv-card_header__content,.xv-card_header ::slotted([slot=header]){margin:0 0 8px;color:var(--text-primary);font-size:16px;font-style:normal;font-weight:700;line-height:24px;letter-spacing:-0.6px}.xv-card_body{flex:1}.xv-card_body__content,.xv-card_body ::slotted([slot=body]){margin:0 0 8px;color:var(--text-secondary);font-size:14px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:-0.1px}";
|
|
100
|
-
const XvCardV2Style0 = xvCardCss;
|
|
101
|
-
|
|
102
|
-
const XvCard = class {
|
|
103
|
-
constructor(hostRef) {
|
|
104
|
-
registerInstance(this, hostRef);
|
|
105
|
-
this.variant = 'vertical';
|
|
106
|
-
}
|
|
107
|
-
render() {
|
|
108
|
-
return (h(Host, { key: '347b7aed9ce24e2e048bb4e6d0b07b23f0f60d5b', class: `xv-card xv-card_${this.variant}`, part: this.variant }, h("div", { key: '9cd9f38cfe7d93fc271907fc8435033df860c246', class: "xv-card_media" }, h("slot", { key: '35e2bae3084a0e7d26e13c0e3116daa9895ea6c1', name: "media" }, this.media && h("img", { key: '60d4305b136766e447653cb399f92ae70e3d9430', class: "xv-card_media__content", src: this.media, alt: this.header }))), h("div", { key: '3751defc0abf18997dca82ae5b5d6601c6e9f60b', class: "xv-card_content" }, h("div", { key: 'cca74475b9e5dba03c82f77851fb503a5323ce3c', class: "xv-card_header" }, h("slot", { key: '02c4e3ddfb73bd56ef8f5b44a22bfe710654171a', name: "header" }, this.header && h("p", { key: '56998aa4742cc7576a023fcbe3e0892f312805ee', class: "xv-card_header__content" }, this.header))), h("div", { key: '86da97df293ff58dbcfe0a2b7bc25c98053ac6a2', class: "xv-card_body" }, h("slot", { key: 'ff8d6dc3ef8e437d28f237c415bf43382df85f19', name: "body" }, this.body && h("p", { key: '7e8e351ac0fa2100fc7929e81cc380a4a32e7019', class: "xv-card_body__content" }, this.header))), h("div", { key: 'dc9824b523f2dbdb4f88dc05ac0e490f9b04f529', class: "xv-card_footer" }, h("slot", { key: 'ea4fbffc436ee2ef43f481be7656aad07dfc55ce', name: "footer" }, this.footer)))));
|
|
109
|
-
}
|
|
110
|
-
};
|
|
111
|
-
XvCard.style = XvCardV2Style0;
|
|
112
|
-
|
|
113
|
-
const XvCheckbox = class {
|
|
114
|
-
constructor(hostRef) {
|
|
115
|
-
registerInstance(this, hostRef);
|
|
116
|
-
}
|
|
117
|
-
applyGlobalStyles() {
|
|
118
|
-
var _a;
|
|
119
|
-
const globalStyle = document.getElementById("brand-style");
|
|
120
|
-
if (globalStyle) {
|
|
121
|
-
const styleClone = document.createElement("style");
|
|
122
|
-
styleClone.innerHTML = `@import url('${globalStyle.href}');`;
|
|
123
|
-
(_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.appendChild(styleClone);
|
|
124
|
-
}
|
|
125
|
-
}
|
|
126
|
-
componentWillLoad() {
|
|
127
|
-
this.applyGlobalStyles();
|
|
128
|
-
}
|
|
129
|
-
render() {
|
|
130
|
-
return (h("label", { key: '854b175975d81eaa3dd16ab5e5e7ecb8075da6a2', class: "checkbox-container" }, h("input", { key: '4a40abb6dcec0a634d1e2d40878e877771ffd94d', type: "checkbox" }), h("span", { key: '473ce5b6240284f96d2b9a4d759ee18182470c10', class: "checkmark" }), h("slot", { key: '664f0b742f6ee4e2d71e984031052b9e746189b9' })));
|
|
131
|
-
}
|
|
132
|
-
get el() { return getElement(this); }
|
|
133
|
-
};
|
|
134
|
-
|
|
135
|
-
const xvLinkCss = ":host{font-family:var(--ff-body, inherit)}:host(.xv-link_inline){display:inline-block}:host(.xv-link_inline) .xv-link{text-decoration-line:underline;text-decoration-style:solid;text-decoration-skip-ink:none;text-decoration-thickness:auto;text-underline-offset:auto;text-underline-position:from-font}:host(.xv-link_standalone){display:block}:host(.xv-link_standalone) .xv-link{text-decoration-line:none}.xv-link{display:inline-flex;gap:8px;align-items:center;color:var(--link-primary);font-family:var(--ff-body);font-style:normal;font-weight:400;transition:color 200ms ease-in-out}.xv-link:active{color:var(--text-primary)}.xv-link:visited{color:var(--link-visted)}.xv-link:hover{color:var(--link-primary-hover);cursor:pointer}.xv-link:disabled,.xv-link_disabled,.xv-link::part(disabled){color:var(--text-disabled);pointer-events:none;cursor:initial}.xv-link.sm{font-size:var(--fz-sm);line-height:137.5%}.xv-link.md{font-size:var(--fz-md);line-height:128.571%}.xv-link.lg{font-size:var(--fz-lg);line-height:133.333%}";
|
|
136
|
-
const XvLinkV2Style0 = xvLinkCss;
|
|
137
|
-
|
|
138
|
-
const XvLink = class {
|
|
139
|
-
constructor(hostRef) {
|
|
140
|
-
registerInstance(this, hostRef);
|
|
141
|
-
this.disabled = false;
|
|
142
|
-
this.size = 'md';
|
|
143
|
-
this.variant = 'inline';
|
|
144
|
-
}
|
|
145
|
-
preventLinkHandler(e) {
|
|
146
|
-
if (!this.disabled)
|
|
147
|
-
return;
|
|
148
|
-
e.preventDefault();
|
|
149
|
-
e.stopPropagation();
|
|
150
|
-
}
|
|
151
|
-
render() {
|
|
152
|
-
return (h(Host, { key: 'da2418a05379b0510c46ede0992a67bdc4847238', class: `xv-link_${this.variant}` }, h("a", { key: '5632ecb0da02799b43fbdcfa522243502a6c2a7a', href: this.href, onClick: this.preventLinkHandler.bind(this), class: `xv-link ${this.disabled ? 'xv-link_disabled' : ''} ${this.size}`, target: this.target }, h("slot", { key: '15efb0b41fbc63459d83ec104a972b645541cc80', name: "icon-left" }), h("slot", { key: '47aab9fa38e9d637a2b6fd838e14805602343aea' }), h("slot", { key: 'a103c85ea4c15c83045b9e52d5dcf19fdff45076', name: "icon-right" }))));
|
|
153
|
-
}
|
|
154
|
-
};
|
|
155
|
-
XvLink.style = XvLinkV2Style0;
|
|
156
|
-
|
|
157
|
-
const xvProgressIndicatorCss = ":host{display:flex;align-items:flex-start;justify-content:space-between;font-family:var(--ff-body, inherit);overflow-x:auto}";
|
|
158
|
-
const XvProgressIndicatorV2Style0 = xvProgressIndicatorCss;
|
|
159
|
-
|
|
160
|
-
const XvProgressIndicator = class {
|
|
161
|
-
constructor(hostRef) {
|
|
162
|
-
registerInstance(this, hostRef);
|
|
163
|
-
this.progress = 0;
|
|
164
|
-
}
|
|
165
|
-
// Update 'xv-progress-indicator-item' done status
|
|
166
|
-
updateChildItems() {
|
|
167
|
-
const items = this.el.children;
|
|
168
|
-
const itemsCount = this.el.childElementCount;
|
|
169
|
-
const progressPerItem = 100 / itemsCount;
|
|
170
|
-
if (!items.length || !itemsCount)
|
|
171
|
-
return;
|
|
172
|
-
Array.from(items).forEach((item, index) => {
|
|
173
|
-
const itemProgress = (index + 1) * progressPerItem;
|
|
174
|
-
const done = this.progress >= itemProgress;
|
|
175
|
-
item.setAttribute('done', done ? 'true' : 'false');
|
|
176
|
-
});
|
|
177
|
-
}
|
|
178
|
-
// Load initial done status
|
|
179
|
-
componentDidLoad() {
|
|
180
|
-
this.updateChildItems();
|
|
181
|
-
}
|
|
182
|
-
render() {
|
|
183
|
-
return (h(Host, { key: '009b89bf21bd093b84040e6ede3be78d5c402f53', class: "xv-progress-indicator" }, h("slot", { key: '8ca75f700170c5aeb2da17133080fcde7e667947' })));
|
|
184
|
-
}
|
|
185
|
-
get el() { return getElement(this); }
|
|
186
|
-
static get watchers() { return {
|
|
187
|
-
"progress": ["updateChildItems"]
|
|
188
|
-
}; }
|
|
189
|
-
};
|
|
190
|
-
XvProgressIndicator.style = XvProgressIndicatorV2Style0;
|
|
191
|
-
|
|
192
|
-
const xvProgressIndicatorItemCss = ":host(.xv-progress-indicator-item){display:flex;flex:1;flex-direction:column;align-items:center;justify-content:center;position:relative;padding:10px 16px}:host(.xv-progress-indicator-item):before{width:100%}:host(.xv-progress-indicator-item):before,:host(.xv-progress-indicator-item) .line{content:\"\";z-index:1;display:inline-block;position:absolute;top:0;left:0;right:0;height:2px;color:inherit;background-color:var(--border-subtle-01, grey)}:host(.xv-progress-indicator-item) .line{width:0;color:inherit;transition:width 250ms ease;background-color:var(--background-brand, currentColor)}:host(.xv-progress-indicator-item) .icon{display:flex;align-items:center;justify-content:center;width:22px;height:22px;max-width:22px;max-height:22px;border:2px dashed var(--icon-primary, currentColor);border-radius:50%}:host(.xv-progress-indicator-item) .icon svg{opacity:0;transition:opacity 500ms ease-in-out}:host(.xv-progress-indicator-item) .label{color:var(--text-primary);font-size:14px;font-style:normal;font-weight:400;line-height:18px;letter-spacing:0.16px}:host(.done) .icon{border-color:var(--background-brand, currentColor);color:var(--background-brand, inherit);border-style:solid}:host(.done) .icon svg{opacity:1}:host(.done) .line{width:100% !important;background-color:var(--background-brand, currentColor)}";
|
|
193
|
-
const XvProgressIndicatorV2ItemStyle0 = xvProgressIndicatorItemCss;
|
|
194
|
-
|
|
195
|
-
const XvProgressIndicatorItem = class {
|
|
196
|
-
constructor(hostRef) {
|
|
197
|
-
registerInstance(this, hostRef);
|
|
198
|
-
this.done = false;
|
|
199
|
-
}
|
|
200
|
-
render() {
|
|
201
|
-
return (h(Host, { key: 'e18a645a83758b1e6d1c1fe32e3aab8e75ff3e7b', class: `xv-progress-indicator-item ${this.done ? 'done' : ''}` }, h("span", { key: '000bfef67379218d2af3c3393432dbfc46c20707', class: "line" }), h("span", { key: 'c1056a34648ab5b55ddb56faa30f5be8ecae83cf', class: "icon" }, h("svg", { key: 'ce1d729b7464f044808577460714d279374a7e9f', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 448 512", width: 14, height: 14 }, h("path", { key: 'c67e17743357ccd75295b3d1f354e6f8096dbde8', fill: "currentColor", d: "M438.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L160 338.7 393.4 105.4c12.5-12.5 32.8-12.5 45.3 0z" }))), h("p", { key: '593c6a4c187148315cade226fc7f272462445a0e', class: "label" }, h("slot", { key: 'c3ed988d5cc8722e5bd5200646bd5c824921dd27' }))));
|
|
202
|
-
}
|
|
203
|
-
get el() { return getElement(this); }
|
|
204
|
-
};
|
|
205
|
-
XvProgressIndicatorItem.style = XvProgressIndicatorV2ItemStyle0;
|
|
206
|
-
|
|
207
|
-
const xvTagCss = "@charset \"UTF-8\";:host{display:inline-flex;align-items:center;justify-content:space-between;border-radius:1000px;background-color:var(--background);color:var(--text-primary);font-family:var(--ff-body, inherit)}:host .xv-tag_content{padding-left:8px;padding-right:8px;color:inherit;font-family:var(--ff-body);font-style:normal;font-weight:400;line-height:16px;letter-spacing:0.32px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host .xv-tag_close{box-sizing:border-box;text-decoration:none;border:none;background-color:inherit;outline:none;border-spacing:0;list-style:none outside none;margin:0;padding:0;display:inline-flex;align-items:center;justify-content:center;border-radius:62px;width:15px;height:15px;text-align:left;color:inherit;text-indent:0;transition:opacity 300ms ease-in-out, filter 300ms ease-in-out}:host .xv-tag_close:hover{cursor:pointer;filter:brightness(80%)}:host .xv-tag_close:active{opacity:0.7}:host .xv-tag_close:focus{outline:1px solid currentColor}:host .xv-tag_close:after{overflow:hidden;width:inherit;height:inherit;color:inherit;font-size:16px;display:inline-flex;align-items:center;justify-content:center;content:\"×\"}:host(.sm){font-size:var(--fz-sm)}:host(.md){font-size:var(--fz-md)}:host(.md) .xv-tag_content{line-height:24px}:host(.md) .xv-tag_close{height:24px;width:24px}:host(.lg){font-size:var(--fz-lg)}:host(.lg) .xv-tag_content{line-height:26px}:host(.lg) .xv-tag_close{height:26px;width:26px}:host(.disabled){pointer-events:none;background-color:var(--layer-01);color:var(--text-disabled)}";
|
|
208
|
-
const XvTagV2Style0 = xvTagCss;
|
|
209
|
-
|
|
210
|
-
const XvTag = class {
|
|
211
|
-
constructor(hostRef) {
|
|
212
|
-
registerInstance(this, hostRef);
|
|
213
|
-
this.closeClick = createEvent(this, "closeClick", 7);
|
|
214
|
-
this.size = 'md';
|
|
215
|
-
this.color = '';
|
|
216
|
-
this.bg = '';
|
|
217
|
-
this.disabled = false;
|
|
218
|
-
this.closeable = false;
|
|
219
|
-
}
|
|
220
|
-
closeHandler(e) {
|
|
221
|
-
if (this.disabled)
|
|
222
|
-
return;
|
|
223
|
-
this.closeClick.emit(e);
|
|
224
|
-
}
|
|
225
|
-
render() {
|
|
226
|
-
return (h(Host, { key: '429e196f85e0b46f65822519d0e363671fd60a77', style: { color: this.color, background: this.bg }, class: `xv-tag ${this.disabled ? 'disabled' : ''} ${this.size}` }, h("div", { key: 'b2b919d599e662e07fad0cc0d2e933926911aea9', class: "xv-tag_content" }, h("slot", { key: '717f8e980099bb813a12342015661e9914cc1330' })), this.closeable && (h("button", { key: '31ea0d38544c9b422fcab3dd92718de0e4005be8', onClick: this.closeHandler.bind(this), class: "xv-tag_close" }))));
|
|
227
|
-
}
|
|
228
|
-
};
|
|
229
|
-
XvTag.style = XvTagV2Style0;
|
|
230
|
-
|
|
231
|
-
const xvTooltipCss = ":host{position:relative;display:inline-block;cursor:pointer;line-height:0.5}:host::before,:host::after{position:absolute;opacity:0;visibility:hidden;transition:opacity 0.2s ease-in-out, transform 0.2s ease-in-out;z-index:10}:host::before{content:attr(tooltip);background:var(--background-inverse, #333);color:var(--icon-inverse, #fff);padding:var(--gap-sm, 5px) var(--gap-md, 16px);border-radius:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:70vw;font-family:var(--fz-body, Tahoma);font-size:var(fz-md, 14px);font-weight:400;line-height:18px;letter-spacing:0.16px}:host::after{content:\"\";border:6px solid transparent}:host(:hover)::before,:host(:hover)::after,:host(:focus)::before,:host(:focus)::after{opacity:1;visibility:visible}:host(.xv-tooltip_top)::before{bottom:100%;left:50%;transform:translateX(-50%) translateY(-5px)}:host(.xv-tooltip_top)::after{bottom:100%;left:50%;border-top-color:var(--background-inverse, #333);transform:translateX(-50%) translateY(5px)}:host(.xv-tooltip_top-left)::before{bottom:100%;left:0;transform:translateY(-5px)}:host(.xv-tooltip_top-left)::after{bottom:100%;left:10px;border-top-color:black;transform:translateY(5px)}:host(.xv-tooltip_top-right)::before{bottom:100%;right:0;transform:translateY(-5px)}:host(.xv-tooltip_top-right)::after{bottom:100%;right:10px;border-top-color:var(--background-inverse, #333);transform:translateY(5px)}:host(.xv-tooltip_bottom)::before{top:100%;left:50%;transform:translateX(-50%) translateY(5px)}:host(.xv-tooltip_bottom)::after{top:100%;left:50%;border-bottom-color:black;transform:translateX(-50%) translateY(-5px)}:host(.xv-tooltip_bottom-left)::before{top:100%;left:0;transform:translateY(5px)}:host(.xv-tooltip_bottom-left)::after{top:100%;left:10px;border-bottom-color:var(--background-inverse, #333);transform:translateY(-5px)}:host(.xv-tooltip_bottom-right)::before{top:100%;right:0;transform:translateY(5px)}:host(.xv-tooltip_bottom-right)::after{top:100%;right:10px;border-bottom-color:var(--background-inverse, #333);transform:translateY(-5px)}:host(.xv-tooltip_left)::before{right:100%;top:50%;transform:translateY(-50%) translateX(-5px)}:host(.xv-tooltip_left)::after{right:100%;top:50%;border-left-color:var(--background-inverse, #333);transform:translateY(-50%) translateX(5px)}:host(.xv-tooltip_right)::before{left:100%;top:50%;transform:translateY(-50%) translateX(5px)}:host(.xv-tooltip_right)::after{left:100%;top:50%;border-right-color:var(--background-inverse, #333);transform:translateY(-50%) translateX(-5px)}";
|
|
232
|
-
const XvTooltipV2Style0 = xvTooltipCss;
|
|
233
|
-
|
|
234
|
-
const XvTooltip = class {
|
|
235
|
-
constructor(hostRef) {
|
|
236
|
-
registerInstance(this, hostRef);
|
|
237
|
-
/**
|
|
238
|
-
* Tooltip and arrow position related to element
|
|
239
|
-
* possible options: 'top' | 'top-left' | 'top-right' | 'bottom' | 'bottom-left' | 'bottom-right' | 'left' | 'right'.
|
|
240
|
-
* By default, "top"
|
|
241
|
-
*/
|
|
242
|
-
this.position = 'top';
|
|
243
|
-
}
|
|
244
|
-
render() {
|
|
245
|
-
return (h(Host, { key: '3896748ac459f1b401b4cd59b5ff163640811dce', tooltip: this.message, class: `xv-tooltip_${this.position}` }, h("slot", { key: '458ac3f69fe0b595af5bfbf16b7b99614a84bb8c' }, h("svg", { key: '32561cbbb87adcd9ef493a81c3edfd7e9c1f71ed', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512", width: 16, height: 16 }, h("path", { key: 'cb38fdc43b099b8fa080bf8a48fb736ff2c2cf80', fill: "currentColor", d: "M256 48a208 208 0 1 1 0 416 208 208 0 1 1 0-416zm0 464A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336c-13.3 0-24 10.7-24 24s10.7 24 24 24l80 0c13.3 0 24-10.7 24-24s-10.7-24-24-24l-8 0 0-88c0-13.3-10.7-24-24-24l-48 0c-13.3 0-24 10.7-24 24s10.7 24 24 24l24 0 0 64-24 0zm40-144a32 32 0 1 0 0-64 32 32 0 1 0 0 64z" })))));
|
|
246
|
-
}
|
|
247
|
-
};
|
|
248
|
-
XvTooltip.style = XvTooltipV2Style0;
|
|
249
|
-
|
|
250
|
-
export { XvAccordion as xv_accordion_v2, XvAccordionItem as xv_accordion_v2_item, XvButton as xv_button_v2, XvCard as xv_card_v2, XvCheckbox as xv_checkbox_v2, XvLink as xv_link_v2, XvProgressIndicator as xv_progress_indicator_v2, XvProgressIndicatorItem as xv_progress_indicator_v2_item, XvTag as xv_tag_v2, XvTooltip as xv_tooltip_v2 };
|
|
251
|
-
|
|
252
|
-
//# sourceMappingURL=xv-accordion-v2_10.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"xv-accordion-v2.xv-accordion-v2-item.xv-button-v2.xv-card-v2.xv-checkbox-v2.xv-link-v2.xv-progress-indicator-v2.xv-progress-indicator-v2-item.xv-tag-v2.xv-tooltip-v2.entry.js","mappings":"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","names":[],"sources":["src/components/xv-accordion/xv-accordion.scss?tag=xv-accordion-v2&encapsulation=shadow","src/components/xv-accordion/xv-accordion.tsx","src/components/xv-accordion-item/xv-accordion-item.scss?tag=xv-accordion-v2-item&encapsulation=shadow","src/components/xv-accordion-item/xv-accordion-item.tsx","src/components/xv-button/xv-button-v2.scss?tag=xv-button-v2&encapsulation=shadow","src/components/xv-button/xv-button.tsx","src/components/xv-card/xv-card.scss?tag=xv-card-v2&encapsulation=shadow","src/components/xv-card/xv-card.tsx","src/components/xv-checkbox/xv-checkbox.tsx","src/components/xv-link/xv-link.scss?tag=xv-link-v2&encapsulation=shadow","src/components/xv-link/xv-link.tsx","src/components/xv-progress-indicator/xv-progress-indicator.scss?tag=xv-progress-indicator-v2&encapsulation=shadow","src/components/xv-progress-indicator/xv-progress-indicator.tsx","src/components/xv-progress-indicator-item/xv-progress-indicator-item.scss?tag=xv-progress-indicator-v2-item&encapsulation=shadow","src/components/xv-progress-indicator-item/xv-progress-indicator-item.tsx","src/components/xv-tag/xv-tag.scss?tag=xv-tag-v2&encapsulation=shadow","src/components/xv-tag/xv-tag.tsx","src/components/xv-tooltip/xv-tooltip.scss?tag=xv-tooltip-v2&encapsulation=shadow","src/components/xv-tooltip/xv-tooltip.tsx"],"sourcesContent":[":host {\n display: block;\n}\n","import { Component, Host, h, Event, EventEmitter, Method, State, Prop } from '@stencil/core';\nimport { uidGenerator } from '../../utils/utils';\n\n@Component({\n tag: 'xv-accordion-v2',\n styleUrl: 'xv-accordion.scss',\n shadow: true,\n})\nexport class XvAccordion {\n @Prop() multiple: boolean = false;\n @Prop() xvId: string = uidGenerator();\n @Prop({ mutable: true }) value: string;\n @State() opened: Set<string> = new Set();\n @Event() accordionChange: EventEmitter<{ opened: Set<string>, id: string }>;\n\n @Method()\n async toggleItem(value: string) {\n if (this.opened.has(value)) {\n this.opened.delete(value);\n } else {\n if (!this.multiple) this.opened.clear();\n this.value = value;\n this.opened.add(this.value);\n }\n\n this.accordionChange.emit({ opened: this.opened, id: this.xvId });\n\n return { opened: this.opened, id: this.xvId };\n }\n\n componentWillLoad() {\n if (this.value) {\n return this.toggleItem(this.value);\n }\n }\n\n render() {\n return (\n <Host class=\"xv-accordion\" data-id={this.xvId}>\n <slot />\n </Host>\n );\n }\n}\n",":host {\n border-top: 1px solid var(--border-subtle-01);\n display: flex;\n flex-direction: column;\n font-family: var(--ff-body, inherit);\n}\n\n:host(.disabled) {\n .label {\n color: var(--text-disabled);\n &:hover {\n cursor: initial;\n background-color: transparent;\n }\n }\n}\n\n.label {\n padding: 14px 16px;\n display: inline-flex;\n align-items: center;\n column-gap: 20px;\n justify-content: space-between;\n text-align: left;\n color: var(--text-primary);\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 20px;\n letter-spacing: 0.16px;\n background-color: transparent;\n transition: background-color 200ms ease-in-out;\n &>span {\n overflow: hidden;\n text-overflow: ellipsis;\n display: -webkit-box;\n -webkit-line-clamp: 1;\n -webkit-box-orient: vertical;\n }\n\n &:hover {\n cursor: pointer;\n background-color: var(--layer-hover-01);\n }\n\n &:after {\n content: '';\n border: solid black;\n border-width: 0 2px 2px 0;\n display: inline-block;\n padding: 4.66px;\n transition: transform 100ms ease-in-out;\n transform: rotate(45deg);\n }\n\n &.opened:after {\n transform: rotate(-135deg);\n }\n}\n\n.content {\n padding: 0 16px;\n text-align: left;\n color: var(--text-primary);\n font-size: 14px;\n overflow: hidden;\n max-height: 0;\n transition: max-height 300ms ease-in-out, padding 250ms ease 50ms;\n &.opened {\n padding: 14px 16px;\n max-height: 500px;\n }\n}\n","import { Component, Host, h, Element, Prop, State, Listen, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n tag: 'xv-accordion-v2-item',\n styleUrl: 'xv-accordion-item.scss',\n shadow: true,\n})\nexport class XvAccordionItem {\n @Element() el: HTMLElement;\n @Prop() disabled: boolean = false;\n @Prop() label: string;\n @Prop() value: string;\n @State() isOpen: boolean = false;\n @Event() itemToggle: EventEmitter;\n\n @Listen('accordionChange', { target: 'body' })\n handleAccordionChange(event: CustomEvent<{ opened: Set<string>, id: string }>) {\n const parentAccordionId = this.el.closest('[data-id]')?.getAttribute('data-id');\n if (event.detail.id !== parentAccordionId) return;\n this.isOpen = event.detail.opened.has(this.value);\n }\n\n toggle() {\n if (this.disabled) return;\n this.isOpen = !this.isOpen;\n this.el.closest('xv-accordion-v2')?.toggleItem?.(this.value);\n }\n\n render() {\n return (\n <Host class={`${this.disabled ? 'disabled' : ''}`}>\n <label class={`label ${this.isOpen ? 'opened' : 'closed'}`} onClick={this.toggle.bind(this)}>\n <span>{this.label}</span>\n </label>\n <div class={`content ${this.isOpen ? 'opened' : 'closed'}`}>\n <slot />\n </div>\n </Host>\n );\n }\n}\n",":host {\n --focus-border-width: 2px;\n --focus-border-style: solid;\n --button-ghost: tarnsparent;\n --text-disabled-opacity: 0.25;\n --button-border-radius: 3px;\n --button-border-width: 1px;\n --button-border-style: solid;\n --button-border-color-accent: #97BF0D;\n --button-border-color-primary: #273435;\n --button-border-color-secondary: #D1D1D1;\n --button-border-color-ghost: tarnsparent;\n --button-ghost-hover: tarnsparent;\n --button-ghost-active: rgba(139, 139, 139, 0.5);\n --button-accent-disabled: #D1D1D1;\n --button-primary-disabled: #D1D1D1;\n --button-secondary-disabled: #D1D1D1;\n --button-tertiary-disabled: tarnsparent;\n --button-ghost-disabled: tarnsparent;\n\n button {\n font-family: inherit;\n font-size: 16px;\n font-weight: 700;\n padding: 0 20px;\n min-height: 40px;\n line-height: 40px;\n cursor: pointer;\n box-sizing: border-box;\n transition:\n background-color 0.2s ease-in-out,\n filter 0.2s ease-in-out,\n transform 0.1s ease-in-out,\n border-color 0.2s ease-in-out,\n border-width 0.2s ease-in-out,\n box-shadow 0.2s ease-in-out;\n\n &.xv-button-block {\n width: 100%;\n }\n }\n}\n\n.xv-button {\n /* ✅ Accent Button */\n &.accent {\n background-color: var(--button-accent);\n color: var(--text-on-color);\n border: var(--button-border-width) var(--button-border-style) var(--button-border-color-accent);\n border-radius: var(--button-border-radius);\n &:hover {\n background-color: var(--button-accent-hover);\n }\n &:active {\n background-color: var(--button-accent-active);\n color: var(--text-on-color);\n }\n &:focus {\n outline: none;\n border: var(--focus-border-width) var(--focus-border-style) var(--focus);\n transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;\n }\n &:disabled {\n background-color: var(--button-accent-disabled);\n color: var(--text-on-color-disabled);\n border: var(--button-border-width) var(--button-border-style) var(--button-accent-disabled);\n }\n\n }\n\n /* ✅ Primary Button */\n &.primary {\n background-color: var(--button-primary);\n color: var(--text-on-color);\n border: var(--button-border-width) var(--button-border-style) var(--button-border-color-primary);\n border-radius: var(--button-border-radius);\n &:hover {\n background-color: var(--button-primary-hover)\n }\n &:active {\n background-color: var(--button-primary-active)\n }\n &:focus {\n outline: none;\n border: var(--focus-border-width) var(--focus-border-style) var(--focus);\n transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;\n }\n &:disabled {\n background-color: var(--button-primary-disabled);\n color: var(--text-on-color-disabled);\n border: var(--button-border-width) var(--button-border-style) var(--button-primary-disabled);\n }\n }\n\n /* ✅ Secondary Button */\n &.secondary {\n background-color: var(--button-secondary);\n color: var(--text-primary);\n border: var(--button-border-width) var(--button-border-style) var(--button-border-color-secondary);\n border-radius: var(--button-border-radius);\n &:hover {\n background-color: var(--button-secondary-hover);\n }\n &:active {\n background-color: var(--button-secondary-active);\n }\n &:focus {\n outline: none;\n border: var(--focus-border-width) var(--focus-border-style) var(--focus);\n transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;\n }\n &:disabled {\n background-color: var(--button-secondary-disabled);\n color: var(--text-on-color-disabled);\n }\n }\n\n /* ✅ Tertiary Button */\n &.tertiary {\n background-color: var(--button-ghost);\n color: var(--text-primary);\n border: var(--button-border-width) var(--button-border-style) var(--button-tertiary);\n border-radius: var(--button-border-radius);\n &:hover {\n background-color: var(--button-tertiary-hover);\n }\n &:active {\n background-color: var(--button-tertiary-active);\n }\n &:focus {\n outline: none;\n border: var(--focus-border-width) var(--focus-border-style) var(--focus);\n transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;\n }\n &:disabled {\n background-color: var(--button-tertiary-disabled);\n color: var(--text-disabled);\n opacity: var(--text-disabled-opacity);\n }\n }\n\n /* ✅ Ghost Button */\n &.ghost {\n background-color: var(--button-ghost);\n color: var(--text-primary);\n border: var(--button-border-width) var(--button-border-style) var(--button-border-color-ghost);\n border-radius: var(--button-border-radius);\n &:hover {\n background-color: var(--button-ghost-hover);\n }\n &:active {\n background-color: var(--button-ghost-active);\n }\n &:focus {\n outline: none;\n border: var(--focus-border-width) var(--focus-border-style) var(--focus);\n transition: border-color 0.2s ease-in-out;\n }\n &:disabled {\n background-color: var(--button-ghost-disabled);\n color: var(--text-disabled);\n opacity: var(--text-disabled-opacity);\n }\n }\n}\n","import { Component, Prop, Event, EventEmitter, h } from '@stencil/core';\r\n\r\n\r\n@Component({\r\n tag: 'xv-button-v2',\r\n styleUrl: 'xv-button-v2.scss',\r\n shadow: true,\r\n})\r\nexport class XvButton {\r\n /** Button label */\r\n @Prop() label: string = '';\r\n\r\n /** Container width Button */\r\n @Prop() block: boolean = false;\r\n\r\n /** Variant */\r\n @Prop() variant: 'accent' | 'primary' | 'secondary' | 'tertiary' | 'ghost' = 'primary';\r\n\r\n /** Disabled state */\r\n @Prop() disabled: boolean = false;\r\n\r\n /** Emits when the button is clicked */\r\n @Event() buttonClick!: EventEmitter<void>;\r\n\r\n /** Handle click only if not disabled */\r\n private handleClick = () => {\r\n if (this.disabled) {\r\n return;\r\n }\r\n this.buttonClick.emit();\r\n };\r\n\r\n render() {\r\n return (\r\n <button\r\n class={`xv-button ${this.variant} ${this.block ? 'xv-button-block' : ''}`}\r\n disabled={this.disabled}\r\n onClick={this.handleClick}\r\n >\r\n <slot name=\"icon-left\"></slot>\r\n\r\n <slot>\r\n {this.label}\r\n </slot>\r\n\r\n <slot name=\"icon-right\"></slot>\r\n </button>\r\n );\r\n }\r\n}\r\n",":host {\n display: flex;\n flex-direction: column;\n border-radius: 8px;\n border: 1px solid var(--border-subtle-00);\n background: var(--layer-layer-02);\n box-shadow: 0 1px 3px 1px rgba(39, 52, 53, 0.15), 0 1px 2px 0 rgba(39, 52, 53, 0.30);\n font-family: var(--ff-body, inherit);\n overflow: visible !important;\n}\n\n:host(.xv-card_vertical) {\n //max-width: 298px;\n // TODO: wright down correct styling for card size\n width: 100%!important;\n}\n\n:host(.xv-card_horizontal) {\n flex-direction: row;\n display: flex;\n width: max-content;\n\n .xv-card_media {\n &__content, ::slotted([slot=\"media\"]) {\n min-height: 100%;\n max-height: 100%;\n max-width: 160px;\n min-width: 160px;\n }\n }\n}\n\n.xv-card {\n &_content {\n padding: 16px;\n display: flex;\n flex-direction: column;\n flex: 1;\n text-align: left;\n }\n\n &_media {\n &__content, ::slotted([slot=\"media\"]) {\n max-width: 100%;\n min-width: 100%;\n min-height: 199px;\n max-height: 199px;\n object-fit: cover;\n object-position: center;\n }\n }\n\n &_header {\n &__content, ::slotted([slot=\"header\"]) {\n margin: 0 0 8px;\n color: var(--text-primary);\n font-size: 16px;\n font-style: normal;\n font-weight: 700;\n line-height: 24px;\n letter-spacing: -0.6px;\n }\n }\n\n &_body {\n flex: 1;\n &__content, ::slotted([slot=\"body\"]) {\n margin: 0 0 8px;\n color: var(--text-secondary);\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 20px;\n letter-spacing: -0.1px;\n }\n }\n\n &_footer {}\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n tag: 'xv-card-v2',\n styleUrl: 'xv-card.scss',\n shadow: true,\n})\nexport class XvCard {\n @Prop() variant: 'horizontal' | 'vertical' = 'vertical';\n @Prop() media: string;\n @Prop() header: string;\n @Prop() body: string;\n @Prop() footer: string;\n render() {\n return (\n <Host class={`xv-card xv-card_${this.variant}`} part={this.variant}>\n <div class=\"xv-card_media\">\n <slot name=\"media\">\n {this.media && <img class=\"xv-card_media__content\" src={this.media} alt={this.header} />}\n </slot>\n </div>\n\n <div class=\"xv-card_content\">\n <div class=\"xv-card_header\">\n <slot name=\"header\">\n {this.header && <p class=\"xv-card_header__content\">{this.header}</p>}\n </slot>\n </div>\n <div class=\"xv-card_body\">\n <slot name=\"body\">\n {this.body && <p class=\"xv-card_body__content\">{this.header}</p>}\n </slot>\n </div>\n <div class=\"xv-card_footer\">\n <slot name=\"footer\">{this.footer}</slot>\n </div>\n </div>\n </Host>\n );\n }\n}\n","import { Component, h, Element } from '@stencil/core';\n\n@Component({\n tag: 'xv-checkbox-v2',\n shadow: true, // ✅ Shadow DOM aktiviert\n})\nexport class XvCheckbox {\n @Element() el!: HTMLElement;\n\n private applyGlobalStyles() {\n const globalStyle = document.getElementById(\"brand-style\") as HTMLLinkElement;\n if (globalStyle) {\n const styleClone = document.createElement(\"style\");\n styleClone.innerHTML = `@import url('${globalStyle.href}');`;\n this.el.shadowRoot?.appendChild(styleClone);\n }\n }\n\n componentWillLoad() {\n this.applyGlobalStyles();\n }\n\n render() {\n return (\n <label class=\"checkbox-container\">\n <input type=\"checkbox\" />\n <span class=\"checkmark\"></span>\n <slot></slot>\n </label>\n );\n }\n}\n",":host {\n font-family: var(--ff-body, inherit);\n}\n\n:host(.xv-link_inline) {\n display: inline-block;\n .xv-link {\n text-decoration-line: underline;\n text-decoration-style: solid;\n text-decoration-skip-ink: none;\n text-decoration-thickness: auto;\n text-underline-offset: auto;\n text-underline-position: from-font;\n }\n}\n\n:host(.xv-link_standalone) {\n display: block;\n .xv-link {\n text-decoration-line: none;\n }\n}\n\n.xv-link {\n display: inline-flex;\n gap: 8px;\n align-items: center;\n color: var(--link-primary);\n font-family: var(--ff-body);\n font-style: normal;\n font-weight: 400;\n transition: color 200ms ease-in-out;\n\n &:active {\n color: var(--text-primary);\n }\n\n &:visited {\n color: var(--link-visted);\n }\n\n &:hover {\n color: var(--link-primary-hover);\n cursor: pointer;\n }\n\n &:disabled, &_disabled, &::part(disabled) {\n color: var(--text-disabled);\n pointer-events: none;\n cursor: initial;\n }\n\n &.sm {\n font-size: var(--fz-sm);\n line-height: 137.5%;\n }\n\n &.md {\n font-size: var(--fz-md);\n line-height: 128.571%;\n }\n\n &.lg {\n font-size: var(--fz-lg);\n line-height: 133.333%;\n }\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'xv-link-v2',\n styleUrl: 'xv-link.scss',\n shadow: true,\n})\nexport class XvLink {\n @Prop() href: string;\n @Prop() target: '_self' | '_blank' | '_parent' | '_top';\n @Prop() disabled: boolean = false;\n @Prop() size: 'sm' | 'md' | 'lg' = 'md';\n @Prop() variant: 'standalone' | 'inline' = 'inline';\n\n preventLinkHandler(e: PointerEvent) {\n if (!this.disabled) return;\n\n e.preventDefault();\n e.stopPropagation();\n }\n\n render() {\n return (\n <Host class={`xv-link_${this.variant}`}>\n <a\n href={this.href}\n onClick={this.preventLinkHandler.bind(this)}\n class={`xv-link ${this.disabled ? 'xv-link_disabled' : ''} ${this.size}`}\n target={this.target}\n >\n <slot name=\"icon-left\"></slot>\n\n <slot></slot>\n\n <slot name=\"icon-right\"></slot>\n </a>\n </Host>\n );\n }\n}\n",":host {\n display: flex;\n align-items: flex-start;\n justify-content: space-between;\n font-family: var(--ff-body, inherit);\n overflow-x: auto;\n}\n","import { Component, Host, h, Prop, Watch, Element } from '@stencil/core';\n\n@Component({\n tag: 'xv-progress-indicator-v2',\n styleUrl: 'xv-progress-indicator.scss',\n shadow: true,\n})\nexport class XvProgressIndicator {\n @Element() el: HTMLElement;\n @Prop() progress: number = 0;\n\n // Update 'xv-progress-indicator-item' done status\n @Watch('progress')\n updateChildItems() {\n const items = this.el.children;\n const itemsCount = this.el.childElementCount;\n const progressPerItem = 100 / itemsCount;\n\n if (!items.length || !itemsCount) return;\n\n Array.from(items).forEach((item, index) => {\n const itemProgress = (index + 1) * progressPerItem;\n const done = this.progress >= itemProgress;\n (item as HTMLElement).setAttribute('done', done ? 'true' : 'false');\n });\n }\n\n // Load initial done status\n componentDidLoad() {\n this.updateChildItems()\n }\n\n render() {\n return (\n <Host class=\"xv-progress-indicator\">\n <slot></slot>\n </Host>\n );\n }\n}\n",":host(.xv-progress-indicator-item) {\n display: flex;\n flex: 1;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n position: relative;\n padding: 10px 16px;\n &:before {\n width: 100%;\n }\n\n &:before, .line {\n content: '';\n z-index: 1;\n display: inline-block;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n height: 2px;\n color: inherit;\n background-color: var(--border-subtle-01, grey);\n }\n\n .line {\n width: 0;\n color: inherit;\n transition: width 250ms ease;\n background-color: var(--background-brand, currentColor);\n }\n\n .icon {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 22px;\n height: 22px;\n max-width: 22px;\n max-height: 22px;\n border: 2px dashed var(--icon-primary, currentColor);\n border-radius: 50%;\n svg {\n opacity: 0;\n transition: opacity 500ms ease-in-out;\n }\n }\n\n .label {\n color: var(--text-primary);\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 18px;\n letter-spacing: 0.16px;\n }\n}\n\n:host(.done) {\n .icon {\n border-color: var(--background-brand, currentColor);\n color: var(--background-brand, inherit);\n border-style: solid;\n svg {\n opacity: 1;\n }\n }\n\n .line {\n width: 100% !important;\n background-color: var(--background-brand, currentColor);\n }\n}\n","import { Component, Host, h, Element, Prop } from '@stencil/core';\n\n@Component({\n tag: 'xv-progress-indicator-v2-item',\n styleUrl: 'xv-progress-indicator-item.scss',\n shadow: true,\n})\nexport class XvProgressIndicatorItem {\n @Element() el: HTMLElement;\n @Prop({ reflect: false }) done: boolean = false;\n\n render() {\n return (\n <Host class={`xv-progress-indicator-item ${this.done ? 'done' : ''}`}>\n <span class=\"line\"/>\n <span class=\"icon\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 448 512\"\n width={14}\n height={14}\n >\n <path\n fill=\"currentColor\"\n d=\"M438.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L160 338.7 393.4 105.4c12.5-12.5 32.8-12.5 45.3 0z\"\n />\n </svg>\n </span>\n <p class=\"label\"><slot/></p>\n </Host>\n );\n }\n}\n",":host {\n display: inline-flex;\n align-items: center;\n justify-content: space-between;\n border-radius: 1000px;\n background-color: var(--background);\n color: var(--text-primary);\n font-family: var(--ff-body, inherit);\n\n .xv-tag_content {\n padding-left: 8px;\n padding-right: 8px;\n color: inherit;\n font-family: var(--ff-body);\n font-style: normal;\n font-weight: 400;\n line-height: 16px;\n letter-spacing: 0.32px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n .xv-tag_close {\n box-sizing: border-box;\n text-decoration: none;\n border: none;\n background-color: inherit;\n outline: none;\n border-spacing: 0;\n list-style: none outside none;\n margin: 0;\n padding: 0;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border-radius: 62px;\n width: 15px;\n height: 15px;\n text-align: left;\n color: inherit;\n text-indent: 0;\n transition: opacity 300ms ease-in-out, filter 300ms ease-in-out;\n &:hover {\n cursor: pointer;\n filter: brightness(80%);\n }\n\n &:active {\n opacity: 0.7;\n }\n\n &:focus {\n outline: 1px solid currentColor;\n }\n\n &:after {\n overflow: hidden;\n width: inherit;\n height: inherit;\n color: inherit;\n font-size: 16px;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n content: \"\\00d7\";\n }\n }\n}\n\n:host(.sm) {\n font-size: var(--fz-sm);\n}\n\n:host(.md) {\n font-size: var(--fz-md);\n .xv-tag_content {\n line-height: 24px;\n }\n\n .xv-tag_close {\n height: 24px;\n width: 24px;\n }\n}\n\n:host(.lg) {\n font-size: var(--fz-lg);\n .xv-tag_content {\n line-height: 26px;\n }\n\n .xv-tag_close {\n height: 26px;\n width: 26px;\n }\n}\n\n:host(.disabled) {\n pointer-events: none;\n background-color: var(--layer-01);\n color: var(--text-disabled);\n}\n","import { Component, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n tag: 'xv-tag-v2',\n styleUrl: 'xv-tag.scss',\n shadow: true,\n})\nexport class XvTag {\n @Prop() size: 'sm' | 'md' | 'lg' = 'md';\n @Prop() color: string = '';\n @Prop() bg: string = '';\n @Prop() disabled: boolean = false;\n @Prop() closeable: boolean = false;\n @Event() closeClick: EventEmitter<PointerEvent>;\n\n closeHandler(e: PointerEvent) {\n if (this.disabled) return;\n\n this.closeClick.emit(e);\n }\n\n render() {\n return (\n <Host\n style={{ color: this.color, background: this.bg }}\n class={`xv-tag ${this.disabled ? 'disabled' : ''} ${this.size}`}\n >\n <div class=\"xv-tag_content\">\n <slot></slot>\n </div>\n {this.closeable && (\n <button onClick={this.closeHandler.bind(this)} class=\"xv-tag_close\"></button>\n )}\n </Host>\n );\n }\n}\n",":host {\n position: relative;\n display: inline-block;\n cursor: pointer;\n line-height: 0.5;\n}\n\n/* General styles for tooltip */\n:host::before,\n:host::after {\n position: absolute;\n opacity: 0;\n visibility: hidden;\n transition: opacity 0.2s ease-in-out, transform 0.2s ease-in-out;\n z-index: 10;\n}\n\n/* Tooltip */\n:host::before {\n content: attr(tooltip);\n background: var(--background-inverse, #333);\n color: var(--icon-inverse, #fff);\n padding: var(--gap-sm, 5px) var(--gap-md, 16px);\n border-radius: 2px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n max-width: max(70vw);\n font-family: var(--fz-body, Tahoma);\n font-size: var(fz-md, 14px);\n font-weight: 400;\n line-height: 18px;\n letter-spacing: 0.16px;\n}\n\n/* Arrow */\n:host::after {\n content: \"\";\n border: 6px solid transparent;\n}\n\n/* Show Tooltip and arrow */\n:host(:hover)::before,\n:host(:hover)::after,\n:host(:focus)::before,\n:host(:focus)::after {\n opacity: 1;\n visibility: visible;\n}\n\n/* Tooltip positions */\n:host(.xv-tooltip_top)::before {\n bottom: 100%;\n left: 50%;\n transform: translateX(-50%) translateY(-5px);\n}\n:host(.xv-tooltip_top)::after {\n bottom: 100%;\n left: 50%;\n border-top-color: var(--background-inverse, #333);\n transform: translateX(-50%) translateY(5px);\n}\n\n:host(.xv-tooltip_top-left)::before {\n bottom: 100%;\n left: 0;\n transform: translateY(-5px);\n}\n:host(.xv-tooltip_top-left)::after {\n bottom: 100%;\n left: 10px;\n border-top-color: black;\n transform: translateY(5px);\n}\n\n:host(.xv-tooltip_top-right)::before {\n bottom: 100%;\n right: 0;\n transform: translateY(-5px);\n}\n:host(.xv-tooltip_top-right)::after {\n bottom: 100%;\n right: 10px;\n border-top-color: var(--background-inverse, #333);\n transform: translateY(5px);\n}\n\n:host(.xv-tooltip_bottom)::before {\n top: 100%;\n left: 50%;\n transform: translateX(-50%) translateY(5px);\n}\n:host(.xv-tooltip_bottom)::after {\n top: 100%;\n left: 50%;\n border-bottom-color: black;\n transform: translateX(-50%) translateY(-5px);\n}\n\n:host(.xv-tooltip_bottom-left)::before {\n top: 100%;\n left: 0;\n transform: translateY(5px);\n}\n:host(.xv-tooltip_bottom-left)::after {\n top: 100%;\n left: 10px;\n border-bottom-color: var(--background-inverse, #333);\n transform: translateY(-5px);\n}\n\n:host(.xv-tooltip_bottom-right)::before {\n top: 100%;\n right: 0;\n transform: translateY(5px);\n}\n:host(.xv-tooltip_bottom-right)::after {\n top: 100%;\n right: 10px;\n border-bottom-color: var(--background-inverse, #333);\n transform: translateY(-5px);\n}\n\n:host(.xv-tooltip_left)::before {\n right: 100%;\n top: 50%;\n transform: translateY(-50%) translateX(-5px);\n}\n:host(.xv-tooltip_left)::after {\n right: 100%;\n top: 50%;\n border-left-color: var(--background-inverse, #333);\n transform: translateY(-50%) translateX(5px);\n}\n\n:host(.xv-tooltip_right)::before {\n left: 100%;\n top: 50%;\n transform: translateY(-50%) translateX(5px);\n}\n:host(.xv-tooltip_right)::after {\n left: 100%;\n top: 50%;\n border-right-color: var(--background-inverse, #333);\n transform: translateY(-50%) translateX(-5px);\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n tag: 'xv-tooltip-v2',\n styleUrl: 'xv-tooltip.scss',\n shadow: true,\n})\nexport class XvTooltip {\n /** Message what will be shown for tooltip **/\n @Prop() message: string;\n /**\n * Tooltip and arrow position related to element\n * possible options: 'top' | 'top-left' | 'top-right' | 'bottom' | 'bottom-left' | 'bottom-right' | 'left' | 'right'.\n * By default, \"top\"\n */\n @Prop() position: 'top' | 'top-left' | 'top-right' | 'bottom' | 'bottom-left' | 'bottom-right' | 'left' | 'right' = 'top';\n\n render() {\n return (\n <Host tooltip={this.message} class={`xv-tooltip_${this.position}`}>\n <slot>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\" width={16} height={16}>\n <path\n fill=\"currentColor\"\n d=\"M256 48a208 208 0 1 1 0 416 208 208 0 1 1 0-416zm0 464A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336c-13.3 0-24 10.7-24 24s10.7 24 24 24l80 0c13.3 0 24-10.7 24-24s-10.7-24-24-24l-8 0 0-88c0-13.3-10.7-24-24-24l-48 0c-13.3 0-24 10.7-24 24s10.7 24 24 24l24 0 0 64-24 0zm40-144a32 32 0 1 0 0-64 32 32 0 1 0 0 64z\"\n />\n </svg>\n </slot>\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
import { r as registerInstance, h, H as Host } from './index-60f5a964.js';
|
|
2
|
-
|
|
3
|
-
const xvBreadcrumbsCss = ":host{display:block}";
|
|
4
|
-
const XvBreadcrumbsV2Style0 = xvBreadcrumbsCss;
|
|
5
|
-
|
|
6
|
-
const XvBreadcrumbs = class {
|
|
7
|
-
constructor(hostRef) {
|
|
8
|
-
registerInstance(this, hostRef);
|
|
9
|
-
}
|
|
10
|
-
render() {
|
|
11
|
-
return (h(Host, { key: '5af11f456cfed9e3a853fa3ccdcf12d2d5d5e49f' }, h("slot", { key: 'ecef5ef84a97ceefda5cbcb54e23056e2adbdf99' })));
|
|
12
|
-
}
|
|
13
|
-
};
|
|
14
|
-
XvBreadcrumbs.style = XvBreadcrumbsV2Style0;
|
|
15
|
-
|
|
16
|
-
export { XvBreadcrumbs as xv_breadcrumbs_v2 };
|
|
17
|
-
|
|
18
|
-
//# sourceMappingURL=xv-breadcrumbs-v2.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"xv-breadcrumbs-v2.entry.js","mappings":";;AAAA,MAAM,gBAAgB,GAAG,sBAAsB,CAAC;AAChD,8BAAe,gBAAgB;;MCMlB,aAAa;;;;IACxB,MAAM;QACJ,QACE,EAAC,IAAI,uDACH,8DAAa,CACR,EACP;KACH;;;;;;","names":[],"sources":["src/components/xv-breadcrumbs/xv-breadcrumbs.scss?tag=xv-breadcrumbs-v2&encapsulation=shadow","src/components/xv-breadcrumbs/xv-breadcrumbs.tsx"],"sourcesContent":[":host {\n display: block;\n}\n","import { Component, Host, h } from '@stencil/core';\n\n@Component({\n tag: 'xv-breadcrumbs-v2',\n styleUrl: 'xv-breadcrumbs.scss',\n shadow: true,\n})\nexport class XvBreadcrumbs {\n render() {\n return (\n <Host>\n <slot></slot>\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
import { p as promiseResolve, b as bootstrapLazy } from './index-60f5a964.js';
|
|
2
|
-
export { s as setNonce } from './index-60f5a964.js';
|
|
3
|
-
import { g as globalScripts } from './app-globals-0f993ce5.js';
|
|
4
|
-
|
|
5
|
-
/*
|
|
6
|
-
Stencil Client Patch Browser v4.27.1 | MIT Licensed | https://stenciljs.com
|
|
7
|
-
*/
|
|
8
|
-
var patchBrowser = () => {
|
|
9
|
-
const importMeta = import.meta.url;
|
|
10
|
-
const opts = {};
|
|
11
|
-
if (importMeta !== "") {
|
|
12
|
-
opts.resourcesUrl = new URL(".", importMeta).href;
|
|
13
|
-
}
|
|
14
|
-
return promiseResolve(opts);
|
|
15
|
-
};
|
|
16
|
-
|
|
17
|
-
patchBrowser().then(async (options) => {
|
|
18
|
-
await globalScripts();
|
|
19
|
-
return bootstrapLazy([["xv-accordion-v2_10",[[1,"xv-accordion-v2",{"multiple":[4],"xvId":[1,"xv-id"],"value":[1025],"opened":[32],"toggleItem":[64]}],[1,"xv-accordion-v2-item",{"disabled":[4],"label":[1],"value":[1],"isOpen":[32]},[[16,"accordionChange","handleAccordionChange"]]],[1,"xv-button-v2",{"label":[1],"block":[4],"variant":[1],"disabled":[4]}],[1,"xv-card-v2",{"variant":[1],"media":[1],"header":[1],"body":[1],"footer":[1]}],[1,"xv-checkbox-v2"],[1,"xv-link-v2",{"href":[1],"target":[1],"disabled":[4],"size":[1],"variant":[1]}],[1,"xv-progress-indicator-v2",{"progress":[2]},null,{"progress":["updateChildItems"]}],[1,"xv-progress-indicator-v2-item",{"done":[4]}],[1,"xv-tag-v2",{"size":[1],"color":[1],"bg":[1],"disabled":[4],"closeable":[4]}],[1,"xv-tooltip-v2",{"message":[1],"position":[1]}]]],["xv-breadcrumbs-v2",[[1,"xv-breadcrumbs-v2"]]]], options);
|
|
20
|
-
});
|
|
21
|
-
|
|
22
|
-
//# sourceMappingURL=xv-webcomponents.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"xv-webcomponents.js","mappings":";;;;AAAA;AACA;AACA;AAKA,IAAI,YAAY,GAAG,MAAM;AAUzB,EAAE,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC;AACrC,EAAE,MAAM,IAAI,GAAiE,EAAE,CAAC;AAChF,EAAE,IAAI,UAAU,KAAK,EAAE,EAAE;AACzB,IAAI,IAAI,CAAC,YAAY,GAAG,IAAI,GAAG,CAAC,GAAG,EAAE,UAAU,CAAC,CAAC,IAAI,CAAC;AACtD,GAAG;AACH,EAAE,OAAO,cAAc,CAAC,IAAI,CAAC,CAAC;AAC9B,CAAC;;ACnBD,YAAY,EAAE,CAAC,IAAI,CAAC,OAAO,OAAO,KAAK;AACvC,EAAE,MAAM,aAAa,EAAE,CAAC;AACxB,EAAE,OAAO,aAAa,CAAC,4BAA4B,EAAE,OAAO,CAAC,CAAC;AAC9D,CAAC,CAAC","names":[],"sources":["node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Browser v4.27.1 | MIT Licensed | https://stenciljs.com\n */\n\n// src/client/client-patch-browser.ts\nimport { BUILD, NAMESPACE } from \"@stencil/core/internal/app-data\";\nimport { consoleDevInfo, H, promiseResolve, win } from \"@stencil/core\";\nvar patchBrowser = () => {\n if (BUILD.isDev && !BUILD.isTesting) {\n consoleDevInfo(\"Running in development mode.\");\n }\n if (BUILD.cloneNodeFix) {\n patchCloneNodeFix(H.prototype);\n }\n const scriptElm = BUILD.scriptDataOpts ? win.document && Array.from(win.document.querySelectorAll(\"script\")).find(\n (s) => new RegExp(`/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) || s.getAttribute(\"data-stencil-namespace\") === NAMESPACE\n ) : null;\n const importMeta = import.meta.url;\n const opts = BUILD.scriptDataOpts ? (scriptElm || {})[\"data-opts\"] || {} : {};\n if (importMeta !== \"\") {\n opts.resourcesUrl = new URL(\".\", importMeta).href;\n }\n return promiseResolve(opts);\n};\nvar patchCloneNodeFix = (HTMLElementPrototype) => {\n const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n HTMLElementPrototype.cloneNode = function(deep) {\n if (this.nodeName === \"TEMPLATE\") {\n return nativeCloneNodeFn.call(this, deep);\n }\n const clonedNode = nativeCloneNodeFn.call(this, false);\n const srcChildNodes = this.childNodes;\n if (deep) {\n for (let i = 0; i < srcChildNodes.length; i++) {\n if (srcChildNodes[i].nodeType !== 2) {\n clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n }\n }\n }\n return clonedNode;\n };\n};\nexport {\n patchBrowser\n};\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(async (options) => {\n await globalScripts();\n return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"],"version":3}
|
package/dist/index.cjs.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
module.exports = require('./cjs/index.cjs.js');
|
package/dist/index.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export * from './esm/index.js';
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as t,c as o,h as e,H as r,g as a}from"./p-543fe755.js";import{u as i}from"./p-a0b74d3c.js";const s=":host{display:block}";const n=s;const c=class{constructor(e){t(this,e);this.accordionChange=o(this,"accordionChange",7);this.multiple=false;this.xvId=i();this.opened=new Set}async toggleItem(t){if(this.opened.has(t)){this.opened.delete(t)}else{if(!this.multiple)this.opened.clear();this.value=t;this.opened.add(this.value)}this.accordionChange.emit({opened:this.opened,id:this.xvId});return{opened:this.opened,id:this.xvId}}componentWillLoad(){if(this.value){return this.toggleItem(this.value)}}render(){return e(r,{key:"66ebac5125b765878f7e21225f60f254bde5e07f",class:"xv-accordion","data-id":this.xvId},e("slot",{key:"b5081e54395f14436a7f066fee6e75a48c9b797f"}))}};c.style=n;const d=':host{border-top:1px solid var(--border-subtle-01);display:flex;flex-direction:column;font-family:var(--ff-body, inherit)}:host(.disabled) .label{color:var(--text-disabled)}:host(.disabled) .label:hover{cursor:initial;background-color:transparent}.label{padding:14px 16px;display:inline-flex;align-items:center;column-gap:20px;justify-content:space-between;text-align:left;color:var(--text-primary);font-size:14px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:0.16px;background-color:transparent;transition:background-color 200ms ease-in-out}.label>span{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical}.label:hover{cursor:pointer;background-color:var(--layer-hover-01)}.label:after{content:"";border:solid black;border-width:0 2px 2px 0;display:inline-block;padding:4.66px;transition:transform 100ms ease-in-out;transform:rotate(45deg)}.label.opened:after{transform:rotate(-135deg)}.content{padding:0 16px;text-align:left;color:var(--text-primary);font-size:14px;overflow:hidden;max-height:0;transition:max-height 300ms ease-in-out, padding 250ms ease 50ms}.content.opened{padding:14px 16px;max-height:500px}';const l=d;const b=class{constructor(e){t(this,e);this.itemToggle=o(this,"itemToggle",7);this.disabled=false;this.isOpen=false}handleAccordionChange(t){var o;const e=(o=this.el.closest("[data-id]"))===null||o===void 0?void 0:o.getAttribute("data-id");if(t.detail.id!==e)return;this.isOpen=t.detail.opened.has(this.value)}toggle(){var t,o;if(this.disabled)return;this.isOpen=!this.isOpen;(o=(t=this.el.closest("xv-accordion-v2"))===null||t===void 0?void 0:t.toggleItem)===null||o===void 0?void 0:o.call(t,this.value)}render(){return e(r,{key:"7d536c27a29b4f1e5a54ffb38c485102a4b22301",class:`${this.disabled?"disabled":""}`},e("label",{key:"bd35f139baa3fa9449e4391acb26ceffbeee61c4",class:`label ${this.isOpen?"opened":"closed"}`,onClick:this.toggle.bind(this)},e("span",{key:"4b2a948ec962246557b480308e1a7df9712806a1"},this.label)),e("div",{key:"b88b7c9c9c724b6d6468c59df391c7ec41c99e97",class:`content ${this.isOpen?"opened":"closed"}`},e("slot",{key:"61cb22aabcf159a31bab0a6cca01dc5478a580f1"})))}get el(){return a(this)}};b.style=l;const h='@charset "UTF-8";:host{--focus-border-width:2px;--focus-border-style:solid;--button-ghost:tarnsparent;--text-disabled-opacity:0.25;--button-border-radius:3px;--button-border-width:1px;--button-border-style:solid;--button-border-color-accent:#97BF0D;--button-border-color-primary:#273435;--button-border-color-secondary:#D1D1D1;--button-border-color-ghost:tarnsparent;--button-ghost-hover:tarnsparent;--button-ghost-active:rgba(139, 139, 139, 0.5);--button-accent-disabled:#D1D1D1;--button-primary-disabled:#D1D1D1;--button-secondary-disabled:#D1D1D1;--button-tertiary-disabled:tarnsparent;--button-ghost-disabled:tarnsparent}:host button{font-family:inherit;font-size:16px;font-weight:700;padding:0 20px;min-height:40px;line-height:40px;cursor:pointer;box-sizing:border-box;transition:background-color 0.2s ease-in-out, filter 0.2s ease-in-out, transform 0.1s ease-in-out, border-color 0.2s ease-in-out, border-width 0.2s ease-in-out, box-shadow 0.2s ease-in-out}:host button.xv-button-block{width:100%}.xv-button{}.xv-button.accent{background-color:var(--button-accent);color:var(--text-on-color);border:var(--button-border-width) var(--button-border-style) var(--button-border-color-accent);border-radius:var(--button-border-radius)}.xv-button.accent:hover{background-color:var(--button-accent-hover)}.xv-button.accent:active{background-color:var(--button-accent-active);color:var(--text-on-color)}.xv-button.accent:focus{outline:none;border:var(--focus-border-width) var(--focus-border-style) var(--focus);transition:border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out}.xv-button.accent:disabled{background-color:var(--button-accent-disabled);color:var(--text-on-color-disabled);border:var(--button-border-width) var(--button-border-style) var(--button-accent-disabled)}.xv-button.primary{background-color:var(--button-primary);color:var(--text-on-color);border:var(--button-border-width) var(--button-border-style) var(--button-border-color-primary);border-radius:var(--button-border-radius)}.xv-button.primary:hover{background-color:var(--button-primary-hover)}.xv-button.primary:active{background-color:var(--button-primary-active)}.xv-button.primary:focus{outline:none;border:var(--focus-border-width) var(--focus-border-style) var(--focus);transition:border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out}.xv-button.primary:disabled{background-color:var(--button-primary-disabled);color:var(--text-on-color-disabled);border:var(--button-border-width) var(--button-border-style) var(--button-primary-disabled)}.xv-button.secondary{background-color:var(--button-secondary);color:var(--text-primary);border:var(--button-border-width) var(--button-border-style) var(--button-border-color-secondary);border-radius:var(--button-border-radius)}.xv-button.secondary:hover{background-color:var(--button-secondary-hover)}.xv-button.secondary:active{background-color:var(--button-secondary-active)}.xv-button.secondary:focus{outline:none;border:var(--focus-border-width) var(--focus-border-style) var(--focus);transition:border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out}.xv-button.secondary:disabled{background-color:var(--button-secondary-disabled);color:var(--text-on-color-disabled)}.xv-button.tertiary{background-color:var(--button-ghost);color:var(--text-primary);border:var(--button-border-width) var(--button-border-style) var(--button-tertiary);border-radius:var(--button-border-radius)}.xv-button.tertiary:hover{background-color:var(--button-tertiary-hover)}.xv-button.tertiary:active{background-color:var(--button-tertiary-active)}.xv-button.tertiary:focus{outline:none;border:var(--focus-border-width) var(--focus-border-style) var(--focus);transition:border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out}.xv-button.tertiary:disabled{background-color:var(--button-tertiary-disabled);color:var(--text-disabled);opacity:var(--text-disabled-opacity)}.xv-button.ghost{background-color:var(--button-ghost);color:var(--text-primary);border:var(--button-border-width) var(--button-border-style) var(--button-border-color-ghost);border-radius:var(--button-border-radius)}.xv-button.ghost:hover{background-color:var(--button-ghost-hover)}.xv-button.ghost:active{background-color:var(--button-ghost-active)}.xv-button.ghost:focus{outline:none;border:var(--focus-border-width) var(--focus-border-style) var(--focus);transition:border-color 0.2s ease-in-out}.xv-button.ghost:disabled{background-color:var(--button-ghost-disabled);color:var(--text-disabled);opacity:var(--text-disabled-opacity)}';const f=h;const v=class{constructor(e){t(this,e);this.buttonClick=o(this,"buttonClick",7);this.label="";this.block=false;this.variant="primary";this.disabled=false;this.handleClick=()=>{if(this.disabled){return}this.buttonClick.emit()}}render(){return e("button",{key:"4b6d2d71bd297a7b1e2a00ba36c8e4380395e696",class:`xv-button ${this.variant} ${this.block?"xv-button-block":""}`,disabled:this.disabled,onClick:this.handleClick},e("slot",{key:"2934a04fa4aae539014f0a283444903dc9807888",name:"icon-left"}),e("slot",{key:"7139fa048b1f6e10f45853f7d1ff3b8cef1b9db6"},this.label),e("slot",{key:"ff326b3d02d3c4102f85132b890a595fcfec08d4",name:"icon-right"}))}};v.style=f;const x=":host{display:flex;flex-direction:column;border-radius:8px;border:1px solid var(--border-subtle-00);background:var(--layer-layer-02);box-shadow:0 1px 3px 1px rgba(39, 52, 53, 0.15), 0 1px 2px 0 rgba(39, 52, 53, 0.3);font-family:var(--ff-body, inherit);overflow:visible !important}:host(.xv-card_vertical){width:100% !important}:host(.xv-card_horizontal){flex-direction:row;display:flex;width:max-content}:host(.xv-card_horizontal) .xv-card_media__content,:host(.xv-card_horizontal) .xv-card_media ::slotted([slot=media]){min-height:100%;max-height:100%;max-width:160px;min-width:160px}.xv-card_content{padding:16px;display:flex;flex-direction:column;flex:1;text-align:left}.xv-card_media__content,.xv-card_media ::slotted([slot=media]){max-width:100%;min-width:100%;min-height:199px;max-height:199px;object-fit:cover;object-position:center}.xv-card_header__content,.xv-card_header ::slotted([slot=header]){margin:0 0 8px;color:var(--text-primary);font-size:16px;font-style:normal;font-weight:700;line-height:24px;letter-spacing:-0.6px}.xv-card_body{flex:1}.xv-card_body__content,.xv-card_body ::slotted([slot=body]){margin:0 0 8px;color:var(--text-secondary);font-size:14px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:-0.1px}";const p=x;const u=class{constructor(o){t(this,o);this.variant="vertical"}render(){return e(r,{key:"347b7aed9ce24e2e048bb4e6d0b07b23f0f60d5b",class:`xv-card xv-card_${this.variant}`,part:this.variant},e("div",{key:"9cd9f38cfe7d93fc271907fc8435033df860c246",class:"xv-card_media"},e("slot",{key:"35e2bae3084a0e7d26e13c0e3116daa9895ea6c1",name:"media"},this.media&&e("img",{key:"60d4305b136766e447653cb399f92ae70e3d9430",class:"xv-card_media__content",src:this.media,alt:this.header}))),e("div",{key:"3751defc0abf18997dca82ae5b5d6601c6e9f60b",class:"xv-card_content"},e("div",{key:"cca74475b9e5dba03c82f77851fb503a5323ce3c",class:"xv-card_header"},e("slot",{key:"02c4e3ddfb73bd56ef8f5b44a22bfe710654171a",name:"header"},this.header&&e("p",{key:"56998aa4742cc7576a023fcbe3e0892f312805ee",class:"xv-card_header__content"},this.header))),e("div",{key:"86da97df293ff58dbcfe0a2b7bc25c98053ac6a2",class:"xv-card_body"},e("slot",{key:"ff8d6dc3ef8e437d28f237c415bf43382df85f19",name:"body"},this.body&&e("p",{key:"7e8e351ac0fa2100fc7929e81cc380a4a32e7019",class:"xv-card_body__content"},this.header))),e("div",{key:"dc9824b523f2dbdb4f88dc05ac0e490f9b04f529",class:"xv-card_footer"},e("slot",{key:"ea4fbffc436ee2ef43f481be7656aad07dfc55ce",name:"footer"},this.footer))))}};u.style=p;const g=class{constructor(o){t(this,o)}applyGlobalStyles(){var t;const o=document.getElementById("brand-style");if(o){const e=document.createElement("style");e.innerHTML=`@import url('${o.href}');`;(t=this.el.shadowRoot)===null||t===void 0?void 0:t.appendChild(e)}}componentWillLoad(){this.applyGlobalStyles()}render(){return e("label",{key:"854b175975d81eaa3dd16ab5e5e7ecb8075da6a2",class:"checkbox-container"},e("input",{key:"4a40abb6dcec0a634d1e2d40878e877771ffd94d",type:"checkbox"}),e("span",{key:"473ce5b6240284f96d2b9a4d759ee18182470c10",class:"checkmark"}),e("slot",{key:"664f0b742f6ee4e2d71e984031052b9e746189b9"}))}get el(){return a(this)}};const y=":host{font-family:var(--ff-body, inherit)}:host(.xv-link_inline){display:inline-block}:host(.xv-link_inline) .xv-link{text-decoration-line:underline;text-decoration-style:solid;text-decoration-skip-ink:none;text-decoration-thickness:auto;text-underline-offset:auto;text-underline-position:from-font}:host(.xv-link_standalone){display:block}:host(.xv-link_standalone) .xv-link{text-decoration-line:none}.xv-link{display:inline-flex;gap:8px;align-items:center;color:var(--link-primary);font-family:var(--ff-body);font-style:normal;font-weight:400;transition:color 200ms ease-in-out}.xv-link:active{color:var(--text-primary)}.xv-link:visited{color:var(--link-visted)}.xv-link:hover{color:var(--link-primary-hover);cursor:pointer}.xv-link:disabled,.xv-link_disabled,.xv-link::part(disabled){color:var(--text-disabled);pointer-events:none;cursor:initial}.xv-link.sm{font-size:var(--fz-sm);line-height:137.5%}.xv-link.md{font-size:var(--fz-md);line-height:128.571%}.xv-link.lg{font-size:var(--fz-lg);line-height:133.333%}";const m=y;const k=class{constructor(o){t(this,o);this.disabled=false;this.size="md";this.variant="inline"}preventLinkHandler(t){if(!this.disabled)return;t.preventDefault();t.stopPropagation()}render(){return e(r,{key:"da2418a05379b0510c46ede0992a67bdc4847238",class:`xv-link_${this.variant}`},e("a",{key:"5632ecb0da02799b43fbdcfa522243502a6c2a7a",href:this.href,onClick:this.preventLinkHandler.bind(this),class:`xv-link ${this.disabled?"xv-link_disabled":""} ${this.size}`,target:this.target},e("slot",{key:"15efb0b41fbc63459d83ec104a972b645541cc80",name:"icon-left"}),e("slot",{key:"47aab9fa38e9d637a2b6fd838e14805602343aea"}),e("slot",{key:"a103c85ea4c15c83045b9e52d5dcf19fdff45076",name:"icon-right"})))}};k.style=m;const _=":host{display:flex;align-items:flex-start;justify-content:space-between;font-family:var(--ff-body, inherit);overflow-x:auto}";const w=_;const z=class{constructor(o){t(this,o);this.progress=0}updateChildItems(){const t=this.el.children;const o=this.el.childElementCount;const e=100/o;if(!t.length||!o)return;Array.from(t).forEach(((t,o)=>{const r=(o+1)*e;const a=this.progress>=r;t.setAttribute("done",a?"true":"false")}))}componentDidLoad(){this.updateChildItems()}render(){return e(r,{key:"009b89bf21bd093b84040e6ede3be78d5c402f53",class:"xv-progress-indicator"},e("slot",{key:"8ca75f700170c5aeb2da17133080fcde7e667947"}))}get el(){return a(this)}static get watchers(){return{progress:["updateChildItems"]}}};z.style=w;const C=':host(.xv-progress-indicator-item){display:flex;flex:1;flex-direction:column;align-items:center;justify-content:center;position:relative;padding:10px 16px}:host(.xv-progress-indicator-item):before{width:100%}:host(.xv-progress-indicator-item):before,:host(.xv-progress-indicator-item) .line{content:"";z-index:1;display:inline-block;position:absolute;top:0;left:0;right:0;height:2px;color:inherit;background-color:var(--border-subtle-01, grey)}:host(.xv-progress-indicator-item) .line{width:0;color:inherit;transition:width 250ms ease;background-color:var(--background-brand, currentColor)}:host(.xv-progress-indicator-item) .icon{display:flex;align-items:center;justify-content:center;width:22px;height:22px;max-width:22px;max-height:22px;border:2px dashed var(--icon-primary, currentColor);border-radius:50%}:host(.xv-progress-indicator-item) .icon svg{opacity:0;transition:opacity 500ms ease-in-out}:host(.xv-progress-indicator-item) .label{color:var(--text-primary);font-size:14px;font-style:normal;font-weight:400;line-height:18px;letter-spacing:0.16px}:host(.done) .icon{border-color:var(--background-brand, currentColor);color:var(--background-brand, inherit);border-style:solid}:host(.done) .icon svg{opacity:1}:host(.done) .line{width:100% !important;background-color:var(--background-brand, currentColor)}';const Y=C;const D=class{constructor(o){t(this,o);this.done=false}render(){return e(r,{key:"e18a645a83758b1e6d1c1fe32e3aab8e75ff3e7b",class:`xv-progress-indicator-item ${this.done?"done":""}`},e("span",{key:"000bfef67379218d2af3c3393432dbfc46c20707",class:"line"}),e("span",{key:"c1056a34648ab5b55ddb56faa30f5be8ecae83cf",class:"icon"},e("svg",{key:"ce1d729b7464f044808577460714d279374a7e9f",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 448 512",width:14,height:14},e("path",{key:"c67e17743357ccd75295b3d1f354e6f8096dbde8",fill:"currentColor",d:"M438.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L160 338.7 393.4 105.4c12.5-12.5 32.8-12.5 45.3 0z"}))),e("p",{key:"593c6a4c187148315cade226fc7f272462445a0e",class:"label"},e("slot",{key:"c3ed988d5cc8722e5bd5200646bd5c824921dd27"})))}get el(){return a(this)}};D.style=Y;const $='@charset "UTF-8";:host{display:inline-flex;align-items:center;justify-content:space-between;border-radius:1000px;background-color:var(--background);color:var(--text-primary);font-family:var(--ff-body, inherit)}:host .xv-tag_content{padding-left:8px;padding-right:8px;color:inherit;font-family:var(--ff-body);font-style:normal;font-weight:400;line-height:16px;letter-spacing:0.32px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host .xv-tag_close{box-sizing:border-box;text-decoration:none;border:none;background-color:inherit;outline:none;border-spacing:0;list-style:none outside none;margin:0;padding:0;display:inline-flex;align-items:center;justify-content:center;border-radius:62px;width:15px;height:15px;text-align:left;color:inherit;text-indent:0;transition:opacity 300ms ease-in-out, filter 300ms ease-in-out}:host .xv-tag_close:hover{cursor:pointer;filter:brightness(80%)}:host .xv-tag_close:active{opacity:0.7}:host .xv-tag_close:focus{outline:1px solid currentColor}:host .xv-tag_close:after{overflow:hidden;width:inherit;height:inherit;color:inherit;font-size:16px;display:inline-flex;align-items:center;justify-content:center;content:"×"}:host(.sm){font-size:var(--fz-sm)}:host(.md){font-size:var(--fz-md)}:host(.md) .xv-tag_content{line-height:24px}:host(.md) .xv-tag_close{height:24px;width:24px}:host(.lg){font-size:var(--fz-lg)}:host(.lg) .xv-tag_content{line-height:26px}:host(.lg) .xv-tag_close{height:26px;width:26px}:host(.disabled){pointer-events:none;background-color:var(--layer-01);color:var(--text-disabled)}';const j=$;const X=class{constructor(e){t(this,e);this.closeClick=o(this,"closeClick",7);this.size="md";this.color="";this.bg="";this.disabled=false;this.closeable=false}closeHandler(t){if(this.disabled)return;this.closeClick.emit(t)}render(){return e(r,{key:"429e196f85e0b46f65822519d0e363671fd60a77",style:{color:this.color,background:this.bg},class:`xv-tag ${this.disabled?"disabled":""} ${this.size}`},e("div",{key:"b2b919d599e662e07fad0cc0d2e933926911aea9",class:"xv-tag_content"},e("slot",{key:"717f8e980099bb813a12342015661e9914cc1330"})),this.closeable&&e("button",{key:"31ea0d38544c9b422fcab3dd92718de0e4005be8",onClick:this.closeHandler.bind(this),class:"xv-tag_close"}))}};X.style=j;const L=':host{position:relative;display:inline-block;cursor:pointer;line-height:0.5}:host::before,:host::after{position:absolute;opacity:0;visibility:hidden;transition:opacity 0.2s ease-in-out, transform 0.2s ease-in-out;z-index:10}:host::before{content:attr(tooltip);background:var(--background-inverse, #333);color:var(--icon-inverse, #fff);padding:var(--gap-sm, 5px) var(--gap-md, 16px);border-radius:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:70vw;font-family:var(--fz-body, Tahoma);font-size:var(fz-md, 14px);font-weight:400;line-height:18px;letter-spacing:0.16px}:host::after{content:"";border:6px solid transparent}:host(:hover)::before,:host(:hover)::after,:host(:focus)::before,:host(:focus)::after{opacity:1;visibility:visible}:host(.xv-tooltip_top)::before{bottom:100%;left:50%;transform:translateX(-50%) translateY(-5px)}:host(.xv-tooltip_top)::after{bottom:100%;left:50%;border-top-color:var(--background-inverse, #333);transform:translateX(-50%) translateY(5px)}:host(.xv-tooltip_top-left)::before{bottom:100%;left:0;transform:translateY(-5px)}:host(.xv-tooltip_top-left)::after{bottom:100%;left:10px;border-top-color:black;transform:translateY(5px)}:host(.xv-tooltip_top-right)::before{bottom:100%;right:0;transform:translateY(-5px)}:host(.xv-tooltip_top-right)::after{bottom:100%;right:10px;border-top-color:var(--background-inverse, #333);transform:translateY(5px)}:host(.xv-tooltip_bottom)::before{top:100%;left:50%;transform:translateX(-50%) translateY(5px)}:host(.xv-tooltip_bottom)::after{top:100%;left:50%;border-bottom-color:black;transform:translateX(-50%) translateY(-5px)}:host(.xv-tooltip_bottom-left)::before{top:100%;left:0;transform:translateY(5px)}:host(.xv-tooltip_bottom-left)::after{top:100%;left:10px;border-bottom-color:var(--background-inverse, #333);transform:translateY(-5px)}:host(.xv-tooltip_bottom-right)::before{top:100%;right:0;transform:translateY(5px)}:host(.xv-tooltip_bottom-right)::after{top:100%;right:10px;border-bottom-color:var(--background-inverse, #333);transform:translateY(-5px)}:host(.xv-tooltip_left)::before{right:100%;top:50%;transform:translateY(-50%) translateX(-5px)}:host(.xv-tooltip_left)::after{right:100%;top:50%;border-left-color:var(--background-inverse, #333);transform:translateY(-50%) translateX(5px)}:host(.xv-tooltip_right)::before{left:100%;top:50%;transform:translateY(-50%) translateX(5px)}:host(.xv-tooltip_right)::after{left:100%;top:50%;border-right-color:var(--background-inverse, #333);transform:translateY(-50%) translateX(-5px)}';const T=L;const A=class{constructor(o){t(this,o);this.position="top"}render(){return e(r,{key:"3896748ac459f1b401b4cd59b5ff163640811dce",tooltip:this.message,class:`xv-tooltip_${this.position}`},e("slot",{key:"458ac3f69fe0b595af5bfbf16b7b99614a84bb8c"},e("svg",{key:"32561cbbb87adcd9ef493a81c3edfd7e9c1f71ed",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 512 512",width:16,height:16},e("path",{key:"cb38fdc43b099b8fa080bf8a48fb736ff2c2cf80",fill:"currentColor",d:"M256 48a208 208 0 1 1 0 416 208 208 0 1 1 0-416zm0 464A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336c-13.3 0-24 10.7-24 24s10.7 24 24 24l80 0c13.3 0 24-10.7 24-24s-10.7-24-24-24l-8 0 0-88c0-13.3-10.7-24-24-24l-48 0c-13.3 0-24 10.7-24 24s10.7 24 24 24l24 0 0 64-24 0zm40-144a32 32 0 1 0 0-64 32 32 0 1 0 0 64z"}))))}};A.style=T;export{c as xv_accordion_v2,b as xv_accordion_v2_item,v as xv_button_v2,u as xv_card_v2,g as xv_checkbox_v2,k as xv_link_v2,z as xv_progress_indicator_v2,D as xv_progress_indicator_v2_item,X as xv_tag_v2,A as xv_tooltip_v2};
|
|
2
|
-
//# sourceMappingURL=p-08297c60.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["xvAccordionCss","XvAccordionV2Style0","XvAccordion","constructor","hostRef","this","multiple","xvId","uidGenerator","opened","Set","toggleItem","value","has","delete","clear","add","accordionChange","emit","id","componentWillLoad","render","h","Host","key","class","xvAccordionItemCss","XvAccordionV2ItemStyle0","XvAccordionItem","disabled","isOpen","handleAccordionChange","event","parentAccordionId","_a","el","closest","getAttribute","detail","toggle","_b","call","onClick","bind","label","xvButtonV2Css","XvButtonV2Style0","XvButton","block","variant","handleClick","buttonClick","name","xvCardCss","XvCardV2Style0","XvCard","part","media","src","alt","header","body","footer","XvCheckbox","applyGlobalStyles","globalStyle","document","getElementById","styleClone","createElement","innerHTML","href","shadowRoot","appendChild","type","xvLinkCss","XvLinkV2Style0","XvLink","size","preventLinkHandler","e","preventDefault","stopPropagation","target","xvProgressIndicatorCss","XvProgressIndicatorV2Style0","XvProgressIndicator","progress","updateChildItems","items","children","itemsCount","childElementCount","progressPerItem","length","Array","from","forEach","item","index","itemProgress","done","setAttribute","componentDidLoad","xvProgressIndicatorItemCss","XvProgressIndicatorV2ItemStyle0","XvProgressIndicatorItem","xmlns","viewBox","width","height","fill","d","xvTagCss","XvTagV2Style0","XvTag","color","bg","closeable","closeHandler","closeClick","style","background","xvTooltipCss","XvTooltipV2Style0","XvTooltip","position","tooltip","message"],"sources":["src/components/xv-accordion/xv-accordion.scss?tag=xv-accordion-v2&encapsulation=shadow","src/components/xv-accordion/xv-accordion.tsx","src/components/xv-accordion-item/xv-accordion-item.scss?tag=xv-accordion-v2-item&encapsulation=shadow","src/components/xv-accordion-item/xv-accordion-item.tsx","src/components/xv-button/xv-button-v2.scss?tag=xv-button-v2&encapsulation=shadow","src/components/xv-button/xv-button.tsx","src/components/xv-card/xv-card.scss?tag=xv-card-v2&encapsulation=shadow","src/components/xv-card/xv-card.tsx","src/components/xv-checkbox/xv-checkbox.tsx","src/components/xv-link/xv-link.scss?tag=xv-link-v2&encapsulation=shadow","src/components/xv-link/xv-link.tsx","src/components/xv-progress-indicator/xv-progress-indicator.scss?tag=xv-progress-indicator-v2&encapsulation=shadow","src/components/xv-progress-indicator/xv-progress-indicator.tsx","src/components/xv-progress-indicator-item/xv-progress-indicator-item.scss?tag=xv-progress-indicator-v2-item&encapsulation=shadow","src/components/xv-progress-indicator-item/xv-progress-indicator-item.tsx","src/components/xv-tag/xv-tag.scss?tag=xv-tag-v2&encapsulation=shadow","src/components/xv-tag/xv-tag.tsx","src/components/xv-tooltip/xv-tooltip.scss?tag=xv-tooltip-v2&encapsulation=shadow","src/components/xv-tooltip/xv-tooltip.tsx"],"sourcesContent":[":host {\n display: block;\n}\n","import { Component, Host, h, Event, EventEmitter, Method, State, Prop } from '@stencil/core';\nimport { uidGenerator } from '../../utils/utils';\n\n@Component({\n tag: 'xv-accordion-v2',\n styleUrl: 'xv-accordion.scss',\n shadow: true,\n})\nexport class XvAccordion {\n @Prop() multiple: boolean = false;\n @Prop() xvId: string = uidGenerator();\n @Prop({ mutable: true }) value: string;\n @State() opened: Set<string> = new Set();\n @Event() accordionChange: EventEmitter<{ opened: Set<string>, id: string }>;\n\n @Method()\n async toggleItem(value: string) {\n if (this.opened.has(value)) {\n this.opened.delete(value);\n } else {\n if (!this.multiple) this.opened.clear();\n this.value = value;\n this.opened.add(this.value);\n }\n\n this.accordionChange.emit({ opened: this.opened, id: this.xvId });\n\n return { opened: this.opened, id: this.xvId };\n }\n\n componentWillLoad() {\n if (this.value) {\n return this.toggleItem(this.value);\n }\n }\n\n render() {\n return (\n <Host class=\"xv-accordion\" data-id={this.xvId}>\n <slot />\n </Host>\n );\n }\n}\n",":host {\n border-top: 1px solid var(--border-subtle-01);\n display: flex;\n flex-direction: column;\n font-family: var(--ff-body, inherit);\n}\n\n:host(.disabled) {\n .label {\n color: var(--text-disabled);\n &:hover {\n cursor: initial;\n background-color: transparent;\n }\n }\n}\n\n.label {\n padding: 14px 16px;\n display: inline-flex;\n align-items: center;\n column-gap: 20px;\n justify-content: space-between;\n text-align: left;\n color: var(--text-primary);\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 20px;\n letter-spacing: 0.16px;\n background-color: transparent;\n transition: background-color 200ms ease-in-out;\n &>span {\n overflow: hidden;\n text-overflow: ellipsis;\n display: -webkit-box;\n -webkit-line-clamp: 1;\n -webkit-box-orient: vertical;\n }\n\n &:hover {\n cursor: pointer;\n background-color: var(--layer-hover-01);\n }\n\n &:after {\n content: '';\n border: solid black;\n border-width: 0 2px 2px 0;\n display: inline-block;\n padding: 4.66px;\n transition: transform 100ms ease-in-out;\n transform: rotate(45deg);\n }\n\n &.opened:after {\n transform: rotate(-135deg);\n }\n}\n\n.content {\n padding: 0 16px;\n text-align: left;\n color: var(--text-primary);\n font-size: 14px;\n overflow: hidden;\n max-height: 0;\n transition: max-height 300ms ease-in-out, padding 250ms ease 50ms;\n &.opened {\n padding: 14px 16px;\n max-height: 500px;\n }\n}\n","import { Component, Host, h, Element, Prop, State, Listen, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n tag: 'xv-accordion-v2-item',\n styleUrl: 'xv-accordion-item.scss',\n shadow: true,\n})\nexport class XvAccordionItem {\n @Element() el: HTMLElement;\n @Prop() disabled: boolean = false;\n @Prop() label: string;\n @Prop() value: string;\n @State() isOpen: boolean = false;\n @Event() itemToggle: EventEmitter;\n\n @Listen('accordionChange', { target: 'body' })\n handleAccordionChange(event: CustomEvent<{ opened: Set<string>, id: string }>) {\n const parentAccordionId = this.el.closest('[data-id]')?.getAttribute('data-id');\n if (event.detail.id !== parentAccordionId) return;\n this.isOpen = event.detail.opened.has(this.value);\n }\n\n toggle() {\n if (this.disabled) return;\n this.isOpen = !this.isOpen;\n this.el.closest('xv-accordion-v2')?.toggleItem?.(this.value);\n }\n\n render() {\n return (\n <Host class={`${this.disabled ? 'disabled' : ''}`}>\n <label class={`label ${this.isOpen ? 'opened' : 'closed'}`} onClick={this.toggle.bind(this)}>\n <span>{this.label}</span>\n </label>\n <div class={`content ${this.isOpen ? 'opened' : 'closed'}`}>\n <slot />\n </div>\n </Host>\n );\n }\n}\n",":host {\n --focus-border-width: 2px;\n --focus-border-style: solid;\n --button-ghost: tarnsparent;\n --text-disabled-opacity: 0.25;\n --button-border-radius: 3px;\n --button-border-width: 1px;\n --button-border-style: solid;\n --button-border-color-accent: #97BF0D;\n --button-border-color-primary: #273435;\n --button-border-color-secondary: #D1D1D1;\n --button-border-color-ghost: tarnsparent;\n --button-ghost-hover: tarnsparent;\n --button-ghost-active: rgba(139, 139, 139, 0.5);\n --button-accent-disabled: #D1D1D1;\n --button-primary-disabled: #D1D1D1;\n --button-secondary-disabled: #D1D1D1;\n --button-tertiary-disabled: tarnsparent;\n --button-ghost-disabled: tarnsparent;\n\n button {\n font-family: inherit;\n font-size: 16px;\n font-weight: 700;\n padding: 0 20px;\n min-height: 40px;\n line-height: 40px;\n cursor: pointer;\n box-sizing: border-box;\n transition:\n background-color 0.2s ease-in-out,\n filter 0.2s ease-in-out,\n transform 0.1s ease-in-out,\n border-color 0.2s ease-in-out,\n border-width 0.2s ease-in-out,\n box-shadow 0.2s ease-in-out;\n\n &.xv-button-block {\n width: 100%;\n }\n }\n}\n\n.xv-button {\n /* ✅ Accent Button */\n &.accent {\n background-color: var(--button-accent);\n color: var(--text-on-color);\n border: var(--button-border-width) var(--button-border-style) var(--button-border-color-accent);\n border-radius: var(--button-border-radius);\n &:hover {\n background-color: var(--button-accent-hover);\n }\n &:active {\n background-color: var(--button-accent-active);\n color: var(--text-on-color);\n }\n &:focus {\n outline: none;\n border: var(--focus-border-width) var(--focus-border-style) var(--focus);\n transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;\n }\n &:disabled {\n background-color: var(--button-accent-disabled);\n color: var(--text-on-color-disabled);\n border: var(--button-border-width) var(--button-border-style) var(--button-accent-disabled);\n }\n\n }\n\n /* ✅ Primary Button */\n &.primary {\n background-color: var(--button-primary);\n color: var(--text-on-color);\n border: var(--button-border-width) var(--button-border-style) var(--button-border-color-primary);\n border-radius: var(--button-border-radius);\n &:hover {\n background-color: var(--button-primary-hover)\n }\n &:active {\n background-color: var(--button-primary-active)\n }\n &:focus {\n outline: none;\n border: var(--focus-border-width) var(--focus-border-style) var(--focus);\n transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;\n }\n &:disabled {\n background-color: var(--button-primary-disabled);\n color: var(--text-on-color-disabled);\n border: var(--button-border-width) var(--button-border-style) var(--button-primary-disabled);\n }\n }\n\n /* ✅ Secondary Button */\n &.secondary {\n background-color: var(--button-secondary);\n color: var(--text-primary);\n border: var(--button-border-width) var(--button-border-style) var(--button-border-color-secondary);\n border-radius: var(--button-border-radius);\n &:hover {\n background-color: var(--button-secondary-hover);\n }\n &:active {\n background-color: var(--button-secondary-active);\n }\n &:focus {\n outline: none;\n border: var(--focus-border-width) var(--focus-border-style) var(--focus);\n transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;\n }\n &:disabled {\n background-color: var(--button-secondary-disabled);\n color: var(--text-on-color-disabled);\n }\n }\n\n /* ✅ Tertiary Button */\n &.tertiary {\n background-color: var(--button-ghost);\n color: var(--text-primary);\n border: var(--button-border-width) var(--button-border-style) var(--button-tertiary);\n border-radius: var(--button-border-radius);\n &:hover {\n background-color: var(--button-tertiary-hover);\n }\n &:active {\n background-color: var(--button-tertiary-active);\n }\n &:focus {\n outline: none;\n border: var(--focus-border-width) var(--focus-border-style) var(--focus);\n transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;\n }\n &:disabled {\n background-color: var(--button-tertiary-disabled);\n color: var(--text-disabled);\n opacity: var(--text-disabled-opacity);\n }\n }\n\n /* ✅ Ghost Button */\n &.ghost {\n background-color: var(--button-ghost);\n color: var(--text-primary);\n border: var(--button-border-width) var(--button-border-style) var(--button-border-color-ghost);\n border-radius: var(--button-border-radius);\n &:hover {\n background-color: var(--button-ghost-hover);\n }\n &:active {\n background-color: var(--button-ghost-active);\n }\n &:focus {\n outline: none;\n border: var(--focus-border-width) var(--focus-border-style) var(--focus);\n transition: border-color 0.2s ease-in-out;\n }\n &:disabled {\n background-color: var(--button-ghost-disabled);\n color: var(--text-disabled);\n opacity: var(--text-disabled-opacity);\n }\n }\n}\n","import { Component, Prop, Event, EventEmitter, h } from '@stencil/core';\r\n\r\n\r\n@Component({\r\n tag: 'xv-button-v2',\r\n styleUrl: 'xv-button-v2.scss',\r\n shadow: true,\r\n})\r\nexport class XvButton {\r\n /** Button label */\r\n @Prop() label: string = '';\r\n\r\n /** Container width Button */\r\n @Prop() block: boolean = false;\r\n\r\n /** Variant */\r\n @Prop() variant: 'accent' | 'primary' | 'secondary' | 'tertiary' | 'ghost' = 'primary';\r\n\r\n /** Disabled state */\r\n @Prop() disabled: boolean = false;\r\n\r\n /** Emits when the button is clicked */\r\n @Event() buttonClick!: EventEmitter<void>;\r\n\r\n /** Handle click only if not disabled */\r\n private handleClick = () => {\r\n if (this.disabled) {\r\n return;\r\n }\r\n this.buttonClick.emit();\r\n };\r\n\r\n render() {\r\n return (\r\n <button\r\n class={`xv-button ${this.variant} ${this.block ? 'xv-button-block' : ''}`}\r\n disabled={this.disabled}\r\n onClick={this.handleClick}\r\n >\r\n <slot name=\"icon-left\"></slot>\r\n\r\n <slot>\r\n {this.label}\r\n </slot>\r\n\r\n <slot name=\"icon-right\"></slot>\r\n </button>\r\n );\r\n }\r\n}\r\n",":host {\n display: flex;\n flex-direction: column;\n border-radius: 8px;\n border: 1px solid var(--border-subtle-00);\n background: var(--layer-layer-02);\n box-shadow: 0 1px 3px 1px rgba(39, 52, 53, 0.15), 0 1px 2px 0 rgba(39, 52, 53, 0.30);\n font-family: var(--ff-body, inherit);\n overflow: visible !important;\n}\n\n:host(.xv-card_vertical) {\n //max-width: 298px;\n // TODO: wright down correct styling for card size\n width: 100%!important;\n}\n\n:host(.xv-card_horizontal) {\n flex-direction: row;\n display: flex;\n width: max-content;\n\n .xv-card_media {\n &__content, ::slotted([slot=\"media\"]) {\n min-height: 100%;\n max-height: 100%;\n max-width: 160px;\n min-width: 160px;\n }\n }\n}\n\n.xv-card {\n &_content {\n padding: 16px;\n display: flex;\n flex-direction: column;\n flex: 1;\n text-align: left;\n }\n\n &_media {\n &__content, ::slotted([slot=\"media\"]) {\n max-width: 100%;\n min-width: 100%;\n min-height: 199px;\n max-height: 199px;\n object-fit: cover;\n object-position: center;\n }\n }\n\n &_header {\n &__content, ::slotted([slot=\"header\"]) {\n margin: 0 0 8px;\n color: var(--text-primary);\n font-size: 16px;\n font-style: normal;\n font-weight: 700;\n line-height: 24px;\n letter-spacing: -0.6px;\n }\n }\n\n &_body {\n flex: 1;\n &__content, ::slotted([slot=\"body\"]) {\n margin: 0 0 8px;\n color: var(--text-secondary);\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 20px;\n letter-spacing: -0.1px;\n }\n }\n\n &_footer {}\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n tag: 'xv-card-v2',\n styleUrl: 'xv-card.scss',\n shadow: true,\n})\nexport class XvCard {\n @Prop() variant: 'horizontal' | 'vertical' = 'vertical';\n @Prop() media: string;\n @Prop() header: string;\n @Prop() body: string;\n @Prop() footer: string;\n render() {\n return (\n <Host class={`xv-card xv-card_${this.variant}`} part={this.variant}>\n <div class=\"xv-card_media\">\n <slot name=\"media\">\n {this.media && <img class=\"xv-card_media__content\" src={this.media} alt={this.header} />}\n </slot>\n </div>\n\n <div class=\"xv-card_content\">\n <div class=\"xv-card_header\">\n <slot name=\"header\">\n {this.header && <p class=\"xv-card_header__content\">{this.header}</p>}\n </slot>\n </div>\n <div class=\"xv-card_body\">\n <slot name=\"body\">\n {this.body && <p class=\"xv-card_body__content\">{this.header}</p>}\n </slot>\n </div>\n <div class=\"xv-card_footer\">\n <slot name=\"footer\">{this.footer}</slot>\n </div>\n </div>\n </Host>\n );\n }\n}\n","import { Component, h, Element } from '@stencil/core';\n\n@Component({\n tag: 'xv-checkbox-v2',\n shadow: true, // ✅ Shadow DOM aktiviert\n})\nexport class XvCheckbox {\n @Element() el!: HTMLElement;\n\n private applyGlobalStyles() {\n const globalStyle = document.getElementById(\"brand-style\") as HTMLLinkElement;\n if (globalStyle) {\n const styleClone = document.createElement(\"style\");\n styleClone.innerHTML = `@import url('${globalStyle.href}');`;\n this.el.shadowRoot?.appendChild(styleClone);\n }\n }\n\n componentWillLoad() {\n this.applyGlobalStyles();\n }\n\n render() {\n return (\n <label class=\"checkbox-container\">\n <input type=\"checkbox\" />\n <span class=\"checkmark\"></span>\n <slot></slot>\n </label>\n );\n }\n}\n",":host {\n font-family: var(--ff-body, inherit);\n}\n\n:host(.xv-link_inline) {\n display: inline-block;\n .xv-link {\n text-decoration-line: underline;\n text-decoration-style: solid;\n text-decoration-skip-ink: none;\n text-decoration-thickness: auto;\n text-underline-offset: auto;\n text-underline-position: from-font;\n }\n}\n\n:host(.xv-link_standalone) {\n display: block;\n .xv-link {\n text-decoration-line: none;\n }\n}\n\n.xv-link {\n display: inline-flex;\n gap: 8px;\n align-items: center;\n color: var(--link-primary);\n font-family: var(--ff-body);\n font-style: normal;\n font-weight: 400;\n transition: color 200ms ease-in-out;\n\n &:active {\n color: var(--text-primary);\n }\n\n &:visited {\n color: var(--link-visted);\n }\n\n &:hover {\n color: var(--link-primary-hover);\n cursor: pointer;\n }\n\n &:disabled, &_disabled, &::part(disabled) {\n color: var(--text-disabled);\n pointer-events: none;\n cursor: initial;\n }\n\n &.sm {\n font-size: var(--fz-sm);\n line-height: 137.5%;\n }\n\n &.md {\n font-size: var(--fz-md);\n line-height: 128.571%;\n }\n\n &.lg {\n font-size: var(--fz-lg);\n line-height: 133.333%;\n }\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'xv-link-v2',\n styleUrl: 'xv-link.scss',\n shadow: true,\n})\nexport class XvLink {\n @Prop() href: string;\n @Prop() target: '_self' | '_blank' | '_parent' | '_top';\n @Prop() disabled: boolean = false;\n @Prop() size: 'sm' | 'md' | 'lg' = 'md';\n @Prop() variant: 'standalone' | 'inline' = 'inline';\n\n preventLinkHandler(e: PointerEvent) {\n if (!this.disabled) return;\n\n e.preventDefault();\n e.stopPropagation();\n }\n\n render() {\n return (\n <Host class={`xv-link_${this.variant}`}>\n <a\n href={this.href}\n onClick={this.preventLinkHandler.bind(this)}\n class={`xv-link ${this.disabled ? 'xv-link_disabled' : ''} ${this.size}`}\n target={this.target}\n >\n <slot name=\"icon-left\"></slot>\n\n <slot></slot>\n\n <slot name=\"icon-right\"></slot>\n </a>\n </Host>\n );\n }\n}\n",":host {\n display: flex;\n align-items: flex-start;\n justify-content: space-between;\n font-family: var(--ff-body, inherit);\n overflow-x: auto;\n}\n","import { Component, Host, h, Prop, Watch, Element } from '@stencil/core';\n\n@Component({\n tag: 'xv-progress-indicator-v2',\n styleUrl: 'xv-progress-indicator.scss',\n shadow: true,\n})\nexport class XvProgressIndicator {\n @Element() el: HTMLElement;\n @Prop() progress: number = 0;\n\n // Update 'xv-progress-indicator-item' done status\n @Watch('progress')\n updateChildItems() {\n const items = this.el.children;\n const itemsCount = this.el.childElementCount;\n const progressPerItem = 100 / itemsCount;\n\n if (!items.length || !itemsCount) return;\n\n Array.from(items).forEach((item, index) => {\n const itemProgress = (index + 1) * progressPerItem;\n const done = this.progress >= itemProgress;\n (item as HTMLElement).setAttribute('done', done ? 'true' : 'false');\n });\n }\n\n // Load initial done status\n componentDidLoad() {\n this.updateChildItems()\n }\n\n render() {\n return (\n <Host class=\"xv-progress-indicator\">\n <slot></slot>\n </Host>\n );\n }\n}\n",":host(.xv-progress-indicator-item) {\n display: flex;\n flex: 1;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n position: relative;\n padding: 10px 16px;\n &:before {\n width: 100%;\n }\n\n &:before, .line {\n content: '';\n z-index: 1;\n display: inline-block;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n height: 2px;\n color: inherit;\n background-color: var(--border-subtle-01, grey);\n }\n\n .line {\n width: 0;\n color: inherit;\n transition: width 250ms ease;\n background-color: var(--background-brand, currentColor);\n }\n\n .icon {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 22px;\n height: 22px;\n max-width: 22px;\n max-height: 22px;\n border: 2px dashed var(--icon-primary, currentColor);\n border-radius: 50%;\n svg {\n opacity: 0;\n transition: opacity 500ms ease-in-out;\n }\n }\n\n .label {\n color: var(--text-primary);\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 18px;\n letter-spacing: 0.16px;\n }\n}\n\n:host(.done) {\n .icon {\n border-color: var(--background-brand, currentColor);\n color: var(--background-brand, inherit);\n border-style: solid;\n svg {\n opacity: 1;\n }\n }\n\n .line {\n width: 100% !important;\n background-color: var(--background-brand, currentColor);\n }\n}\n","import { Component, Host, h, Element, Prop } from '@stencil/core';\n\n@Component({\n tag: 'xv-progress-indicator-v2-item',\n styleUrl: 'xv-progress-indicator-item.scss',\n shadow: true,\n})\nexport class XvProgressIndicatorItem {\n @Element() el: HTMLElement;\n @Prop({ reflect: false }) done: boolean = false;\n\n render() {\n return (\n <Host class={`xv-progress-indicator-item ${this.done ? 'done' : ''}`}>\n <span class=\"line\"/>\n <span class=\"icon\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 448 512\"\n width={14}\n height={14}\n >\n <path\n fill=\"currentColor\"\n d=\"M438.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L160 338.7 393.4 105.4c12.5-12.5 32.8-12.5 45.3 0z\"\n />\n </svg>\n </span>\n <p class=\"label\"><slot/></p>\n </Host>\n );\n }\n}\n",":host {\n display: inline-flex;\n align-items: center;\n justify-content: space-between;\n border-radius: 1000px;\n background-color: var(--background);\n color: var(--text-primary);\n font-family: var(--ff-body, inherit);\n\n .xv-tag_content {\n padding-left: 8px;\n padding-right: 8px;\n color: inherit;\n font-family: var(--ff-body);\n font-style: normal;\n font-weight: 400;\n line-height: 16px;\n letter-spacing: 0.32px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n .xv-tag_close {\n box-sizing: border-box;\n text-decoration: none;\n border: none;\n background-color: inherit;\n outline: none;\n border-spacing: 0;\n list-style: none outside none;\n margin: 0;\n padding: 0;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border-radius: 62px;\n width: 15px;\n height: 15px;\n text-align: left;\n color: inherit;\n text-indent: 0;\n transition: opacity 300ms ease-in-out, filter 300ms ease-in-out;\n &:hover {\n cursor: pointer;\n filter: brightness(80%);\n }\n\n &:active {\n opacity: 0.7;\n }\n\n &:focus {\n outline: 1px solid currentColor;\n }\n\n &:after {\n overflow: hidden;\n width: inherit;\n height: inherit;\n color: inherit;\n font-size: 16px;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n content: \"\\00d7\";\n }\n }\n}\n\n:host(.sm) {\n font-size: var(--fz-sm);\n}\n\n:host(.md) {\n font-size: var(--fz-md);\n .xv-tag_content {\n line-height: 24px;\n }\n\n .xv-tag_close {\n height: 24px;\n width: 24px;\n }\n}\n\n:host(.lg) {\n font-size: var(--fz-lg);\n .xv-tag_content {\n line-height: 26px;\n }\n\n .xv-tag_close {\n height: 26px;\n width: 26px;\n }\n}\n\n:host(.disabled) {\n pointer-events: none;\n background-color: var(--layer-01);\n color: var(--text-disabled);\n}\n","import { Component, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n tag: 'xv-tag-v2',\n styleUrl: 'xv-tag.scss',\n shadow: true,\n})\nexport class XvTag {\n @Prop() size: 'sm' | 'md' | 'lg' = 'md';\n @Prop() color: string = '';\n @Prop() bg: string = '';\n @Prop() disabled: boolean = false;\n @Prop() closeable: boolean = false;\n @Event() closeClick: EventEmitter<PointerEvent>;\n\n closeHandler(e: PointerEvent) {\n if (this.disabled) return;\n\n this.closeClick.emit(e);\n }\n\n render() {\n return (\n <Host\n style={{ color: this.color, background: this.bg }}\n class={`xv-tag ${this.disabled ? 'disabled' : ''} ${this.size}`}\n >\n <div class=\"xv-tag_content\">\n <slot></slot>\n </div>\n {this.closeable && (\n <button onClick={this.closeHandler.bind(this)} class=\"xv-tag_close\"></button>\n )}\n </Host>\n );\n }\n}\n",":host {\n position: relative;\n display: inline-block;\n cursor: pointer;\n line-height: 0.5;\n}\n\n/* General styles for tooltip */\n:host::before,\n:host::after {\n position: absolute;\n opacity: 0;\n visibility: hidden;\n transition: opacity 0.2s ease-in-out, transform 0.2s ease-in-out;\n z-index: 10;\n}\n\n/* Tooltip */\n:host::before {\n content: attr(tooltip);\n background: var(--background-inverse, #333);\n color: var(--icon-inverse, #fff);\n padding: var(--gap-sm, 5px) var(--gap-md, 16px);\n border-radius: 2px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n max-width: max(70vw);\n font-family: var(--fz-body, Tahoma);\n font-size: var(fz-md, 14px);\n font-weight: 400;\n line-height: 18px;\n letter-spacing: 0.16px;\n}\n\n/* Arrow */\n:host::after {\n content: \"\";\n border: 6px solid transparent;\n}\n\n/* Show Tooltip and arrow */\n:host(:hover)::before,\n:host(:hover)::after,\n:host(:focus)::before,\n:host(:focus)::after {\n opacity: 1;\n visibility: visible;\n}\n\n/* Tooltip positions */\n:host(.xv-tooltip_top)::before {\n bottom: 100%;\n left: 50%;\n transform: translateX(-50%) translateY(-5px);\n}\n:host(.xv-tooltip_top)::after {\n bottom: 100%;\n left: 50%;\n border-top-color: var(--background-inverse, #333);\n transform: translateX(-50%) translateY(5px);\n}\n\n:host(.xv-tooltip_top-left)::before {\n bottom: 100%;\n left: 0;\n transform: translateY(-5px);\n}\n:host(.xv-tooltip_top-left)::after {\n bottom: 100%;\n left: 10px;\n border-top-color: black;\n transform: translateY(5px);\n}\n\n:host(.xv-tooltip_top-right)::before {\n bottom: 100%;\n right: 0;\n transform: translateY(-5px);\n}\n:host(.xv-tooltip_top-right)::after {\n bottom: 100%;\n right: 10px;\n border-top-color: var(--background-inverse, #333);\n transform: translateY(5px);\n}\n\n:host(.xv-tooltip_bottom)::before {\n top: 100%;\n left: 50%;\n transform: translateX(-50%) translateY(5px);\n}\n:host(.xv-tooltip_bottom)::after {\n top: 100%;\n left: 50%;\n border-bottom-color: black;\n transform: translateX(-50%) translateY(-5px);\n}\n\n:host(.xv-tooltip_bottom-left)::before {\n top: 100%;\n left: 0;\n transform: translateY(5px);\n}\n:host(.xv-tooltip_bottom-left)::after {\n top: 100%;\n left: 10px;\n border-bottom-color: var(--background-inverse, #333);\n transform: translateY(-5px);\n}\n\n:host(.xv-tooltip_bottom-right)::before {\n top: 100%;\n right: 0;\n transform: translateY(5px);\n}\n:host(.xv-tooltip_bottom-right)::after {\n top: 100%;\n right: 10px;\n border-bottom-color: var(--background-inverse, #333);\n transform: translateY(-5px);\n}\n\n:host(.xv-tooltip_left)::before {\n right: 100%;\n top: 50%;\n transform: translateY(-50%) translateX(-5px);\n}\n:host(.xv-tooltip_left)::after {\n right: 100%;\n top: 50%;\n border-left-color: var(--background-inverse, #333);\n transform: translateY(-50%) translateX(5px);\n}\n\n:host(.xv-tooltip_right)::before {\n left: 100%;\n top: 50%;\n transform: translateY(-50%) translateX(5px);\n}\n:host(.xv-tooltip_right)::after {\n left: 100%;\n top: 50%;\n border-right-color: var(--background-inverse, #333);\n transform: translateY(-50%) translateX(-5px);\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n tag: 'xv-tooltip-v2',\n styleUrl: 'xv-tooltip.scss',\n shadow: true,\n})\nexport class XvTooltip {\n /** Message what will be shown for tooltip **/\n @Prop() message: string;\n /**\n * Tooltip and arrow position related to element\n * possible options: 'top' | 'top-left' | 'top-right' | 'bottom' | 'bottom-left' | 'bottom-right' | 'left' | 'right'.\n * By default, \"top\"\n */\n @Prop() position: 'top' | 'top-left' | 'top-right' | 'bottom' | 'bottom-left' | 'bottom-right' | 'left' | 'right' = 'top';\n\n render() {\n return (\n <Host tooltip={this.message} class={`xv-tooltip_${this.position}`}>\n <slot>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\" width={16} height={16}>\n <path\n fill=\"currentColor\"\n d=\"M256 48a208 208 0 1 1 0 416 208 208 0 1 1 0-416zm0 464A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336c-13.3 0-24 10.7-24 24s10.7 24 24 24l80 0c13.3 0 24-10.7 24-24s-10.7-24-24-24l-8 0 0-88c0-13.3-10.7-24-24-24l-48 0c-13.3 0-24 10.7-24 24s10.7 24 24 24l24 0 0 64-24 0zm40-144a32 32 0 1 0 0-64 32 32 0 1 0 0 64z\"\n />\n </svg>\n </slot>\n </Host>\n );\n }\n}\n"],"mappings":"oGAAA,MAAMA,EAAiB,uBACvB,MAAAC,EAAeD,E,MCOFE,EAAW,MALxB,WAAAC,CAAAC,G,2DAMUC,KAAAC,SAAoB,MACpBD,KAAAE,KAAeC,IAEdH,KAAAI,OAAsB,IAAIC,G,CAInC,gBAAMC,CAAWC,GACf,GAAIP,KAAKI,OAAOI,IAAID,GAAQ,CAC1BP,KAAKI,OAAOK,OAAOF,E,KACd,CACL,IAAKP,KAAKC,SAAUD,KAAKI,OAAOM,QAChCV,KAAKO,MAAQA,EACbP,KAAKI,OAAOO,IAAIX,KAAKO,M,CAGvBP,KAAKY,gBAAgBC,KAAK,CAAET,OAAQJ,KAAKI,OAAQU,GAAId,KAAKE,OAE1D,MAAO,CAAEE,OAAQJ,KAAKI,OAAQU,GAAId,KAAKE,K,CAGzC,iBAAAa,GACE,GAAIf,KAAKO,MAAO,CACd,OAAOP,KAAKM,WAAWN,KAAKO,M,EAIhC,MAAAS,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAM,eAAc,UAAUpB,KAAKE,MACvCe,EAAA,QAAAE,IAAA,6C,aCvCR,MAAME,EAAqB,uqCAC3B,MAAAC,EAAeD,E,MCMFE,EAAe,MAL5B,WAAAzB,CAAAC,G,iDAOUC,KAAAwB,SAAoB,MAGnBxB,KAAAyB,OAAkB,K,CAI3B,qBAAAC,CAAsBC,G,MACpB,MAAMC,GAAoBC,EAAA7B,KAAK8B,GAAGC,QAAQ,gBAAY,MAAAF,SAAA,SAAAA,EAAEG,aAAa,WACrE,GAAIL,EAAMM,OAAOnB,KAAOc,EAAmB,OAC3C5B,KAAKyB,OAASE,EAAMM,OAAO7B,OAAOI,IAAIR,KAAKO,M,CAG7C,MAAA2B,G,QACE,GAAIlC,KAAKwB,SAAU,OACnBxB,KAAKyB,QAAUzB,KAAKyB,QACpBU,GAAAN,EAAA7B,KAAK8B,GAAGC,QAAQ,sBAAkB,MAAAF,SAAA,SAAAA,EAAEvB,cAAU,MAAA6B,SAAA,SAAAA,EAAAC,KAAAP,EAAG7B,KAAKO,M,CAGxD,MAAAS,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAO,GAAGpB,KAAKwB,SAAW,WAAa,MAC3CP,EAAA,SAAAE,IAAA,2CAAOC,MAAO,SAASpB,KAAKyB,OAAS,SAAW,WAAYY,QAASrC,KAAKkC,OAAOI,KAAKtC,OACpFiB,EAAA,QAAAE,IAAA,4CAAOnB,KAAKuC,QAEdtB,EAAA,OAAAE,IAAA,2CAAKC,MAAO,WAAWpB,KAAKyB,OAAS,SAAW,YAC9CR,EAAA,QAAAE,IAAA,8C,qCCnCV,MAAMqB,EAAgB,y6IACtB,MAAAC,EAAeD,E,MCOFE,EAAQ,MALrB,WAAA5C,CAAAC,G,mDAOUC,KAAAuC,MAAgB,GAGhBvC,KAAA2C,MAAiB,MAGjB3C,KAAA4C,QAAqE,UAGrE5C,KAAAwB,SAAoB,MAMpBxB,KAAA6C,YAAc,KACpB,GAAI7C,KAAKwB,SAAU,CACjB,M,CAEFxB,KAAK8C,YAAYjC,MAAM,C,CAGzB,MAAAG,GACE,OACEC,EAAA,UAAAE,IAAA,2CACEC,MAAO,aAAapB,KAAK4C,WAAW5C,KAAK2C,MAAQ,kBAAoB,KACrEnB,SAAUxB,KAAKwB,SACfa,QAASrC,KAAK6C,aAEd5B,EAAA,QAAAE,IAAA,2CAAM4B,KAAK,cAEX9B,EAAA,QAAAE,IAAA,4CACGnB,KAAKuC,OAGRtB,EAAA,QAAAE,IAAA,2CAAM4B,KAAK,e,aC7CnB,MAAMC,EAAY,kuCAClB,MAAAC,EAAeD,E,MCMFE,EAAM,MALnB,WAAApD,CAAAC,G,UAMUC,KAAA4C,QAAqC,U,CAK7C,MAAA5B,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAO,mBAAmBpB,KAAK4C,UAAWO,KAAMnD,KAAK4C,SACzD3B,EAAA,OAAAE,IAAA,2CAAKC,MAAM,iBACTH,EAAA,QAAAE,IAAA,2CAAM4B,KAAK,SACR/C,KAAKoD,OAASnC,EAAA,OAAAE,IAAA,2CAAKC,MAAM,yBAAyBiC,IAAKrD,KAAKoD,MAAOE,IAAKtD,KAAKuD,WAIlFtC,EAAA,OAAAE,IAAA,2CAAKC,MAAM,mBACTH,EAAA,OAAAE,IAAA,2CAAKC,MAAM,kBACTH,EAAA,QAAAE,IAAA,2CAAM4B,KAAK,UACR/C,KAAKuD,QAAUtC,EAAA,KAAAE,IAAA,2CAAGC,MAAM,2BAA2BpB,KAAKuD,UAG7DtC,EAAA,OAAAE,IAAA,2CAAKC,MAAM,gBACTH,EAAA,QAAAE,IAAA,2CAAM4B,KAAK,QACR/C,KAAKwD,MAAQvC,EAAA,KAAAE,IAAA,2CAAGC,MAAM,yBAAyBpB,KAAKuD,UAGzDtC,EAAA,OAAAE,IAAA,2CAAKC,MAAM,kBACTH,EAAA,QAAAE,IAAA,2CAAM4B,KAAK,UAAU/C,KAAKyD,U,mBC5BzBC,EAAU,M,yBAGb,iBAAAC,G,MACN,MAAMC,EAAcC,SAASC,eAAe,eAC5C,GAAIF,EAAa,CACf,MAAMG,EAAaF,SAASG,cAAc,SAC1CD,EAAWE,UAAY,gBAAgBL,EAAYM,WACnDrC,EAAA7B,KAAK8B,GAAGqC,cAAU,MAAAtC,SAAA,SAAAA,EAAEuC,YAAYL,E,EAIpC,iBAAAhD,GACEf,KAAK2D,mB,CAGP,MAAA3C,GACE,OACEC,EAAA,SAAAE,IAAA,2CAAOC,MAAM,sBACXH,EAAA,SAAAE,IAAA,2CAAOkD,KAAK,aACZpD,EAAA,QAAAE,IAAA,2CAAMC,MAAM,cACZH,EAAA,QAAAE,IAAA,6C,2BC3BR,MAAMmD,EAAY,0/BAClB,MAAAC,EAAeD,E,MCMFE,EAAM,MALnB,WAAA1E,CAAAC,G,UAQUC,KAAAwB,SAAoB,MACpBxB,KAAAyE,KAA2B,KAC3BzE,KAAA4C,QAAmC,Q,CAE3C,kBAAA8B,CAAmBC,GACjB,IAAK3E,KAAKwB,SAAU,OAEpBmD,EAAEC,iBACFD,EAAEE,iB,CAGJ,MAAA7D,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAO,WAAWpB,KAAK4C,WAC3B3B,EAAA,KAAAE,IAAA,2CACE+C,KAAMlE,KAAKkE,KACX7B,QAASrC,KAAK0E,mBAAmBpC,KAAKtC,MACtCoB,MAAO,WAAWpB,KAAKwB,SAAW,mBAAqB,MAAMxB,KAAKyE,OAClEK,OAAQ9E,KAAK8E,QAEb7D,EAAA,QAAAE,IAAA,2CAAM4B,KAAK,cAEX9B,EAAA,QAAAE,IAAA,6CAEAF,EAAA,QAAAE,IAAA,2CAAM4B,KAAK,gB,aClCrB,MAAMgC,EAAyB,+HAC/B,MAAAC,EAAeD,E,MCMFE,EAAmB,MALhC,WAAAnF,CAAAC,G,UAOUC,KAAAkF,SAAmB,C,CAI3B,gBAAAC,GACE,MAAMC,EAAQpF,KAAK8B,GAAGuD,SACtB,MAAMC,EAAatF,KAAK8B,GAAGyD,kBAC3B,MAAMC,EAAkB,IAAMF,EAE9B,IAAKF,EAAMK,SAAWH,EAAY,OAElCI,MAAMC,KAAKP,GAAOQ,SAAQ,CAACC,EAAMC,KAC/B,MAAMC,GAAgBD,EAAQ,GAAKN,EACnC,MAAMQ,EAAOhG,KAAKkF,UAAYa,EAC7BF,EAAqBI,aAAa,OAAQD,EAAO,OAAS,QAAQ,G,CAKvE,gBAAAE,GACElG,KAAKmF,kB,CAGP,MAAAnE,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAM,yBACVH,EAAA,QAAAE,IAAA,6C,iGCnCR,MAAMgF,EAA6B,syCACnC,MAAAC,EAAeD,E,MCMFE,EAAuB,MALpC,WAAAvG,CAAAC,G,UAO4BC,KAAAgG,KAAgB,K,CAE1C,MAAAhF,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAO,8BAA8BpB,KAAKgG,KAAO,OAAS,MAC9D/E,EAAA,QAAAE,IAAA,2CAAMC,MAAM,SACZH,EAAA,QAAAE,IAAA,2CAAMC,MAAM,QACVH,EAAA,OAAAE,IAAA,2CACEmF,MAAM,6BACNC,QAAQ,cACRC,MAAO,GACPC,OAAQ,IAEJxF,EAAA,QAAAE,IAAA,2CACEuF,KAAK,eACLC,EAAE,2LAIZ1F,EAAA,KAAAE,IAAA,2CAAGC,MAAM,SAAQH,EAAA,QAAAE,IAAA,8C,qCC5BzB,MAAMyF,EAAW,4gDACjB,MAAAC,EAAeD,E,MCMFE,EAAK,MALlB,WAAAhH,CAAAC,G,iDAMUC,KAAAyE,KAA2B,KAC3BzE,KAAA+G,MAAgB,GAChB/G,KAAAgH,GAAa,GACbhH,KAAAwB,SAAoB,MACpBxB,KAAAiH,UAAqB,K,CAG7B,YAAAC,CAAavC,GACX,GAAI3E,KAAKwB,SAAU,OAEnBxB,KAAKmH,WAAWtG,KAAK8D,E,CAGvB,MAAA3D,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHiG,MAAO,CAAEL,MAAO/G,KAAK+G,MAAOM,WAAYrH,KAAKgH,IAC7C5F,MAAO,UAAUpB,KAAKwB,SAAW,WAAa,MAAMxB,KAAKyE,QAEzDxD,EAAA,OAAAE,IAAA,2CAAKC,MAAM,kBACTH,EAAA,QAAAE,IAAA,8CAEDnB,KAAKiH,WACJhG,EAAA,UAAAE,IAAA,2CAAQkB,QAASrC,KAAKkH,aAAa5E,KAAKtC,MAAOoB,MAAM,iB,aC/B/D,MAAMkG,EAAe,y+EACrB,MAAAC,EAAeD,E,MCMFE,EAAS,MALtB,WAAA1H,CAAAC,G,UAaUC,KAAAyH,SAA4G,K,CAEpH,MAAAzG,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACuG,QAAS1H,KAAK2H,QAASvG,MAAO,cAAcpB,KAAKyH,YACrDxG,EAAA,QAAAE,IAAA,4CACEF,EAAA,OAAAE,IAAA,2CAAKmF,MAAM,6BAA6BC,QAAQ,cAAcC,MAAO,GAAIC,OAAQ,IAC/ExF,EAAA,QAAAE,IAAA,2CACEuF,KAAK,eACLC,EAAE,8T","ignoreList":[]}
|