@tet/tet-components 1.4.86-testing → 1.4.87-testing
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/index-3242ff3f.js +4 -4
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/tet-components.cjs.js +1 -1
- package/dist/cjs/tet-snicker-card.cjs.entry.js +43 -8
- package/dist/cjs/tet-tab-header.cjs.entry.js +44 -14
- package/dist/collection/components/advanced/cards/tet-snicker-card/tet-snicker-card.css +27 -3
- package/dist/collection/components/advanced/cards/tet-snicker-card/tet-snicker-card.js +83 -7
- package/dist/collection/components/basic/buttons/tet-tabs/tet-tab-header/tet-tab-header.css +23 -0
- package/dist/collection/components/basic/buttons/tet-tabs/tet-tab-header/tet-tab-header.js +101 -13
- package/dist/components/{p-7836f80d.js → p-67c39d1c.js} +49 -15
- package/dist/components/tet-assembler.js +1 -1
- package/dist/components/tet-cloud-configurator.js +1 -1
- package/dist/components/tet-compare-cards-tab.js +1 -1
- package/dist/components/tet-snicker-card.js +68 -26
- package/dist/components/tet-tab-header.js +1 -1
- package/dist/esm/index-aac31bd2.js +4 -4
- package/dist/esm/loader.js +1 -1
- package/dist/esm/tet-components.js +1 -1
- package/dist/esm/tet-snicker-card.entry.js +43 -8
- package/dist/esm/tet-tab-header.entry.js +44 -14
- package/dist/tet-components/p-c00ec93c.entry.js +1 -0
- package/dist/tet-components/p-ed9d2b9b.entry.js +1 -0
- package/dist/tet-components/tet-components.esm.js +1 -1
- package/dist/types/components/advanced/cards/tet-snicker-card/tet-snicker-card.d.ts +14 -0
- package/dist/types/components/basic/buttons/tet-tabs/tet-tab-header/tet-tab-header.d.ts +13 -1
- package/dist/types/components.d.ts +51 -6
- package/package.json +1 -1
- package/dist/tet-components/p-2e5c8d0d.entry.js +0 -1
- package/dist/tet-components/p-d235f460.entry.js +0 -1
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { r as registerInstance, c as createEvent, g as getElement, h, H as Host } from './index-aac31bd2.js';
|
|
2
2
|
import { a as debounce } from './debounce-33d1ec42.js';
|
|
3
3
|
|
|
4
|
-
const tetTabHeaderCss = ":host{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit;padding:0;margin:0}:host{--color-gray-light:#cdd2de;--color-ta070:#f5f6f8;--color-ta080:#e6e8ee;--color-ta100:#cdd2de;--color-ta200:#9ba5be;--color-ta300:#69789c;--color-ta500:#1e356a;--color-ta600:#051d59;--color-tc090:#d6e6fd;--color-tc100:#d1dffe;--color-tc300:#75a1fb;--color-tc500:#1a70f6;--color-tc600:#0060f5;--color-td500:#00F1F2;--color-td600:#01cbe0;--color-tf600:#f53b2a;--color-tg300:#2b3036;--color-tg400:#1d2128;--color-tg500:#12171e;--color-tg600:#01050c;--color-th500:#f5f5f5;--color-ti500:#869198;--color-ti600:#aeb7bc;--text-font:Gilroy, serif;--text-color-darker:var(--color-ta600);--text-color-dark:var(--color-ta500);--text-color-dark-theme:var(--color-th500);--icons-font:Tet Icons, serif}.icon.tet-search{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-search::before{content:\"\\e86e\"}.icon.tet-close-circled{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-close-circled::before{content:\"\\e85a\"}.icon.tet-close{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-close::before{content:\"\\e85b\"}.icon.tet-check-circled{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-check-circled::before{content:\"\\e86c\"}.icon.tet-check{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-check::before{content:\"\\e855\"}.icon.tet-chevron-up{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-chevron-up::before{content:\"\\e859\"}.icon.tet-chevron-down{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-chevron-down::before{content:\"\\e856\"}.icon.tet-clipboard{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-clipboard::before{content:\"\\e86a\"}.icon.tet-info{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-info::before{content:\"\\e81d\"}.icon.tet-done{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-done::before{content:\"\\e867\"}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Semibold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Semibold.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:700;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Bold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Bold.woff\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Inter-Regular.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Regular.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Inter-Medium.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Medium.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Inter-SemiBold.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-SemiBold.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Semibold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Semibold.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:700;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Bold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Bold.woff\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Inter-Regular.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Regular.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Inter-Medium.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Medium.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Inter-SemiBold.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-SemiBold.woff?v=3.19\") format(\"woff\")}:host{--font-family-fallback:Gilroy, Arial, sans-serif;--font-family-headline:Gilroy;--font-family-content:Inter, var(--font-family-fallback);font-family:var(--font-family-content)}:host{--tabs-container-border-color:var(--tc-border-quaternary);--tabs-container-flex-wrap:nowrap;--tabs-headers-text-color:var(--tc-text-primary);--tabs-headers-text-disabled-color:var(--tc-grey-50);--tabs-headers-active-border-color:var(--tc-icon-primary);--tabs-headers-hover-border-color:var(--tc-border-tertiary);--tabs-headers-focus-border-color:var(--tc-border-secondary);--tabs-headers-focus-outline-color:var(--tc-blue-40);--tabs-headers-segmended-item-font:500 1rem/1.5rem Inter, Gilroy, Arial, sans-serif;--tabs-headers-segmented-border-color:var(--tc-border-quaternary);--tabs-headers-segmented-background-color:var(--tc-layer-tertiary);--tabs-headers-segmented-active-background-color:var(--tc-layer-primary);--tabs-headers-segmented-active-box-shadow:var(--tc-elevation-two);--tabs-headers-item-padding:0.75rem 0.25rem;--tabs-headers-item-margin:0 0.25rem;--tabs-headers-segmented-item-padding:0.375rem 1.5rem;--tabs-headers-segmented-item-margin:0.25rem 0;--tabs-headers-square-base-rgb:255, 255, 255;--tabs-headers-pill-text-color:var(--tc-text-primary);--tabs-headers-pill-text-disabled-color:color-mix(in srgb, var(--tc-grey-80) 16%, transparent);--tabs-headers-pill-background-color:var(--tc-grey-20);--tabs-headers-pill-hover-background-color:var(--tc-grey-30);--tabs-headers-pill-pressed-background-color:color-mix(in srgb, var(--tc-grey-40) 80%, transparent);--tabs-headers-pill-active-background-color:var(--tc-yellow-40);--tabs-headers-pill-active-text-color:var(--tc-text-primary);--tabs-headers-pill-gradient-color:var(--tc-background-primary);--tabs-headers-pill-edge-padding:0rem;--tabs-headers-square-detached-background-color:var(--tc-grey-20);--tabs-headers-square-detached-hover-background-color:var(--tc-grey-30);--tabs-headers-square-detached-pressed-background-color:var(--tc-grey-40);--tabs-headers-square-detached-active-background-color:var(--tc-grey-110);--tabs-headers-square-detached-disabled-background-color:var(--tc-grey-20);--tabs-headers-square-detached-focus-outline-color:var(--tc-blue-40);--tabs-headers-square-detached-svg-filter:brightness(0) invert(0.298);--tabs-headers-square-detached-svg-hover-filter:brightness(0) invert(0.098);--tabs-headers-square-detached-svg-pressed-filter:brightness(0) invert(0.098);--tabs-headers-square-detached-svg-active-filter:brightness(0) invert(1);--tabs-headers-square-detached-svg-disabled-filter:brightness(0) invert(0.631);--tabs-headers-square-detached-gradient-color:var(--tc-background-primary);--tabs-headers-square-detached-button-max-width-default:7rem;max-width:100%}:host .dark{--tabs-container-border-color:var(--tc-border-quaternary-dark);--tabs-headers-text-color:var(--tc-text-primary-dark);--tabs-headers-text-disabled-color:var(--tc-grey-50-dark);--tabs-headers-active-border-color:var(--tc-icon-primary-dark);--tabs-headers-hover-border-color:var(--tc-border-tertiary-dark);--tabs-headers-focus-border-color:var(--tc-border-secondary-dark);--tabs-headers-focus-outline-color:var(--tc-blue-40-dark);--tabs-headers-segmented-border-color:var(--tc-border-quaternary-dark);--tabs-headers-segmented-background-color:var(--tc-layer-tertiary-dark);--tabs-headers-segmented-active-background-color:var(--tc-layer-primary-dark);--tabs-headers-segmented-active-box-shadow:var(--tc-elevation-two-dark);--tabs-headers-pill-text-color:var(--tc-grey-100-dark);--tabs-headers-pill-text-disabled-color:color-mix(in srgb, var(--tc-grey-80-dark) 30%, transparent);--tabs-headers-pill-background-color:var(--tc-brown-80-dark);--tabs-headers-pill-hover-background-color:var(--tc-brown-70-dark);--tabs-headers-pill-pressed-background-color:color-mix(in srgb, var(--tc-brown-60-dark) 80%, transparent);--tabs-headers-pill-active-background-color:var(--tc-yellow-40-dark);--tabs-headers-pill-active-text-color:var(--tc-text-primary);--tabs-headers-pill-gradient-color:var(--tc-background-primary-dark);--tabs-headers-square-detached-background-color:var(--tc-brown-80-dark);--tabs-headers-square-detached-hover-background-color:var(--tc-brown-70-dark);--tabs-headers-square-detached-pressed-background-color:var(--tc-brown-60-dark);--tabs-headers-square-detached-active-background-color:var(--tc-yellow-40-dark);--tabs-headers-square-detached-disabled-background-color:var(--tc-brown-80-dark);--tabs-headers-square-detached-focus-outline-color:var(--tc-blue-40-dark);--tabs-headers-square-detached-svg-filter:brightness(0) invert(0.859);--tabs-headers-square-detached-svg-hover-filter:brightness(0) invert(0.969);--tabs-headers-square-detached-svg-pressed-filter:brightness(0) invert(0.969);--tabs-headers-square-detached-svg-active-filter:brightness(0) invert(0.051);--tabs-headers-square-detached-svg-disabled-filter:brightness(0) invert(0.631);--tabs-headers-square-detached-gradient-color:var(--tc-background-primary-dark)}.tabs{--active-width:auto;--active-x-pos:0;--active-transition:none;position:relative;display:flex;flex-wrap:var(--tabs-container-flex-wrap);align-items:center;max-width:100%;padding:0.125rem 0;overflow-x:scroll;scrollbar-width:none;-webkit-user-select:none;user-select:none}.tabs ::slotted(img){margin:0;padding:0;height:1.3125rem}.tabs-line{display:flex;position:relative;max-width:100%;height:0.0625rem;background-color:var(--tabs-container-border-color);border:none;margin-top:-0.125rem}.tabs-line.no-underline{display:none}.tabs *{box-sizing:border-box}.tabs::-webkit-scrollbar{display:none}.tabs.right:not(.tabs--segmented){justify-content:flex-end}.tabs.center:not(.tabs--segmented){justify-content:center}.tabs ::slotted(*){display:flex;justify-content:center;align-items:center;border-bottom:0.125rem solid transparent;color:var(--tabs-headers-text-color);cursor:pointer;padding:var(--tabs-headers-item-padding) !important;margin:var(--tabs-headers-item-margin);transition:border-bottom-color 0.2s ease;white-space:nowrap;background-color:transparent;border-color:transparent;border-radius:0.125rem}.tabs ::slotted(:first-child){margin-left:0}.tabs ::slotted(:last-child){margin-right:0}.tabs ::slotted(:hover){border-bottom-color:var(--tabs-headers-hover-border-color);background-color:transparent}.tabs ::slotted(:focus){border-bottom-color:var(--tabs-headers-focus-border-color)}.tabs ::slotted(:focus-visible){outline:0.125rem solid var(--tc-blue-40);outline-offset:0rem;transition:outline 0s;outline-color:var(--tabs-headers-focus-outline-color);border-bottom-color:transparent;z-index:99}.tabs ::slotted(.disabled){border-bottom-color:transparent;color:var(--tabs-headers-text-disabled-color);outline:none;cursor:not-allowed}.tabs ::slotted(.active){border-bottom-color:var(--tabs-headers-active-border-color)}.tabs.pill .tabs-gradient,.tabs.square-detached .tabs-gradient{position:sticky;top:0.5rem;bottom:0.5rem;width:13.75rem;align-self:stretch;flex-shrink:0;opacity:0;z-index:20;pointer-events:none;transition:opacity 0.4s ease-out}.tabs.pill .tabs-gradient-left,.tabs.square-detached .tabs-gradient-left{left:-0.5rem;margin-right:-13.75rem;background:linear-gradient(270deg, rgba(255, 255, 255, 0) 0%, var(--tabs-gradient-color) 100%)}.tabs.pill .tabs-gradient-right,.tabs.square-detached .tabs-gradient-right{right:-0.5rem;margin-left:-13.75rem;background:linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, var(--tabs-gradient-color) 100%)}.tabs.pill.tabs--overflow-left .tabs-gradient-left,.tabs.square-detached.tabs--overflow-left .tabs-gradient-left{opacity:1}.tabs.pill.tabs--overflow-right .tabs-gradient-right,.tabs.square-detached.tabs--overflow-right .tabs-gradient-right{opacity:1}.tabs.square-detached{--tabs-gradient-color:var(--tabs-headers-square-detached-gradient-color);padding-top:0.5rem;padding-bottom:0.5rem;margin-top:-0.5rem;margin-bottom:-0.5rem}.tabs.square-detached ::slotted(*){display:flex;flex:1;min-width:var(--tabs-headers-square-detached-button-max-width, var(--tabs-headers-square-detached-button-max-width-default));max-width:var(--tabs-headers-square-detached-button-max-width, var(--tabs-headers-square-detached-button-max-width-default));border:none;box-sizing:border-box;background-color:var(--tabs-headers-square-detached-background-color);justify-content:center;align-items:center;flex-shrink:0;transition:background-color 0.2s ease;--square-detached-img-filter:var(--tabs-headers-square-detached-svg-filter)}.tabs.square-detached ::slotted(:hover){border-bottom-color:transparent;background-color:var(--tabs-headers-square-detached-hover-background-color);--square-detached-img-filter:var(--tabs-headers-square-detached-svg-hover-filter)}.tabs.square-detached ::slotted(:active){background-color:var(--tabs-headers-square-detached-pressed-background-color);--square-detached-img-filter:var(--tabs-headers-square-detached-svg-pressed-filter)}.tabs.square-detached ::slotted(:focus-visible){background-color:var(--tabs-headers-square-detached-active-background-color);border-bottom-color:transparent;outline:0.125rem solid var(--tc-blue-40);outline-offset:0.25rem;transition:outline 0s;outline-color:var(--tabs-headers-square-detached-focus-outline-color);z-index:99;--square-detached-img-filter:var(--tabs-headers-square-detached-svg-active-filter)}.tabs.square-detached ::slotted(.active){border-bottom-color:transparent;background-color:var(--tabs-headers-square-detached-active-background-color);--square-detached-img-filter:var(--tabs-headers-square-detached-svg-active-filter)}.tabs.square-detached ::slotted(.disabled){background-color:var(--tabs-headers-square-detached-disabled-background-color);border-bottom-color:transparent;--square-detached-img-filter:var(--tabs-headers-square-detached-svg-disabled-filter);cursor:not-allowed}.tabs.square-detached ::slotted(:first-child){margin-left:unset}.tabs.square-detached ::slotted(:last-child){margin-right:unset}.tabs.square-detached.mobile{--tabs-headers-item-margin:0 0.5rem}.tabs.square-detached.mobile ::slotted(*){--square-detached-logo-max-w:3.9375rem;--square-detached-logo-max-h:2.8125rem;height:5.125rem;border-radius:0.568rem;padding:0.568rem 1.419rem}.tabs.square-detached.tablet{--tabs-headers-item-margin:0 0.75rem}.tabs.square-detached.tablet ::slotted(*){--square-detached-logo-max-w:5.1875rem;--square-detached-logo-max-h:3.75rem;--tabs-headers-square-detached-button-max-width-default:9.1875rem;height:6.75rem;border-radius:0.75rem;padding:0.75rem 1.875rem}.tabs.square-detached.web{--tabs-headers-item-margin:0 0.75rem}.tabs.square-detached.web ::slotted(*){--square-detached-logo-max-w:6.875rem;--square-detached-logo-max-h:5rem;--tabs-headers-square-detached-button-max-width-default:17.25rem;min-width:12.25rem !important;height:9rem;border-radius:1rem;padding:1rem 2.5rem}.tabs.blue ::slotted(:hover){--tabs-headers-hover-border-color:rgb(113, 172, 244)}.tabs.blue ::slotted(:focus){--tabs-headers-focus-border-color:rgb(113, 172, 244)}.tabs.blue ::slotted(.active){--tabs-headers-active-border-color:rgb(0, 96, 245)}.tabs.pill{--tabs-gradient-color:var(--tabs-headers-pill-gradient-color);--tabs-edge-padding:var(--tabs-headers-pill-edge-padding);padding-top:0.5rem;padding-bottom:0.5rem;margin-top:-0.5rem;margin-bottom:-0.5rem;padding-inline:calc(var(--tabs-headers-pill-edge-padding) + 0.5rem);margin-inline:-0.5rem}.tabs.pill ::slotted(*){--icon-size:1rem;gap:0.25rem;border-radius:5.5rem;border-bottom:none;transition:all 0.2s ease-in-out;align-items:center;background-color:var(--tabs-headers-pill-background-color);color:var(--tabs-headers-pill-text-color);box-sizing:border-box}.tabs.pill.web ::slotted(*){--tabs-headers-item-padding:0.375rem 1.5rem;font:500 1rem/1.5rem Inter, Gilroy, Arial, sans-serif, Gilroy, Arial, sans-serif;letter-spacing:-0.00625rem;min-width:5.625rem;flex-shrink:0;height:2.25rem}.tabs.pill.web ::slotted(:has(tet-icon)){--tabs-headers-item-padding:0.375rem 1rem 0.375rem 0.875rem}.tabs.pill.mobile ::slotted(*){--tabs-headers-item-padding:0.375rem 1rem;font:500 0.875rem/1.25rem Inter, Gilroy, Arial, sans-serif, Gilroy, Arial, sans-serif;letter-spacing:-0.003125rem;min-width:4.3125rem;flex-shrink:0;height:2rem}.tabs.pill.mobile ::slotted(:has(tet-icon)){--tabs-headers-item-padding:0.375rem 0.75rem 0.375rem 0.5rem}.tabs.pill ::slotted(:hover){border-bottom-color:transparent;background-color:var(--tabs-headers-pill-hover-background-color)}.tabs.pill ::slotted(:active){background-color:var(--tabs-headers-pill-pressed-background-color)}.tabs.pill ::slotted(:focus){border-bottom-color:transparent}.tabs.pill ::slotted(:focus-visible){outline:0.125rem solid var(--tc-blue-40);outline-offset:0.25rem;transition:outline 0s;outline-color:var(--tabs-headers-focus-outline-color);border-bottom-color:transparent}.tabs.pill ::slotted(.active){border-bottom-color:transparent;background-color:var(--tabs-headers-pill-active-background-color);color:var(--tabs-headers-pill-active-text-color)}.tabs.pill ::slotted(.active:active){background-color:var(--tabs-headers-pill-pressed-background-color)}.tabs.pill ::slotted(.disabled){background-color:var(--tabs-headers-pill-background-color);color:var(--tabs-headers-pill-text-disabled-color);cursor:not-allowed}.tabs.pill ::slotted(:first-child){margin-left:0 !important}.tabs.pill ::slotted(:last-child){margin-right:0 !important}.tabs--segmented{display:flex;border:0.0625rem solid var(--tabs-headers-segmented-border-color);border-radius:1.5rem;background-color:var(--tabs-headers-segmented-background-color);padding:0 0.25rem;box-sizing:border-box;overflow-x:scroll}.tabs--segmented .web{padding:0.25rem}.tabs--segmented ::slotted(:focus-visible){outline:0.125rem solid var(--tc-blue-40);outline-offset:-0.125rem;transition:outline 0s;outline-color:var(--tabs-headers-focus-outline-color)}.tabs--segmented.dark-gray{--tabs-headers-text-color:rgb(255, 255, 255);--tabs-headers-segmented-border-color:rgb(67, 75, 86);--tabs-headers-segmented-background-color:rgb(35, 40, 46);--tabs-headers-segmented-active-background-color:rgb(67, 75, 86);--tabs-headers-segmented-active-box-shadow:0 0 0.0625rem 0 rgba(10, 11, 13, 0.08),\n 0 0.1875rem 0.25rem 0 rgba(10, 11, 13, 0.12);--icon-color:rgb(255, 255, 255)}.tabs--segmented.dark-gray ::slotted(:hover),.tabs--segmented.dark-gray ::slotted(:focus),.tabs--segmented.dark-gray ::slotted(.active){color:rgb(255, 255, 255)}.tabs--segmented.dark-gray ::slotted(.disabled){color:var(--tabs-headers-text-disabled-color);cursor:not-allowed}.tabs--segmented::before{content:\"\";position:absolute;top:0.25rem;bottom:0.25rem;left:0;z-index:0;border-radius:1.563rem;width:var(--active-width);transform:translateX(var(--active-x-pos));transition:var(--active-transition);background:var(--tabs-headers-segmented-active-background-color);box-shadow:var(--tabs-headers-segmented-active-box-shadow)}.tabs--segmented ::slotted(*){font:var(--tabs-headers-segmended-item-font);line-height:1.5rem;z-index:1;position:relative;border:none;padding:var(--tabs-headers-segmented-item-padding) !important;margin:var(--tabs-headers-segmented-item-margin) !important;border-radius:1.563rem;display:flex;flex:1;justify-content:center}.tabs--segmented.mobile ::slotted(*){font:500 0.875rem/1.25rem Inter, Gilroy, Arial, sans-serif, Gilroy, Arial, sans-serif;letter-spacing:-0.003125rem;font-weight:500;padding:0.25rem 1.5rem !important;margin:0.188rem 0 !important;line-height:1.25rem}.tabs--segmented.square{--tabs-headers-segmented-background-color:rgba(var(--tabs-headers-square-base-rgb), 0.16);--tabs-headers-segmented-border-color:transparent;height:4.75rem;border-radius:0.375rem;padding:0}.tabs--segmented.square::before{--tabs-headers-segmented-active-box-shadow:none;position:absolute;top:0;bottom:0;left:-0.0625rem;border-radius:0}.tabs--segmented.square ::slotted(*){--tabs-headers-segmented-item-padding:0;--tabs-headers-segmented-item-margin:0;border-radius:0;height:100%;align-items:center}.tabs--segmented.square ::slotted(*)::after{content:\"\";background-color:rgba(var(--tabs-headers-square-base-rgb), 0.2);position:absolute;top:0.375rem;bottom:0.375rem;right:0;width:0.0625rem}.tabs--segmented.square ::slotted(:hover){background-color:rgba(var(--tabs-headers-square-base-rgb), 0.24)}.tabs--segmented.square ::slotted(:first-child){border-radius:0.3125rem 0 0 0.3125rem}.tabs--segmented.square ::slotted(:last-child){border-radius:0 0.3125rem 0.3125rem 0}.tabs--segmented.square ::slotted(:focus-visible){outline:0.125rem solid var(--tc-blue-40);outline-offset:-0.125rem;transition:outline 0s;outline-color:var(--tabs-headers-focus-outline-color)}.tabs--segmented.square ::slotted(:focus-visible)::after{display:none}.tabs--segmented.square ::slotted(.active)::after,.tabs--segmented.square ::slotted(:last-child)::after{display:none}.tabs--segmented.netflix{height:2.75rem;gap:0.5rem;overflow-y:hidden}.tabs--segmented.netflix ::slotted(*){flex-direction:row-reverse;align-items:center;justify-content:center;gap:0.5rem}.tabs--segmented.netflix ::slotted(:focus-visible){outline:0.125rem solid var(--tc-blue-40);outline-offset:-0.0625rem;transition:outline 0s;outline-color:var(--tabs-headers-focus-outline-color);border-radius:1.563rem}.tabs ::slotted(.no-underline){border-bottom:none}";
|
|
4
|
+
const tetTabHeaderCss = ":host{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit;padding:0;margin:0}:host{--color-gray-light:#cdd2de;--color-ta070:#f5f6f8;--color-ta080:#e6e8ee;--color-ta100:#cdd2de;--color-ta200:#9ba5be;--color-ta300:#69789c;--color-ta500:#1e356a;--color-ta600:#051d59;--color-tc090:#d6e6fd;--color-tc100:#d1dffe;--color-tc300:#75a1fb;--color-tc500:#1a70f6;--color-tc600:#0060f5;--color-td500:#00F1F2;--color-td600:#01cbe0;--color-tf600:#f53b2a;--color-tg300:#2b3036;--color-tg400:#1d2128;--color-tg500:#12171e;--color-tg600:#01050c;--color-th500:#f5f5f5;--color-ti500:#869198;--color-ti600:#aeb7bc;--text-font:Gilroy, serif;--text-color-darker:var(--color-ta600);--text-color-dark:var(--color-ta500);--text-color-dark-theme:var(--color-th500);--icons-font:Tet Icons, serif}.icon.tet-search{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-search::before{content:\"\\e86e\"}.icon.tet-close-circled{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-close-circled::before{content:\"\\e85a\"}.icon.tet-close{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-close::before{content:\"\\e85b\"}.icon.tet-check-circled{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-check-circled::before{content:\"\\e86c\"}.icon.tet-check{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-check::before{content:\"\\e855\"}.icon.tet-chevron-up{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-chevron-up::before{content:\"\\e859\"}.icon.tet-chevron-down{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-chevron-down::before{content:\"\\e856\"}.icon.tet-clipboard{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-clipboard::before{content:\"\\e86a\"}.icon.tet-info{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-info::before{content:\"\\e81d\"}.icon.tet-done{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-done::before{content:\"\\e867\"}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Semibold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Semibold.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:700;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Bold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Bold.woff\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Inter-Regular.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Regular.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Inter-Medium.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Medium.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Inter-SemiBold.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-SemiBold.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Medium.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Medium.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Semibold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Semibold.woff\") format(\"woff\")}@font-face{font-family:\"Gilroy\";font-style:normal;font-weight:700;font-display:swap;src:url(\"assets/fonts/Gilroy-W05-Bold.woff2\") format(\"woff2\"), url(\"assets/fonts/Gilroy-W05-Bold.woff\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:400;font-display:swap;src:url(\"assets/fonts/Inter-Regular.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Regular.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:500;font-display:swap;src:url(\"assets/fonts/Inter-Medium.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-Medium.woff?v=3.19\") format(\"woff\")}@font-face{font-family:\"Inter\";font-style:normal;font-weight:600;font-display:swap;src:url(\"assets/fonts/Inter-SemiBold.woff2?v=3.19\") format(\"woff2\"), url(\"assets/fonts/Inter-SemiBold.woff?v=3.19\") format(\"woff\")}:host{--font-family-fallback:Gilroy, Arial, sans-serif;--font-family-headline:Gilroy;--font-family-content:Inter, var(--font-family-fallback);font-family:var(--font-family-content)}:host{--tabs-container-border-color:var(--tc-border-quaternary);--tabs-container-flex-wrap:nowrap;--tabs-headers-text-color:var(--tc-text-primary);--tabs-headers-text-disabled-color:var(--tc-grey-50);--tabs-headers-active-border-color:var(--tc-icon-primary);--tabs-headers-hover-border-color:var(--tc-border-tertiary);--tabs-headers-focus-border-color:var(--tc-border-secondary);--tabs-headers-focus-outline-color:var(--tc-blue-40);--tabs-headers-segmended-item-font:500 1rem/1.5rem Inter, Gilroy, Arial, sans-serif;--tabs-headers-segmented-border-color:var(--tc-border-quaternary);--tabs-headers-segmented-background-color:var(--tc-layer-tertiary);--tabs-headers-segmented-active-background-color:var(--tc-layer-primary);--tabs-headers-segmented-active-box-shadow:var(--tc-elevation-two);--tabs-headers-item-padding:0.75rem 0.25rem;--tabs-headers-item-margin:0 0.25rem;--tabs-headers-segmented-item-padding:0.375rem 1.5rem;--tabs-headers-segmented-item-margin:0.25rem 0;--tabs-headers-square-base-rgb:255, 255, 255;--tabs-headers-pill-text-color:var(--tc-text-primary);--tabs-headers-pill-text-disabled-color:color-mix(in srgb, var(--tc-grey-80) 16%, transparent);--tabs-headers-pill-background-color:var(--tc-grey-20);--tabs-headers-pill-hover-background-color:var(--tc-grey-30);--tabs-headers-pill-pressed-background-color:color-mix(in srgb, var(--tc-grey-40) 80%, transparent);--tabs-headers-pill-active-background-color:var(--tc-yellow-40);--tabs-headers-pill-active-text-color:var(--tc-text-primary);--tabs-headers-pill-gradient-color:var(--tc-background-primary);--tabs-headers-pill-edge-padding:0rem;--tabs-headers-square-detached-background-color:var(--tc-grey-20);--tabs-headers-square-detached-hover-background-color:var(--tc-grey-30);--tabs-headers-square-detached-pressed-background-color:var(--tc-grey-40);--tabs-headers-square-detached-active-background-color:var(--tc-grey-110);--tabs-headers-square-detached-disabled-background-color:var(--tc-grey-20);--tabs-headers-square-detached-focus-outline-color:var(--tc-blue-40);--tabs-headers-square-detached-svg-filter:brightness(0) invert(0.298);--tabs-headers-square-detached-svg-hover-filter:brightness(0) invert(0.098);--tabs-headers-square-detached-svg-pressed-filter:brightness(0) invert(0.098);--tabs-headers-square-detached-svg-active-filter:brightness(0) invert(1);--tabs-headers-square-detached-svg-disabled-filter:brightness(0) invert(0.631);--tabs-headers-square-detached-gradient-color:var(--tc-background-primary);--tabs-headers-square-detached-button-max-width-default:7rem;max-width:100%}:host .dark{--tabs-container-border-color:var(--tc-border-quaternary-dark);--tabs-headers-text-color:var(--tc-text-primary-dark);--tabs-headers-text-disabled-color:var(--tc-grey-50-dark);--tabs-headers-active-border-color:var(--tc-icon-primary-dark);--tabs-headers-hover-border-color:var(--tc-border-tertiary-dark);--tabs-headers-focus-border-color:var(--tc-border-secondary-dark);--tabs-headers-focus-outline-color:var(--tc-blue-40-dark);--tabs-headers-segmented-border-color:var(--tc-border-quaternary-dark);--tabs-headers-segmented-background-color:var(--tc-layer-tertiary-dark);--tabs-headers-segmented-active-background-color:var(--tc-layer-primary-dark);--tabs-headers-segmented-active-box-shadow:var(--tc-elevation-two-dark);--tabs-headers-pill-text-color:var(--tc-grey-100-dark);--tabs-headers-pill-text-disabled-color:color-mix(in srgb, var(--tc-grey-80-dark) 30%, transparent);--tabs-headers-pill-background-color:var(--tc-brown-80-dark);--tabs-headers-pill-hover-background-color:var(--tc-brown-70-dark);--tabs-headers-pill-pressed-background-color:color-mix(in srgb, var(--tc-brown-60-dark) 80%, transparent);--tabs-headers-pill-active-background-color:var(--tc-yellow-40-dark);--tabs-headers-pill-active-text-color:var(--tc-text-primary);--tabs-headers-pill-gradient-color:var(--tc-background-primary-dark);--tabs-headers-square-detached-background-color:var(--tc-brown-80-dark);--tabs-headers-square-detached-hover-background-color:var(--tc-brown-70-dark);--tabs-headers-square-detached-pressed-background-color:var(--tc-brown-60-dark);--tabs-headers-square-detached-active-background-color:var(--tc-yellow-40-dark);--tabs-headers-square-detached-disabled-background-color:var(--tc-brown-80-dark);--tabs-headers-square-detached-focus-outline-color:var(--tc-blue-40-dark);--tabs-headers-square-detached-svg-filter:brightness(0) invert(0.859);--tabs-headers-square-detached-svg-hover-filter:brightness(0) invert(0.969);--tabs-headers-square-detached-svg-pressed-filter:brightness(0) invert(0.969);--tabs-headers-square-detached-svg-active-filter:brightness(0) invert(0.051);--tabs-headers-square-detached-svg-disabled-filter:brightness(0) invert(0.631);--tabs-headers-square-detached-gradient-color:var(--tc-background-primary-dark)}.tabs{--active-width:auto;--active-x-pos:0;--active-transition:none;position:relative;display:flex;flex-wrap:var(--tabs-container-flex-wrap);align-items:center;max-width:100%;padding:0.125rem 0;overflow-x:scroll;scrollbar-width:none;-webkit-user-select:none;user-select:none}.tabs ::slotted(img){margin:0;padding:0;height:1.3125rem}.tabs-line{display:flex;position:relative;max-width:100%;height:0.0625rem;background-color:var(--tabs-container-border-color);border:none;margin-top:-0.125rem}.tabs-line.no-underline{display:none}.tabs *{box-sizing:border-box}.tabs::-webkit-scrollbar{display:none}.tabs.right:not(.tabs--segmented){justify-content:flex-end}.tabs.center:not(.tabs--segmented){justify-content:center}.tabs ::slotted(*){display:flex;justify-content:center;align-items:center;border-bottom:0.125rem solid transparent;color:var(--tabs-headers-text-color);cursor:pointer;padding:var(--tabs-headers-item-padding) !important;margin:var(--tabs-headers-item-margin);transition:border-bottom-color 0.2s ease;white-space:nowrap;background-color:transparent;border-color:transparent;border-radius:0.125rem}.tabs ::slotted(:first-child){margin-left:0}.tabs ::slotted(:last-child){margin-right:0}.tabs ::slotted(:hover){border-bottom-color:var(--tabs-headers-hover-border-color);background-color:transparent}.tabs ::slotted(:focus){border-bottom-color:var(--tabs-headers-focus-border-color)}.tabs ::slotted(:focus-visible){outline:0.125rem solid var(--tc-blue-40);outline-offset:0rem;transition:outline 0s;outline-color:var(--tabs-headers-focus-outline-color);border-bottom-color:transparent;z-index:99}.tabs ::slotted(.disabled){border-bottom-color:transparent;color:var(--tabs-headers-text-disabled-color);outline:none;cursor:not-allowed}.tabs ::slotted(.active){border-bottom-color:var(--tabs-headers-active-border-color)}.tabs.pill .tabs-gradient,.tabs.square-detached .tabs-gradient{position:sticky;top:0.5rem;bottom:0.5rem;width:13.75rem;align-self:stretch;flex-shrink:0;opacity:0;z-index:20;pointer-events:none;transition:opacity 0.4s ease-out}.tabs.pill .tabs-gradient-left,.tabs.square-detached .tabs-gradient-left{left:-0.5rem;margin-right:-13.75rem;background:linear-gradient(270deg, rgba(255, 255, 255, 0) 0%, var(--tabs-gradient-color) 100%)}.tabs.pill .tabs-gradient-right,.tabs.square-detached .tabs-gradient-right{right:-0.5rem;margin-left:-13.75rem;background:linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, var(--tabs-gradient-color) 100%)}.tabs.pill.tabs--overflow-left .tabs-gradient-left,.tabs.square-detached.tabs--overflow-left .tabs-gradient-left{opacity:1}.tabs.pill.tabs--overflow-right .tabs-gradient-right,.tabs.square-detached.tabs--overflow-right .tabs-gradient-right{opacity:1}.tabs.square-detached{--tabs-gradient-color:var(--tabs-headers-square-detached-gradient-color);padding-top:0.5rem;padding-bottom:0.5rem;margin-top:-0.5rem;margin-bottom:-0.5rem}.tabs.square-detached ::slotted(*){display:flex;flex:1;min-width:var(--tabs-headers-square-detached-button-max-width, var(--tabs-headers-square-detached-button-max-width-default));max-width:var(--tabs-headers-square-detached-button-max-width, var(--tabs-headers-square-detached-button-max-width-default));border:none;box-sizing:border-box;background-color:var(--tabs-headers-square-detached-background-color);justify-content:center;align-items:center;flex-shrink:0;transition:background-color 0.2s ease;--square-detached-img-filter:var(--tabs-headers-square-detached-svg-filter)}.tabs.square-detached ::slotted(:hover){border-bottom-color:transparent;background-color:var(--tabs-headers-square-detached-hover-background-color);--square-detached-img-filter:var(--tabs-headers-square-detached-svg-hover-filter)}.tabs.square-detached ::slotted(:active){background-color:var(--tabs-headers-square-detached-pressed-background-color);--square-detached-img-filter:var(--tabs-headers-square-detached-svg-pressed-filter)}.tabs.square-detached ::slotted(:focus-visible){background-color:var(--tabs-headers-square-detached-active-background-color);border-bottom-color:transparent;outline:0.125rem solid var(--tc-blue-40);outline-offset:0.25rem;transition:outline 0s;outline-color:var(--tabs-headers-square-detached-focus-outline-color);z-index:99;--square-detached-img-filter:var(--tabs-headers-square-detached-svg-active-filter)}.tabs.square-detached ::slotted(.active){border-bottom-color:transparent;background-color:var(--tabs-headers-square-detached-active-background-color);--square-detached-img-filter:var(--tabs-headers-square-detached-svg-active-filter)}.tabs.square-detached ::slotted(.disabled){background-color:var(--tabs-headers-square-detached-disabled-background-color);border-bottom-color:transparent;--square-detached-img-filter:var(--tabs-headers-square-detached-svg-disabled-filter);cursor:not-allowed}.tabs.square-detached ::slotted(:first-child){margin-left:unset}.tabs.square-detached ::slotted(:last-child){margin-right:unset}.tabs.square-detached.mobile{--tabs-headers-item-margin:0 0.5rem}.tabs.square-detached.mobile ::slotted(*){--square-detached-logo-max-w:3.9375rem;--square-detached-logo-max-h:2.8125rem;height:5.125rem;border-radius:0.568rem;padding:0.568rem 1.419rem}.tabs.square-detached.tablet{--tabs-headers-item-margin:0 0.75rem}.tabs.square-detached.tablet ::slotted(*){--square-detached-logo-max-w:5.1875rem;--square-detached-logo-max-h:3.75rem;--tabs-headers-square-detached-button-max-width-default:9.1875rem;height:6.75rem;border-radius:0.75rem;padding:0.75rem 1.875rem}.tabs.square-detached.web{--tabs-headers-item-margin:0 0.75rem}.tabs.square-detached.web ::slotted(*){--square-detached-logo-max-w:6.875rem;--square-detached-logo-max-h:5rem;--tabs-headers-square-detached-button-max-width-default:17.25rem;min-width:12.25rem !important;height:9rem;border-radius:1rem;padding:1rem 2.5rem}.tabs.blue ::slotted(:hover){--tabs-headers-hover-border-color:rgb(113, 172, 244)}.tabs.blue ::slotted(:focus){--tabs-headers-focus-border-color:rgb(113, 172, 244)}.tabs.blue ::slotted(.active){--tabs-headers-active-border-color:rgb(0, 96, 245)}.tabs.pill{--tabs-gradient-color:var(--tabs-headers-pill-gradient-color);--tabs-edge-padding:var(--tabs-headers-pill-edge-padding);padding-top:0.5rem;padding-bottom:0.5rem;margin-top:-0.5rem;margin-bottom:-0.5rem;padding-inline:calc(var(--tabs-headers-pill-edge-padding) + 0.5rem);margin-inline:-0.5rem}.tabs.pill ::slotted(*){--icon-size:1rem;gap:0.25rem;border-radius:5.5rem;border-bottom:none;transition:all 0.2s ease-in-out;align-items:center;background-color:var(--tabs-headers-pill-background-color);color:var(--tabs-headers-pill-text-color);box-sizing:border-box}.tabs.pill.web ::slotted(*){--tabs-headers-item-padding:0.375rem 1.5rem;font:500 1rem/1.5rem Inter, Gilroy, Arial, sans-serif, Gilroy, Arial, sans-serif;letter-spacing:-0.00625rem;min-width:5.625rem;flex-shrink:0;height:2.25rem}.tabs.pill.web ::slotted(:has(tet-icon)){--tabs-headers-item-padding:0.375rem 1rem 0.375rem 0.875rem}.tabs.pill.mobile ::slotted(*){--tabs-headers-item-padding:0.375rem 1rem;font:500 0.875rem/1.25rem Inter, Gilroy, Arial, sans-serif, Gilroy, Arial, sans-serif;letter-spacing:-0.003125rem;min-width:4.3125rem;flex-shrink:0;height:2rem}.tabs.pill.mobile ::slotted(:has(tet-icon)){--tabs-headers-item-padding:0.375rem 0.75rem 0.375rem 0.5rem}.tabs.pill ::slotted(:hover){border-bottom-color:transparent;background-color:var(--tabs-headers-pill-hover-background-color)}.tabs.pill ::slotted(:active){background-color:var(--tabs-headers-pill-pressed-background-color)}.tabs.pill ::slotted(:focus){border-bottom-color:transparent}.tabs.pill ::slotted(:focus-visible){outline:0.125rem solid var(--tc-blue-40);outline-offset:0.25rem;transition:outline 0s;outline-color:var(--tabs-headers-focus-outline-color);border-bottom-color:transparent}.tabs.pill ::slotted(.active){border-bottom-color:transparent;background-color:var(--tabs-headers-pill-active-background-color);color:var(--tabs-headers-pill-active-text-color)}.tabs.pill ::slotted(.active:active){background-color:var(--tabs-headers-pill-pressed-background-color)}.tabs.pill ::slotted(.disabled){background-color:var(--tabs-headers-pill-background-color);color:var(--tabs-headers-pill-text-disabled-color);cursor:not-allowed}.tabs.pill ::slotted(:first-child){margin-left:0 !important}.tabs.pill ::slotted(:last-child){margin-right:0 !important}.tabs--segmented{display:flex;border:0.0625rem solid var(--tabs-headers-segmented-border-color);border-radius:1.5rem;background-color:var(--tabs-headers-segmented-background-color);padding:0 0.25rem;box-sizing:border-box;overflow-x:scroll}.tabs--segmented .web{padding:0.25rem}.tabs--segmented ::slotted(:focus-visible){outline:0.125rem solid var(--tc-blue-40);outline-offset:-0.125rem;transition:outline 0s;outline-color:var(--tabs-headers-focus-outline-color)}.tabs--segmented.dark-gray{--tabs-headers-text-color:rgb(255, 255, 255);--tabs-headers-segmented-border-color:rgb(67, 75, 86);--tabs-headers-segmented-background-color:rgb(35, 40, 46);--tabs-headers-segmented-active-background-color:rgb(67, 75, 86);--tabs-headers-segmented-active-box-shadow:0 0 0.0625rem 0 rgba(10, 11, 13, 0.08),\n 0 0.1875rem 0.25rem 0 rgba(10, 11, 13, 0.12);--icon-color:rgb(255, 255, 255)}.tabs--segmented.dark-gray ::slotted(:hover),.tabs--segmented.dark-gray ::slotted(:focus),.tabs--segmented.dark-gray ::slotted(.active){color:rgb(255, 255, 255)}.tabs--segmented.dark-gray ::slotted(.disabled){color:var(--tabs-headers-text-disabled-color);cursor:not-allowed}.tabs--segmented.tabs--disabled{border:none;--tabs-headers-segmented-background-color:var(--tc-layer-secondary);--tabs-headers-segmented-active-background-color:var(--tc-layer-primary);--tabs-headers-segmented-active-box-shadow:none}.tabs--segmented.tabs--disabled ::slotted(*){color:var(--tc-grey-40);cursor:not-allowed}.tabs--segmented.tabs--disabled ::slotted(.active){color:var(--tc-grey-50)}.tabs--segmented.tabs--disabled.dark,.tabs--segmented.tabs--disabled.dark-gray{--tabs-headers-segmented-background-color:var(--tc-layer-secondary-dark);--tabs-headers-segmented-active-background-color:var(--tc-layer-primary-dark)}.tabs--segmented.tabs--disabled.dark ::slotted(*),.tabs--segmented.tabs--disabled.dark-gray ::slotted(*){color:var(--tc-grey-40-dark)}.tabs--segmented.tabs--disabled.dark ::slotted(.active),.tabs--segmented.tabs--disabled.dark-gray ::slotted(.active){color:var(--tc-grey-50-dark)}.tabs--segmented::before{content:\"\";position:absolute;top:0.25rem;bottom:0.25rem;left:0;z-index:0;border-radius:1.563rem;width:var(--active-width);transform:translateX(var(--active-x-pos));transition:var(--active-transition);background:var(--tabs-headers-segmented-active-background-color);box-shadow:var(--tabs-headers-segmented-active-box-shadow)}.tabs--segmented ::slotted(*){font:var(--tabs-headers-segmended-item-font);line-height:1.5rem;z-index:1;position:relative;border:none;padding:var(--tabs-headers-segmented-item-padding) !important;margin:var(--tabs-headers-segmented-item-margin) !important;border-radius:1.563rem;display:flex;flex:1;justify-content:center}.tabs--segmented.mobile ::slotted(*){font:500 0.875rem/1.25rem Inter, Gilroy, Arial, sans-serif, Gilroy, Arial, sans-serif;letter-spacing:-0.003125rem;font-weight:500;padding:0.25rem 1.5rem !important;margin:0.188rem 0 !important;line-height:1.25rem}.tabs--segmented.square{--tabs-headers-segmented-background-color:rgba(var(--tabs-headers-square-base-rgb), 0.16);--tabs-headers-segmented-border-color:transparent;height:4.75rem;border-radius:0.375rem;padding:0}.tabs--segmented.square::before{--tabs-headers-segmented-active-box-shadow:none;position:absolute;top:0;bottom:0;left:-0.0625rem;border-radius:0}.tabs--segmented.square ::slotted(*){--tabs-headers-segmented-item-padding:0;--tabs-headers-segmented-item-margin:0;border-radius:0;height:100%;align-items:center}.tabs--segmented.square ::slotted(*)::after{content:\"\";background-color:rgba(var(--tabs-headers-square-base-rgb), 0.2);position:absolute;top:0.375rem;bottom:0.375rem;right:0;width:0.0625rem}.tabs--segmented.square ::slotted(:hover){background-color:rgba(var(--tabs-headers-square-base-rgb), 0.24)}.tabs--segmented.square ::slotted(:first-child){border-radius:0.3125rem 0 0 0.3125rem}.tabs--segmented.square ::slotted(:last-child){border-radius:0 0.3125rem 0.3125rem 0}.tabs--segmented.square ::slotted(:focus-visible){outline:0.125rem solid var(--tc-blue-40);outline-offset:-0.125rem;transition:outline 0s;outline-color:var(--tabs-headers-focus-outline-color)}.tabs--segmented.square ::slotted(:focus-visible)::after{display:none}.tabs--segmented.square ::slotted(.active)::after,.tabs--segmented.square ::slotted(:last-child)::after{display:none}.tabs--segmented.netflix{height:2.75rem;gap:0.5rem;overflow-y:hidden}.tabs--segmented.netflix ::slotted(*){flex-direction:row-reverse;align-items:center;justify-content:center;gap:0.5rem}.tabs--segmented.netflix ::slotted(:focus-visible){outline:0.125rem solid var(--tc-blue-40);outline-offset:-0.0625rem;transition:outline 0s;outline-color:var(--tabs-headers-focus-outline-color);border-radius:1.563rem}.tabs ::slotted(.no-underline){border-bottom:none}";
|
|
5
5
|
const TetTabHeaderStyle0 = tetTabHeaderCss;
|
|
6
6
|
|
|
7
7
|
const TetTabHeader = class {
|
|
@@ -14,6 +14,9 @@ const TetTabHeader = class {
|
|
|
14
14
|
this.sizing = 'web';
|
|
15
15
|
this.defaultTab = 0;
|
|
16
16
|
this.segmented = false;
|
|
17
|
+
this.disabled = false;
|
|
18
|
+
this.mode = 'tab-header';
|
|
19
|
+
this.accessibilityLabel = '';
|
|
17
20
|
this.hideHeaderUnderline = false;
|
|
18
21
|
this.hideActiveHeaderUnderline = false;
|
|
19
22
|
this.autoplayDelay = 0;
|
|
@@ -253,6 +256,12 @@ const TetTabHeader = class {
|
|
|
253
256
|
get isScrollableType() {
|
|
254
257
|
return this.type === 'pill' || this.type === 'square-detached';
|
|
255
258
|
}
|
|
259
|
+
get isSwitchMode() {
|
|
260
|
+
return this.mode === 'switch';
|
|
261
|
+
}
|
|
262
|
+
get isSwitchDisabled() {
|
|
263
|
+
return this.isSwitchMode && this.disabled;
|
|
264
|
+
}
|
|
256
265
|
cleanupTabListeners() {
|
|
257
266
|
this.tabHeaders?.forEach((tab) => {
|
|
258
267
|
const listeners = this.tabListeners.get(tab);
|
|
@@ -354,6 +363,30 @@ const TetTabHeader = class {
|
|
|
354
363
|
this.initAnimationObserver();
|
|
355
364
|
}
|
|
356
365
|
}
|
|
366
|
+
onDisabledChange() {
|
|
367
|
+
this.initTabHeaders();
|
|
368
|
+
}
|
|
369
|
+
setTabAccessibility(tab, index, active) {
|
|
370
|
+
const disabled = this.isSwitchMode && (this.isSwitchDisabled || tab.classList.contains('disabled'));
|
|
371
|
+
tab.setAttribute('tabIndex', `${active && !disabled ? '0' : '-1'}`);
|
|
372
|
+
if (this.isSwitchMode) {
|
|
373
|
+
tab.setAttribute('role', 'radio');
|
|
374
|
+
tab.setAttribute('aria-checked', `${active}`);
|
|
375
|
+
if (disabled) {
|
|
376
|
+
tab.setAttribute('aria-disabled', 'true');
|
|
377
|
+
}
|
|
378
|
+
else {
|
|
379
|
+
tab.removeAttribute('aria-disabled');
|
|
380
|
+
}
|
|
381
|
+
tab.removeAttribute('aria-selected');
|
|
382
|
+
tab.removeAttribute('aria-controls');
|
|
383
|
+
return;
|
|
384
|
+
}
|
|
385
|
+
tab.setAttribute('role', 'tab');
|
|
386
|
+
tab.setAttribute('aria-controls', `tabpanel-${index + 1}-${this.idSuffix}`);
|
|
387
|
+
tab.setAttribute('aria-selected', `${active}`);
|
|
388
|
+
tab.removeAttribute('aria-checked');
|
|
389
|
+
}
|
|
357
390
|
/**
|
|
358
391
|
* Initializes tab headers.
|
|
359
392
|
*/
|
|
@@ -362,13 +395,10 @@ const TetTabHeader = class {
|
|
|
362
395
|
this.tabHeaders = Array.from(this.element.children);
|
|
363
396
|
this.tabHeadersNotDisabled = [];
|
|
364
397
|
this.tabHeaders.forEach((tab, index) => {
|
|
365
|
-
tab.setAttribute('role', 'tab');
|
|
366
398
|
tab.setAttribute('id', `tab-${index + 1}-${this.idSuffix}`);
|
|
367
|
-
tab.
|
|
368
|
-
const disabled = tab.classList.contains('disabled');
|
|
399
|
+
const disabled = this.isSwitchDisabled || tab.classList.contains('disabled');
|
|
369
400
|
const active = tab.classList.contains('active');
|
|
370
|
-
|
|
371
|
-
tab.setAttribute('aria-selected', `${active}`);
|
|
401
|
+
this.setTabAccessibility(tab, index, active);
|
|
372
402
|
if (!disabled && !this.tabListeners.has(tab)) {
|
|
373
403
|
this.tabHeadersNotDisabled.push(tab);
|
|
374
404
|
const clickHandler = () => {
|
|
@@ -524,10 +554,9 @@ const TetTabHeader = class {
|
|
|
524
554
|
if (this.tabHeaders === undefined) {
|
|
525
555
|
return;
|
|
526
556
|
}
|
|
527
|
-
this.tabHeaders.forEach((tab) => {
|
|
557
|
+
this.tabHeaders.forEach((tab, index) => {
|
|
528
558
|
tab.classList.remove('active');
|
|
529
|
-
|
|
530
|
-
tab.setAttribute('tabIndex', '-1');
|
|
559
|
+
this.setTabAccessibility(tab, index, false);
|
|
531
560
|
const imageActive = tab.querySelector('img.tab-header-image.active');
|
|
532
561
|
if (imageActive) {
|
|
533
562
|
imageActive.style.display = 'none';
|
|
@@ -553,8 +582,7 @@ const TetTabHeader = class {
|
|
|
553
582
|
});
|
|
554
583
|
}
|
|
555
584
|
selectedTab.classList.add('active');
|
|
556
|
-
selectedTab.
|
|
557
|
-
selectedTab.setAttribute('tabIndex', '0');
|
|
585
|
+
this.setTabAccessibility(selectedTab, this.tabHeaders.indexOf(selectedTab), true);
|
|
558
586
|
this.applyPillIconColor();
|
|
559
587
|
const imageActive = selectedTab.querySelector('img.tab-header-image.active');
|
|
560
588
|
if (imageActive) {
|
|
@@ -621,16 +649,17 @@ const TetTabHeader = class {
|
|
|
621
649
|
}
|
|
622
650
|
render() {
|
|
623
651
|
const shouldRenderOverflowGradients = this.showOverflowGradients;
|
|
624
|
-
return (h(Host, { key: '
|
|
652
|
+
return (h(Host, { key: '066ac0cb29060dbf7e6b88e0170d2f3cd47c8b76', "data-id-suffix": this.idSuffix }, h("div", { key: '8e664aece15cbc58b9c39e2a879f504489e62e8e', class: {
|
|
625
653
|
'tabs': true,
|
|
626
654
|
'tabs--segmented': this.segmented,
|
|
655
|
+
'tabs--disabled': this.isSwitchDisabled,
|
|
627
656
|
'tabs--overflow-left': this.hasOverflowLeft,
|
|
628
657
|
'tabs--overflow-right': this.hasOverflowRight,
|
|
629
658
|
[this.effectivePosition]: true,
|
|
630
659
|
[this.theme]: true,
|
|
631
660
|
[this.sizing]: true,
|
|
632
661
|
[this.type]: !!this.type
|
|
633
|
-
}, onMouseDown: this.onContainerMouseDown, style: this.getStyle(), ref: (ref) => (this.tabElement = ref), role:
|
|
662
|
+
}, onMouseDown: this.onContainerMouseDown, style: this.getStyle(), ref: (ref) => (this.tabElement = ref), role: this.isSwitchMode ? 'radiogroup' : 'tablist', "aria-label": this.isSwitchMode && this.accessibilityLabel ? this.accessibilityLabel : undefined, "aria-orientation": this.isSwitchMode ? 'horizontal' : undefined, "aria-disabled": this.isSwitchDisabled ? 'true' : undefined }, shouldRenderOverflowGradients && h("div", { key: '4c9ae2fbe2bf27d7cc91bbc8ce55c3e9d7469a3b', class: "tabs-gradient tabs-gradient-left", "aria-hidden": "true" }), h("slot", { key: '677d35c1979329dc6271f231ca554ca58ed4924f', onSlotchange: () => this.updatePositionClass(), ref: (slot) => (this.tabContainer = slot) }), shouldRenderOverflowGradients && h("div", { key: '5a265eba7ef003aa87fe6bdf55ea9f596cbccfa2', class: "tabs-gradient tabs-gradient-right", "aria-hidden": "true" })), h("div", { key: '76e09c8fc61c1a6adc5d00224caf73869af66d57', class: {
|
|
634
663
|
'tabs-line': !this.segmented,
|
|
635
664
|
'no-underline': this.hideHeaderUnderline || this.isScrollableType,
|
|
636
665
|
[this.theme]: true
|
|
@@ -639,7 +668,8 @@ const TetTabHeader = class {
|
|
|
639
668
|
static get watchers() { return {
|
|
640
669
|
"hideActiveHeaderUnderline": ["showActiveHeaderUnderline"],
|
|
641
670
|
"autoplayDelay": ["onAutoplayDelayChange"],
|
|
642
|
-
"segmented": ["onSegmentedChange"]
|
|
671
|
+
"segmented": ["onSegmentedChange"],
|
|
672
|
+
"disabled": ["onDisabledChange"]
|
|
643
673
|
}; }
|
|
644
674
|
};
|
|
645
675
|
TetTabHeader.style = TetTabHeaderStyle0;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as e,c as t,g as r,h as a,H as s}from"./p-83f43fdd.js";import{a as o}from"./p-64ec8edd.js";const i=class{constructor(r){e(this,r),this.select=t(this,"tabSelected",7),this.theme="light",this.type=void 0,this.position=void 0,this.sizing="web",this.defaultTab=0,this.segmented=!1,this.disabled=!1,this.mode="tab-header",this.accessibilityLabel="",this.hideHeaderUnderline=!1,this.hideActiveHeaderUnderline=!1,this.autoplayDelay=0,this.stopAutoplayOnHeaderHover=!1,this.stopAutoplayOnContentHover=!1,this.showOverflowGradients=!1,this.selectedId=void 0,this.positions={scrollLeft:0,mouseX:0},this.dataName=void 0,this.autoplay=void 0,this.effectivePosition="left",this.hasOverflowLeft=!1,this.hasOverflowRight=!1,this.idSuffix="undefined"!=typeof crypto&&crypto.randomUUID?crypto.randomUUID().split("-")[0]:Math.random().toString(36).substring(2,10),this.segmentAnimation={width:"0px",position:"0px",transition:""}}tabElement;tabContainer;tabHeaders;tabHeadersNotDisabled;animationObserver;positionObserver;isDragging=!1;dragStartX=0;dragResetTimer=null;dragThreshold=8;autoplayInterval=[];tabListeners=new WeakMap;get element(){return r(this)}select;async toggleAutoplay(e){this.autoplay=e,e?this.startAutoplay():this.stopAutoplay()}async stopAutoplay(){this.autoplayInterval.forEach((e=>{clearInterval(e)})),this.autoplayInterval.length=0}async startAutoplay(){this.autoplay&&this.autoplayInterval.push(setInterval((()=>{const e=this.getTabElement(this.selectedId);let t=this.tabHeaders.indexOf(e)+1;for(;this.tabHeadersNotDisabled.indexOf(this.tabHeaders[t])<0;)if(t+=1,t+1>this.tabHeaders.length){t=0;break}t=this.tabHeaders.indexOf(this.getTabElement(t)),this.selectTab(t)}),this.autoplayDelay))}showActiveHeaderUnderline(){this.tabHeaders.forEach((e=>{this.hideActiveHeaderUnderline?e.classList.add("no-underline"):e.classList.remove("no-underline")}))}onAutoplayDelayChange(e){console.log(e,!!e),this.stopAutoplay(),e&&this.startAutoplay()}initAutoplay(){if(this.autoplayDelay>0&&this.tabHeadersNotDisabled.length>1){this.autoplay=!0,this.startAutoplay(),this.tabHeadersNotDisabled.forEach((e=>{e.addEventListener("mouseenter",(()=>{this.stopAutoplayOnHeaderHover&&this.stopAutoplay()})),e.addEventListener("mouseleave",(()=>{this.stopAutoplayOnHeaderHover&&this.startAutoplay()}))}));const e=this.element.parentElement.querySelector(`tet-tab-content[data-name="${this.dataName}"`);e.addEventListener("mouseenter",(()=>{this.stopAutoplayOnContentHover&&this.stopAutoplay()})),e.addEventListener("mouseleave",(()=>{this.stopAutoplayOnContentHover&&this.startAutoplay()}))}}componentDidLoad(){this.initTabHeaderImages(),this.initTabHeaders(),this.showActiveHeaderUnderline(),this.selectTab(this.defaultTab,!1,!1),this.initAutoplay(),this.updatePositionClass(),this.initPositionObserver(),this.isScrollableType&&this.tabElement.addEventListener("scroll",this.onTabScroll),this.tabElement.addEventListener("touchstart",this.onContainerTouchStart,{passive:!0}),this.tabElement.addEventListener("touchmove",this.onContainerTouchMove,{passive:!0}),this.tabElement.addEventListener("touchend",this.onContainerTouchEnd),this.segmented&&(this.tabElement.addEventListener("scroll",this.debounceOnInitialScroll),this.initAnimationObserver());const e=new MutationObserver((t=>{t.every((t=>!t.oldValue?.includes("disabled")||(this.initTabHeaders(),e.disconnect(),!1)))}));e.observe(this.element,{attributes:!0,attributeOldValue:!0,subtree:!0,attributeFilter:["class"]})}connectedCallback(){this.initTabHeaders()}disconnectedCallback(){this.cleanupTabListeners(),this.stopAutoplay(),this.animationObserver?.disconnect(),this.positionObserver?.disconnect(),this.isScrollableType&&this.tabElement?.removeEventListener("scroll",this.onTabScroll),this.tabElement?.removeEventListener("touchstart",this.onContainerTouchStart),this.tabElement?.removeEventListener("touchmove",this.onContainerTouchMove),this.tabElement?.removeEventListener("touchend",this.onContainerTouchEnd),this.resetDragState()}initPositionObserver(){this.positionObserver=new ResizeObserver((()=>{this.updatePositionClass()})),this.positionObserver.observe(this.tabElement)}updatePositionClass(){this.updateOverflowState(),this.effectivePosition=void 0!==this.tabElement&&!this.segmented&&"center"===this.position&&this.tabElement.scrollWidth>this.tabElement.clientWidth?"left":"right"!==this.position?"center"!==this.position?"left":"center":"right"}updateOverflowState(){if(void 0===this.tabElement||!this.isScrollableType)return this.hasOverflowLeft=!1,void(this.hasOverflowRight=!1);const e=this.tabElement.scrollWidth-this.tabElement.clientWidth;this.hasOverflowLeft=this.tabElement.scrollLeft>1,this.hasOverflowRight=e-this.tabElement.scrollLeft>1}onTabScroll=()=>{this.updateOverflowState()};get isScrollableType(){return"pill"===this.type||"square-detached"===this.type}get isSwitchMode(){return"switch"===this.mode}get isSwitchDisabled(){return this.isSwitchMode&&this.disabled}cleanupTabListeners(){this.tabHeaders?.forEach((e=>{const t=this.tabListeners.get(e);t&&(e.removeEventListener("click",t.click),e.removeEventListener("keydown",t.keydown),this.tabListeners.delete(e))}))}resetDragState(){this.isDragging=!1,null!==this.dragResetTimer&&(clearTimeout(this.dragResetTimer),this.dragResetTimer=null)}onContainerMouseDown=e=>{this.resetDragState(),this.positions={scrollLeft:this.tabElement.scrollLeft,mouseX:e.clientX},this.tabElement.addEventListener("mousemove",this.onContainerMouseMove),this.tabElement.addEventListener("mouseup",this.onContainerMouseUp),this.tabElement.addEventListener("mouseleave",this.onContainerMouseUp)};onContainerMouseMove=e=>{if(e.preventDefault(),1!==e.buttons)return void this.onContainerMouseUp();const t=e.clientX-this.positions.mouseX;Math.abs(t)>this.dragThreshold&&(this.isDragging=!0),this.tabElement.scrollTo(this.positions.scrollLeft-t,0)};onContainerMouseUp=()=>{this.tabElement.removeEventListener("mousemove",this.onContainerMouseMove),this.tabElement.removeEventListener("mouseup",this.onContainerMouseUp),this.tabElement.removeEventListener("mouseleave",this.onContainerMouseUp),this.isDragging&&(this.dragResetTimer=setTimeout((()=>{this.isDragging=!1,this.dragResetTimer=null}),50))};onContainerTouchStart=e=>{this.dragStartX=e.touches[0].clientX,this.resetDragState()};onContainerTouchMove=e=>{Math.abs(e.touches[0].clientX-this.dragStartX)>this.dragThreshold&&(this.isDragging=!0)};onContainerTouchEnd=()=>{this.isDragging&&(this.dragResetTimer=setTimeout((()=>{this.isDragging=!1,this.dragResetTimer=null}),350))};onSegmentedChange(e){e&&void 0===this.animationObserver&&this.initAnimationObserver()}onDisabledChange(){this.initTabHeaders()}setTabAccessibility(e,t,r){const a=this.isSwitchMode&&(this.isSwitchDisabled||e.classList.contains("disabled"));if(e.setAttribute("tabIndex",r&&!a?"0":"-1"),this.isSwitchMode)return e.setAttribute("role","radio"),e.setAttribute("aria-checked",`${r}`),a?e.setAttribute("aria-disabled","true"):e.removeAttribute("aria-disabled"),e.removeAttribute("aria-selected"),void e.removeAttribute("aria-controls");e.setAttribute("role","tab"),e.setAttribute("aria-controls",`tabpanel-${t+1}-${this.idSuffix}`),e.setAttribute("aria-selected",`${r}`),e.removeAttribute("aria-checked")}initTabHeaders(){this.cleanupTabListeners(),this.tabHeaders=Array.from(this.element.children),this.tabHeadersNotDisabled=[],this.tabHeaders.forEach(((e,t)=>{e.setAttribute("id",`tab-${t+1}-${this.idSuffix}`);const r=this.isSwitchDisabled||e.classList.contains("disabled"),a=e.classList.contains("active");if(this.setTabAccessibility(e,t,a),!r&&!this.tabListeners.has(e)){this.tabHeadersNotDisabled.push(e);const r=()=>{this.isDragging||this.selectTab(e.getAttribute("data-name")||t)},a=t=>{const{key:r}=t;if(["ArrowLeft","ArrowRight","Home","End"].includes(r)){t.preventDefault();const a=this.tabHeadersNotDisabled.indexOf(e);let s;switch(r){case"ArrowRight":s=a+1,s>=this.tabHeadersNotDisabled.length&&(s=0);break;case"ArrowLeft":s=a-1,s<0&&(s=this.tabHeadersNotDisabled.length-1);break;case"Home":s=0;break;case"End":s=this.tabHeadersNotDisabled.length-1}const o=this.tabHeadersNotDisabled[s];o.focus(),o.click()}};e.addEventListener("click",r),e.addEventListener("keydown",a),this.tabListeners.set(e,{click:r,keydown:a})}})),this.applyPillIconColor(),this.updatePositionClass()}applyPillIconColor(){"pill"===this.type&&void 0!==this.tabHeaders&&this.tabHeaders.forEach((e=>{let t="var(--tabs-headers-pill-text-color)";e.classList.contains("active")&&(t="var(--tabs-headers-pill-active-text-color)"),e.classList.contains("disabled")&&(t="var(--tabs-headers-pill-text-disabled-color)"),Array.from(e.querySelectorAll("tet-icon")).forEach((e=>{e.style.setProperty("--icon-color",t),e.style.setProperty("--icon-container-display","flex")}))}))}initTabHeaderImages(){this.tabHeaders=Array.from(this.element.children),this.tabHeaders.forEach((e=>{const t=e.getAttribute("data-image");if(t){const r=e.getAttribute("data-image-active"),a=e.getAttribute("data-image-alt")??"",s=document.createElement("img");if(s.src=t,s.alt=a,s.draggable=!1,s.classList.add("tab-header-image"),"square-detached"===this.type?(s.style.filter="var(--square-detached-img-filter, none)",s.style.maxWidth="var(--square-detached-logo-max-w, 100%)",s.style.maxHeight="var(--square-detached-logo-max-h, 100%)",s.style.objectFit="contain"):s.style.maxHeight="1.5rem",e.appendChild(s),r){const t=document.createElement("img");t.src=r,t.alt=a,t.draggable=!1,t.classList.add("tab-header-image","active"),t.style.display="none",t.style.maxHeight="1.5rem",e.appendChild(t),s.classList.add("default")}}}))}initAnimationObserver(){this.animationObserver=new ResizeObserver((()=>{this.animateActiveSegment(!1)})),this.animationObserver.observe(this.tabElement)}animateActiveSegment(e=!0){if(!this.segmented)return;if(void 0===this.tabContainer)return;const t=this.getTabElement(this.selectedId),r=t.parentNode.getBoundingClientRect(),a=t.getBoundingClientRect();if(this.segmentAnimation={width:`${a.width}px`,position:`${a.left-r.left+this.tabElement.scrollLeft}px`,transition:e?"transform 0.3s ease, width 0.3s ease":null},"web"===this.sizing){const e=this.tabElement.scrollLeft-this.tabElement.getBoundingClientRect().left-this.tabElement.getBoundingClientRect().width/2,r=t.getBoundingClientRect();this.tabElement.scrollTo({behavior:"smooth",left:e+(r.width/2+r.left)})}}async selectTab(e,t=!0,r=!0){if(void 0===this.tabHeaders)return;this.tabHeaders.forEach(((e,t)=>{e.classList.remove("active"),this.setTabAccessibility(e,t,!1);const r=e.querySelector("img.tab-header-image.active");r&&(r.style.display="none");const a=e.querySelector("img.tab-header-image.default");a&&(a.style.display="inline-block")}));const a=this.getTabElement(e);if(null===a)return;if(r&&!this.isDragging){const e=this.tabElement.scrollLeft-this.tabElement.getBoundingClientRect().left-this.tabElement.getBoundingClientRect().width/2,t=a.getBoundingClientRect();this.tabElement.scrollTo({behavior:"smooth",left:e+(t.width/2+t.left)})}a.classList.add("active"),this.setTabAccessibility(a,this.tabHeaders.indexOf(a),!0),this.applyPillIconColor();const s=a.querySelector("img.tab-header-image.active");if(s){s.style.display="inline-block";const e=a.querySelector("img.tab-header-image.default");e&&(e.style.display="none")}this.select.emit({new:e,old:this.selectedId}),this.selectedId=e,this.animateActiveSegment(t)}getTabElement(e){if(!this.tabHeaders?.length)return null;let t;return t="number"==typeof e?this.tabHeaders[e]:this.tabHeaders.find((t=>t.getAttribute("data-name")===e)),void 0!==t?t:this.tabHeaders[0]}onInitialScroll=()=>{this.tabElement.removeEventListener("scroll",this.debounceOnInitialScroll),this.animateActiveSegment(!0)};debounceOnInitialScroll=o(this.onInitialScroll,10);getStyle(){if(this.segmented){const{width:e,position:t,transition:r}=this.segmentAnimation;return{"--active-width":e,"--active-x-pos":t,"--active-transition":r}}return{}}render(){const e=this.showOverflowGradients;return a(s,{key:"066ac0cb29060dbf7e6b88e0170d2f3cd47c8b76","data-id-suffix":this.idSuffix},a("div",{key:"8e664aece15cbc58b9c39e2a879f504489e62e8e",class:{tabs:!0,"tabs--segmented":this.segmented,"tabs--disabled":this.isSwitchDisabled,"tabs--overflow-left":this.hasOverflowLeft,"tabs--overflow-right":this.hasOverflowRight,[this.effectivePosition]:!0,[this.theme]:!0,[this.sizing]:!0,[this.type]:!!this.type},onMouseDown:this.onContainerMouseDown,style:this.getStyle(),ref:e=>this.tabElement=e,role:this.isSwitchMode?"radiogroup":"tablist","aria-label":this.isSwitchMode&&this.accessibilityLabel?this.accessibilityLabel:void 0,"aria-orientation":this.isSwitchMode?"horizontal":void 0,"aria-disabled":this.isSwitchDisabled?"true":void 0},e&&a("div",{key:"4c9ae2fbe2bf27d7cc91bbc8ce55c3e9d7469a3b",class:"tabs-gradient tabs-gradient-left","aria-hidden":"true"}),a("slot",{key:"677d35c1979329dc6271f231ca554ca58ed4924f",onSlotchange:()=>this.updatePositionClass(),ref:e=>this.tabContainer=e}),e&&a("div",{key:"5a265eba7ef003aa87fe6bdf55ea9f596cbccfa2",class:"tabs-gradient tabs-gradient-right","aria-hidden":"true"})),a("div",{key:"76e09c8fc61c1a6adc5d00224caf73869af66d57",class:{"tabs-line":!this.segmented,"no-underline":this.hideHeaderUnderline||this.isScrollableType,[this.theme]:!0}}))}static get watchers(){return{hideActiveHeaderUnderline:["showActiveHeaderUnderline"],autoplayDelay:["onAutoplayDelayChange"],segmented:["onSegmentedChange"],disabled:["onDisabledChange"]}}};i.style=':host{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit;padding:0;margin:0}:host{--color-gray-light:#cdd2de;--color-ta070:#f5f6f8;--color-ta080:#e6e8ee;--color-ta100:#cdd2de;--color-ta200:#9ba5be;--color-ta300:#69789c;--color-ta500:#1e356a;--color-ta600:#051d59;--color-tc090:#d6e6fd;--color-tc100:#d1dffe;--color-tc300:#75a1fb;--color-tc500:#1a70f6;--color-tc600:#0060f5;--color-td500:#00F1F2;--color-td600:#01cbe0;--color-tf600:#f53b2a;--color-tg300:#2b3036;--color-tg400:#1d2128;--color-tg500:#12171e;--color-tg600:#01050c;--color-th500:#f5f5f5;--color-ti500:#869198;--color-ti600:#aeb7bc;--text-font:Gilroy, serif;--text-color-darker:var(--color-ta600);--text-color-dark:var(--color-ta500);--text-color-dark-theme:var(--color-th500);--icons-font:Tet Icons, serif}.icon.tet-search{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-search::before{content:"\\e86e"}.icon.tet-close-circled{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-close-circled::before{content:"\\e85a"}.icon.tet-close{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-close::before{content:"\\e85b"}.icon.tet-check-circled{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-check-circled::before{content:"\\e86c"}.icon.tet-check{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-check::before{content:"\\e855"}.icon.tet-chevron-up{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-chevron-up::before{content:"\\e859"}.icon.tet-chevron-down{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-chevron-down::before{content:"\\e856"}.icon.tet-clipboard{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-clipboard::before{content:"\\e86a"}.icon.tet-info{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-info::before{content:"\\e81d"}.icon.tet-done{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-done::before{content:"\\e867"}@font-face{font-family:"Gilroy";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/Gilroy-W05-Semibold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Semibold.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:700;font-display:swap;src:url("assets/fonts/Gilroy-W05-Bold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Bold.woff") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/Inter-Regular.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Regular.woff?v=3.19") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/Inter-Medium.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Medium.woff?v=3.19") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/Inter-SemiBold.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-SemiBold.woff?v=3.19") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/Gilroy-W05-Semibold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Semibold.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:700;font-display:swap;src:url("assets/fonts/Gilroy-W05-Bold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Bold.woff") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/Inter-Regular.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Regular.woff?v=3.19") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/Inter-Medium.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Medium.woff?v=3.19") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/Inter-SemiBold.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-SemiBold.woff?v=3.19") format("woff")}:host{--font-family-fallback:Gilroy, Arial, sans-serif;--font-family-headline:Gilroy;--font-family-content:Inter, var(--font-family-fallback);font-family:var(--font-family-content)}:host{--tabs-container-border-color:var(--tc-border-quaternary);--tabs-container-flex-wrap:nowrap;--tabs-headers-text-color:var(--tc-text-primary);--tabs-headers-text-disabled-color:var(--tc-grey-50);--tabs-headers-active-border-color:var(--tc-icon-primary);--tabs-headers-hover-border-color:var(--tc-border-tertiary);--tabs-headers-focus-border-color:var(--tc-border-secondary);--tabs-headers-focus-outline-color:var(--tc-blue-40);--tabs-headers-segmended-item-font:500 1rem/1.5rem Inter, Gilroy, Arial, sans-serif;--tabs-headers-segmented-border-color:var(--tc-border-quaternary);--tabs-headers-segmented-background-color:var(--tc-layer-tertiary);--tabs-headers-segmented-active-background-color:var(--tc-layer-primary);--tabs-headers-segmented-active-box-shadow:var(--tc-elevation-two);--tabs-headers-item-padding:0.75rem 0.25rem;--tabs-headers-item-margin:0 0.25rem;--tabs-headers-segmented-item-padding:0.375rem 1.5rem;--tabs-headers-segmented-item-margin:0.25rem 0;--tabs-headers-square-base-rgb:255, 255, 255;--tabs-headers-pill-text-color:var(--tc-text-primary);--tabs-headers-pill-text-disabled-color:color-mix(in srgb, var(--tc-grey-80) 16%, transparent);--tabs-headers-pill-background-color:var(--tc-grey-20);--tabs-headers-pill-hover-background-color:var(--tc-grey-30);--tabs-headers-pill-pressed-background-color:color-mix(in srgb, var(--tc-grey-40) 80%, transparent);--tabs-headers-pill-active-background-color:var(--tc-yellow-40);--tabs-headers-pill-active-text-color:var(--tc-text-primary);--tabs-headers-pill-gradient-color:var(--tc-background-primary);--tabs-headers-pill-edge-padding:0rem;--tabs-headers-square-detached-background-color:var(--tc-grey-20);--tabs-headers-square-detached-hover-background-color:var(--tc-grey-30);--tabs-headers-square-detached-pressed-background-color:var(--tc-grey-40);--tabs-headers-square-detached-active-background-color:var(--tc-grey-110);--tabs-headers-square-detached-disabled-background-color:var(--tc-grey-20);--tabs-headers-square-detached-focus-outline-color:var(--tc-blue-40);--tabs-headers-square-detached-svg-filter:brightness(0) invert(0.298);--tabs-headers-square-detached-svg-hover-filter:brightness(0) invert(0.098);--tabs-headers-square-detached-svg-pressed-filter:brightness(0) invert(0.098);--tabs-headers-square-detached-svg-active-filter:brightness(0) invert(1);--tabs-headers-square-detached-svg-disabled-filter:brightness(0) invert(0.631);--tabs-headers-square-detached-gradient-color:var(--tc-background-primary);--tabs-headers-square-detached-button-max-width-default:7rem;max-width:100%}:host .dark{--tabs-container-border-color:var(--tc-border-quaternary-dark);--tabs-headers-text-color:var(--tc-text-primary-dark);--tabs-headers-text-disabled-color:var(--tc-grey-50-dark);--tabs-headers-active-border-color:var(--tc-icon-primary-dark);--tabs-headers-hover-border-color:var(--tc-border-tertiary-dark);--tabs-headers-focus-border-color:var(--tc-border-secondary-dark);--tabs-headers-focus-outline-color:var(--tc-blue-40-dark);--tabs-headers-segmented-border-color:var(--tc-border-quaternary-dark);--tabs-headers-segmented-background-color:var(--tc-layer-tertiary-dark);--tabs-headers-segmented-active-background-color:var(--tc-layer-primary-dark);--tabs-headers-segmented-active-box-shadow:var(--tc-elevation-two-dark);--tabs-headers-pill-text-color:var(--tc-grey-100-dark);--tabs-headers-pill-text-disabled-color:color-mix(in srgb, var(--tc-grey-80-dark) 30%, transparent);--tabs-headers-pill-background-color:var(--tc-brown-80-dark);--tabs-headers-pill-hover-background-color:var(--tc-brown-70-dark);--tabs-headers-pill-pressed-background-color:color-mix(in srgb, var(--tc-brown-60-dark) 80%, transparent);--tabs-headers-pill-active-background-color:var(--tc-yellow-40-dark);--tabs-headers-pill-active-text-color:var(--tc-text-primary);--tabs-headers-pill-gradient-color:var(--tc-background-primary-dark);--tabs-headers-square-detached-background-color:var(--tc-brown-80-dark);--tabs-headers-square-detached-hover-background-color:var(--tc-brown-70-dark);--tabs-headers-square-detached-pressed-background-color:var(--tc-brown-60-dark);--tabs-headers-square-detached-active-background-color:var(--tc-yellow-40-dark);--tabs-headers-square-detached-disabled-background-color:var(--tc-brown-80-dark);--tabs-headers-square-detached-focus-outline-color:var(--tc-blue-40-dark);--tabs-headers-square-detached-svg-filter:brightness(0) invert(0.859);--tabs-headers-square-detached-svg-hover-filter:brightness(0) invert(0.969);--tabs-headers-square-detached-svg-pressed-filter:brightness(0) invert(0.969);--tabs-headers-square-detached-svg-active-filter:brightness(0) invert(0.051);--tabs-headers-square-detached-svg-disabled-filter:brightness(0) invert(0.631);--tabs-headers-square-detached-gradient-color:var(--tc-background-primary-dark)}.tabs{--active-width:auto;--active-x-pos:0;--active-transition:none;position:relative;display:flex;flex-wrap:var(--tabs-container-flex-wrap);align-items:center;max-width:100%;padding:0.125rem 0;overflow-x:scroll;scrollbar-width:none;-webkit-user-select:none;user-select:none}.tabs ::slotted(img){margin:0;padding:0;height:1.3125rem}.tabs-line{display:flex;position:relative;max-width:100%;height:0.0625rem;background-color:var(--tabs-container-border-color);border:none;margin-top:-0.125rem}.tabs-line.no-underline{display:none}.tabs *{box-sizing:border-box}.tabs::-webkit-scrollbar{display:none}.tabs.right:not(.tabs--segmented){justify-content:flex-end}.tabs.center:not(.tabs--segmented){justify-content:center}.tabs ::slotted(*){display:flex;justify-content:center;align-items:center;border-bottom:0.125rem solid transparent;color:var(--tabs-headers-text-color);cursor:pointer;padding:var(--tabs-headers-item-padding) !important;margin:var(--tabs-headers-item-margin);transition:border-bottom-color 0.2s ease;white-space:nowrap;background-color:transparent;border-color:transparent;border-radius:0.125rem}.tabs ::slotted(:first-child){margin-left:0}.tabs ::slotted(:last-child){margin-right:0}.tabs ::slotted(:hover){border-bottom-color:var(--tabs-headers-hover-border-color);background-color:transparent}.tabs ::slotted(:focus){border-bottom-color:var(--tabs-headers-focus-border-color)}.tabs ::slotted(:focus-visible){outline:0.125rem solid var(--tc-blue-40);outline-offset:0rem;transition:outline 0s;outline-color:var(--tabs-headers-focus-outline-color);border-bottom-color:transparent;z-index:99}.tabs ::slotted(.disabled){border-bottom-color:transparent;color:var(--tabs-headers-text-disabled-color);outline:none;cursor:not-allowed}.tabs ::slotted(.active){border-bottom-color:var(--tabs-headers-active-border-color)}.tabs.pill .tabs-gradient,.tabs.square-detached .tabs-gradient{position:sticky;top:0.5rem;bottom:0.5rem;width:13.75rem;align-self:stretch;flex-shrink:0;opacity:0;z-index:20;pointer-events:none;transition:opacity 0.4s ease-out}.tabs.pill .tabs-gradient-left,.tabs.square-detached .tabs-gradient-left{left:-0.5rem;margin-right:-13.75rem;background:linear-gradient(270deg, rgba(255, 255, 255, 0) 0%, var(--tabs-gradient-color) 100%)}.tabs.pill .tabs-gradient-right,.tabs.square-detached .tabs-gradient-right{right:-0.5rem;margin-left:-13.75rem;background:linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, var(--tabs-gradient-color) 100%)}.tabs.pill.tabs--overflow-left .tabs-gradient-left,.tabs.square-detached.tabs--overflow-left .tabs-gradient-left{opacity:1}.tabs.pill.tabs--overflow-right .tabs-gradient-right,.tabs.square-detached.tabs--overflow-right .tabs-gradient-right{opacity:1}.tabs.square-detached{--tabs-gradient-color:var(--tabs-headers-square-detached-gradient-color);padding-top:0.5rem;padding-bottom:0.5rem;margin-top:-0.5rem;margin-bottom:-0.5rem}.tabs.square-detached ::slotted(*){display:flex;flex:1;min-width:var(--tabs-headers-square-detached-button-max-width, var(--tabs-headers-square-detached-button-max-width-default));max-width:var(--tabs-headers-square-detached-button-max-width, var(--tabs-headers-square-detached-button-max-width-default));border:none;box-sizing:border-box;background-color:var(--tabs-headers-square-detached-background-color);justify-content:center;align-items:center;flex-shrink:0;transition:background-color 0.2s ease;--square-detached-img-filter:var(--tabs-headers-square-detached-svg-filter)}.tabs.square-detached ::slotted(:hover){border-bottom-color:transparent;background-color:var(--tabs-headers-square-detached-hover-background-color);--square-detached-img-filter:var(--tabs-headers-square-detached-svg-hover-filter)}.tabs.square-detached ::slotted(:active){background-color:var(--tabs-headers-square-detached-pressed-background-color);--square-detached-img-filter:var(--tabs-headers-square-detached-svg-pressed-filter)}.tabs.square-detached ::slotted(:focus-visible){background-color:var(--tabs-headers-square-detached-active-background-color);border-bottom-color:transparent;outline:0.125rem solid var(--tc-blue-40);outline-offset:0.25rem;transition:outline 0s;outline-color:var(--tabs-headers-square-detached-focus-outline-color);z-index:99;--square-detached-img-filter:var(--tabs-headers-square-detached-svg-active-filter)}.tabs.square-detached ::slotted(.active){border-bottom-color:transparent;background-color:var(--tabs-headers-square-detached-active-background-color);--square-detached-img-filter:var(--tabs-headers-square-detached-svg-active-filter)}.tabs.square-detached ::slotted(.disabled){background-color:var(--tabs-headers-square-detached-disabled-background-color);border-bottom-color:transparent;--square-detached-img-filter:var(--tabs-headers-square-detached-svg-disabled-filter);cursor:not-allowed}.tabs.square-detached ::slotted(:first-child){margin-left:unset}.tabs.square-detached ::slotted(:last-child){margin-right:unset}.tabs.square-detached.mobile{--tabs-headers-item-margin:0 0.5rem}.tabs.square-detached.mobile ::slotted(*){--square-detached-logo-max-w:3.9375rem;--square-detached-logo-max-h:2.8125rem;height:5.125rem;border-radius:0.568rem;padding:0.568rem 1.419rem}.tabs.square-detached.tablet{--tabs-headers-item-margin:0 0.75rem}.tabs.square-detached.tablet ::slotted(*){--square-detached-logo-max-w:5.1875rem;--square-detached-logo-max-h:3.75rem;--tabs-headers-square-detached-button-max-width-default:9.1875rem;height:6.75rem;border-radius:0.75rem;padding:0.75rem 1.875rem}.tabs.square-detached.web{--tabs-headers-item-margin:0 0.75rem}.tabs.square-detached.web ::slotted(*){--square-detached-logo-max-w:6.875rem;--square-detached-logo-max-h:5rem;--tabs-headers-square-detached-button-max-width-default:17.25rem;min-width:12.25rem !important;height:9rem;border-radius:1rem;padding:1rem 2.5rem}.tabs.blue ::slotted(:hover){--tabs-headers-hover-border-color:rgb(113, 172, 244)}.tabs.blue ::slotted(:focus){--tabs-headers-focus-border-color:rgb(113, 172, 244)}.tabs.blue ::slotted(.active){--tabs-headers-active-border-color:rgb(0, 96, 245)}.tabs.pill{--tabs-gradient-color:var(--tabs-headers-pill-gradient-color);--tabs-edge-padding:var(--tabs-headers-pill-edge-padding);padding-top:0.5rem;padding-bottom:0.5rem;margin-top:-0.5rem;margin-bottom:-0.5rem;padding-inline:calc(var(--tabs-headers-pill-edge-padding) + 0.5rem);margin-inline:-0.5rem}.tabs.pill ::slotted(*){--icon-size:1rem;gap:0.25rem;border-radius:5.5rem;border-bottom:none;transition:all 0.2s ease-in-out;align-items:center;background-color:var(--tabs-headers-pill-background-color);color:var(--tabs-headers-pill-text-color);box-sizing:border-box}.tabs.pill.web ::slotted(*){--tabs-headers-item-padding:0.375rem 1.5rem;font:500 1rem/1.5rem Inter, Gilroy, Arial, sans-serif, Gilroy, Arial, sans-serif;letter-spacing:-0.00625rem;min-width:5.625rem;flex-shrink:0;height:2.25rem}.tabs.pill.web ::slotted(:has(tet-icon)){--tabs-headers-item-padding:0.375rem 1rem 0.375rem 0.875rem}.tabs.pill.mobile ::slotted(*){--tabs-headers-item-padding:0.375rem 1rem;font:500 0.875rem/1.25rem Inter, Gilroy, Arial, sans-serif, Gilroy, Arial, sans-serif;letter-spacing:-0.003125rem;min-width:4.3125rem;flex-shrink:0;height:2rem}.tabs.pill.mobile ::slotted(:has(tet-icon)){--tabs-headers-item-padding:0.375rem 0.75rem 0.375rem 0.5rem}.tabs.pill ::slotted(:hover){border-bottom-color:transparent;background-color:var(--tabs-headers-pill-hover-background-color)}.tabs.pill ::slotted(:active){background-color:var(--tabs-headers-pill-pressed-background-color)}.tabs.pill ::slotted(:focus){border-bottom-color:transparent}.tabs.pill ::slotted(:focus-visible){outline:0.125rem solid var(--tc-blue-40);outline-offset:0.25rem;transition:outline 0s;outline-color:var(--tabs-headers-focus-outline-color);border-bottom-color:transparent}.tabs.pill ::slotted(.active){border-bottom-color:transparent;background-color:var(--tabs-headers-pill-active-background-color);color:var(--tabs-headers-pill-active-text-color)}.tabs.pill ::slotted(.active:active){background-color:var(--tabs-headers-pill-pressed-background-color)}.tabs.pill ::slotted(.disabled){background-color:var(--tabs-headers-pill-background-color);color:var(--tabs-headers-pill-text-disabled-color);cursor:not-allowed}.tabs.pill ::slotted(:first-child){margin-left:0 !important}.tabs.pill ::slotted(:last-child){margin-right:0 !important}.tabs--segmented{display:flex;border:0.0625rem solid var(--tabs-headers-segmented-border-color);border-radius:1.5rem;background-color:var(--tabs-headers-segmented-background-color);padding:0 0.25rem;box-sizing:border-box;overflow-x:scroll}.tabs--segmented .web{padding:0.25rem}.tabs--segmented ::slotted(:focus-visible){outline:0.125rem solid var(--tc-blue-40);outline-offset:-0.125rem;transition:outline 0s;outline-color:var(--tabs-headers-focus-outline-color)}.tabs--segmented.dark-gray{--tabs-headers-text-color:rgb(255, 255, 255);--tabs-headers-segmented-border-color:rgb(67, 75, 86);--tabs-headers-segmented-background-color:rgb(35, 40, 46);--tabs-headers-segmented-active-background-color:rgb(67, 75, 86);--tabs-headers-segmented-active-box-shadow:0 0 0.0625rem 0 rgba(10, 11, 13, 0.08),\n 0 0.1875rem 0.25rem 0 rgba(10, 11, 13, 0.12);--icon-color:rgb(255, 255, 255)}.tabs--segmented.dark-gray ::slotted(:hover),.tabs--segmented.dark-gray ::slotted(:focus),.tabs--segmented.dark-gray ::slotted(.active){color:rgb(255, 255, 255)}.tabs--segmented.dark-gray ::slotted(.disabled){color:var(--tabs-headers-text-disabled-color);cursor:not-allowed}.tabs--segmented.tabs--disabled{border:none;--tabs-headers-segmented-background-color:var(--tc-layer-secondary);--tabs-headers-segmented-active-background-color:var(--tc-layer-primary);--tabs-headers-segmented-active-box-shadow:none}.tabs--segmented.tabs--disabled ::slotted(*){color:var(--tc-grey-40);cursor:not-allowed}.tabs--segmented.tabs--disabled ::slotted(.active){color:var(--tc-grey-50)}.tabs--segmented.tabs--disabled.dark,.tabs--segmented.tabs--disabled.dark-gray{--tabs-headers-segmented-background-color:var(--tc-layer-secondary-dark);--tabs-headers-segmented-active-background-color:var(--tc-layer-primary-dark)}.tabs--segmented.tabs--disabled.dark ::slotted(*),.tabs--segmented.tabs--disabled.dark-gray ::slotted(*){color:var(--tc-grey-40-dark)}.tabs--segmented.tabs--disabled.dark ::slotted(.active),.tabs--segmented.tabs--disabled.dark-gray ::slotted(.active){color:var(--tc-grey-50-dark)}.tabs--segmented::before{content:"";position:absolute;top:0.25rem;bottom:0.25rem;left:0;z-index:0;border-radius:1.563rem;width:var(--active-width);transform:translateX(var(--active-x-pos));transition:var(--active-transition);background:var(--tabs-headers-segmented-active-background-color);box-shadow:var(--tabs-headers-segmented-active-box-shadow)}.tabs--segmented ::slotted(*){font:var(--tabs-headers-segmended-item-font);line-height:1.5rem;z-index:1;position:relative;border:none;padding:var(--tabs-headers-segmented-item-padding) !important;margin:var(--tabs-headers-segmented-item-margin) !important;border-radius:1.563rem;display:flex;flex:1;justify-content:center}.tabs--segmented.mobile ::slotted(*){font:500 0.875rem/1.25rem Inter, Gilroy, Arial, sans-serif, Gilroy, Arial, sans-serif;letter-spacing:-0.003125rem;font-weight:500;padding:0.25rem 1.5rem !important;margin:0.188rem 0 !important;line-height:1.25rem}.tabs--segmented.square{--tabs-headers-segmented-background-color:rgba(var(--tabs-headers-square-base-rgb), 0.16);--tabs-headers-segmented-border-color:transparent;height:4.75rem;border-radius:0.375rem;padding:0}.tabs--segmented.square::before{--tabs-headers-segmented-active-box-shadow:none;position:absolute;top:0;bottom:0;left:-0.0625rem;border-radius:0}.tabs--segmented.square ::slotted(*){--tabs-headers-segmented-item-padding:0;--tabs-headers-segmented-item-margin:0;border-radius:0;height:100%;align-items:center}.tabs--segmented.square ::slotted(*)::after{content:"";background-color:rgba(var(--tabs-headers-square-base-rgb), 0.2);position:absolute;top:0.375rem;bottom:0.375rem;right:0;width:0.0625rem}.tabs--segmented.square ::slotted(:hover){background-color:rgba(var(--tabs-headers-square-base-rgb), 0.24)}.tabs--segmented.square ::slotted(:first-child){border-radius:0.3125rem 0 0 0.3125rem}.tabs--segmented.square ::slotted(:last-child){border-radius:0 0.3125rem 0.3125rem 0}.tabs--segmented.square ::slotted(:focus-visible){outline:0.125rem solid var(--tc-blue-40);outline-offset:-0.125rem;transition:outline 0s;outline-color:var(--tabs-headers-focus-outline-color)}.tabs--segmented.square ::slotted(:focus-visible)::after{display:none}.tabs--segmented.square ::slotted(.active)::after,.tabs--segmented.square ::slotted(:last-child)::after{display:none}.tabs--segmented.netflix{height:2.75rem;gap:0.5rem;overflow-y:hidden}.tabs--segmented.netflix ::slotted(*){flex-direction:row-reverse;align-items:center;justify-content:center;gap:0.5rem}.tabs--segmented.netflix ::slotted(:focus-visible){outline:0.125rem solid var(--tc-blue-40);outline-offset:-0.0625rem;transition:outline 0s;outline-color:var(--tabs-headers-focus-outline-color);border-radius:1.563rem}.tabs ::slotted(.no-underline){border-bottom:none}';export{i as tet_tab_header}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as e,c as t,g as o,f as r,h as i,H as n}from"./p-83f43fdd.js";import{a}from"./p-713fff27.js";import{p as s,t as l}from"./p-2358a695.js";import{f as c}from"./p-e1e74d01.js";import"./p-9a2b6ee2.js";import"./p-3e60d61c.js";const d=class{constructor(o){e(this,o),this.bottomLinkClick=t(this,"bottomLinkClick",7),this.benefitLinkClick=t(this,"benefitLinkClick",7),this.cardClick=t(this,"cardClick",7),this.selectionStateChange=t(this,"selectionStateChange",7),this.addToCart=t(this,"addToCart",7),this.removeFromCart=t(this,"removeFromCart",7),this.segmentSwitchChange=t(this,"segmentSwitchChange",7),this.isDesktopResolution=!1,this.isAccordionOpen=!0,this.theme="light",this.state="default",this.selected=!1,this.selectionType=void 0,this.isTabStop=!0,this.subscriptionLabel=void 0,this.topBadge=void 0,this.indicator=void 0,this.cardTitle=void 0,this.cardId=void 0,this.subtitle=void 0,this.description=void 0,this.price=void 0,this.inlineMessage=void 0,this.selectionConfig=void 0,this.segmentSwitch=void 0,this.count=void 0,this.primaryValue=void 0,this.secondaryValue=void 0,this.isInCart=!1,this.benefits=void 0,this.benefitLink=void 0,this.packageItems=void 0,this.subscriptionItems=void 0,this.bottomLinkText=void 0,this.bottomRemark=void 0,this.accordionConfig=void 0}get hostElement(){return o(this)}focusTargetEl;static INTERACTIVE_CLICK_TAGS=new Set(["TET-STEPPER-INPUT","TET-BUTTON","TET-DROPDOWN","TET-TAB-HEADER"]);accordionEl;bottomLinkClick;benefitLinkClick;cardClick;selectionStateChange;addToCart;removeFromCart;segmentSwitchChange;get isSelectedState(){return this.selected}get isDisabledState(){return"disabled"===this.state}get isUnavailableState(){return"unavailable"===this.state}get isSubscribedState(){return"subscribed"===this.state}get isSelectable(){return!(!this.selectionType||this.isDisabledState||this.isUnavailableState||this.isSubscribedState)}get isHoverable(){return this.isSelectable&&("checkbox"===this.selectionType||!this.isSelectedState)}get hasDesktopAccordionToggle(){const e=this.accordionConfig?.openLabelDesktop?.trim(),t=this.accordionConfig?.closedLabelDesktop?.trim();return!!e&&!!t}componentWillLoad(){this.isAccordionOpen="closed"!==this.accordionConfig?.defaultState,this.checkDesktopResolution(),this.ensureDesktopOpenWithoutToggle(),s("tet-components","lv").then((()=>r(this)))}onAccordionConfigChanged(){this.ensureDesktopOpenWithoutToggle()}onSelectionConfigChanged(e,t){const o=this.haveDropdownOptionsChanged(e?.primaryDropdown,t?.primaryDropdown),r=this.haveDropdownOptionsChanged(e?.secondaryDropdown,t?.secondaryDropdown),i={};let n=!1;o&&void 0!==this.primaryValue&&(i.primaryValue=void 0,n=!0),r&&void 0!==this.secondaryValue&&(i.secondaryValue=void 0,n=!0),n&&this.emitSelectionStateChanged(i)}onResize(){const e=this.isDesktopResolution;this.checkDesktopResolution(),!e&&this.isDesktopResolution&&this.ensureDesktopOpenWithoutToggle()}checkDesktopResolution=()=>{this.isDesktopResolution=void 0!==globalThis.window&&globalThis.window.innerWidth>=500};emitSelectionStateChanged=e=>{const t={primaryValue:this.primaryValue,secondaryValue:this.secondaryValue,count:this.count,...e};this.selectionStateChange.emit(t)};getDropdownValueSignature=e=>JSON.stringify((e?.options??[]).map((e=>e.value)));haveDropdownOptionsChanged=(e,t)=>this.getDropdownValueSignature(e)!==this.getDropdownValueSignature(t);onSelectionCounterValueChange=({detail:e})=>{this.emitSelectionStateChanged({count:e})};onSelectionAdd=e=>{e.stopPropagation(),this.isDisabledState||this.addToCart.emit({primaryValue:this.primaryValue,secondaryValue:this.secondaryValue,count:this.count})};onSelectionRemove=e=>{e.stopPropagation(),this.isDisabledState||this.removeFromCart.emit()};onDropdownOptionSelected=e=>({detail:t})=>{this.emitSelectionStateChanged("primary"===e?{primaryValue:t.value}:{secondaryValue:t.value})};onAccordionChanged=({detail:e})=>{this.isAccordionOpen=e};ensureDesktopOpenWithoutToggle=()=>{!this.isDesktopResolution||this.hasDesktopAccordionToggle||this.isAccordionOpen||(this.isAccordionOpen=!0)};onBottomAccordionToggle=e=>{e.preventDefault(),e.stopPropagation(),this.isAccordionOpen?this.accordionEl?.close():this.accordionEl?.open()};onHeaderAccordionToggle=e=>{e.preventDefault(),e.stopPropagation(),this.onBottomAccordionToggle(e)};onBottomLinkClick=e=>{e.preventDefault(),e.stopPropagation(),this.isDisabledState||this.bottomLinkClick.emit(this.bottomLinkText??"")};onBenefitLinkClick=e=>{e.preventDefault(),e.stopPropagation(),this.isDisabledState||this.benefitLinkClick.emit(this.benefitLink??"")};isInteractiveCardClick=e=>e.composedPath().some((e=>e instanceof HTMLElement&&d.INTERACTIVE_CLICK_TAGS.has(e.tagName)));onCardClick=e=>{this.isSelectable&&(this.isInteractiveCardClick(e)||this.cardClick.emit())};async focusSelectionTarget(){this.focusTargetEl?.focus()}renderTopBadge=()=>this.topBadge?i("div",{class:"snicker-card__badge"},this.topBadge):null;renderSubscriptionStrip=()=>this.isSubscribedState&&this.subscriptionLabel?i("div",{class:"subscription-strip"},i("p",{class:"subscription-strip__label"},this.subscriptionLabel)):null;renderSelection=()=>{if(!this.selectionConfig)return null;const{primaryDropdown:e,secondaryDropdown:t,stepper:o,addButtonLabel:r,removeButtonLabel:n}=this.selectionConfig,a=this.isInCart,s=this.isDisabledState,c=this.count??o?.value??o?.min,d=a?n??l("components-snicker-card-remove-from-cart"):r??l("components-snicker-card-add-to-cart");return i("div",{class:{selection:!0,"selection--before-switch":!!this.segmentSwitch}},e&&i("tet-dropdown",{class:"selection__dropdown",theme:this.theme,label:e.label,buttonLabel:e.buttonLabel,options:e.options,disabled:s||(e.disabled??!1),closeOnSelection:e.closeOnSelection??!0,onOptionSelected:this.onDropdownOptionSelected("primary")}),t&&i("tet-dropdown",{class:"selection__dropdown",theme:this.theme,label:t.label,buttonLabel:t.buttonLabel,options:t.options,disabled:s||(t.disabled??!1),closeOnSelection:t.closeOnSelection??!0,onOptionSelected:this.onDropdownOptionSelected("secondary")}),o&&i("tet-stepper-input",{class:"selection__stepper",theme:this.theme,disabled:s,value:c,displayMode:this.isDesktopResolution?"input":"text",min:o.min,max:o.max,step:o.step??1,accessibilityLabel:o.label,onInputValueChanged:this.onSelectionCounterValueChange}),!a&&i("tet-button",{class:"selection__button",onClick:this.onSelectionAdd,size:"medium",type:"primary",theme:this.theme,disabled:s,iconName:"tc-cart-outline",iconPosition:"left",accessibilityLabel:d},d),a&&i("tet-button",{class:"selection__button selection__button--in-cart selection__button--mobile",onClick:this.onSelectionRemove,size:"medium",type:"secondary",theme:this.theme,disabled:s,iconName:"tc-trash",iconPosition:"left",accessibilityLabel:d},d),a&&i("tet-button",{class:"selection__button selection__button--in-cart selection__button--desktop",onClick:this.onSelectionRemove,size:"medium",type:"primary",theme:this.theme,disabled:s,iconName:"tc-trash",iconMode:!0,iconPosition:"left",accessibilityLabel:d,customColorCode:"light"===this.theme?"#F7F7F7":"#18191B",customColorContentTone:"light"===this.theme?"dark":"light"}))};renderSegmentSwitch=()=>{if(!this.segmentSwitch)return null;const{values:e,defaultSelected:t,label:o}=this.segmentSwitch,r=t??e[0],n=this.isDisabledState||this.isUnavailableState;return i("div",{class:"segment-switch"},i("div",{class:{"segment-switch__label":!0,"segment-switch__label--disabled":n}},o),i("tet-tab-header",{class:"segment-switch__block",theme:this.theme,"default-tab":r,segmented:!0,mode:"switch",accessibilityLabel:o,sizing:this.isDesktopResolution?"web":"mobile",disabled:n,onTabSelected:e=>{e.stopPropagation(),void 0!==e.detail.old&&e.detail.old!==e.detail.new&&this.segmentSwitchChange.emit({value:String(e.detail.new),previousValue:String(e.detail.old)})}},e.map((e=>i("button",{"data-name":e},e)))))};renderBenefits=()=>{const e=this.benefits??[];let t="primary";return this.isDisabledState?t="quaternary":this.isUnavailableState&&(t="tertiary"),0!==e.length||this.benefitLink?i("ul",{class:"benefits with-divider"},e.map((e=>i("li",{class:"benefits__item"},i("tet-icon",{theme:this.theme,class:"benefits__icon",type:t,name:"tc-check"}),i("span",{class:"benefits__text"},e)))),this.benefitLink&&i("li",{class:"benefits__item"},i("tet-icon",{theme:this.theme,class:"benefits__icon",type:t,name:"tc-check"}),i("button",{type:"button",class:{"button-naked":!0,benefits__link:!0,"benefits__link--unavailable":this.isUnavailableState,"tet-link":!0,disabled:this.isDisabledState,[this.theme]:!0},disabled:this.isDisabledState,onClick:this.onBenefitLinkClick},this.benefitLink))):null};renderPackageItems=()=>{const e=this.packageItems??[];return 0===e.length?null:i("div",{class:"packages"},e.map((e=>i("div",{class:"packages__item"},i("img",{class:"packages__image",src:e,alt:"",loading:"lazy",decoding:"async"})))))};renderSubscriptionItems=()=>{const e=this.subscriptionItems??[];return 0===e.length?null:i("div",{class:"subscriptions with-divider"},e.map((e=>i("div",{class:"subscriptions__item"},i("img",{class:"subscriptions__image",src:e,alt:"",loading:"lazy",decoding:"async"})))))};renderInlineMessage=()=>{const e=this.inlineMessage;return e?i("div",{class:{message:!0,"with-divider":!0,"message--standalone":!this.selectionConfig}},i("tet-inline-message",{class:"message__inline",variant:e.variant??"info",theme:this.theme},i("span",{slot:"title"},e.title),i("span",{slot:"description"},e.message))):null};renderBottomLink=()=>this.bottomLinkText?i("button",{type:"button",class:{"button-naked":!0,"tet-link":!0,disabled:this.isDisabledState,[this.theme]:!0,footer__link:!0},disabled:this.isDisabledState,onClick:this.onBottomLinkClick},this.bottomLinkText):null;renderBottomToggle=()=>{const e=this.hasDesktopAccordionToggle,t=this.isAccordionOpen?this.accordionConfig?.openLabelDesktop:this.accordionConfig?.closedLabelDesktop;return e?i("button",{class:{footer__toggle:!0,"tet-link":!0,[this.theme]:!0},onClick:this.onBottomAccordionToggle},i("span",{class:"footer__toggle-label"},t),i("tet-icon",{theme:this.theme,class:{"footer__toggle-icon":!0,open:this.isAccordionOpen},type:"primary",name:"chevron-down"})):null};renderBottomSection=()=>{const e=!!this.bottomLinkText,t=!!this.bottomRemark;return e||t||this.hasDesktopAccordionToggle?i("div",{class:{footer:!0,"footer--desktop-only":!e&&!t}},i("div",{class:"footer__contract"},this.renderBottomLink(),t&&i("p",{class:"footer__remark"},this.bottomRemark)),this.renderBottomToggle()):null};renderIndicator=()=>{const e=this.indicator;return e?"checkbox"===e.type?i("tet-checkbox",{class:"header__selector",theme:this.theme,checked:this.isSelectedState,disabled:this.isDisabledState,unavailable:this.isUnavailableState,iconName:e.iconName,labelFont:"lg-inter",label:this.cardTitle,"aria-hidden":!0,inert:!0,alignCenter:!1},i("slot",{name:"indicator-label-icon",slot:"label-icon"})):"radio"===e.type?i("tet-radio",{class:"header__selector",theme:this.theme,checked:this.isSelectedState,disabled:this.isDisabledState,unavailable:this.isUnavailableState,iconName:e.iconName,label:this.cardTitle,labelFont:"lg-inter","aria-hidden":!0,inert:!0},i("slot",{name:"indicator-label-icon",slot:"label-icon"})):void 0:i("slot",{name:"indicator-label-icon"})};renderHeader=()=>{const e=this.price,t=!!e;let o=-1;this.isSelectable&&(o="radio"!==this.selectionType||this.isTabStop?0:-1);const r="price"===e?.type;let n,s;if(r){const t={decimalSeparator:",",currency:""};n=c(e.value,t),s=void 0===e.oldValue?void 0:c(e.oldValue,t)}else n=e?.value,s=e?.oldValue;const l=r?e?.prefix:void 0,d=r?e?.suffix:void 0;return i("div",{class:{header:!0,"header--hoverable":this.isHoverable,"header--closed":!this.isAccordionOpen,"header--no-price":!t}},i("div",{class:"header__top"},i("div",{class:"header__top-left","data-selection-target":"true",ref:e=>this.focusTargetEl=e??void 0,tabindex:o,onKeyDown:this.isSelectable?a:void 0,role:this.isSelectable?this.selectionType:void 0,"aria-checked":this.isSelectable?String(this.isSelectedState):void 0},this.renderIndicator(),!this.indicator&&i("h3",{class:"header__title"},this.cardTitle)),i("button",{type:"button",class:"header__accordion-toggle",onClick:this.onHeaderAccordionToggle},i("tet-icon",{theme:this.theme,class:{"header__accordion-toggle-icon":!0,open:this.isAccordionOpen},type:"primary",name:"chevron-down"}))),i("div",{class:"header__content"},this.subtitle&&i("p",{class:"header__subtitle"},this.subtitle),t&&i("div",{class:"header__price-line"},i("div",{class:"header__price-main"},l&&i("span",{class:"header__price-prefix"},l),i("span",{class:"header__price-value"},n),d&&i("span",{class:"header__price-suffix"},d)),s&&i("div",{class:"header__old-price"},s,d?` ${d}`:"")),this.description&&i("p",{class:"header__description"},this.description)))};render(){return i(n,{key:"3be442b3f32bb608b25380921cead039211d8ae5"},i("div",{key:"0d1c48eeef0e7c3565bc9c7f02e404185e1335f1",class:{"snicker-card":!0,[this.theme]:!0,"snicker-card--hoverable":this.isHoverable,"snicker-card--selected":this.isSelectedState&&!this.isDisabledState,"snicker-card--disabled":this.isDisabledState,"snicker-card--unavailable":this.isUnavailableState,"snicker-card--subscribed":this.isSubscribedState,"snicker-card--with-badge":!!this.topBadge},onClick:this.onCardClick},this.renderTopBadge(),this.renderSubscriptionStrip(),i("tet-accordion",{key:"a1195aa2bfac1a5473e9482e3330c9a689b04d05",ref:e=>this.accordionEl=e,class:"accordion",theme:this.theme,isOpen:this.isAccordionOpen,onOpenChanged:this.onAccordionChanged,transparentBackground:!0,isHeaderInteractive:!1},i("div",{key:"29f135ef5e3048c39041e2eb5e7d5f62d050c14b",slot:"header",class:"accordion__header"},this.renderHeader()),i("div",{key:"c8b6014cc8b98be1186687850f297c25913eacca",class:"accordion__content"},this.renderInlineMessage(),this.renderSelection(),this.renderSegmentSwitch(),this.renderBenefits(),this.renderPackageItems(),this.renderSubscriptionItems())),this.renderBottomSection()))}static get watchers(){return{accordionConfig:["onAccordionConfigChanged"],selectionConfig:["onSelectionConfigChanged"]}}};d.style=':host{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit;padding:0;margin:0}:host{--color-gray-light:#cdd2de;--color-ta070:#f5f6f8;--color-ta080:#e6e8ee;--color-ta100:#cdd2de;--color-ta200:#9ba5be;--color-ta300:#69789c;--color-ta500:#1e356a;--color-ta600:#051d59;--color-tc090:#d6e6fd;--color-tc100:#d1dffe;--color-tc300:#75a1fb;--color-tc500:#1a70f6;--color-tc600:#0060f5;--color-td500:#00F1F2;--color-td600:#01cbe0;--color-tf600:#f53b2a;--color-tg300:#2b3036;--color-tg400:#1d2128;--color-tg500:#12171e;--color-tg600:#01050c;--color-th500:#f5f5f5;--color-ti500:#869198;--color-ti600:#aeb7bc;--text-font:Gilroy, serif;--text-color-darker:var(--color-ta600);--text-color-dark:var(--color-ta500);--text-color-dark-theme:var(--color-th500);--icons-font:Tet Icons, serif}.icon.tet-search{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-search::before{content:"\\e86e"}.icon.tet-close-circled{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-close-circled::before{content:"\\e85a"}.icon.tet-close{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-close::before{content:"\\e85b"}.icon.tet-check-circled{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-check-circled::before{content:"\\e86c"}.icon.tet-check{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-check::before{content:"\\e855"}.icon.tet-chevron-up{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-chevron-up::before{content:"\\e859"}.icon.tet-chevron-down{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-chevron-down::before{content:"\\e856"}.icon.tet-clipboard{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-clipboard::before{content:"\\e86a"}.icon.tet-info{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-info::before{content:"\\e81d"}.icon.tet-done{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-done::before{content:"\\e867"}@font-face{font-family:"Gilroy";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/Gilroy-W05-Semibold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Semibold.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:700;font-display:swap;src:url("assets/fonts/Gilroy-W05-Bold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Bold.woff") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/Inter-Regular.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Regular.woff?v=3.19") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/Inter-Medium.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Medium.woff?v=3.19") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/Inter-SemiBold.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-SemiBold.woff?v=3.19") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/Gilroy-W05-Semibold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Semibold.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:700;font-display:swap;src:url("assets/fonts/Gilroy-W05-Bold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Bold.woff") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/Inter-Regular.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Regular.woff?v=3.19") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/Inter-Medium.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Medium.woff?v=3.19") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/Inter-SemiBold.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-SemiBold.woff?v=3.19") format("woff")}:host{--font-family-fallback:Gilroy, Arial, sans-serif;--font-family-headline:Gilroy;--font-family-content:Inter, var(--font-family-fallback);font-family:var(--font-family-content)}@font-face{font-family:"Gilroy";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/Gilroy-W05-Semibold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Semibold.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:700;font-display:swap;src:url("assets/fonts/Gilroy-W05-Bold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Bold.woff") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/Inter-Regular.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Regular.woff?v=3.19") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/Inter-Medium.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Medium.woff?v=3.19") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/Inter-SemiBold.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-SemiBold.woff?v=3.19") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/Gilroy-W05-Semibold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Semibold.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:700;font-display:swap;src:url("assets/fonts/Gilroy-W05-Bold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Bold.woff") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/Inter-Regular.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Regular.woff?v=3.19") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/Inter-Medium.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Medium.woff?v=3.19") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/Inter-SemiBold.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-SemiBold.woff?v=3.19") format("woff")}:host{--font-family-fallback:Gilroy, Arial, sans-serif;--font-family-headline:Gilroy;--font-family-content:Inter, var(--font-family-fallback);font-family:var(--font-family-content)}:root{--tet-link-color:var(--tc-text-primary);--tet-link-color-hover:var(--tc-text-secondary);--tet-link-color-active:var(--tc-text-tertiary);--tet-link-color-focus:var(--tc-blue-40);--tet-link-color-disabled:var(--tc-button-text-inverse-disabled);--tet-link-secondary-color:var(--tc-text-secondary);--tet-link-secondary-color-hover:var(--tc-text-primary)}.tet-link,.tet-link__arrow{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;color:var(--tet-link-color);position:relative;line-height:1.5rem;cursor:pointer}.tet-link.dark,.tet-link__arrow.dark{--tet-link-color:var(--tc-text-primary-dark);--tet-link-color-hover:var(--tc-text-secondary-dark);--tet-link-color-active:var(--tc-text-tertiary-dark);--tet-link-color-focus:var(--tc-blue-40-dark);--tet-link-color-disabled:var(--tc-button-text-inverse-disabled-dark);--tet-link-secondary-color:var(--tc-text-secondary-dark);--tet-link-secondary-color-hover:var(--tc-text-primary-dark)}.tet-link.tet-link--secondary,.tet-link__arrow.tet-link--secondary{--tet-link-color:var(--tet-link-secondary-color);--tet-link-color-hover:var(--tet-link-secondary-color-hover)}.tet-link tet-icon,.tet-link__arrow tet-icon{--icon-color:var(--tet-link-color)}.tet-link:hover,.tet-link__arrow:hover{color:var(--tet-link-color-hover)}.tet-link:hover tet-icon,.tet-link__arrow:hover tet-icon{--icon-color:var(--tet-link-color-hover)}.tet-link:active,.tet-link__arrow:active{color:var(--tet-link-color-active)}.tet-link:active tet-icon,.tet-link__arrow:active tet-icon{--icon-color:var(--tet-link-color-active)}.tet-link:focus-visible,.tet-link__arrow:focus-visible{outline:0.125rem solid var(--tc-blue-40);outline-offset:0.125rem;transition:outline 0s;outline-color:var(--tet-link-color-focus);border-radius:0.125rem}.tet-link.disabled,.tet-link__arrow.disabled{color:var(--tet-link-color-disabled);pointer-events:none;cursor:auto}.tet-link.disabled tet-icon,.tet-link__arrow.disabled tet-icon{--icon-color:var(--tet-link-color-disabled)}.tet-link.disabled:focus-visible,.tet-link__arrow.disabled:focus-visible{outline:none}.tet-link tet-icon,.tet-link__arrow tet-icon{padding-left:0.25rem;padding-right:0.25rem;--icon-container-display:inline-block}.tet-link__arrow{padding-right:1.5rem}.tet-link__arrow::after{content:"--\x3e";position:absolute;white-space:nowrap;display:inline-block;text-decoration:none;padding-left:0.25rem;letter-spacing:initial;transition:all 0.15s ease-in}.tet-link__arrow:hover::after{padding-left:0.375rem}:host{display:block}.light{--snicker-card-background:var(--tc-layer-primary);--snicker-card-subscribed-background:var(--tc-layer-secondary);--snicker-card-subscription-strip-background:var(--tc-layer-quaternary);--snicker-card-border-color:var(--tc-border-quaternary);--snicker-card-border-hover-color:var(--tc-border-secondary);--snicker-card-border-selected-color:var(--tc-border-primary);--snicker-card-divider:0.03125rem solid var(--tc-border-quaternary);--snicker-card-text-primary:var(--tc-text-primary);--snicker-card-text-secondary:var(--tc-text-secondary);--snicker-card-text-tertiary:var(--tc-text-tertiary);--snicker-card-unavailable-color:var(--tc-text-tertiary);--snicker-card-disabled-color:var(--tc-button-text-inverse-disabled);--snicker-card-toggle-color:var(--tc-text-primary);--snicker-card-shadow:var(--tc-elevation-one);--snicker-card-selected-shadow:var(--tc-elevation-two);--snicker-card-badge-background:var(--tc-yellow-40);--snicker-card-focus-outline-color:var(--tc-blue-40)}.dark{--snicker-card-background:var(--tc-layer-primary-dark);--snicker-card-subscribed-background:var(--tc-layer-secondary-dark);--snicker-card-subscription-strip-background:var(--tc-layer-quaternary-dark);--snicker-card-border-color:var(--tc-border-quaternary-dark);--snicker-card-border-hover-color:var(--tc-border-secondary-dark);--snicker-card-border-selected-color:var(--tc-border-primary-dark);--snicker-card-divider:0.03125rem solid var(--tc-border-quaternary-dark);--snicker-card-text-primary:var(--tc-text-primary-dark);--snicker-card-text-secondary:var(--tc-text-secondary-dark);--snicker-card-text-tertiary:var(--tc-text-tertiary-dark);--snicker-card-unavailable-color:var(--tc-text-tertiary-dark);--snicker-card-disabled-color:var(--tc-button-text-inverse-disabled-dark);--snicker-card-toggle-color:var(--tc-text-primary-dark);--snicker-card-shadow:var(--tc-elevation-one-dark);--snicker-card-selected-shadow:var(--tc-elevation-two-dark);--snicker-card-badge-background:var(--tc-yellow-40-dark);--snicker-card-focus-outline-color:var(--tc-blue-40-dark)}.snicker-card{position:relative;box-sizing:border-box;display:flex;flex-direction:column;width:100%;padding:1rem;border:0.0625rem solid var(--snicker-card-border-color);border-radius:1rem;background-color:var(--snicker-card-background);box-shadow:var(--snicker-card-shadow);color:var(--snicker-card-text-primary)}.snicker-card--hoverable{cursor:pointer}@media (hover: hover){.snicker-card--hoverable:hover{border-color:var(--snicker-card-border-hover-color);box-shadow:inset 0 0 0 0.0625rem var(--snicker-card-border-hover-color), var(--snicker-card-shadow)}}.snicker-card:has(.header__top-left:focus-visible){box-shadow:none;outline:0.125rem solid var(--tc-blue-40);outline-offset:0rem;transition:outline 0s}@media screen and (min-width: 31.25rem){.snicker-card{padding:1.5rem}}.snicker-card--with-badge{margin-top:0.875rem}.snicker-card--selected{border-color:var(--snicker-card-border-selected-color);box-shadow:inset 0 0 0 0.0625rem var(--snicker-card-border-selected-color), var(--snicker-card-selected-shadow)}.snicker-card--subscribed{background-color:var(--snicker-card-subscribed-background)}.snicker-card--unavailable{--snicker-card-text-primary:var(--snicker-card-unavailable-color);--snicker-card-text-secondary:var(--snicker-card-unavailable-color);--snicker-card-text-tertiary:var(--snicker-card-unavailable-color)}.snicker-card--disabled{--snicker-card-text-primary:var(--snicker-card-disabled-color);--snicker-card-text-secondary:var(--snicker-card-disabled-color);--snicker-card-text-tertiary:var(--snicker-card-disabled-color)}.snicker-card__badge{position:absolute;top:0;left:50%;transform:translateY(-50%) translateX(-50%);color:var(--tc-text-black-permanent);background-color:var(--snicker-card-badge-background);padding:0.375rem 1.25rem;border-radius:6.25rem;box-shadow:var(--snicker-card-shadow);width:fit-content;white-space:nowrap;font:600 0.75rem/1rem "Inter", "Gilroy, Arial, sans-serif"}@media (min-width: 26.375rem){.snicker-card__badge{left:1.5rem;transform:translateY(-50%) translateX(0)}}.subscription-strip{margin:-1rem -1rem 1rem;background-color:var(--snicker-card-subscription-strip-background);padding:0.75rem 1rem;border-top-left-radius:1rem;border-top-right-radius:1rem;box-sizing:border-box}@media screen and (min-width: 31.25rem){.subscription-strip{margin:-1.5rem -1.5rem 1rem;padding:0.75rem 1.5rem}}.subscription-strip__label{font:500 1rem/1.5rem "Inter", "Gilroy, Arial, sans-serif";margin:0;color:var(--snicker-card-text-primary)}.accordion{--accordion-background-color:transparent;--accordion-header-mobile-padding:0;--accordion-header-padding:0;--accordion-header-font:inherit;--accordion-header-mobile-font:inherit;--accordion-header-text-desktop-margin-right:0;--accordion-border-bottom-width:0;--accordion-outer-border:none;display:block;width:100%}.accordion__header{width:100%;cursor:default}.accordion__content{width:100%}.with-divider{border-top:var(--snicker-card-divider);padding-top:1rem}.button-naked{background:unset;border:unset;cursor:pointer;appearance:none}.header{display:flex;flex-direction:column;align-items:stretch;gap:0.25rem;padding-bottom:1rem}.header--hoverable{cursor:pointer}@media screen and (min-width: 31.25rem){.header{display:grid;grid-template-columns:minmax(0, 1fr) auto;grid-template-areas:"top price" "subtitle price" "description price";column-gap:1.5rem;row-gap:0.125rem;align-items:start}}.header--closed{padding-bottom:0.25rem}@media screen and (min-width: 31.25rem){.header--no-price{grid-template-columns:minmax(0, 1fr);grid-template-areas:"top" "subtitle" "description"}}.header__top{display:flex;align-items:start;justify-content:space-between;gap:0.75rem}@media screen and (min-width: 31.25rem){.header__top{grid-area:top;justify-content:flex-start}}.header__top-left{display:flex;align-items:center;gap:0.5rem;min-width:0;flex-wrap:wrap}.header__top-left:focus-visible{outline:none}.header__selector{pointer-events:none}.header__content{min-width:0;display:flex;flex-direction:column}@media screen and (min-width: 31.25rem){.header__content{display:contents}}.header__title{font:500 1.25rem/1.5rem "Inter", "Gilroy, Arial, sans-serif";margin:0;color:var(--snicker-card-text-primary)}.header__subtitle{font:500 0.875rem/1.25rem "Inter", "Gilroy, Arial, sans-serif";color:var(--snicker-card-text-primary)}@media screen and (min-width: 31.25rem){.header__subtitle{grid-area:subtitle}}.header__description{font:400 0.875rem/1.25rem "Inter", "Gilroy, Arial, sans-serif";margin:0;color:var(--snicker-card-text-secondary)}@media screen and (min-width: 31.25rem){.header__description{grid-area:description}}.header__price-line{display:flex;align-items:baseline;gap:0.5rem;margin:0.125rem 0 0;color:var(--snicker-card-text-primary);flex-wrap:nowrap}@media screen and (min-width: 31.25rem){.header__price-line{grid-area:price;flex-direction:column;align-items:flex-end;gap:0.1875rem;margin:0;align-self:start}}.header__accordion-toggle{border:0;background:transparent;padding:0;margin:0;border-radius:0.125rem;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;min-height:1.5rem}@media screen and (min-width: 31.25rem){.header__accordion-toggle{display:none}}.header__accordion-toggle:focus-visible{outline:0.125rem solid var(--tc-blue-40);outline-offset:0.0625rem;transition:outline 0s}.header__accordion-toggle-icon{--icon-size:1.25rem;--icon-container-display:flex;transition:transform 150ms ease-out}.header__accordion-toggle-icon.open{transform:rotate(-180deg)}.header__price-main{display:flex;align-items:baseline;gap:0.25rem;white-space:nowrap}.header__price-prefix{font:500 0.875rem/1.25rem "Inter", "Gilroy, Arial, sans-serif"}@media screen and (min-width: 31.25rem){.header__price-prefix{font:600 1rem/1.5rem "Inter", "Gilroy, Arial, sans-serif"}}.header__price-value{font:500 1rem/1.5rem "Inter", "Gilroy, Arial, sans-serif"}@media screen and (min-width: 31.25rem){.header__price-value{font:500 1.25rem/1.5rem "Inter", "Gilroy, Arial, sans-serif"}}.header__price-suffix{font:500 0.875rem/1.25rem "Inter", "Gilroy, Arial, sans-serif"}@media screen and (min-width: 31.25rem){.header__price-suffix{font:600 1rem/1.5rem "Inter", "Gilroy, Arial, sans-serif"}}.header__old-price{font:400 0.875rem/1.25rem "Inter", "Gilroy, Arial, sans-serif";color:var(--snicker-card-text-tertiary);text-decoration:line-through;white-space:nowrap}@media screen and (min-width: 31.25rem){.header__old-price{text-align:right}}.message{width:100%}.message--standalone{padding-bottom:1rem}.message__inline{width:100%;--inline-message-padding:0;--inline-message-border-bottom:none}.selection{width:100%;padding:1rem 0;display:flex;flex-direction:column;gap:1rem;align-items:stretch}@media screen and (min-width: 31.25rem){.selection{flex-direction:row;align-items:flex-end;flex-wrap:nowrap;gap:0.75rem}}.selection--before-switch{padding-bottom:0.5rem}.selection__dropdown{display:block;width:100%}@media screen and (min-width: 31.25rem){.selection__dropdown{flex:1 1 0;width:auto;min-width:0}}.selection__stepper{display:block;align-self:center}@media screen and (min-width: 31.25rem){.selection__stepper{flex:0 0 auto;align-self:flex-end}}.selection__button{align-self:center;--button-padding-medium:0.625rem 1rem}@media screen and (min-width: 31.25rem){.selection__button{flex:0 0 auto;align-self:flex-end;margin-left:auto}}.selection__button::part(button){transition:none}@media screen and (min-width: 31.25rem){.selection__button--in-cart{--button-padding-medium:0.625rem}}.selection__button--desktop{display:none}@media screen and (min-width: 31.25rem){.selection__button--desktop{display:inline-flex}}@media screen and (min-width: 31.25rem){.selection__button--mobile{display:none}}.segment-switch{display:block;padding-bottom:1rem}.segment-switch__label{padding:0 0.25rem 0.25rem;font:500 0.875rem/1.25rem "Inter", "Gilroy, Arial, sans-serif"}@media screen and (min-width: 31.25rem){.segment-switch__label{font:500 1rem/1.5rem "Inter", "Gilroy, Arial, sans-serif"}}.segment-switch__label--disabled{color:var(--snicker-card-text-tertiary)}.segment-switch__block{display:block;width:100%}.benefits{list-style:none;margin:0;display:flex;flex-direction:column;gap:0.25rem}.benefits:not(:last-child){padding-bottom:1rem}.benefits__item{display:flex;align-items:center;gap:0.5rem}.benefits__icon{--icon-size:1rem;--icon-container-display:flex}.benefits__text{font:400 0.875rem/1.25rem "Inter", "Gilroy, Arial, sans-serif";color:var(--snicker-card-text-primary)}.benefits__link{font:400 0.875rem/1.25rem "Inter", "Gilroy, Arial, sans-serif"}.benefits__link--unavailable{--tet-link-color:var(--snicker-card-unavailable-color);--tet-link-color-hover:var(--snicker-card-unavailable-color);--tet-link-color-active:var(--snicker-card-unavailable-color)}.packages{padding-bottom:1rem;display:flex;flex-wrap:wrap;gap:1rem}.packages__item{display:inline-flex;align-items:center}.packages__image{display:block;width:auto;height:1.5rem}.subscriptions{display:flex;flex-direction:row;flex-wrap:wrap;gap:0 1rem;padding:0.25rem 0 0 0}.subscriptions__item{max-height:3rem;display:inline-flex;align-items:center}.subscriptions__image{display:block;width:auto}.footer{padding-top:0.75rem;display:flex;align-items:flex-end;justify-content:space-between;gap:1rem}.footer--desktop-only{display:none}@media screen and (min-width: 31.25rem){.footer--desktop-only{display:block;text-align:right}}.footer__contract{display:flex;flex:1 1 auto;min-width:0;flex-direction:column;align-items:flex-start;gap:0.625rem}.footer__link{font:400 0.875rem/1.25rem "Inter", "Gilroy, Arial, sans-serif"}.footer__remark{font:400 0.875rem/1.25rem "Inter", "Gilroy, Arial, sans-serif";margin:0;color:var(--snicker-card-text-secondary);overflow-wrap:anywhere}.footer__toggle{font:400 1.125rem/1.75rem "Inter", "Gilroy, Arial, sans-serif";border:0;background:transparent;border-radius:0.125rem;color:var(--snicker-card-toggle-color);align-items:center;gap:0;padding:0;white-space:nowrap;cursor:pointer;display:none}@media screen and (min-width: 31.25rem){.footer__toggle{display:inline-flex}}.footer__toggle:focus-visible{outline:0.125rem solid var(--tc-blue-40);outline-offset:0.0625rem;transition:outline 0s}.footer__toggle-icon{--icon-size:1.25rem;--icon-container-display:flex;transition:transform 150ms ease-out}.footer__toggle-icon.open{transform:rotate(-180deg)}';export{d as tet_snicker_card}
|