xv-webcomponents 1.24.18 → 1.24.19-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_50.cjs.entry.js +64 -35
- package/dist/cjs/xv-mega-menu-next.cjs.entry.js +5 -5
- package/dist/cjs/xv-webcomponents.cjs.js +1 -1
- package/dist/collection/components/xv-mega-menu/xv-mega-menu.css +32 -14
- package/dist/collection/components/xv-mega-menu/xv-mega-menu.js +4 -4
- package/dist/collection/components/xv-mega-menu-next/xv-mega-menu-next.css +28 -14
- package/dist/collection/components/xv-mega-menu-next/xv-mega-menu-next.js +4 -4
- package/dist/collection/components/xv-number-input/xv-number-input.css +1 -0
- package/dist/collection/components/xv-progress-indicator/xv-progress-indicator-item/xv-progress-indicator-item.css +1 -0
- 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.css +73 -1
- package/dist/collection/components/xv-progress-indicator/xv-progress-indicator.js +58 -4
- package/dist/collection/components/xv-radio/xv-radio.js +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.js +2 -2
- package/dist/collection/components/xv-text-input/xv-text-input.css +2 -0
- package/dist/collection/components/xv-text-input/xv-text-input.js +2 -2
- package/dist/collection/components/xv-textarea/xv-textarea.js +2 -2
- package/dist/collection/components/xv-tile/xv-tile.js +4 -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_50.entry.js +64 -35
- package/dist/esm/xv-mega-menu-next.entry.js +5 -5
- package/dist/esm/xv-webcomponents.js +1 -1
- package/dist/types/components/xv-progress-indicator/xv-progress-indicator.d.ts +10 -0
- package/dist/types/components/xv-tile/xv-tile.d.ts +1 -0
- package/dist/types/components.d.ts +10 -0
- package/dist/xv-webcomponents/{p-76cf729b.entry.js → p-1292ef47.entry.js} +1 -1
- package/dist/xv-webcomponents/p-468ee97d.entry.js +1 -0
- package/dist/xv-webcomponents/xv-webcomponents.esm.js +1 -1
- package/hydrate/index.js +75 -42
- package/hydrate/index.mjs +75 -42
- package/package.json +1 -1
- package/dist/xv-webcomponents/p-ec19bcc7.entry.js +0 -1
|
@@ -82996,7 +82996,7 @@ const XvLoginModal = class {
|
|
|
82996
82996
|
};
|
|
82997
82997
|
XvLoginModal.style = xvLoginModalCss();
|
|
82998
82998
|
|
|
82999
|
-
const xvMegaMenuCss = () => `.sc-xv-mega-menu-h{--menu-group-width:244px;--menu-group-height:454px;--link-visited:var(--link-primary)}.xv-menu.sc-xv-mega-menu{background:inherit;position:relative;font-family:var(--ff-work-sans), sans-serif}@media (min-width: 992px){.xv-menu.sc-xv-mega-menu{min-height:55px}}.xv-menu-loader.sc-xv-mega-menu{position:absolute;top:0;left:0;width:100%;height:100%;z-index:4;background-color:rgba(255, 255, 255, 0.7);display:flex;align-items:center;justify-content:center}@media (max-width: 991px){.xv-menu-loader.sc-xv-mega-menu:not(.open){display:none}}@media (max-width: 991px){.xv-menu.open.sc-xv-mega-menu{padding-bottom:env(safe-area-inset-bottom);max-height:calc(100vh - 120px);overflow:auto;overscroll-behavior:contain}}.xv-menu_mobile.sc-xv-mega-menu{position:relative;display:none}@media (max-width: 991px){.xv-menu_mobile.sc-xv-mega-menu{display:inline-flex}}.xv-menu.sc-xv-mega-menu ul.sc-xv-mega-menu{margin:0;padding:0;list-style:none}.xv-menu.sc-xv-mega-menu .link-chevron.sc-xv-mega-menu{display:inline-block;margin-inline-start:var(--spacing-01)}.xv-menu.sc-xv-mega-menu .action-link.sc-xv-mega-menu{display:block;color:var(--link-primary);text-decoration:none;transition:color 200ms ease-in-out}.xv-menu.sc-xv-mega-menu .action-link.sc-xv-mega-menu:visited{color:var(--link-primary)}.xv-menu.sc-xv-mega-menu .action-link.sc-xv-mega-menu:hover,.xv-menu.sc-xv-mega-menu .action-link.sc-xv-mega-menu:focus,.xv-menu.sc-xv-mega-menu .action-link.sc-xv-mega-menu:active{text-decoration-line:underline;text-decoration-style:solid;text-decoration-skip-ink:none;text-decoration-thickness:auto;text-underline-offset:auto;text-underline-position:from-font;text-decoration-color:var(--link-primary)}.xv-menu.sc-xv-mega-menu .action-link.sc-xv-mega-menu:hover{color:var(--link-primary-hover);cursor:pointer}.xv-menu.sc-xv-mega-menu .action-link.sc-xv-mega-menu:focus{outline:1px solid var(--focus);outline-offset:1px}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu{overflow-x:auto;display:flex;justify-content:flex-start;column-gap:var(--spacing-08)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu{flex-direction:column;display:none}}.xv-menu.sc-xv-mega-menu .menu--right.sc-xv-mega-menu{margin-left:auto;display:flex;align-items:center;align-self:center}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu--right.sc-xv-mega-menu{margin-left:unset;padding-block:var(--spacing-05)}}.xv-menu.sc-xv-mega-menu .menu--backdrop.sc-xv-mega-menu{z-index:-1;background-color:rgba(0, 0, 0, 0.3);position:fixed;top:0;left:0;width:100%;height:100%}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.open.sc-xv-mega-menu{display:flex}}.xv-menu.sc-xv-mega-menu .menu-item.sc-xv-mega-menu:hover .menu-item-label.sc-xv-mega-menu{border-bottom-color:var(--interactive-02)}.xv-menu.sc-xv-mega-menu .menu-item.active.sc-xv-mega-menu .menu-item-groups.sc-xv-mega-menu{z-index:990;display:flex}.xv-menu.sc-xv-mega-menu .menu-item.active.sc-xv-mega-menu .menu-item-label.sc-xv-mega-menu{border-bottom-color:var(--interactive-02)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu-item.active.sc-xv-mega-menu{border-bottom:1px solid #E1E4ED}}.xv-menu.sc-xv-mega-menu .menu-item-label.sc-xv-mega-menu{display:block;margin:0;padding-block:var(--spacing-05, 16px);color:inherit;text-decoration:none;font-size:16px;line-height:24px;font-family:var(--ff-body), sans-serif;font-weight:600;cursor:pointer;border-bottom:2px solid transparent;transition:250ms ease-in-out border-bottom-color;user-select:none;white-space:nowrap}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu-item-label.sc-xv-mega-menu{border-bottom:1px solid #E1E4ED}}.xv-menu.sc-xv-mega-menu .menu-item-groups.sc-xv-mega-menu{z-index:-1;position:absolute;left:0;top:100%;width:100%;background-color:var(--background, #fff);display:none;flex-direction:column;border:1px solid var(--border-subtle-01);row-gap:var(--spacing-05);padding-block:var(--spacing-08) var(--spacing-06);min-height:var(--menu-group-height);border-radius:0 0 8px 8px;overflow:hidden;color:var(--interactive-01, #273435)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu-item-groups.sc-xv-mega-menu{min-height:unset;padding-block:unset;position:relative;row-gap:unset;border:none}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group.sc-xv-mega-menu{display:flex;align-items:flex-start}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group.sc-xv-mega-menu{flex-direction:column;align-items:stretch}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-label.sc-xv-mega-menu{user-select:none;min-width:var(--menu-group-width);max-width:var(--menu-group-width);color:var(--text-primary, #333);font-size:16px;font-style:normal;font-weight:400;line-height:137.5%;display:flex;column-gap:var(--spacing-04);text-align:right;justify-content:flex-end;cursor:pointer}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-label-text.sc-xv-mega-menu{text-overflow:ellipsis;overflow:hidden}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-label-icon.sc-xv-mega-menu{width:8px;height:8px;border-bottom:2px solid currentColor;border-right:2px solid currentColor;transform:rotate(-45deg);transform-origin:bottom;align-self:center}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-label.sc-xv-mega-menu{max-width:unset;min-width:unset;align-items:stretch;justify-content:flex-start;padding-block:var(--spacing-05)}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-container.sc-xv-mega-menu{flex:1;display:none}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-container-absolute.sc-xv-mega-menu{position:absolute;top:0;right:0;width:calc(100% - (var(--menu-group-width) + var(--spacing-06) + var(--spacing-09) + var(--spacing-05)));min-height:calc(100% - (var(--spacing-08) + var(--spacing-06)));padding:var(--spacing-08) var(--spacing-06) var(--spacing-06) var(--spacing-09);display:flex;background-color:var(--layer-01, #F7F7F7)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-container-absolute.sc-xv-mega-menu{position:unset;flex-direction:column;width:100%;flex:1;padding:var(--spacing-06) 0;background-color:var(--background)}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-container-absolute.noLabel.sc-xv-mega-menu{left:0;width:calc(100% - (var(--spacing-06) + var(--spacing-09)))}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group.active.sc-xv-mega-menu .group-label.sc-xv-mega-menu{font-weight:600}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group.active.sc-xv-mega-menu .group-label-icon.sc-xv-mega-menu{transform-origin:center;transform:rotate(45deg)}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group.active.sc-xv-mega-menu .group-container.sc-xv-mega-menu{display:flex}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-menus.sc-xv-mega-menu{flex:1;display:flex;flex-direction:column;row-gap:var(--spacing-06)}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-menus-categories.sc-xv-mega-menu{display:flex;row-gap:var(--spacing-07);column-gap:var(--spacing-05);flex:1}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-menus-categories.sc-xv-mega-menu{flex-direction:column;gap:var(--spacing-07)}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-menus-categories.inline.sc-xv-mega-menu{flex-direction:column;flex-wrap:wrap;max-height:365px}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-menus-categories.inline.sc-xv-mega-menu{max-height:unset}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-menus-categories.inline.sc-xv-mega-menu .category.sc-xv-mega-menu{flex:none}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-menus-actions.sc-xv-mega-menu{display:flex;align-items:center;justify-content:flex-start;gap:var(--spacing-05)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-menus-actions.sc-xv-mega-menu{flex-direction:column;justify-content:stretch;align-items:stretch;text-align:center}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card.sc-xv-mega-menu{box-sizing:content-box;max-width:228px;min-width:200px;padding-left:var(--spacing-06);border-left:1px solid var(--border-subtle-01)}@media (min-width: 992px) and (max-width: 1199px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card.sc-xv-mega-menu{display:none}}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card.sc-xv-mega-menu{margin-block-start:var(--spacing-06);border-left:none;padding-left:0;max-width:unset;min-width:unset}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card.sc-xv-mega-menu .xv-card.sc-xv-mega-menu{box-shadow:none;background-color:var(--background, #fff)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card.sc-xv-mega-menu .xv-card.sc-xv-mega-menu{width:unset}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card-title.sc-xv-mega-menu,.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card-desc.sc-xv-mega-menu{font-size:var(--fz-md, 14px);font-style:normal;line-height:18px;letter-spacing:0.16px}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card.sc-xv-mega-menu .xv-link_standalone.sc-xv-mega-menu,.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card-title.sc-xv-mega-menu,.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card-desc.sc-xv-mega-menu{font-family:var(--ff-work-sans), sans-serif}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card-title.sc-xv-mega-menu{color:var(--text-primary, #333);font-weight:600}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card-desc.sc-xv-mega-menu{color:var(--text-secondary, #515151);font-weight:400;padding-top:var(--spacing-03);display:-webkit-box;-webkit-line-clamp:11;-webkit-box-orient:vertical;overflow:hidden}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .category.sc-xv-mega-menu{flex:1;display:flex;flex-direction:column;row-gap:var(--spacing-05)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .category.sc-xv-mega-menu{flex:0}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .category.sc-xv-mega-menu:not(:last-child){border-bottom:1px solid var(--border-subtle-01);padding-bottom:var(--spacing-04)}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .category-label.sc-xv-mega-menu{margin:0;font-size:var(--fz-md, 14px);color:var(--text-secondary)}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .category-routes.sc-xv-mega-menu{display:flex;flex-direction:column;row-gap:var(--spacing-05)}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .route.sc-xv-mega-menu{display:inline-flex;align-items:center;column-gap:var(--spacing-03);position:relative;font-size:var(--fz-lg, 16px)}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .route.sc-xv-mega-menu .route-link.sc-xv-mega-menu{color:inherit;text-decoration:none;font-family:var(--ff-work-sans), sans-serif;line-height:133.333%;transition:color 200ms ease-in-out}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .route.sc-xv-mega-menu .route-link.sc-xv-mega-menu:visited{color:inherit}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .route.sc-xv-mega-menu .route-link.sc-xv-mega-menu:hover{color:var(--link-primary);cursor:pointer}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .route.sc-xv-mega-menu .route-link.sc-xv-mega-menu:focus{outline:1px solid var(--focus);outline-offset:1px}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .route.sc-xv-mega-menu{white-space:nowrap}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .route.sc-xv-mega-menu .route-tag.sc-xv-mega-menu{font-size:9px}`;
|
|
82999
|
+
const xvMegaMenuCss = () => `.sc-xv-mega-menu-h{--menu-group-width:244px;--menu-group-height:454px;--link-visited:var(--link-primary)}.xv-menu.sc-xv-mega-menu{background:inherit;position:relative;font-family:var(--ff-work-sans), sans-serif}@media (min-width: 992px){.xv-menu.sc-xv-mega-menu{min-height:55px}}.xv-menu.sc-xv-mega-menu,.xv-menu.sc-xv-mega-menu *.sc-xv-mega-menu{box-sizing:content-box}.xv-menu-loader.sc-xv-mega-menu{position:absolute;top:0;left:0;width:100%;height:100%;z-index:4;background-color:rgba(255, 255, 255, 0.7);display:flex;align-items:center;justify-content:center}@media (max-width: 991px){.xv-menu-loader.sc-xv-mega-menu:not(.open){display:none}}@media (max-width: 991px){.xv-menu.open.sc-xv-mega-menu{padding-bottom:env(safe-area-inset-bottom);max-height:calc(100vh - 120px);overflow:auto;overscroll-behavior:contain}}.xv-menu_mobile.sc-xv-mega-menu{position:relative;display:none}@media (max-width: 991px){.xv-menu_mobile.sc-xv-mega-menu{display:inline-flex}}.xv-menu.sc-xv-mega-menu ul.sc-xv-mega-menu{margin:0;padding:0;list-style:none}.xv-menu.sc-xv-mega-menu .link-chevron.sc-xv-mega-menu{display:inline-block;margin-inline-start:var(--spacing-01)}.xv-menu.sc-xv-mega-menu .action-link.sc-xv-mega-menu{display:block;color:var(--link-primary);font-family:var(--ff-body), sans-serif;font-size:14px;line-height:20px;font-weight:400;letter-spacing:0.16px;text-decoration:none;transition:color 200ms ease-in-out}.xv-menu.sc-xv-mega-menu .action-link.sc-xv-mega-menu:visited{color:var(--link-primary)}.xv-menu.sc-xv-mega-menu .action-link.sc-xv-mega-menu:hover,.xv-menu.sc-xv-mega-menu .action-link.sc-xv-mega-menu:focus,.xv-menu.sc-xv-mega-menu .action-link.sc-xv-mega-menu:active{text-decoration-line:underline;text-decoration-style:solid;text-decoration-skip-ink:none;text-decoration-thickness:auto;text-underline-offset:auto;text-underline-position:from-font;text-decoration-color:var(--link-primary)}.xv-menu.sc-xv-mega-menu .action-link.sc-xv-mega-menu:hover{color:var(--link-primary-hover);cursor:pointer}.xv-menu.sc-xv-mega-menu .action-link.sc-xv-mega-menu:focus{outline:1px solid var(--focus);outline-offset:1px}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu{overflow-x:auto;display:flex;justify-content:flex-start;column-gap:var(--spacing-08)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu{flex-direction:column;display:none}}.xv-menu.sc-xv-mega-menu .menu--right.sc-xv-mega-menu{margin-left:auto;display:flex;align-items:center;align-self:center}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu--right.sc-xv-mega-menu{margin-left:unset;padding-block:var(--spacing-05)}}.xv-menu.sc-xv-mega-menu .menu--backdrop.sc-xv-mega-menu{z-index:-1;background-color:rgba(0, 0, 0, 0.3);position:fixed;top:0;left:0;width:100%;height:100%}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.open.sc-xv-mega-menu{display:flex}}.xv-menu.sc-xv-mega-menu .menu-item.sc-xv-mega-menu:hover .menu-item-label.sc-xv-mega-menu{border-bottom-color:var(--interactive-02)}.xv-menu.sc-xv-mega-menu .menu-item.active.sc-xv-mega-menu .menu-item-groups.sc-xv-mega-menu{z-index:990;display:flex}.xv-menu.sc-xv-mega-menu .menu-item.active.sc-xv-mega-menu .menu-item-label.sc-xv-mega-menu{border-bottom-color:var(--interactive-02)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu-item.active.sc-xv-mega-menu{border-bottom:1px solid #E1E4ED}}.xv-menu.sc-xv-mega-menu .menu-item-label.sc-xv-mega-menu{display:block;margin:0;padding-block:var(--spacing-05, 16px);color:inherit;text-decoration:none;font-size:16px;line-height:22px;font-family:var(--ff-body), sans-serif;font-weight:500;cursor:pointer;border-bottom:2px solid transparent;transition:250ms ease-in-out border-bottom-color;user-select:none;white-space:nowrap}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu-item-label.sc-xv-mega-menu{border-bottom:1px solid #E1E4ED}}.xv-menu.sc-xv-mega-menu .menu-item-groups.sc-xv-mega-menu{z-index:-1;position:absolute;left:0;top:100%;width:100%;background-color:var(--background, #fff);display:none;flex-direction:column;border:1px solid var(--border-subtle-01);row-gap:var(--spacing-05);padding-block:var(--spacing-08) var(--spacing-06);min-height:var(--menu-group-height);border-radius:0 0 8px 8px;overflow:hidden;color:var(--interactive-01, #273435)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu-item-groups.sc-xv-mega-menu{min-height:unset;padding-block:unset;position:relative;row-gap:unset;border:none}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group.sc-xv-mega-menu{display:flex;align-items:flex-start}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group.sc-xv-mega-menu{flex-direction:column;align-items:stretch}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-label.sc-xv-mega-menu{user-select:none;min-width:var(--menu-group-width);max-width:var(--menu-group-width);color:var(--text-primary, #333);font-family:var(--ff-body), sans-serif;font-size:16px;font-style:normal;font-weight:400;line-height:22px;display:flex;column-gap:var(--spacing-04);text-align:right;justify-content:flex-end;cursor:pointer}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-label-text.sc-xv-mega-menu{text-overflow:ellipsis;overflow:hidden}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-label-icon.sc-xv-mega-menu{width:8px;height:8px;border-bottom:2px solid var(--link-primary, currentColor);border-right:2px solid var(--link-primary, currentColor);transform:rotate(-45deg);transform-origin:bottom;align-self:center}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-label.sc-xv-mega-menu{max-width:unset;min-width:unset;align-items:stretch;justify-content:flex-start;padding-block:var(--spacing-05)}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-container.sc-xv-mega-menu{flex:1;display:none}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-container-absolute.sc-xv-mega-menu{position:absolute;top:0;right:0;width:calc(100% - (var(--menu-group-width) + var(--spacing-06) + var(--spacing-09) + var(--spacing-05)));min-height:calc(100% - (var(--spacing-08) + var(--spacing-06)));padding:var(--spacing-08) var(--spacing-06) var(--spacing-06) var(--spacing-09);display:flex;background-color:var(--layer-01, #F7F7F7)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-container-absolute.sc-xv-mega-menu{position:unset;flex-direction:column;width:100%;flex:1;padding:var(--spacing-06) 0;background-color:var(--background)}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-container-absolute.noLabel.sc-xv-mega-menu{left:0;width:calc(100% - (var(--spacing-06) + var(--spacing-09)))}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group.active.sc-xv-mega-menu .group-label.sc-xv-mega-menu{font-weight:600}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group.active.sc-xv-mega-menu .group-label-icon.sc-xv-mega-menu{transform-origin:center;transform:rotate(45deg)}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group.active.sc-xv-mega-menu .group-container.sc-xv-mega-menu{display:flex}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-menus.sc-xv-mega-menu{flex:1;display:flex;flex-direction:column;row-gap:var(--spacing-06)}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-menus-categories.sc-xv-mega-menu{display:flex;row-gap:var(--spacing-07);column-gap:var(--spacing-05);flex:1}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-menus-categories.sc-xv-mega-menu{flex-direction:column;gap:var(--spacing-07)}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-menus-categories.inline.sc-xv-mega-menu{flex-direction:column;flex-wrap:wrap;max-height:365px}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-menus-categories.inline.sc-xv-mega-menu{max-height:unset}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-menus-categories.inline.sc-xv-mega-menu .category.sc-xv-mega-menu{flex:none}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-menus-actions.sc-xv-mega-menu{display:flex;align-items:center;justify-content:flex-start;gap:var(--spacing-05)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-menus-actions.sc-xv-mega-menu{flex-direction:column;justify-content:stretch;align-items:stretch;text-align:center}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card.sc-xv-mega-menu{box-sizing:content-box;max-width:228px;min-width:200px;padding-left:var(--spacing-06);border-left:1px solid var(--border-subtle-01)}@media (min-width: 992px) and (max-width: 1199px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card.sc-xv-mega-menu{display:none}}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card.sc-xv-mega-menu{margin-block-start:var(--spacing-06);border-left:none;padding-left:0;max-width:unset;min-width:unset}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card.sc-xv-mega-menu .xv-card.sc-xv-mega-menu{box-shadow:none;background-color:var(--background, #fff)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card.sc-xv-mega-menu .xv-card.sc-xv-mega-menu{width:unset}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card-title.sc-xv-mega-menu,.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card-desc.sc-xv-mega-menu{margin:0;font-family:var(--ff-body), sans-serif;font-size:16px;font-style:normal;line-height:22px;letter-spacing:0}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card-title.sc-xv-mega-menu{display:block;color:var(--text-primary, #333);font-weight:600}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card-desc.sc-xv-mega-menu{color:var(--text-secondary, #515151);font-weight:400;padding-top:var(--spacing-03);margin-bottom:var(--spacing-03);display:-webkit-box;-webkit-line-clamp:11;-webkit-box-orient:vertical;overflow:hidden}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .category.sc-xv-mega-menu{flex:1;display:flex;flex-direction:column;row-gap:var(--spacing-05)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .category.sc-xv-mega-menu{flex:0}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .category.sc-xv-mega-menu:not(:last-child){border-bottom:1px solid var(--border-subtle-01);padding-bottom:var(--spacing-04)}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .category-label.sc-xv-mega-menu{display:block;margin:0;font-family:var(--ff-body), sans-serif;font-size:14px;line-height:18px;font-weight:400;letter-spacing:0.16px;color:var(--text-secondary)}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .category-routes.sc-xv-mega-menu{display:flex;flex-direction:column;row-gap:var(--spacing-05)}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .route.sc-xv-mega-menu{display:inline-flex;align-items:center;column-gap:var(--spacing-03);position:relative;font-size:var(--fz-lg, 16px)}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .route.sc-xv-mega-menu .route-link.sc-xv-mega-menu{color:inherit;text-decoration:none;font-family:var(--ff-body), sans-serif;font-size:16px;line-height:22px;font-weight:400;transition:color 200ms ease-in-out}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .route.sc-xv-mega-menu .route-link.sc-xv-mega-menu:visited{color:inherit}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .route.sc-xv-mega-menu .route-link.sc-xv-mega-menu:hover{color:var(--link-primary);cursor:pointer}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .route.sc-xv-mega-menu .route-link.sc-xv-mega-menu:focus{outline:1px solid var(--focus);outline-offset:1px}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .route.sc-xv-mega-menu{white-space:nowrap}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .route.sc-xv-mega-menu .route-tag.sc-xv-mega-menu{font-size:9px}`;
|
|
83000
83000
|
|
|
83001
83001
|
const XvMegaMenu = class {
|
|
83002
83002
|
constructor(hostRef) {
|
|
@@ -83060,15 +83060,15 @@ const XvMegaMenu = class {
|
|
|
83060
83060
|
render() {
|
|
83061
83061
|
return (index$1.h(index$1.Host, { key: '5f2979691c296f255a4af567b13877b58042ebb1' }, index$1.h("nav", { key: '5488cc3b13d3384e349034a7faa519636b450690', class: { 'xv-menu': true, open: this.open } }, this.menuLoading && (index$1.h("div", { key: '225a780b15d381eb3dcd01a929165b8d6a3d34c2', class: { 'xv-menu-loader': true, open: this.open } }, index$1.h("xv-loader-v2", { key: 'b66f449bf7154ce77515df080872a75d661d96f1' }))), index$1.h("ul", { key: 'c7e7b2e44ca6966a0ff5aa4fed408064660eff38', class: { menu: true, open: this.open } }, this.menuItems.map((menuItem) => {
|
|
83062
83062
|
var _a, _b;
|
|
83063
|
-
return (index$1.h("li", { class: { 'menu-item': true, active: menuItem.id === ((_a = this.activeItem) === null || _a === void 0 ? void 0 : _a.id) } }, menuItem.route ? (index$1.h("a", { class: "menu-item-label", href: menuItem.route.route }, (_b = menuItem.route) === null || _b === void 0 ? void 0 : _b.label)) : (index$1.h(index$1.Fragment, null, index$1.h("
|
|
83063
|
+
return (index$1.h("li", { class: { 'menu-item': true, active: menuItem.id === ((_a = this.activeItem) === null || _a === void 0 ? void 0 : _a.id) } }, menuItem.route ? (index$1.h("a", { class: "menu-item-label", href: menuItem.route.route }, (_b = menuItem.route) === null || _b === void 0 ? void 0 : _b.label)) : (index$1.h(index$1.Fragment, null, index$1.h("span", { class: "menu-item-label", onClick: () => this.setActiveItem(menuItem) }, menuItem === null || menuItem === void 0 ? void 0 : menuItem.label), index$1.h("ul", { class: "menu-item-groups" }, menuItem.groups.map((group) => {
|
|
83064
83064
|
var _a;
|
|
83065
83065
|
return (index$1.h("li", { class: { group: true, active: ((_a = this.activeGroup) === null || _a === void 0 ? void 0 : _a.id) === group.id } }, (group.label && menuItem.groups.length > 1) && (index$1.h("div", { class: "group-label", onClick: () => this.setActiveGroup(group) }, index$1.h("span", { class: "group-label-text" }, group.label), index$1.h("span", { class: "group-label-icon" }))), index$1.h("div", { class: "group-container" }, index$1.h("div", { class: {
|
|
83066
83066
|
'group-container-absolute': true,
|
|
83067
83067
|
noLabel: !(group.label && menuItem.groups.length > 1),
|
|
83068
|
-
} }, index$1.h("div", { class: "group-menus" }, index$1.h("ul", { class: { 'group-menus-categories': true, inline: group.layout === 'inline' } }, group.categories.map((category) => (index$1.h("li", { class: "category" }, index$1.h("
|
|
83069
|
-
index$1.h("xv-button-v2", { onClick: () => this.navActionClick(action), block: true, variant: "tertiary" }, action.label)))))), (group === null || group === void 0 ? void 0 : group.card) && (index$1.h("div", { class: "group-card" }, index$1.h("xv-card-v2", { media: this.applicationContext !== 'Komsa' ? group.card.image : undefined, variant: this.isMobile ? 'horizontal' : 'vertical' }, index$1.h("
|
|
83068
|
+
} }, index$1.h("div", { class: "group-menus" }, index$1.h("ul", { class: { 'group-menus-categories': true, inline: group.layout === 'inline' } }, group.categories.map((category) => (index$1.h("li", { class: "category" }, index$1.h("span", { class: "category-label" }, category.label), index$1.h("ul", { class: "category-routes" }, category.routes.map((route) => (index$1.h("li", { class: "route" }, index$1.h("a", { class: "route-link", href: route.route || '#' }, route.label), route.tag && (index$1.h("xv-tag-v2", { class: "route-tag", size: "sm", color: "#161616", bg: "#E0E0E0" }, route.tag)))))))))), index$1.h("ul", { class: "group-menus-actions" }, group.actions.map((action) => (index$1.h("li", { class: "action" }, action.type === 'link' && (index$1.h("a", { class: "action-link", href: action === null || action === void 0 ? void 0 : action.url }, action.label, index$1.h("span", { class: "link-chevron" }, "\u2192"))), action.type === 'button' &&
|
|
83069
|
+
index$1.h("xv-button-v2", { onClick: () => this.navActionClick(action), block: true, variant: "tertiary" }, action.label)))))), (group === null || group === void 0 ? void 0 : group.card) && (index$1.h("div", { class: "group-card" }, index$1.h("xv-card-v2", { media: this.applicationContext !== 'Komsa' ? group.card.image : undefined, variant: this.isMobile ? 'horizontal' : 'vertical' }, index$1.h("span", { slot: "header", class: "group-card-title" }, group.card.title), index$1.h("span", { slot: "body", class: "group-card-desc" }, group.card.description), group.card.linkLabel && (index$1.h("a", { slot: "footer", class: "action-link", href: group.card.linkUrl || '#' }, group.card.linkLabel, index$1.h("span", { class: "link-chevron" }, "\u2192"))))))))));
|
|
83070
83070
|
}))))));
|
|
83071
|
-
}), index$1.h("li", { key: '
|
|
83071
|
+
}), index$1.h("li", { key: '9889408ddd0da2f33c4c9d6458af04ee4ae3e17d', class: "menu--right" }, index$1.h("slot", { key: 'af22cbe42fed3aa0474982c64360d9ea4413db38', name: "menu-right" })), this.open && (index$1.h("li", { key: '19db99cbf45a66836266e2c334220277304486bb', class: "menu--backdrop", onClick: () => this.handleClose() }))))));
|
|
83072
83072
|
}
|
|
83073
83073
|
get el() { return index$1.getElement(this); }
|
|
83074
83074
|
};
|
|
@@ -83181,7 +83181,7 @@ const XvNotification = class {
|
|
|
83181
83181
|
};
|
|
83182
83182
|
XvNotification.style = xvNotificationCss();
|
|
83183
83183
|
|
|
83184
|
-
const xvNumberInputCss = () => `: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}`;
|
|
83184
|
+
const xvNumberInputCss = () => `: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;font-size:var(--fz-md, 14px);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}`;
|
|
83185
83185
|
|
|
83186
83186
|
const XvNumberInput = class {
|
|
83187
83187
|
constructor(hostRef) {
|
|
@@ -83707,7 +83707,7 @@ var PROGRESS_ITEM_STATUS;
|
|
|
83707
83707
|
PROGRESS_ITEM_STATUS["IN_PROGRESS"] = "in_progress";
|
|
83708
83708
|
})(PROGRESS_ITEM_STATUS || (PROGRESS_ITEM_STATUS = {}));
|
|
83709
83709
|
|
|
83710
|
-
const xvProgressIndicatorCss = () => `:host{--progress-indicator-icon-size:22px;--progress-indicator-font-size:var(--fz-md, 14px);display:flex;align-items:flex-start;justify-content:space-between;font-
|
|
83710
|
+
const xvProgressIndicatorCss = () => `:host{--progress-indicator-icon-size:22px;--progress-indicator-font-size:var(--fz-md, 14px);display:flex;flex-direction:column;font-family:var(--ff-body, inherit)}.items{display:flex;align-items:flex-start;justify-content:space-between;overflow-x:auto}.mobile-header{display:none;justify-content:space-between;column-gap:var(--gap-xs, 8px);font-size:var(--fz-md, 14px);line-height:20px;letter-spacing:0.16px}.mobile-label{color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mobile-counter{color:var(--text-secondary);white-space:nowrap}:host([variant=horizontal]) ::slotted(xv-progress-indicator-v2-item){flex-direction:row;column-gap:var(--gap-xs, 8px);justify-content:flex-start;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left}:host([size=xs]){--progress-indicator-icon-size:14px;--progress-indicator-font-size:var(--fz-md, 14px)}:host([size=sm]){--progress-indicator-icon-size:16px;--progress-indicator-font-size:var(--fz-md, 14px)}:host([size=md]){--progress-indicator-icon-size:22px;--progress-indicator-font-size:var(--fz-md, 14px)}:host([size=lg]){--progress-indicator-icon-size:24px;--progress-indicator-font-size:var(--fz-lg, 18px)}:host([size=xl]){--progress-indicator-icon-size:32px;--progress-indicator-font-size:var(--fz-xl, 20px)}@media (max-width: 768px){:host([mobile-breakpoint=sm]){--progress-indicator-icon-size:16px;--progress-indicator-label-display:none;row-gap:var(--gap-xs, 8px)}:host([mobile-breakpoint=sm]) .mobile-header{display:flex}:host([mobile-breakpoint=sm]) ::slotted(xv-progress-indicator-v2-item){align-items:flex-start;justify-content:flex-start;padding:10px 16px 10px 0}}@media (max-width: 991px){:host([mobile-breakpoint=md]){--progress-indicator-icon-size:16px;--progress-indicator-label-display:none;row-gap:var(--gap-xs, 8px)}:host([mobile-breakpoint=md]) .mobile-header{display:flex}:host([mobile-breakpoint=md]) ::slotted(xv-progress-indicator-v2-item){align-items:flex-start;justify-content:flex-start;padding:10px 16px 10px 0}}@media (max-width: 1199px){:host([mobile-breakpoint=lg]){--progress-indicator-icon-size:16px;--progress-indicator-label-display:none;row-gap:var(--gap-xs, 8px)}:host([mobile-breakpoint=lg]) .mobile-header{display:flex}:host([mobile-breakpoint=lg]) ::slotted(xv-progress-indicator-v2-item){align-items:flex-start;justify-content:flex-start;padding:10px 16px 10px 0}}`;
|
|
83711
83711
|
|
|
83712
83712
|
const XvProgressIndicator = class {
|
|
83713
83713
|
constructor(hostRef) {
|
|
@@ -83728,19 +83728,23 @@ const XvProgressIndicator = class {
|
|
|
83728
83728
|
* possible options `XS | SM | MD | LG | XL`
|
|
83729
83729
|
*/
|
|
83730
83730
|
this.size = _vars.SIZE_VAR.MD;
|
|
83731
|
+
/** Breakpoint (and below) where the mobile view applies, `none` disables it */
|
|
83732
|
+
this.mobileBreakpoint = 'sm';
|
|
83733
|
+
this.currentLabel = '';
|
|
83734
|
+
this.currentStep = 0;
|
|
83735
|
+
this.total = 0;
|
|
83731
83736
|
}
|
|
83732
83737
|
// Update 'xv-progress-indicator-item' done status
|
|
83733
83738
|
updateChildItems() {
|
|
83734
83739
|
const items = this.el.children;
|
|
83735
83740
|
const itemsCount = this.el.childElementCount;
|
|
83736
|
-
const progressPerItem = 100 / itemsCount;
|
|
83737
83741
|
if (!items.length || !itemsCount)
|
|
83738
83742
|
return;
|
|
83739
83743
|
index$2.forEach(items, (item, index) => {
|
|
83740
83744
|
var _a;
|
|
83741
|
-
const itemProgressStart = index * progressPerItem;
|
|
83742
83745
|
let status;
|
|
83743
|
-
|
|
83746
|
+
// Multiply before dividing so progress=100 gives exactly 100 for the last item
|
|
83747
|
+
const localProgress = Math.min(Math.max(this.progress * itemsCount / 100 - index, 0), 1) * 100;
|
|
83744
83748
|
if (localProgress >= 100) {
|
|
83745
83749
|
status = PROGRESS_ITEM_STATUS.DONE;
|
|
83746
83750
|
}
|
|
@@ -83757,13 +83761,36 @@ const XvProgressIndicator = class {
|
|
|
83757
83761
|
if (line)
|
|
83758
83762
|
line.style.width = `${localProgress}%`;
|
|
83759
83763
|
});
|
|
83764
|
+
this.updateCurrentStep();
|
|
83765
|
+
}
|
|
83766
|
+
updateCurrentStep() {
|
|
83767
|
+
var _a, _b;
|
|
83768
|
+
const items = this.el.children;
|
|
83769
|
+
const index = Math.max(Math.min(Math.floor(this.progress * items.length / 100), items.length - 1), 0);
|
|
83770
|
+
this.total = items.length;
|
|
83771
|
+
this.currentStep = items.length ? index + 1 : 0;
|
|
83772
|
+
this.currentLabel = (_b = (_a = items[index]) === null || _a === void 0 ? void 0 : _a.textContent.trim()) !== null && _b !== void 0 ? _b : '';
|
|
83773
|
+
}
|
|
83774
|
+
componentWillLoad() {
|
|
83775
|
+
this.updateCurrentStep();
|
|
83760
83776
|
}
|
|
83761
83777
|
// Load initial done status
|
|
83762
83778
|
componentDidLoad() {
|
|
83763
83779
|
this.updateChildItems();
|
|
83764
83780
|
}
|
|
83781
|
+
connectedCallback() {
|
|
83782
|
+
// Absent in hydrate and spec environments
|
|
83783
|
+
if (typeof MutationObserver === 'undefined')
|
|
83784
|
+
return;
|
|
83785
|
+
this.observer = new MutationObserver(() => this.updateChildItems());
|
|
83786
|
+
this.observer.observe(this.el, { childList: true, subtree: true, characterData: true });
|
|
83787
|
+
}
|
|
83788
|
+
disconnectedCallback() {
|
|
83789
|
+
var _a;
|
|
83790
|
+
(_a = this.observer) === null || _a === void 0 ? void 0 : _a.disconnect();
|
|
83791
|
+
}
|
|
83765
83792
|
render() {
|
|
83766
|
-
return (index$1.h(index$1.Host, { key: '
|
|
83793
|
+
return (index$1.h(index$1.Host, { key: 'a13cb2173f8a41ba41041a2abcb56bca673d17d0', variant: this.variant, size: this.size, class: { 'xv-progress-indicator': true } }, index$1.h("div", { key: 'c8445bb96a98e1331adcaa8fa24322ed3688927c', class: "mobile-header" }, index$1.h("span", { key: 'e2b06b24022e81a4a211fcf25dfed052eed065a7', class: "mobile-label" }, this.currentLabel), index$1.h("span", { key: '8297b527f7c98dd7fd807dca9f3d064d5e135e48', class: "mobile-counter" }, this.currentStep, "/", this.total)), index$1.h("div", { key: '5deb80eb473aa454f458bd2806d5e00d74f954b8', class: "items" }, index$1.h("slot", { key: '4779d447a67bd596d62e654ce80fe9f9d54dc583' }))));
|
|
83767
83794
|
}
|
|
83768
83795
|
get el() { return index$1.getElement(this); }
|
|
83769
83796
|
static get watchers() { return {
|
|
@@ -83774,7 +83801,7 @@ const XvProgressIndicator = class {
|
|
|
83774
83801
|
};
|
|
83775
83802
|
XvProgressIndicator.style = xvProgressIndicatorCss();
|
|
83776
83803
|
|
|
83777
|
-
const xvProgressIndicatorItemCss = () => `:host(.xv-progress-indicator-item){display:flex;flex:1;flex-direction:column;align-items:center;justify-content:center;position:relative;padding:10px 16px;row-gap:var(--gap-sm, 10px)}:host(.xv-progress-indicator-item):before{width:100%}:host(.xv-progress-indicator-item):before,:host(.xv-progress-indicator-item) .line{content:"";z-index:1;display:inline-block;position:absolute;top:0;left:0;right:0;height:2px;color:inherit;background-color:var(--border-subtle-01, grey)}:host(.xv-progress-indicator-item) .line{width:0;color:inherit;transition:width 250ms ease;background-color:var(--background-brand, currentColor)}:host(.xv-progress-indicator-item) .icon{display:flex;align-items:center;justify-content:center;width:var(--progress-indicator-icon-size, 22px);height:var(--progress-indicator-icon-size, 22px);min-width:var(--progress-indicator-icon-size, 22px);min-height:var(--progress-indicator-icon-size, 22px);max-width:var(--progress-indicator-icon-size, 22px);max-height:var(--progress-indicator-icon-size, 22px);border:2px dashed var(--icon-primary, currentColor);border-radius:50%}:host(.xv-progress-indicator-item) .icon svg{width:calc(var(--progress-indicator-icon-size, 22px) * 0.637);height:calc(var(--progress-indicator-icon-size, 22px) * 0.637);opacity:0;transition:opacity 500ms ease-in-out}:host(.xv-progress-indicator-item) .label{margin:0;color:var(--text-primary);font-size:var(--progress-indicator-font-size, 14px);line-height:normal;letter-spacing:0.16px;text-overflow:ellipsis;overflow:hidden}:host([status=done]) .icon{background-color:var(--background-brand, inherit);color:white}:host([status=done]) .icon,:host([status=in_progress]) .icon{border-color:var(--background-brand, currentColor);border-style:solid}:host([status=done]) .icon svg,:host([status=in_progress]) .icon svg{opacity:1}:host([status=done]) .line,:host([status=in_progress]) .line{width:100%;background-color:var(--background-brand, currentColor)}:host([status=in_progress]) .icon{border-color:var(--background-brand, currentColor);color:var(--background-brand, inherit);border-style:solid}:host([status=in_progress]) .icon:after{content:"";height:47%;width:47%;background-color:var(--background-brand, currentColor);border-radius:50%}:host([status=in_progress]) .icon svg{display:none}`;
|
|
83804
|
+
const xvProgressIndicatorItemCss = () => `:host(.xv-progress-indicator-item){display:flex;flex:1;flex-direction:column;align-items:center;justify-content:center;position:relative;padding:10px 16px;row-gap:var(--gap-sm, 10px)}:host(.xv-progress-indicator-item):before{width:100%}:host(.xv-progress-indicator-item):before,:host(.xv-progress-indicator-item) .line{content:"";z-index:1;display:inline-block;position:absolute;top:0;left:0;right:0;height:2px;color:inherit;background-color:var(--border-subtle-01, grey)}:host(.xv-progress-indicator-item) .line{width:0;color:inherit;transition:width 250ms ease;background-color:var(--background-brand, currentColor)}:host(.xv-progress-indicator-item) .icon{display:flex;align-items:center;justify-content:center;width:var(--progress-indicator-icon-size, 22px);height:var(--progress-indicator-icon-size, 22px);min-width:var(--progress-indicator-icon-size, 22px);min-height:var(--progress-indicator-icon-size, 22px);max-width:var(--progress-indicator-icon-size, 22px);max-height:var(--progress-indicator-icon-size, 22px);border:2px dashed var(--icon-primary, currentColor);border-radius:50%}:host(.xv-progress-indicator-item) .icon svg{width:calc(var(--progress-indicator-icon-size, 22px) * 0.637);height:calc(var(--progress-indicator-icon-size, 22px) * 0.637);opacity:0;transition:opacity 500ms ease-in-out}:host(.xv-progress-indicator-item) .label{display:var(--progress-indicator-label-display, block);margin:0;color:var(--text-primary);font-size:var(--progress-indicator-font-size, 14px);line-height:normal;letter-spacing:0.16px;text-overflow:ellipsis;overflow:hidden}:host([status=done]) .icon{background-color:var(--background-brand, inherit);color:white}:host([status=done]) .icon,:host([status=in_progress]) .icon{border-color:var(--background-brand, currentColor);border-style:solid}:host([status=done]) .icon svg,:host([status=in_progress]) .icon svg{opacity:1}:host([status=done]) .line,:host([status=in_progress]) .line{width:100%;background-color:var(--background-brand, currentColor)}:host([status=in_progress]) .icon{border-color:var(--background-brand, currentColor);color:var(--background-brand, inherit);border-style:solid}:host([status=in_progress]) .icon:after{content:"";height:47%;width:47%;background-color:var(--background-brand, currentColor);border-radius:50%}:host([status=in_progress]) .icon svg{display:none}`;
|
|
83778
83805
|
|
|
83779
83806
|
const XvProgressIndicatorItem = class {
|
|
83780
83807
|
constructor(hostRef) {
|
|
@@ -83782,7 +83809,7 @@ const XvProgressIndicatorItem = class {
|
|
|
83782
83809
|
this.status = PROGRESS_ITEM_STATUS.NO_STARTED;
|
|
83783
83810
|
}
|
|
83784
83811
|
render() {
|
|
83785
|
-
return (index$1.h(index$1.Host, { key: '
|
|
83812
|
+
return (index$1.h(index$1.Host, { key: '2c25091f8ad5a869a3b08bc0bc03e1bcf08cc664', status: this.status, class: { 'xv-progress-indicator-item': true } }, index$1.h("span", { key: '64133e48e0fd6a4d1d091c59edb1653c97e90d04', class: "line" }), index$1.h("span", { key: 'f4507a06fd22d249e2259471a681be88fad4b661', class: "icon" }, index$1.h("svg", { key: 'f526d78af529285268d51ca090da902c88ff551a', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 448 512" }, index$1.h("path", { key: '603962b23762409a6ae5112be69f53ea8663fe3b', 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" }))), index$1.h("p", { key: '01a76a5cb52cc95ae3101582bd82b1ffaf3ad406', class: "label" }, index$1.h("slot", { key: '63997241ef9a792ba2176fb4a2c297acffefd9af' }))));
|
|
83786
83813
|
}
|
|
83787
83814
|
get el() { return index$1.getElement(this); }
|
|
83788
83815
|
};
|
|
@@ -83815,12 +83842,12 @@ const XvRadio = class {
|
|
|
83815
83842
|
}
|
|
83816
83843
|
render() {
|
|
83817
83844
|
const message = index$2.resolveFieldMessage({ error: this.error, warning: this.warning, helper: this.helper });
|
|
83818
|
-
return (index$1.h("div", { key: '
|
|
83845
|
+
return (index$1.h("div", { key: '352b5da7c304aa01a6ef98e19e1a09a6ed1af382', class: {
|
|
83819
83846
|
'xv-radio': true,
|
|
83820
83847
|
'xv-radio--reverse': this.reverse,
|
|
83821
83848
|
'xv-radio--block': this.block,
|
|
83822
83849
|
[`xv-radio--size-${this.size}`]: !!this.size,
|
|
83823
|
-
} }, this.label && index$1.h("p", { key: '
|
|
83850
|
+
} }, this.label && index$1.h("p", { key: '375d8782fd7d9e95d164d61931540277a583c697', class: "xv-radio_label" }, this.label), index$1.h("label", { key: 'd3cc44a1818c0f27c9dcfa0365d97f6e92042356', class: { 'xv-radio_container': true, disabled: this.disabled } }, index$1.h("div", { key: '4f5d9ad677522c41478bfbffff38218663c98ba4', class: { 'xv-radio_input': true, 'xv-radio_input--error': !!this.error || this.error === '' } }, index$1.h("input", { key: 'c9976bb68fdddf396a46c8b471b039a2e682ac49', ref: el => (this.inputEl = el), type: "radio", name: this.name, value: this.value, checked: this.checked, readonly: this.readonly, disabled: this.disabled }), index$1.h("span", { key: '7aaacbde8c3e405307d8c2654d811fe664d9c68d', class: "xv-radio_input__mark" })), index$1.h("span", { key: 'ecd3b799c97edd53b866767dc34d17aee8aba1d8', class: "xv-radio_container__label" }, index$1.h("slot", { key: 'c595ac2e27e0fce401d61634eb48c1f43e622a07' }))), message && (index$1.h("span", { key: 'c80b27dda6e72b3ca4fb3f21ab24d8af446e6184', class: `xv-radio_msg xv-radio_msg--${message.level}` }, message.level !== 'helper' && (index$1.h("span", { key: 'b7a21929fc8217b5879ef0fef7d646e26d7dee8c', class: "xv-radio_msg__status", "aria-hidden": "true" }, message.level === 'error' ? '!' : '⚠')), message.text)), index$1.h("slot", { key: '75eea664c85019178ffd247495118295e49278c8', name: "info" })));
|
|
83824
83851
|
}
|
|
83825
83852
|
connectedCallback() {
|
|
83826
83853
|
var _a;
|
|
@@ -83904,7 +83931,7 @@ const XvSlider = class {
|
|
|
83904
83931
|
this.setValue(this.min);
|
|
83905
83932
|
}
|
|
83906
83933
|
render() {
|
|
83907
|
-
return (index$1.h(index$1.Host, { key: '
|
|
83934
|
+
return (index$1.h(index$1.Host, { key: '200f4f7d9c2e7dfa36d8143979894e61932c657d', class: { disabled: this.disabled, readonly: this.readonly } }, this.label && index$1.h("label", { key: 'e81559ca4f2f5d827d3567b8679cb940a9fda842', class: "label" }, this.label), index$1.h("div", { key: '0dddff9ad8f8aa90442745856a5314dd32662757', class: "control" }, index$1.h("span", { key: 'f1dc02b2a976a7e38f62b10fad82992ece14b724', class: "control_label" }, this.min), index$1.h("input", { key: '031187cbbe6e17b0ad7e575d1f24f36573a3a3aa', 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%` } }), index$1.h("span", { key: '048f938f5daf2fced575a0026f68cf1f299e10f5', class: "control_label" }, this.max), !this.notEditable && (index$1.h("input", { key: 'ef48b07ecc28d758804645193bb727c44d9973bb', 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 })))));
|
|
83908
83935
|
}
|
|
83909
83936
|
static get formAssociated() { return true; }
|
|
83910
83937
|
};
|
|
@@ -83919,7 +83946,7 @@ const XvTab = class {
|
|
|
83919
83946
|
this.loading = false;
|
|
83920
83947
|
}
|
|
83921
83948
|
render() {
|
|
83922
|
-
return (index$1.h(index$1.Host, { key: '
|
|
83949
|
+
return (index$1.h(index$1.Host, { key: '1a8f18bdd797041377ac7149c260f394a7b3ff35', disabled: this.disabled, name: this.name }, this.loading ? index$1.h("xv-loader-v2", { size: _vars.SIZE_VAR.LG }) : index$1.h("slot", null)));
|
|
83923
83950
|
}
|
|
83924
83951
|
};
|
|
83925
83952
|
XvTab.style = xvTabCss();
|
|
@@ -83959,7 +83986,7 @@ const XvTable = class {
|
|
|
83959
83986
|
.join(' ') + ' repeat(auto-fit, minmax(0, 1fr))');
|
|
83960
83987
|
}
|
|
83961
83988
|
render() {
|
|
83962
|
-
return (index$1.h(index$1.Host, { key: '
|
|
83989
|
+
return (index$1.h(index$1.Host, { key: '89518093792eab4b7bc6629ae39d92b9db652564', class: { batchVisible: !!this.selectedCount } }, index$1.h("slot", { key: '57bce4728b9ff77e6140111c35d350a76f86d6a9', name: "title" }, !!this.el.title && index$1.h("h2", { key: '0e104e088a2341e4ee3acf7242d942a3f169bca6', class: "xv-table-title" }, this.el.title)), index$1.h("slot", { key: 'f01a6221b423d54283462b9f1c57d15acfd9131c', name: "toolbar" }), index$1.h("div", { key: '8c112d75cc31e2158f1788818ab130b716b26083', class: "xv-table" }, index$1.h("div", { key: 'c30aed9d1ab1ca26b89dc8ce898b29250bafc398', class: "batch-actions" }, index$1.h(index$1.Fragment, { key: '6c2b636079e0fe12dba3b3c883409724445d5c6f' }, index$1.h("div", { key: 'ad1332b689d355f61d2080f326df028bc63dcc9f', class: "batch-actions_content" }, index$1.h("slot", { key: 'c48642a3f446a24429d90bee5cce8c48dcbedb56', name: "batch" })), index$1.h("p", { key: '78c0f7f6a2bd01528cbba664c88defa5099e8adc', class: "batch-actions_count" }, !!this.selectedCount && `${this.selectedCount} ${this.selectedCount === 1 ? 'Position ausgewählt' : 'Positionen ausgewählt'}`))), index$1.h("div", { key: 'f2d220bf2a36ecfe89a65e4b5978d4f483f6cd16', class: "xv-table_wrapper" }, index$1.h("slot", { key: 'd4eab97c9d70a3a54f4b0b9ade96cbf8eb0c4cfc' }), index$1.h("slot", { key: 'a11727ffc356f2cddd507ddd86ddfd89aff1a01c', name: "footer" })), !!this.loading && (index$1.h("div", { key: '97e917e04ae85473a2369679b79ae2b240bd9d86', class: "xv-table_loading" }, index$1.h("xv-loader-v2", { key: '05a30a5a8ce18eb82169695cdae6f13021b8823e', size: _vars.SIZE_VAR.LG }))))));
|
|
83963
83990
|
}
|
|
83964
83991
|
componentWillLoad() {
|
|
83965
83992
|
this.setColsSizeTemplate();
|
|
@@ -84000,7 +84027,7 @@ const XvTableCell = class {
|
|
|
84000
84027
|
}
|
|
84001
84028
|
;
|
|
84002
84029
|
render() {
|
|
84003
|
-
return (index$1.h(index$1.Host, { key: '
|
|
84030
|
+
return (index$1.h(index$1.Host, { key: 'bf0d30bf7805600864922bb12772fc9dc6e281a0' }, index$1.h("slot", { key: 'edb33059b923aa184fccc1eeeb5603990a04a338' })));
|
|
84004
84031
|
}
|
|
84005
84032
|
get el() { return index$1.getElement(this); }
|
|
84006
84033
|
};
|
|
@@ -84021,7 +84048,7 @@ const XvTableExpand = class {
|
|
|
84021
84048
|
};
|
|
84022
84049
|
}
|
|
84023
84050
|
render() {
|
|
84024
|
-
return (index$1.h(index$1.Host, { key: '
|
|
84051
|
+
return (index$1.h(index$1.Host, { key: '8d5ca83f3a13ebdfe3776847d4d678cea23df24f' }, index$1.h("button", { key: '112441278fd2dc0f12683a1637764bf6787f01e1', class: { 'expand-btn': true, open: this.open }, disabled: this.disabled, onClick: this.handleExpand }), index$1.h("slot", { key: 'bba6503d2569ed7d8749fe3bc0654ec6e68d4b41', name: XV_EXPANDABLE_KEY }), index$1.h("div", { key: 'c8f11f267123f9e565c765b3453714df3b412182', class: { expandableContent: true, open: this.open } }, index$1.h("slot", { key: '2b242e33ae15a1aef7ed12ff558898d8df9f8ed8' }))));
|
|
84025
84052
|
}
|
|
84026
84053
|
componentDidLoad() {
|
|
84027
84054
|
index$2.setAttr(this.el.parentElement, XV_EXPANDABLE_KEY, true);
|
|
@@ -84076,7 +84103,7 @@ const XvTableRow = class {
|
|
|
84076
84103
|
}
|
|
84077
84104
|
}
|
|
84078
84105
|
render() {
|
|
84079
|
-
return (index$1.h(index$1.Host, { key: '
|
|
84106
|
+
return (index$1.h(index$1.Host, { key: '74939d24d326ec727e761b3a93bb1c2469192d5e' }, this.variant !== undefined && (index$1.h("xv-table-v2-cell", { key: '5611f6c3c9e042fd7a3fc523aa915cf5b72cce6d', class: "cell-control" }, this.variant === 'checkbox' && (index$1.h("xv-checkbox-v2", { key: '653525c99a6f4730563d4642ade65d4a28874ade', 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' && (index$1.h("input", { key: 'b51e94848a48bf3f17628e5fb55b3139c703284e', type: "radio", name: this.name, checked: this.checked || this.partial, disabled: this.disabled, required: this.required, readonly: this.readonly })))), index$1.h("slot", { key: '8909a2d6c7944726833c33de80e65d836c99ab47' })));
|
|
84080
84107
|
}
|
|
84081
84108
|
componentWillLoad() {
|
|
84082
84109
|
this.setInitialAttrs();
|
|
@@ -84443,12 +84470,12 @@ const XvTagCombobox = class {
|
|
|
84443
84470
|
const ariaOwns = suggestionsVisible ? `${this.uid}-listbox` : undefined;
|
|
84444
84471
|
const activedesc = this.highlighted >= 0 ? this.optionId(this.highlighted) : undefined;
|
|
84445
84472
|
const message = index$2.resolveFieldMessage({ error: this.error, warning: this.warning, helper: this.helper });
|
|
84446
|
-
return (index$1.h(index$1.Host, { key: '
|
|
84473
|
+
return (index$1.h(index$1.Host, { key: '11578a46310ef235397da189b379b00bd56b09a7', class: "xv-combobox", part: "root", size: this.size }, this.label && index$1.h("label", { key: '7378ae807ca6f77f822bf4c1d8eff0e8889a32fb', class: "label" }, this.label), index$1.h("div", { key: '9b0149484e2ea1a947ff620078c29204090e4e4a', class: {
|
|
84447
84474
|
'control': true,
|
|
84448
84475
|
'control--disabled': this.disabled,
|
|
84449
84476
|
'control--error': !!this.error,
|
|
84450
84477
|
'control--readonly': !!this.readonly,
|
|
84451
|
-
}, onClick: () => this.blockClick() }, index$1.h("div", { key: '
|
|
84478
|
+
}, onClick: () => this.blockClick() }, index$1.h("div", { key: '8b5b17a6e7746fb42fdd94a1ca27782e3b2804c8', class: "control-chips", role: "list" }, this.selected.map((s, i) => (index$1.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))), index$1.h("input", { key: '42ac30b45601dd689e8ab31bde3b64ed07245d94', 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.loading && (index$1.h("span", { key: '87bf7e0e68ea5b70bc95d7ff767981055e1143ec', class: "control-loader", part: "loader", "aria-hidden": "true" }, index$1.h("xv-loader-v2", { key: 'b0695f76b1d7ce41733d3d7cb52c855eeb7defb2', size: "sm", variant: "horizontal" })))), message && (index$1.h("p", { key: '8ead7e229516649c3117af7eb4246d1d96785b0e', class: { message: true, [message.level]: true } }, message.text)), suggestionsVisible && (index$1.h("ul", { key: 'd128a4b07a12c25926f2f12953061880735c6c28', id: `${this.uid}-listbox`, class: "suggestions", role: "listbox", part: "listbox" }, this.filtered.map((opt, idx) => (index$1.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) }, index$1.h("div", { class: "suggestions-opt-content" }, opt.bg ? index$1.h("span", { class: "suggestions-opt-content--color", style: { background: opt.bg } }) : null, index$1.h("span", { class: "suggestions-opt-content--label" }, this.highlightLabel(opt.label).map((seg, i) => typeof seg === 'string' ? index$1.h("span", { key: i }, seg) : index$1.h("strong", { key: i }, seg.match)))))))))));
|
|
84452
84479
|
}
|
|
84453
84480
|
get host() { return index$1.getElement(this); }
|
|
84454
84481
|
static get watchers() { return {
|
|
@@ -84480,12 +84507,12 @@ const XvTag = class {
|
|
|
84480
84507
|
this.closeClick.emit(e);
|
|
84481
84508
|
}
|
|
84482
84509
|
render() {
|
|
84483
|
-
return (index$1.h(index$1.Host, { key: '
|
|
84510
|
+
return (index$1.h(index$1.Host, { key: '7c01d3c6412f263791c6673a8b34183ceae629be', style: { color: this.color, background: this.bg }, class: `xv-tag ${this.disabled ? 'disabled' : ''} ${this.size}` }, index$1.h("div", { key: '4459e0bd72600b47657e11258163b36924bb76b9', class: "xv-tag_content", part: "details-content" }, index$1.h("slot", { key: 'a87dd8afc441c72f2e50fc68794f65936a921a9f' })), this.closeable && (index$1.h("button", { key: '8bc2d66235dde2863b4c349084ea36f0a47b3065', onClick: this.closeHandler.bind(this), class: "xv-tag_close" }))));
|
|
84484
84511
|
}
|
|
84485
84512
|
};
|
|
84486
84513
|
XvTag.style = xvTagCss();
|
|
84487
84514
|
|
|
84488
|
-
const xvTextInputCss = () => `: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.clear{color:var(--icon-secondary, #515151);line-height:1}:host .control_input__icons .status-icon.clear:hover{color:var(--text-primary)}: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%}`;
|
|
84515
|
+
const xvTextInputCss = () => `: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-family:inherit;font-size:var(--fz-md, 14px);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.clear{color:var(--icon-secondary, #515151);line-height:1}:host .control_input__icons .status-icon.clear:hover{color:var(--text-primary)}: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%}`;
|
|
84489
84516
|
|
|
84490
84517
|
const XvTextInput = class {
|
|
84491
84518
|
constructor(hostRef) {
|
|
@@ -84520,13 +84547,13 @@ const XvTextInput = class {
|
|
|
84520
84547
|
}
|
|
84521
84548
|
render() {
|
|
84522
84549
|
const message = index$2.resolveFieldMessage({ error: this.error, warning: this.warning, helper: this.helper });
|
|
84523
|
-
return (index$1.h(index$1.Host, { key: '
|
|
84550
|
+
return (index$1.h(index$1.Host, { key: '6cb14bae4dd7d7a34995c458bad1fc91c8299794', class: { disabled: !!this.disabled } }, index$1.h("label", { key: '07a6d65d528b85a3050591ac77c47d4bbc43cd95', class: "control" }, this.label && index$1.h("span", { key: 'e774cf0cea836fe7c306ae5876e786bd658c0645', class: "control_label" }, this.label), index$1.h("div", { key: '4b86cb8e054bba7b6c23a0b3aad073d4dd1bae55', class: {
|
|
84524
84551
|
'control_input': true,
|
|
84525
84552
|
readonly: !!this.readonly,
|
|
84526
84553
|
[this.size]: true,
|
|
84527
84554
|
error: !!this.error,
|
|
84528
84555
|
warning: !!this.warning,
|
|
84529
|
-
} }, index$1.h("input", { key: '
|
|
84556
|
+
} }, index$1.h("input", { key: '6ee047f2525f76ffc892a3cc502f85663a5b33fd', 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 }), index$1.h("div", { key: '322c49e3ca050bde17379254cc393ee226ddad78', class: "control_input__icons" }, this.loading && index$1.h("xv-loader-v2", { key: '3bcab8389daf5719c0dd0ec5018c3ecc91121edb', size: _vars.SIZE_VAR.XS }), this.clearable && this.value && !this.loading && !this.disabled && !this.readonly && (index$1.h("button", { key: '0c491d7a60977b4985a09cb32ab1d7c3234541db', type: "button", class: "status-icon clear", "aria-label": "Clear", onClick: this.handleClear }, "\u00D7")), !!this.error ? (index$1.h("span", { class: "status-icon error", "aria-hidden": "true" }, "!")) : !!this.warning ? (index$1.h("span", { class: "status-icon warning", "aria-hidden": "true" }, "\u26A0")) : null, this.type === 'password' && (index$1.h("button", { key: '3e7b49c3ad26bdcf883f7426f85beb66e576a2c6', onClick: this.togglePassword, disabled: this.disabled, class: "status-icon" }, index$1.h("svg", { key: '30f7fe865ffa841b535858dbb93290c491b5c046', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 640 512", width: 16, height: 16 }, this.isPasswordVisible ? (index$1.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" })) : (index$1.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" })))))))), message && (index$1.h("p", { key: 'd383ea30a7dac49f60d2bbb86b6ae7adbc198e4f', class: { message: true, [message.level]: true } }, message.text))));
|
|
84530
84557
|
}
|
|
84531
84558
|
static get formAssociated() { return true; }
|
|
84532
84559
|
};
|
|
@@ -84564,12 +84591,12 @@ const XvTextarea = class {
|
|
|
84564
84591
|
}
|
|
84565
84592
|
render() {
|
|
84566
84593
|
const message = index$2.resolveFieldMessage({ error: this.error, warning: this.warning, helper: this.helper });
|
|
84567
|
-
return (index$1.h(index$1.Host, { key: '
|
|
84594
|
+
return (index$1.h(index$1.Host, { key: '536ccc1ce2d876e7c4f888eda24b4140e9a64dfe', class: { disabled: !!this.disabled } }, index$1.h("label", { key: '95db3223fb542dbad1f36e7db07d900ebb5ac43d', class: "control" }, (this.label || this.max) && (index$1.h("p", { key: '3880e3c2c82d5ae9ea157f8e5a94aec319f66475', class: "control_label" }, index$1.h("span", { key: '0faf32e5298b88d45d4485577c568ab89ad3f9ff' }, this.label, this.info && index$1.h("xv-tooltip-v2", { key: 'c13ccfc20eebd1580b059b0d9b9f52e10235e181', message: this.info })), this.max !== undefined && !this.counterHide && (index$1.h("span", { key: '12d63fa8aee000f00bd250cfe604f74fbf94147c', class: "control_label__count" }, this.value.length || 0, "/", this.max)))), index$1.h("div", { key: '2083623f79478ffcf4ec0956bef395dde07de0cb', class: {
|
|
84568
84595
|
'control_input': true,
|
|
84569
84596
|
readonly: !!this.readonly,
|
|
84570
84597
|
error: !!this.error,
|
|
84571
84598
|
warning: this.warning !== undefined,
|
|
84572
|
-
} }, index$1.h("textarea", { key: '
|
|
84599
|
+
} }, index$1.h("textarea", { key: '63baca39117ecf6bdc38ccf0515ef9e2fc44af3c', 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 }), index$1.h("div", { key: '3f5bcca5bd41012ebef909c283ed358ca2606e4a', class: "control_input__icons" }, this._renderIcon()))), message && (index$1.h("p", { key: 'f2ef14db3043f0c9234d339a33a7195729d13b32', class: { message: true, [message.level]: true } }, message.text))));
|
|
84573
84600
|
}
|
|
84574
84601
|
_renderIcon() {
|
|
84575
84602
|
if (this.loading)
|
|
@@ -84588,6 +84615,7 @@ XvTextarea.style = xvTextareaCss();
|
|
|
84588
84615
|
|
|
84589
84616
|
const xvTileCss = () => `@charset "UTF-8";.xv-tile--host{display:contents}.xv-tile--host[message]{display:inherit;position:relative}.xv-tile--host[message]:hover:before{content:attr(message);display:block;position:absolute;background-color:var(--background-inverse, #333);color:var(--text-on-color, #fff);padding:1em 3em;border-radius:5px;font-size:0.8em;left:0;bottom:100%;white-space:wrap;opacity:1;z-index:2}.xv-tile--host .xv-tile{min-height:64px;min-width:128px;border-radius:3px;border:1px solid var(--border-tile-02, #ACACAC);outline:2px solid transparent;background-color:var(--layer-02, #FFF);text-align:left;user-select:none;grid-template-columns:1fr auto;grid-template-areas:"content control" "footer footer" "expandable expandable";display:inline-grid;color:var(--text-primary, #333)}.xv-tile--host .xv-tile--variant-selectable,.xv-tile--host .xv-tile--variant-expandable,.xv-tile--host .xv-tile--variant-clickable{cursor:pointer;transition:250ms ease-in-out background-color}.xv-tile--host .xv-tile--variant-selectable:hover,.xv-tile--host .xv-tile--variant-expandable:hover,.xv-tile--host .xv-tile--variant-clickable:hover{border-color:var(--border-tile-01, #D1D1D1);background-color:var(--layer-hover-02, #F7F7F7)}.xv-tile--host .xv-tile--variant-selectable:active,.xv-tile--host .xv-tile--variant-expandable:active,.xv-tile--host .xv-tile--variant-clickable:active{background-color:var(--layer-active-02, #D1D1D1)}.xv-tile--host .xv-tile--variant-selectable:focus-within,.xv-tile--host .xv-tile--variant-expandable:focus-within,.xv-tile--host .xv-tile--variant-clickable:focus-within{outline-width:1px;outline-color:var(--focus)}.xv-tile--host .xv-tile--variant-selectable.selected,.xv-tile--host .xv-tile--variant-expandable.selected,.xv-tile--host .xv-tile--variant-clickable.selected{background-color:var(--layer-selected-02, #E3E3E3)}.xv-tile--host .xv-tile--variant-selectable.selected:hover,.xv-tile--host .xv-tile--variant-expandable.selected:hover,.xv-tile--host .xv-tile--variant-clickable.selected:hover{background-color:var(--layer-selected-hover-02, #DADADA)}.xv-tile--host .xv-tile--block{display:grid}.xv-tile--host .xv-tile--error{border-color:var(--support-error);outline:2px solid var(--support-error)}.xv-tile--host .xv-tile--disabled{border-color:var(--border-disabled, #D1D1D1);background-color:var(--layer-01, #F7F7F7);color:var(--text-disabled, rgba(19, 19, 19, 0.25));user-select:none;pointer-events:none;cursor:not-allowed}.xv-tile--host .xv-tile_content{grid-area:content;font-style:normal;font-weight:400;font-size:var(--fz-md, 14px);line-height:20px;letter-spacing:0.16px}.xv-tile--host .xv-tile_content>*{margin:0;padding:0}.xv-tile--host .xv-tile_content__title{font-size:20px;line-height:28px;letter-spacing:unset}.xv-tile--host .xv-tile_content:not(:empty){padding:var(--spacing-05, 16px)}.xv-tile--host .xv-tile_control{grid-area:control}.xv-tile--host .xv-tile_control:not(:empty){padding-block:var(--spacing-05, 16px);padding-inline-end:var(--spacing-05, 16px)}.xv-tile--host .xv-tile_control input[type=checkbox],.xv-tile--host .xv-tile_control input[type=radio]{-webkit-appearance:none;appearance:none;background-color:#fff;margin:0;width:16px;height:16px;position:relative;display:inline-flex;align-items:center;justify-content:center}.xv-tile--host .xv-tile_control input[type=checkbox]:focus,.xv-tile--host .xv-tile_control input[type=radio]:focus{outline:1.4px solid var(--focus)}.xv-tile--host .xv-tile_control input[type=checkbox]:before,.xv-tile--host .xv-tile_control input[type=checkbox]:after,.xv-tile--host .xv-tile_control input[type=radio]:before,.xv-tile--host .xv-tile_control input[type=radio]:after{display:inline-block;border-radius:inherit;transition:200ms ease-in-out border-color, 200ms ease-in-out background-color}.xv-tile--host .xv-tile_control input[type=checkbox]:before,.xv-tile--host .xv-tile_control input[type=radio]:before{content:"";width:inherit;height:inherit;background-color:#fff;border:1px solid var(--icon-primary, #131313);box-sizing:border-box}.xv-tile--host .xv-tile_control input[type=checkbox]:after,.xv-tile--host .xv-tile_control input[type=radio]:after{position:absolute}.xv-tile--host .xv-tile_control input[type=checkbox]:checked:before,.xv-tile--host .xv-tile_control input[type=radio]:checked:before{border-color:var(--background-brand, #97BF0D)}.xv-tile--host .xv-tile_control input[type=checkbox]:checked:after,.xv-tile--host .xv-tile_control input[type=radio]:checked:after{content:""}.xv-tile--host .xv-tile_control input[type=checkbox]{border-radius:2px}.xv-tile--host .xv-tile_control input[type=checkbox]:after{width:5px;height:8px;border:solid #fff;margin-bottom:2px;border-width:0 2px 2px 0;transform:rotate(45deg)}.xv-tile--host .xv-tile_control input[type=checkbox]:checked:not([readonly]):before{background-color:var(--background-brand, #97BF0D)}.xv-tile--host .xv-tile_control input[type=checkbox]:checked[readonly]:before{background-color:transparent}.xv-tile--host .xv-tile_control input[type=checkbox]:checked[readonly]:before,.xv-tile--host .xv-tile_control input[type=checkbox]:checked[readonly]:after{border-color:var(--text-disabled, rgba(18, 18, 18, 0.25))}.xv-tile--host .xv-tile_control input[type=radio]{border-radius:50%}.xv-tile--host .xv-tile_control input[type=radio]:after{width:50%;height:50%;background-color:var(--background-brand, #97BF0D)}.xv-tile--host .xv-tile_footer{grid-area:footer;display:flex;justify-content:flex-end}.xv-tile--host .xv-tile_footer__icon{pointer-events:none;background-color:transparent;outline:none;border:none;margin:0;padding:var(--spacing-05, 16px);font-size:16px;display:inline-flex;align-items:center;justify-content:center}.xv-tile--host .xv-tile_footer__icon:before{content:"";display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px}.xv-tile--host .xv-tile_footer__icon.icon--clickable:before{content:"➔"}.xv-tile--host .xv-tile_footer__icon.icon--expandable:before{width:12px;height:12px;border-style:solid;border-width:0 2px 2px 0;transform:rotate(45deg);transform-origin:center;transition:200ms ease-in-out transform}.xv-tile--host .xv-tile_footer__icon.icon--expandable.open:before{transform:rotate(-135deg)}.xv-tile--host .xv-tile_expandable{grid-area:expandable;display:none}.xv-tile--host .xv-tile_expandable.open{display:block}.xv-tile--host .xv-tile_expandable [slot=expandable]{margin:0;padding-inline:var(--spacing-05, 16px);padding-block-end:var(--spacing-05, 16px)}`;
|
|
84590
84617
|
|
|
84618
|
+
let tileUid = 0;
|
|
84591
84619
|
const XvTile = class {
|
|
84592
84620
|
constructor(hostRef) {
|
|
84593
84621
|
index$1.registerInstance(this, hostRef);
|
|
@@ -84595,6 +84623,7 @@ const XvTile = class {
|
|
|
84595
84623
|
this.variant = 'base';
|
|
84596
84624
|
this.checked = false;
|
|
84597
84625
|
this.readonly = false;
|
|
84626
|
+
this.inputId = `xv-tile-${tileUid++}`;
|
|
84598
84627
|
this.handleChange = (e) => {
|
|
84599
84628
|
const input = e.target;
|
|
84600
84629
|
this.checked = !!input.checked;
|
|
@@ -84620,7 +84649,7 @@ const XvTile = class {
|
|
|
84620
84649
|
this.checked = !this.checked;
|
|
84621
84650
|
}
|
|
84622
84651
|
render() {
|
|
84623
|
-
return (index$1.h(index$1.Host, { key: '
|
|
84652
|
+
return (index$1.h(index$1.Host, { key: 'e9093c3a902d972bdeb4c0696daf2f9e57cc1b09', class: "xv-tile--host" }, index$1.h("label", { key: '1ac7a225720930bee3cc9c58228f04c65cf6df41', htmlFor: this.variant === 'selectable' ? this.inputId : undefined, class: {
|
|
84624
84653
|
[this.el.className]: !!this.el.className,
|
|
84625
84654
|
'xv-tile': true,
|
|
84626
84655
|
[`xv-tile--variant-${this.variant}`]: !!this.variant,
|
|
@@ -84628,7 +84657,7 @@ const XvTile = class {
|
|
|
84628
84657
|
'xv-tile--disabled': !!this.disabled,
|
|
84629
84658
|
'selected': !!this.checked,
|
|
84630
84659
|
'xv-tile--error': !!this.error,
|
|
84631
|
-
} }, index$1.h("div", { key: '
|
|
84660
|
+
} }, index$1.h("div", { key: '46cdcfaea2dc4064c1af27591c638a08bd349003', class: "xv-tile_content" }, this.label && index$1.h("p", { key: 'eb8bbc489d077061f76d0e86c3623f4d70c0fc71', class: "xv-tile_content__title" }, this.label), index$1.h("slot", { key: '54fd4d5852efc46bbb4dc101e7484416e09f86c3' })), this.variant === 'selectable' && (index$1.h("div", { key: '49922cc57a1d57cb42d7f7712019630ce773e68c', class: "xv-tile_control" }, this.multiple ? (index$1.h("input", { type: "checkbox", id: this.inputId, disabled: this.disabled || this.readonly, readonly: this.readonly, onChange: this.handleChange, name: this.name, value: this.value, checked: this.checked })) : (index$1.h("input", { type: "radio", id: this.inputId, 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') && (index$1.h("div", { key: 'c4c10a986bbd4459719975c250005af5c35c0c79', class: "xv-tile_footer" }, index$1.h("button", { key: '52bfefd1ac2dad91a0defc37b2b671d87a704092', class: { 'xv-tile_footer__icon': true, [`icon--${this.variant}`]: true, open: this.checked } }))), index$1.h("div", { key: '61dab20478eea4fa550ab1f3f2145071eff15039', class: { 'xv-tile_expandable': true, open: this.checked } }, index$1.h("slot", { key: '71dfca2fa1961457aba36c2cd454e115ad08df8b', name: "expandable" })))));
|
|
84632
84661
|
}
|
|
84633
84662
|
get el() { return index$1.getElement(this); }
|
|
84634
84663
|
};
|
|
@@ -84660,7 +84689,7 @@ const XvToggle = class {
|
|
|
84660
84689
|
};
|
|
84661
84690
|
}
|
|
84662
84691
|
render() {
|
|
84663
|
-
return (index$1.h(index$1.Host, { key: '
|
|
84692
|
+
return (index$1.h(index$1.Host, { key: '2c6d229819eefa1dc06b2595bdfaa4d9f00de290', class: { 'xv-toggle': true, disabled: this.disabled, readonly: !!this.readonly, block: !!this.block } }, this.label && index$1.h("span", { key: 'fd331abe3596138b75d0b2a1823309219461c466', class: "label" }, this.label), index$1.h("label", { key: 'a0b0b056b1440f8f2e8a302516a2520787eee0a7', class: "control" }, index$1.h("slot", { key: '92aae28476ba7dcbafbd00f3067abb19fc44bdf7', name: "before" }), index$1.h("div", { key: 'd758aed805f5b18c8934db91fd491583f5a0431d', class: "control_input" }, index$1.h("input", { key: 'c183cd5a8e81b16ebddc74488ce4a58ace7a4eb9', type: "checkbox", readonly: this.readonly, name: this.name, value: this.value, checked: this.checked, disabled: this.disabled || this.readonly, onChange: this.onChange }), index$1.h("span", { key: '083d767e5d2f43e0e4a6e70d1edb8fa76a201696', class: "toggle" })), index$1.h("slot", { key: '52a88e5d2907e8b0413112ad90e14f671c33141a', name: "after" }))));
|
|
84664
84693
|
}
|
|
84665
84694
|
static get formAssociated() { return true; }
|
|
84666
84695
|
};
|
|
@@ -84737,7 +84766,7 @@ const XvToggleTip = class {
|
|
|
84737
84766
|
}
|
|
84738
84767
|
;
|
|
84739
84768
|
render() {
|
|
84740
|
-
return (index$1.h(index$1.Host, { key: '
|
|
84769
|
+
return (index$1.h(index$1.Host, { key: 'e1949065fb39e561a50af61931428b8535fc3067', class: "xv-toggle-tip" }, index$1.h("div", { key: 'fe5c151ae6a9a0371896cc2be0b4d60a8b71d1a8', 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) }, index$1.h("slot", { key: 'a0883cd12b33881f3d3357802eefdf5cdca6c608', name: "trigger" }, index$1.h("svg", { key: 'e92adae89b01be4c5e04133a2b0fb7aa128da5a5', class: "trigger_icon", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512", width: 16, height: 16 }, index$1.h("path", { key: '14296b66ce55586353edd4c5643cba5d79384e31', 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" })))), index$1.h("div", { key: '68adbefb075c11599a596fdd59ed3449cb3edf50', class: { popover: true, autoSize: !!this.autoSize }, role: "tooltip", tabindex: "-1", ref: (el) => (this.popoverEl = el) }, index$1.h("div", { key: '9ea149ed70cd031d8b00aac01f175c10e380da85', class: "popover-tip", part: "tip", "data-popper-arrow": "" }), index$1.h("div", { key: '07903fe4be8f32aa42a29883273ea027540f6f86', class: "popover-content" }, index$1.h("slot", { key: 'b8120ddb4e4dbecefb0a2282ebf54f30bbabaebb', name: "header" }), index$1.h("slot", { key: 'c00660e47cdd94b59fddd35e6c044aa82b680740', name: "body" }), index$1.h("slot", { key: '7e7386ad3bc43ad871e2f98c860f7bce454c972a', name: "footer" })))));
|
|
84741
84770
|
}
|
|
84742
84771
|
disconnectedCallback() {
|
|
84743
84772
|
this.destroyPopper();
|
|
@@ -84792,11 +84821,11 @@ const XvTooltip = class {
|
|
|
84792
84821
|
this.destroyTooltip();
|
|
84793
84822
|
}
|
|
84794
84823
|
render() {
|
|
84795
|
-
return (index$1.h(index$1.Host, { key: '
|
|
84824
|
+
return (index$1.h(index$1.Host, { key: '65eca77ca2810a4600bf15948f80499c83673c08', role: "tooltip", class: {
|
|
84796
84825
|
'xv-tooltip-wrapper': true,
|
|
84797
84826
|
[`xv-tooltip-wrapper__block`]: !!this.block,
|
|
84798
84827
|
[`xv-tooltip-wrapper__dashed`]: !!this.dashed,
|
|
84799
|
-
} }, index$1.h("slot", { key: '
|
|
84828
|
+
} }, index$1.h("slot", { key: '121c3093ec663646ca8e841188e00f2691990fca' }, index$1.h("svg", { key: 'd1dca1a701985179d17a0007e1eb00d954897255', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512", width: 16, height: 16 }, index$1.h("path", { key: '05131ece371fd1fd7be091742a8cf74c33f2abfe', 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" })))));
|
|
84800
84829
|
}
|
|
84801
84830
|
get el() { return index$1.getElement(this); }
|
|
84802
84831
|
};
|