xv-webcomponents 1.17.1-staging.0 → 1.17.3-dev.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/{xv-accordion-v2_45.cjs.entry.js → xv-accordion-v2_47.cjs.entry.js} +402 -67
- package/dist/cjs/xv-header-next.cjs.entry.js +1 -1
- package/dist/cjs/xv-mega-menu-next.cjs.entry.js +2 -2
- package/dist/cjs/xv-webcomponents.cjs.js +1 -1
- package/dist/collection/collection-manifest.json +2 -0
- package/dist/collection/components/xv-content-switcher/_vars.js +14 -0
- package/dist/collection/components/xv-content-switcher/xv-content-switcher-item/xv-content-switcher-item.css +134 -0
- package/dist/collection/components/xv-content-switcher/xv-content-switcher-item/xv-content-switcher-item.js +118 -0
- package/dist/collection/components/xv-content-switcher/xv-content-switcher.css +275 -0
- package/dist/collection/components/xv-content-switcher/xv-content-switcher.js +310 -0
- package/dist/collection/components/xv-data-table/xv-data-table-cell/xv-data-table-cell.js +1 -1
- package/dist/collection/components/xv-data-table/xv-data-table-collapse/xv-data-table-collapse.js +1 -1
- package/dist/collection/components/xv-data-table/xv-data-table-row/xv-data-table-row.js +2 -2
- package/dist/collection/components/xv-data-table/xv-data-table.js +1 -1
- package/dist/collection/components/xv-datepicker/xv-datepicker.css +4 -4
- package/dist/collection/components/xv-datepicker/xv-datepicker.js +2 -2
- package/dist/collection/components/xv-dropdown/xv-dropdown-item/xv-dropdown-item.js +1 -1
- package/dist/collection/components/xv-dropdown/xv-dropdown.css +23 -6
- package/dist/collection/components/xv-dropdown/xv-dropdown.js +205 -4
- package/dist/collection/components/xv-file-uploader/xv-file-uploader.js +1 -1
- package/dist/collection/components/xv-footer/xv-footer.js +1 -1
- package/dist/collection/components/xv-header/xv-header.js +1 -1
- package/dist/collection/components/xv-header-next/xv-header-next.js +1 -1
- package/dist/collection/components/xv-image-viewer/xv-image-viewer.js +1 -1
- package/dist/collection/components/xv-link/xv-link.js +1 -1
- package/dist/collection/components/xv-mega-menu/xv-mega-menu.js +2 -2
- package/dist/collection/components/xv-mega-menu-next/xv-mega-menu-next.js +2 -2
- package/dist/collection/components/xv-modal/xv-modal.js +1 -1
- package/dist/collection/components/xv-notification/xv-notification.js +1 -1
- package/dist/collection/components/xv-number-input/xv-number-input.css +6 -3
- package/dist/collection/components/xv-number-input/xv-number-input.js +2 -2
- package/dist/collection/components/xv-overflow-menu/xv-overflow-menu-item/xv-overflow-menu-item.js +1 -1
- package/dist/collection/components/xv-overflow-menu/xv-overflow-menu.js +2 -2
- package/dist/collection/components/xv-pagination/xv-pagination.js +1 -1
- package/dist/collection/components/xv-progress-indicator/xv-progress-indicator-item/xv-progress-indicator-item.js +1 -1
- package/dist/collection/components/xv-progress-indicator/xv-progress-indicator.js +1 -1
- package/dist/collection/components/xv-radio/xv-radio.css +2 -2
- package/dist/collection/components/xv-radio/xv-radio.js +2 -2
- package/dist/collection/components/xv-slider/xv-slider.css +2 -2
- package/dist/collection/components/xv-slider/xv-slider.js +1 -1
- package/dist/collection/components/xv-table/xv-table-cell/xv-table-cell.js +1 -1
- package/dist/collection/components/xv-table/xv-table-expand/xv-table-expand.js +1 -1
- package/dist/collection/components/xv-table/xv-table-row/xv-table-row.js +1 -1
- package/dist/collection/components/xv-table/xv-table.js +1 -1
- package/dist/collection/components/xv-tabs/xv-tab/xv-tab.js +1 -1
- package/dist/collection/components/xv-tag/xv-tag.js +1 -1
- package/dist/collection/components/xv-tag-combobox/xv-tag-combobox.css +2 -2
- package/dist/collection/components/xv-tag-combobox/xv-tag-combobox.js +2 -2
- package/dist/collection/components/xv-text-input/xv-text-input.css +1 -1
- package/dist/collection/components/xv-text-input/xv-text-input.js +2 -2
- package/dist/collection/components/xv-textarea/xv-textarea.css +2 -2
- package/dist/collection/components/xv-textarea/xv-textarea.js +2 -2
- package/dist/collection/components/xv-tile/xv-tile.js +2 -2
- package/dist/collection/components/xv-toggle/xv-toggle.js +1 -1
- package/dist/collection/components/xv-toggle-tip/xv-toggle-tip.js +1 -1
- package/dist/collection/components/xv-tooltip/xv-tooltip.js +2 -2
- package/dist/esm/loader.js +1 -1
- package/dist/esm/{xv-accordion-v2_45.entry.js → xv-accordion-v2_47.entry.js} +401 -68
- package/dist/esm/xv-header-next.entry.js +1 -1
- package/dist/esm/xv-mega-menu-next.entry.js +2 -2
- package/dist/esm/xv-webcomponents.js +1 -1
- package/dist/types/components/xv-content-switcher/_vars.d.ts +13 -0
- package/dist/types/components/xv-content-switcher/xv-content-switcher-item/xv-content-switcher-item.d.ts +32 -0
- package/dist/types/components/xv-content-switcher/xv-content-switcher.d.ts +78 -0
- package/dist/types/components/xv-dropdown/xv-dropdown.d.ts +24 -1
- package/dist/types/components.d.ts +249 -0
- package/dist/xv-webcomponents/{p-1b5a4f4c.entry.js → p-1cb6cc34.entry.js} +1 -1
- package/dist/xv-webcomponents/p-422065b1.entry.js +8 -0
- package/dist/xv-webcomponents/{p-50f8cd72.entry.js → p-dc64e134.entry.js} +1 -1
- package/dist/xv-webcomponents/xv-webcomponents.esm.js +1 -1
- package/package.json +1 -1
- package/dist/xv-webcomponents/p-593183a5.entry.js +0 -8
|
@@ -269,6 +269,164 @@ const XvCheckbox = class {
|
|
|
269
269
|
};
|
|
270
270
|
XvCheckbox.style = xvCheckboxCss();
|
|
271
271
|
|
|
272
|
+
const xvContentSwitcherItemCss = () => `.xv-container{width:100%;max-width:1170px;margin-inline:auto}@media (min-width: 576px){.xv-container{max-width:540px}}@media (min-width: 768px){.xv-container{max-width:720px}}@media (min-width: 992px){.xv-container{max-width:960px;padding-inline:var(--bs-gutter-x, 0.75rem)}}@media (min-width: 1200px){.xv-container{max-width:1140px}}@media (min-width: 1400px){.xv-container{max-width:1320px}}.xv-tooltip[role=tooltip]{position:absolute;background-color:var(--background-inverse, #333333);color:var(--text-on-color);padding:var(--spacing-03) var(--spacing-04);border-radius:3px;font-size:var(--fz-sm);z-index:999;min-width:min(150px, 90vw);max-width:min(400px, 90vw)}.xv-tooltip[role=tooltip]::after{content:"";position:absolute;width:0;height:0;border-style:solid}.xv-tooltip[role=tooltip][data-popper-placement=top]::after{bottom:-5px;left:50%;transform:translateX(-50%);border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-start]::after{bottom:-5px;left:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-end]::after{bottom:-5px;right:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom]::after{top:-5px;left:50%;transform:translateX(-50%);border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-start]::after{top:-5px;left:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-end]::after{top:-5px;right:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=left]::after{top:50%;right:-5px;transform:translateY(-50%);border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-start]::after{top:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-end]::after{bottom:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=right]::after{top:50%;left:-5px;transform:translateY(-50%);border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-start]::after{top:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-end]::after{bottom:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}:host{display:block;color:var(--text-primary, #131313);font-family:var(--ff-body, Work Sans), sans-serif;font-size:var(--fz-md, 14px);line-height:20px}`;
|
|
273
|
+
|
|
274
|
+
const XvContentSwitcherItem = class {
|
|
275
|
+
constructor(hostRef) {
|
|
276
|
+
registerInstance(this, hostRef);
|
|
277
|
+
/**
|
|
278
|
+
* Disable this single item.
|
|
279
|
+
*/
|
|
280
|
+
this.disabled = false;
|
|
281
|
+
}
|
|
282
|
+
render() {
|
|
283
|
+
return (h(Host, { key: 'f5941bc31bc62601e4cb19608cabe011befbcc85' }, h("slot", { key: 'c73c71ce1faeeff03050861ada57207b4e358426' })));
|
|
284
|
+
}
|
|
285
|
+
};
|
|
286
|
+
XvContentSwitcherItem.style = xvContentSwitcherItemCss();
|
|
287
|
+
|
|
288
|
+
var CONTENT_SWITCHER_TAGS;
|
|
289
|
+
(function (CONTENT_SWITCHER_TAGS) {
|
|
290
|
+
CONTENT_SWITCHER_TAGS["SWITCHER"] = "xv-content-switcher-v2";
|
|
291
|
+
CONTENT_SWITCHER_TAGS["ITEM"] = "xv-content-switcher-item-v2";
|
|
292
|
+
})(CONTENT_SWITCHER_TAGS || (CONTENT_SWITCHER_TAGS = {}));
|
|
293
|
+
/**
|
|
294
|
+
* Keys that move the selection inside the switcher (Carbon: automatic activation).
|
|
295
|
+
*/
|
|
296
|
+
const CONTENT_SWITCHER_NAV_KEYS = {
|
|
297
|
+
NEXT: ['ArrowRight', 'ArrowDown'],
|
|
298
|
+
PREV: ['ArrowLeft', 'ArrowUp'],
|
|
299
|
+
FIRST: ['Home'],
|
|
300
|
+
LAST: ['End'],
|
|
301
|
+
};
|
|
302
|
+
|
|
303
|
+
const xvContentSwitcherCss = () => `.xv-container{width:100%;max-width:1170px;margin-inline:auto}@media (min-width: 576px){.xv-container{max-width:540px}}@media (min-width: 768px){.xv-container{max-width:720px}}@media (min-width: 992px){.xv-container{max-width:960px;padding-inline:var(--bs-gutter-x, 0.75rem)}}@media (min-width: 1200px){.xv-container{max-width:1140px}}@media (min-width: 1400px){.xv-container{max-width:1320px}}.xv-tooltip[role=tooltip]{position:absolute;background-color:var(--background-inverse, #333333);color:var(--text-on-color);padding:var(--spacing-03) var(--spacing-04);border-radius:3px;font-size:var(--fz-sm);z-index:999;min-width:min(150px, 90vw);max-width:min(400px, 90vw)}.xv-tooltip[role=tooltip]::after{content:"";position:absolute;width:0;height:0;border-style:solid}.xv-tooltip[role=tooltip][data-popper-placement=top]::after{bottom:-5px;left:50%;transform:translateX(-50%);border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-start]::after{bottom:-5px;left:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-end]::after{bottom:-5px;right:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom]::after{top:-5px;left:50%;transform:translateX(-50%);border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-start]::after{top:-5px;left:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-end]::after{top:-5px;right:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=left]::after{top:50%;right:-5px;transform:translateY(-50%);border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-start]::after{top:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-end]::after{bottom:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=right]::after{top:50%;left:-5px;transform:translateY(-50%);border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-start]::after{top:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-end]::after{bottom:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}:host{display:inline-block;text-align:left;font-family:var(--ff-body, Work Sans), sans-serif}:host([block]){display:block}:host([block]) .switcher{display:grid}.switcher{display:inline-grid;grid-auto-flow:column;grid-auto-columns:1fr;align-items:stretch;border:1px solid var(--border-inverse, #131313);border-radius:4px;overflow:hidden}.switcher_item{all:unset;box-sizing:border-box;position:relative;min-width:0;display:inline-flex;align-items:center;justify-content:flex-start;gap:var(--spacing-03, 8px);cursor:pointer;color:var(--text-secondary, #515151);background-color:transparent;font-family:inherit;font-size:var(--fz-md, 14px);font-weight:400;line-height:18px;letter-spacing:0.16px;transition:background-color 0.2s ease, color 0.2s ease}.switcher_item+.switcher_item::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:1px;height:16px;background-color:var(--border-subtle-01, #d1d1d1)}.switcher_item-icon{display:inline-flex;align-items:center;justify-content:center;font-size:20px;line-height:1;color:var(--icon-primary, #131313)}.switcher_item-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.switcher_item:hover:not(.selected):not(:disabled){background-color:var(--background-hover, rgba(139, 139, 139, 0.12))}.switcher_item:focus-visible{outline:2px solid var(--focus, #0f62fe);outline-offset:-2px}.switcher_item.selected{background-color:var(--background-inverse, #333333);color:var(--text-inverse, #fff)}.switcher_item.selected .switcher_item-icon{color:var(--icon-on-color, #fff)}.switcher_item.selected:hover{background-color:var(--background-inverse-hover, #515151)}.switcher_item.selected::before,.switcher_item.selected+.switcher_item::before{display:none}.switcher_item:disabled{cursor:not-allowed;color:var(--text-disabled, rgba(19, 19, 19, 0.25))}.switcher_item:disabled .switcher_item-icon{color:var(--icon-disabled, rgba(19, 19, 19, 0.25))}.switcher_item:disabled.selected{background-color:var(--button-disabled, #d1d1d1);color:var(--text-disabled, rgba(19, 19, 19, 0.25))}.switcher_item:disabled.selected .switcher_item-icon{color:var(--icon-on-color-disabled, #8b8b8b)}.switcher_content:focus{outline:none}:host([disabled]) .switcher{border-color:var(--border-disabled, #d1d1d1)}:host([disabled]) .switcher .switcher_item::before{background-color:var(--border-disabled, #d1d1d1)}::slotted(xv-content-switcher-item-v2){display:none}::slotted(xv-content-switcher-item-v2.active){display:block}:host([size=sm]) .switcher_item{padding:7px var(--spacing-05, 16px)}:host(:not([size])) .switcher_item,:host([size=md]) .switcher_item{padding:11px var(--spacing-05, 16px)}:host([size=lg]) .switcher_item{padding:15px var(--spacing-05, 16px)}:host([icon-only]) .switcher_item{justify-content:center;gap:0}:host([icon-only][size=sm]) .switcher_item{padding:8px}:host([icon-only]:not([size])) .switcher_item,:host([icon-only][size=md]) .switcher_item{padding:12px}:host([icon-only][size=lg]) .switcher_item{padding:14px}`;
|
|
304
|
+
|
|
305
|
+
const XvContentSwitcher = class {
|
|
306
|
+
constructor(hostRef) {
|
|
307
|
+
registerInstance(this, hostRef);
|
|
308
|
+
this.selectedChange = createEvent(this, "selectedChange", 7);
|
|
309
|
+
/**
|
|
310
|
+
* Control size. Only `sm`, `md` and `lg` are supported (defaults to `md`).
|
|
311
|
+
*/
|
|
312
|
+
this.size = SIZE_VAR.MD;
|
|
313
|
+
/**
|
|
314
|
+
* Render items as icon-only buttons (the item `label` is used as the accessible name).
|
|
315
|
+
*/
|
|
316
|
+
this.iconOnly = false;
|
|
317
|
+
/**
|
|
318
|
+
* Disable the whole switcher.
|
|
319
|
+
*/
|
|
320
|
+
this.disabled = false;
|
|
321
|
+
/**
|
|
322
|
+
* Stretch the switcher to the full width of its container.
|
|
323
|
+
*/
|
|
324
|
+
this.block = false;
|
|
325
|
+
/**
|
|
326
|
+
* Controlled mode. When `true`, clicking/keyboard navigation does NOT change
|
|
327
|
+
* the selection on its own — it only emits `selectedChange` with the requested
|
|
328
|
+
* value. The consumer fully owns `selected` and decides whether to commit it
|
|
329
|
+
* (e.g. after an async confirmation), so a switch can be vetoed without flicker.
|
|
330
|
+
*/
|
|
331
|
+
this.controlled = false;
|
|
332
|
+
/**
|
|
333
|
+
* Collected `xv-content-switcher-item-v2` children.
|
|
334
|
+
*/
|
|
335
|
+
this.items = [];
|
|
336
|
+
this.collectItems = () => {
|
|
337
|
+
this.items = Array.from(this.el.querySelectorAll(CONTENT_SWITCHER_TAGS.ITEM));
|
|
338
|
+
// Default to the first item when nothing valid is selected yet.
|
|
339
|
+
if (!this.isSelectionValid()) {
|
|
340
|
+
const firstEnabled = this.items.findIndex((item) => !this.isItemDisabled(item));
|
|
341
|
+
if (firstEnabled !== -1)
|
|
342
|
+
this.selected = this.getItemKey(this.items[firstEnabled], firstEnabled);
|
|
343
|
+
}
|
|
344
|
+
};
|
|
345
|
+
this.handleKeyDown = (event, index) => {
|
|
346
|
+
var _a, _b;
|
|
347
|
+
const { NEXT, PREV, FIRST, LAST } = CONTENT_SWITCHER_NAV_KEYS;
|
|
348
|
+
let nextIndex = null;
|
|
349
|
+
if (NEXT.includes(event.key))
|
|
350
|
+
nextIndex = this.findEnabled(index + 1, 1);
|
|
351
|
+
else if (PREV.includes(event.key))
|
|
352
|
+
nextIndex = this.findEnabled(index - 1, -1);
|
|
353
|
+
else if (FIRST.includes(event.key))
|
|
354
|
+
nextIndex = this.findEnabled(0, 1);
|
|
355
|
+
else if (LAST.includes(event.key))
|
|
356
|
+
nextIndex = this.findEnabled(this.items.length - 1, -1);
|
|
357
|
+
else
|
|
358
|
+
return;
|
|
359
|
+
event.preventDefault();
|
|
360
|
+
if (nextIndex === null)
|
|
361
|
+
return;
|
|
362
|
+
this.select(this.getItemKey(this.items[nextIndex], nextIndex));
|
|
363
|
+
// Move focus to the newly selected button (roving tabindex).
|
|
364
|
+
const buttons = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelectorAll('.switcher_item');
|
|
365
|
+
(_b = buttons === null || buttons === void 0 ? void 0 : buttons[nextIndex]) === null || _b === void 0 ? void 0 : _b.focus();
|
|
366
|
+
};
|
|
367
|
+
}
|
|
368
|
+
componentWillLoad() {
|
|
369
|
+
// `slotchange` handles dynamic updates; collect once up front for the
|
|
370
|
+
// items present at load so the first render already has its buttons.
|
|
371
|
+
this.collectItems();
|
|
372
|
+
}
|
|
373
|
+
componentDidRender() {
|
|
374
|
+
// Mirror the selected state onto the slotted items so their content panels
|
|
375
|
+
// show/hide (see `::slotted(...active)` in the stylesheet).
|
|
376
|
+
this.updateItemsState();
|
|
377
|
+
}
|
|
378
|
+
getItemKey(item, index) {
|
|
379
|
+
const value = item.getAttribute('value');
|
|
380
|
+
return value !== null && value !== '' ? value : index;
|
|
381
|
+
}
|
|
382
|
+
isItemDisabled(item) {
|
|
383
|
+
return this.disabled || item.hasAttribute('disabled');
|
|
384
|
+
}
|
|
385
|
+
isSelected(item, index) {
|
|
386
|
+
return this.selected !== undefined && `${this.getItemKey(item, index)}` === `${this.selected}`;
|
|
387
|
+
}
|
|
388
|
+
isSelectionValid() {
|
|
389
|
+
return this.items.some((item, index) => this.isSelected(item, index));
|
|
390
|
+
}
|
|
391
|
+
select(key) {
|
|
392
|
+
if (this.disabled || `${key}` === `${this.selected}`)
|
|
393
|
+
return;
|
|
394
|
+
// In controlled mode the consumer owns `selected`; only announce the intent.
|
|
395
|
+
if (!this.controlled)
|
|
396
|
+
this.selected = key;
|
|
397
|
+
this.selectedChange.emit(key);
|
|
398
|
+
}
|
|
399
|
+
/** Reflect the `active` class on items so their slotted content shows/hides. */
|
|
400
|
+
updateItemsState() {
|
|
401
|
+
this.items.forEach((item, index) => {
|
|
402
|
+
if (this.isSelected(item, index))
|
|
403
|
+
item.classList.add('active');
|
|
404
|
+
else
|
|
405
|
+
item.classList.remove('active');
|
|
406
|
+
});
|
|
407
|
+
}
|
|
408
|
+
/** Find the next non-disabled item starting at `from`, walking by `step`. */
|
|
409
|
+
findEnabled(from, step) {
|
|
410
|
+
for (let i = from; i >= 0 && i < this.items.length; i += step) {
|
|
411
|
+
if (!this.isItemDisabled(this.items[i]))
|
|
412
|
+
return i;
|
|
413
|
+
}
|
|
414
|
+
return null;
|
|
415
|
+
}
|
|
416
|
+
render() {
|
|
417
|
+
return (h(Host, { key: '2f783317e906b04632e2666b27956c3d772f2979' }, h("div", { key: '9f008bfcd3a6e8e075a14b13dbcb406d97db7fff', class: "switcher", role: "tablist", "aria-orientation": "horizontal" }, this.items.map((item, index) => {
|
|
418
|
+
const key = this.getItemKey(item, index);
|
|
419
|
+
const selected = this.isSelected(item, index);
|
|
420
|
+
const itemDisabled = this.isItemDisabled(item);
|
|
421
|
+
const label = item.getAttribute('label') || '';
|
|
422
|
+
const icon = item.getAttribute('icon');
|
|
423
|
+
return (h("button", { type: "button", role: "tab", class: { switcher_item: true, selected }, "aria-selected": selected ? 'true' : 'false', "aria-label": this.iconOnly ? label || undefined : undefined, title: this.iconOnly ? label || undefined : undefined, disabled: itemDisabled, tabIndex: selected ? 0 : -1, onClick: () => this.select(key), onKeyDown: (event) => this.handleKeyDown(event, index) }, icon && h("i", { class: `switcher_item-icon ${icon}`, "aria-hidden": "true" }), !this.iconOnly && label && h("span", { class: "switcher_item-label" }, label)));
|
|
424
|
+
})), h("div", { key: 'ab00606b5b8d464ef1eb564030478191128319ae', class: "switcher_content", role: "tabpanel", tabindex: -1 }, h("slot", { key: '3977d4f17947f12f586fe4bbe0f1f9c81ef1ad18', onSlotchange: this.collectItems }))));
|
|
425
|
+
}
|
|
426
|
+
get el() { return getElement(this); }
|
|
427
|
+
};
|
|
428
|
+
XvContentSwitcher.style = xvContentSwitcherCss();
|
|
429
|
+
|
|
272
430
|
/**!
|
|
273
431
|
* Sortable 1.15.7
|
|
274
432
|
* @author RubaXa <trash@rubaxa.org>
|
|
@@ -3028,7 +3186,7 @@ const XvDataTable = class {
|
|
|
3028
3186
|
this.initSortable();
|
|
3029
3187
|
}
|
|
3030
3188
|
render() {
|
|
3031
|
-
return (h(Host, { key: '
|
|
3189
|
+
return (h(Host, { key: 'aef386c711cc3ae043d1228cac0b87737f9b70f1', class: "xv-data-table" }, h("caption", { key: 'a6577aba4dbbc50f6c953e25b533585b01d188ac' }, h("slot", { key: '02b1c865868d5fae89a558d35f7f7047cfd3ed3e', name: "title" })), h("div", { key: '19466d4e9e89a628d9df5ced1ac73c72d77650d2', class: "bar" }, h("div", { key: 'ec12712ac2b23d1f5ec2efe97cc5f5849e22808d', class: "bar_batch" }, h("slot", { key: '88e51529ecaffbda842b143e59caf60250ea3f66', name: "batch" })), h("div", { key: '3d7faf0d529a73e62a7e6e9ba567b9359c1ad795', class: "bar_toolbar" }, h("slot", { key: '1b4b5d8309eb02c98319be1b5b2c2fb9bf3b4b71', name: "toolbar" }))), h("table", { key: '7a3fc93e97d5e0cdc6a6a913609732e17f28aa01', role: "table" }, this.columnWidths.length > 0 && (h("colgroup", { key: '3ba295f8bfd44c1cc38c20c00131ce9ecb72e531' }, this.columnWidths.map((width = 'auto') => h("col", { style: { width } })))), h("thead", { key: 'a559bfeb5663ffcc0e4498a4efb667c85cb4b38d' }, h("slot", { key: 'aa87d90376a00bff11290ff41798162fae2a56a5', name: "header" })), h("tbody", { key: 'b8c6f100aa44110756317925b63fefbd44592e6b' }, h("slot", { key: 'e80e2461de26f46ccdef560d3bbd4357403a3a2e' })), h("tfoot", { key: '7a456ccbc039cd954417e7eb4880947e6199a8b3' }, h("slot", { key: 'ad358cf3e113802cf297bcd01d02ced5bbcd9cdf', name: "footer" }))), !!this.loading && (h("div", { key: 'f4b8dad2f9dea6da37797a41c3258c08b5d98761', class: "loading" }, h("xv-loader-v2", { key: '49d3273a7b869bb94584e3dac6f4099a404d1697', size: SIZE_VAR.LG })))));
|
|
3032
3190
|
}
|
|
3033
3191
|
get el() { return getElement(this); }
|
|
3034
3192
|
static get watchers() { return {
|
|
@@ -3069,7 +3227,7 @@ const XvDataTableCell = class {
|
|
|
3069
3227
|
}
|
|
3070
3228
|
;
|
|
3071
3229
|
render() {
|
|
3072
|
-
return (h(Host, { key: '
|
|
3230
|
+
return (h(Host, { key: '4c47f740484cd42899ed300c2300a4955767e494', role: "cell", style: { width: this.width }, class: {
|
|
3073
3231
|
multiline: this.multiline !== undefined,
|
|
3074
3232
|
[`align--${this.align}`]: !!this.align
|
|
3075
3233
|
} }, !this.multiline || isNaN(this.multiline) ? this.__renderWithTooltip() : (h("div", { class: "line-clamp", style: { ['-webkit-line-clamp']: `${this.multiline}` } }, this.__renderWithTooltip()))));
|
|
@@ -3102,7 +3260,7 @@ const XvDataTableCollapse = class {
|
|
|
3102
3260
|
rows.forEach((row) => row === null || row === void 0 ? void 0 : row.setAttribute('collapsable', ''));
|
|
3103
3261
|
}
|
|
3104
3262
|
render() {
|
|
3105
|
-
return (h(Host, { key: '
|
|
3263
|
+
return (h(Host, { key: 'b4b9610e77edd0a4eb5669784a12df6c06d57398', id: this.el.id, part: "xv-collapse", class: this.el.className, collapsed: this.collapsed, expanded: !this.collapsed }, h("slot", { key: 'b6aa331515b8bcd5884f9b72e6fd46515adadf3c' })));
|
|
3106
3264
|
}
|
|
3107
3265
|
get el() { return getElement(this); }
|
|
3108
3266
|
};
|
|
@@ -3185,7 +3343,7 @@ const XvDataTableRow = class {
|
|
|
3185
3343
|
const isGroup = !!this.collapse || !!this.group;
|
|
3186
3344
|
const isDraggableRow = this.reorderable && !isHeader && !isFooter && !this.group;
|
|
3187
3345
|
const showHandleCell = this.reorderable && this.reorderHandleMode === 'icon';
|
|
3188
|
-
return (h(Host, { key: '
|
|
3346
|
+
return (h(Host, { key: '220e41fb2db763b39ac56de16fa305226fef268b', role: "row", part: "xv-row", class: {
|
|
3189
3347
|
checked: this.checked,
|
|
3190
3348
|
hover: this.hover,
|
|
3191
3349
|
disabled: this.disabled,
|
|
@@ -3193,7 +3351,7 @@ const XvDataTableRow = class {
|
|
|
3193
3351
|
header: isHeader,
|
|
3194
3352
|
footer: isFooter,
|
|
3195
3353
|
'reorder-row': isDraggableRow && this.reorderHandleMode === 'row',
|
|
3196
|
-
} }, showHandleCell && (h("xv-data-table-cell", { key: '
|
|
3354
|
+
} }, showHandleCell && (h("xv-data-table-cell", { key: 'c9d60451fb1781b94c2df312713173953c77998c', width: "16px", class: "cell-control cell-control--drag" }, isDraggableRow && (h("span", { key: '06f681f0aa1fad4d798aa84ad7123b55f5aaa7c5', class: `cell-control_drag ${XV_ROW_DRAG_HANDLE_CLASS}`, "aria-label": "Drag to reorder" }, h("svg", { key: '5f6bd2e58cd7dca1f1843c4b8868409cb7144023', viewBox: "0 0 8 14", width: "8", height: "14", fill: "currentColor", "aria-hidden": "true" }, h("circle", { key: '87b663ee0b2ac198cb69476814a2c097d6b1d2c9', cx: "2", cy: "2", r: "1.2" }), h("circle", { key: '3917cefb67ebcd2b8c26df7b9d4a2e1ad5023bc0', cx: "6", cy: "2", r: "1.2" }), h("circle", { key: '1f1778da1585511f8d9dd0ca4bcc8558e0610574', cx: "2", cy: "7", r: "1.2" }), h("circle", { key: '3e090df05f5eef959e4237213d2df95cd2c758c6', cx: "6", cy: "7", r: "1.2" }), h("circle", { key: 'f2c3c6e39482536f968fb3dfe2da518035388189', cx: "2", cy: "12", r: "1.2" }), h("circle", { key: 'be761faf2e9741c520e89e84b3c6d5c71d44826e', cx: "6", cy: "12", r: "1.2" })))))), (!!this.variant || this.collapsable) && (h("xv-data-table-cell", { key: '8d028993f15499799658c5c3f34be69b1eee807f', width: !!this.variant ? '16px' : '0', class: "cell-control" }, !!this.collapse && (h("button", { key: '29e7e558765f1c9b034b37f2cee10784662924c4', class: { 'cell-control_collapse': true, open: !this.collapsed }, onClick: this.collapseClick })), this.variant === 'checkbox' && (h("xv-checkbox-v2", { key: '062b73dfe88f5591975a5996e5bfa5b76faec1c0', name: this.name, partial: this.partial, checked: this.checked || this.partial, disabled: this.disabled, readonly: this.readonly, required: this.required, onEventChange: this.checkedChangeHandle, class: "cell-control_checkbox" })))), h("slot", { key: 'c9011f9b8ef09affaf7c707e554fdeff6e28943e', onSlotchange: this.setInitialState })));
|
|
3197
3355
|
}
|
|
3198
3356
|
get el() { return getElement(this); }
|
|
3199
3357
|
};
|
|
@@ -78579,7 +78737,7 @@ function contains(parent, child) {
|
|
|
78579
78737
|
return false;
|
|
78580
78738
|
}
|
|
78581
78739
|
|
|
78582
|
-
function getComputedStyle(element) {
|
|
78740
|
+
function getComputedStyle$1(element) {
|
|
78583
78741
|
return getWindow(element).getComputedStyle(element);
|
|
78584
78742
|
}
|
|
78585
78743
|
|
|
@@ -78612,7 +78770,7 @@ function getParentNode(element) {
|
|
|
78612
78770
|
|
|
78613
78771
|
function getTrueOffsetParent(element) {
|
|
78614
78772
|
if (!isHTMLElement(element) || // https://github.com/popperjs/popper-core/issues/837
|
|
78615
|
-
getComputedStyle(element).position === 'fixed') {
|
|
78773
|
+
getComputedStyle$1(element).position === 'fixed') {
|
|
78616
78774
|
return null;
|
|
78617
78775
|
}
|
|
78618
78776
|
|
|
@@ -78627,7 +78785,7 @@ function getContainingBlock(element) {
|
|
|
78627
78785
|
|
|
78628
78786
|
if (isIE && isHTMLElement(element)) {
|
|
78629
78787
|
// In IE 9, 10 and 11 fixed elements containing block is always established by the viewport
|
|
78630
|
-
var elementCss = getComputedStyle(element);
|
|
78788
|
+
var elementCss = getComputedStyle$1(element);
|
|
78631
78789
|
|
|
78632
78790
|
if (elementCss.position === 'fixed') {
|
|
78633
78791
|
return null;
|
|
@@ -78641,7 +78799,7 @@ function getContainingBlock(element) {
|
|
|
78641
78799
|
}
|
|
78642
78800
|
|
|
78643
78801
|
while (isHTMLElement(currentNode) && ['html', 'body'].indexOf(getNodeName(currentNode)) < 0) {
|
|
78644
|
-
var css = getComputedStyle(currentNode); // This is non-exhaustive but covers the most common CSS properties that
|
|
78802
|
+
var css = getComputedStyle$1(currentNode); // This is non-exhaustive but covers the most common CSS properties that
|
|
78645
78803
|
// create a containing block.
|
|
78646
78804
|
// https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
|
|
78647
78805
|
|
|
@@ -78661,11 +78819,11 @@ function getOffsetParent(element) {
|
|
|
78661
78819
|
var window = getWindow(element);
|
|
78662
78820
|
var offsetParent = getTrueOffsetParent(element);
|
|
78663
78821
|
|
|
78664
|
-
while (offsetParent && isTableElement(offsetParent) && getComputedStyle(offsetParent).position === 'static') {
|
|
78822
|
+
while (offsetParent && isTableElement(offsetParent) && getComputedStyle$1(offsetParent).position === 'static') {
|
|
78665
78823
|
offsetParent = getTrueOffsetParent(offsetParent);
|
|
78666
78824
|
}
|
|
78667
78825
|
|
|
78668
|
-
if (offsetParent && (getNodeName(offsetParent) === 'html' || getNodeName(offsetParent) === 'body' && getComputedStyle(offsetParent).position === 'static')) {
|
|
78826
|
+
if (offsetParent && (getNodeName(offsetParent) === 'html' || getNodeName(offsetParent) === 'body' && getComputedStyle$1(offsetParent).position === 'static')) {
|
|
78669
78827
|
return window;
|
|
78670
78828
|
}
|
|
78671
78829
|
|
|
@@ -78850,7 +79008,7 @@ function mapToStyles(_ref2) {
|
|
|
78850
79008
|
if (offsetParent === getWindow(popper)) {
|
|
78851
79009
|
offsetParent = getDocumentElement(popper);
|
|
78852
79010
|
|
|
78853
|
-
if (getComputedStyle(offsetParent).position !== 'static' && position === 'absolute') {
|
|
79011
|
+
if (getComputedStyle$1(offsetParent).position !== 'static' && position === 'absolute') {
|
|
78854
79012
|
heightProp = 'scrollHeight';
|
|
78855
79013
|
widthProp = 'scrollWidth';
|
|
78856
79014
|
}
|
|
@@ -79082,7 +79240,7 @@ function getDocumentRect(element) {
|
|
|
79082
79240
|
var x = -winScroll.scrollLeft + getWindowScrollBarX(element);
|
|
79083
79241
|
var y = -winScroll.scrollTop;
|
|
79084
79242
|
|
|
79085
|
-
if (getComputedStyle(body || html).direction === 'rtl') {
|
|
79243
|
+
if (getComputedStyle$1(body || html).direction === 'rtl') {
|
|
79086
79244
|
x += max(html.clientWidth, body ? body.clientWidth : 0) - width;
|
|
79087
79245
|
}
|
|
79088
79246
|
|
|
@@ -79096,7 +79254,7 @@ function getDocumentRect(element) {
|
|
|
79096
79254
|
|
|
79097
79255
|
function isScrollParent(element) {
|
|
79098
79256
|
// Firefox wants us to check `-x` and `-y` variations as well
|
|
79099
|
-
var _getComputedStyle = getComputedStyle(element),
|
|
79257
|
+
var _getComputedStyle = getComputedStyle$1(element),
|
|
79100
79258
|
overflow = _getComputedStyle.overflow,
|
|
79101
79259
|
overflowX = _getComputedStyle.overflowX,
|
|
79102
79260
|
overflowY = _getComputedStyle.overflowY;
|
|
@@ -79171,7 +79329,7 @@ function getClientRectFromMixedType(element, clippingParent, strategy) {
|
|
|
79171
79329
|
|
|
79172
79330
|
function getClippingParents(element) {
|
|
79173
79331
|
var clippingParents = listScrollParents(getParentNode(element));
|
|
79174
|
-
var canEscapeClipping = ['absolute', 'fixed'].indexOf(getComputedStyle(element).position) >= 0;
|
|
79332
|
+
var canEscapeClipping = ['absolute', 'fixed'].indexOf(getComputedStyle$1(element).position) >= 0;
|
|
79175
79333
|
var clipperElement = canEscapeClipping && isHTMLElement(element) ? getOffsetParent(element) : element;
|
|
79176
79334
|
|
|
79177
79335
|
if (!isElement(clipperElement)) {
|
|
@@ -80106,7 +80264,7 @@ var createPopper = /*#__PURE__*/popperGenerator({
|
|
|
80106
80264
|
defaultModifiers: defaultModifiers
|
|
80107
80265
|
}); // eslint-disable-next-line import/no-unused-modules
|
|
80108
80266
|
|
|
80109
|
-
const xvDatepickerCss = () => `@charset "UTF-8";.xv-container{width:100%;max-width:1170px;margin-inline:auto}@media (min-width: 576px){.xv-container{max-width:540px}}@media (min-width: 768px){.xv-container{max-width:720px}}@media (min-width: 992px){.xv-container{max-width:960px;padding-inline:var(--bs-gutter-x, 0.75rem)}}@media (min-width: 1200px){.xv-container{max-width:1140px}}@media (min-width: 1400px){.xv-container{max-width:1320px}}.xv-tooltip[role=tooltip]{position:absolute;background-color:var(--background-inverse, #333333);color:var(--text-on-color);padding:var(--spacing-03) var(--spacing-04);border-radius:3px;font-size:var(--fz-sm);z-index:999;min-width:min(150px, 90vw);max-width:min(400px, 90vw)}.xv-tooltip[role=tooltip]::after{content:"";position:absolute;width:0;height:0;border-style:solid}.xv-tooltip[role=tooltip][data-popper-placement=top]::after{bottom:-5px;left:50%;transform:translateX(-50%);border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-start]::after{bottom:-5px;left:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-end]::after{bottom:-5px;right:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom]::after{top:-5px;left:50%;transform:translateX(-50%);border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-start]::after{top:-5px;left:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-end]::after{top:-5px;right:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=left]::after{top:50%;right:-5px;transform:translateY(-50%);border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-start]::after{top:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-end]::after{bottom:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=right]::after{top:50%;left:-5px;transform:translateY(-50%);border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-start]::after{top:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-end]::after{bottom:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}:host{--xv-datepicker-padding:var(--spacing-04);--xv-datepicker-fields-direction:row;display:inline-block;font-size:var(--fz-md, 14px)}:host .control{display:flex;flex-direction:column;row-gap:var(--spacing-03);text-align:left;letter-spacing:0.32px}:host .control_label{color:var(--text-secondary, #515151);font-size:0.8571428571em;font-weight:700}:host .control_field{position:relative;display:flex;gap:var(--spacing-03);flex-direction:var(--xv-datepicker-fields-direction, row)}:host .control_field input[type=date]{flex:1 1 0;border-radius:3px;color:var(--text-primary, #333);font-family:var(--ff-body);font-size:1em;background-color:transparent;font-style:normal;font-weight:400;line-height:20px;letter-spacing:0.32px;padding:var(--xv-datepicker-padding) calc(var(--spacing-05) + 20px) var(--xv-datepicker-padding) var(--spacing-05);border:1px solid var(--border-subtle-01);box-shadow:none;outline:2px solid transparent;transition:0.25s ease-in-out outline-color;appearance:none}:host .control_field input[type=date]:empty{color:var(--text-helper, #646464)}:host .control_field input[type=date]:focus{outline-color:var(--focus)}:host .control_field input[type=date]::-webkit-calendar-picker-indicator{visibility:hidden;opacity:0;appearance:none;pointer-events:none;display:none}:host .control_field:before{font-size:16px;width:16px;height:16px;top:calc(var(--xv-datepicker-padding) + 4px);right:var(--spacing-04);position:absolute;content:"";box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 24 24'%3E%3Cpath d='M19 4h-1V2h-2v2H8V2H6v2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 16H5V9h14v11zm0-13H5V6h14v1z'/%3E%3C/svg%3E")}@supports not selector(::-webkit-calendar-picker-indicator){:host .control_field:before{background-image:none}}:host .control_field.warning,:host .control_field.error,:host .control_field.loading{position:relative}:host .control_field.warning:before,:host .control_field.error:before,:host .control_field.loading:before{background-image:none}:host .control_field.warning:before{content:"⚠";color:var(--support-warning)}:host .control_field.error:before{font-size:12px;border-radius:50%;content:"!";color:#fff;background-color:var(--support-error)}:host .control_field.error input[type=date]{outline-color:var(--support-error);border:1px solid var(--support-error)}:host .control_field.loading{}@keyframes spin{to{transform:rotate(360deg)}}:host .control_field.loading:before{content:"";background-color:transparent;border-radius:50%;border:3px solid rgba(0, 0, 0, 0.1);border-top-color:var(--highlight-01, #CEDE94);animation:spin 0.8s linear infinite}:host .control_message{font-size:0.8571428571em;color:var(--text-primary, #333);margin:0;padding:0}:host .control_message.error{color:var(--text-error, #D62512)}:host .control_message.helper{color:var(--text-secondary, #515151)}:host .popover{opacity:1;z-index:12;position:absolute;max-width:fit-content;box-sizing:border-box;display:inline-flex;flex-direction:column;background-color:var(--layer-02, #fff);border-radius:3px;box-shadow:0 4px 8px 3px rgba(39, 52, 53, 0.15), 0 1px 3px 0 rgba(39, 52, 53, 0.3);padding:var(--spacing-02) var(--spacing-03);row-gap:var(--spacing-02, 4px)}:host .popover:not(.open){opacity:0;z-index:-1;user-select:none;pointer-events:none;top:0;left:0;transform:translateY(-9999px)}:host .popover .header{display:grid;width:100%;grid-template-columns:auto 1fr auto;column-gap:var(--spacing-03)}:host .popover .header_date{margin:0;padding:0;display:flex;align-items:center;justify-content:center;text-transform:capitalize;color:var(--text-primary, #333);text-align:center;font-family:var(--ff-body);font-size:1em;font-weight:700;letter-spacing:0.16px}:host .popover .header_date input[type=number]{display:inline-block;padding:0.25rem;border:none;margin:0 0 0 var(--spacing-02);cursor:default;font-family:inherit;font-size:inherit;font-weight:600;inline-size:3.75em;border-radius:3px}:host .popover .header_date input[type=number]:focus{outline:1px solid var(--focus)}:host .popover .header_icon{display:inline-block;position:relative;border:solid currentColor;padding:5px;border-width:0 2px 2px 0}:host .popover .header_icon.prev{transform:translate(4px) rotate(135deg)}:host .popover .header_icon.next{transform:translate(-4px) rotate(-45deg)}:host .popover .week{display:grid;width:100%;grid-template-columns:repeat(8, 1fr)}:host .popover .week_day{width:40px;line-height:40px;margin:0;padding:0;box-sizing:border-box;color:var(--text-primary, #333);font-family:var(--ff-body);font-size:1em;letter-spacing:0.16px;user-select:none}:host .popover .week_day:is(button){background-color:transparent;border:none;outline:none;transition:250ms ease-in-out background-color, 250ms ease-in-out color}:host .popover .week_day:is(button):hover:not(:disabled){cursor:pointer;background-color:var(--layer-hover-01, #E9E9E9)}:host .popover .week_day:is(button):focus:not(:disabled){cursor:pointer;outline:1px solid var(--focus, #273435);background-blend-mode:multiply}:host .popover .week_day:is(button):active:not(:disabled){background-color:rgba(139, 139, 139, 0.5)}:host .popover .week_day:is(button).inRange:not(.disabled):not(.active){background-color:var(--highlight-01, #CEDE94)}:host .popover .week_day:is(button).active{background-color:var(--button-primary, #273435);color:var(--text-on-color, #fff);z-index:1}:host .popover .week_day:is(button).active:hover{background-color:var(--button-primary-hover, #303F40)}:host .popover .week_day:is(button).active:active{background-color:var(--button-primary-active, #455D5E)}:host .popover .week_day.isToday{position:relative;font-weight:bold}:host .popover .week_day.isToday:before{content:"";position:absolute;bottom:2px;left:calc(50% - 2px);display:inline-block;width:4px;height:4px;border-radius:2px;background-color:currentColor}:host .popover .week_day.disabled{color:var(--text-placeholder, #ACACAC)}:host .popover .week_day__mobile{display:none}@media screen and (max-width: 920px){:host .popover .week_day__mobile{display:inline-block}}:host .popover .week_day__desktop{display:inline-block}@media screen and (max-width: 920px){:host .popover .week_day__desktop{display:none}}:host([block]){display:block;max-width:unset}:host(.disabled) .control_message,:host(.disabled) .control_field input[type=date],:host(.disabled) .control_label{color:var(--text-disabled, rgba(19, 19, 19, 0.25))}:host(.disabled) .control_field:before{opacity:0.4}:host([size=xs]){--xv-datepicker-padding:var(--spacing-02, 4px);font-size:var(--fz-sm)}:host([size=sm]){--xv-datepicker-padding:var(--spacing-03, 8px)}:host([size=md]){--xv-datepicker-padding:var(--spacing-04, 12px)}:host([size=lg]){--xv-datepicker-padding:var(--spacing-05, 16px)}:host([size=xl]){--xv-datepicker-padding:var(--spacing-06, 24px);font-size:var(--fz-lg)}`;
|
|
80267
|
+
const xvDatepickerCss = () => `@charset "UTF-8";.xv-container{width:100%;max-width:1170px;margin-inline:auto}@media (min-width: 576px){.xv-container{max-width:540px}}@media (min-width: 768px){.xv-container{max-width:720px}}@media (min-width: 992px){.xv-container{max-width:960px;padding-inline:var(--bs-gutter-x, 0.75rem)}}@media (min-width: 1200px){.xv-container{max-width:1140px}}@media (min-width: 1400px){.xv-container{max-width:1320px}}.xv-tooltip[role=tooltip]{position:absolute;background-color:var(--background-inverse, #333333);color:var(--text-on-color);padding:var(--spacing-03) var(--spacing-04);border-radius:3px;font-size:var(--fz-sm);z-index:999;min-width:min(150px, 90vw);max-width:min(400px, 90vw)}.xv-tooltip[role=tooltip]::after{content:"";position:absolute;width:0;height:0;border-style:solid}.xv-tooltip[role=tooltip][data-popper-placement=top]::after{bottom:-5px;left:50%;transform:translateX(-50%);border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-start]::after{bottom:-5px;left:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-end]::after{bottom:-5px;right:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom]::after{top:-5px;left:50%;transform:translateX(-50%);border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-start]::after{top:-5px;left:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-end]::after{top:-5px;right:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=left]::after{top:50%;right:-5px;transform:translateY(-50%);border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-start]::after{top:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-end]::after{bottom:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=right]::after{top:50%;left:-5px;transform:translateY(-50%);border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-start]::after{top:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-end]::after{bottom:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}:host{--xv-datepicker-padding:var(--spacing-04);--xv-datepicker-fields-direction:row;display:inline-block;font-size:var(--fz-md, 14px)}:host .control{display:flex;flex-direction:column;row-gap:var(--spacing-03);text-align:left;letter-spacing:0.32px}:host .control_label{color:var(--text-secondary, #515151);font-size:0.8571428571em;font-weight:400}:host .control_field{position:relative;display:flex;gap:var(--spacing-03);flex-direction:var(--xv-datepicker-fields-direction, row)}:host .control_field input[type=date]{flex:1 1 0;border-radius:3px;color:var(--text-primary, #333);font-family:var(--ff-body), sans-serif;font-size:1em;background-color:transparent;font-style:normal;font-weight:400;line-height:20px;letter-spacing:0.32px;padding:var(--xv-datepicker-padding) calc(var(--spacing-05) + 20px) var(--xv-datepicker-padding) var(--spacing-05);border:1px solid var(--border-subtle-01);box-shadow:none;outline:2px solid transparent;transition:0.25s ease-in-out outline-color;appearance:none}:host .control_field input[type=date]:empty{color:var(--text-helper, #646464)}:host .control_field input[type=date]:focus{outline-color:var(--focus)}:host .control_field input[type=date]::-webkit-calendar-picker-indicator{visibility:hidden;opacity:0;appearance:none;pointer-events:none;display:none}:host .control_field:before{font-size:16px;width:16px;height:16px;top:calc(var(--xv-datepicker-padding) + 4px);right:var(--spacing-04);position:absolute;content:"";box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 24 24'%3E%3Cpath d='M19 4h-1V2h-2v2H8V2H6v2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 16H5V9h14v11zm0-13H5V6h14v1z'/%3E%3C/svg%3E")}@supports not selector(::-webkit-calendar-picker-indicator){:host .control_field:before{background-image:none}}:host .control_field.warning,:host .control_field.error,:host .control_field.loading{position:relative}:host .control_field.warning:before,:host .control_field.error:before,:host .control_field.loading:before{background-image:none}:host .control_field.warning:before{content:"⚠";color:var(--support-warning)}:host .control_field.error:before{font-size:12px;border-radius:50%;content:"!";color:#fff;background-color:var(--support-error)}:host .control_field.error input[type=date]{outline-color:var(--support-error);border:1px solid var(--support-error)}:host .control_field.loading{}@keyframes spin{to{transform:rotate(360deg)}}:host .control_field.loading:before{content:"";background-color:transparent;border-radius:50%;border:3px solid rgba(0, 0, 0, 0.1);border-top-color:var(--highlight-01, #CEDE94);animation:spin 0.8s linear infinite}:host .control_message{font-size:0.8571428571em;color:var(--text-primary, #333);margin:0;padding:0}:host .control_message.error{color:var(--text-error, #D62512)}:host .control_message.helper{color:var(--text-secondary, #515151)}:host .popover{opacity:1;z-index:12;position:absolute;max-width:fit-content;box-sizing:border-box;display:inline-flex;flex-direction:column;background-color:var(--layer-02, #fff);border-radius:3px;box-shadow:0 4px 8px 3px rgba(39, 52, 53, 0.15), 0 1px 3px 0 rgba(39, 52, 53, 0.3);padding:var(--spacing-02) var(--spacing-03);row-gap:var(--spacing-02, 4px)}:host .popover:not(.open){opacity:0;z-index:-1;user-select:none;pointer-events:none;top:0;left:0;transform:translateY(-9999px)}:host .popover .header{display:grid;width:100%;grid-template-columns:auto 1fr auto;column-gap:var(--spacing-03)}:host .popover .header_date{margin:0;padding:0;display:flex;align-items:center;justify-content:center;text-transform:capitalize;color:var(--text-primary, #333);text-align:center;font-family:var(--ff-body), sans-serif;font-size:1em;font-weight:700;letter-spacing:0.16px}:host .popover .header_date input[type=number]{display:inline-block;padding:0.25rem;border:none;margin:0 0 0 var(--spacing-02);cursor:default;font-family:inherit;font-size:inherit;font-weight:600;inline-size:3.75em;border-radius:3px}:host .popover .header_date input[type=number]:focus{outline:1px solid var(--focus)}:host .popover .header_icon{display:inline-block;position:relative;border:solid currentColor;padding:5px;border-width:0 2px 2px 0}:host .popover .header_icon.prev{transform:translate(4px) rotate(135deg)}:host .popover .header_icon.next{transform:translate(-4px) rotate(-45deg)}:host .popover .week{display:grid;width:100%;grid-template-columns:repeat(8, 1fr)}:host .popover .week_day{width:40px;line-height:40px;margin:0;padding:0;box-sizing:border-box;color:var(--text-primary, #333);font-family:var(--ff-body), sans-serif;font-size:1em;letter-spacing:0.16px;user-select:none}:host .popover .week_day:is(button){background-color:transparent;border:none;outline:none;transition:250ms ease-in-out background-color, 250ms ease-in-out color}:host .popover .week_day:is(button):hover:not(:disabled){cursor:pointer;background-color:var(--layer-hover-01, #E9E9E9)}:host .popover .week_day:is(button):focus:not(:disabled){cursor:pointer;outline:1px solid var(--focus, #273435);background-blend-mode:multiply}:host .popover .week_day:is(button):active:not(:disabled){background-color:rgba(139, 139, 139, 0.5)}:host .popover .week_day:is(button).inRange:not(.disabled):not(.active){background-color:var(--highlight-01, #CEDE94)}:host .popover .week_day:is(button).active{background-color:var(--button-primary, #273435);color:var(--text-on-color, #fff);z-index:1}:host .popover .week_day:is(button).active:hover{background-color:var(--button-primary-hover, #303F40)}:host .popover .week_day:is(button).active:active{background-color:var(--button-primary-active, #455D5E)}:host .popover .week_day.isToday{position:relative;font-weight:bold}:host .popover .week_day.isToday:before{content:"";position:absolute;bottom:2px;left:calc(50% - 2px);display:inline-block;width:4px;height:4px;border-radius:2px;background-color:currentColor}:host .popover .week_day.disabled{color:var(--text-placeholder, #ACACAC)}:host .popover .week_day__mobile{display:none}@media screen and (max-width: 920px){:host .popover .week_day__mobile{display:inline-block}}:host .popover .week_day__desktop{display:inline-block}@media screen and (max-width: 920px){:host .popover .week_day__desktop{display:none}}:host([block]){display:block;max-width:unset}:host(.disabled) .control_message,:host(.disabled) .control_field input[type=date],:host(.disabled) .control_label{color:var(--text-disabled, rgba(19, 19, 19, 0.25))}:host(.disabled) .control_field:before{opacity:0.4}:host([size=xs]){--xv-datepicker-padding:var(--spacing-02, 4px);font-size:var(--fz-sm)}:host([size=sm]){--xv-datepicker-padding:var(--spacing-03, 8px)}:host([size=md]){--xv-datepicker-padding:var(--spacing-04, 12px)}:host([size=lg]){--xv-datepicker-padding:var(--spacing-05, 16px)}:host([size=xl]){--xv-datepicker-padding:var(--spacing-06, 24px);font-size:var(--fz-lg)}`;
|
|
80110
80268
|
|
|
80111
80269
|
const WEEK = Array
|
|
80112
80270
|
.from({ length: 7 })
|
|
@@ -80343,12 +80501,12 @@ const XvDatepicker = class {
|
|
|
80343
80501
|
}
|
|
80344
80502
|
render() {
|
|
80345
80503
|
const [start, end] = this.value;
|
|
80346
|
-
return (h(Host, { key: '
|
|
80504
|
+
return (h(Host, { key: '92bfe5ead4c634c2df3b42ec41014b23a00f9101', class: { disabled: !!this.disabled }, tabindex: this.disabled ? '-1' : undefined }, h("div", { key: '557f7a3bd3d61b3a351614c2603681805f6765db', "aria-controls": "popover", class: "control" }, this.label && h("label", { key: 'e41309e48361c1a5cfabe427322f546713853937', class: "control_label" }, this.label), h("div", { key: 'ab9517371f913eed9336a98947a3dbb0f3f28a87', class: {
|
|
80347
80505
|
'control_field': true,
|
|
80348
80506
|
loading: this.loading,
|
|
80349
80507
|
error: !!this.error || !!this.localError,
|
|
80350
80508
|
warning: this.warning !== undefined,
|
|
80351
|
-
}, onClick: this.handleOpen, ref: (el) => (this.controlEl = el) }, h("input", { key: '
|
|
80509
|
+
}, onClick: this.handleOpen, ref: (el) => (this.controlEl = el) }, h("input", { key: '6d2f79d071fe020235586f849efbb48dd5cba315', lang: "de", type: "date", name: "start", disabled: this.loading || this.disabled, readonly: this.readonly || this.variant === 'range', min: this.min, max: this.max, value: start ? dateFns.format(start, DEF_FORMAT) : '', onChange: (e) => this.handleChange(e, 'start'), onBlur: (e) => this.handleBlur(e, 'start'), onKeyDown: (e) => this.handleKeydown(e, 'start') }), this.variant === 'range' && (h("input", { key: '97c4d03019f2e1a9c0583e1b76aa4d143f503172', lang: "de", type: "date", name: "end", disabled: this.loading || this.disabled, readonly: this.readonly || this.variant === 'range', min: this.min, max: this.max, value: end ? dateFns.format(end, DEF_FORMAT) : '', onChange: (e) => this.handleChange(e, 'end'), onBlur: (e) => this.handleBlur(e, 'end'), onKeyDown: (e) => this.handleKeydown(e, 'end') }))), (this.helper || this.error || this.warning || this.localError) && (h("div", { key: 'b19342150eeb4c7c356a817b268ec76e76daa94a' }, this.helper && h("p", { key: '39970bdc2765e3a63072a6d7f54c038d6cee6d11', class: "control_message helper" }, this.helper), (this.error || this.warning || this.localError) && (h("p", { key: '579ca9aa50b6b7dacb787029691baf023219a265', class: { control_message: true, error: !!this.error || !!this.localError } }, this.error || this.localError || this.warning))))), h("div", { key: 'af8eee78121448e66c9f6d3dd6d5bb7d9eab03dc', role: "dialog", class: { popover: true, open: this.open }, ref: (el) => (this.popoverEl = el) }, h("div", { key: 'd400c66831941238670ae021209ea2a40a59e88b', class: "header" }, h("xv-button-v2", { key: '2cdd95bc4114b0bd3c7ffa613c7a69d68685f0a6', tabindex: this.open ? undefined : '-1', disabled: this.isPrevDisabled, variant: "ghost", onClick: this.prevMonth }, h("span", { key: '5a5cb4965aa5b64d8a8d57d96076bcf2cc5fdb6b', slot: "icon-left", class: "header_icon prev" })), h("p", { key: 'f806d5ac078fccca5cadfb0e368cb78f478f582e', class: "header_date" }, dateFns.format(this.month, 'LLLL', { locale: localeExports.de }), h("input", { key: '134ddaa8cf64f2faf3306aac6cfbc9cf8ff2047d', tabindex: this.open ? undefined : '-1', type: "number", value: this.month.getFullYear(), onInput: this.handleYearChange, onBlur: this.handleYearBlur })), h("xv-button-v2", { key: 'f90e88c43c0365f64fd4494c75bfcc00558b5034', tabindex: this.open ? undefined : '-1', disabled: this.isNextDisabled, variant: "ghost", onClick: this.nextMonth }, h("span", { key: '0b539e43a031acc4a69f0743e4f22d244a8856c3', slot: "icon-left", class: "header_icon next" }))), h("div", { key: '8986efbeb8a2c86c01aa72afccf3b3db0cafaf7d', class: "week" }, h("p", { key: 'de290231af4fa141537c348c57fc402082b06f28', class: "week_day" }), WEEK.map((day) => h("p", { class: "week_day" }, day, "."))), h("div", { key: 'b61e68c524a8cacf4bd8f08deee3662de91ae7c0', class: "week" }, this.days.map((day, idx) => (h(Fragment, null, idx % 7 === 0 && (h("button", { tabindex: this.open ? undefined : '-1', disabled: true, class: "week_day disabled" }, day.week)), h("button", { tabindex: this.open ? undefined : '-1', onClick: () => this.handleSetDate(day), disabled: day.disabled, class: {
|
|
80352
80510
|
'week_day': true,
|
|
80353
80511
|
inRange: this.variant === 'range' && dateFns.isWithinInterval(day.date, { start, end }),
|
|
80354
80512
|
isToday: day.isToday,
|
|
@@ -80374,8 +80532,9 @@ XvDatepicker.style = xvDatepickerCss();
|
|
|
80374
80532
|
|
|
80375
80533
|
const DropdownItemSelector = '.xv-dropdown-item';
|
|
80376
80534
|
|
|
80377
|
-
const xvDropdownCss = () => `.xv-container{width:100%;max-width:1170px;margin-inline:auto}@media (min-width: 576px){.xv-container{max-width:540px}}@media (min-width: 768px){.xv-container{max-width:720px}}@media (min-width: 992px){.xv-container{max-width:960px;padding-inline:var(--bs-gutter-x, 0.75rem)}}@media (min-width: 1200px){.xv-container{max-width:1140px}}@media (min-width: 1400px){.xv-container{max-width:1320px}}.xv-tooltip[role=tooltip]{position:absolute;background-color:var(--background-inverse, #333333);color:var(--text-on-color);padding:var(--spacing-03) var(--spacing-04);border-radius:3px;font-size:var(--fz-sm);z-index:999;min-width:min(150px, 90vw);max-width:min(400px, 90vw)}.xv-tooltip[role=tooltip]::after{content:"";position:absolute;width:0;height:0;border-style:solid}.xv-tooltip[role=tooltip][data-popper-placement=top]::after{bottom:-5px;left:50%;transform:translateX(-50%);border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-start]::after{bottom:-5px;left:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-end]::after{bottom:-5px;right:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom]::after{top:-5px;left:50%;transform:translateX(-50%);border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-start]::after{top:-5px;left:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-end]::after{top:-5px;right:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=left]::after{top:50%;right:-5px;transform:translateY(-50%);border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-start]::after{top:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-end]::after{bottom:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=right]::after{top:50%;left:-5px;transform:translateY(-50%);border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-start]::after{top:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-end]::after{bottom:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}:host{--dropdown-padding-x:16px;--dropdown-padding-y:11px;--dropdown-max-width:300px;--dropdown-visible-items:6;display:block;position:relative;text-align:left;max-width:min(var(--dropdown-max-width), 100%)}:host .label{display:block;color:var(--text-secondary, #515151);font-family:var(--ff-body, Work Sans), sans-serif;font-size:12px;font-style:normal;font-weight:
|
|
80535
|
+
const xvDropdownCss = () => `.xv-container{width:100%;max-width:1170px;margin-inline:auto}@media (min-width: 576px){.xv-container{max-width:540px}}@media (min-width: 768px){.xv-container{max-width:720px}}@media (min-width: 992px){.xv-container{max-width:960px;padding-inline:var(--bs-gutter-x, 0.75rem)}}@media (min-width: 1200px){.xv-container{max-width:1140px}}@media (min-width: 1400px){.xv-container{max-width:1320px}}.xv-tooltip[role=tooltip]{position:absolute;background-color:var(--background-inverse, #333333);color:var(--text-on-color);padding:var(--spacing-03) var(--spacing-04);border-radius:3px;font-size:var(--fz-sm);z-index:999;min-width:min(150px, 90vw);max-width:min(400px, 90vw)}.xv-tooltip[role=tooltip]::after{content:"";position:absolute;width:0;height:0;border-style:solid}.xv-tooltip[role=tooltip][data-popper-placement=top]::after{bottom:-5px;left:50%;transform:translateX(-50%);border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-start]::after{bottom:-5px;left:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-end]::after{bottom:-5px;right:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom]::after{top:-5px;left:50%;transform:translateX(-50%);border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-start]::after{top:-5px;left:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-end]::after{top:-5px;right:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=left]::after{top:50%;right:-5px;transform:translateY(-50%);border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-start]::after{top:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-end]::after{bottom:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=right]::after{top:50%;left:-5px;transform:translateY(-50%);border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-start]::after{top:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-end]::after{bottom:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}:host{--dropdown-padding-x:16px;--dropdown-padding-y:11px;--dropdown-max-width:300px;--dropdown-visible-items:6;--dropdown-ghost-width:min-content;display:block;position:relative;text-align:left;max-width:min(var(--dropdown-max-width), 100%)}:host .label{display:block;color:var(--text-secondary, #515151);font-family:var(--ff-body, Work Sans), sans-serif;font-size:12px;font-style:normal;font-weight:400;line-height:16px;letter-spacing:0.32px;margin-bottom:8px}:host .label ::slotted([slot=label]){color:var(--text-secondary, #515151);font-family:var(--ff-body, Work Sans), sans-serif;font-size:12px;font-style:normal;font-weight:400;line-height:16px;letter-spacing:0.32px}:host .label_info{margin-left:var(--spacing-02)}:host .control{background-blend-mode:multiply;border-radius:3px;border:1px solid var(--border-subtle-01);transition:0.2s ease-in-out background-color;cursor:pointer;margin:0;box-sizing:border-box;font-family:inherit;font-size:100%;padding:0;appearance:none;background-color:var(--field-02, #FFF);text-align:start;inline-size:100%;position:relative;display:inline-flex;overflow:hidden;align-items:center;block-size:calc(100% + 1px);outline:none;padding-block:var(--dropdown-padding-y);padding-inline:var(--dropdown-padding-x);text-overflow:ellipsis;vertical-align:top;white-space:nowrap}:host .control_value,:host .control_placeholder{flex:1;margin:0;overflow:hidden;color:var(--text-primary, #333);user-select:none;text-overflow:ellipsis;white-space:nowrap;font-family:var(--ff-body, Work Sans), sans-serif;font-size:14px;font-style:normal;font-weight:400;line-height:18px;letter-spacing:0.16px;padding-inline:0 1rem}:host .control_count{margin-right:var(--spacing--03, 8px)}:host .control_placeholder{color:var(--text-primary, #333)}:host .control_icon{width:18px;height:18px}:host .control_icon.error{color:var(--support-error, #F1290E)}:host .control_icon.warning{color:var(--support-warning, #FF7F04)}:host .control_arrow{box-sizing:border-box;margin:0;font-size:100%;vertical-align:baseline;padding:0;border:0;appearance:none;background:none;text-align:start;display:flex;align-items:center;justify-content:center;block-size:min(16px, 1em);inline-size:min(16px, 1em);inset-inline-end:0.75rem;outline:none;transition:transform 70ms cubic-bezier(0.2, 0, 0.38, 0.9)}:host .control:hover{background-color:var(--field-hover-02, #E9E9E9)}:host .control:active{background-color:var(--layer-selected-02, #E3E3E3)}:host .control.readonly{outline-color:transparent;background:var(--field-01, #F7F7F7);background-blend-mode:multiply;cursor:default}:host .control.readonly .control_value{color:var(--text-secondary)}:host .control.readonly .control_arrow{display:none}:host .options{inset-block-start:100%;margin-block-start:1px;display:block;line-height:18px;max-block-size:calc(1lh * var(--dropdown-visible-items) + var(--dropdown-padding-y) * 12);box-shadow:0 2px 6px rgba(0, 0, 0, 0.3);position:absolute;z-index:10;inline-size:100%;inset-inline:0;overflow-y:auto;transition:max-height 0.11s cubic-bezier(0.2, 0, 0.38, 0.9);border-radius:3px;background-color:var(--field-02, #FFF);scrollbar-width:thin;scrollbar-color:var(--layer-accent-03) transparent}:host .options_search{position:sticky;top:0;z-index:2;background:linear-gradient(to bottom, var(--field-02, #FFF) 0%, var(--field-02, #FFF) 85%, transparent 100%);padding:var(--dropdown-padding-y) var(--dropdown-padding-x)}:host .options.right{left:unset;right:0}:host .options ::slotted(.xv-dropdown-item){display:block;max-block-size:13.75rem;inset-inline:0;box-sizing:border-box;padding:var(--dropdown-padding-y) calc(var(--dropdown-padding-x) + 16px) var(--dropdown-padding-y) var(--dropdown-padding-x);position:relative;cursor:pointer;overflow:hidden;color:var(--text-secondary, #515151);text-overflow:ellipsis;white-space:nowrap;font-family:var(--ff-body, Work Sans), sans-serif;font-size:var(--fz-md, 14px);font-style:normal;font-weight:400;line-height:1lh;letter-spacing:0.16px;transition:0.2s ease-in-out background-color;user-select:none}:host .options ::slotted(.xv-dropdown-item):after{content:"";position:absolute;top:0;height:1px;left:10px;width:calc(100% - 20px);background-color:var(--border-subtle-01)}:host .options ::slotted(.xv-dropdown-item:not([hidden]):first-child):after{display:none}:host .options ::slotted(.xv-dropdown-item:hover),:host .options ::slotted(.xv-dropdown-item[active]){background-color:var(--layer-hover-02, #F7F7F7)}:host .options ::slotted(.xv-dropdown-item:active){background-color:var(--layer-selected-hover-02, #DADADA)}:host .options ::slotted(.xv-dropdown-item[hidden]){display:none}:host .options ::slotted(.xv-dropdown-item[selected]){background-color:var(--layer-selected-02, #E3E3E3)}:host .options ::slotted(.xv-dropdown-item[selected]:hover){background-color:var(--layer-selected-hover-02, #DADADA)}:host .options ::slotted(.xv-dropdown-item[disabled]){background-color:transparent;opacity:0.4;cursor:not-allowed}:host .helper{color:var(--text-helper, #646464);font-family:var(--ff-heading, "IBM Plex Sans"), sans-serif;font-size:12px;font-style:normal;font-weight:400;line-height:16px;letter-spacing:0.32px;margin:4px 0 0;padding:0}:host(.ghost) .control{background-color:transparent;box-shadow:none;border:none;padding:0}:host(.ghost) .control_value{padding-inline-end:5px}:host(.ghost) .options{width:var(--dropdown-ghost-width)}:host([open]) .control_arrow{transform:rotate(180deg)}:host([disabled]){opacity:0.4;cursor:not-allowed}:host([disabled]) .control{cursor:inherit}:host([disabled]) .control:hover,:host([disabled]) .control:active,:host([disabled]) .control:focus-within{background-color:transparent}:host(:focus){outline:none}:host(:focus-visible){outline:none}:host(:focus-visible) .control{outline:2px solid var(--focus)}:host([error]) .control{box-shadow:none;outline:2px solid var(--support-support-error, #F1290E)}:host([error]) .helper{color:var(--text-error, #D62512)}:host([size=xs]){--dropdown-padding-y:4px}:host([size=sm]){--dropdown-padding-y:7px}:host([size=md]){--dropdown-padding-y:11px}:host([size=lg]){--dropdown-padding-y:15px}:host([size=xl]){--dropdown-padding-y:16px}`;
|
|
80378
80536
|
|
|
80537
|
+
let dropdownUid = 0;
|
|
80379
80538
|
const XvDropdown = class {
|
|
80380
80539
|
constructor(hostRef) {
|
|
80381
80540
|
registerInstance(this, hostRef);
|
|
@@ -80384,9 +80543,17 @@ const XvDropdown = class {
|
|
|
80384
80543
|
this.searchPlaceholder = 'Suchen';
|
|
80385
80544
|
this.size = SIZE_VAR.MD;
|
|
80386
80545
|
this.variant = 'default';
|
|
80546
|
+
this.position = 'auto';
|
|
80387
80547
|
this.selected = [];
|
|
80388
80548
|
this.selectedMap = new Map();
|
|
80389
|
-
|
|
80549
|
+
/** Side the options panel is actually aligned to (computed when position === 'auto'). */
|
|
80550
|
+
this.resolvedPosition = 'left';
|
|
80551
|
+
this.positionMeasured = false;
|
|
80552
|
+
/* region Keyboard navigation */
|
|
80553
|
+
this.listboxId = `xv-dd-listbox-${dropdownUid++}`;
|
|
80554
|
+
this.optIdSeq = 0;
|
|
80555
|
+
this.activeItem = null;
|
|
80556
|
+
this.pendingOpenInit = false;
|
|
80390
80557
|
this.searchQuery = '';
|
|
80391
80558
|
this.dropdownItems = [];
|
|
80392
80559
|
this.setSelected = (selectedMap, optionNodes) => {
|
|
@@ -80414,6 +80581,44 @@ const XvDropdown = class {
|
|
|
80414
80581
|
this.removeListeners = () => {
|
|
80415
80582
|
document.removeEventListener('click', this.handleClickOutside, { capture: true });
|
|
80416
80583
|
};
|
|
80584
|
+
this.getNavigableItems = () => Array.from(this.el.querySelectorAll(DropdownItemSelector))
|
|
80585
|
+
.filter((el) => !el.hasAttribute('hidden') && !el.hasAttribute('disabled'));
|
|
80586
|
+
this.moveActive = (delta) => {
|
|
80587
|
+
const items = this.getNavigableItems();
|
|
80588
|
+
if (!items.length)
|
|
80589
|
+
return;
|
|
80590
|
+
const current = this.activeItem ? items.indexOf(this.activeItem) : -1;
|
|
80591
|
+
let next = current + delta;
|
|
80592
|
+
if (next < 0)
|
|
80593
|
+
next = items.length - 1;
|
|
80594
|
+
else if (next >= items.length)
|
|
80595
|
+
next = 0;
|
|
80596
|
+
this.setActiveItem(items[next]);
|
|
80597
|
+
};
|
|
80598
|
+
this.setActiveByEdge = (edge) => {
|
|
80599
|
+
const items = this.getNavigableItems();
|
|
80600
|
+
if (!items.length)
|
|
80601
|
+
return;
|
|
80602
|
+
this.setActiveItem(edge === 'first' ? items[0] : items[items.length - 1]);
|
|
80603
|
+
};
|
|
80604
|
+
this.setActiveItem = (item, scroll = true) => {
|
|
80605
|
+
var _a;
|
|
80606
|
+
if (this.activeItem === item)
|
|
80607
|
+
return;
|
|
80608
|
+
(_a = this.activeItem) === null || _a === void 0 ? void 0 : _a.removeAttribute('active');
|
|
80609
|
+
this.activeItem = item;
|
|
80610
|
+
if (!item) {
|
|
80611
|
+
this.el.removeAttribute('aria-activedescendant');
|
|
80612
|
+
return;
|
|
80613
|
+
}
|
|
80614
|
+
if (!item.id)
|
|
80615
|
+
item.id = `${this.listboxId}-opt-${this.optIdSeq++}`;
|
|
80616
|
+
item.setAttribute('active', '');
|
|
80617
|
+
this.el.setAttribute('aria-activedescendant', item.id);
|
|
80618
|
+
if (scroll)
|
|
80619
|
+
item.scrollIntoView({ block: 'nearest' });
|
|
80620
|
+
};
|
|
80621
|
+
/* endregion Keyboard navigation */
|
|
80417
80622
|
this.clearHandle = () => {
|
|
80418
80623
|
const options = this.el.querySelectorAll(DropdownItemSelector);
|
|
80419
80624
|
forEach(options, (option) => setAttr(option, 'selected', false));
|
|
@@ -80437,11 +80642,40 @@ const XvDropdown = class {
|
|
|
80437
80642
|
this.searchQuery = ev.target.value.toLowerCase();
|
|
80438
80643
|
clearTimeout(this.searchTimeout);
|
|
80439
80644
|
this.searchTimeout = setTimeout(() => {
|
|
80440
|
-
|
|
80645
|
+
var _a;
|
|
80646
|
+
for (const { el, text } of this.dropdownItems) {
|
|
80441
80647
|
el.toggleAttribute('hidden', !text.includes(this.searchQuery));
|
|
80442
80648
|
}
|
|
80649
|
+
// keep keyboard focus on a visible option after filtering
|
|
80650
|
+
if ((_a = this.activeItem) === null || _a === void 0 ? void 0 : _a.hasAttribute('hidden'))
|
|
80651
|
+
this.setActiveByEdge('first');
|
|
80443
80652
|
}, 200);
|
|
80444
80653
|
};
|
|
80654
|
+
this.resetSearch = () => {
|
|
80655
|
+
clearTimeout(this.searchTimeout);
|
|
80656
|
+
if (!this.search)
|
|
80657
|
+
return;
|
|
80658
|
+
this.searchQuery = '';
|
|
80659
|
+
if (this.searchInputEl)
|
|
80660
|
+
this.searchInputEl.value = '';
|
|
80661
|
+
for (const { el } of this.dropdownItems)
|
|
80662
|
+
el.removeAttribute('hidden');
|
|
80663
|
+
};
|
|
80664
|
+
/** Runs once per open, after the panel is in the DOM: highlight an option and place focus. */
|
|
80665
|
+
this.initOpenState = () => {
|
|
80666
|
+
var _a, _b, _c;
|
|
80667
|
+
this.pendingOpenInit = false;
|
|
80668
|
+
const items = this.getNavigableItems();
|
|
80669
|
+
const preselected = items.find((el) => el.hasAttribute('selected'));
|
|
80670
|
+
this.setActiveItem(preselected || items[0] || null, false);
|
|
80671
|
+
if (this.search) {
|
|
80672
|
+
// shadow root is open, so we can hand focus to the inner input for typing
|
|
80673
|
+
(_c = (_b = (_a = this.searchInputEl) === null || _a === void 0 ? void 0 : _a.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('input')) === null || _c === void 0 ? void 0 : _c.focus();
|
|
80674
|
+
}
|
|
80675
|
+
else {
|
|
80676
|
+
this.el.focus();
|
|
80677
|
+
}
|
|
80678
|
+
};
|
|
80445
80679
|
}
|
|
80446
80680
|
openChangeHandle() {
|
|
80447
80681
|
this.syncOpenState();
|
|
@@ -80453,9 +80687,15 @@ const XvDropdown = class {
|
|
|
80453
80687
|
if (this.open) {
|
|
80454
80688
|
this.cacheItems(); // get items on open
|
|
80455
80689
|
this.addListeners();
|
|
80690
|
+
this.pendingOpenInit = true; // highlight + focus once the panel has rendered
|
|
80456
80691
|
}
|
|
80457
80692
|
else {
|
|
80458
80693
|
this.removeListeners();
|
|
80694
|
+
this.resolvedPosition = 'left'; // reset so next open re-measures from the default side
|
|
80695
|
+
this.positionMeasured = false;
|
|
80696
|
+
this.pendingOpenInit = false;
|
|
80697
|
+
this.setActiveItem(null);
|
|
80698
|
+
this.resetSearch();
|
|
80459
80699
|
}
|
|
80460
80700
|
}
|
|
80461
80701
|
multipleChangeHandle() {
|
|
@@ -80524,9 +80764,59 @@ const XvDropdown = class {
|
|
|
80524
80764
|
forEach(optionElements, (option) => setAttr(option, 'selected', this.selectedMap.has(option.getAttribute('value'))));
|
|
80525
80765
|
this.changeSelection.emit(this.setSelected(this.selectedMap, optionElements));
|
|
80526
80766
|
}
|
|
80767
|
+
/* region Keyboard navigation */
|
|
80768
|
+
handleKeyDown(ev) {
|
|
80769
|
+
var _a, _b;
|
|
80770
|
+
if (this.disabled || this.readonly || this.loading)
|
|
80771
|
+
return;
|
|
80772
|
+
if (!this.open) {
|
|
80773
|
+
if (['ArrowDown', 'ArrowUp', 'Enter', ' ', 'Spacebar'].includes(ev.key)) {
|
|
80774
|
+
ev.preventDefault();
|
|
80775
|
+
this.open = true;
|
|
80776
|
+
}
|
|
80777
|
+
return;
|
|
80778
|
+
}
|
|
80779
|
+
switch (ev.key) {
|
|
80780
|
+
case 'ArrowDown':
|
|
80781
|
+
ev.preventDefault();
|
|
80782
|
+
this.moveActive(1);
|
|
80783
|
+
break;
|
|
80784
|
+
case 'ArrowUp':
|
|
80785
|
+
ev.preventDefault();
|
|
80786
|
+
this.moveActive(-1);
|
|
80787
|
+
break;
|
|
80788
|
+
case 'Home':
|
|
80789
|
+
ev.preventDefault();
|
|
80790
|
+
this.setActiveByEdge('first');
|
|
80791
|
+
break;
|
|
80792
|
+
case 'End':
|
|
80793
|
+
ev.preventDefault();
|
|
80794
|
+
this.setActiveByEdge('last');
|
|
80795
|
+
break;
|
|
80796
|
+
case 'Enter':
|
|
80797
|
+
ev.preventDefault();
|
|
80798
|
+
(_a = this.activeItem) === null || _a === void 0 ? void 0 : _a.click(); // reuse the same selection path as a mouse click
|
|
80799
|
+
break;
|
|
80800
|
+
case ' ':
|
|
80801
|
+
case 'Spacebar':
|
|
80802
|
+
if (!this.search) { // when searching, space must type into the field
|
|
80803
|
+
ev.preventDefault();
|
|
80804
|
+
(_b = this.activeItem) === null || _b === void 0 ? void 0 : _b.click();
|
|
80805
|
+
}
|
|
80806
|
+
break;
|
|
80807
|
+
case 'Escape':
|
|
80808
|
+
ev.preventDefault();
|
|
80809
|
+
this.open = false;
|
|
80810
|
+
this.el.focus();
|
|
80811
|
+
break;
|
|
80812
|
+
case 'Tab':
|
|
80813
|
+
this.open = false; // let focus leave naturally
|
|
80814
|
+
break;
|
|
80815
|
+
}
|
|
80816
|
+
}
|
|
80527
80817
|
/* endregion Search methods */
|
|
80528
80818
|
render() {
|
|
80529
|
-
return (h(Host, { key: '
|
|
80819
|
+
return (h(Host, { key: 'd829dfeed78bfa23b22b5d04658bddfcfb3f9677', class: { 'xv-dropdown': true, [this.variant]: !!this.variant }, role: "combobox", "aria-haspopup": "listbox", "aria-expanded": this.open ? 'true' : 'false', "aria-controls": this.open ? this.listboxId : null, size: this.size, open: this.open, error: !!this.error, disabled: this.disabled, tabindex: (this.disabled || this.readonly) ? -1 : 0 }, (this.label || this.info) && (h("label", { key: '3329167b435dc874a175ca4fdf863f024ca59172', class: "label" }, h("slot", { key: '9fa412345fa4e59f0e5bf075a969c97f50ffd190', name: "label" }, this.label), this.info && h("xv-tooltip-v2", { key: 'ff8a830219cd41a54f80aba9f087f8851136f094', class: "label_info", message: this.info }))), h("div", { key: '9046c4c21ed270b9e9be0a6361cb629910fcd752', class: { "xv-dropdown-control control": true, readonly: !!this.readonly }, onClick: this.handleOpen }, (this.multiple && this.selectedMap.size > 0) && (h("xv-tag-v2", { key: 'e2d4ed3d256d9f9409181dfc0d374c80b51113e2', class: "control_count", onCloseClick: this.clearHandle, closeable: !this.required, bg: "var(--background-inverse)", color: "var(--icon-inverse)" }, this.selectedMap.size)), this.selected.length ? (h("p", { class: "control_value" }, this.selected.join(', '))) : (h("p", { class: "control_placeholder" }, this.placeholder || '')), this._renderIcon(), h("svg", { key: '8b00320c6078f01967f5f205700bd10747065659', class: "control_arrow", focusable: "false", preserveAspectRatio: "xMidYMid meet", xmlns: "http://www.w3.org/2000/svg", fill: "currentColor", "aria-hidden": "true", width: "16", height: "16", viewBox: "0 0 448 512" }, h("path", { key: 'b5387f1a85b2b4efccf9e5cbc5376cf34bc660a3', d: "M441.9 167.3l-19.8-19.8c-4.7-4.7-12.3-4.7-17 0L224 328.2 42.9 147.5c-4.7-4.7-12.3-4.7-17 0L6.1 167.3c-4.7 4.7-4.7 12.3 0 17l209.4 209.4c4.7 4.7 12.3 4.7 17 0l209.4-209.4c4.7-4.7 4.7-12.3 0-17z" }))), this.open && h("div", { key: '7b1de2568396f650059277d06bc9b4d8bbb4d6f3', ref: (el) => (this.optionsEl = el), id: this.listboxId, role: "listbox", "aria-multiselectable": this.multiple ? 'true' : null, class: { options: true, right: this._appliedPosition() === 'right', search: !!this.search } }, this.search && (h("div", { key: '7225547fc7964b33e1afaf07dd6694932e4fedec', class: "options_search" }, h("xv-text-input-v2", { key: 'dc5ce6e2200c627e259d02622b31515be49dde0b', type: "search", ref: (el) => (this.searchInputEl = el), block: true, autocomplete: "off", size: this.size, value: this.searchQuery, placeholder: this.searchPlaceholder, onValueChange: this.handleSearchInput }))), h("slot", { key: "xv-dropdown-options" })), (this.helper || typeof this.error === 'string' || this.warning) && (h("p", { key: 'a18e86e5bfeca3a94f15cb58424db798e95a799f', class: "helper" }, this.error || this.warning || this.helper))));
|
|
80530
80820
|
}
|
|
80531
80821
|
componentDidLoad() {
|
|
80532
80822
|
this.syncOpenState();
|
|
@@ -80534,8 +80824,51 @@ const XvDropdown = class {
|
|
|
80534
80824
|
if (this.defaultValue)
|
|
80535
80825
|
this.value = this.defaultValue;
|
|
80536
80826
|
}
|
|
80827
|
+
/** Side the panel is rendered on: explicit prop wins, otherwise the auto-measured side. */
|
|
80828
|
+
_appliedPosition() {
|
|
80829
|
+
return this.position === 'auto' ? this.resolvedPosition : this.position;
|
|
80830
|
+
}
|
|
80831
|
+
componentDidRender() {
|
|
80832
|
+
if (this.open && this.pendingOpenInit)
|
|
80833
|
+
this.initOpenState();
|
|
80834
|
+
// Only ghost panels can be wider than the control, so only they can overflow.
|
|
80835
|
+
// Measure once per open; skip for the default variant and for explicit positions.
|
|
80836
|
+
if (!this.open || this.position !== 'auto' || this.variant !== 'ghost' || !this.optionsEl || this.positionMeasured)
|
|
80837
|
+
return;
|
|
80838
|
+
this.positionMeasured = true;
|
|
80839
|
+
const rect = this.optionsEl.getBoundingClientRect();
|
|
80840
|
+
const bounds = this._clipBounds();
|
|
80841
|
+
// Flip in one direction only, so a panel wider than its container can't thrash between sides.
|
|
80842
|
+
let next = this.resolvedPosition;
|
|
80843
|
+
if (this.resolvedPosition === 'left' && rect.right > bounds.right)
|
|
80844
|
+
next = 'right';
|
|
80845
|
+
else if (this.resolvedPosition === 'right' && rect.left < bounds.left)
|
|
80846
|
+
next = 'left';
|
|
80847
|
+
if (next !== this.resolvedPosition)
|
|
80848
|
+
this.resolvedPosition = next;
|
|
80849
|
+
}
|
|
80850
|
+
/** Inline edges of the nearest ancestor that clips overflow; falls back to the viewport. */
|
|
80851
|
+
_clipBounds() {
|
|
80852
|
+
let node = this.el.parentNode;
|
|
80853
|
+
while (node) {
|
|
80854
|
+
if (node instanceof ShadowRoot) {
|
|
80855
|
+
node = node.host;
|
|
80856
|
+
continue;
|
|
80857
|
+
}
|
|
80858
|
+
if (node instanceof HTMLElement) {
|
|
80859
|
+
const overflowX = getComputedStyle(node).overflowX;
|
|
80860
|
+
if (overflowX === 'hidden' || overflowX === 'auto' || overflowX === 'scroll' || overflowX === 'clip') {
|
|
80861
|
+
const r = node.getBoundingClientRect();
|
|
80862
|
+
return { left: r.left, right: r.right };
|
|
80863
|
+
}
|
|
80864
|
+
}
|
|
80865
|
+
node = node.parentNode;
|
|
80866
|
+
}
|
|
80867
|
+
return { left: 0, right: document.documentElement.clientWidth };
|
|
80868
|
+
}
|
|
80537
80869
|
disconnectedCallback() {
|
|
80538
80870
|
this.removeListeners();
|
|
80871
|
+
clearTimeout(this.searchTimeout);
|
|
80539
80872
|
}
|
|
80540
80873
|
_renderIcon() {
|
|
80541
80874
|
if (this.loading) {
|
|
@@ -80586,7 +80919,7 @@ const XvDropdownItem = class {
|
|
|
80586
80919
|
});
|
|
80587
80920
|
}
|
|
80588
80921
|
render() {
|
|
80589
|
-
return (h(Host, { key: '
|
|
80922
|
+
return (h(Host, { key: '129c105a5f0c793b893e800b05ce97d8352eb06f', class: "xv-dropdown-item", value: this.value, role: "option", tabindex: this.disabled ? -1 : false }, this.multiple && (h("xv-checkbox-v2", { key: '2145dd2fd6a7ac83ea7c474d2b4b17cb5b7ecc53', class: "multiple-check", size: this.size, checked: this.selected, disabled: this.disabled })), h("slot", { key: '82d7595ff99453660590241da2b6df592f497201' }), (!this.multiple && this.selected) && h("span", { key: '343f6c8f9930054e5aabb015579a5e0ee996cf6e', class: "checkmark far fa-check" })));
|
|
80590
80923
|
}
|
|
80591
80924
|
componentWillLoad() {
|
|
80592
80925
|
if (!this.value)
|
|
@@ -80690,7 +81023,7 @@ const XvFileUploader = class {
|
|
|
80690
81023
|
}
|
|
80691
81024
|
}
|
|
80692
81025
|
render() {
|
|
80693
|
-
return (h(Host, { key: '
|
|
81026
|
+
return (h(Host, { key: '3423ccf72c581a004e5ca59d9cbf6f673f7896c1', class: { 'upload-wrapper': true, [`uploader-${this.size}`]: true, disabled: !!this.disabled, error: !!this.error } }, this.label && h("label", { key: '93b7b8edc0ac8e980910dc83d7cabf2030f97b35', class: "label" }, this.label), this.description && h("p", { key: 'c6b030335b34ee97ada3127fc8641f7b009d6c55', class: "description" }, this.description), this.variant === 'button' ? (h("xv-button-v2", { class: "uploadBtn", variant: this.buttonVariant, disabled: this.disabled, onClick: () => this.fileInput.click() }, this.addText || 'Dateien auswählen')) : (h("div", { class: { 'drop-zone': true, active: this.dragActive }, onDrop: this.onDrop, onDragOver: this.onDragOver, onDragLeave: this.onDragLeave, onClick: () => this.fileInput.click() }, this.addText || 'Dateien hierher ziehen oder darauf klicken, um eine Datei auszuwählen.')), h("input", { key: '04a082fae037f176533bee68ea0a8b24f8f36257', ref: el => (this.fileInput = el), type: "file", hidden: true, onChange: this.onFileSelect, multiple: this.multiple, accept: this.accept.join(',') }), this.error && h("p", { key: '6fb7b7c5517030caf1f22206a6612077b0c14e7e', class: "global-error" }, this.error), h("ul", { key: 'e3d5461797abbc1168117c6772238780a0a7e14a', class: "file-list" }, this.files.map((file, index) => {
|
|
80694
81027
|
var _a, _b;
|
|
80695
81028
|
return (h("li", { class: { file: true, withError: !!(((_a = this.errors) === null || _a === void 0 ? void 0 : _a[index]) || ((_b = this.errorMessages) === null || _b === void 0 ? void 0 : _b[index])) } }, h("div", { class: "file_container" }, h("span", { class: "file_container_name" }, file.name), this._renderLoaderState(index)), this._renderError(index)));
|
|
80696
81029
|
}))));
|
|
@@ -80762,7 +81095,7 @@ const Xvfooter = class {
|
|
|
80762
81095
|
render() {
|
|
80763
81096
|
const { categories, socials, logo, legalLinks, payments, partners, advantages } = this.data || {};
|
|
80764
81097
|
const hasDataLength = ((categories === null || categories === void 0 ? void 0 : categories.length) || (partners === null || partners === void 0 ? void 0 : partners.length) || (payments === null || payments === void 0 ? void 0 : payments.length) || (socials === null || socials === void 0 ? void 0 : socials.length));
|
|
80765
|
-
return (h("footer", { key: '
|
|
81098
|
+
return (h("footer", { key: 'c3406d777693fe2311102e6fcb9852383fc9ac6a', class: "xv-footer" }, (advantages === null || advantages === void 0 ? void 0 : advantages.length) > 0 && (h("div", { key: 'f5636ec1f9f660f5735d27a79924bd9c40adf75f', class: "xv-footer-advantages" }, h("div", { key: '42656264cb7590f5e61ce1bbe38aa37a63f04ee9', class: "xv-container" }, this._renderFooterList(advantages, { itemWithLabel: true })))), hasDataLength && (h("div", { key: 'e142aa994a80d0fe5be4e00a8f0c4039da1791d6', class: "xv-container" }, h("div", { key: 'b7d5ab5f3613736775b3ef83cc2cc676449663ba', class: "xv-footer__grid xv-footer-y-spacing" }, h("div", { key: 'c997c4022a8d2bea3547230f5ba9ed7a37635d46', class: "xv-footer__col-main" }, h("ul", { key: 'c1be504d2ce2a411dab6f1681564524f8b2446b3', class: "xv-footer-categories" }, categories === null || categories === void 0 ? void 0 : categories.map((category) => (h("li", null, h("p", { class: "xv-label-02" }, category.label), h("ul", { class: "xv-footer-routes" }, category.routes.map((item) => (h("li", null, h("a", { class: "xv-body-compact-02", href: item.href, target: item.target }, item.label)))))))))), h("div", { key: 'f82ccaf18e1fe63b47f109bf20845af9ea0d4add', class: "xv-footer__col-sidebar" }, this._renderFooterList(partners, { label: 'crossvertise Partner' }), this._renderFooterList(payments, { label: 'Bequem und sicher bezahlen' }), this._renderFooterList(socials, { label: 'Folgen Sie uns', isRow: true }))))), (legalLinks === null || legalLinks === void 0 ? void 0 : legalLinks.length) > 0 && (h("div", { key: 'e1d12515175bffaa970ac5bfe41ad0cf27d5097e', class: "xv-footer-legal" }, h("div", { key: '969c103e50bdfeb52f9139c3dd53189d80d9a22d', class: "xv-container" }, h("div", { key: '5b3e4f18da410ea82fc62074f22daa8e226d6d4b', class: "xv-footer-legal-row" }, logo && (h("a", { key: '8e7bf3fd82686faa5a2e83131a542730eba7389f', class: "xv-footer-logo", href: logo.href, target: logo.target }, logo.label && h("span", { key: 'b211963ee69c7a6151cdae1a2476223f8ef73e34', class: "xv-label-02" }, logo.label), h("img", { key: '243eed6378143f9328a174f515c2c6276a90a09a', loading: "lazy", src: logo.image, alt: logo.label }))), h("ul", { key: '88538ee0047edf6df20a4e27d4d9bf348724bc56' }, legalLinks.map((item) => {
|
|
80766
81099
|
if (item.label === 'Cookie Einstellungen') {
|
|
80767
81100
|
return h("li", null, h("a", { class: "xv-helper-text-02", onClick: this.openCookieSettings }, item.label));
|
|
80768
81101
|
}
|
|
@@ -80948,7 +81281,7 @@ const XvHeader = class {
|
|
|
80948
81281
|
render() {
|
|
80949
81282
|
var _a, _b, _c, _d, _e;
|
|
80950
81283
|
const isXvBrand = (((_a = this.metaNav) === null || _a === void 0 ? void 0 : _a['WhitelabelName']) || 'Xv') === 'Xv';
|
|
80951
|
-
return (h("header", { key: '
|
|
81284
|
+
return (h("header", { key: '413975515b82ac0c3eac96c7836d3e0567393431', class: "header" }, h("div", { key: 'fa2daa56949f45da1fe9abb9e780e5cc74317710', class: "header-wrapper" }, h("div", { key: '2e40c39258e80aaedaddbe1b3365dbe000a26bd1', class: "xv-container" }, h("div", { key: '1536e648029b21576532f08756a8f9cb0265d6c9', class: "header-top" }, h("div", { key: 'c12f0a569d5af6a0db7e4884722008b801879afc', class: "header-top--left" }, h("xv-button-v2", { key: '0cec355451c1991dc4bea7747645476403b3a0e9', class: "menu-btn", variant: "ghost", onClick: this.toggleMobMenu }, h("i", { key: '0b6cbb53fab547fc0b7ba9c381815dea29e8420a', slot: "icon-left", class: { 'fa': true, 'fa-times': this.mobMenuOpen, 'fa-bars': !this.mobMenuOpen } })), this.metaNav && (h("a", { key: '6e297e0486adb1cdb8aa3d10136127a433729741', href: `${window.location.origin}/` }, h("picture", { key: '963ba9a1a8ef6f154ee26aab34707abb97b4224f' }, h("source", { key: '7e06ea0165052dc7c09a0dc6b1d3c59b5bd329b7', srcSet: ((_b = this.metaNav) === null || _b === void 0 ? void 0 : _b.LogoUrl) || 'https://www.crossvertise.com/ResourcePackages/Bootstrap/assets/dist/images/logo.svg', media: "(min-width: 990px)" }), h("img", { key: '81b305b418f0ebd656216fbb9432f70f7e8c6477', src: ((_c = this.metaNav) === null || _c === void 0 ? void 0 : _c.LogoSmallUrl) || 'https://www.crossvertise.com/ResourcePackages/Bootstrap/assets/dist/images/logo-small.svg', onError: this.logoFallback, loading: "lazy", alt: "Crossvertise" })))), this.orgUnit && (h("xv-link-v2", { key: '32177289430d1034851d99bffe332e078c7e01ad', class: "header-top--orgUnit", variant: "standalone", href: "/de-de/mycrossvertise" }, this.orgUnit))), h("ul", { key: '0ef3d85e5a38c590ec8f5a793a587b4aaf173dee', class: "header-top--right" }, this._renderSearch(), this._renderImpersonationInfo(), !((_d = this.metaNav) === null || _d === void 0 ? void 0 : _d.IsManager) && isXvBrand && (h("li", { key: 'ea34cd07f3126d6f4bfa97e84dcf7fe5b324a12c' }, h("xv-link-v2", { key: '3f3d5bc35e5961f0bec89458c534a7805dde9417', variant: "ghost", href: "https://www.crossvertise.com/ueber-uns/kontakt" }, h("xv-button-v2", { key: '7837fd8b66a7430b30122f6dfe5dee5e40183969', variant: "ghost", size: SIZE_VAR.MD }, h("i", { key: '0154c3c8c5a74df1b7f2ea55f3c3e59b5fec44be', class: "header-icon far fa-envelope" }), h("span", { key: 'bd6d80a40d20597344f86b175819ad653f789841', class: "header-label xv-body-02" }, "Kontakt"))))), this._renderNotifications(), this._renderAccount(), !((_e = this.metaNav) === null || _e === void 0 ? void 0 : _e.IsManager) && isXvBrand && (h("li", { key: '094df3526967377b32d3a2a4c9f941330122f570' }, h("xv-link-v2", { key: '374ca3a703428ce76f1aacc7f4033ce9f955c1a0', variant: "ghost", href: "https://help.crossvertise.com" }, h("xv-button-v2", { key: '07a2e7771bf8a350c02bede432f412bb584a3e1b', variant: "ghost", size: SIZE_VAR.MD }, h("i", { key: '48116ea733e87ae3801b6995208e4c9f993582cd', class: "header-icon far fa-question-circle" }), h("span", { key: '2b5ed5733555847f8d92f285f736206421c49b8f', class: "header-label xv-body-02" }, "Hilfe"))))), this._renderShoppingCart()))), h("div", { key: '6274a3a9b68ecf96def769de84f19de759e01c3d', class: "header-wrapper--bg" }, h("div", { key: 'c80e6030db6916b6fdfe72e5a707497e61aaf141', class: "xv-container" }, h("xv-mega-menu", { key: '5c1740f5061cbdd8404ce2690301afbf45fe226d', open: this.mobMenuOpen, onOpenChange: this.closeMobMenu })))), h("xv-login-modal", { key: 'eaa458800f87f7afd5fb8e59971bdb2f753e20d4', visible: this.showLoginModal, onClose: () => this.showLoginModal = false })));
|
|
80952
81285
|
}
|
|
80953
81286
|
get el() { return getElement(this); }
|
|
80954
81287
|
};
|
|
@@ -80993,7 +81326,7 @@ const XvImageViewer = class {
|
|
|
80993
81326
|
}
|
|
80994
81327
|
}
|
|
80995
81328
|
render() {
|
|
80996
|
-
return (h(Host, { key: '
|
|
81329
|
+
return (h(Host, { key: '9a38430d83c931045bed1692b0c96c4682a18c1a', class: "image-wrapper" }, this.loaded ? (h("img", { src: this.src, alt: this.alt, class: "image", onClick: this.handleClick })) : h("xv-loader-v2", { class: "loading" }, this.placeholder), this.isFullscreen && (h("div", { key: '4cdae1d6b9c5140613520b37f0be4b6da842a4ce', class: "fullscreen-overlay", onClick: this.closeFullscreen }, !this.fullscreenLoaded && h("xv-loader-v2", { key: '8eb6d9f98514ae782882f8a86eab66f3804d275a', class: "loading", size: SIZE_VAR.LG }, this.placeholder), h("img", { key: '4e25b79e548aedc045a75d8d7b3ca7e56e577ebf', src: this.fullscreenSrc || this.src, alt: this.alt, class: {
|
|
80997
81330
|
'fullscreen-image': true,
|
|
80998
81331
|
loaded: this.fullscreenLoaded,
|
|
80999
81332
|
} })))));
|
|
@@ -81018,7 +81351,7 @@ const XvLink = class {
|
|
|
81018
81351
|
e.stopPropagation();
|
|
81019
81352
|
}
|
|
81020
81353
|
render() {
|
|
81021
|
-
return (h(Host, { key: '
|
|
81354
|
+
return (h(Host, { key: '487bb531f1eade847d6ff3487830eca6ff07d9b2', class: { [`xv-link_${this.variant}`]: true, disabled: !!this.disabled } }, h("a", { key: '791b1a482545af8495b04cae22409e736fc5166b', href: this.href, onClick: this.preventLinkHandler.bind(this), class: { 'xv-link': true, 'xv-link_disabled': !!this.disabled, [this.size]: !!this.size }, target: this.target }, h("slot", { key: 'c2b0214254c2498093828d35c51eb691bf887120', name: "icon-left" }), h("slot", { key: '06df3a56df57a6a730e3352a52b178cd7c41dc8d' }), h("slot", { key: '7bc90e9c136e5fd72e61b20a134c3b8ddfeb00c2', name: "icon-right" }))));
|
|
81022
81355
|
}
|
|
81023
81356
|
};
|
|
81024
81357
|
XvLink.style = xvLinkCss();
|
|
@@ -81186,7 +81519,7 @@ const XvMegaMenu = class {
|
|
|
81186
81519
|
void this.fetchMenuData();
|
|
81187
81520
|
}
|
|
81188
81521
|
render() {
|
|
81189
|
-
return (h(Host, { key: '
|
|
81522
|
+
return (h(Host, { key: '72def4630e671be424a302fb835880cddeb6b17f' }, h("nav", { key: 'e8719aa30336759ca2c43f524ccc77d24da70eae', class: { 'xv-menu': true, open: this.open } }, this.menuLoading && (h("div", { key: '06f2ff2344b4ceda1286b19d9b103c2a5b9b2996', class: { 'xv-menu-loader': true, open: this.open } }, h("xv-loader-v2", { key: '3e49ba2fcf79b84f9308212c4d9bf0a071fc97c4' }))), h("ul", { key: '428f50fbd46b764c98738ea5a4780a4601b849b3', class: { menu: true, open: this.open } }, this.menuItems.map((menuItem) => {
|
|
81190
81523
|
var _a, _b;
|
|
81191
81524
|
return (h("li", { class: { 'menu-item': true, active: menuItem.id === ((_a = this.activeItem) === null || _a === void 0 ? void 0 : _a.id) } }, menuItem.route ? (h("xv-link-v2", { variant: "ghost", href: menuItem.route.route }, h("p", { class: "menu-item-label" }, (_b = menuItem.route) === null || _b === void 0 ? void 0 : _b.label))) : (h(Fragment, null, h("p", { class: "menu-item-label", onClick: () => this.setActiveItem(menuItem) }, menuItem === null || menuItem === void 0 ? void 0 : menuItem.label), h("ul", { class: "menu-item-groups" }, menuItem.groups.map((group) => {
|
|
81192
81525
|
var _a;
|
|
@@ -81196,7 +81529,7 @@ const XvMegaMenu = class {
|
|
|
81196
81529
|
} }, h("div", { class: "group-menus" }, h("ul", { class: { 'group-menus-categories': true, inline: group.layout === 'inline' } }, group.categories.map((category) => (h("li", { class: "category" }, h("p", { class: "category-label" }, category.label), h("ul", { class: "category-routes" }, category.routes.map((route) => (h("li", { class: "route" }, h("xv-link-v2", { size: "lg", variant: "ghost", href: route.route || '#' }, route.label), route.tag && (h("xv-tag-v2", { class: "route-tag", size: "sm", color: "#161616", bg: "#E0E0E0" }, route.tag)))))))))), h("ul", { class: "group-menus-actions" }, group.actions.map((action) => (h("li", { class: "action" }, action.type === 'link' && (h("xv-link-v2", { variant: "standalone", href: action === null || action === void 0 ? void 0 : action.url }, action.label, h("span", { class: "link-chevron", slot: "icon-right" }, "\u2192"))), action.type === 'button' &&
|
|
81197
81530
|
h("xv-button-v2", { onClick: () => this.navActionClick(action), block: true, variant: "tertiary" }, action.label)))))), (group === null || group === void 0 ? void 0 : group.card) && (h("div", { class: "group-card" }, h("xv-card-v2", { media: this.applicationContext !== 'Komsa' ? group.card.image : undefined, variant: this.isMobile ? 'horizontal' : 'vertical' }, h("h5", { slot: "header", class: "group-card-title" }, group.card.title), h("p", { slot: "body", class: "group-card-desc" }, group.card.description), group.card.linkLabel && (h("xv-link-v2", { slot: "footer", variant: "standalone", href: group.card.linkUrl || '#' }, group.card.linkLabel, h("span", { class: "link-chevron", slot: "icon-right" }, "\u2192"))))))))));
|
|
81198
81531
|
}))))));
|
|
81199
|
-
}), h("li", { key: '
|
|
81532
|
+
}), h("li", { key: '29923f808bf6e5ff3a446fc268c8724b82da0c1d', class: "menu--right" }, h("slot", { key: '50333ba3a99af998668236ce77fa138498ec6a03', name: "menu-right" })), this.open && (h("li", { key: '013f8adf4d4c4935252a92df628ee73d0bc68319', class: "menu--backdrop", onClick: () => this.handleClose() }))))));
|
|
81200
81533
|
}
|
|
81201
81534
|
get el() { return getElement(this); }
|
|
81202
81535
|
};
|
|
@@ -81264,7 +81597,7 @@ const XvModal = class {
|
|
|
81264
81597
|
}
|
|
81265
81598
|
render() {
|
|
81266
81599
|
var _a;
|
|
81267
|
-
return (h(Host, { key: '
|
|
81600
|
+
return (h(Host, { key: '395a794dfbc5e54df4bf4c9ef825180dc02c76fe', role: "dialog", size: this.size, id: this.el.id }, h("slot", { key: '0d54138edf1edfe30a3a05fc9bcbe88699cc0134', name: "trigger", onSlotchange: this.setupTrigger }), h("div", { key: '12a6853ad559cec0829cd2af935de51ada0516f5', class: { backdrop: true }, onClick: this.onBackdropClick }, h("div", { key: '41704448acaab0cfd70aadfe67ac3aa3e803765e', class: "modal" }, h("button", { key: '82c3756ba70e011197015cce6fbbfccd652fce8b', class: "modal_close", onClick: this.closeModal.bind(this) }, "\u00D7"), h("div", { key: '216a696e637a83db67f17a46570238987f5762a8', class: "modal_header" }, h("slot", { key: 'e0f7a8b13d470ea6dbe922f2f535c6776397d249', name: "header" }, ((_a = this.el) === null || _a === void 0 ? void 0 : _a.title) && h("h5", { key: '0fd4666c85f2a65bcae87fddda4c27b4e606244a', class: "modal_header__title" }, this.el.title))), h("div", { key: 'b05859b3b895c7c481586c063f9940f1834e17b5', class: { 'modal_content': true, overflow: this.overflow } }, h("slot", { key: '98ed63c3083036b3aa9f2888754fd4e80a0fcfdc' })), h("div", { key: 'eec90c432f5002a2022a8d153db5633f8e09ebeb', class: "modal_footer" }, h("slot", { key: 'c7f99d613b1a3ff540e49a63010b2efcd0141f6b', name: "footer" })), !!this.loading && (h("div", { key: '4396aa0a43fef8dcb2a333165a9173db6e4a55ad', class: "loading" }, h("xv-loader-v2", { key: '3ca8de976550d84bbf72111e0b177be353e82adf', size: SIZE_VAR.LG })))))));
|
|
81268
81601
|
}
|
|
81269
81602
|
disconnectedCallback() {
|
|
81270
81603
|
this.removeTriggerListener();
|
|
@@ -81302,14 +81635,14 @@ const XvNotification = class {
|
|
|
81302
81635
|
};
|
|
81303
81636
|
}
|
|
81304
81637
|
render() {
|
|
81305
|
-
return (h(Host, { key: '
|
|
81638
|
+
return (h(Host, { key: '235e7eeac319dc62f6fdda891c89eeb7eff6436b', class: "xv-notification", type: this.variant }, this.renderIcon(this.variant), h("div", { key: 'a3a9a61c8d1d9dcacf4d62da5c68b88f27e90ac0', class: "content" }, h("div", { key: 'b6a14771fc956020fa3c98706835dbaa8007d175', class: "content_wrapper" }, this.el.title && h("h5", { key: 'c8da5f2ababfa11e208a6f547f80be6dc06f6117', class: "content_title" }, this.el.title), h("slot", { key: 'faf09191d7393005fe665adedf71d6eb4e9a697c' })), h("slot", { key: '10839bbdfe5833733f95a2b06e88c3a72a12134d', name: "footer" })), this.dismissible && h("button", { key: 'ea7e69ca969267efef32bc2726658ab1de3307db', class: "close", onClick: this.closeHandle })));
|
|
81306
81639
|
}
|
|
81307
81640
|
static get assetsDirs() { return ["xv-notification/icons"]; }
|
|
81308
81641
|
get el() { return getElement(this); }
|
|
81309
81642
|
};
|
|
81310
81643
|
XvNotification.style = xvNotificationCss();
|
|
81311
81644
|
|
|
81312
|
-
const xvNumberInputCss = () => `.xv-container{width:100%;max-width:1170px;margin-inline:auto}@media (min-width: 576px){.xv-container{max-width:540px}}@media (min-width: 768px){.xv-container{max-width:720px}}@media (min-width: 992px){.xv-container{max-width:960px;padding-inline:var(--bs-gutter-x, 0.75rem)}}@media (min-width: 1200px){.xv-container{max-width:1140px}}@media (min-width: 1400px){.xv-container{max-width:1320px}}.xv-tooltip[role=tooltip]{position:absolute;background-color:var(--background-inverse, #333333);color:var(--text-on-color);padding:var(--spacing-03) var(--spacing-04);border-radius:3px;font-size:var(--fz-sm);z-index:999;min-width:min(150px, 90vw);max-width:min(400px, 90vw)}.xv-tooltip[role=tooltip]::after{content:"";position:absolute;width:0;height:0;border-style:solid}.xv-tooltip[role=tooltip][data-popper-placement=top]::after{bottom:-5px;left:50%;transform:translateX(-50%);border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-start]::after{bottom:-5px;left:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-end]::after{bottom:-5px;right:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom]::after{top:-5px;left:50%;transform:translateX(-50%);border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-start]::after{top:-5px;left:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-end]::after{top:-5px;right:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=left]::after{top:50%;right:-5px;transform:translateY(-50%);border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-start]::after{top:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-end]::after{bottom:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=right]::after{top:50%;left:-5px;transform:translateY(-50%);border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-start]::after{top:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-end]::after{bottom:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}:host{display:inline-block;text-align:left}:host .control_label{display:block;margin-bottom:var(--spacing-03);color:var(--text-secondary, #515151);font-family:var(--ff-body,
|
|
81645
|
+
const xvNumberInputCss = () => `.xv-container{width:100%;max-width:1170px;margin-inline:auto}@media (min-width: 576px){.xv-container{max-width:540px}}@media (min-width: 768px){.xv-container{max-width:720px}}@media (min-width: 992px){.xv-container{max-width:960px;padding-inline:var(--bs-gutter-x, 0.75rem)}}@media (min-width: 1200px){.xv-container{max-width:1140px}}@media (min-width: 1400px){.xv-container{max-width:1320px}}.xv-tooltip[role=tooltip]{position:absolute;background-color:var(--background-inverse, #333333);color:var(--text-on-color);padding:var(--spacing-03) var(--spacing-04);border-radius:3px;font-size:var(--fz-sm);z-index:999;min-width:min(150px, 90vw);max-width:min(400px, 90vw)}.xv-tooltip[role=tooltip]::after{content:"";position:absolute;width:0;height:0;border-style:solid}.xv-tooltip[role=tooltip][data-popper-placement=top]::after{bottom:-5px;left:50%;transform:translateX(-50%);border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-start]::after{bottom:-5px;left:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-end]::after{bottom:-5px;right:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom]::after{top:-5px;left:50%;transform:translateX(-50%);border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-start]::after{top:-5px;left:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-end]::after{top:-5px;right:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=left]::after{top:50%;right:-5px;transform:translateY(-50%);border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-start]::after{top:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-end]::after{bottom:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=right]::after{top:50%;left:-5px;transform:translateY(-50%);border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-start]::after{top:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-end]::after{bottom:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}:host{display:inline-block;text-align:left}:host .control_label{display:block;margin-bottom:var(--spacing-03);color:var(--text-secondary, #515151);font-family:var(--ff-body), sans-serif;font-size:var(--fz-sm, 12px);font-style:normal;font-weight:400;line-height:var(--fz-md);letter-spacing:0.32px}:host .control_input{display:flex;border:1px solid var(--border-subtle-01);outline:2px solid transparent;background-color:transparent;border-radius:3px;transition:250ms ease-in-out border-color, 250ms ease-in-out outline-color}:host .control_input:hover{border-color:var(--border-subtle-selected-01)}:host .control_input:focus-within{outline-color:var(--focus)}:host .control_input.error{outline-color:var(--support-error)}:host .control_input.readonly{border-radius:0;border-top-width:0;border-left-width:0;border-right-width:0;outline-color:transparent}:host .control_input input[type=number]{flex:1;border:none;outline:none;-moz-appearance:textfield;background-color:transparent;margin:0;padding-block:0;padding-inline:var(--spacing-05);font-family:inherit;box-sizing:border-box;color:var(--text-primary);min-width:20px;font-style:normal;font-weight:400;letter-spacing:0.16px}:host .control_input input[type=number]::-webkit-inner-spin-button,:host .control_input input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}:host .control_input__icons{display:inline-flex;align-items:stretch;column-gap:2px}:host .control_input__icons .status-icon{display:inline-flex;align-items:center;align-self:center;font-size:1.35em;font-weight:400;color:var(--icon-primary, #131313)}:host .control_input__icons .status-icon.error{background-color:var(--support-error);color:white;width:16px;height:16px;border-radius:8px;font-size:12px;font-weight:bold;align-items:center;justify-content:center}:host .control_input__icons .status-icon.warning{color:var(--support-warning)}:host .control_input__icons hr{border:none;outline:none;width:1px;height:60%;align-self:center;background-color:var(--border-subtle-01);display:inline-flex}:host .message{margin:var(--spacing-02) 0 0;color:var(--text-helper, #646464);font-size:var(--fz-sm, 12px);font-style:normal;font-weight:400;line-height:var(--fz-md, 16px);letter-spacing:0.32px}:host .message.error{color:var(--text-error)}:host .message.warning{color:var(--text-secondary, #515151)}:host(.disabled){cursor:not-allowed}:host(.disabled) .control_label,:host(.disabled) .control_input input[type=number],:host(.disabled) .control_input input[type=number]::placeholder,:host(.disabled) .message:not(.error){color:var(--text-disabled);cursor:not-allowed}:host(.disabled) .control_input__icons,:host(.disabled) .message.error{opacity:0.5;cursor:not-allowed}:host([block]){display:block}`;
|
|
81313
81646
|
|
|
81314
81647
|
const XvNumberInput = class {
|
|
81315
81648
|
constructor(hostRef) {
|
|
@@ -81352,12 +81685,12 @@ const XvNumberInput = class {
|
|
|
81352
81685
|
this.valueChange.emit(this.value);
|
|
81353
81686
|
}
|
|
81354
81687
|
render() {
|
|
81355
|
-
return (h(Host, { key: '
|
|
81688
|
+
return (h(Host, { key: '4c2205967e9fa39e5b666a8887bb4d8b71c46108', class: { disabled: !!this.disabled } }, h("label", { key: '8dca0dde06e78d972ab03eed43e1d9de119b9aa3', class: "control" }, this.label && h("span", { key: '8f8c87e0acbe83723122d7b54620aa4356215cf4', class: "control_label" }, this.label), h("div", { key: '9b416f35eb4bf00ca31b77db749605dce47a10cb', class: {
|
|
81356
81689
|
'control_input': true,
|
|
81357
81690
|
readonly: !!this.readonly,
|
|
81358
81691
|
error: !!this.error,
|
|
81359
81692
|
warning: !!this.warning
|
|
81360
|
-
} }, h("input", { key: '
|
|
81693
|
+
} }, h("input", { key: '5c8ae79945236934e457de24525d09b3ae0e6042', type: "number", placeholder: this.placeholder, disabled: this.disabled, readonly: this.readonly, onInput: this.handleInput, name: this.name, min: this.min, max: this.max, step: this.step, value: this.value }), h("div", { key: '2f9f8d47a4544ca7cc033ee8ef7cd91e9064025f', class: "control_input__icons" }, this.loading ? (h("xv-loader-v2", { size: SIZE_VAR.XS })) : !!this.error ? (h("span", { class: "status-icon error", "aria-hidden": "true" }, "!")) : !!this.warning ? (h("span", { class: "status-icon warning", "aria-hidden": "true" }, "\u26A0")) : null, h("xv-button-v2", { key: '7097cadf8d099044c102287f9f421a0775524172', size: this.size, variant: "ghost", disabled: this.disabled || this.readonly, onClick: this.decrement, "aria-label": "Decrease" }, h("span", { key: '99dc4fbc627b26d761da0408b3168fa588e62c73', slot: "icon-left", class: "status-icon" }, "\u2212")), h("hr", { key: '5426ac1ecaba3e8764c0f29a2fbe4562181eee82' }), h("xv-button-v2", { key: 'aa3b6032cb85512977d90ff61d9f098c704844de', size: this.size, variant: "ghost", disabled: this.disabled || this.readonly, onClick: this.increment, "aria-label": "Increase" }, h("span", { key: '676cc79dfe281c5eaf1c8c388373c9693a04ca03', slot: "icon-left", class: "status-icon" }, "+"))))), this.helper && h("p", { key: '1708cd3888daf09b1ab77780d6657f412a037f33', class: "message" }, this.helper), typeof this.error === 'string' ? (h("p", { class: "message error" }, this.error)) : typeof this.warning === 'string' ? (h("p", { class: "message warning" }, this.warning)) : null));
|
|
81361
81694
|
}
|
|
81362
81695
|
static get formAssociated() { return true; }
|
|
81363
81696
|
};
|
|
@@ -81415,8 +81748,8 @@ const XvOverflowMenu = class {
|
|
|
81415
81748
|
}
|
|
81416
81749
|
}
|
|
81417
81750
|
render() {
|
|
81418
|
-
const button = (h("button", { key: '
|
|
81419
|
-
return (h(Host, { key: '
|
|
81751
|
+
const button = (h("button", { key: '73720460fc78213115a31c0181c4c7f1385560e4', class: { btn: true, open: this.open }, onClick: this.onOpenToggle, disabled: this.disabled }, h("slot", { key: '166ef848a483e25b30680eac57d0b722dc52af02', name: "trigger" }, h("svg", { key: '2577f8a2282cf39f3e6895e771b38a252a73d95f', xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", viewBox: "0 0 128 512" }, h("path", { key: '9205ac66ede166449766a20a71741ccac988424f', d: "M64 368a48 48 0 1 0 0 96 48 48 0 1 0 0-96zm0-160a48 48 0 1 0 0 96 48 48 0 1 0 0-96zM112 96A48 48 0 1 0 16 96a48 48 0 1 0 96 0z" })))));
|
|
81752
|
+
return (h(Host, { key: '17e345c7cb7cc90ed3faf618923545091e205a21', class: "xv-overflow-menu", size: this.size, role: "menu", tabindex: -1 }, this.tooltip ? h("xv-tooltip-v2", { message: this.tooltip }, button) : button, h("div", { key: 'f9bfd6ff02216be53e2318534f385d33d3476be6', class: { list: true, open: this.open, [`position-${this.position}`]: true } }, h("slot", { key: 'ce9f3b5465c5fba9d3e2eccdddc061e891883596' }))));
|
|
81420
81753
|
}
|
|
81421
81754
|
componentDidLoad() {
|
|
81422
81755
|
this.openChangeHandle();
|
|
@@ -81449,7 +81782,7 @@ const XvOverflowMenuItem = class {
|
|
|
81449
81782
|
this.itemClick.emit({ event, value: this.value });
|
|
81450
81783
|
}
|
|
81451
81784
|
render() {
|
|
81452
|
-
return (h(Host, { key: '
|
|
81785
|
+
return (h(Host, { key: 'dcb24e934cb3cfb138f543c08a3019616c45f06d', class: "xv-overflow-menu-item", role: "menuitem", disabled: this.disabled }, h("slot", { key: 'e7bc0635305bcc2c5076ab69d900e03563caae3f' })));
|
|
81453
81786
|
}
|
|
81454
81787
|
};
|
|
81455
81788
|
XvOverflowMenuItem.style = xvOverflowMenuItemCss();
|
|
@@ -81547,7 +81880,7 @@ const XvPagination = class {
|
|
|
81547
81880
|
this.observer.disconnect();
|
|
81548
81881
|
}
|
|
81549
81882
|
render() {
|
|
81550
|
-
return (h(Host, { key: '
|
|
81883
|
+
return (h(Host, { key: '1a7aab4fae3cc3a92ce20ed15839636d753bd3e6', class: { block: this.block, [this.currentVariant]: true, [this.size]: !!this.size } }, this.currentVariant === 'full' && (h("div", { key: 'a6dd623522eb06beccdce1f90c5ad3ca63fa3039', class: "block" }, h("select", { key: '800115649fcf5d758f00765b7b8a231f716b8660', class: "options-select", name: "options", onChange: this.handleItemsPerPageChange }, this.itemsPerPageOptions.map((v) => h("option", { value: v }, v))))), this.currentVariant === 'full' && (h("span", { key: '8a7cfffb7a1731d5ff9c29c63f51ecf656512cd2', class: "block block_full" }, `${(this.page - 1) * this.itemsPerPage + 1} – ${Math.min(this.page * this.itemsPerPage, this.totalItems)} von ${this.totalItems} Einträgen`)), this.currentVariant === 'full' && (h("div", { key: '5838adec4f878b2d424d7c43f2bcd333c38fc75d', class: "block" }, h("select", { key: 'c931eea3b5abb75b27d16fc094ab62db6d03c94a', class: "options-select", name: "pages", onChange: this.handlePageSelectChange }, Array.from({ length: this.total }, (_, i) => (h("option", { selected: this.page === i + 1, value: i + 1 }, i + 1)))), h("span", { key: '12f06632f7aba021d629c212fd04d251c9714510' }, "von ", this.total, " Seiten"))), this.currentVariant === 'compact' && h("span", { key: 'ce90ddcc1e33a7433b9634478e3e91282cbc3768', class: "block" }, "Seite ", this.page), h("xv-button-v2", { key: '9d400ce87b4828192e0d5453ca2838eebe696f6d', variant: "ghost", size: this.size, onClick: () => this.handlePageChange(this.page - 1), disabled: this.page <= 1 }, h("span", { key: 'cab1af288635b420d2ce24848afacdf059b91f24', slot: "icon-left", class: "icon icon_prev" })), this.currentVariant === 'regular' && (h("ul", { key: '8aab2c1ad4749eaa5372b1790e1f9dcae9210f41', class: "list" }, this.visiblePagesWithDots.map((page) => (h("li", { class: { active: this.page === page } }, page === 'dots-start' ? (h("div", { class: "list_dots" }, h("xv-button-v2", { variant: "ghost", size: this.size, tabindex: -1 }, h("span", { slot: "icon-left", class: "list_dots__icon" }, "...")), h("select", { name: "start", onChange: this.handlePageSelectChange }, Array.from({ length: this.page - 3 }, (_, i) => (h("option", { value: i + 2 }, i + 2)))))) : page === 'dots-end' ? (h("div", { class: "list_dots" }, h("xv-button-v2", { variant: "ghost", size: this.size, tabindex: -1 }, h("span", { slot: "icon-left", class: "list_dots__icon" }, "...")), h("select", { name: "end", onChange: this.handlePageSelectChange }, Array.from({ length: this.total - (this.page + 2) }, (_, i) => (h("option", { value: i + this.page + 2 }, i + this.page + 2)))))) : (h("xv-button-v2", { variant: "ghost", size: this.size, disabled: this.page === page, onClick: () => this.handlePageChange(page) }, h("span", { class: "list_page", slot: "icon-left" }, page)))))))), h("xv-button-v2", { key: 'f2aa2d873b60a5f38355bc9d78bd4a2820c0bfa6', variant: "ghost", size: this.size, onClick: () => this.handlePageChange(this.page + 1), disabled: this.page >= this.total }, h("span", { key: '39ebbf125c026ceed8e70057a7aa03ef6eea8b90', slot: "icon-left", class: "icon icon_next" }))));
|
|
81551
81884
|
}
|
|
81552
81885
|
get el() { return getElement(this); }
|
|
81553
81886
|
};
|
|
@@ -81616,7 +81949,7 @@ const XvProgressIndicator = class {
|
|
|
81616
81949
|
this.updateChildItems();
|
|
81617
81950
|
}
|
|
81618
81951
|
render() {
|
|
81619
|
-
return (h(Host, { key: '
|
|
81952
|
+
return (h(Host, { key: '45e33259c01f9dfb90532dbbf1cb3b7a1f5084fc', variant: this.variant, size: this.size, class: { 'xv-progress-indicator': true } }, h("slot", { key: '29fac0a6e79851f1d392aa9407bdf3002c553fd6' })));
|
|
81620
81953
|
}
|
|
81621
81954
|
get el() { return getElement(this); }
|
|
81622
81955
|
static get watchers() { return {
|
|
@@ -81635,13 +81968,13 @@ const XvProgressIndicatorItem = class {
|
|
|
81635
81968
|
this.status = PROGRESS_ITEM_STATUS.NO_STARTED;
|
|
81636
81969
|
}
|
|
81637
81970
|
render() {
|
|
81638
|
-
return (h(Host, { key: '
|
|
81971
|
+
return (h(Host, { key: 'cfcb35613b67d35b40b0c1ece5715c4e0bb8f372', status: this.status, class: { 'xv-progress-indicator-item': true } }, h("span", { key: '9c8d521503fb4a26e479257fecd720b78a2f2c34', class: "line" }), h("span", { key: 'c98ed72b0a3bfe908bf9ca671676552bee7ea0ef', class: "icon" }, h("svg", { key: '62fc0b686ca5704d23a2938e902497f717a2cdd8', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 448 512" }, h("path", { key: '2e7b4c3a6f348e54a770e606995904fec3e4f63c', 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: 'c88fb4bf6b60702e68dee7179656838b4997c2b8', class: "label" }, h("slot", { key: '7e065b6163bcc6ece9e3bf5119c42027df5dae09' }))));
|
|
81639
81972
|
}
|
|
81640
81973
|
get el() { return getElement(this); }
|
|
81641
81974
|
};
|
|
81642
81975
|
XvProgressIndicatorItem.style = xvProgressIndicatorItemCss();
|
|
81643
81976
|
|
|
81644
|
-
const xvRadioCss = () => `.xv-container{width:100%;max-width:1170px;margin-inline:auto}@media (min-width: 576px){.xv-container{max-width:540px}}@media (min-width: 768px){.xv-container{max-width:720px}}@media (min-width: 992px){.xv-container{max-width:960px;padding-inline:var(--bs-gutter-x, 0.75rem)}}@media (min-width: 1200px){.xv-container{max-width:1140px}}@media (min-width: 1400px){.xv-container{max-width:1320px}}.xv-tooltip[role=tooltip]{position:absolute;background-color:var(--background-inverse, #333333);color:var(--text-on-color);padding:var(--spacing-03) var(--spacing-04);border-radius:3px;font-size:var(--fz-sm);z-index:999;min-width:min(150px, 90vw);max-width:min(400px, 90vw)}.xv-tooltip[role=tooltip]::after{content:"";position:absolute;width:0;height:0;border-style:solid}.xv-tooltip[role=tooltip][data-popper-placement=top]::after{bottom:-5px;left:50%;transform:translateX(-50%);border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-start]::after{bottom:-5px;left:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-end]::after{bottom:-5px;right:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom]::after{top:-5px;left:50%;transform:translateX(-50%);border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-start]::after{top:-5px;left:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-end]::after{top:-5px;right:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=left]::after{top:50%;right:-5px;transform:translateY(-50%);border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-start]::after{top:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-end]::after{bottom:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=right]::after{top:50%;left:-5px;transform:translateY(-50%);border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-start]::after{top:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-end]::after{bottom:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-radio{--xv-radio-size:16px;display:inline-flex;flex-direction:column;row-gap:var(--spacing-03);font-family:var(--ff-body,
|
|
81977
|
+
const xvRadioCss = () => `.xv-container{width:100%;max-width:1170px;margin-inline:auto}@media (min-width: 576px){.xv-container{max-width:540px}}@media (min-width: 768px){.xv-container{max-width:720px}}@media (min-width: 992px){.xv-container{max-width:960px;padding-inline:var(--bs-gutter-x, 0.75rem)}}@media (min-width: 1200px){.xv-container{max-width:1140px}}@media (min-width: 1400px){.xv-container{max-width:1320px}}.xv-tooltip[role=tooltip]{position:absolute;background-color:var(--background-inverse, #333333);color:var(--text-on-color);padding:var(--spacing-03) var(--spacing-04);border-radius:3px;font-size:var(--fz-sm);z-index:999;min-width:min(150px, 90vw);max-width:min(400px, 90vw)}.xv-tooltip[role=tooltip]::after{content:"";position:absolute;width:0;height:0;border-style:solid}.xv-tooltip[role=tooltip][data-popper-placement=top]::after{bottom:-5px;left:50%;transform:translateX(-50%);border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-start]::after{bottom:-5px;left:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-end]::after{bottom:-5px;right:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom]::after{top:-5px;left:50%;transform:translateX(-50%);border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-start]::after{top:-5px;left:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-end]::after{top:-5px;right:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=left]::after{top:50%;right:-5px;transform:translateY(-50%);border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-start]::after{top:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-end]::after{bottom:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=right]::after{top:50%;left:-5px;transform:translateY(-50%);border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-start]::after{top:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-end]::after{bottom:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-radio{--xv-radio-size:16px;display:inline-flex;flex-direction:column;row-gap:var(--spacing-03);font-family:var(--ff-body), sans-serif;font-size:var(--fz-sm, 12px);font-style:normal;font-weight:400;letter-spacing:0.16px;line-height:128.571%;text-align:left}.xv-radio--block{display:flex}.xv-radio--reverse{justify-content:flex-end;text-align:right}.xv-radio--reverse .xv-radio_container,.xv-radio--reverse .xv-radio_msg{flex-direction:row-reverse}.xv-radio--size-xs{--xv-radio-size:9px;font-size:var(--fz-xs)}.xv-radio--size-sm{--xv-radio-size:12px}.xv-radio--size-md{--xv-radio-size:16px}.xv-radio--size-lg{--xv-radio-size:20px}.xv-radio--size-xl{--xv-radio-size:24px;font-size:var(--fz-lg)}.xv-radio_label{user-select:none;color:var(--text-secondary, #515151);font-weight:400;padding:0;margin:0}.xv-radio_container{display:inline-flex;align-items:center;cursor:pointer;column-gap:var(--spacing-03);margin:0}.xv-radio_container.disabled{cursor:not-allowed;opacity:0.6}.xv-radio_container__label{user-select:none;color:var(--text-primary, #333);font-size:1.2em}.xv-radio_input{position:relative;color:var(--interactive-01, #273435)}.xv-radio_input input[type=radio]{position:absolute;opacity:0;top:0;left:0;right:0;bottom:0}.xv-radio_input input[type=radio]:checked+.xv-radio_input__mark:after{content:"";position:absolute;width:calc(var(--xv-radio-size) / 2);height:calc(var(--xv-radio-size) / 2);border-radius:50%;background-color:currentColor;top:calc(50% - var(--xv-radio-size) / 4);left:calc(50% - var(--xv-radio-size) / 4)}.xv-radio_input input[type=radio]:focus+.xv-radio_input__mark{outline:1px solid currentColor}.xv-radio_input__mark{position:relative;display:inline-flex;width:var(--xv-radio-size);height:var(--xv-radio-size);border-radius:50%;border:1px solid currentColor}.xv-radio_input--error{color:var(--text-error)}.xv-radio_msg{display:flex;align-items:center;flex-direction:row;column-gap:var(--spacing-03)}.xv-radio_msg--error{color:var(--text-error)}.xv-radio_msg--error .xv-radio_msg__status{background-color:var(--support-error);color:white;border-radius:var(--xv-radio-size);font-size:calc(var(--xv-radio-size) / 1.3);font-weight:bold;align-items:center;justify-content:center}.xv-radio_msg--warning{color:var(--text-secondary, #515151)}.xv-radio_msg--warning .xv-radio_msg__status{font-size:var(--xv-radio-size);color:var(--support-warning)}.xv-radio_msg__status{display:inline-flex;align-items:center;align-self:center;font-size:1.35em;width:var(--xv-radio-size);height:var(--xv-radio-size)}.xv-radio [slot=info]{display:inline-block;color:var(--text-secondary, #515151);margin:0;padding:0}`;
|
|
81645
81978
|
|
|
81646
81979
|
const XvRadio = class {
|
|
81647
81980
|
constructor(hostRef) {
|
|
@@ -81667,12 +82000,12 @@ const XvRadio = class {
|
|
|
81667
82000
|
}
|
|
81668
82001
|
}
|
|
81669
82002
|
render() {
|
|
81670
|
-
return (h("div", { key: '
|
|
82003
|
+
return (h("div", { key: '8f40f0a639e61e91f1c59e5c11c4acbcdd982f49', class: {
|
|
81671
82004
|
'xv-radio': true,
|
|
81672
82005
|
'xv-radio--reverse': this.reverse,
|
|
81673
82006
|
'xv-radio--block': this.block,
|
|
81674
82007
|
[`xv-radio--size-${this.size}`]: !!this.size,
|
|
81675
|
-
} }, this.label && h("p", { key: '
|
|
82008
|
+
} }, this.label && h("p", { key: 'f277cccd732c2bbe7b8539ff91330d070539f738', class: "xv-radio_label" }, this.label), h("label", { key: '98a6b0281a0c01d4a9ae5399d50e375bd737575d', class: { 'xv-radio_container': true, disabled: this.disabled } }, h("div", { key: '7bbf06b3f63f074597f174feaadd1eca83b5ccdf', class: { 'xv-radio_input': true, 'xv-radio_input--error': !!this.error || this.error === '' } }, h("input", { key: '431866b919a68b2d78dc2f0c61b9407290d8ca5a', ref: el => (this.inputEl = el), type: "radio", name: this.name, value: this.value, checked: this.checked, readonly: this.readonly, disabled: this.disabled }), h("span", { key: '92ffae36802ea09bfeb5f6bd11cf200824821dad', class: "xv-radio_input__mark" })), h("span", { key: 'b13471b0a20c2aeef4a5395aece483edbcbaaaab', class: "xv-radio_container__label" }, h("slot", { key: '1ab86f9ef84bb60c47396228333a9031f34be03d' }))), this.error && typeof this.error === 'string' && (h("span", { key: 'dc647adaffebc46e783b906eab32611fbfc59f2b', class: "xv-radio_msg xv-radio_msg--error" }, h("span", { key: 'cc9257571ac674a36bb18eecd6225fc4e7d5cdfd', class: "xv-radio_msg__status", "aria-hidden": "true" }, "!"), this.error)), this.warning && typeof this.warning === 'string' && (h("span", { key: '9533a6c9e04f662e08527096c38fd745b6eedcf8', class: "xv-radio_msg xv-radio_msg--warning" }, h("span", { key: 'c904e88f9bf6c11f0f79fb15c5dc6be861b1ec60', class: "xv-radio_msg__status", "aria-hidden": "true" }, "\u26A0"), this.warning)), h("slot", { key: 'b648ea9fb57255ef87678fce182730960bb96a10', name: "info" })));
|
|
81676
82009
|
}
|
|
81677
82010
|
connectedCallback() {
|
|
81678
82011
|
var _a;
|
|
@@ -81706,7 +82039,7 @@ const XvRadio = class {
|
|
|
81706
82039
|
};
|
|
81707
82040
|
XvRadio.style = xvRadioCss();
|
|
81708
82041
|
|
|
81709
|
-
const xvSliderCss = () => `.xv-container{width:100%;max-width:1170px;margin-inline:auto}@media (min-width: 576px){.xv-container{max-width:540px}}@media (min-width: 768px){.xv-container{max-width:720px}}@media (min-width: 992px){.xv-container{max-width:960px;padding-inline:var(--bs-gutter-x, 0.75rem)}}@media (min-width: 1200px){.xv-container{max-width:1140px}}@media (min-width: 1400px){.xv-container{max-width:1320px}}.xv-tooltip[role=tooltip]{position:absolute;background-color:var(--background-inverse, #333333);color:var(--text-on-color);padding:var(--spacing-03) var(--spacing-04);border-radius:3px;font-size:var(--fz-sm);z-index:999;min-width:min(150px, 90vw);max-width:min(400px, 90vw)}.xv-tooltip[role=tooltip]::after{content:"";position:absolute;width:0;height:0;border-style:solid}.xv-tooltip[role=tooltip][data-popper-placement=top]::after{bottom:-5px;left:50%;transform:translateX(-50%);border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-start]::after{bottom:-5px;left:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-end]::after{bottom:-5px;right:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom]::after{top:-5px;left:50%;transform:translateX(-50%);border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-start]::after{top:-5px;left:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-end]::after{top:-5px;right:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=left]::after{top:50%;right:-5px;transform:translateY(-50%);border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-start]::after{top:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-end]::after{bottom:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=right]::after{top:50%;left:-5px;transform:translateY(-50%);border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-start]::after{top:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-end]::after{bottom:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}:host{display:flex;flex-direction:column;gap:var(--spacing-03, 8px);text-align:left;font-family:var(--ff-body)}:host .label{color:var(--text-secondary, #515151);font-size:var(--fz-sm);font-weight:
|
|
82042
|
+
const xvSliderCss = () => `.xv-container{width:100%;max-width:1170px;margin-inline:auto}@media (min-width: 576px){.xv-container{max-width:540px}}@media (min-width: 768px){.xv-container{max-width:720px}}@media (min-width: 992px){.xv-container{max-width:960px;padding-inline:var(--bs-gutter-x, 0.75rem)}}@media (min-width: 1200px){.xv-container{max-width:1140px}}@media (min-width: 1400px){.xv-container{max-width:1320px}}.xv-tooltip[role=tooltip]{position:absolute;background-color:var(--background-inverse, #333333);color:var(--text-on-color);padding:var(--spacing-03) var(--spacing-04);border-radius:3px;font-size:var(--fz-sm);z-index:999;min-width:min(150px, 90vw);max-width:min(400px, 90vw)}.xv-tooltip[role=tooltip]::after{content:"";position:absolute;width:0;height:0;border-style:solid}.xv-tooltip[role=tooltip][data-popper-placement=top]::after{bottom:-5px;left:50%;transform:translateX(-50%);border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-start]::after{bottom:-5px;left:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-end]::after{bottom:-5px;right:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom]::after{top:-5px;left:50%;transform:translateX(-50%);border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-start]::after{top:-5px;left:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-end]::after{top:-5px;right:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=left]::after{top:50%;right:-5px;transform:translateY(-50%);border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-start]::after{top:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-end]::after{bottom:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=right]::after{top:50%;left:-5px;transform:translateY(-50%);border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-start]::after{top:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-end]::after{bottom:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}:host{display:flex;flex-direction:column;gap:var(--spacing-03, 8px);text-align:left;font-family:var(--ff-body), sans-serif}:host .label{color:var(--text-secondary, #515151);font-size:var(--fz-sm);font-weight:400;line-height:var(--fz-md);letter-spacing:0.32px}:host .control{display:flex;align-items:center;gap:var(--spacing-04, 12px)}:host .control_label{text-align:center;color:var(--text-primary, #333);font-size:var(--fz-md);font-weight:400;line-height:var(--fz-lg);letter-spacing:0.32px}:host .control input[type=range]{flex:1;appearance:none;height:4px;border-radius:2px;outline:none;background-color:var(--border-subtle-01, #D1D1D1);background-image:linear-gradient(var(--interactive-02), var(--interactive-02));background-repeat:no-repeat}:host .control input[type=range]::-webkit-slider-thumb{appearance:none;width:20px;height:20px;border-radius:50%;background-color:var(--interactive-02, #96bf00);cursor:pointer;border:2px solid transparent;outline:2px solid transparent;transition:200ms ease-in-out border-color, 200ms ease-in-out outline-color}:host .control input[type=range]::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background-color:var(--interactive-02, #96bf00);border:2px solid transparent;outline:2px solid transparent;cursor:pointer;transition:200ms ease-in-out border-color, 200ms ease-in-out outline-color}:host .control input[type=range]:focus::-webkit-slider-thumb{border-color:white;outline-color:var(--focus)}:host .control input[type=range]:focus::-moz-range-thumb{border-color:white;outline-color:var(--focus)}:host .control input[type=number]{inline-size:3.7em;padding:var(--spacing-04) var(--spacing-02) var(--spacing-04) var(--spacing-04);text-align:center;border-radius:3px;background:var(--field-02, #FFF);box-shadow:0 0 0 1px #8B8B8B inset;border:none}:host(.disabled) .label,:host(.disabled) .control_label,:host(.disabled) input[type=number]{color:var(--text-disabled, rgba(19, 19, 19, 0.25))}:host(.disabled) .control input[type=range]{background-image:none;background-color:var(--border-subtle-01, #D1D1D1)}:host(.disabled) .control input[type=range]::-webkit-slider-thumb{background-color:var(--border-subtle-01, #D1D1D1)}:host(.disabled) .control input[type=range]::-moz-range-thumb{background-color:var(--border-subtle-01, #D1D1D1)}:host(.disabled) .control input[type=number]{background-color:var(--field-01, #F7F7F7);box-shadow:none}:host(.readonly) input[type=number]{box-shadow:none;outline:none;background-color:var(--field-01, #F7F7F7)}`;
|
|
81710
82043
|
|
|
81711
82044
|
const XvSlider = class {
|
|
81712
82045
|
constructor(hostRef) {
|
|
@@ -81756,7 +82089,7 @@ const XvSlider = class {
|
|
|
81756
82089
|
this.setValue(this.min);
|
|
81757
82090
|
}
|
|
81758
82091
|
render() {
|
|
81759
|
-
return (h(Host, { key: '
|
|
82092
|
+
return (h(Host, { key: 'c142eca9d5cbadff35ae17d08660aa4f1b035209', class: { disabled: this.disabled, readonly: this.readonly } }, this.label && h("label", { key: '1f143f27dfdb97e89f22878ce078e95e0c62dcb9', class: "label" }, this.label), h("div", { key: '519812acc6e027e02e513d60c15bfa0e580b2baa', class: "control" }, h("span", { key: '77d924c0384c02ed708f7ca004269a728dfd34f9', class: "control_label" }, this.min), h("input", { key: '8786885b500f564d1f172e954bd71f7c7f74ceed', type: "range", disabled: this.disabled || this.readonly, readonly: this.readonly, name: this.name, min: this.min, max: this.max, step: this.step, value: this.value, onInput: this.handleInput, style: { backgroundSize: `${((this.value - this.min) * 100) / (this.max - this.min)}% 100%` } }), h("span", { key: '06dc306d120db3aa865ebe9e332eaa8e08e96e84', class: "control_label" }, this.max), !this.notEditable && (h("input", { key: '75914e5010ebe2771a707629024c623f3703b377', type: "number", disabled: this.disabled, readonly: this.readonly, name: `${this.name}-number-input`, step: this.step, min: this.min, max: this.max, value: this.value, onInput: this.handleNumberInput, onBlur: this.handleNumberBlur })))));
|
|
81760
82093
|
}
|
|
81761
82094
|
static get formAssociated() { return true; }
|
|
81762
82095
|
};
|
|
@@ -81771,7 +82104,7 @@ const XvTab = class {
|
|
|
81771
82104
|
this.loading = false;
|
|
81772
82105
|
}
|
|
81773
82106
|
render() {
|
|
81774
|
-
return (h(Host, { key: '
|
|
82107
|
+
return (h(Host, { key: '21f71a5d1a5dec85149615069b8d1bb1904da3db', disabled: this.disabled, name: this.name }, this.loading ? h("xv-loader-v2", { size: SIZE_VAR.LG }) : h("slot", null)));
|
|
81775
82108
|
}
|
|
81776
82109
|
};
|
|
81777
82110
|
XvTab.style = xvTabCss();
|
|
@@ -81811,7 +82144,7 @@ const XvTable = class {
|
|
|
81811
82144
|
.join(' ') + ' repeat(auto-fit, minmax(0, 1fr))');
|
|
81812
82145
|
}
|
|
81813
82146
|
render() {
|
|
81814
|
-
return (h(Host, { key: '
|
|
82147
|
+
return (h(Host, { key: '09bf013de8bd7c6fc948cb00347ebac3d09c8852', class: { batchVisible: !!this.selectedCount } }, h("slot", { key: '69d6b93a823d43a79caba584f32e65aab7251e43', name: "title" }, !!this.el.title && h("h2", { key: '6bc91577912a4653983c6a39494196bb4db09473', class: "xv-table-title" }, this.el.title)), h("slot", { key: '55cef1ba4d2c67b8f288d4b578961d50df1f8480', name: "toolbar" }), h("div", { key: '6e226e6bed369bf2565f0feec0273b371158eb7c', class: "xv-table" }, h("div", { key: '4164dd3b54a71355190383fcb8d7c48a04657c43', class: "batch-actions" }, h(Fragment, { key: '33e22ccdcbc6ef94bf960ec10d4ed3362df608f6' }, h("div", { key: '3e22bb85ad78afa3b026c4e30b33a03a240c3762', class: "batch-actions_content" }, h("slot", { key: 'c3f8246007a325026b6a4d761a505de06fe30762', name: "batch" })), h("p", { key: 'ecfb7e5d27ea779cb0294028fad812b2a3645327', class: "batch-actions_count" }, !!this.selectedCount && `${this.selectedCount} ${this.selectedCount === 1 ? 'Position ausgewählt' : 'Positionen ausgewählt'}`))), h("div", { key: '64579ed1062c6001f5ff7a92ee3914fe6d02f0e6', class: "xv-table_wrapper" }, h("slot", { key: 'e9fc226e5f4da71bbc24635ed28b3e5583e31386' }), h("slot", { key: 'aa787b29455594cbdcbfc1b1332c5080147c6429', name: "footer" })), !!this.loading && (h("div", { key: '3463995af96e5894d77f4f6e996d7a62e960f815', class: "xv-table_loading" }, h("xv-loader-v2", { key: 'dcd88d13a9036bcca5bdc17e532d38ada18fec98', size: SIZE_VAR.LG }))))));
|
|
81815
82148
|
}
|
|
81816
82149
|
componentWillLoad() {
|
|
81817
82150
|
this.setColsSizeTemplate();
|
|
@@ -81852,7 +82185,7 @@ const XvTableCell = class {
|
|
|
81852
82185
|
}
|
|
81853
82186
|
;
|
|
81854
82187
|
render() {
|
|
81855
|
-
return (h(Host, { key: '
|
|
82188
|
+
return (h(Host, { key: '5aaf16353f90d653196ac50a51f83e3b3a93d3c4' }, h("slot", { key: 'b9d5003075bb5d204d0489ff82a0c7982ca6840c' })));
|
|
81856
82189
|
}
|
|
81857
82190
|
get el() { return getElement(this); }
|
|
81858
82191
|
};
|
|
@@ -81873,7 +82206,7 @@ const XvTableExpand = class {
|
|
|
81873
82206
|
};
|
|
81874
82207
|
}
|
|
81875
82208
|
render() {
|
|
81876
|
-
return (h(Host, { key: '
|
|
82209
|
+
return (h(Host, { key: '3886cb72495a7e6c97330e76b0cd882b4fd8b287' }, h("button", { key: '943b84f05767b86e9f53d6b395542cda235cfcc1', class: { 'expand-btn': true, open: this.open }, disabled: this.disabled, onClick: this.handleExpand }), h("slot", { key: '3cc39988d4691155b5719f3ee8f0fa33255a1fd4', name: XV_EXPANDABLE_KEY }), h("div", { key: 'b6cfe72340454dd7e18fd9baa22f12305c3bfef2', class: { expandableContent: true, open: this.open } }, h("slot", { key: '5b61c681533023603bb0c6d2f877f122b9bf6dd4' }))));
|
|
81877
82210
|
}
|
|
81878
82211
|
componentDidLoad() {
|
|
81879
82212
|
setAttr(this.el.parentElement, XV_EXPANDABLE_KEY, true);
|
|
@@ -81928,7 +82261,7 @@ const XvTableRow = class {
|
|
|
81928
82261
|
}
|
|
81929
82262
|
}
|
|
81930
82263
|
render() {
|
|
81931
|
-
return (h(Host, { key: '
|
|
82264
|
+
return (h(Host, { key: '27a864a3a27877c89f674b72ad405f7376e1bdc0' }, this.variant !== undefined && (h("xv-table-v2-cell", { key: '70904c820a234f20f4076c9f39b4793b42348536', class: "cell-control" }, this.variant === 'checkbox' && (h("xv-checkbox-v2", { key: 'a2897549f2b2cf2d97ac6f130aee539d3c064822', name: this.name, partial: this.partial, checked: this.checked || this.partial, disabled: this.disabled, required: this.required, readonly: this.readonly, onEventChange: this.checkHandle })), this.variant === 'radio' && (h("input", { key: 'd048ee4e9b0162c36222c0153944c0b4ee6b1ebe', type: "radio", name: this.name, checked: this.checked || this.partial, disabled: this.disabled, required: this.required, readonly: this.readonly })))), h("slot", { key: '2c92a52ed6d00ebfedd539b7322e8c40393f6282' })));
|
|
81932
82265
|
}
|
|
81933
82266
|
componentWillLoad() {
|
|
81934
82267
|
this.setInitialAttrs();
|
|
@@ -82049,7 +82382,7 @@ const XvTabs = class {
|
|
|
82049
82382
|
};
|
|
82050
82383
|
XvTabs.style = xvTabsCss();
|
|
82051
82384
|
|
|
82052
|
-
const xvTagComboboxCss = () => `.xv-container{width:100%;max-width:1170px;margin-inline:auto}@media (min-width: 576px){.xv-container{max-width:540px}}@media (min-width: 768px){.xv-container{max-width:720px}}@media (min-width: 992px){.xv-container{max-width:960px;padding-inline:var(--bs-gutter-x, 0.75rem)}}@media (min-width: 1200px){.xv-container{max-width:1140px}}@media (min-width: 1400px){.xv-container{max-width:1320px}}.xv-tooltip[role=tooltip]{position:absolute;background-color:var(--background-inverse, #333333);color:var(--text-on-color);padding:var(--spacing-03) var(--spacing-04);border-radius:3px;font-size:var(--fz-sm);z-index:999;min-width:min(150px, 90vw);max-width:min(400px, 90vw)}.xv-tooltip[role=tooltip]::after{content:"";position:absolute;width:0;height:0;border-style:solid}.xv-tooltip[role=tooltip][data-popper-placement=top]::after{bottom:-5px;left:50%;transform:translateX(-50%);border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-start]::after{bottom:-5px;left:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-end]::after{bottom:-5px;right:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom]::after{top:-5px;left:50%;transform:translateX(-50%);border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-start]::after{top:-5px;left:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-end]::after{top:-5px;right:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=left]::after{top:50%;right:-5px;transform:translateY(-50%);border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-start]::after{top:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-end]::after{bottom:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=right]::after{top:50%;left:-5px;transform:translateY(-50%);border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-start]::after{top:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-end]::after{bottom:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}:host{display:block;font-family:system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;width:100%;box-sizing:border-box;position:relative;text-align:left}:host .label{display:block;margin-bottom:var(--spacing-03);color:var(--text-secondary, #515151);font-family:var(--ff-body,
|
|
82385
|
+
const xvTagComboboxCss = () => `.xv-container{width:100%;max-width:1170px;margin-inline:auto}@media (min-width: 576px){.xv-container{max-width:540px}}@media (min-width: 768px){.xv-container{max-width:720px}}@media (min-width: 992px){.xv-container{max-width:960px;padding-inline:var(--bs-gutter-x, 0.75rem)}}@media (min-width: 1200px){.xv-container{max-width:1140px}}@media (min-width: 1400px){.xv-container{max-width:1320px}}.xv-tooltip[role=tooltip]{position:absolute;background-color:var(--background-inverse, #333333);color:var(--text-on-color);padding:var(--spacing-03) var(--spacing-04);border-radius:3px;font-size:var(--fz-sm);z-index:999;min-width:min(150px, 90vw);max-width:min(400px, 90vw)}.xv-tooltip[role=tooltip]::after{content:"";position:absolute;width:0;height:0;border-style:solid}.xv-tooltip[role=tooltip][data-popper-placement=top]::after{bottom:-5px;left:50%;transform:translateX(-50%);border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-start]::after{bottom:-5px;left:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-end]::after{bottom:-5px;right:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom]::after{top:-5px;left:50%;transform:translateX(-50%);border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-start]::after{top:-5px;left:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-end]::after{top:-5px;right:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=left]::after{top:50%;right:-5px;transform:translateY(-50%);border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-start]::after{top:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-end]::after{bottom:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=right]::after{top:50%;left:-5px;transform:translateY(-50%);border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-start]::after{top:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-end]::after{bottom:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}:host{display:block;font-family:system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;width:100%;box-sizing:border-box;position:relative;text-align:left}:host .label{display:block;margin-bottom:var(--spacing-03);color:var(--text-secondary, #515151);font-family:var(--ff-body), sans-serif;font-size:var(--fz-sm, 12px);font-style:normal;font-weight:400;line-height:var(--fz-md);letter-spacing:0.32px}:host .control{overflow:auto;border-radius:3px;border:1px solid var(--border-subtle-01);outline:2px solid transparent;padding-block:var(--spacing-02);padding-inline:var(--spacing-05);box-sizing:border-box;display:flex;align-items:center;min-height:40px;cursor:text}:host .control:focus-within{outline:2px solid var(--focus)}:host .control--error{outline-color:var(--support-error)}:host .control--readonly{border-radius:0;border-top-width:0;border-left-width:0;border-right-width:0;outline-color:transparent}:host .control--disabled{opacity:0.6;cursor:not-allowed}:host .control-chips{display:flex;align-items:center;flex-wrap:wrap;gap:6px;width:100%}:host .control-input{flex:1;min-width:120px;border:none;outline:none;font-size:inherit;color:inherit;background:transparent;padding:0;margin:0}:host .control-input:disabled{cursor:not-allowed}:host .control-input::placeholder{color:var(--text-placeholder)}:host .message{margin:var(--spacing-02) 0 0;color:var(--text-helper, #646464);font-size:var(--fz-sm, 12px);font-style:normal;font-weight:400;line-height:var(--fz-md, 16px);letter-spacing:0.32px}:host .message--error{color:var(--text-error)}:host .message--warning{color:var(--text-secondary, #515151)}:host .suggestions{position:absolute;top:100%;left:0;right:0;background:var(--layer-02, #fff);border-radius:3px;border:1px solid var(--border-subtle-01);box-shadow:0 6px 18px rgba(0, 0, 0, 0.06);max-height:220px;overflow:auto;z-index:50;margin:var(--spacing-01) 0 0;padding:var(--spacing-03) 0}:host .suggestions-opt{padding:8px 12px;cursor:pointer;display:flex;align-items:center}:host .suggestions-opt :hover,:host .suggestions-opt--highlight{background-color:var(--layer-hover-02, #F7F7F7)}:host .suggestions-opt-content{display:flex;align-items:center;gap:8px}:host .suggestions-opt-content--color{width:12px;height:12px;border-radius:3px;border:1px solid rgba(0, 0, 0, 0.06)}:host .suggestions-opt-content--label strong{font-weight:700}:host([size=xs]){font-size:0.8em}:host([size=xs]) .control{min-height:16px}:host([size=sm]){font-size:0.9em}:host([size=sm]) .control{min-height:32px}:host([size=lg]){font-size:1.2em}:host([size=lg]) .control{min-height:48px}:host([size=xl]){font-size:1.4em}:host([size=xl]) .control{min-height:60px}`;
|
|
82053
82386
|
|
|
82054
82387
|
const XvTagCombobox = class {
|
|
82055
82388
|
constructor(hostRef) {
|
|
@@ -82286,12 +82619,12 @@ const XvTagCombobox = class {
|
|
|
82286
82619
|
const suggestionsVisible = this.open && this.filtered.length > 0;
|
|
82287
82620
|
const ariaOwns = suggestionsVisible ? `${this.uid}-listbox` : undefined;
|
|
82288
82621
|
const activedesc = this.highlighted >= 0 ? this.optionId(this.highlighted) : undefined;
|
|
82289
|
-
return (h(Host, { key: '
|
|
82622
|
+
return (h(Host, { key: '91dae1582cb4246be4893facdf13777fe993c19c', class: "xv-combobox", part: "root", size: this.size }, this.label && h("label", { key: '409bd22d48bee345018003500e4790e13858fad2', class: "label" }, this.label), h("div", { key: '10e50e6b56954cbca5e04c8ec61c68ab666b450f', class: {
|
|
82290
82623
|
'control': true,
|
|
82291
82624
|
'control--disabled': this.disabled,
|
|
82292
82625
|
'control--error': !!this.error,
|
|
82293
82626
|
'control--readonly': !!this.readonly,
|
|
82294
|
-
}, onClick: () => this.blockClick() }, h("div", { key: '
|
|
82627
|
+
}, onClick: () => this.blockClick() }, h("div", { key: '89da5d24f1c9a78120851cf10ea22df2bce3bfe9', class: "control-chips", role: "list" }, this.selected.map((s, i) => (h("xv-tag-v2", { role: "listitem", part: "chip", "data-value": s.value, size: this.COMPARE_TAG_SIZE[this.size], disabled: this.disabled, bg: (s === null || s === void 0 ? void 0 : s.bg) || 'var(--layer-accent-01, #F7F7F7)', color: (s === null || s === void 0 ? void 0 : s.color) || 'var(--text-primary, #333)', closeable: !this.readonly, onCloseClick: ({ detail }) => this.removeTag(i, detail) }, s.label))), h("input", { key: '633c1f8e9d2bd90e44c3be09dc594e8101afc5a1', ref: (el) => (this.inputEl = el), class: "control-input", readonly: this.readonly, placeholder: this.selected.length ? '' : this.placeholder, value: this.inputValue, onInput: (e) => this.onInput(e), onKeyDown: (e) => this.onKeyDown(e), onFocus: () => { this.onOpen(); this.recomputeFiltered(); }, "aria-autocomplete": "list", "aria-expanded": this.open ? 'true' : 'false', "aria-controls": ariaOwns, "aria-activedescendant": activedesc, disabled: this.disabled }))), this.error && typeof this.error === 'string' && (h("p", { key: 'f9bd812962df75191af5c515103cb927cac49452', class: "message message--error" }, this.error)), this.warning && typeof this.warning === 'string' && (h("p", { key: '203509e3ab990bbc2e3aecb3935fda61188056eb', class: "message message--warning" }, this.warning)), suggestionsVisible && (h("ul", { key: '35de0b5c6bc376d5b3388308e4f0f1e7235358e5', id: `${this.uid}-listbox`, class: "suggestions", role: "listbox", part: "listbox" }, this.filtered.map((opt, idx) => (h("li", { id: this.optionId(idx), class: { 'suggestions-opt': true, 'suggestions-opt--highlight': idx === this.highlighted }, role: "option", "aria-selected": idx === this.highlighted, onMouseEnter: () => this.onOptionMouseEnter(idx), onMouseDown: (ev) => ev.preventDefault(), onClick: () => this.selectOption(opt) }, h("div", { class: "suggestions-opt-content" }, opt.bg ? h("span", { class: "suggestions-opt-content--color", style: { background: opt.bg } }) : null, h("span", { class: "suggestions-opt-content--label" }, this.highlightLabel(opt.label).map((seg, i) => typeof seg === 'string' ? h("span", { key: i }, seg) : h("strong", { key: i }, seg.match)))))))))));
|
|
82295
82628
|
}
|
|
82296
82629
|
get host() { return getElement(this); }
|
|
82297
82630
|
static get watchers() { return {
|
|
@@ -82323,12 +82656,12 @@ const XvTag = class {
|
|
|
82323
82656
|
this.closeClick.emit(e);
|
|
82324
82657
|
}
|
|
82325
82658
|
render() {
|
|
82326
|
-
return (h(Host, { key: '
|
|
82659
|
+
return (h(Host, { key: '4d462b6ff04dbb9db9675b0c99e8da16d4536f9b', style: { color: this.color, background: this.bg }, class: `xv-tag ${this.disabled ? 'disabled' : ''} ${this.size}` }, h("div", { key: '76379a9ee13b77649aa67a61cd8ccd150e1b5aba', class: "xv-tag_content", part: "details-content" }, h("slot", { key: 'a53a8802f5978856351ace83b1a87a119a352b90' })), this.closeable && (h("button", { key: '5b9a53d9c20e5bd4e5ecc47e91aeb2c8dd5f4f44', onClick: this.closeHandler.bind(this), class: "xv-tag_close" }))));
|
|
82327
82660
|
}
|
|
82328
82661
|
};
|
|
82329
82662
|
XvTag.style = xvTagCss();
|
|
82330
82663
|
|
|
82331
|
-
const xvTextInputCss = () => `.xv-container{width:100%;max-width:1170px;margin-inline:auto}@media (min-width: 576px){.xv-container{max-width:540px}}@media (min-width: 768px){.xv-container{max-width:720px}}@media (min-width: 992px){.xv-container{max-width:960px;padding-inline:var(--bs-gutter-x, 0.75rem)}}@media (min-width: 1200px){.xv-container{max-width:1140px}}@media (min-width: 1400px){.xv-container{max-width:1320px}}.xv-tooltip[role=tooltip]{position:absolute;background-color:var(--background-inverse, #333333);color:var(--text-on-color);padding:var(--spacing-03) var(--spacing-04);border-radius:3px;font-size:var(--fz-sm);z-index:999;min-width:min(150px, 90vw);max-width:min(400px, 90vw)}.xv-tooltip[role=tooltip]::after{content:"";position:absolute;width:0;height:0;border-style:solid}.xv-tooltip[role=tooltip][data-popper-placement=top]::after{bottom:-5px;left:50%;transform:translateX(-50%);border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-start]::after{bottom:-5px;left:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-end]::after{bottom:-5px;right:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom]::after{top:-5px;left:50%;transform:translateX(-50%);border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-start]::after{top:-5px;left:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-end]::after{top:-5px;right:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=left]::after{top:50%;right:-5px;transform:translateY(-50%);border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-start]::after{top:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-end]::after{bottom:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=right]::after{top:50%;left:-5px;transform:translateY(-50%);border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-start]::after{top:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-end]::after{bottom:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}:host{display:inline-block;text-align:left}:host .control_label{display:block;margin-bottom:var(--spacing-03);color:var(--text-secondary, #515151);font-family:var(--ff-body, Work Sans), sans-serif;font-size:var(--fz-sm, 12px);font-style:normal;font-weight:
|
|
82664
|
+
const xvTextInputCss = () => `.xv-container{width:100%;max-width:1170px;margin-inline:auto}@media (min-width: 576px){.xv-container{max-width:540px}}@media (min-width: 768px){.xv-container{max-width:720px}}@media (min-width: 992px){.xv-container{max-width:960px;padding-inline:var(--bs-gutter-x, 0.75rem)}}@media (min-width: 1200px){.xv-container{max-width:1140px}}@media (min-width: 1400px){.xv-container{max-width:1320px}}.xv-tooltip[role=tooltip]{position:absolute;background-color:var(--background-inverse, #333333);color:var(--text-on-color);padding:var(--spacing-03) var(--spacing-04);border-radius:3px;font-size:var(--fz-sm);z-index:999;min-width:min(150px, 90vw);max-width:min(400px, 90vw)}.xv-tooltip[role=tooltip]::after{content:"";position:absolute;width:0;height:0;border-style:solid}.xv-tooltip[role=tooltip][data-popper-placement=top]::after{bottom:-5px;left:50%;transform:translateX(-50%);border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-start]::after{bottom:-5px;left:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-end]::after{bottom:-5px;right:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom]::after{top:-5px;left:50%;transform:translateX(-50%);border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-start]::after{top:-5px;left:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-end]::after{top:-5px;right:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=left]::after{top:50%;right:-5px;transform:translateY(-50%);border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-start]::after{top:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-end]::after{bottom:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=right]::after{top:50%;left:-5px;transform:translateY(-50%);border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-start]::after{top:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-end]::after{bottom:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}:host{display:inline-block;text-align:left}:host .control_label{display:block;margin-bottom:var(--spacing-03);color:var(--text-secondary, #515151);font-family:var(--ff-body, Work Sans), sans-serif;font-size:var(--fz-sm, 12px);font-style:normal;font-weight:400;line-height:var(--fz-md);letter-spacing:0.32px}:host .control_input{display:flex;border:1px solid var(--border-subtle-01);outline:2px solid transparent;background-color:transparent;border-radius:3px;transition:250ms ease-in-out border-color, 250ms ease-in-out outline-color}:host .control_input:hover{border-color:var(--border-subtle-selected-01)}:host .control_input:focus-within{outline-color:var(--focus)}:host .control_input.error{outline-color:var(--support-error)}:host .control_input.readonly{outline-color:transparent;background:var(--field-01, #F7F7F7);background-blend-mode:multiply}:host .control_input.readonly input{color:var(--text-secondary)}:host .control_input input{flex:1;border:none;outline:none;-moz-appearance:textfield;background-color:transparent;margin:0;padding-block:0;padding-inline:var(--spacing-05);box-sizing:border-box;color:var(--text-primary);min-width:20px;font-style:normal;font-weight:400;letter-spacing:0.16px}:host .control_input input::-webkit-inner-spin-button,:host .control_input input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}:host .control_input input[type=search]::-webkit-search-cancel-button,:host .control_input input[type=search]::-webkit-search-decoration{-webkit-appearance:none;appearance:none}:host .control_input input[type=search]::-ms-clear,:host .control_input input[type=search]::-ms-reveal{display:none;width:0;height:0}:host .control_input__icons{display:inline-flex;align-items:stretch;column-gap:2px;padding-right:var(--spacing-05)}:host .control_input__icons:empty{padding-right:0}:host .control_input__icons .status-icon{display:inline-flex;align-items:center;align-self:center;font-size:1.35em}:host .control_input__icons .status-icon:is(button){background-color:transparent;box-shadow:none;border:none;cursor:pointer}:host .control_input__icons .status-icon.error{background-color:var(--support-error);color:white;width:16px;height:16px;border-radius:8px;font-size:12px;font-weight:bold;align-items:center;justify-content:center}:host .control_input__icons .status-icon.warning{color:var(--support-warning)}:host .control_input__icons hr{border:none;outline:none;width:2px;height:60%;align-self:center;background-color:var(--border-subtle-01);display:inline-flex}:host .control_input.xs{height:16px}:host .control_input.sm{height:32px}:host .control_input.md{height:40px}:host .control_input.lg{height:48px}:host .control_input.xl{height:60px}:host .message{margin:var(--spacing-02) 0 0;color:var(--text-helper, #646464);font-size:var(--fz-sm, 12px);font-style:normal;font-weight:400;line-height:var(--fz-md, 16px);letter-spacing:0.32px}:host .message.error{color:var(--text-error)}:host .message.warning{color:var(--text-secondary, #515151)}:host(.disabled){cursor:not-allowed}:host(.disabled) .control_label,:host(.disabled) .control_input input,:host(.disabled) .control_input input::placeholder,:host(.disabled) .message:not(.error){color:var(--text-disabled);cursor:not-allowed}:host(.disabled) .control_input__icons,:host(.disabled) .message.error{opacity:0.5;cursor:not-allowed}:host([block]){display:block}:host([block]) .control_input input{width:100%}`;
|
|
82332
82665
|
|
|
82333
82666
|
const XvTextInput = class {
|
|
82334
82667
|
constructor(hostRef) {
|
|
@@ -82357,19 +82690,19 @@ const XvTextInput = class {
|
|
|
82357
82690
|
};
|
|
82358
82691
|
}
|
|
82359
82692
|
render() {
|
|
82360
|
-
return (h(Host, { key: '
|
|
82693
|
+
return (h(Host, { key: '420f4a0d02558a7171550c34669f5644496103cf', class: { disabled: !!this.disabled } }, h("label", { key: '782e7a0f80116150e7fe9cb2412127b1e3e1587c', class: "control" }, this.label && h("span", { key: '77d2e12b964be91c371c9724c1687931f2878353', class: "control_label" }, this.label), h("div", { key: '45a936403569b342d9b28a9cb7dce084b171a490', class: {
|
|
82361
82694
|
'control_input': true,
|
|
82362
82695
|
readonly: !!this.readonly,
|
|
82363
82696
|
[this.size]: true,
|
|
82364
82697
|
error: !!this.error,
|
|
82365
82698
|
warning: !!this.warning,
|
|
82366
|
-
} }, h("input", { key: '
|
|
82699
|
+
} }, h("input", { key: '9e24b77c8752590ca921767651525d4d653c06e5', autocomplete: this.autocomplete, type: (this.type === 'password' && this.isPasswordVisible && 'text') || this.type, placeholder: this.placeholder, disabled: this.disabled, readonly: this.readonly, onInput: this.handleInput, name: this.name, value: this.value }), h("div", { key: 'd72b4669c8eb2f92268dff31f39f1c2babc633ed', class: "control_input__icons" }, this.loading && h("xv-loader-v2", { key: '0fc051cdf9a905f29bb06cc20bee19ba73fec490', size: SIZE_VAR.XS }), !!this.error ? (h("span", { class: "status-icon error", "aria-hidden": "true" }, "!")) : !!this.warning ? (h("span", { class: "status-icon warning", "aria-hidden": "true" }, "\u26A0")) : null, this.type === 'password' && (h("button", { key: '1ea8abe015adb0e58a836a811fe881712d297332', onClick: this.togglePassword, disabled: this.disabled, class: "status-icon" }, h("svg", { key: '964a623003f5b3dfd52f8a5748e917260d047a63', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 640 512", width: 16, height: 16 }, this.isPasswordVisible ? (h("path", { fill: "currentColor", d: "M38.8 5.1C28.4-3.1 13.3-1.2 5.1 9.2S-1.2 34.7 9.2 42.9l592 464c10.4 8.2 25.5 6.3 33.7-4.1s6.3-25.5-4.1-33.7L525.6 386.7c39.6-40.6 66.4-86.1 79.9-118.4c3.3-7.9 3.3-16.7 0-24.6c-14.9-35.7-46.2-87.7-93-131.1C465.5 68.8 400.8 32 320 32c-68.2 0-125 26.3-169.3 60.8L38.8 5.1zm151 118.3C226 97.7 269.5 80 320 80c65.2 0 118.8 29.6 159.9 67.7C518.4 183.5 545 226 558.6 256c-12.6 28-36.6 66.8-70.9 100.9l-53.8-42.2c9.1-17.6 14.2-37.5 14.2-58.7c0-70.7-57.3-128-128-128c-32.2 0-61.7 11.9-84.2 31.5l-46.1-36.1zM394.9 284.2l-81.5-63.9c4.2-8.5 6.6-18.2 6.6-28.3c0-5.5-.7-10.9-2-16c.7 0 1.3 0 2 0c44.2 0 80 35.8 80 80c0 9.9-1.8 19.4-5.1 28.2zm9.4 130.3C378.8 425.4 350.7 432 320 432c-65.2 0-118.8-29.6-159.9-67.7C121.6 328.5 95 286 81.4 256c8.3-18.4 21.5-41.5 39.4-64.8L83.1 161.5C60.3 191.2 44 220.8 34.5 243.7c-3.3 7.9-3.3 16.7 0 24.6c14.9 35.7 46.2 87.7 93 131.1C174.5 443.2 239.2 480 320 480c47.8 0 89.9-12.9 126.2-32.5l-41.9-33zM192 256c0 70.7 57.3 128 128 128c13.3 0 26.1-2 38.2-5.8L302 334c-23.5-5.4-43.1-21.2-53.7-42.3l-56.1-44.2c-.2 2.8-.3 5.6-.3 8.5z" })) : (h("path", { fill: "currentColor", d: "M288 80c-65.2 0-118.8 29.6-159.9 67.7C89.6 183.5 63 226 49.4 256c13.6 30 40.2 72.5 78.6 108.3C169.2 402.4 222.8 432 288 432s118.8-29.6 159.9-67.7C486.4 328.5 513 286 526.6 256c-13.6-30-40.2-72.5-78.6-108.3C406.8 109.6 353.2 80 288 80zM95.4 112.6C142.5 68.8 207.2 32 288 32s145.5 36.8 192.6 80.6c46.8 43.5 78.1 95.4 93 131.1c3.3 7.9 3.3 16.7 0 24.6c-14.9 35.7-46.2 87.7-93 131.1C433.5 443.2 368.8 480 288 480s-145.5-36.8-192.6-80.6C48.6 356 17.3 304 2.5 268.3c-3.3-7.9-3.3-16.7 0-24.6C17.3 208 48.6 156 95.4 112.6zM288 336c44.2 0 80-35.8 80-80s-35.8-80-80-80c-.7 0-1.3 0-2 0c1.3 5.1 2 10.5 2 16c0 35.3-28.7 64-64 64c-5.5 0-10.9-.7-16-2c0 .7 0 1.3 0 2c0 44.2 35.8 80 80 80zm0-208a128 128 0 1 1 0 256 128 128 0 1 1 0-256z" })))))))), this.helper && h("p", { key: '2879f0a0baea4adf950ece4c9dbb9bfb30a474af', class: "message" }, this.helper), typeof this.error === 'string' ? (h("p", { class: "message error" }, this.error)) : typeof this.warning === 'string' ? (h("p", { class: "message warning" }, this.warning)) : null));
|
|
82367
82700
|
}
|
|
82368
82701
|
static get formAssociated() { return true; }
|
|
82369
82702
|
};
|
|
82370
82703
|
XvTextInput.style = xvTextInputCss();
|
|
82371
82704
|
|
|
82372
|
-
const xvTextareaCss = () => `.xv-container{width:100%;max-width:1170px;margin-inline:auto}@media (min-width: 576px){.xv-container{max-width:540px}}@media (min-width: 768px){.xv-container{max-width:720px}}@media (min-width: 992px){.xv-container{max-width:960px;padding-inline:var(--bs-gutter-x, 0.75rem)}}@media (min-width: 1200px){.xv-container{max-width:1140px}}@media (min-width: 1400px){.xv-container{max-width:1320px}}.xv-tooltip[role=tooltip]{position:absolute;background-color:var(--background-inverse, #333333);color:var(--text-on-color);padding:var(--spacing-03) var(--spacing-04);border-radius:3px;font-size:var(--fz-sm);z-index:999;min-width:min(150px, 90vw);max-width:min(400px, 90vw)}.xv-tooltip[role=tooltip]::after{content:"";position:absolute;width:0;height:0;border-style:solid}.xv-tooltip[role=tooltip][data-popper-placement=top]::after{bottom:-5px;left:50%;transform:translateX(-50%);border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-start]::after{bottom:-5px;left:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-end]::after{bottom:-5px;right:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom]::after{top:-5px;left:50%;transform:translateX(-50%);border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-start]::after{top:-5px;left:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-end]::after{top:-5px;right:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=left]::after{top:50%;right:-5px;transform:translateY(-50%);border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-start]::after{top:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-end]::after{bottom:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=right]::after{top:50%;left:-5px;transform:translateY(-50%);border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-start]::after{top:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-end]::after{bottom:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}:host{display:inline-block;text-align:left}:host .control_label{display:flex;justify-content:space-between;column-gap:var(--spacing-03);margin:0 0 var(--spacing-03);color:var(--text-secondary, #515151);font-family:var(--ff-body,
|
|
82705
|
+
const xvTextareaCss = () => `.xv-container{width:100%;max-width:1170px;margin-inline:auto}@media (min-width: 576px){.xv-container{max-width:540px}}@media (min-width: 768px){.xv-container{max-width:720px}}@media (min-width: 992px){.xv-container{max-width:960px;padding-inline:var(--bs-gutter-x, 0.75rem)}}@media (min-width: 1200px){.xv-container{max-width:1140px}}@media (min-width: 1400px){.xv-container{max-width:1320px}}.xv-tooltip[role=tooltip]{position:absolute;background-color:var(--background-inverse, #333333);color:var(--text-on-color);padding:var(--spacing-03) var(--spacing-04);border-radius:3px;font-size:var(--fz-sm);z-index:999;min-width:min(150px, 90vw);max-width:min(400px, 90vw)}.xv-tooltip[role=tooltip]::after{content:"";position:absolute;width:0;height:0;border-style:solid}.xv-tooltip[role=tooltip][data-popper-placement=top]::after{bottom:-5px;left:50%;transform:translateX(-50%);border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-start]::after{bottom:-5px;left:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-end]::after{bottom:-5px;right:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom]::after{top:-5px;left:50%;transform:translateX(-50%);border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-start]::after{top:-5px;left:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-end]::after{top:-5px;right:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=left]::after{top:50%;right:-5px;transform:translateY(-50%);border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-start]::after{top:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-end]::after{bottom:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=right]::after{top:50%;left:-5px;transform:translateY(-50%);border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-start]::after{top:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-end]::after{bottom:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}:host{display:inline-block;text-align:left}:host .control_label{display:flex;justify-content:space-between;column-gap:var(--spacing-03);margin:0 0 var(--spacing-03);color:var(--text-secondary, #515151);font-family:var(--ff-body), sans-serif;font-size:var(--fz-sm, 12px);font-style:normal;font-weight:400;line-height:var(--fz-md);letter-spacing:0.32px}:host .control_label__count{font-weight:400}:host .control_label [role=tooltip]{margin-left:var(--spacing-03)}:host .control_input{display:flex;position:relative;border:1px solid var(--border-subtle-01);font-size:var(--fz-md, 14px);outline:2px solid transparent;background-color:transparent;border-radius:3px;transition:250ms ease-in-out border-color, 250ms ease-in-out outline-color}:host .control_input:hover{border-color:var(--border-subtle-selected-01)}:host .control_input:focus-within{outline-color:var(--focus)}:host .control_input.error{outline-color:var(--support-error)}:host .control_input.readonly{outline-color:transparent;background:var(--field-01, #F7F7F7);background-blend-mode:multiply}:host .control_input.readonly textarea{color:var(--text-secondary)}:host .control_input.error textarea,:host .control_input.warning textarea{padding-inline-end:calc(var(--spacing-05, 16px) + 16px)}:host .control_input textarea{flex:1;border:none;outline:none;margin:0;font-family:inherit;background-color:transparent;padding-block:var(--spacing-05);padding-inline:var(--spacing-05);box-sizing:border-box;color:var(--text-primary);min-width:20px;font-size:inherit;font-style:normal;font-weight:400;letter-spacing:0.16px}:host .control_input textarea.no-resize{resize:none}:host .control_input__icons{position:absolute;right:var(--spacing-05);top:var(--spacing-05);display:inline-flex;align-items:stretch;column-gap:2px}:host .control_input__icons .status-icon{display:inline-flex;align-items:center;align-self:center;font-size:16px;line-height:1}:host .control_input__icons .status-icon.error{background-color:var(--support-error);color:white;width:16px;height:16px;border-radius:8px;font-size:12px;font-weight:bold;align-items:center;justify-content:center}:host .control_input__icons .status-icon.warning{color:var(--support-warning)}:host .message{margin:var(--spacing-02) 0 0;color:var(--text-helper, #646464);font-size:var(--fz-sm, 12px);font-style:normal;font-weight:400;line-height:var(--fz-md, 16px);letter-spacing:0.32px}:host .message.error{color:var(--text-error)}:host .message.warning{color:var(--text-secondary, #515151)}:host(.disabled){cursor:not-allowed}:host(.disabled) .control_label,:host(.disabled) .control_input textarea,:host(.disabled) .control_input textarea::placeholder,:host(.disabled) .message:not(.error){color:var(--text-disabled);cursor:not-allowed}:host(.disabled) .control_input__icons,:host(.disabled) .message.error{opacity:0.5;cursor:not-allowed}:host([block]){display:block}:host([block]) .control_input textarea{width:100%}:host([size=xs]) .control_input textarea{padding-block:var(--spacing-03);font-size:0.8em}:host([size=sm]) .control_input textarea{padding-block:var(--spacing-04);font-size:0.9em}:host([size=lg]) .control_input textarea{padding-block:var(--spacing-06);font-size:1.1em}:host([size=xl]) .control_input textarea{padding-block:var(--spacing-07);font-size:1.2em}`;
|
|
82373
82706
|
|
|
82374
82707
|
const XvTextarea = class {
|
|
82375
82708
|
constructor(hostRef) {
|
|
@@ -82400,12 +82733,12 @@ const XvTextarea = class {
|
|
|
82400
82733
|
this.value && this.internals.setFormValue(this.value);
|
|
82401
82734
|
}
|
|
82402
82735
|
render() {
|
|
82403
|
-
return (h(Host, { key: '
|
|
82736
|
+
return (h(Host, { key: '34e946e9178df48959fc501b2608dbb06f9c1ce6', class: { disabled: !!this.disabled } }, h("label", { key: '7d78cf03eb9a09c6c6dda1f8241b846fa6d6ed1b', class: "control" }, (this.label || this.max) && (h("p", { key: 'c62efd11a2133fddb9bbebd715ef36ee8c462684', class: "control_label" }, h("span", { key: '1599ae0b7d495d43a277628b13f973744b05dd49' }, this.label, this.info && h("xv-tooltip-v2", { key: 'cb152cbc452ce846562ffea62f95699fc7eedbe3', message: this.info })), this.max !== undefined && !this.counterHide && (h("span", { key: '89b29468e7fb4866889829f21814aeee3eece0a2', class: "control_label__count" }, this.value.length || 0, "/", this.max)))), h("div", { key: '47a5317512454488fa7e3627463ff12b6cc809d9', class: {
|
|
82404
82737
|
'control_input': true,
|
|
82405
82738
|
readonly: !!this.readonly,
|
|
82406
82739
|
error: !!this.error,
|
|
82407
82740
|
warning: this.warning !== undefined,
|
|
82408
|
-
} }, h("textarea", { key: '
|
|
82741
|
+
} }, h("textarea", { key: 'd88ec74fc0a798e8a32f5019c8146d97b40ce13a', class: { 'no-resize': !!this.noResize }, name: this.name, rows: this.rows, value: this.value, maxLength: this.max, disabled: this.disabled, readOnly: this.readonly, placeholder: this.placeholder, onInput: this.onInput }), h("div", { key: 'c5895fab0e7850bca64121c86b1fa5b8d64e8d7e', class: "control_input__icons" }, this._renderIcon()))), this.helper && h("p", { key: 'c795a389d5031142c378390713142da5b95f42d8', class: "message" }, this.helper), typeof this.error === 'string' ? (h("p", { class: "message error" }, this.error)) : typeof this.warning === 'string' ? (h("p", { class: "message warning" }, this.warning)) : null));
|
|
82409
82742
|
}
|
|
82410
82743
|
_renderIcon() {
|
|
82411
82744
|
if (this.loading)
|
|
@@ -82456,7 +82789,7 @@ const XvTile = class {
|
|
|
82456
82789
|
this.checked = !this.checked;
|
|
82457
82790
|
}
|
|
82458
82791
|
render() {
|
|
82459
|
-
return (h(Host, { key: '
|
|
82792
|
+
return (h(Host, { key: '9a3af7defbb0ac4c83b727cf72cd114208d90b1d', class: "xv-tile--host" }, h("label", { key: '81d7b28f4038483639a03b4e3d158d2e5c40a9e7', class: {
|
|
82460
82793
|
[this.el.className]: !!this.el.className,
|
|
82461
82794
|
'xv-tile': true,
|
|
82462
82795
|
[`xv-tile--variant-${this.variant}`]: !!this.variant,
|
|
@@ -82464,7 +82797,7 @@ const XvTile = class {
|
|
|
82464
82797
|
'xv-tile--disabled': !!this.disabled,
|
|
82465
82798
|
'selected': !!this.checked,
|
|
82466
82799
|
'xv-tile--error': !!this.error,
|
|
82467
|
-
} }, h("div", { key: '
|
|
82800
|
+
} }, h("div", { key: '7a155efc48c548c0d3f0055148f345b903a4703d', class: "xv-tile_content" }, this.label && h("p", { key: '2901366896f4cf5806425a2240e1dd7f461fb380', class: "xv-tile_content__title" }, this.label), h("slot", { key: '5279a18e3e8ecb3e30f581c51e953ffa0d1b40a6' })), this.variant === 'selectable' && (h("div", { key: '66cc022bad5fe1f435152bc22e2dc7062ed3bd83', class: "xv-tile_control" }, this.multiple ? (h("input", { type: "checkbox", disabled: this.disabled || this.readonly, readonly: this.readonly, onChange: this.handleChange, name: this.name, value: this.value, checked: this.checked })) : (h("input", { type: "radio", disabled: this.disabled || this.readonly, readonly: this.readonly, onChange: this.handleChange, name: this.name, value: this.value, checked: this.checked })))), (this.variant === 'clickable' || this.variant === 'expandable') && (h("div", { key: 'e6ce703a037fcb0a073a0e9c982dc84394c90744', class: "xv-tile_footer" }, h("button", { key: '6780db8c79ff091adf8c8be3b9a664b22a7f533f', class: { 'xv-tile_footer__icon': true, [`icon--${this.variant}`]: true, open: this.checked } }))), h("div", { key: 'e4c171531e526478ba4075f9b304fa69c095e79d', class: { 'xv-tile_expandable': true, open: this.checked } }, h("slot", { key: 'aee614238518c73a00deb5b48cc64b86362cc4fa', name: "expandable" })))));
|
|
82468
82801
|
}
|
|
82469
82802
|
get el() { return getElement(this); }
|
|
82470
82803
|
};
|
|
@@ -82496,7 +82829,7 @@ const XvToggle = class {
|
|
|
82496
82829
|
};
|
|
82497
82830
|
}
|
|
82498
82831
|
render() {
|
|
82499
|
-
return (h(Host, { key: '
|
|
82832
|
+
return (h(Host, { key: '2247390de134eeb3ca9e75d8838f2f89ab453eda', class: { 'xv-toggle': true, disabled: this.disabled, readonly: !!this.readonly, block: !!this.block } }, this.label && h("span", { key: 'a23b0a053442c73c1b753d33bd6793bf501655c0', class: "label" }, this.label), h("label", { key: '14088188c883890aafffb18ce1c3eb6da92c6732', class: "control" }, h("slot", { key: '723c3915395699a8b7343a298c2eac5ecfebd27c', name: "before" }), h("div", { key: 'b3252d819d64a511b2c3c3323fc3946631e3aadc', class: "control_input" }, h("input", { key: '5c5a209ee7d4d09a09b7e370b885ab7965b50fe0', type: "checkbox", readonly: this.readonly, name: this.name, value: this.value, checked: this.checked, disabled: this.disabled || this.readonly, onChange: this.onChange }), h("span", { key: '407db6561c45d1dd9649f94533f7ecdf893c6a28', class: "toggle" })), h("slot", { key: '9d75faa2183417eb8c8537d680666529e8260180', name: "after" }))));
|
|
82500
82833
|
}
|
|
82501
82834
|
static get formAssociated() { return true; }
|
|
82502
82835
|
};
|
|
@@ -82573,7 +82906,7 @@ const XvToggleTip = class {
|
|
|
82573
82906
|
}
|
|
82574
82907
|
;
|
|
82575
82908
|
render() {
|
|
82576
|
-
return (h(Host, { key: '
|
|
82909
|
+
return (h(Host, { key: '92fc5a31de3637018876b5530c36f153ddc4123b', class: "xv-toggle-tip" }, h("div", { key: '675966f43c5c21cbd8a64e5945df8a357bdf0703', class: { 'trigger': true, 'trigger--block': this.block }, role: "button", tabindex: "0", "aria-expanded": this.open ? 'true' : 'false', "aria-controls": "popover", onClick: () => this.setPopover(!this.open), ref: (el) => (this.triggerEl = el) }, h("slot", { key: '94215d0cf8a60848b92cbe7dd9309cb39264cbfa', name: "trigger" }, h("svg", { key: 'b316b67ef454f87795c4e576e64d570d6bc7dd82', class: "trigger_icon", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512", width: 16, height: 16 }, h("path", { key: '64c233df6d036f41960c40c1b6a8b098bdf0ccca', 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" })))), h("div", { key: 'b027cb97e4a3fb6d96d70e97d3c19c098d2971df', class: { popover: true, autoSize: !!this.autoSize }, role: "tooltip", tabindex: "-1", ref: (el) => (this.popoverEl = el) }, h("div", { key: 'e930a39f9a1a8d6ed531375da1706b7caab6a078', class: "popover-tip", part: "tip", "data-popper-arrow": "" }), h("div", { key: '3dc3a8e73a8f3ffef127c004ac65ae820a974b55', class: "popover-content" }, h("slot", { key: 'd7a6502e1be0fe9ec4d24e0cd473d3537b0aaa53', name: "header" }), h("slot", { key: '6c9cbece231e22ede5b7e4ac8e9570d916fbbb3a', name: "body" }), h("slot", { key: 'f25f29402bf908afac30237733e682d621780e8a', name: "footer" })))));
|
|
82577
82910
|
}
|
|
82578
82911
|
disconnectedCallback() {
|
|
82579
82912
|
this.destroyPopper();
|
|
@@ -82628,14 +82961,14 @@ const XvTooltip = class {
|
|
|
82628
82961
|
this.destroyTooltip();
|
|
82629
82962
|
}
|
|
82630
82963
|
render() {
|
|
82631
|
-
return (h(Host, { key: '
|
|
82964
|
+
return (h(Host, { key: '3c25e03b919fe975522757407c114a2a7fa01758', role: "tooltip", class: {
|
|
82632
82965
|
'xv-tooltip-wrapper': true,
|
|
82633
82966
|
[`xv-tooltip-wrapper__block`]: !!this.block,
|
|
82634
82967
|
[`xv-tooltip-wrapper__dashed`]: !!this.dashed,
|
|
82635
|
-
} }, h("slot", { key: '
|
|
82968
|
+
} }, h("slot", { key: '3aa9b34adda1865b53e3905326699a556be3af2a' }, h("svg", { key: '31a94a5001d746180ac050203e997cfcb0e6e57b', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512", width: 16, height: 16 }, h("path", { key: 'f56da185cd078fdcb58546f692530fffcd752880', 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" })))));
|
|
82636
82969
|
}
|
|
82637
82970
|
get el() { return getElement(this); }
|
|
82638
82971
|
};
|
|
82639
82972
|
XvTooltip.style = xvTooltipCss();
|
|
82640
82973
|
|
|
82641
|
-
export { XvAccordion as xv_accordion_v2, XvAccordionItem as xv_accordion_v2_item, XvBreadcrumbs as xv_breadcrumbs_v2, XvButton as xv_button_v2, XvCard as xv_card_v2, XvCheckbox as xv_checkbox_v2, XvDataTable as xv_data_table, XvDataTableCell as xv_data_table_cell, XvDataTableCollapse as xv_data_table_collapse, XvDataTableRow as xv_data_table_row, XvDatepicker as xv_datepicker, XvDropdown as xv_dropdown_v2, XvDropdownItem as xv_dropdown_v2_item, XvFileUploader as xv_file_uploader, Xvfooter as xv_footer, XvHeader as xv_header, XvImageViewer as xv_image_viewer, XvLink as xv_link_v2, XvLoader as xv_loader_v2, XvLoginModal as xv_login_modal, XvMegaMenu as xv_mega_menu, XvModal as xv_modal_v2, XvNotification as xv_notification_v2, XvNumberInput as xv_number_input_v2, XvOverflowMenu as xv_overflow_menu_v2, XvOverflowMenuItem as xv_overflow_menu_v2_item, XvPagination as xv_pagination, XvProgressIndicator as xv_progress_indicator_v2, XvProgressIndicatorItem as xv_progress_indicator_v2_item, XvRadio as xv_radio_v2, XvSlider as xv_slider_v2, XvTab as xv_tab_v2, XvTable as xv_table_v2, XvTableCell as xv_table_v2_cell, XvTableExpand as xv_table_v2_expand, XvTableRow as xv_table_v2_row, XvTabs as xv_tabs_v2, XvTagCombobox as xv_tag_combobox, XvTag as xv_tag_v2, XvTextInput as xv_text_input_v2, XvTextarea as xv_textarea, XvTile as xv_tile, XvToggle as xv_toggle, XvToggleTip as xv_toggle_tip, XvTooltip as xv_tooltip_v2 };
|
|
82974
|
+
export { XvAccordion as xv_accordion_v2, XvAccordionItem as xv_accordion_v2_item, XvBreadcrumbs as xv_breadcrumbs_v2, XvButton as xv_button_v2, XvCard as xv_card_v2, XvCheckbox as xv_checkbox_v2, XvContentSwitcherItem as xv_content_switcher_item_v2, XvContentSwitcher as xv_content_switcher_v2, XvDataTable as xv_data_table, XvDataTableCell as xv_data_table_cell, XvDataTableCollapse as xv_data_table_collapse, XvDataTableRow as xv_data_table_row, XvDatepicker as xv_datepicker, XvDropdown as xv_dropdown_v2, XvDropdownItem as xv_dropdown_v2_item, XvFileUploader as xv_file_uploader, Xvfooter as xv_footer, XvHeader as xv_header, XvImageViewer as xv_image_viewer, XvLink as xv_link_v2, XvLoader as xv_loader_v2, XvLoginModal as xv_login_modal, XvMegaMenu as xv_mega_menu, XvModal as xv_modal_v2, XvNotification as xv_notification_v2, XvNumberInput as xv_number_input_v2, XvOverflowMenu as xv_overflow_menu_v2, XvOverflowMenuItem as xv_overflow_menu_v2_item, XvPagination as xv_pagination, XvProgressIndicator as xv_progress_indicator_v2, XvProgressIndicatorItem as xv_progress_indicator_v2_item, XvRadio as xv_radio_v2, XvSlider as xv_slider_v2, XvTab as xv_tab_v2, XvTable as xv_table_v2, XvTableCell as xv_table_v2_cell, XvTableExpand as xv_table_v2_expand, XvTableRow as xv_table_v2_row, XvTabs as xv_tabs_v2, XvTagCombobox as xv_tag_combobox, XvTag as xv_tag_v2, XvTextInput as xv_text_input_v2, XvTextarea as xv_textarea, XvTile as xv_tile, XvToggle as xv_toggle, XvToggleTip as xv_toggle_tip, XvTooltip as xv_tooltip_v2 };
|