@scania/tegel 0.0.52 → 0.0.71-beta

package/dist/tegel/p-a5cd0006.entry.js

@@ -1,2 +0,0 @@
-import{r as o,h as t,H as a,g as s}from"./p-387e1798.js";const i=":host{display:block}:host .footer-top{background-color:var(--sdds-footer-top-background);padding:40px}:host .footer-top ::slotted(*){display:grid;grid-template-columns:1fr 1fr 1fr 1fr;row-gap:40px;width:100%}:host .footer-main{background-color:var(--sdds-footer-main-background);padding:0 40px}:host .footer-main-top{padding:40px 0;display:flex;justify-content:space-between}:host .footer-bottom-right ::slotted(*),:host .footer-bottom-left ::slotted(*){display:flex;column-gap:24px}:host .footer-main-bottom{padding:40px 0;display:flex;justify-content:space-between;border-top:1px solid var(--sdds-footer-main-divider)}:host .footer-main-bottom small.copyright{margin:0;font:var(--sdds-detail-02);letter-spacing:var(--sdds-detail-02-ls);color:var(--sdds-footer-main-copyright)}:host .footer-main-bottom .brand{background-image:var(--sdds-background-image-scania-wordmark-white-svg);background-repeat:no-repeat;background-size:117px;background-position:right;width:117px;height:20px}:host .footer-main-bottom .brand p{color:transparent;padding:0;margin:0;height:100%;visibility:hidden}@media all and (max-width: 992px){:host .footer-top{padding:0}:host .footer-top ::slotted(*){display:block;width:100%}:host .footer-main{padding:0 24px}:host .footer-main-top{flex-direction:column;row-gap:48px;padding:24px 0}:host .footer-bottom-left ::slotted(*){flex-direction:column;gap:8px}:host .footer-main-bottom{flex-direction:column;padding-bottom:32px}:host .footer-main-bottom p.copyright{padding-bottom:96px}:host .footer-main-bottom .brand{width:100%}}";const r=class{constructor(t){o(this,t);this.modeVariant=null;this.hasTopPart=undefined}connectedCallback(){const o=Array.from(this.host.children);this.hasTopPart=o.some((o=>o.slot==="top"))}render(){return t(a,{class:`${this.modeVariant?`sdds-mode-variant-${this.modeVariant}`:""}`},t("footer",null,this.hasTopPart&&t("div",{class:"footer-top"},t("slot",{name:"top"})),t("div",{class:"footer-main"},t("div",{class:"footer-main-top"},t("div",{class:"footer-bottom-left"},t("slot",{name:"main-left"})),t("div",{class:"footer-bottom-right"},t("slot",{name:"main-right"}))),t("div",{class:"footer-main-bottom"},t("small",{class:"copyright"},"Copyright © ",(new Date).getFullYear()," Scania"),t("div",{class:"brand"},t("p",null,"Scania"))))))}get host(){return s(this)}};r.style=i;export{r as sdds_footer};
-//# sourceMappingURL=p-a5cd0006.entry.js.map

package/dist/tegel/p-a5cd0006.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["sddsFooterCss","SddsFooter","connectedCallback","children","Array","from","this","host","hasTopPart","some","element","slot","render","h","Host","class","modeVariant","name","Date","getFullYear"],"sources":["./src/components/footer/webcomponent/sdds-footer.scss?tag=sdds-footer&encapsulation=shadow","./src/components/footer/webcomponent/sdds-footer.tsx"],"sourcesContent":[":host {\n  display: block;\n\n  $grid-xs: 0;\n  $grid-sm: 608px;\n  $grid-md: 800px;\n  $grid-lg: 992px;\n  $grid-xlg: 1184px;\n  $grid-xxlg: 1376px;\n  $grid-max: 1584px;\n\n  .footer-top {\n    background-color: var(--sdds-footer-top-background);\n    padding: 40px;\n\n    ::slotted(*) {\n      display: grid;\n      grid-template-columns: 1fr 1fr 1fr 1fr;\n      row-gap: 40px;\n      width: 100%;\n    }\n  }\n\n  .footer-main {\n    background-color: var(--sdds-footer-main-background);\n    padding: 0 40px;\n  }\n\n  .footer-main-top {\n    padding: 40px 0;\n    display: flex;\n    justify-content: space-between;\n  }\n\n  .footer-bottom-right,\n  .footer-bottom-left {\n    ::slotted(*) {\n      display: flex;\n      column-gap: 24px;\n    }\n  }\n\n  .footer-main-bottom {\n    padding: 40px 0;\n    display: flex;\n    justify-content: space-between;\n    border-top: 1px solid var(--sdds-footer-main-divider);\n\n    small.copyright {\n      margin: 0;\n      font: var(--sdds-detail-02);\n      letter-spacing: var(--sdds-detail-02-ls);\n      color: var(--sdds-footer-main-copyright);\n    }\n\n    .brand {\n      background-image: var(--sdds-background-image-scania-wordmark-white-svg);\n      background-repeat: no-repeat;\n      background-size: 117px;\n      background-position: right;\n      width: 117px;\n      height: 20px;\n\n      p {\n        color: transparent;\n        padding: 0;\n        margin: 0;\n        height: 100%;\n        visibility: hidden;\n      }\n    }\n  }\n\n  @media all and (max-width: $grid-lg) {\n    .footer-top {\n      padding: 0;\n\n      ::slotted(*) {\n        display: block;\n        width: 100%;\n      }\n    }\n\n    .footer-main {\n      padding: 0 24px;\n    }\n\n    .footer-main-top {\n      flex-direction: column;\n      row-gap: 48px;\n      padding: 24px 0;\n    }\n\n    .footer-bottom-left {\n      ::slotted(*) {\n        flex-direction: column;\n        gap: 8px;\n      }\n    }\n\n    .footer-main-bottom {\n      flex-direction: column;\n      padding-bottom: 32px;\n\n      p.copyright {\n        padding-bottom: 96px;\n      }\n\n      .brand {\n        width: 100%;\n      }\n    }\n  }\n}\n","import { Component, h, State, Element } from '@stencil/core';\nimport { Host, HostElement, Prop } from '@stencil/core/internal';\n\n@Component({\n  tag: 'sdds-footer',\n  styleUrl: 'sdds-footer.scss',\n  shadow: true,\n})\nexport class SddsFooter {\n  /** Mode variant of the component, based on current mode. */\n  @Prop() modeVariant: 'primary' | 'secondary' = null;\n\n  @State() hasTopPart: boolean;\n\n  @Element() host: HostElement;\n\n  connectedCallback() {\n    const children = Array.from(this.host.children);\n    this.hasTopPart = children.some((element) => element.slot === 'top');\n  }\n\n  render() {\n    return (\n      <Host class={`${this.modeVariant ? `sdds-mode-variant-${this.modeVariant}` : ''}`}>\n        <footer>\n          {this.hasTopPart && (\n            <div class=\"footer-top\">\n              <slot name=\"top\"></slot>\n            </div>\n          )}\n          <div class=\"footer-main\">\n            <div class=\"footer-main-top\">\n              <div class=\"footer-bottom-left\">\n                <slot name=\"main-left\"></slot>\n              </div>\n              <div class=\"footer-bottom-right\">\n                <slot name=\"main-right\"></slot>\n              </div>\n            </div>\n            <div class=\"footer-main-bottom\">\n              <small class=\"copyright\">Copyright &#169; {new Date().getFullYear()} Scania</small>\n              <div class=\"brand\">\n                <p>Scania</p>\n              </div>\n            </div>\n          </div>\n        </footer>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAgB,ihD,MCQTC,EAAU,M,0CAE0B,K,0BAM/CC,oBACE,MAAMC,EAAWC,MAAMC,KAAKC,KAAKC,KAAKJ,UACtCG,KAAKE,WAAaL,EAASM,MAAMC,GAAYA,EAAQC,OAAS,O,CAGhEC,SACE,OACEC,EAACC,EAAI,CAACC,MAAO,GAAGT,KAAKU,YAAc,qBAAqBV,KAAKU,cAAgB,MAC3EH,EAAA,cACGP,KAAKE,YACJK,EAAA,OAAKE,MAAM,cACTF,EAAA,QAAMI,KAAK,SAGfJ,EAAA,OAAKE,MAAM,eACTF,EAAA,OAAKE,MAAM,mBACTF,EAAA,OAAKE,MAAM,sBACTF,EAAA,QAAMI,KAAK,eAEbJ,EAAA,OAAKE,MAAM,uBACTF,EAAA,QAAMI,KAAK,iBAGfJ,EAAA,OAAKE,MAAM,sBACTF,EAAA,SAAOE,MAAM,aAAW,gBAAmB,IAAIG,MAAOC,cAAa,WACnEN,EAAA,OAAKE,MAAM,SACTF,EAAA,uB"}

package/dist/tegel/p-ad3439b8.entry.js

@@ -1,2 +0,0 @@
-import{r as d,c as s,h as o,g as t}from"./p-387e1798.js";const r='.sc-sdds-radio-button:root,.sdds-mode-light.sc-sdds-radio-button{--sdds-radio-button-color:var(--sdds-grey-958);--sdds-radio-button-interaction-01:var(--sdds-blue-800);--sdds-radio-button-interaction-02:var(--sdds-white);--sdds-radio-button-background-hover:var(--sdds-blue-800);--sdds-radio-button-background-focus:var(--sdds-blue-800);--sdds-radio-button-disabled:var(--sdds-grey-600);--sdds-radio-button-border-color-disabled-after:var(--sdds-grey-700);--sdds-radio-button-color-disabled-after:var(--sdds-grey-700);--sdds-radio-button-color-disabled-before:var(--sdds-grey-700)}.sdds-mode-dark.sc-sdds-radio-button{--sdds-radio-button-color:var(--sdds-white);--sdds-radio-button-interaction-01:var(--sdds-white);--sdds-radio-button-interaction-02:var(--sdds-grey-958);--sdds-radio-button-background-hover:var(--sdds-white);--sdds-radio-button-background-focus:var(--sdds-white);--sdds-radio-button-disabled:var(--sdds-grey-600);--sdds-radio-button-border-color-disabled-after:var(--sdds-grey-700);--sdds-radio-button-color-disabled-after:var(--sdds-grey-700)}.sdds-radio-button.sc-sdds-radio-button{box-sizing:border-box;display:flex;align-items:center;margin-left:-4px;font:var(--sdds-detail-02);letter-spacing:var(--sdds-detail-02-ls);color:var(--sdds-radio-button-color)}.sdds-radio-button.sc-sdds-radio-button *.sc-sdds-radio-button{box-sizing:border-box}.sdds-radio-button.sc-sdds-radio-button .sdds-form-input[type=radio].sc-sdds-radio-button{appearance:none;outline:none;margin:0;border:0;width:24px;height:24px;border-radius:50%;position:relative;cursor:pointer}.sdds-radio-button.sc-sdds-radio-button .sdds-form-input[type=radio].sc-sdds-radio-button+label.sc-sdds-radio-button{padding:var(--sdds-spacing-element-4) 0 var(--sdds-spacing-element-4) var(--sdds-spacing-element-4);cursor:pointer}.sdds-radio-button.sc-sdds-radio-button .sdds-form-input[type=radio].sc-sdds-radio-button::before,.sdds-radio-button.sc-sdds-radio-button .sdds-form-input[type=radio].sc-sdds-radio-button::after{content:"";position:absolute;border-radius:50%;box-sizing:border-box}.sdds-radio-button.sc-sdds-radio-button .sdds-form-input[type=radio].sc-sdds-radio-button::before{width:24px;height:24px;left:0;top:0}.sdds-radio-button.sc-sdds-radio-button .sdds-form-input[type=radio].sc-sdds-radio-button::after{border:1px solid var(--sdds-radio-button-interaction-01);background-color:var(--sdds-radio-button-interaction-02);width:16px;height:16px;left:4px;top:4px}.sdds-radio-button.sc-sdds-radio-button .sdds-form-input[type=radio].sc-sdds-radio-button:hover::before{background-color:var(--sdds-radio-button-background-hover);opacity:0.12}.sdds-radio-button.sc-sdds-radio-button .sdds-form-input[type=radio].sc-sdds-radio-button:focus::before{background-color:var(--sdds-radio-button-background-focus);opacity:0.24;animation:rb-focus 0.4s cubic-bezier(0.65, 0.05, 0.38, 0.95) forwards}.sdds-radio-button.sc-sdds-radio-button .sdds-form-input[type=radio].sc-sdds-radio-button:disabled,.sdds-radio-button.sc-sdds-radio-button .sdds-form-input[type=radio].disabled.sc-sdds-radio-button{cursor:not-allowed}.sdds-radio-button.sc-sdds-radio-button .sdds-form-input[type=radio].sc-sdds-radio-button:disabled::after,.sdds-radio-button.sc-sdds-radio-button .sdds-form-input[type=radio].disabled.sc-sdds-radio-button::after{border-color:var(--sdds-radio-button-border-color-disabled-after);background-color:var(--sdds-radio-button-interaction-02)}.sdds-radio-button.sc-sdds-radio-button .sdds-form-input[type=radio].sc-sdds-radio-button:disabled+label.sc-sdds-radio-button,.sdds-radio-button.sc-sdds-radio-button .sdds-form-input[type=radio].disabled.sc-sdds-radio-button+label.sc-sdds-radio-button{color:var(--sdds-radio-button-disabled);cursor:not-allowed}.sdds-radio-button.sc-sdds-radio-button .sdds-form-input[type=radio].sc-sdds-radio-button:disabled:hover::before,.sdds-radio-button.sc-sdds-radio-button .sdds-form-input[type=radio].disabled.sc-sdds-radio-button:hover::before{display:none;opacity:1}.sdds-radio-button.sc-sdds-radio-button .sdds-form-input[type=radio].sc-sdds-radio-button:checked::after{border:4px solid var(--sdds-radio-button-interaction-01)}.sdds-radio-button.sc-sdds-radio-button .sdds-form-input[type=radio].sc-sdds-radio-button:checked:disabled:hover::before,.sdds-radio-button.sc-sdds-radio-button .sdds-form-input[type=radio].sc-sdds-radio-button:checked:disabled::before,.sdds-radio-button.sc-sdds-radio-button .sdds-form-input[type=radio].sc-sdds-radio-button:checked.disabled:hover::before,.sdds-radio-button.sc-sdds-radio-button .sdds-form-input[type=radio].sc-sdds-radio-button:checked.disabled::before{display:block;width:16px;height:16px;left:4px;top:4px;border:1px solid var(--sdds-radio-button-color-disabled-before);box-sizing:content-box}.sdds-radio-button.sc-sdds-radio-button .sdds-form-input[type=radio].sc-sdds-radio-button:checked:disabled::after,.sdds-radio-button.sc-sdds-radio-button .sdds-form-input[type=radio].sc-sdds-radio-button:checked.disabled::after{border:4px solid var(--sdds-radio-button-interaction-02);background-color:var(--sdds-radio-button-color-disabled-after);left:5px;top:5px}@keyframes rb-focus{0%{transform:scale(0);opacity:0}100%{transform:scale(1);opacity:0.24}}';const i=class{constructor(o){d(this,o);this.sddsChange=s(this,"sddsChange",7);this.name=undefined;this.value=undefined;this.radioId=crypto.randomUUID();this.checked=false;this.required=false;this.disabled=false}render(){return o("div",{class:"sdds-radio-button"},o("input",{class:"sdds-form-input",type:"radio",name:this.name,id:this.radioId,value:this.value,checked:this.checked,"aria-checked":this.checked,required:this.required,disabled:this.disabled,onChange:()=>{this.sddsChange.emit({radioId:this.radioId,value:this.value})}}),o("label",{htmlFor:this.radioId},o("slot",{name:"label"})))}get host(){return t(this)}};i.style=r;export{i as sdds_radio_button};
-//# sourceMappingURL=p-ad3439b8.entry.js.map

package/dist/tegel/p-ad3439b8.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["radioButtonComponentCss","RadioButton","crypto","randomUUID","render","h","class","type","name","this","id","radioId","value","checked","required","disabled","onChange","sddsChange","emit","htmlFor"],"sources":["./src/components/radio-button/radio-button-component.scss?tag=sdds-radio-button&encapsulation=scoped","./src/components/radio-button/radio-button.tsx"],"sourcesContent":["@import './radio-button-vars.scss';\n@import '../../mixins/box-sizing';\n\n.sdds-radio-button {\n  @include sdds-box-sizing;\n\n  display: flex;\n  align-items: center;\n  margin-left: -4px;\n  font: var(--sdds-detail-02);\n  letter-spacing: var(--sdds-detail-02-ls);\n  color: var(--sdds-radio-button-color);\n\n  .sdds-form-input[type='radio'] {\n    appearance: none;\n    outline: none;\n    margin: 0;\n    border: 0;\n    width: 24px;\n    height: 24px;\n    border-radius: 50%;\n    position: relative;\n    cursor: pointer;\n\n    + label {\n      padding: var(--sdds-spacing-element-4) 0 var(--sdds-spacing-element-4)\n        var(--sdds-spacing-element-4);\n      cursor: pointer;\n    }\n\n    &::before,\n    &::after {\n      content: '';\n      position: absolute;\n      border-radius: 50%;\n      box-sizing: border-box;\n    }\n\n    &::before {\n      width: 24px;\n      height: 24px;\n      left: 0;\n      top: 0;\n    }\n\n    &::after {\n      border: 1px solid var(--sdds-radio-button-interaction-01);\n      background-color: var(--sdds-radio-button-interaction-02);\n      width: 16px;\n      height: 16px;\n      left: 4px;\n      top: 4px;\n    }\n\n    &:hover {\n      &::before {\n        background-color: var(--sdds-radio-button-background-hover);\n        opacity: 0.12;\n      }\n    }\n\n    &:focus {\n      &::before {\n        background-color: var(--sdds-radio-button-background-focus);\n        opacity: 0.24;\n        animation: rb-focus 0.4s cubic-bezier(0.65, 0.05, 0.38, 0.95) forwards;\n      }\n    }\n\n    &:disabled,\n    &.disabled {\n      cursor: not-allowed;\n\n      &::after {\n        border-color: var(--sdds-radio-button-border-color-disabled-after);\n        background-color: var(--sdds-radio-button-interaction-02);\n      }\n\n      + label {\n        color: var(--sdds-radio-button-disabled);\n        cursor: not-allowed;\n      }\n\n      &:hover {\n        &::before {\n          display: none;\n          opacity: 1;\n        }\n      }\n    }\n  }\n\n  .sdds-form-input[type='radio']:checked {\n    &::after {\n      border: 4px solid var(--sdds-radio-button-interaction-01);\n    }\n\n    &:disabled,\n    &.disabled {\n      &:hover::before,\n      &::before {\n        display: block;\n        width: 16px;\n        height: 16px;\n        left: 4px;\n        top: 4px;\n        border: 1px solid var(--sdds-radio-button-color-disabled-before);\n        box-sizing: content-box;\n      }\n\n      &::after {\n        border: 4px solid var(--sdds-radio-button-interaction-02);\n        background-color: var(--sdds-radio-button-color-disabled-after);\n        left: calc(4px + 1px);\n        top: calc(4px + 1px);\n      }\n    }\n  }\n\n  @keyframes rb-focus {\n    0% {\n      transform: scale(0);\n      opacity: 0;\n    }\n\n    100% {\n      transform: scale(1);\n      opacity: 0.24;\n    }\n  }\n}\n","import { Component, h, Prop, Event, EventEmitter, Element } from '@stencil/core';\nimport { HostElement } from '@stencil/core/internal';\n\n@Component({\n  tag: 'sdds-radio-button',\n  styleUrl: 'radio-button-component.scss',\n  shadow: false,\n  scoped: true,\n})\nexport class RadioButton {\n  /** Name of radio button, used for reference. */\n  @Prop() name: string;\n\n  /** Value of input. */\n  @Prop() value: string;\n\n  /** REMEMBER TO ENABLE ARIA PROPS ONCE ALIGNMET HAS BEEN MADE! */\n\n  /** Label mainly used for accesibility tools. */\n  // @Prop() ariaLabelledBy: string;\n\n  /** Label mainly used for accesibility tools. */\n  // @Prop() ariaDescribedBy: string;\n\n  /** Unique radio button identifier. */\n  @Prop() radioId: string = crypto.randomUUID();\n\n  /** Decides if the radio button is checked or not. */\n  @Prop({ reflect: true }) checked: boolean = false;\n\n  /** Decides if the radio button is required or not. */\n  @Prop() required: boolean = false;\n\n  /** Decides if the radio button is disabled or not. */\n  @Prop() disabled: boolean = false;\n\n  @Element() host: HostElement;\n\n  /** Sends unique radio button identifier and status when it is checked. If no ID is specified a random one will be generated. To use this listener don't use the randomized ID, use a specific one of your choosing. */\n  @Event({\n    eventName: 'sddsChange',\n    composed: true,\n    cancelable: true,\n    bubbles: true,\n  })\n  sddsChange: EventEmitter<{\n    radioId: string;\n    value: string;\n  }>;\n\n  render() {\n    return (\n      <div class=\"sdds-radio-button\">\n        <input\n          class=\"sdds-form-input\"\n          type=\"radio\"\n          name={this.name}\n          id={this.radioId}\n          value={this.value}\n          checked={this.checked}\n          aria-checked={this.checked}\n          // REMEMBER TO ENABLE ARIA PROPS ONCE ALIGNMENT HAS BEEN MADE!\n          // aria-labelledby={this.ariaLabelledBy}\n          // aria-describedby={this.host.getAttribute('aria-describedby')}\n          required={this.required}\n          disabled={this.disabled}\n          onChange={() => {\n            this.sddsChange.emit({\n              radioId: this.radioId,\n              value: this.value,\n            });\n          }}\n        />\n        <label htmlFor={this.radioId}>\n          <slot name=\"label\"></slot>\n        </label>\n      </div>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAA0B,qmK,MCSnBC,EAAW,M,sHAgBIC,OAAOC,a,aAGW,M,cAGhB,M,cAGA,K,CAgB5BC,SACE,OACEC,EAAA,OAAKC,MAAM,qBACTD,EAAA,SACEC,MAAM,kBACNC,KAAK,QACLC,KAAMC,KAAKD,KACXE,GAAID,KAAKE,QACTC,MAAOH,KAAKG,MACZC,QAASJ,KAAKI,QAAO,eACPJ,KAAKI,QAInBC,SAAUL,KAAKK,SACfC,SAAUN,KAAKM,SACfC,SAAU,KACRP,KAAKQ,WAAWC,KAAK,CACnBP,QAASF,KAAKE,QACdC,MAAOH,KAAKG,OACZ,IAGNP,EAAA,SAAOc,QAASV,KAAKE,SACnBN,EAAA,QAAMG,KAAK,W"}

package/dist/tegel/p-ae631412.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as s,h as i,H as e,g as o}from"./p-387e1798.js";const l=':host{box-sizing:border-box;display:flex;background-color:var(--sdds-inline-tabs-background);position:relative}:host *{box-sizing:border-box}:host::after{content:" ";display:block;border-bottom:1px solid var(--sdds-inline-tabs-horizontal-divider-background);opacity:var(--sdds-inline-tabs-horizontal-divider-opacity);left:0;right:0;bottom:0;position:absolute}:host .wrapper{display:flex;flex-wrap:nowrap;white-space:nowrap;width:100%;overflow-x:scroll;scrollbar-width:none}:host .wrapper::-webkit-scrollbar{display:none}:host .scroll-right-button{right:0;z-index:201}:host .scroll-left-button{left:0;z-index:201}:host .scroll-right-button,:host .scroll-left-button{color:var(--sdds-folder-tabs-scroll-btn-color);cursor:pointer;border:0;width:0;background-color:var(--sdds-inline-tabs-scroll-btn-background);display:none;justify-content:center;align-items:center;opacity:0;pointer-events:none;position:sticky}:host .scroll-right-button.show,:host .scroll-left-button.show{min-width:48px;display:block;opacity:1;pointer-events:all}:host .scroll-right-button:hover,:host .scroll-left-button:hover{background-color:var(--sdds-folder-tabs-scroll-btn-background-hover)}:host .scroll-right-button:active,:host .scroll-left-button:active{background-color:var(--sdds-folder-tabs-scroll-btn-background-active)}:host .scroll-right-button:focus,:host .scroll-left-button:focus{outline:2px solid var(--sdds-blue-400);outline-offset:-2px}:host .scroll-right-button svg,:host .scroll-left-button svg{fill:var(--sdds-folder-tabs-scroll-btn-color)}';const r=class{constructor(i){t(this,i);this.sddsChange=s(this,"sddsChange",7);this.navWrapperElement=null;this.componentWidth=0;this.buttonsWidth=0;this.scrollWidth=0;this.addResizeObserver=()=>{const t=new ResizeObserver((t=>{t.forEach((t=>{const s=t.contentRect.width;let i=0;const e=Array.from(this.host.children);e.forEach((t=>{const s=window.getComputedStyle(t);i+=t.clientWidth+parseFloat(s.marginLeft)+parseFloat(s.marginRight)}));this.componentWidth=s;this.buttonsWidth=i;this.scrollWidth=i-s;if(this.buttonsWidth>this.componentWidth){this.evaluateScrollButtons()}else{this.showLeftScroll=false;this.showRightScroll=false}}))}));t.observe(this.navWrapperElement)};this.modeVariant="primary";this.showLeftScroll=false;this.showRightScroll=false;this.selectedTab=undefined;this.buttonWidth=0}async selectTab(t){if(!this.children[t].disabled){this.children.forEach((t=>t.removeAttribute("selected")));this.children=this.children.map(((s,i)=>{if(i===t){s.setAttribute("selected","");this.selectedTab={tab:s.innerText,tabIndex:i}}return s}))}return{selectedTab:this.selectedTab.tab,selectedTabIndex:this.selectedTab.tabIndex}}handleSelectedTabChange(){this.host.setAttribute("selected-tab",this.selectedTab.tab);this.host.setAttribute("selected-tab-index",`${this.selectedTab.tabIndex}`);this.sddsChange.emit({selectedTab:this.selectedTab})}connectedCallback(){this.children=Array.from(this.host.children);this.children=this.children.map(((t,s)=>{t.addEventListener("click",(()=>{if(!t.disabled){this.children.forEach((t=>t.removeAttribute("selected")));t.setAttribute("selected","");this.selectedTab={tab:t.innerText,tabIndex:s}}}));if(t.selected){this.selectedTab={tab:t.innerText,tabIndex:s}}return t}));this.children[0].classList.add("first");this.children[this.children.length-1].classList.add("last")}componentDidLoad(){const t=new ResizeObserver((t=>{t.forEach((t=>{const s=t.contentRect.width;let i=0;const e=Array.from(this.host.children);e.forEach((t=>{const s=window.getComputedStyle(t);i+=t.clientWidth+parseFloat(s.marginLeft)+parseFloat(s.marginRight);t.classList.add("sdds-inline-tabs-fullbleed--tab")}));this.componentWidth=s;this.buttonsWidth=i;this.scrollWidth=i-s;if(this.buttonsWidth>this.componentWidth){this.evaluateScrollButtons()}else{this.showLeftScroll=false;this.showRightScroll=false}}))}));t.observe(this.navWrapperElement)}componentWillRender(){if(!this.selectedTab){this.children=Array.from(this.host.children);this.children=this.children.map(((t,s)=>{if(t.selected){this.selectedTab={tab:t.innerText,tabIndex:s}}return t}))}}componentDidRender(){if(this.buttonsWidth>this.componentWidth){this.evaluateScrollButtons()}else{this.showLeftScroll=false;this.showRightScroll=false}this.addResizeObserver()}scrollRight(){const t=this.navWrapperElement.scrollLeft;this.navWrapperElement.scrollLeft=t+95;this.evaluateScrollButtons()}scrollLeft(){const t=this.navWrapperElement.scrollLeft;this.navWrapperElement.scrollLeft=t-10;this.evaluateScrollButtons()}evaluateScrollButtons(){const t=this.navWrapperElement.scrollLeft;if(t>=this.scrollWidth){this.showRightScroll=false}else{this.showRightScroll=true}if(t<=0){this.showLeftScroll=false}else{this.showLeftScroll=true}}render(){return i(e,{class:`${this.modeVariant?`sdds-mode-variant-${this.modeVariant}`:""}`},i("div",{role:"list",class:"wrapper",ref:t=>{this.navWrapperElement=t}},i("button",{class:`scroll-left-button ${this.showLeftScroll?"show":""}`,onClick:()=>this.scrollLeft(),disabled:!this.showLeftScroll},i("sdds-icon",{name:"chevron_left",size:"20px"})),i("slot",null),i("button",{class:`scroll-right-button ${this.showRightScroll?"show":""}`,onClick:()=>this.scrollRight(),disabled:!this.showRightScroll},i("sdds-icon",{name:"chevron_right",size:"20px"}))))}get host(){return o(this)}static get watchers(){return{selectedTab:["handleSelectedTabChange"]}}};r.style=l;export{r as sdds_inline_tabs};
-//# sourceMappingURL=p-ae631412.entry.js.map

package/dist/tegel/p-ae631412.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["inlineTabsCss","InlineTabsFullbleed","this","navWrapperElement","componentWidth","buttonsWidth","scrollWidth","addResizeObserver","resizeObserver","ResizeObserver","entries","forEach","entry","contentRect","width","navButtons","Array","from","host","children","navButton","style","window","getComputedStyle","clientWidth","parseFloat","marginLeft","marginRight","evaluateScrollButtons","showLeftScroll","showRightScroll","observe","async","tabIndex","disabled","element","removeAttribute","map","index","setAttribute","selectedTab","tab","innerText","selectedTabIndex","handleSelectedTabChange","sddsChange","emit","connectedCallback","item","addEventListener","selected","classList","add","length","componentDidLoad","componentWillRender","componentDidRender","scrollRight","scroll","scrollLeft","render","h","Host","class","modeVariant","role","ref","el","onClick","name","size"],"sources":["./src/components/tabs/inline-tabs/inline-tabs.scss?tag=sdds-inline-tabs&encapsulation=shadow","./src/components/tabs/inline-tabs/inline-tabs.tsx"],"sourcesContent":["@import '../../../mixins/focus-state';\n@import '../../../mixins/box-sizing';\n@import '../../../mixins/z-index';\n\n:host {\n  @include sdds-box-sizing;\n\n  display: flex;\n  background-color: var(--sdds-inline-tabs-background);\n  position: relative;\n\n  &::after {\n    content: ' ';\n    display: block;\n    border-bottom: 1px solid var(--sdds-inline-tabs-horizontal-divider-background);\n    opacity: var(--sdds-inline-tabs-horizontal-divider-opacity);\n    left: 0;\n    right: 0;\n    bottom: 0;\n    position: absolute;\n  }\n\n  .wrapper {\n    display: flex;\n    flex-wrap: nowrap;\n    white-space: nowrap;\n    width: 100%;\n    overflow-x: scroll;\n    scrollbar-width: none;\n\n    &::-webkit-scrollbar {\n      display: none;\n    }\n  }\n\n  .scroll-right-button {\n    right: 0;\n    z-index: calc(z(tab) + 1);\n  }\n\n  .scroll-left-button {\n    left: 0;\n    z-index: calc(z(tab) + 1);\n  }\n\n  .scroll-right-button,\n  .scroll-left-button {\n    color: var(--sdds-folder-tabs-scroll-btn-color);\n    cursor: pointer;\n    border: 0;\n    width: 0;\n    background-color: var(--sdds-inline-tabs-scroll-btn-background);\n    display: none;\n    justify-content: center;\n    align-items: center;\n    opacity: 0;\n    pointer-events: none;\n    position: sticky;\n\n    &.show {\n      min-width: 48px;\n      display: block;\n      opacity: 1;\n      pointer-events: all;\n    }\n\n    &:hover {\n      background-color: var(--sdds-folder-tabs-scroll-btn-background-hover);\n    }\n\n    &:active {\n      background-color: var(--sdds-folder-tabs-scroll-btn-background-active);\n    }\n\n    &:focus {\n      @include sdds-focus-state;\n    }\n\n    svg {\n      fill: var(--sdds-folder-tabs-scroll-btn-color);\n    }\n  }\n}\n","import { Component, Host, State, Element, h, Prop, Event, EventEmitter } from '@stencil/core';\nimport { HostElement, Method, Watch } from '@stencil/core/internal';\n\n@Component({\n  tag: 'sdds-inline-tabs',\n  styleUrl: 'inline-tabs.scss',\n  shadow: true,\n})\nexport class InlineTabsFullbleed {\n  /** Variant of the tabs, primary= on white, secondary= on grey50 */\n  @Prop() modeVariant: 'primary' | 'secondary' = 'primary';\n\n  @Element() host: HostElement;\n\n  @State() showLeftScroll: boolean = false;\n\n  @State() showRightScroll: boolean = false;\n\n  @State() selectedTab: {\n    tab: string;\n    tabIndex: number;\n  };\n\n  @State() buttonWidth: number = 0; // current calculated width of the largest nav button\n\n  private navWrapperElement: HTMLElement = null; // reference to container with nav buttons\n\n  private componentWidth: number = 0; // visible width of this component\n\n  private buttonsWidth: number = 0; // total width of all nav items combined\n\n  private scrollWidth: number = 0; // total amount that is possible to scroll in the nav wrapper\n\n  private children: Array<HTMLSddsInlineTabsButtonElement | HTMLSddsInlineTabsLinkElement>;\n\n  /** Selects a tab based on tabindex, will not select a disabled tab. */\n  @Method()\n  async selectTab(tabIndex: number) {\n    if (!this.children[tabIndex].disabled) {\n      this.children.forEach((element) => element.removeAttribute('selected'));\n      this.children = this.children.map((element, index) => {\n        if (index === tabIndex) {\n          element.setAttribute('selected', '');\n          this.selectedTab = {\n            tab: element.innerText,\n            tabIndex: index,\n          };\n        }\n        return element;\n      });\n    }\n    return {\n      selectedTab: this.selectedTab.tab,\n      selectedTabIndex: this.selectedTab.tabIndex,\n    };\n  }\n\n  @Event({\n    eventName: 'sddsChange',\n    composed: true,\n    cancelable: true,\n    bubbles: true,\n  })\n  sddsChange: EventEmitter<{\n    selectedTab: {\n      tab: string;\n      tabIndex: number;\n    };\n  }>;\n\n  @Watch('selectedTab')\n  handleSelectedTabChange() {\n    this.host.setAttribute('selected-tab', this.selectedTab.tab);\n    this.host.setAttribute('selected-tab-index', `${this.selectedTab.tabIndex}`);\n    this.sddsChange.emit({\n      selectedTab: this.selectedTab,\n    });\n  }\n\n  connectedCallback() {\n    this.children = Array.from(this.host.children) as Array<\n      HTMLSddsInlineTabsButtonElement | HTMLSddsInlineTabsLinkElement\n    >;\n    this.children = this.children.map((item, index) => {\n      item.addEventListener('click', () => {\n        if (!item.disabled) {\n          this.children.forEach((element) => element.removeAttribute('selected'));\n          item.setAttribute('selected', '');\n          this.selectedTab = {\n            tab: item.innerText,\n            tabIndex: index,\n          };\n        }\n      });\n      if (item.selected) {\n        this.selectedTab = {\n          tab: item.innerText,\n          tabIndex: index,\n        };\n      }\n      return item;\n    });\n    this.children[0].classList.add('first');\n    this.children[this.children.length - 1].classList.add('last');\n  }\n\n  componentDidLoad() {\n    const resizeObserver = new ResizeObserver((entries) => {\n      entries.forEach((entry) => {\n        const componentWidth = entry.contentRect.width;\n        let buttonsWidth = 0;\n\n        const navButtons = Array.from(this.host.children);\n        navButtons.forEach((navButton: HTMLElement) => {\n          const style = window.getComputedStyle(navButton);\n          buttonsWidth +=\n            navButton.clientWidth + parseFloat(style.marginLeft) + parseFloat(style.marginRight);\n\n          navButton.classList.add('sdds-inline-tabs-fullbleed--tab');\n        });\n\n        this.componentWidth = componentWidth;\n        this.buttonsWidth = buttonsWidth;\n        this.scrollWidth = buttonsWidth - componentWidth;\n\n        if (this.buttonsWidth > this.componentWidth) {\n          this.evaluateScrollButtons();\n        } else {\n          this.showLeftScroll = false;\n          this.showRightScroll = false;\n        }\n      });\n    });\n\n    resizeObserver.observe(this.navWrapperElement);\n  }\n\n  componentWillRender() {\n    if (!this.selectedTab) {\n      this.children = Array.from(this.host.children) as Array<\n        HTMLSddsInlineTabsButtonElement | HTMLSddsInlineTabsLinkElement\n      >;\n      this.children = this.children.map((item, index) => {\n        if (item.selected) {\n          this.selectedTab = {\n            tab: item.innerText,\n            tabIndex: index,\n          };\n        }\n        return item;\n      });\n    }\n  }\n\n  componentDidRender() {\n    if (this.buttonsWidth > this.componentWidth) {\n      this.evaluateScrollButtons();\n    } else {\n      this.showLeftScroll = false;\n      this.showRightScroll = false;\n    }\n    this.addResizeObserver();\n  }\n\n  scrollRight() {\n    const scroll = this.navWrapperElement.scrollLeft;\n    this.navWrapperElement.scrollLeft = scroll + 95;\n    this.evaluateScrollButtons();\n  }\n\n  scrollLeft() {\n    const scroll = this.navWrapperElement.scrollLeft;\n    this.navWrapperElement.scrollLeft = scroll - 10;\n    this.evaluateScrollButtons();\n  }\n\n  evaluateScrollButtons() {\n    const scroll = this.navWrapperElement.scrollLeft;\n\n    if (scroll >= this.scrollWidth) {\n      this.showRightScroll = false;\n    } else {\n      this.showRightScroll = true;\n    }\n\n    if (scroll <= 0) {\n      this.showLeftScroll = false;\n    } else {\n      this.showLeftScroll = true;\n    }\n  }\n\n  addResizeObserver = () => {\n    const resizeObserver = new ResizeObserver((entries) => {\n      entries.forEach((entry) => {\n        const componentWidth = entry.contentRect.width;\n        let buttonsWidth = 0;\n\n        const navButtons = Array.from(this.host.children);\n        navButtons.forEach((navButton: HTMLElement) => {\n          const style = window.getComputedStyle(navButton);\n          buttonsWidth +=\n            navButton.clientWidth + parseFloat(style.marginLeft) + parseFloat(style.marginRight);\n        });\n\n        this.componentWidth = componentWidth;\n        this.buttonsWidth = buttonsWidth;\n        this.scrollWidth = buttonsWidth - componentWidth;\n\n        if (this.buttonsWidth > this.componentWidth) {\n          this.evaluateScrollButtons();\n        } else {\n          this.showLeftScroll = false;\n          this.showRightScroll = false;\n        }\n      });\n    });\n\n    resizeObserver.observe(this.navWrapperElement);\n  };\n\n  render() {\n    return (\n      <Host class={`${this.modeVariant ? `sdds-mode-variant-${this.modeVariant}` : ''}`}>\n        <div\n          role=\"list\"\n          class=\"wrapper\"\n          ref={(el) => {\n            this.navWrapperElement = el as HTMLElement;\n          }}\n        >\n          <button\n            class={`scroll-left-button ${this.showLeftScroll ? 'show' : ''}`}\n            onClick={() => this.scrollLeft()}\n            disabled={!this.showLeftScroll}\n          >\n            <sdds-icon name=\"chevron_left\" size=\"20px\"></sdds-icon>\n          </button>\n          <slot />\n          <button\n            class={`scroll-right-button ${this.showRightScroll ? 'show' : ''}`}\n            onClick={() => this.scrollRight()}\n            disabled={!this.showRightScroll}\n          >\n            <sdds-icon name=\"chevron_right\" size=\"20px\"></sdds-icon>\n          </button>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"gEAAA,MAAMA,EAAgB,8/C,MCQTC,EAAmB,M,gEAiBtBC,KAAAC,kBAAiC,KAEjCD,KAAAE,eAAyB,EAEzBF,KAAAG,aAAuB,EAEvBH,KAAAI,YAAsB,EAiK9BJ,KAAAK,kBAAoB,KAClB,MAAMC,EAAiB,IAAIC,gBAAgBC,IACzCA,EAAQC,SAASC,IACf,MAAMR,EAAiBQ,EAAMC,YAAYC,MACzC,IAAIT,EAAe,EAEnB,MAAMU,EAAaC,MAAMC,KAAKf,KAAKgB,KAAKC,UACxCJ,EAAWJ,SAASS,IAClB,MAAMC,EAAQC,OAAOC,iBAAiBH,GACtCf,GACEe,EAAUI,YAAcC,WAAWJ,EAAMK,YAAcD,WAAWJ,EAAMM,YAAY,IAGxFzB,KAAKE,eAAiBA,EACtBF,KAAKG,aAAeA,EACpBH,KAAKI,YAAcD,EAAeD,EAElC,GAAIF,KAAKG,aAAeH,KAAKE,eAAgB,CAC3CF,KAAK0B,uB,KACA,CACL1B,KAAK2B,eAAiB,MACtB3B,KAAK4B,gBAAkB,K,IAEzB,IAGJtB,EAAeuB,QAAQ7B,KAAKC,kBAAkB,E,iBAhND,U,oBAIZ,M,qBAEC,M,4CAOL,C,CAc/B6B,gBAAgBC,GACd,IAAK/B,KAAKiB,SAASc,GAAUC,SAAU,CACrChC,KAAKiB,SAASR,SAASwB,GAAYA,EAAQC,gBAAgB,cAC3DlC,KAAKiB,SAAWjB,KAAKiB,SAASkB,KAAI,CAACF,EAASG,KAC1C,GAAIA,IAAUL,EAAU,CACtBE,EAAQI,aAAa,WAAY,IACjCrC,KAAKsC,YAAc,CACjBC,IAAKN,EAAQO,UACbT,SAAUK,E,CAGd,OAAOH,CAAO,G,CAGlB,MAAO,CACLK,YAAatC,KAAKsC,YAAYC,IAC9BE,iBAAkBzC,KAAKsC,YAAYP,S,CAkBvCW,0BACE1C,KAAKgB,KAAKqB,aAAa,eAAgBrC,KAAKsC,YAAYC,KACxDvC,KAAKgB,KAAKqB,aAAa,qBAAsB,GAAGrC,KAAKsC,YAAYP,YACjE/B,KAAK2C,WAAWC,KAAK,CACnBN,YAAatC,KAAKsC,a,CAItBO,oBACE7C,KAAKiB,SAAWH,MAAMC,KAAKf,KAAKgB,KAAKC,UAGrCjB,KAAKiB,SAAWjB,KAAKiB,SAASkB,KAAI,CAACW,EAAMV,KACvCU,EAAKC,iBAAiB,SAAS,KAC7B,IAAKD,EAAKd,SAAU,CAClBhC,KAAKiB,SAASR,SAASwB,GAAYA,EAAQC,gBAAgB,cAC3DY,EAAKT,aAAa,WAAY,IAC9BrC,KAAKsC,YAAc,CACjBC,IAAKO,EAAKN,UACVT,SAAUK,E,KAIhB,GAAIU,EAAKE,SAAU,CACjBhD,KAAKsC,YAAc,CACjBC,IAAKO,EAAKN,UACVT,SAAUK,E,CAGd,OAAOU,CAAI,IAEb9C,KAAKiB,SAAS,GAAGgC,UAAUC,IAAI,SAC/BlD,KAAKiB,SAASjB,KAAKiB,SAASkC,OAAS,GAAGF,UAAUC,IAAI,O,CAGxDE,mBACE,MAAM9C,EAAiB,IAAIC,gBAAgBC,IACzCA,EAAQC,SAASC,IACf,MAAMR,EAAiBQ,EAAMC,YAAYC,MACzC,IAAIT,EAAe,EAEnB,MAAMU,EAAaC,MAAMC,KAAKf,KAAKgB,KAAKC,UACxCJ,EAAWJ,SAASS,IAClB,MAAMC,EAAQC,OAAOC,iBAAiBH,GACtCf,GACEe,EAAUI,YAAcC,WAAWJ,EAAMK,YAAcD,WAAWJ,EAAMM,aAE1EP,EAAU+B,UAAUC,IAAI,kCAAkC,IAG5DlD,KAAKE,eAAiBA,EACtBF,KAAKG,aAAeA,EACpBH,KAAKI,YAAcD,EAAeD,EAElC,GAAIF,KAAKG,aAAeH,KAAKE,eAAgB,CAC3CF,KAAK0B,uB,KACA,CACL1B,KAAK2B,eAAiB,MACtB3B,KAAK4B,gBAAkB,K,IAEzB,IAGJtB,EAAeuB,QAAQ7B,KAAKC,kB,CAG9BoD,sBACE,IAAKrD,KAAKsC,YAAa,CACrBtC,KAAKiB,SAAWH,MAAMC,KAAKf,KAAKgB,KAAKC,UAGrCjB,KAAKiB,SAAWjB,KAAKiB,SAASkB,KAAI,CAACW,EAAMV,KACvC,GAAIU,EAAKE,SAAU,CACjBhD,KAAKsC,YAAc,CACjBC,IAAKO,EAAKN,UACVT,SAAUK,E,CAGd,OAAOU,CAAI,G,EAKjBQ,qBACE,GAAItD,KAAKG,aAAeH,KAAKE,eAAgB,CAC3CF,KAAK0B,uB,KACA,CACL1B,KAAK2B,eAAiB,MACtB3B,KAAK4B,gBAAkB,K,CAEzB5B,KAAKK,mB,CAGPkD,cACE,MAAMC,EAASxD,KAAKC,kBAAkBwD,WACtCzD,KAAKC,kBAAkBwD,WAAaD,EAAS,GAC7CxD,KAAK0B,uB,CAGP+B,aACE,MAAMD,EAASxD,KAAKC,kBAAkBwD,WACtCzD,KAAKC,kBAAkBwD,WAAaD,EAAS,GAC7CxD,KAAK0B,uB,CAGPA,wBACE,MAAM8B,EAASxD,KAAKC,kBAAkBwD,WAEtC,GAAID,GAAUxD,KAAKI,YAAa,CAC9BJ,KAAK4B,gBAAkB,K,KAClB,CACL5B,KAAK4B,gBAAkB,I,CAGzB,GAAI4B,GAAU,EAAG,CACfxD,KAAK2B,eAAiB,K,KACjB,CACL3B,KAAK2B,eAAiB,I,EAiC1B+B,SACE,OACEC,EAACC,EAAI,CAACC,MAAO,GAAG7D,KAAK8D,YAAc,qBAAqB9D,KAAK8D,cAAgB,MAC3EH,EAAA,OACEI,KAAK,OACLF,MAAM,UACNG,IAAMC,IACJjE,KAAKC,kBAAoBgE,CAAiB,GAG5CN,EAAA,UACEE,MAAO,sBAAsB7D,KAAK2B,eAAiB,OAAS,KAC5DuC,QAAS,IAAMlE,KAAKyD,aACpBzB,UAAWhC,KAAK2B,gBAEhBgC,EAAA,aAAWQ,KAAK,eAAeC,KAAK,UAEtCT,EAAA,aACAA,EAAA,UACEE,MAAO,uBAAuB7D,KAAK4B,gBAAkB,OAAS,KAC9DsC,QAAS,IAAMlE,KAAKuD,cACpBvB,UAAWhC,KAAK4B,iBAEhB+B,EAAA,aAAWQ,KAAK,gBAAgBC,KAAK,W"}

package/dist/tegel/p-b8d838d1.entry.js

@@ -1,2 +0,0 @@
-import{r as t,h as s,H as o}from"./p-387e1798.js";const e=':host{box-sizing:border-box;display:block;position:relative;z-index:200}:host *{box-sizing:border-box}:host a{font:var(--sdds-headline-07);letter-spacing:var(--sdds-headline-07-ls);color:var(--sdds-inline-tabs-tab-color);padding:8px 4px;margin-right:32px;text-decoration:none;display:block;position:relative;transition:color 0.15s ease-in-out 0s;white-space:nowrap;background-color:transparent;border:0}:host a .label{margin:12px 0}:host a:hover{cursor:pointer}:host a:hover::after{width:100%}:host a:focus-visible{outline:2px solid var(--sdds-blue-400);outline-offset:-2px}:host a::after{content:" ";position:absolute;bottom:0;right:0;left:0;margin-left:auto;width:0%;margin-right:auto;height:2px;background-color:var(--sdds-inline-tabs-tab-indicator-background-hover);transition:width 0.15s ease-in-out 0s;z-index:1}:host a.selected{color:var(--sdds-inline-tabs-tab-color-selected)}:host a.selected .label{opacity:var(--sdds-inline-tab-color-opacity-selected)}:host a.selected::after{width:100%;background-color:var(--sdds-inline-tabs-tab-indicator-background-active)}:host a.disabled{color:var(--sdds-inline-tabs-tab-color-disabled);pointer-events:none}:host a.disabled .label{opacity:var(--sdds-inline-tabs-tab-color-opacity-disabled)}:host(.first){margin-left:32px}:host(.last){margin-right:32px}';const a=class{constructor(s){t(this,s);this.disabled=false;this.selected=false;this.href=undefined;this.target="_self";this.rel="noopener"}render(){return s(o,{role:"listitem"},s("a",{class:`\n        ${this.selected?"selected":""}\n        ${this.disabled?"disabled":""}\n        `,href:this.href,target:this.target,rel:this.rel},s("div",{class:"label"},s("slot",{name:"label"}))))}};a.style=e;export{a as sdds_inline_tabs_link};
-//# sourceMappingURL=p-b8d838d1.entry.js.map

package/dist/tegel/p-b8d838d1.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["sddsInlineTabsLinkCss","SddsInlineTabsLink","render","h","Host","role","class","this","selected","disabled","href","target","rel","name"],"sources":["./src/components/tabs/inline-tabs/inline-tabs-link/sdds-inline-tabs-link.scss?tag=sdds-inline-tabs-link&encapsulation=shadow","./src/components/tabs/inline-tabs/inline-tabs-link/sdds-inline-tabs-link.tsx"],"sourcesContent":["@import '../../../../mixins/focus-state';\n@import '../../../../mixins/z-index';\n@import '../../../../mixins/box-sizing';\n\n:host {\n  @include sdds-box-sizing;\n\n  display: block;\n  position: relative;\n  z-index: z(tab);\n\n  a {\n    font: var(--sdds-headline-07);\n    letter-spacing: var(--sdds-headline-07-ls);\n    color: var(--sdds-inline-tabs-tab-color);\n    padding: 8px 4px;\n    margin-right: 32px;\n    text-decoration: none;\n    display: block;\n    position: relative;\n    transition: color 0.15s ease-in-out 0s;\n    white-space: nowrap;\n    background-color: transparent;\n    border: 0;\n    \n    .label {\n      margin: 12px 0;\n    }\n\n    &:hover {\n      cursor: pointer;\n\n      &::after {\n        width: 100%;\n      }\n    }\n\n    &:focus-visible {\n      @include sdds-focus-state;\n    }\n\n    &::after {\n      content: ' ';\n      position: absolute;\n      bottom: 0;\n      right: 0;\n      left: 0;\n      margin-left: auto;\n      width: 0%;\n      margin-right: auto;\n      height: 2px;\n      background-color: var(--sdds-inline-tabs-tab-indicator-background-hover);\n      transition: width 0.15s ease-in-out 0s;\n      z-index: 1;\n    }\n\n    &.selected {\n      color: var(--sdds-inline-tabs-tab-color-selected);\n\n      .label {\n        opacity: var(--sdds-inline-tab-color-opacity-selected);\n      }\n\n      &::after {\n        width: 100%;\n        background-color: var(--sdds-inline-tabs-tab-indicator-background-active);\n      }\n    }\n\n    &.disabled {\n      color: var(--sdds-inline-tabs-tab-color-disabled);\n      pointer-events: none;\n\n      .label {\n        opacity: var(--sdds-inline-tabs-tab-color-opacity-disabled);\n      }\n    }\n  }\n}\n\n\n:host(.first) {\n  margin-left: 32px;\n}\n\n:host(.last) {\n  margin-right: 32px;\n}","import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'sdds-inline-tabs-link',\n  styleUrl: 'sdds-inline-tabs-link.scss',\n  shadow: true,\n})\nexport class SddsInlineTabsLink {\n  /** Disables the tab. */\n  @Prop() disabled: boolean = false;\n\n  /** Marks the tab as the selected one. */\n  @Prop() selected: boolean = false;\n\n  /** Href for the link */\n  @Prop() href: string;\n\n  /** Where to open the linked URL */\n  @Prop() target: '_self' | '_blank' | '_parent' | '_top' = '_self';\n\n  /** 'noopener' is a security measure for legacy browsers that preventsthe opened page from getting access to the original page when using target='_blank'. */\n  @Prop() rel: string = 'noopener';\n\n  render() {\n    return (\n      <Host role=\"listitem\">\n        <a\n          class={`\n        ${this.selected ? 'selected' : ''}\n        ${this.disabled ? 'disabled' : ''}\n        `}\n          href={this.href}\n          target={this.target}\n          rel={this.rel}\n        >\n          <div class=\"label\">\n            <slot name=\"label\"></slot>\n          </div>\n        </a>\n      </Host>\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAwB,wxC,MCOjBC,EAAkB,M,uCAED,M,cAGA,M,gCAM8B,Q,SAGpC,U,CAEtBC,SACE,OACEC,EAACC,EAAI,CAACC,KAAK,YACTF,EAAA,KACEG,MAAO,aACPC,KAAKC,SAAW,WAAa,eAC7BD,KAAKE,SAAW,WAAa,eAE7BC,KAAMH,KAAKG,KACXC,OAAQJ,KAAKI,OACbC,IAAKL,KAAKK,KAEVT,EAAA,OAAKG,MAAM,SACTH,EAAA,QAAMU,KAAK,Y"}

package/dist/tegel/p-b9b329c0.entry.js

@@ -1,2 +0,0 @@
-import{r as d,c as o,h as s,H as c}from"./p-387e1798.js";const i=".sdds-accordion-item{box-sizing:border-box;list-style:none;color:var(--sdds-accordion-color);position:relative;border-top:1px solid var(--sdds-accordion-border)}.sdds-accordion-item *{box-sizing:border-box}.sdds-accordion-item button.sdds-accordion-header-icon-start,.sdds-accordion-item button.sdds-accordion-header-icon-end{all:unset}.sdds-accordion-item .sdds-accordion-header-icon-start,.sdds-accordion-item .sdds-accordion-header-icon-end,.sdds-accordion-item button.sdds-accordion-header-icon-start,.sdds-accordion-item button.sdds-accordion-header-icon-end{box-sizing:border-box;cursor:pointer;display:flex;align-items:center;width:100%;font:var(--sdds-headline-07);letter-spacing:var(--sdds-headline-07-ls);padding:var(--sdds-spacing-element-16);background-color:var(--sdds-accordion-background)}.sdds-accordion-item .sdds-accordion-header-icon-start *,.sdds-accordion-item .sdds-accordion-header-icon-end *,.sdds-accordion-item button.sdds-accordion-header-icon-start *,.sdds-accordion-item button.sdds-accordion-header-icon-end *{box-sizing:border-box}.sdds-accordion-item .sdds-accordion-header-icon-start .sdds-accordion-icon,.sdds-accordion-item .sdds-accordion-header-icon-end .sdds-accordion-icon,.sdds-accordion-item button.sdds-accordion-header-icon-start .sdds-accordion-icon,.sdds-accordion-item button.sdds-accordion-header-icon-end .sdds-accordion-icon{transform-origin:center;transition:transform 0.15s ease-in-out;color:var(--sdds-accordion-color)}.sdds-accordion-item .sdds-accordion-header-icon-start .sdds-accordion-icon>sdds-icon,.sdds-accordion-item .sdds-accordion-header-icon-end .sdds-accordion-icon>sdds-icon,.sdds-accordion-item button.sdds-accordion-header-icon-start .sdds-accordion-icon>sdds-icon,.sdds-accordion-item button.sdds-accordion-header-icon-end .sdds-accordion-icon>sdds-icon{display:block}.sdds-accordion-item .sdds-accordion-title{flex-grow:2}.sdds-accordion-item .sdds-accordion-panel{cursor:default;padding:var(--sdds-spacing-element-8) var(--sdds-spacing-layout-64) var(--sdds-spacing-element-32) var(--sdds-spacing-element-16);display:none;font:var(--sdds-detail-03);letter-spacing:var(--sdds-detail-03-ls)}.sdds-accordion-item .sdds-accordion-panel p{margin:0;padding:0}.sdds-accordion-item .sdds-accordion-panel--padding-reset{padding-right:var(--sdds-spacing-element-16)}.sdds-accordion-item .sdds-accordion-header-icon-end .sdds-accordion-icon{margin:0 0 0 var(--sdds-spacing-element-32)}.sdds-accordion-item .sdds-accordion-header-icon-start .sdds-accordion-title{order:1}.sdds-accordion-item .sdds-accordion-header-icon-start .sdds-accordion-icon{order:0;margin:0 var(--sdds-spacing-element-16) 0 0}.sdds-accordion-item.disabled,.sdds-accordion-item.disabled .sdds-accordion-header-icon-end,.sdds-accordion-item.disabled .sdds-accordion-header-icon-start,.sdds-accordion-item.disabled .sdds-accordion-panel{color:var(--sdds-accordion-color-disabled);cursor:not-allowed}.sdds-accordion-item.disabled .sdds-accordion-icon,.sdds-accordion-item.disabled .sdds-accordion-header-icon-end .sdds-accordion-icon,.sdds-accordion-item.disabled .sdds-accordion-header-icon-start .sdds-accordion-icon,.sdds-accordion-item.disabled .sdds-accordion-panel .sdds-accordion-icon{color:var(--sdds-accordion-color-disabled)}.sdds-accordion-item.disabled:hover,.sdds-accordion-item.disabled:hover *,.sdds-accordion-item.disabled:focus,.sdds-accordion-item.disabled:focus *,.sdds-accordion-item.disabled:active,.sdds-accordion-item.disabled:active *,.sdds-accordion-item.disabled.active,.sdds-accordion-item.disabled.active *{cursor:not-allowed}.sdds-accordion-item.disabled:hover .sdds-accordion-header-icon-start,.sdds-accordion-item.disabled:hover .sdds-accordion-header-icon-end,.sdds-accordion-item.disabled:focus .sdds-accordion-header-icon-start,.sdds-accordion-item.disabled:focus .sdds-accordion-header-icon-end,.sdds-accordion-item.disabled:active .sdds-accordion-header-icon-start,.sdds-accordion-item.disabled:active .sdds-accordion-header-icon-end,.sdds-accordion-item.disabled.active .sdds-accordion-header-icon-start,.sdds-accordion-item.disabled.active .sdds-accordion-header-icon-end{background-color:var(--sdds-accordion-bg);outline:none;pointer-events:none}.sdds-accordion-item.disabled:hover .sdds-accordion-header-icon-start::after,.sdds-accordion-item.disabled:hover .sdds-accordion-header-icon-end::after,.sdds-accordion-item.disabled:focus .sdds-accordion-header-icon-start::after,.sdds-accordion-item.disabled:focus .sdds-accordion-header-icon-end::after,.sdds-accordion-item.disabled:active .sdds-accordion-header-icon-start::after,.sdds-accordion-item.disabled:active .sdds-accordion-header-icon-end::after,.sdds-accordion-item.disabled.active .sdds-accordion-header-icon-start::after,.sdds-accordion-item.disabled.active .sdds-accordion-header-icon-end::after{border-color:transparent}.sdds-accordion-item.expanded .sdds-accordion-panel{display:block;padding-bottom:31px}.sdds-accordion-item.expanded .sdds-accordion-icon{transform:rotate(180deg)}.sdds-accordion-item.expanded .sdds-accordion-header-icon-end .sdds-accordion-icon{margin-right:0;margin-left:var(--sdds-spacing-element-32)}.sdds-accordion-item.expanded .sdds-accordion-header-icon-start .sdds-accordion-icon{margin-left:0;margin-right:var(--sdds-spacing-element-16)}.sdds-accordion-item:focus{border-top:1px solid var(--sdds-accordion-border-focus)}.sdds-accordion-item[disabled=true]:focus{border-color:var(--sdds-accordion-border)}:host(:focus) .sdds-accordion-item{outline:2px solid var(--sdds-blue-400);outline-offset:-2px}:host(:focus) .sdds-accordion-item .sdds-accordion-header-icon-start,:host(:focus) .sdds-accordion-item .sdds-accordion-header-icon-end{background-color:var(--sdds-accordion-background-focus);outline:none}:host(:hover) .sdds-accordion-header-icon-start,:host(:hover) .sdds-accordion-header-icon-end{background-color:var(--sdds-accordion-background-hover)}:host(:active) .sdds-accordion-header-icon-start,:host(:active) .sdds-accordion-header-icon-end{background-color:var(--sdds-accordion-background-active);outline:none}";const a=class{constructor(s){d(this,s);this.sddsToggle=o(this,"sddsToggle",7);this.header="";this.expandIconPosition="end";this.disabled=false;this.expanded=false;this.paddingReset=false}openAccordion(){this.expanded=!this.expanded;this.sddsToggle.emit(this.expanded)}render(){return s(c,null,s("div",{class:`sdds-accordion-item\n        ${this.disabled?"disabled":""}\n        ${this.expanded?"expanded":""}\n        `},s("button",{type:"button","aria-expanded":this.expanded,class:`sdds-accordion-header-icon-${this.expandIconPosition}`,onClick:()=>this.openAccordion(),disabled:this.disabled},s("div",{class:"sdds-accordion-title"},this.header),s("div",{class:"sdds-accordion-icon"},s("sdds-icon",{name:"chevron_down",size:"16px"}))),s("div",{class:`sdds-accordion-panel\n            ${this.paddingReset?"sdds-accordion-panel--padding-reset ":""}\n            `},s("slot",null))))}};a.style=i;export{a as sdds_accordion_item};
-//# sourceMappingURL=p-b9b329c0.entry.js.map

package/dist/tegel/p-b9b329c0.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["accordionItemCss","AccordionItem","openAccordion","this","expanded","sddsToggle","emit","render","h","Host","class","disabled","type","expandIconPosition","onClick","header","name","size","paddingReset"],"sources":["./src/components/accordion/accordion-item/accordion-item.scss?tag=sdds-accordion-item&encapsulation=shadow","./src/components/accordion/accordion-item/accordion-item.tsx"],"sourcesContent":["@import '../../../mixins/focus-state';\n@import '../../../mixins/disabled-style';\n@import '../../../mixins/box-sizing';\n\n.sdds-accordion-item {\n  @include sdds-box-sizing;\n\n  list-style: none;\n  color: var(--sdds-accordion-color);\n  position: relative;\n\n  button.sdds-accordion-header-icon-start,\n  button.sdds-accordion-header-icon-end {\n    all: unset;\n  }\n\n  .sdds-accordion-header-icon-start,\n  .sdds-accordion-header-icon-end,\n  button.sdds-accordion-header-icon-start,\n  button.sdds-accordion-header-icon-end {\n    @include sdds-box-sizing;\n\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    width: 100%;\n\n    // fixme: wrong line-height compared to production\n    font: var(--sdds-headline-07);\n    letter-spacing: var(--sdds-headline-07-ls);\n    padding: var(--sdds-spacing-element-16);\n    background-color: var(--sdds-accordion-background);\n\n    .sdds-accordion-icon {\n      transform-origin: center;\n      transition: transform 0.15s ease-in-out;\n      color: var(--sdds-accordion-color);\n\n      & > sdds-icon {\n        display: block;\n      }\n    }\n  }\n\n  .sdds-accordion-title {\n    flex-grow: 2;\n  }\n\n  .sdds-accordion-panel {\n    cursor: default;\n    padding: var(--sdds-spacing-element-8) var(--sdds-spacing-layout-64)\n      var(--sdds-spacing-element-32) var(--sdds-spacing-element-16);\n    display: none;\n    font: var(--sdds-detail-03);\n    letter-spacing: var(--sdds-detail-03-ls);\n\n    p {\n      margin: 0;\n      padding: 0;\n    }\n\n    &--padding-reset {\n      padding-right: var(--sdds-spacing-element-16);\n    }\n  }\n\n  .sdds-accordion-header-icon-end {\n    .sdds-accordion-icon {\n      margin: 0 0 0 var(--sdds-spacing-element-32);\n    }\n  }\n\n  .sdds-accordion-header-icon-start {\n    .sdds-accordion-title {\n      order: 1;\n    }\n\n    .sdds-accordion-icon {\n      order: 0;\n      margin: 0 var(--sdds-spacing-element-16) 0 0;\n    }\n  }\n\n  &.disabled {\n    &,\n    .sdds-accordion-header-icon-end,\n    .sdds-accordion-header-icon-start,\n    .sdds-accordion-panel {\n      color: var(--sdds-accordion-color-disabled);\n      cursor: not-allowed;\n\n      .sdds-accordion-icon {\n        color: var(--sdds-accordion-color-disabled);\n      }\n    }\n\n    &:hover,\n    &:focus,\n    &:active,\n    &.active {\n      @include disabledStyle;\n    }\n  }\n\n  &.expanded {\n    .sdds-accordion-panel {\n      display: block;\n      padding-bottom: 31px;\n    }\n\n    .sdds-accordion-icon {\n      transform: rotate(180deg);\n    }\n\n    .sdds-accordion-header-icon-end {\n      .sdds-accordion-icon {\n        margin-right: 0;\n        margin-left: var(--sdds-spacing-element-32);\n      }\n    }\n\n    .sdds-accordion-header-icon-start {\n      .sdds-accordion-icon {\n        margin-left: 0;\n        margin-right: var(--sdds-spacing-element-16);\n      }\n    }\n  }\n\n  border-top: 1px solid var(--sdds-accordion-border);\n\n  &:focus {\n    border-top: 1px solid var(--sdds-accordion-border-focus);\n  }\n\n  &[disabled='true']:focus {\n    border-color: var(--sdds-accordion-border);\n  }\n}\n\n:host(:focus) {\n  .sdds-accordion-item {\n    @include sdds-focus-state;\n\n    .sdds-accordion-header-icon-start,\n    .sdds-accordion-header-icon-end {\n      background-color: var(--sdds-accordion-background-focus);\n      outline: none;\n    }\n  }\n}\n\n:host(:hover) {\n  .sdds-accordion-header-icon-start,\n  .sdds-accordion-header-icon-end {\n    background-color: var(--sdds-accordion-background-hover);\n  }\n}\n\n:host(:active) {\n  .sdds-accordion-header-icon-start,\n  .sdds-accordion-header-icon-end {\n    background-color: var(--sdds-accordion-background-active);\n    outline: none;\n  }\n}\n","import { Component, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'sdds-accordion-item',\n  styleUrl: 'accordion-item.scss',\n  shadow: true,\n})\nexport class AccordionItem {\n  /** The header gives users the context about the additional information available inside the panel */\n  @Prop() header: string = '';\n\n  /** Changes where the expand icon is placed. */\n  @Prop() expandIconPosition: 'start' | 'end' = 'end';\n\n  /** Disabled option in `boolean`. */\n  @Prop() disabled: boolean = false;\n\n  /** Set to true to expand panel open */\n  @Prop() expanded: boolean = false;\n\n  /** When true 16px on right padding instead of 64px */\n  @Prop() paddingReset: boolean = false;\n\n  /** Fires after the accordion item is closed or opened, emitting the value (as boolean) of the current state of the accordion */\n  @Event({\n    eventName: 'sddsToggle',\n    composed: true,\n    cancelable: true,\n    bubbles: true,\n  })\n  sddsToggle: EventEmitter<boolean>;\n\n  openAccordion() {\n    this.expanded = !this.expanded;\n    this.sddsToggle.emit(this.expanded);\n  }\n\n  render() {\n    return (\n      <Host>\n        <div\n          class={`sdds-accordion-item\n        ${this.disabled ? 'disabled' : ''}\n        ${this.expanded ? 'expanded' : ''}\n        `}\n        >\n          <button\n            type=\"button\"\n            aria-expanded={this.expanded}\n            class={`sdds-accordion-header-icon-${this.expandIconPosition}`}\n            onClick={() => this.openAccordion()}\n            disabled={this.disabled}\n          >\n            <div class=\"sdds-accordion-title\">{this.header}</div>\n            <div class=\"sdds-accordion-icon\">\n              <sdds-icon name=\"chevron_down\" size=\"16px\"></sdds-icon>\n            </div>\n          </button>\n          <div\n            class={`sdds-accordion-panel\n            ${this.paddingReset ? 'sdds-accordion-panel--padding-reset ' : ''}\n            `}\n          >\n            <slot></slot>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAmB,i8L,MCOZC,EAAa,M,4EAEC,G,wBAGqB,M,cAGlB,M,cAGA,M,kBAGI,K,CAWhCC,gBACEC,KAAKC,UAAYD,KAAKC,SACtBD,KAAKE,WAAWC,KAAKH,KAAKC,S,CAG5BG,SACE,OACEC,EAACC,EAAI,KACHD,EAAA,OACEE,MAAO,gCACPP,KAAKQ,SAAW,WAAa,eAC7BR,KAAKC,SAAW,WAAa,gBAG7BI,EAAA,UACEI,KAAK,SAAQ,gBACET,KAAKC,SACpBM,MAAO,8BAA8BP,KAAKU,qBAC1CC,QAAS,IAAMX,KAAKD,gBACpBS,SAAUR,KAAKQ,UAEfH,EAAA,OAAKE,MAAM,wBAAwBP,KAAKY,QACxCP,EAAA,OAAKE,MAAM,uBACTF,EAAA,aAAWQ,KAAK,eAAeC,KAAK,WAGxCT,EAAA,OACEE,MAAO,qCACLP,KAAKe,aAAe,uCAAyC,oBAG/DV,EAAA,e"}

package/dist/tegel/p-bdae6bc9.entry.js

@@ -1,2 +0,0 @@
-import{r as s,c as e,h as d,g as o}from"./p-387e1798.js";const t='.sdds-toggle-webcomponent.sc-sdds-toggle .toggle-headline.sc-sdds-toggle{font:var(--sdds-detail-02);letter-spacing:var(--sdds-detail-02-ls);color:var(--sdds-toggle-headline);margin-bottom:12px}.sdds-toggle-webcomponent.sc-sdds-toggle .toggle-headline.disabled.sc-sdds-toggle{color:var(--sdds-toggle-headline-disabled)}.sdds-toggle-webcomponent.sc-sdds-toggle input[type=checkbox].sc-sdds-toggle{margin:0;width:44px;height:24px;position:relative;display:inline-block;vertical-align:middle}.sdds-toggle-webcomponent.sc-sdds-toggle input[type=checkbox].sc-sdds-toggle::after,.sdds-toggle-webcomponent.sc-sdds-toggle input[type=checkbox].sc-sdds-toggle::before{content:"";position:absolute;box-sizing:border-box;transition:all 0.5s cubic-bezier(0.075, 0.82, 0.165, 1)}.sdds-toggle-webcomponent.sc-sdds-toggle input[type=checkbox].sc-sdds-toggle::before{width:44px;height:24px;border-radius:16px;background-color:var(--sdds-toggle-off-slider);left:0}.sdds-toggle-webcomponent.sc-sdds-toggle input[type=checkbox].sc-sdds-toggle::after{width:16px;height:16px;background-color:var(--sdds-toggle-switch);border-radius:50%;left:4px;top:4px}.sdds-toggle-webcomponent.sc-sdds-toggle input[type=checkbox].sc-sdds-toggle:focus{outline:none}.sdds-toggle-webcomponent.sc-sdds-toggle input[type=checkbox].sc-sdds-toggle:focus::before{background-color:var(--sdds-toggle-off-slider-focus);border:1px solid var(--sdds-toggle-off-border-focus)}.sdds-toggle-webcomponent.sc-sdds-toggle input[type=checkbox].sc-sdds-toggle:checked::before{background-color:var(--sdds-toggle-on-slider);border:1px solid var(--sdds-toggle-on-border-focus)}.sdds-toggle-webcomponent.sc-sdds-toggle input[type=checkbox].sc-sdds-toggle:checked::after{left:24px}.sdds-toggle-webcomponent.sc-sdds-toggle input[type=checkbox].sc-sdds-toggle:disabled::before{background-color:var(--sdds-toggle-slider-disabled);border:1px solid var(--sdds-toggle-slider-disabled)}.sdds-toggle-webcomponent.sc-sdds-toggle input[type=checkbox].sc-sdds-toggle:disabled::after{background-color:var(--sdds-toggle-switch-disabled)}.sdds-toggle-webcomponent.sc-sdds-toggle input[type=checkbox].sc-sdds-toggle:disabled:checked::before{background-color:var(--sdds-toggle-on-slider-disabled);border:1px solid var(--sdds-toggle-on-slider-disabled)}.sdds-toggle-webcomponent.sc-sdds-toggle input[type=checkbox].sc-sdds-toggle:disabled:checked::after{background-color:var(--sdds-toggle-switch-disabled)}.sdds-toggle-webcomponent.sc-sdds-toggle input[type=checkbox].sm.sc-sdds-toggle{width:28px;height:16px}.sdds-toggle-webcomponent.sc-sdds-toggle input[type=checkbox].sm.sc-sdds-toggle::before{width:28px;height:16px}.sdds-toggle-webcomponent.sc-sdds-toggle input[type=checkbox].sm.sc-sdds-toggle::after{width:8px;height:8px}.sdds-toggle-webcomponent.sc-sdds-toggle input[type=checkbox].sm.sc-sdds-toggle:checked::before{background-color:var(--sdds-toggle-on-slider)}.sdds-toggle-webcomponent.sc-sdds-toggle input[type=checkbox].sm.sc-sdds-toggle:checked::after{left:16px}.sdds-toggle-webcomponent.sc-sdds-toggle input[type=checkbox].sm.sc-sdds-toggle:disabled::before{background-color:var(--sdds-toggle-slider-disabled);border:1px solid var(--sdds-toggle-slider-disabled)}.sdds-toggle-webcomponent.sc-sdds-toggle input[type=checkbox].sm.sc-sdds-toggle:disabled::after{background-color:var(--sdds-toggle-switch-disabled)}.sdds-toggle-webcomponent.sc-sdds-toggle label.sc-sdds-toggle{display:inline-block;vertical-align:middle;font:var(--sdds-detail-01);letter-spacing:var(--sdds-detail-01-ls);color:var(--sdds-toggle-label-color);padding-left:8px}.sdds-toggle-webcomponent.sc-sdds-toggle label.disabled.sc-sdds-toggle{color:var(--sdds-toggle-label-color-disabled)}';const g=class{constructor(d){s(this,d);this.sddsToggle=e(this,"sddsToggle",6);this.handleToggle=()=>{this.checked=!this.checked;this.sddsToggle.emit({toggleId:this.toggleId,checked:this.checked})};this.checked=false;this.required=false;this.size="lg";this.name=undefined;this.headline=undefined;this.disabled=false;this.toggleId=crypto.randomUUID()}async toggle(){this.checked=!this.checked;return{toggleId:this.toggleId,checked:this.checked}}render(){return d("div",{class:"sdds-toggle-webcomponent"},this.headline&&d("div",{class:`toggle-headline ${this.disabled?"disabled":""}`},this.headline),d("input",{"aria-describedby":this.host.getAttribute("aria-describedby"),"aria-labelledby":this.host.getAttribute("aria-labelledby"),"aria-checked":this.checked,"aria-required":this.required,onChange:()=>this.handleToggle(),class:`${this.size}`,checked:this.checked,disabled:this.disabled,required:this.required,type:"checkbox",name:this.name,id:this.toggleId,role:"switch"}),d("label",{class:`${this.disabled?"disabled":""}`,htmlFor:this.toggleId},d("slot",{name:"label"})))}get host(){return o(this)}};g.style=t;export{g as sdds_toggle};
-//# sourceMappingURL=p-bdae6bc9.entry.js.map

package/dist/tegel/p-bdae6bc9.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["sddsToggleCss","SddsToggle","this","handleToggle","checked","sddsToggle","emit","toggleId","crypto","randomUUID","async","render","h","class","headline","disabled","host","getAttribute","required","onChange","size","type","name","id","role","htmlFor"],"sources":["./src/components/toggle/sdds-toggle.scss?tag=sdds-toggle&encapsulation=scoped","./src/components/toggle/sdds-toggle.tsx"],"sourcesContent":[".sdds-toggle-webcomponent {\n  .toggle-headline {\n    font: var(--sdds-detail-02);\n    letter-spacing: var(--sdds-detail-02-ls);\n    color: var(--sdds-toggle-headline);\n    margin-bottom: 12px;\n\n    &.disabled {\n      color: var(--sdds-toggle-headline-disabled);\n    }\n  }\n\n  input[type='checkbox'] {\n    margin: 0;\n    width: 44px;\n    height: 24px;\n    position: relative;\n    display: inline-block;\n    vertical-align: middle;\n\n    &::after,\n    &::before {\n      content: '';\n      position: absolute;\n      box-sizing: border-box;\n      transition: all 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);\n    }\n\n    &::before {\n      /* Slider */\n      width: 44px;\n      height: 24px;\n      border-radius: 16px;\n      background-color: var(--sdds-toggle-off-slider);\n      left: 0;\n    }\n\n    /* Switch */\n    &::after {\n      width: 16px;\n      height: 16px;\n      background-color: var(--sdds-toggle-switch);\n      border-radius: 50%;\n      left: 4px;\n      top: 4px;\n    }\n\n    &:focus {\n      outline: none;\n\n      &::before {\n        background-color: var(--sdds-toggle-off-slider-focus);\n        border: 1px solid var(--sdds-toggle-off-border-focus);\n      }\n    }\n\n    &:checked {\n      &::before {\n        background-color: var(--sdds-toggle-on-slider);\n        border: 1px solid var(--sdds-toggle-on-border-focus);\n      }\n\n      &::after {\n        left: calc(44px - 20px);\n      }\n    }\n\n    &:disabled {\n      &::before {\n        background-color: var(--sdds-toggle-slider-disabled);\n        border: 1px solid var(--sdds-toggle-slider-disabled);\n      }\n\n      &::after {\n        background-color: var(--sdds-toggle-switch-disabled);\n      }\n    }\n\n    &:disabled:checked {\n      &::before {\n        background-color: var(--sdds-toggle-on-slider-disabled);\n        border: 1px solid var(--sdds-toggle-on-slider-disabled);\n      }\n\n      &::after {\n        background-color: var(--sdds-toggle-switch-disabled);\n      }\n    }\n\n    &.sm {\n      width: 28px;\n      height: 16px;\n\n      &::before {\n        width: 28px;\n        height: 16px;\n      }\n\n      &::after {\n        width: 8px;\n        height: 8px;\n      }\n\n      &:checked {\n        &::before {\n          background-color: var(--sdds-toggle-on-slider);\n        }\n\n        &::after {\n          left: calc(44px - 28px); // slider width - switch width - padding\n        }\n      }\n\n      &:disabled {\n        &::before {\n          background-color: var(--sdds-toggle-slider-disabled);\n          border: 1px solid var(--sdds-toggle-slider-disabled);\n        }\n\n        &::after {\n          background-color: var(--sdds-toggle-switch-disabled);\n        }\n      }\n    }\n  }\n\n  label {\n    display: inline-block;\n    vertical-align: middle;\n    font: var(--sdds-detail-01);\n    letter-spacing: var(--sdds-detail-01-ls);\n    color: var(--sdds-toggle-label-color);\n    padding-left: 8px;\n\n    &.disabled {\n      color: var(--sdds-toggle-label-color-disabled);\n    }\n  }\n}\n","import { Component, h, Prop, Event, Element, EventEmitter, Method } from '@stencil/core';\nimport { HostElement } from '@stencil/core/internal';\n\n@Component({\n  tag: 'sdds-toggle',\n  styleUrl: 'sdds-toggle.scss',\n  shadow: false,\n  scoped: true,\n})\nexport class SddsToggle {\n  /** Sets the toggle as checked */\n  @Prop({ reflect: true }) checked: boolean = false;\n\n  /** Make the toggle required */\n  @Prop() required: boolean = false;\n\n  /** Size of the toggle */\n  @Prop() size: 'sm' | 'lg' = 'lg';\n\n  /** Name of the toggles input element */\n  @Prop() name: string;\n\n  /** Headline for the toggle */\n  @Prop() headline: string;\n\n  /** Sets the toggle in a disabled state */\n  @Prop() disabled: boolean = false;\n\n  /** ID of the toggles input element, if not specifed it's randomly generated */\n  @Prop() toggleId: string = crypto.randomUUID();\n\n  @Element() host: HostElement;\n\n  /** Toggles the toggle. */\n  @Method()\n  async toggle() {\n    this.checked = !this.checked;\n    return {\n      toggleId: this.toggleId,\n      checked: this.checked,\n    };\n  }\n\n  /** Sends unique toggle identifier and status when it is toggled. */\n  @Event({\n    eventName: 'sddsToggle',\n    composed: true,\n    cancelable: false,\n    bubbles: true,\n  })\n  sddsToggle: EventEmitter<{\n    toggleId: string;\n    checked: boolean;\n  }>;\n\n  handleToggle = () => {\n    this.checked = !this.checked;\n    this.sddsToggle.emit({\n      toggleId: this.toggleId,\n      checked: this.checked,\n    });\n  };\n\n  render() {\n    return (\n      <div class=\"sdds-toggle-webcomponent\">\n        {this.headline && (\n          <div class={`toggle-headline ${this.disabled ? 'disabled' : ''}`}>{this.headline}</div>\n        )}\n        <input\n          aria-describedby={this.host.getAttribute('aria-describedby')}\n          aria-labelledby={this.host.getAttribute('aria-labelledby')}\n          aria-checked={this.checked}\n          aria-required={this.required}\n          onChange={() => this.handleToggle()}\n          class={`${this.size}`}\n          checked={this.checked}\n          disabled={this.disabled}\n          required={this.required}\n          type=\"checkbox\"\n          name={this.name}\n          id={this.toggleId}\n          role=\"switch\"\n        />\n        <label class={`${this.disabled ? 'disabled' : ''}`} htmlFor={this.toggleId}>\n          <slot name=\"label\"></slot>\n        </label>\n      </div>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAgB,wmH,MCSTC,EAAU,M,gEA8CrBC,KAAAC,aAAe,KACbD,KAAKE,SAAWF,KAAKE,QACrBF,KAAKG,WAAWC,KAAK,CACnBC,SAAUL,KAAKK,SACfH,QAASF,KAAKE,SACd,E,aAjDwC,M,cAGhB,M,UAGA,K,0DASA,M,cAGDI,OAAOC,Y,CAMlCC,eACER,KAAKE,SAAWF,KAAKE,QACrB,MAAO,CACLG,SAAUL,KAAKK,SACfH,QAASF,KAAKE,Q,CAwBlBO,SACE,OACEC,EAAA,OAAKC,MAAM,4BACRX,KAAKY,UACJF,EAAA,OAAKC,MAAO,mBAAmBX,KAAKa,SAAW,WAAa,MAAOb,KAAKY,UAE1EF,EAAA,4BACoBV,KAAKc,KAAKC,aAAa,oBAAmB,kBAC3Cf,KAAKc,KAAKC,aAAa,mBAAkB,eAC5Cf,KAAKE,QAAO,gBACXF,KAAKgB,SACpBC,SAAU,IAAMjB,KAAKC,eACrBU,MAAO,GAAGX,KAAKkB,OACfhB,QAASF,KAAKE,QACdW,SAAUb,KAAKa,SACfG,SAAUhB,KAAKgB,SACfG,KAAK,WACLC,KAAMpB,KAAKoB,KACXC,GAAIrB,KAAKK,SACTiB,KAAK,WAEPZ,EAAA,SAAOC,MAAO,GAAGX,KAAKa,SAAW,WAAa,KAAMU,QAASvB,KAAKK,UAChEK,EAAA,QAAMU,KAAK,W"}

package/dist/tegel/p-bdaf0bc2.entry.js

@@ -1,2 +0,0 @@
-import{r,h as i,H as d}from"./p-387e1798.js";const o=".divider{box-sizing:border-box}.divider *{box-sizing:border-box}.divider.horizontal{background-color:var(--sdds-divider-background);width:100%;height:1px}.divider.vertical{background-color:var(--sdds-divider-background);height:100%;width:1px}";const e=class{constructor(i){r(this,i);this.orientation="horizontal"}render(){return i(d,{role:"separator","aria-orientation":this.orientation==="vertical"?"vertical":undefined},i("div",{class:`divider ${this.orientation}`}))}};e.style=o;export{e as sdds_divider};
-//# sourceMappingURL=p-bdaf0bc2.entry.js.map

package/dist/tegel/p-bdaf0bc2.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["dividerComponentCss","Divider","render","h","Host","role","this","orientation","undefined","class"],"sources":["./src/components/divider/divider-component.scss?tag=sdds-divider&encapsulation=shadow","./src/components/divider/divider.tsx"],"sourcesContent":["@import '../../mixins/box-sizing';\n\n.divider {\n  @include sdds-box-sizing;\n\n  &.horizontal {\n    background-color: var(--sdds-divider-background);\n    width: 100%;\n    height: 1px;\n  }\n\n  &.vertical {\n    background-color: var(--sdds-divider-background);\n    height: 100%;\n    width: 1px;\n  }\n}\n","import { Component, Prop, Host, h } from '@stencil/core';\n\n@Component({\n  tag: 'sdds-divider',\n  styleUrl: 'divider-component.scss',\n  shadow: true,\n})\nexport class Divider {\n  /** Orientation of the Divider, horizontal if not specified. */\n  @Prop() orientation: 'horizontal' | 'vertical' = 'horizontal';\n\n  render() {\n    return (\n      <Host\n        role=\"separator\"\n        aria-orientation={this.orientation === 'vertical' ? 'vertical' : undefined}\n      >\n        <div class={`divider ${this.orientation}`} />\n      </Host>\n    );\n  }\n}\n"],"mappings":"6CAAA,MAAMA,EAAsB,qP,MCOfC,EAAO,M,0CAE+B,Y,CAEjDC,SACE,OACEC,EAACC,EAAI,CACHC,KAAK,YAAW,mBACEC,KAAKC,cAAgB,WAAa,WAAaC,WAEjEL,EAAA,OAAKM,MAAO,WAAWH,KAAKC,gB"}

package/dist/tegel/p-c4d28002.entry.js

@@ -1,2 +0,0 @@
-import{r as t,h as s}from"./p-387e1798.js";import{c as o}from"./p-ec26fc38.js";const i=":root,.sdds-mode-light{--sdds-tooltip-background:var(--sdds-grey-800);--sdds-tooltip-color:var(--sdds-white)}.sdds-mode-dark{--sdds-tooltip-background:var(--sdds-grey-200);--sdds-tooltip-color:var(--sdds-grey-958)}.sdds-tooltip{box-sizing:border-box;font:var(--sdds-detail-05);letter-spacing:var(--sdds-detail-05-ls);color:var(--sdds-tooltip-color);background-color:var(--sdds-tooltip-background);border-radius:4px;padding:8px;word-wrap:break-word;max-width:192px;z-index:800;opacity:0;visibility:hidden;transition:opacity 200ms ease-in, visibility 200ms ease-in}.sdds-tooltip *{box-sizing:border-box}.sdds-tooltip.sdds-tooltip-top-left{border-radius:0 4px 4px}.sdds-tooltip.sdds-tooltip-top-right{border-radius:4px 0 4px 4px}.sdds-tooltip.sdds-tooltip-bottom-right{border-radius:4px 4px 0}.sdds-tooltip.sdds-tooltip-bottom-left{border-radius:4px 4px 4px 0}.sdds-tooltip-show{opacity:1;visibility:visible}";const d=class{constructor(s){t(this,s);this.offsetSkidding=0;this.offsetDistance=8;this.text="";this.selector="";this.referenceEl=undefined;this.mouseOverTooltip=false;this.show=false;this.placement="bottom";this.popperInstance=undefined;this.target=undefined}componentDidLoad(){var t;this.target=(t=this.referenceEl)!==null&&t!==void 0?t:document.querySelector(this.selector);const s=this;this.popperInstance=o(this.target,this.tooltip,{placement:s.placement,modifiers:[{name:"positionCalc",enabled:true,phase:"main",fn({state:t}){if(t.placement==="bottom-start"||t.placement==="right-start"){s.border="top-left"}else if(t.placement==="bottom-end"||t.placement==="left-start"){s.border="top-right"}else if(t.placement==="top-end"||t.placement==="left-end"){s.border="bottom-right"}else if(t.placement==="top-start"||t.placement==="right-end"){s.border="bottom-left"}else if(t.placement==="bottom"||t.placement==="top"){s.border="default"}}},{name:"offset",options:{offset:[this.offsetSkidding,this.offsetDistance]}}]});const i=()=>{this.show=true};const d=()=>{this.show=false};this.target.addEventListener("focusin",(()=>{i()}));this.target.addEventListener("focusout",(()=>{d()}));this.target.addEventListener("mouseenter",(()=>{i()}));this.target.addEventListener("mouseleave",(()=>{d()}));if(this.mouseOverTooltip===true){this.tooltip.addEventListener("mouseenter",(()=>{i()}));this.tooltip.addEventListener("mouseleave",(()=>{d()}))}}disconnectedCallback(){var t;(t=this.popperInstance)===null||t===void 0?void 0:t.destroy()}render(){return s("span",{ref:t=>{this.tooltip=t},class:`sdds-tooltip sdds-tooltip-${this.border} ${this.show?"sdds-tooltip-show":""}`},this.text,s("slot",null))}};d.style=i;export{d as sdds_tooltip};
-//# sourceMappingURL=p-c4d28002.entry.js.map

package/dist/tegel/p-c4d28002.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["tooltipCss","Tooltip","this","offsetSkidding","offsetDistance","componentDidLoad","target","_a","referenceEl","document","querySelector","selector","thisValue","popperInstance","createPopper","tooltip","placement","modifiers","name","enabled","phase","fn","state","border","options","offset","showTooltip","show","hideTooltip","addEventListener","mouseOverTooltip","disconnectedCallback","destroy","render","h","ref","el","class","text"],"sources":["./src/components/tooltip/tooltip.scss?tag=sdds-tooltip&encapsulation=shadow","./src/components/tooltip/tooltip.tsx"],"sourcesContent":["@import '../../mixins/z-index';\n@import './tooltip-vars.scss';\n@import '../../mixins/box-sizing';\n\n.sdds-tooltip {\n  @include sdds-box-sizing;\n\n  font: var(--sdds-detail-05);\n  letter-spacing: var(--sdds-detail-05-ls);\n  color: var(--sdds-tooltip-color);\n  background-color: var(--sdds-tooltip-background);\n  border-radius: 4px;\n  padding: 8px;\n  word-wrap: break-word;\n  max-width: 192px;\n  z-index: z(tooltip);\n  opacity: 0;\n  visibility: hidden;\n  transition: opacity 200ms ease-in, visibility 200ms ease-in;\n\n  &.sdds-tooltip-top-left {\n    border-radius: 0 4px 4px;\n  }\n\n  &.sdds-tooltip-top-right {\n    border-radius: 4px 0 4px 4px;\n  }\n\n  &.sdds-tooltip-bottom-right {\n    border-radius: 4px 4px 0;\n  }\n\n  &.sdds-tooltip-bottom-left {\n    border-radius: 4px 4px 4px 0;\n  }\n}\n\n.sdds-tooltip-show {\n  opacity: 1;\n  visibility: visible;\n}\n","import { Component, h, Prop, State } from '@stencil/core';\nimport { createPopper } from '@popperjs/core';\nimport type { Placement, Instance } from '@popperjs/core';\n\n@Component({\n  tag: 'sdds-tooltip',\n  styleUrl: 'tooltip.scss',\n  shadow: true,\n})\nexport class Tooltip {\n  /** In case tooltip contains only text, no HTML, text can be passed by this prop */\n  @Prop() text: string = '';\n\n  /** The CSS-selector for an element that will trigger the tooltip */\n  @Prop() selector: string = '';\n\n  /** Element that will trigger the tooltip (takes priority over selector) */\n  @Prop() referenceEl: HTMLElement;\n\n  /** Allow mouse over tooltip. Useful when tooltip contains clickable elements like link or button. */\n  @Prop() mouseOverTooltip: boolean = false;\n\n  /** Prop in control of showing and hiding prop */\n  @Prop({ mutable: true }) show: boolean = false;\n\n  /** Placement of tooltip. */\n  @Prop() placement: Placement = 'bottom';\n\n  @State() popperInstance: Instance;\n\n  @State() target: any;\n\n  border: string;\n\n  offsetSkidding: number = 0;\n\n  offsetDistance: number = 8;\n\n  tooltip!: HTMLInputElement;\n\n  componentDidLoad() {\n    this.target = this.referenceEl ?? document.querySelector(this.selector);\n\n    const thisValue = this;\n    this.popperInstance = createPopper(this.target, this.tooltip, {\n      placement: thisValue.placement,\n      modifiers: [\n        {\n          name: 'positionCalc',\n          enabled: true,\n          phase: 'main',\n          fn({ state }) {\n            if (state.placement === 'bottom-start' || state.placement === 'right-start') {\n              thisValue.border = 'top-left';\n            } else if (state.placement === 'bottom-end' || state.placement === 'left-start') {\n              thisValue.border = 'top-right';\n            } else if (state.placement === 'top-end' || state.placement === 'left-end') {\n              thisValue.border = 'bottom-right';\n            } else if (state.placement === 'top-start' || state.placement === 'right-end') {\n              thisValue.border = 'bottom-left';\n            } else if (state.placement === 'bottom' || state.placement === 'top') {\n              thisValue.border = 'default';\n            }\n          },\n        },\n        {\n          name: 'offset',\n          options: {\n            offset: [this.offsetSkidding, this.offsetDistance],\n          },\n        },\n      ],\n    });\n\n    const showTooltip = () => {\n      this.show = true;\n    };\n\n    const hideTooltip = () => {\n      this.show = false;\n    };\n\n    // For tabbing over element\n    this.target.addEventListener('focusin', () => {\n      showTooltip();\n    });\n\n    this.target.addEventListener('focusout', () => {\n      hideTooltip();\n    });\n\n    // For hovering over element with selector\n    this.target.addEventListener('mouseenter', () => {\n      showTooltip();\n    });\n\n    this.target.addEventListener('mouseleave', () => {\n      hideTooltip();\n    });\n\n    // For hovering over tooltip itself:\n    if (this.mouseOverTooltip === true) {\n      this.tooltip.addEventListener('mouseenter', () => {\n        showTooltip();\n      });\n\n      this.tooltip.addEventListener('mouseleave', () => {\n        hideTooltip();\n      });\n    }\n  }\n\n  disconnectedCallback() {\n    this.popperInstance?.destroy();\n  }\n\n  /* Slot on line 118 is added to support adding HTML elements to component */\n  render() {\n    return (\n      <span\n        ref={(el) => {\n          this.tooltip = el as HTMLInputElement;\n        }}\n        class={`sdds-tooltip sdds-tooltip-${this.border} ${this.show ? 'sdds-tooltip-show' : ''}`}\n      >\n        {this.text}\n        <slot />\n      </span>\n    );\n  }\n}\n"],"mappings":"+EAAA,MAAMA,EAAa,44B,MCSNC,EAAO,M,yBAyBlBC,KAAAC,eAAyB,EAEzBD,KAAAE,eAAyB,E,UAzBF,G,cAGI,G,iDAMS,M,UAGK,M,eAGV,S,oDAc/BC,mB,MACEH,KAAKI,QAASC,EAAAL,KAAKM,eAAW,MAAAD,SAAA,EAAAA,EAAIE,SAASC,cAAcR,KAAKS,UAE9D,MAAMC,EAAYV,KAClBA,KAAKW,eAAiBC,EAAaZ,KAAKI,OAAQJ,KAAKa,QAAS,CAC5DC,UAAWJ,EAAUI,UACrBC,UAAW,CACT,CACEC,KAAM,eACNC,QAAS,KACTC,MAAO,OACPC,IAAGC,MAAEA,IACH,GAAIA,EAAMN,YAAc,gBAAkBM,EAAMN,YAAc,cAAe,CAC3EJ,EAAUW,OAAS,U,MACd,GAAID,EAAMN,YAAc,cAAgBM,EAAMN,YAAc,aAAc,CAC/EJ,EAAUW,OAAS,W,MACd,GAAID,EAAMN,YAAc,WAAaM,EAAMN,YAAc,WAAY,CAC1EJ,EAAUW,OAAS,c,MACd,GAAID,EAAMN,YAAc,aAAeM,EAAMN,YAAc,YAAa,CAC7EJ,EAAUW,OAAS,a,MACd,GAAID,EAAMN,YAAc,UAAYM,EAAMN,YAAc,MAAO,CACpEJ,EAAUW,OAAS,S,IAIzB,CACEL,KAAM,SACNM,QAAS,CACPC,OAAQ,CAACvB,KAAKC,eAAgBD,KAAKE,qBAM3C,MAAMsB,EAAc,KAClBxB,KAAKyB,KAAO,IAAI,EAGlB,MAAMC,EAAc,KAClB1B,KAAKyB,KAAO,KAAK,EAInBzB,KAAKI,OAAOuB,iBAAiB,WAAW,KACtCH,GAAa,IAGfxB,KAAKI,OAAOuB,iBAAiB,YAAY,KACvCD,GAAa,IAIf1B,KAAKI,OAAOuB,iBAAiB,cAAc,KACzCH,GAAa,IAGfxB,KAAKI,OAAOuB,iBAAiB,cAAc,KACzCD,GAAa,IAIf,GAAI1B,KAAK4B,mBAAqB,KAAM,CAClC5B,KAAKa,QAAQc,iBAAiB,cAAc,KAC1CH,GAAa,IAGfxB,KAAKa,QAAQc,iBAAiB,cAAc,KAC1CD,GAAa,G,EAKnBG,uB,OACExB,EAAAL,KAAKW,kBAAc,MAAAN,SAAA,SAAAA,EAAEyB,S,CAIvBC,SACE,OACEC,EAAA,QACEC,IAAMC,IACJlC,KAAKa,QAAUqB,CAAsB,EAEvCC,MAAO,6BAA6BnC,KAAKqB,UAAUrB,KAAKyB,KAAO,oBAAsB,MAEpFzB,KAAKoC,KACNJ,EAAA,a"}

package/dist/tegel/p-c6c75439.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as s,h as o,H as i,g as e}from"./p-387e1798.js";const l=':host{box-sizing:border-box;display:flex;background-color:var(--sdds-inline-tabs-background);position:relative}:host *{box-sizing:border-box}:host::after{content:" ";display:block;border-bottom:1px solid var(--sdds-inline-tabs-horizontal-divider-background);opacity:var(--sdds-inline-tabs-horizontal-divider-opacity);left:0;right:0;bottom:0;position:absolute}:host .wrapper{display:flex;flex-wrap:nowrap;white-space:nowrap;width:100%;overflow-x:scroll;scrollbar-width:none}:host .wrapper::-webkit-scrollbar{display:none}:host .scroll-right-button{right:0;z-index:201}:host .scroll-left-button{left:0;z-index:201}:host .scroll-right-button,:host .scroll-left-button{color:var(--sdds-folder-tabs-scroll-btn-color);cursor:pointer;border:0;width:0;background-color:var(--sdds-inline-tabs-scroll-btn-background);display:none;justify-content:center;align-items:center;opacity:0;pointer-events:none;position:sticky}:host .scroll-right-button.show,:host .scroll-left-button.show{min-width:48px;display:block;opacity:1;pointer-events:all}:host .scroll-right-button:hover,:host .scroll-left-button:hover{background-color:var(--sdds-folder-tabs-scroll-btn-background-hover)}:host .scroll-right-button:active,:host .scroll-left-button:active{background-color:var(--sdds-folder-tabs-scroll-btn-background-active)}:host .scroll-right-button:focus,:host .scroll-left-button:focus{outline:2px solid var(--sdds-blue-400);outline-offset:-2px}:host .scroll-right-button svg,:host .scroll-left-button svg{fill:var(--sdds-folder-tabs-scroll-btn-color)}';const r=class{constructor(o){t(this,o);this.sddsChange=s(this,"sddsChange",7);this.navWrapperElement=null;this.componentWidth=0;this.buttonsWidth=0;this.scrollWidth=0;this.modeVariant="primary";this.showLeftScroll=false;this.showRightScroll=false;this.selectedTab=undefined}async selectTab(t){if(!this.children[t].disabled){this.children.forEach((t=>t.removeAttribute("selected")));this.children=this.children.map(((s,o)=>{if(o===t){s.setAttribute("selected","");this.selectedTab={tab:s.innerText,tabIndex:o}}return s}))}return{selectedTab:this.selectedTab.tab,selectedTabIndex:this.selectedTab.tabIndex}}handleSelectedTabChange(){this.host.setAttribute("selected-tab",this.selectedTab.tab);this.host.setAttribute("selected-tab-index",`${this.selectedTab.tabIndex}`);this.sddsChange.emit({selectedTab:this.selectedTab})}connectedCallback(){this.children=Array.from(this.host.children);this.children=this.children.map(((t,s)=>{t.addEventListener("click",(()=>{if(!t.disabled){this.children.forEach((t=>t.removeAttribute("selected")));t.setAttribute("selected","");this.selectedTab={tab:t.innerText,tabIndex:s}}}));if(s===0){t.classList.add("first")}if(s===this.children.length-1){t.classList.add("last")}if(t.selected){this.selectedTab={tab:t.innerText,tabIndex:s}}return t}));this.children=Array.from(this.host.children);this.children[0].classList.add("first");this.children[this.children.length-1].classList.add("last")}componentDidLoad(){const t=new ResizeObserver((t=>{t.forEach((t=>{const s=t.contentRect.width;let o=0;const i=Array.from(this.host.children);i.forEach((t=>{const s=window.getComputedStyle(t);o+=t.clientWidth+parseFloat(s.marginLeft)+parseFloat(s.marginRight);t.classList.add("sdds-navigation-tabs-tab")}));this.componentWidth=s;this.buttonsWidth=o;this.scrollWidth=o-s;if(this.buttonsWidth>this.componentWidth){this.evaluateScrollButtons()}else{this.showLeftScroll=false;this.showRightScroll=false}}))}));t.observe(this.navWrapperElement)}scrollRight(){const t=this.navWrapperElement.scrollLeft;this.navWrapperElement.scrollLeft=t+this.buttonsWidth;this.evaluateScrollButtons()}scrollLeft(){const t=this.navWrapperElement.scrollLeft;this.navWrapperElement.scrollLeft=t-this.buttonsWidth;this.evaluateScrollButtons()}evaluateScrollButtons(){const t=this.navWrapperElement.scrollLeft;if(t>=this.scrollWidth){this.showRightScroll=false}else{this.showRightScroll=true}if(t<=0){this.showLeftScroll=false}else{this.showLeftScroll=true}}render(){return o(i,{class:`${this.modeVariant?`sdds-mode-variant-${this.modeVariant}`:""}`},o("div",{role:"list",class:"wrapper",ref:t=>{this.navWrapperElement=t}},o("button",{class:`scroll-left-button ${this.showLeftScroll?"show":""}`,onClick:()=>this.scrollLeft(),disabled:!this.showLeftScroll},o("sdds-icon",{name:"chevron_left",size:"20px"})),o("slot",null),o("button",{class:`scroll-right-button ${this.showRightScroll?"show":""}`,onClick:()=>this.scrollRight(),disabled:!this.showRightScroll},o("sdds-icon",{name:"chevron_right",size:"20px"}))))}get host(){return e(this)}static get watchers(){return{selectedTab:["handleSelectedTabChange"]}}};r.style=l;export{r as sdds_navigation_tabs};
-//# sourceMappingURL=p-c6c75439.entry.js.map

package/dist/tegel/p-c6c75439.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["navigationTabsCss","NavigationTabs","this","navWrapperElement","componentWidth","buttonsWidth","scrollWidth","async","tabIndex","children","disabled","forEach","element","removeAttribute","map","index","setAttribute","selectedTab","tab","innerText","selectedTabIndex","handleSelectedTabChange","host","sddsChange","emit","connectedCallback","Array","from","item","addEventListener","classList","add","length","selected","componentDidLoad","resizeObserver","ResizeObserver","entries","entry","contentRect","width","navButtons","navButton","style","window","getComputedStyle","clientWidth","parseFloat","marginLeft","marginRight","evaluateScrollButtons","showLeftScroll","showRightScroll","observe","scrollRight","scroll","scrollLeft","render","h","Host","class","modeVariant","role","ref","el","onClick","name","size"],"sources":["./src/components/tabs/navigation-tabs/navigation-tabs.scss?tag=sdds-navigation-tabs&encapsulation=shadow","./src/components/tabs/navigation-tabs/navigation-tabs.tsx"],"sourcesContent":["@import '../../../mixins/focus-state';\n@import '../../../mixins/box-sizing';\n@import '../../../mixins/z-index';\n\n:host {\n  @include sdds-box-sizing;\n\n  display: flex;\n  background-color: var(--sdds-inline-tabs-background);\n  position: relative;\n\n  &::after {\n    content: ' ';\n    display: block;\n    border-bottom: 1px solid var(--sdds-inline-tabs-horizontal-divider-background);\n    opacity: var(--sdds-inline-tabs-horizontal-divider-opacity);\n    left: 0;\n    right: 0;\n    bottom: 0;\n    position: absolute;\n  }\n\n  .wrapper {\n    display: flex;\n    flex-wrap: nowrap;\n    white-space: nowrap;\n    width: 100%;\n    overflow-x: scroll;\n    scrollbar-width: none;\n\n    &::-webkit-scrollbar {\n      display: none;\n    }\n  }\n\n  .scroll-right-button {\n    right: 0;\n    z-index: calc(z(tab) + 1);\n  }\n\n  .scroll-left-button {\n    left: 0;\n    z-index: calc(z(tab) + 1);\n  }\n\n  .scroll-right-button,\n  .scroll-left-button {\n    color: var(--sdds-folder-tabs-scroll-btn-color);\n    cursor: pointer;\n    border: 0;\n    width: 0;\n    background-color: var(--sdds-inline-tabs-scroll-btn-background);\n    display: none;\n    justify-content: center;\n    align-items: center;\n    opacity: 0;\n    pointer-events: none;\n    position: sticky;\n\n    &.show {\n      min-width: 48px;\n      display: block;\n      opacity: 1;\n      pointer-events: all;\n    }\n\n    &:hover {\n      background-color: var(--sdds-folder-tabs-scroll-btn-background-hover);\n    }\n\n    &:active {\n      background-color: var(--sdds-folder-tabs-scroll-btn-background-active);\n    }\n\n    &:focus {\n      @include sdds-focus-state;\n    }\n\n    svg {\n      fill: var(--sdds-folder-tabs-scroll-btn-color);\n    }\n  }\n}\n","import {\n  Component,\n  Host,\n  State,\n  Element,\n  h,\n  Prop,\n  Event,\n  EventEmitter,\n  Watch,\n  Method,\n} from '@stencil/core';\n\n@Component({\n  tag: 'sdds-navigation-tabs',\n  styleUrl: 'navigation-tabs.scss',\n  shadow: true,\n})\nexport class NavigationTabs {\n  /** Variant of the tabs, primary= on white, secondary= on grey50 */\n  @Prop() modeVariant: 'primary' | 'secondary' = 'primary';\n\n  @Element() host: HTMLElement;\n\n  @State() showLeftScroll: boolean = false;\n\n  @State() showRightScroll: boolean = false;\n\n  @State() selectedTab: {\n    tab: string;\n    tabIndex: number;\n  };\n\n  private navWrapperElement: HTMLElement = null; // reference to container with nav buttons\n\n  private componentWidth: number = 0; // visible width of this component\n\n  private buttonsWidth: number = 0; // total width of all nav items combined\n\n  private scrollWidth: number = 0; // total amount that is possible to scroll in the nav wrapper\n\n  private children: Array<HTMLSddsNavigationTabsLinkElement | HTMLSddsNavigationTabsButtonElement>;\n\n  /** Selects a tab based on tabindex, will not select a disabled tab. */\n  @Method()\n  async selectTab(tabIndex: number) {\n    if (!this.children[tabIndex].disabled) {\n      this.children.forEach((element) => element.removeAttribute('selected'));\n      this.children = this.children.map((element, index) => {\n        if (index === tabIndex) {\n          element.setAttribute('selected', '');\n          this.selectedTab = {\n            tab: element.innerText,\n            tabIndex: index,\n          };\n        }\n        return element;\n      });\n    }\n    return {\n      selectedTab: this.selectedTab.tab,\n      selectedTabIndex: this.selectedTab.tabIndex,\n    };\n  }\n\n  @Event({\n    eventName: 'sddsChange',\n    composed: true,\n    cancelable: true,\n    bubbles: true,\n  })\n  sddsChange: EventEmitter<{\n    selectedTab: {\n      tab: string;\n      tabIndex: number;\n    };\n  }>;\n\n  @Watch('selectedTab')\n  handleSelectedTabChange() {\n    this.host.setAttribute('selected-tab', this.selectedTab.tab);\n    this.host.setAttribute('selected-tab-index', `${this.selectedTab.tabIndex}`);\n    this.sddsChange.emit({\n      selectedTab: this.selectedTab,\n    });\n  }\n\n  connectedCallback() {\n    this.children = Array.from(this.host.children) as Array<\n      HTMLSddsFolderTabsLinkElement | HTMLSddsFolderTabsButtonElement\n    >;\n    this.children = this.children.map((item, index) => {\n      item.addEventListener('click', () => {\n        if (!item.disabled) {\n          this.children.forEach((element) => element.removeAttribute('selected'));\n          item.setAttribute('selected', '');\n          this.selectedTab = {\n            tab: item.innerText,\n            tabIndex: index,\n          };\n        }\n      });\n      if (index === 0) {\n        item.classList.add('first');\n      }\n      if (index === this.children.length - 1) {\n        item.classList.add('last');\n      }\n      if (item.selected) {\n        this.selectedTab = {\n          tab: item.innerText,\n          tabIndex: index,\n        };\n      }\n      return item;\n    });\n\n    this.children = Array.from(this.host.children) as Array<\n      HTMLSddsNavigationTabsLinkElement | HTMLSddsNavigationTabsButtonElement\n    >;\n    this.children[0].classList.add('first');\n    this.children[this.children.length - 1].classList.add('last');\n  }\n\n  componentDidLoad() {\n    const resizeObserver = new ResizeObserver((entries) => {\n      entries.forEach((entry) => {\n        const componentWidth = entry.contentRect.width;\n        let buttonsWidth = 0;\n\n        const navButtons = Array.from(this.host.children);\n        navButtons.forEach((navButton: HTMLElement) => {\n          const style = window.getComputedStyle(navButton);\n          buttonsWidth +=\n            navButton.clientWidth + parseFloat(style.marginLeft) + parseFloat(style.marginRight);\n\n          navButton.classList.add('sdds-navigation-tabs-tab');\n        });\n\n        this.componentWidth = componentWidth;\n        this.buttonsWidth = buttonsWidth;\n        this.scrollWidth = buttonsWidth - componentWidth;\n\n        if (this.buttonsWidth > this.componentWidth) {\n          this.evaluateScrollButtons();\n        } else {\n          this.showLeftScroll = false;\n          this.showRightScroll = false;\n        }\n      });\n    });\n\n    resizeObserver.observe(this.navWrapperElement);\n  }\n\n  scrollRight() {\n    const scroll = this.navWrapperElement.scrollLeft;\n    this.navWrapperElement.scrollLeft = scroll + this.buttonsWidth;\n\n    this.evaluateScrollButtons();\n  }\n\n  scrollLeft() {\n    const scroll = this.navWrapperElement.scrollLeft;\n    this.navWrapperElement.scrollLeft = scroll - this.buttonsWidth;\n\n    this.evaluateScrollButtons();\n  }\n\n  evaluateScrollButtons() {\n    const scroll = this.navWrapperElement.scrollLeft;\n\n    if (scroll >= this.scrollWidth) {\n      this.showRightScroll = false;\n    } else {\n      this.showRightScroll = true;\n    }\n\n    if (scroll <= 0) {\n      this.showLeftScroll = false;\n    } else {\n      this.showLeftScroll = true;\n    }\n  }\n\n  render() {\n    return (\n      <Host class={`${this.modeVariant ? `sdds-mode-variant-${this.modeVariant}` : ''}`}>\n        <div\n          role=\"list\"\n          class=\"wrapper\"\n          ref={(el) => {\n            this.navWrapperElement = el as HTMLElement;\n          }}\n        >\n          <button\n            class={`scroll-left-button ${this.showLeftScroll ? 'show' : ''}`}\n            onClick={() => this.scrollLeft()}\n            disabled={!this.showLeftScroll}\n          >\n            <sdds-icon name=\"chevron_left\" size=\"20px\"></sdds-icon>\n          </button>\n          <slot />\n          <button\n            class={`scroll-right-button ${this.showRightScroll ? 'show' : ''}`}\n            onClick={() => this.scrollRight()}\n            disabled={!this.showRightScroll}\n          >\n            <sdds-icon name=\"chevron_right\" size=\"20px\"></sdds-icon>\n          </button>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"gEAAA,MAAMA,EAAoB,8/C,MCkBbC,EAAc,M,gEAejBC,KAAAC,kBAAiC,KAEjCD,KAAAE,eAAyB,EAEzBF,KAAAG,aAAuB,EAEvBH,KAAAI,YAAsB,E,iBAnBiB,U,oBAIZ,M,qBAEC,M,2BAmBpCC,gBAAgBC,GACd,IAAKN,KAAKO,SAASD,GAAUE,SAAU,CACrCR,KAAKO,SAASE,SAASC,GAAYA,EAAQC,gBAAgB,cAC3DX,KAAKO,SAAWP,KAAKO,SAASK,KAAI,CAACF,EAASG,KAC1C,GAAIA,IAAUP,EAAU,CACtBI,EAAQI,aAAa,WAAY,IACjCd,KAAKe,YAAc,CACjBC,IAAKN,EAAQO,UACbX,SAAUO,E,CAGd,OAAOH,CAAO,G,CAGlB,MAAO,CACLK,YAAaf,KAAKe,YAAYC,IAC9BE,iBAAkBlB,KAAKe,YAAYT,S,CAkBvCa,0BACEnB,KAAKoB,KAAKN,aAAa,eAAgBd,KAAKe,YAAYC,KACxDhB,KAAKoB,KAAKN,aAAa,qBAAsB,GAAGd,KAAKe,YAAYT,YACjEN,KAAKqB,WAAWC,KAAK,CACnBP,YAAaf,KAAKe,a,CAItBQ,oBACEvB,KAAKO,SAAWiB,MAAMC,KAAKzB,KAAKoB,KAAKb,UAGrCP,KAAKO,SAAWP,KAAKO,SAASK,KAAI,CAACc,EAAMb,KACvCa,EAAKC,iBAAiB,SAAS,KAC7B,IAAKD,EAAKlB,SAAU,CAClBR,KAAKO,SAASE,SAASC,GAAYA,EAAQC,gBAAgB,cAC3De,EAAKZ,aAAa,WAAY,IAC9Bd,KAAKe,YAAc,CACjBC,IAAKU,EAAKT,UACVX,SAAUO,E,KAIhB,GAAIA,IAAU,EAAG,CACfa,EAAKE,UAAUC,IAAI,Q,CAErB,GAAIhB,IAAUb,KAAKO,SAASuB,OAAS,EAAG,CACtCJ,EAAKE,UAAUC,IAAI,O,CAErB,GAAIH,EAAKK,SAAU,CACjB/B,KAAKe,YAAc,CACjBC,IAAKU,EAAKT,UACVX,SAAUO,E,CAGd,OAAOa,CAAI,IAGb1B,KAAKO,SAAWiB,MAAMC,KAAKzB,KAAKoB,KAAKb,UAGrCP,KAAKO,SAAS,GAAGqB,UAAUC,IAAI,SAC/B7B,KAAKO,SAASP,KAAKO,SAASuB,OAAS,GAAGF,UAAUC,IAAI,O,CAGxDG,mBACE,MAAMC,EAAiB,IAAIC,gBAAgBC,IACzCA,EAAQ1B,SAAS2B,IACf,MAAMlC,EAAiBkC,EAAMC,YAAYC,MACzC,IAAInC,EAAe,EAEnB,MAAMoC,EAAaf,MAAMC,KAAKzB,KAAKoB,KAAKb,UACxCgC,EAAW9B,SAAS+B,IAClB,MAAMC,EAAQC,OAAOC,iBAAiBH,GACtCrC,GACEqC,EAAUI,YAAcC,WAAWJ,EAAMK,YAAcD,WAAWJ,EAAMM,aAE1EP,EAAUZ,UAAUC,IAAI,2BAA2B,IAGrD7B,KAAKE,eAAiBA,EACtBF,KAAKG,aAAeA,EACpBH,KAAKI,YAAcD,EAAeD,EAElC,GAAIF,KAAKG,aAAeH,KAAKE,eAAgB,CAC3CF,KAAKgD,uB,KACA,CACLhD,KAAKiD,eAAiB,MACtBjD,KAAKkD,gBAAkB,K,IAEzB,IAGJjB,EAAekB,QAAQnD,KAAKC,kB,CAG9BmD,cACE,MAAMC,EAASrD,KAAKC,kBAAkBqD,WACtCtD,KAAKC,kBAAkBqD,WAAaD,EAASrD,KAAKG,aAElDH,KAAKgD,uB,CAGPM,aACE,MAAMD,EAASrD,KAAKC,kBAAkBqD,WACtCtD,KAAKC,kBAAkBqD,WAAaD,EAASrD,KAAKG,aAElDH,KAAKgD,uB,CAGPA,wBACE,MAAMK,EAASrD,KAAKC,kBAAkBqD,WAEtC,GAAID,GAAUrD,KAAKI,YAAa,CAC9BJ,KAAKkD,gBAAkB,K,KAClB,CACLlD,KAAKkD,gBAAkB,I,CAGzB,GAAIG,GAAU,EAAG,CACfrD,KAAKiD,eAAiB,K,KACjB,CACLjD,KAAKiD,eAAiB,I,EAI1BM,SACE,OACEC,EAACC,EAAI,CAACC,MAAO,GAAG1D,KAAK2D,YAAc,qBAAqB3D,KAAK2D,cAAgB,MAC3EH,EAAA,OACEI,KAAK,OACLF,MAAM,UACNG,IAAMC,IACJ9D,KAAKC,kBAAoB6D,CAAiB,GAG5CN,EAAA,UACEE,MAAO,sBAAsB1D,KAAKiD,eAAiB,OAAS,KAC5Dc,QAAS,IAAM/D,KAAKsD,aACpB9C,UAAWR,KAAKiD,gBAEhBO,EAAA,aAAWQ,KAAK,eAAeC,KAAK,UAEtCT,EAAA,aACAA,EAAA,UACEE,MAAO,uBAAuB1D,KAAKkD,gBAAkB,OAAS,KAC9Da,QAAS,IAAM/D,KAAKoD,cACpB5C,UAAWR,KAAKkD,iBAEhBM,EAAA,aAAWQ,KAAK,gBAAgBC,KAAK,W"}

package/dist/tegel/p-ccb82bc3.entry.js

@@ -1,2 +0,0 @@
-import{r as s,c as a,h as t,H as e,g as r}from"./p-387e1798.js";const d=':host{box-sizing:border-box;display:table-caption;position:relative;background-color:var(--sdds-data-table-toolbar-background);color:var(--sdds-data-table-color);padding:0 var(--sdds-spacing-element-16);height:64px;border-top-left-radius:4px;border-top-right-radius:4px}:host *{box-sizing:border-box}:host .sdds-table__upper-bar-flex{width:100%;height:100%;display:flex;justify-content:space-between}:host .sdds-table__title{font:var(--sdds-headline-07);letter-spacing:var(--sdds-headline-07-ls);padding-top:var(--sdds-spacing-element-16);text-align:left}:host .sdds-table__actionbar{display:flex;align-self:center;gap:8px}:host .sdds-table__searchbar{display:flex;align-self:center;position:relative;height:40px;width:40px;border-radius:4px 4px 0 0;transition:background-color 250ms ease, width 250ms ease;overflow:hidden;background-color:transparent}:host .sdds-table__searchbar::after{content:"";width:100%;height:2px;position:absolute;bottom:0;background-color:var(--sdds-blue-400);transform:scaleX(0);transition:transform 150ms ease}:host .sdds-table__searchbar:focus-within::after{transform:scaleX(100%)}:host .sdds-table__searchbar:focus-within,:host .sdds-table__searchbar.sdds-table__searchbar--active{width:208px;background-color:var(--sdds-data-table-toolbar-searchbar-background)}:host .sdds-table__searchbar:focus-within:hover,:host .sdds-table__searchbar.sdds-table__searchbar--active:hover{background-color:var(--sdds-data-table-toolbar-searchbar-background)}:host .sdds-table__searchbar .sdds-table__searchbar-input{font:var(--sdds-detail-02);letter-spacing:var(--sdds-detail-02-ls);color:var(--sdds-data-table-color);z-index:1;width:100%;height:100%;border:none;padding:0 36px 0 16px;background-color:transparent;outline:none;cursor:pointer}:host .sdds-table__searchbar .sdds-table__searchbar-input :focus{background-color:var(--sdds-data-table-toolbar-searchbar-background)}:host .sdds-table__searchbar:hover{background-color:var(--sdds-data-table-toolbar-searchbar-background-hover)}:host .sdds-table__searchbar .sdds-table__searchbar-icon{z-index:0;position:absolute;right:9px;top:9px;width:20px;height:20px}:host(.sdds-table--compact){height:56px}';const o=["compactDesign","noMinWidth","verticalDividers"];const i=class{constructor(t){s(this,t);this.sddsFilter=a(this,"sddsFilter",7);this.tableTitle="";this.enableFiltering=false;this.verticalDividers=false;this.compactDesign=false;this.noMinWidth=false;this.whiteBackground=false;this.tableId=""}internalSddsPropChangeListener(s){if(this.tableId===s.detail.tableId){s.detail.changed.filter((s=>o.includes(s))).forEach((a=>{if(typeof this[a]==="undefined"){throw new Error(`Table prop is not supported: ${a}`)}this[a]=s.detail[a]}))}}connectedCallback(){this.tableEl=this.host.closest("sdds-table");this.tableId=this.tableEl.tableId}componentWillLoad(){o.forEach((s=>{this[s]=this.tableEl[s]}))}searchFunction(s){const a=s.currentTarget.value.toLowerCase();const t=s.currentTarget.parentElement;this.sddsFilter.emit([this.tableId,a]);if(a.length>0){t.classList.add("sdds-table__searchbar--active")}else{t.classList.remove("sdds-table__searchbar--active")}}render(){return t(e,{class:this.compactDesign?"sdds-table--compact":""},t("div",{class:"sdds-table__upper-bar-flex"},t("caption",{class:"sdds-table__title"},this.tableTitle),t("div",{class:"sdds-table__actionbar"},this.enableFiltering&&t("div",{class:"sdds-table__searchbar"},t("input",{class:"sdds-table__searchbar-input",type:"text",onKeyUp:s=>this.searchFunction(s)}),t("span",{class:"sdds-table__searchbar-icon"},t("svg",{fill:"none",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 32 32"},t("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M12.942 1.985c-6.051 0-10.957 4.905-10.957 10.957 0 6.051 4.906 10.957 10.957 10.957 2.666 0 5.109-.952 7.008-2.534l8.332 8.331a1 1 0 1 0 1.414-1.414l-8.331-8.331a10.912 10.912 0 0 0 2.534-7.01c0-6.05-4.905-10.956-10.957-10.956ZM3.985 12.942a8.957 8.957 0 1 1 17.914 0 8.957 8.957 0 0 1-17.914 0Z",fill:"currentColor"})))),t("slot",{name:"sdds-table__actionbar"}))))}get host(){return r(this)}};i.style=d;export{i as sdds_table_toolbar};
-//# sourceMappingURL=p-ccb82bc3.entry.js.map

package/dist/tegel/p-ccb82bc3.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["tableToolbarCss","relevantTableProps","TableToolbar","internalSddsPropChangeListener","event","this","tableId","detail","changed","filter","changedProp","includes","forEach","Error","connectedCallback","tableEl","host","closest","componentWillLoad","tablePropName","searchFunction","searchTerm","currentTarget","value","toLowerCase","sddsTableSearchBar","parentElement","sddsFilter","emit","length","classList","add","remove","render","h","Host","class","compactDesign","tableTitle","enableFiltering","type","onKeyUp","fill","xmlns","viewBox","d","name"],"sources":["./src/components/data-table/table-toolbar/table-toolbar.scss?tag=sdds-table-toolbar&encapsulation=shadow","./src/components/data-table/table-toolbar/table-toolbar.tsx"],"sourcesContent":["@import '../../../mixins/box-sizing';\n\n:host {\n  @include sdds-box-sizing;\n\n  display: table-caption;\n  position: relative;\n  background-color: var(--sdds-data-table-toolbar-background);\n  color: var(--sdds-data-table-color);\n  padding: 0 var(--sdds-spacing-element-16);\n  height: 64px;\n  border-top-left-radius: 4px;\n  border-top-right-radius: 4px;\n\n  .sdds-table__upper-bar-flex {\n    width: 100%;\n    height: 100%;\n    display: flex;\n    justify-content: space-between;\n  }\n\n  .sdds-table__title {\n    font: var(--sdds-headline-07);\n    letter-spacing: var(--sdds-headline-07-ls);\n    padding-top: var(--sdds-spacing-element-16);\n    text-align: left;\n  }\n\n  .sdds-table__actionbar {\n    display: flex;\n    align-self: center;\n    gap: 8px;\n  }\n\n  .sdds-table__searchbar {\n    display: flex;\n    align-self: center;\n    position: relative;\n    height: 40px;\n    width: 40px;\n    border-radius: 4px 4px 0 0;\n    transition: background-color 250ms ease, width 250ms ease;\n    overflow: hidden;\n    background-color: transparent;\n\n    &::after {\n      content: '';\n      width: 100%;\n      height: 2px;\n      position: absolute;\n      bottom: 0;\n      background-color: var(--sdds-blue-400);\n      transform: scaleX(0);\n      transition: transform 150ms ease;\n    }\n\n    &:focus-within {\n      &::after {\n        transform: scaleX(100%);\n      }\n    }\n\n    &:focus-within,\n    &.sdds-table__searchbar--active {\n      width: 208px;\n      background-color: var(--sdds-data-table-toolbar-searchbar-background);\n\n      &:hover {\n        background-color: var(--sdds-data-table-toolbar-searchbar-background);\n      }\n    }\n\n    .sdds-table__searchbar-input {\n      font: var(--sdds-detail-02);\n      letter-spacing: var(--sdds-detail-02-ls);\n      color: var(--sdds-data-table-color);\n      z-index: 1;\n      width: 100%;\n      height: 100%;\n      border: none;\n      padding: 0 36px 0 16px;\n      background-color: transparent;\n      outline: none;\n      cursor: pointer;\n\n      :focus {\n        background-color: var(--sdds-data-table-toolbar-searchbar-background);\n      }\n    }\n\n    &:hover {\n      background-color: var(--sdds-data-table-toolbar-searchbar-background-hover);\n    }\n\n    .sdds-table__searchbar-icon {\n      z-index: 0;\n      position: absolute;\n      right: 9px;\n      top: 9px;\n      width: 20px;\n      height: 20px;\n    }\n  }\n}\n\n:host(.sdds-table--compact) {\n  height: 56px;\n}\n","import {\n  Component,\n  h,\n  Host,\n  Prop,\n  Event,\n  EventEmitter,\n  Listen,\n  State,\n  Element,\n} from '@stencil/core';\nimport { InternalSddsTablePropChange } from '../table/table';\n\nconst relevantTableProps: InternalSddsTablePropChange['changed'] = [\n  'compactDesign',\n  'noMinWidth',\n  'verticalDividers',\n];\n\n@Component({\n  tag: 'sdds-table-toolbar',\n  styleUrl: 'table-toolbar.scss',\n  shadow: true,\n})\nexport class TableToolbar {\n  /** Adds title to the data-table */\n  @Prop({ reflect: true }) tableTitle: string = '';\n\n  /** Enables preview of searchbar */\n  @Prop({ reflect: true }) enableFiltering: boolean = false;\n\n  @State() verticalDividers: boolean = false;\n\n  @State() compactDesign: boolean = false;\n\n  @State() noMinWidth: boolean = false;\n\n  @State() whiteBackground: boolean = false;\n\n  @State() tableId: string = '';\n\n  @Element() host: HTMLElement;\n\n  tableEl: HTMLSddsTableElement;\n\n  /** Used for sending users input to main parent <sdds-table> component, can also be listened to in order to implement custom sorting logic. */\n  @Event({\n    eventName: 'sddsFilter',\n    composed: true,\n    cancelable: true,\n    bubbles: true,\n  })\n  sddsFilter: EventEmitter<any>;\n\n  @Listen('internalSddsTablePropChange', { target: 'body' })\n  internalSddsPropChangeListener(event: CustomEvent<InternalSddsTablePropChange>) {\n    if (this.tableId === event.detail.tableId) {\n      event.detail.changed\n        .filter((changedProp) => relevantTableProps.includes(changedProp))\n        .forEach((changedProp) => {\n          if (typeof this[changedProp] === 'undefined') {\n            throw new Error(`Table prop is not supported: ${changedProp}`);\n          }\n          this[changedProp] = event.detail[changedProp];\n        });\n    }\n  }\n\n  connectedCallback() {\n    this.tableEl = this.host.closest('sdds-table');\n    this.tableId = this.tableEl.tableId;\n  }\n\n  componentWillLoad() {\n    relevantTableProps.forEach((tablePropName) => {\n      this[tablePropName] = this.tableEl[tablePropName];\n    });\n  }\n\n  searchFunction(event) {\n    const searchTerm = event.currentTarget.value.toLowerCase();\n    const sddsTableSearchBar = event.currentTarget.parentElement;\n\n    this.sddsFilter.emit([this.tableId, searchTerm]);\n\n    if (searchTerm.length > 0) {\n      sddsTableSearchBar.classList.add('sdds-table__searchbar--active');\n    } else {\n      sddsTableSearchBar.classList.remove('sdds-table__searchbar--active');\n    }\n  }\n\n  render() {\n    return (\n      <Host class={this.compactDesign ? 'sdds-table--compact' : ''}>\n        <div class=\"sdds-table__upper-bar-flex\">\n          <caption class=\"sdds-table__title\">{this.tableTitle}</caption>\n          <div class=\"sdds-table__actionbar\">\n            {this.enableFiltering && (\n              <div class=\"sdds-table__searchbar\">\n                <input\n                  class=\"sdds-table__searchbar-input\"\n                  type=\"text\"\n                  onKeyUp={(event) => this.searchFunction(event)}\n                />\n                <span class=\"sdds-table__searchbar-icon\">\n                  <svg fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\">\n                    <path\n                      fill-rule=\"evenodd\"\n                      clip-rule=\"evenodd\"\n                      d=\"M12.942 1.985c-6.051 0-10.957 4.905-10.957 10.957 0 6.051 4.906 10.957 10.957 10.957 2.666 0 5.109-.952 7.008-2.534l8.332 8.331a1 1 0 1 0 1.414-1.414l-8.331-8.331a10.912 10.912 0 0 0 2.534-7.01c0-6.05-4.905-10.956-10.957-10.956ZM3.985 12.942a8.957 8.957 0 1 1 17.914 0 8.957 8.957 0 0 1-17.914 0Z\"\n                      fill=\"currentColor\"\n                    />\n                  </svg>\n                </span>\n              </div>\n            )}\n            <slot name=\"sdds-table__actionbar\" />\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"gEAAA,MAAMA,EAAkB,2nECaxB,MAAMC,EAA6D,CACjE,gBACA,aACA,oB,MAQWC,EAAY,M,gFAEuB,G,qBAGM,M,sBAEf,M,mBAEH,M,gBAEH,M,qBAEK,M,aAET,E,CAgB3BC,+BAA+BC,GAC7B,GAAIC,KAAKC,UAAYF,EAAMG,OAAOD,QAAS,CACzCF,EAAMG,OAAOC,QACVC,QAAQC,GAAgBT,EAAmBU,SAASD,KACpDE,SAASF,IACR,UAAWL,KAAKK,KAAiB,YAAa,CAC5C,MAAM,IAAIG,MAAM,gCAAgCH,I,CAElDL,KAAKK,GAAeN,EAAMG,OAAOG,EAAY,G,EAKrDI,oBACET,KAAKU,QAAUV,KAAKW,KAAKC,QAAQ,cACjCZ,KAAKC,QAAUD,KAAKU,QAAQT,O,CAG9BY,oBACEjB,EAAmBW,SAASO,IAC1Bd,KAAKc,GAAiBd,KAAKU,QAAQI,EAAc,G,CAIrDC,eAAehB,GACb,MAAMiB,EAAajB,EAAMkB,cAAcC,MAAMC,cAC7C,MAAMC,EAAqBrB,EAAMkB,cAAcI,cAE/CrB,KAAKsB,WAAWC,KAAK,CAACvB,KAAKC,QAASe,IAEpC,GAAIA,EAAWQ,OAAS,EAAG,CACzBJ,EAAmBK,UAAUC,IAAI,gC,KAC5B,CACLN,EAAmBK,UAAUE,OAAO,gC,EAIxCC,SACE,OACEC,EAACC,EAAI,CAACC,MAAO/B,KAAKgC,cAAgB,sBAAwB,IACxDH,EAAA,OAAKE,MAAM,8BACTF,EAAA,WAASE,MAAM,qBAAqB/B,KAAKiC,YACzCJ,EAAA,OAAKE,MAAM,yBACR/B,KAAKkC,iBACJL,EAAA,OAAKE,MAAM,yBACTF,EAAA,SACEE,MAAM,8BACNI,KAAK,OACLC,QAAUrC,GAAUC,KAAKe,eAAehB,KAE1C8B,EAAA,QAAME,MAAM,8BACVF,EAAA,OAAKQ,KAAK,OAAOC,MAAM,6BAA6BC,QAAQ,aAC1DV,EAAA,oBACY,UAAS,YACT,UACVW,EAAE,2SACFH,KAAK,oBAMfR,EAAA,QAAMY,KAAK,4B"}

package/dist/tegel/p-ce84159b.entry.js

@@ -1,2 +0,0 @@
-import{r as o,h as t,H as e}from"./p-387e1798.js";const s=':host{box-sizing:border-box;display:block;position:relative;z-index:200}:host *{box-sizing:border-box}:host button{min-width:142px;height:100%;font:var(--sdds-headline-07);letter-spacing:var(--sdds-headline-07-ls);cursor:pointer;color:var(--sdds-folder-tab-color);padding:16px;white-space:nowrap;text-decoration:none;text-align:left;outline:none;border:none;border-top:2px solid var(--sdds-folder-tab-background);background-color:var(--sdds-folder-tab-background);border-right:none}:host button .label{opacity:var(--sdds-folder-tab-color-opacity)}:host button.selected{background-color:var(--sdds-folder-tab-background-selected);border-top:2px solid var(--sdds-folder-tab-border-selected)}:host button.selected::before{content:" ";background-color:var(--sdds-folder-tab-background);width:1px;top:0;bottom:0;left:-1px;display:block;position:absolute}:host button.selected .label{opacity:var(--sdds-folder-tab-color-opacity-selected)}:host button:not(.selected){border-right-width:1px;border-right-style:solid;border-right-color:var(--sdds-folder-tab-divider-color)}:host button:not(.selected):hover{border-top-color:var(--sdds-folder-tab-background-hover);background-color:var(--sdds-folder-tab-background-hover)}:host button:not(.selected):hover .label{opacity:var(--sdds-folder-tab-color-opacity-hover)}:host button.disabled{pointer-events:none}:host button.disabled .label{opacity:var(--sdds-folder-tab-color-opacity-disabled)}:host button.disabled:focus-visible{outline:none}:host button.disabled:focus-visible .label{opacity:var(--sdds-folder-tab-color-opacity-disabled)}:host button:focus-visible{outline:2px solid var(--sdds-blue-400);outline-offset:-2px;opacity:var(--sdds-folder-tab-color-opacity-focus)}:host(.last) button:not(.selected){border-right-color:transparent}';const d=class{constructor(t){o(this,t);this.disabled=false;this.selected=false;this.tabWidth=undefined}async setTabWidth(o){this.tabWidth=o}render(){return t(e,{role:"listitem"},t("button",{style:{width:`${this.tabWidth}px`},class:`${this.selected?"selected":""}\n          ${this.disabled?"disabled":""}`,disabled:this.disabled},t("div",{class:"label"},t("slot",{name:"label"}))))}};d.style=s;export{d as sdds_folder_tabs_button};
-//# sourceMappingURL=p-ce84159b.entry.js.map

package/dist/tegel/p-ce84159b.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["sddsFolderTabsButtonCss","SddsFolderTabsButton","async","width","this","tabWidth","render","h","Host","role","style","class","selected","disabled","name"],"sources":["./src/components/tabs/folder-tabs/folder-tabs-button/sdds-folder-tabs-button.scss?tag=sdds-folder-tabs-button&encapsulation=shadow","./src/components/tabs/folder-tabs/folder-tabs-button/sdds-folder-tabs-button.tsx"],"sourcesContent":["@import '../../../../mixins/focus-state';\n@import '../../../../mixins/z-index';\n@import '../../../../mixins/box-sizing';\n\n:host {\n  @include sdds-box-sizing;\n\n  display: block;\n  position: relative;\n  z-index: z(tab);\n\n  button {\n    min-width: 142px;\n    height: 100%;\n    font: var(--sdds-headline-07);\n    letter-spacing: var(--sdds-headline-07-ls);\n    cursor: pointer;\n    color: var(--sdds-folder-tab-color);\n    padding: 16px;\n    white-space: nowrap;\n    text-decoration: none;\n    text-align: left;\n    outline: none;\n    border: none;\n    border-top: 2px solid var(--sdds-folder-tab-background);\n    background-color: var(--sdds-folder-tab-background);\n    border-right: none;\n\n    .label {\n      opacity: var(--sdds-folder-tab-color-opacity);\n    }\n\n    &.selected {\n      background-color: var(--sdds-folder-tab-background-selected);\n      border-top: 2px solid var(--sdds-folder-tab-border-selected);\n\n      &::before {\n        // This ::before element hides the border-right of the tab to the left of the selected tab\n        content: ' ';\n        background-color: var(--sdds-folder-tab-background);\n        width: 1px;\n        top: 0;\n        bottom: 0;\n        left: -1px;\n        display: block;\n        position: absolute;\n      }\n\n      .label {\n        opacity: var(--sdds-folder-tab-color-opacity-selected);\n      }\n    }\n\n    &:not(.selected) {\n      border-right-width: 1px;\n      border-right-style: solid;\n      border-right-color: var(--sdds-folder-tab-divider-color);\n\n      &:hover {\n        border-top-color: var(--sdds-folder-tab-background-hover);\n        background-color: var(--sdds-folder-tab-background-hover);\n\n        .label {\n          opacity: var(--sdds-folder-tab-color-opacity-hover);\n        }\n      }\n    }\n\n    &.disabled {\n      pointer-events: none;\n\n      .label {\n        opacity: var(--sdds-folder-tab-color-opacity-disabled);\n      }\n\n      &:focus-visible {\n        .label {\n          opacity: var(--sdds-folder-tab-color-opacity-disabled);\n        }\n\n        outline: none;\n      }\n    }\n\n    &:focus-visible {\n      @include sdds-focus-state;\n\n      opacity: var(--sdds-folder-tab-color-opacity-focus);\n    }\n  }\n}\n\n:host(.last) {\n  button:not(.selected) {\n    border-right-color: transparent;\n  }\n}\n","import { Component, Host, h, Prop, State, Method } from '@stencil/core';\n\n@Component({\n  tag: 'sdds-folder-tabs-button',\n  styleUrl: 'sdds-folder-tabs-button.scss',\n  shadow: true,\n})\nexport class SddsFolderTabsButton {\n  /** Disables the tab. */\n  @Prop() disabled: boolean = false;\n\n  /** Marks the tab as the selected one. */\n  @Prop() selected: boolean = false;\n\n  @State() tabWidth: number;\n\n  /** @internal Method to set the width of the tab. Used by the <sdds-folder-tabs> */\n  @Method()\n  async setTabWidth(width: number) {\n    this.tabWidth = width;\n  }\n\n  render() {\n    return (\n      <Host role=\"listitem\">\n        <button\n          style={{ width: `${this.tabWidth}px` }}\n          class={`${this.selected ? 'selected' : ''}\n          ${this.disabled ? 'disabled' : ''}`}\n          disabled={this.disabled}\n        >\n          <div class=\"label\">\n            <slot name=\"label\"></slot>\n          </div>\n        </button>\n      </Host>\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAA0B,qvD,MCOnBC,EAAoB,M,uCAEH,M,cAGA,M,wBAM5BC,kBAAkBC,GAChBC,KAAKC,SAAWF,C,CAGlBG,SACE,OACEC,EAACC,EAAI,CAACC,KAAK,YACTF,EAAA,UACEG,MAAO,CAAEP,MAAO,GAAGC,KAAKC,cACxBM,MAAO,GAAGP,KAAKQ,SAAW,WAAa,iBACrCR,KAAKS,SAAW,WAAa,KAC/BA,SAAUT,KAAKS,UAEfN,EAAA,OAAKI,MAAM,SACTJ,EAAA,QAAMO,KAAK,Y"}

package/dist/tegel/p-d517eaef.entry.js

@@ -1,2 +0,0 @@
-import{r as d,c as s,h as o,H as a,g as l}from"./p-387e1798.js";const i=":root,.sdds-mode-light{--sdds-modal-backdrop:rgba(0 0 0 / 40%);--sdds-modal-background:var(--sdds-white);--sdds-modal-text:var(--sdds-grey-958);--sdds-modal-icon:var(--sdds-black);--sdds-modal-icon-native:url(\"data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3.40338 2.34308C3.11048 2.05019 2.63561 2.05019 2.34272 2.34308C2.04982 2.63598 2.04982 3.11085 2.34272 3.40374L6.93897 8L2.34283 12.5961C2.04994 12.889 2.04994 13.3639 2.34283 13.6568C2.63572 13.9497 3.1106 13.9497 3.40349 13.6568L7.99963 9.06066L12.5958 13.6568C12.8887 13.9497 13.3635 13.9497 13.6564 13.6568C13.9493 13.3639 13.9493 12.889 13.6564 12.5961L9.06029 8L13.6565 3.40376C13.9494 3.11086 13.9494 2.63599 13.6565 2.3431C13.3636 2.0502 12.8888 2.0502 12.5959 2.3431L7.99963 6.93934L3.40338 2.34308Z' fill='black'/%3E%3C/svg%3E%0A\");--sdds-modal-scrollbar:var(--sdds-grey-300);--sdds-modal-scrollbar-track:var(--sdds-grey-300);--sdds-modal-scrollbar-thumb:var(--sdds-grey-500)}.sdds-mode-dark{--sdds-modal-backdrop:rgba(0 0 0 / 40%);--sdds-modal-background:var(--sdds-grey-900);--sdds-modal-text:var(--sdds-grey-50);--sdds-modal-icon:var(--sdds-white);--sdds-modal-icon-native:url(\"data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3.40338 2.34308C3.11048 2.05019 2.63561 2.05019 2.34272 2.34308C2.04982 2.63598 2.04982 3.11085 2.34272 3.40374L6.93897 8L2.34283 12.5961C2.04994 12.889 2.04994 13.3639 2.34283 13.6568C2.63572 13.9497 3.1106 13.9497 3.40349 13.6568L7.99963 9.06066L12.5958 13.6568C12.8887 13.9497 13.3635 13.9497 13.6564 13.6568C13.9493 13.3639 13.9493 12.889 13.6564 12.5961L9.06029 8L13.6565 3.40376C13.9494 3.11086 13.9494 2.63599 13.6565 2.3431C13.3636 2.0502 12.8888 2.0502 12.5959 2.3431L7.99963 6.93934L3.40338 2.34308Z' fill='white'/%3E%3C/svg%3E%0A\");--sdds-modal-scrollbar:var(--sdds-grey-300);--sdds-modal-scrollbar-track:var(--sdds-grey-300);--sdds-modal-scrollbar-thumb:var(--sdds-grey-500)}.sdds-modal{box-sizing:border-box;background-color:var(--sdds-modal-background);margin:auto;position:relative;border-radius:4px;padding:16px;max-height:85vh;overflow-y:auto;}.sdds-modal *{box-sizing:border-box}.sdds-modal::-webkit-scrollbar{width:5px;background-color:var(--sdds-grey-300);border-radius:0 1em 1em 0}.sdds-modal::-webkit-scrollbar-track{background-color:var(--sdds-grey-300);border-radius:0 1em 1em 0}.sdds-modal::-webkit-scrollbar-thumb{background-color:var(--sdds-grey-500);border-radius:0 1em 1em 0}.sdds-modal__actions-sticky{overflow:hidden}.sdds-modal__actions-sticky .sdds-modal-body{font:var(--sdds-body-01);letter-spacing:var(--sdds-body-01-ls);padding-bottom:96px;margin:0 -16px 0 0;max-height:calc(85vh - 36px);overflow-y:auto}.sdds-modal__actions-sticky .sdds-modal-actions{position:absolute;bottom:-1px;left:0;right:0;background-color:var(--sdds-modal-background);padding:var(--sdds-spacing-element-16);display:flex;gap:16px}.sdds-modal__actions-static .sdds-modal-actions{background-color:var(--sdds-modal-background);display:flex;gap:16px}@media (min-width: 320px){.sdds-modal-xs{width:100%}.sdds-modal-sm{width:100%}.sdds-modal-md{width:100%}.sdds-modal-lg{width:100%}}@media (min-width: 672px){.sdds-modal-xs{width:75%}.sdds-modal-sm{width:62.5%}.sdds-modal-md{width:75%}.sdds-modal-lg{width:100%}}@media (min-width: 1056px){.sdds-modal-xs{width:31.25%}.sdds-modal-sm{width:43.75%}.sdds-modal-md{width:62.5%}.sdds-modal-lg{width:75%}}@media (min-width: 1312px){.sdds-modal-xs{width:31.25%}.sdds-modal-sm{width:37.5%}.sdds-modal-md{width:62.5%}.sdds-modal-lg{width:75%}}@media (min-width: 1584px){.sdds-modal-xs{width:25%}.sdds-modal-sm{width:37.5%}.sdds-modal-md{width:50%}.sdds-modal-lg{width:75%}}@media (max-width: 320px){.sdds-modal-md,.sdds-modal-lg,.sdds-modal-sm{height:100%}.sdds-modal-md slot[name=sdds-modal-actions]::slotted(*),.sdds-modal-lg slot[name=sdds-modal-actions]::slotted(*),.sdds-modal-sm slot[name=sdds-modal-actions]::slotted(*){display:flex}}.sdds-modal-header{display:flex;padding-bottom:var(--sdds-spacing-element-8);position:sticky;top:0;background-color:var(--sdds-modal-background);z-index:1}.sdds-modal-header::before{content:\" \";position:absolute;height:16px;top:-16px;width:100%;background-color:var(--sdds-modal-background)}.sdds-modal-headline{color:var(--sdds-modal-text);font:var(--sdds-headline-05);letter-spacing:var(--sdds-headline-05-ls);margin:0;flex:1;color:var(--sdds-modal-text)}.sdds-modal-body{color:var(--sdds-modal-text);font:var(--sdds-body-01);letter-spacing:var(--sdds-body-01-ls);padding-bottom:40px;overflow-y:visible;padding-right:16px;}.sdds-modal-body::-webkit-scrollbar{width:5px;background-color:var(--sdds-grey-300)}.sdds-modal-body::-webkit-scrollbar-track{background-color:var(--sdds-grey-300)}.sdds-modal-body::-webkit-scrollbar-thumb{background-color:var(--sdds-grey-500)}@media (min-width: 1056px){.sdds-modal-body{padding-right:64px}}.sdds-modal-backdrop{box-sizing:border-box;left:0;top:0;position:fixed;height:100%;width:100%;z-index:600;background-color:var(--sdds-modal-backdrop);padding:0 16px}.sdds-modal-backdrop *{box-sizing:border-box}@media (max-width: 320px){.sdds-modal-backdrop{padding:0}}.sdds-modal-backdrop.show{display:flex}.sdds-modal-backdrop.hide{display:none}button.sdds-modal-close{background-color:transparent;border:0;padding:0;appearance:unset}.sdds-modal-close{display:inline-block;height:auto;color:var(--sdds-modal-icon);cursor:pointer}.sdds-modal-close:focus{outline:2px solid var(--sdds-blue-400);outline-offset:-2px}@media (min-width: 320px){.sdds-modal-close{margin-left:var(--sdds-spacing-element-16)}}@media (min-width: 1056px){.sdds-modal-close{margin-left:var(--sdds-spacing-element-48)}}.sdds-modal-close-btn{display:inline-block;height:auto;background-repeat:no-repeat;cursor:pointer}@media (min-width: 320px){.sdds-modal-close-btn{margin-left:var(--sdds-spacing-element-16)}}@media (min-width: 1056px){.sdds-modal-close-btn{margin-left:var(--sdds-spacing-element-48)}}.sdds-modal-close-btn svg{fill:var(--sdds-modal-icon)}.sdds-modal-overflow{overflow:hidden}:host{left:0;top:0;position:fixed;height:100%;width:100%;z-index:600;background-color:var(--sdds-modal-backdrop);padding:0 16px}@media (max-width: 320px){:host{padding:0}}:host.show{display:flex}:host.hide{display:none}:host .sdds-modal-close{border:none;background-color:transparent}:host .sdds-modal-close-btn{border:none;background-color:transparent}:host(.show){display:flex}:host(.hide){display:none}";const t=class{constructor(o){d(this,o);this.sddsClose=s(this,"sddsClose",7);this.handleClose=d=>{const s=this.sddsClose.emit(d);if(!s.defaultPrevented){this.isShown=false}};this.handleShow=()=>{this.isShown=true};this.initializeReferenceElement=d=>{if(d){d.addEventListener("click",(d=>{d.stopPropagation();if(this.isShown){this.handleClose(d)}else{this.handleShow()}}))}};this.setShowButton=()=>{var d;if(this.selector||this.referenceEl){const s=(d=this.referenceEl)!==null&&d!==void 0?d:document.querySelector(this.selector);if(s){this.initializeReferenceElement(s)}}};this.prevent=false;this.size="md";this.actions="static";this.selector=undefined;this.referenceEl=undefined;this.show=undefined;this.isShown=false}async showModal(){this.handleShow()}async closeModal(){this.handleClose()}connectedCallback(){if(this.show!==null){this.isShown=this.show}this.setDissmissButtons();this.setShowButton()}handleOverlayClick(d){const s=d.composedPath();const o=s[0];if(o.classList[0]==="sdds-modal-close"||o.classList[0]==="sdds-modal-backdrop"&&this.prevent===false){this.handleClose(d)}}setDissmissButtons(){this.host.querySelectorAll("[data-dismiss-modal]").forEach((d=>{d.addEventListener("click",(d=>{this.handleClose(d)}))}))}render(){return o(a,{onClick:d=>{this.handleOverlayClick(d)},class:`sdds-modal-backdrop ${this.isShown?"show":"hide"}`},o("div",{class:`sdds-modal ${this.actions?`sdds-modal__actions-${this.actions}`:""} ${this.size?`sdds-modal-${this.size}`:""} `},o("div",{class:"sdds-modal-header"},o("slot",{name:"sdds-modal-headline"}),o("button",{class:"sdds-modal-close","aria-label":"close",onClick:()=>this.handleClose()},o("sdds-icon",{name:"cross",size:"20px"}))),o("div",{class:"sdds-modal-body"},o("slot",{name:"sdds-modal-body"})),o("div",{class:"sdds-modal-actions"},o("slot",{name:"sdds-modal-actions"}))))}get host(){return l(this)}};t.style=i;export{t as sdds_modal};
-//# sourceMappingURL=p-d517eaef.entry.js.map

package/dist/tegel/p-d517eaef.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["modalCss","Modal","this","handleClose","event","closeEvent","sddsClose","emit","defaultPrevented","isShown","handleShow","initializeReferenceElement","referenceEl","addEventListener","stopPropagation","setShowButton","selector","_a","document","querySelector","async","connectedCallback","show","setDissmissButtons","handleOverlayClick","targetList","composedPath","target","classList","prevent","host","querySelectorAll","forEach","dismissButton","render","h","Host","onClick","class","actions","size","name"],"sources":["./src/components/modal/modal.scss?tag=sdds-modal&encapsulation=shadow","./src/components/modal/modal.tsx"],"sourcesContent":["@import '../../mixins/z-index';\n@import 'modal-vars';\n@import '../../mixins/box-sizing';\n@import '../../mixins/focus-state';\n\n//TODO: Find a way to create a mixin in spacings that can be used for screen size in rem\n//Media rules doesn't calculate correct with using rem\n// Screen breakpoints\n$screen-s: 320px; //320px\n$screen-md: 672px; // 672px\n$screen-l: 1056px; //1056px\n$screen-xl: 1312px; //1312px\n$screen-xxl: 1584px; //1584px\n\n$modals: (\n  $screen-s: (\n    xs: 100%,\n    sm: 100%,\n    md: 100%,\n    lg: 100%,\n  ),\n  $screen-md: (\n    xs: 75%,\n    sm: 62.5%,\n    md: 75%,\n    lg: 100%,\n  ),\n  $screen-l: (\n    xs: 31.25%,\n    sm: 43.75%,\n    md: 62.5%,\n    lg: 75%,\n  ),\n  $screen-xl: (\n    xs: 31.25%,\n    sm: 37.5%,\n    md: 62.5%,\n    lg: 75%,\n  ),\n  $screen-xxl: (\n    xs: 25%,\n    sm: 37.5%,\n    md: 50%,\n    lg: 75%,\n  ),\n);\n\n/* MIXINS */\n\n@mixin modal-scroll-inner {\n  /* SCROLL STUFF */\n\n  /* width */\n  &::-webkit-scrollbar {\n    width: 5px;\n    background-color: var(--sdds-grey-300);\n  }\n\n  /* Track */\n  &::-webkit-scrollbar-track {\n    background-color: var(--sdds-grey-300);\n  }\n\n  /* Handle */\n  &::-webkit-scrollbar-thumb {\n    background-color: var(--sdds-grey-500);\n  }\n}\n\n@mixin modal-scroll-outer {\n  /* SCROLL STUFF */\n\n  /* width */\n  &::-webkit-scrollbar {\n    width: 5px;\n    background-color: var(--sdds-grey-300);\n    border-radius: 0 1em 1em 0;\n  }\n\n  /* Track */\n  &::-webkit-scrollbar-track {\n    background-color: var(--sdds-grey-300);\n    border-radius: 0 1em 1em 0;\n  }\n\n  /* Handle */\n  &::-webkit-scrollbar-thumb {\n    background-color: var(--sdds-grey-500);\n    border-radius: 0 1em 1em 0;\n  }\n}\n\n@mixin modal-host {\n  left: 0;\n  top: 0;\n  position: fixed;\n  height: 100%;\n  width: 100%;\n  z-index: z(modal);\n  background-color: var(--sdds-modal-backdrop);\n  padding: 0 16px;\n\n  @media (max-width: $screen-s) {\n    padding: 0;\n  }\n\n  &.show {\n    display: flex;\n  }\n\n  &.hide {\n    display: none;\n  }\n}\n\n@mixin modal-header {\n  display: flex;\n  padding-bottom: var(--sdds-spacing-element-8);\n  position: sticky;\n  top: 0;\n  background-color: var(--sdds-modal-background);\n  z-index: 1;\n\n  &::before {\n    content: ' ';\n    position: absolute;\n    height: 16px;\n    top: -16px;\n    width: 100%;\n    background-color: var(--sdds-modal-background);\n  }\n}\n\n@mixin modal-headline {\n  color: var(--sdds-modal-text);\n  font: var(--sdds-headline-05);\n  letter-spacing: var(--sdds-headline-05-ls);\n  margin: 0;\n  flex: 1;\n}\n\n@mixin modal-body {\n  color: var(--sdds-modal-text);\n  font: var(--sdds-body-01);\n  letter-spacing: var(--sdds-body-01-ls);\n  padding-bottom: 40px;\n  overflow-y: visible;\n  padding-right: 16px;\n  @include modal-scroll-inner;\n\n  @media (min-width: $screen-l) {\n    padding-right: 64px;\n  }\n}\n\n/* MODAL STYLING */\n\n.sdds-modal {\n  @include sdds-box-sizing;\n\n  background-color: var(--sdds-modal-background);\n  margin: auto;\n  position: relative;\n  border-radius: 4px;\n  padding: 16px;\n  max-height: 85vh;\n  overflow-y: auto;\n\n  @include modal-scroll-outer;\n\n  &__actions-sticky {\n    overflow: hidden;\n\n    .sdds-modal-body {\n      font: var(--sdds-body-01);\n      letter-spacing: var(--sdds-body-01-ls);\n      padding-bottom: 96px;\n      margin: 0 -16px 0 0;\n      max-height: calc(85vh - 36px);\n      overflow-y: auto;\n    }\n\n    .sdds-modal-actions {\n      position: absolute;\n      bottom: -1px;\n      left: 0;\n      right: 0;\n      background-color: var(--sdds-modal-background);\n      padding: var(--sdds-spacing-element-16);\n      display: flex;\n      gap: 16px;\n    }\n  }\n\n  &__actions-static {\n    .sdds-modal-actions {\n      background-color: var(--sdds-modal-background);\n      display: flex;\n      gap: 16px;\n    }\n  }\n}\n\n//Width of modals in different breakpoints\n@each $screen, $modals in $modals {\n  @media (min-width: $screen) {\n    @each $modal, $value in $modals {\n      .sdds-modal-#{$modal} {\n        width: $value;\n      }\n    }\n  }\n}\n\n@media (max-width: $screen-s) {\n  .sdds-modal-md,\n  .sdds-modal-lg,\n  .sdds-modal-sm {\n    height: 100%;\n\n    slot[name='sdds-modal-actions']::slotted(*) {\n      display: flex;\n    }\n  }\n}\n\n/* MODAL SUBELEMENTS */\n\n.sdds-modal-header {\n  @include modal-header;\n}\n\n.sdds-modal-headline {\n  @include modal-headline;\n\n  color: var(--sdds-modal-text);\n}\n\n.sdds-modal-body {\n  @include modal-body;\n}\n\n.sdds-modal-backdrop {\n  @include sdds-box-sizing;\n  @include modal-host;\n}\n\nbutton.sdds-modal-close {\n  background-color: transparent;\n  border: 0;\n  padding: 0;\n  appearance: unset;\n}\n\n.sdds-modal-close {\n  display: inline-block;\n  height: auto;\n  color: var(--sdds-modal-icon);\n  cursor: pointer;\n\n  &:focus {\n    @include sdds-focus-state;\n  }\n\n  @media (min-width: $screen-s) {\n    margin-left: var(--sdds-spacing-element-16);\n  }\n\n  @media (min-width: $screen-l) {\n    margin-left: var(--sdds-spacing-element-48);\n  }\n}\n\n//web component with nested svg\n.sdds-modal-close-btn {\n  display: inline-block;\n  height: auto;\n  background-repeat: no-repeat;\n  cursor: pointer;\n\n  @media (min-width: $screen-s) {\n    margin-left: var(--sdds-spacing-element-16);\n  }\n\n  @media (min-width: $screen-l) {\n    margin-left: var(--sdds-spacing-element-48);\n  }\n\n  svg {\n    fill: var(--sdds-modal-icon);\n  }\n}\n\n.sdds-modal-overflow {\n  overflow: hidden;\n}\n\n/* WEB COMPONENT STUFF */\n\n:host {\n  @include modal-host;\n\n  .sdds-modal-close {\n    border: none;\n    background-color: transparent;\n  }\n\n  .sdds-modal-close-btn {\n    border: none;\n    background-color: transparent;\n  }\n}\n\n:host(.show) {\n  display: flex;\n}\n\n:host(.hide) {\n  display: none;\n}\n","import {\n  Component,\n  h,\n  Host,\n  Prop,\n  Element,\n  Method,\n  State,\n  Event,\n  EventEmitter,\n} from '@stencil/core';\n\n@Component({\n  tag: 'sdds-modal',\n  styleUrl: 'modal.scss',\n  shadow: true,\n})\nexport class Modal {\n  @Element() host: HTMLElement;\n\n  /** Disables closing modal on clicking on overlay area. */\n  @Prop() prevent: boolean = false;\n\n  /** Size of modal  */\n  @Prop() size: 'xs' | 'sm' | 'md' | 'lg' = 'md';\n\n  /** Sticky or Static Actions  */\n  @Prop() actions: 'sticky' | 'static' = 'static';\n\n  /** CSS selector for the element that will show the modal. */\n  @Prop() selector: string;\n\n  /** Element that will show the modal (takes priority over selector) */\n  @Prop() referenceEl: HTMLElement;\n\n  /** Controls whether the modal is shown or not. If this is set hiding and showing\n   * will be decided by this prop and will need to be controlled from the outside. */\n  @Prop() show: boolean;\n\n  // State that keeps track of show/closed state for the modal.\n  @State() isShown: boolean = false;\n\n  /** Shows the modal.  */\n  @Method()\n  async showModal() {\n    this.handleShow();\n  }\n\n  /** Closes the modal. */\n  @Method()\n  async closeModal() {\n    this.handleClose();\n  }\n\n  /** Emitts when the modal is closed. */\n  @Event({\n    eventName: 'sddsClose',\n    composed: true,\n    cancelable: true,\n    bubbles: true,\n  })\n  sddsClose: EventEmitter<any>;\n\n  connectedCallback() {\n    if (this.show !== null) {\n      this.isShown = this.show;\n    }\n    this.setDissmissButtons();\n    this.setShowButton();\n  }\n\n  /** Emits a close event and then close the modal if it is not prevented. */\n  handleClose = (event?) => {\n    const closeEvent = this.sddsClose.emit(event);\n    if (!closeEvent.defaultPrevented) {\n      this.isShown = false;\n    }\n  };\n\n  handleShow = () => {\n    this.isShown = true;\n  };\n\n  /** Checks if click on modal is on overlay, if so it closes the modal if prevent is not true. */\n  handleOverlayClick(event) {\n    const targetList = event.composedPath();\n    const target = targetList[0];\n    if (\n      target.classList[0] === 'sdds-modal-close' ||\n      (target.classList[0] === 'sdds-modal-backdrop' && this.prevent === false)\n    ) {\n      this.handleClose(event);\n    }\n  }\n\n  /** Adds an event listener to the reference element that shows/closes the modal. */\n  initializeReferenceElement = (referenceEl) => {\n    if (referenceEl) {\n      referenceEl.addEventListener('click', (event) => {\n        event.stopPropagation();\n        if (this.isShown) {\n          this.handleClose(event);\n        } else {\n          this.handleShow();\n        }\n      });\n    }\n  };\n\n  /** Check if there is a referenceElement or selector and adds event listener to them if so. */\n  setShowButton = () => {\n    if (this.selector || this.referenceEl) {\n      const referenceEl = this.referenceEl ?? document.querySelector(this.selector);\n      if (referenceEl) {\n        this.initializeReferenceElement(referenceEl);\n      }\n    }\n  };\n\n  /** Adds an event listener to the dismiss buttons that closes the modal. */\n  setDissmissButtons() {\n    this.host.querySelectorAll('[data-dismiss-modal]').forEach((dismissButton) => {\n      dismissButton.addEventListener('click', (event) => {\n        this.handleClose(event);\n      });\n    });\n  }\n\n  render() {\n    return (\n      <Host\n        onClick={(event) => {\n          this.handleOverlayClick(event);\n        }}\n        class={`sdds-modal-backdrop ${this.isShown ? 'show' : 'hide'}`}\n      >\n        <div\n          class={`sdds-modal ${this.actions ? `sdds-modal__actions-${this.actions}` : ''} ${\n            this.size ? `sdds-modal-${this.size}` : ''\n          } `}\n        >\n          <div class=\"sdds-modal-header\">\n            <slot name=\"sdds-modal-headline\"></slot>\n            <button class=\"sdds-modal-close\" aria-label=\"close\" onClick={() => this.handleClose()}>\n              <sdds-icon name=\"cross\" size=\"20px\"></sdds-icon>\n            </button>\n          </div>\n\n          <div class=\"sdds-modal-body\">\n            <slot name=\"sdds-modal-body\"></slot>\n          </div>\n\n          <div class=\"sdds-modal-actions\">\n            <slot name=\"sdds-modal-actions\"></slot>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"gEAAA,MAAMA,EAAW,++M,MCiBJC,EAAK,M,8DAuDhBC,KAAAC,YAAeC,IACb,MAAMC,EAAaH,KAAKI,UAAUC,KAAKH,GACvC,IAAKC,EAAWG,iBAAkB,CAChCN,KAAKO,QAAU,K,GAInBP,KAAAQ,WAAa,KACXR,KAAKO,QAAU,IAAI,EAgBrBP,KAAAS,2BAA8BC,IAC5B,GAAIA,EAAa,CACfA,EAAYC,iBAAiB,SAAUT,IACrCA,EAAMU,kBACN,GAAIZ,KAAKO,QAAS,CAChBP,KAAKC,YAAYC,E,KACZ,CACLF,KAAKQ,Y,OAObR,KAAAa,cAAgB,K,MACd,GAAIb,KAAKc,UAAYd,KAAKU,YAAa,CACrC,MAAMA,GAAcK,EAAAf,KAAKU,eAAW,MAAAK,SAAA,EAAAA,EAAIC,SAASC,cAAcjB,KAAKc,UACpE,GAAIJ,EAAa,CACfV,KAAKS,2BAA2BC,E,iBA7FX,M,UAGe,K,aAGH,S,oFAaX,K,CAI5BQ,kBACElB,KAAKQ,Y,CAKPU,mBACElB,KAAKC,a,CAYPkB,oBACE,GAAInB,KAAKoB,OAAS,KAAM,CACtBpB,KAAKO,QAAUP,KAAKoB,I,CAEtBpB,KAAKqB,qBACLrB,KAAKa,e,CAgBPS,mBAAmBpB,GACjB,MAAMqB,EAAarB,EAAMsB,eACzB,MAAMC,EAASF,EAAW,GAC1B,GACEE,EAAOC,UAAU,KAAO,oBACvBD,EAAOC,UAAU,KAAO,uBAAyB1B,KAAK2B,UAAY,MACnE,CACA3B,KAAKC,YAAYC,E,EA6BrBmB,qBACErB,KAAK4B,KAAKC,iBAAiB,wBAAwBC,SAASC,IAC1DA,EAAcpB,iBAAiB,SAAUT,IACvCF,KAAKC,YAAYC,EAAM,GACvB,G,CAIN8B,SACE,OACEC,EAACC,EAAI,CACHC,QAAUjC,IACRF,KAAKsB,mBAAmBpB,EAAM,EAEhCkC,MAAO,uBAAuBpC,KAAKO,QAAU,OAAS,UAEtD0B,EAAA,OACEG,MAAO,cAAcpC,KAAKqC,QAAU,uBAAuBrC,KAAKqC,UAAY,MAC1ErC,KAAKsC,KAAO,cAActC,KAAKsC,OAAS,OAG1CL,EAAA,OAAKG,MAAM,qBACTH,EAAA,QAAMM,KAAK,wBACXN,EAAA,UAAQG,MAAM,mBAAkB,aAAY,QAAQD,QAAS,IAAMnC,KAAKC,eACtEgC,EAAA,aAAWM,KAAK,QAAQD,KAAK,WAIjCL,EAAA,OAAKG,MAAM,mBACTH,EAAA,QAAMM,KAAK,qBAGbN,EAAA,OAAKG,MAAM,sBACTH,EAAA,QAAMM,KAAK,yB"}

package/dist/tegel/p-ec26fc38.js

@@ -1,2 +0,0 @@
-var r="top";var t="bottom";var n="right";var e="left";var a="auto";var i=[r,t,n,e];var o="start";var v="end";var f="clippingParents";var u="viewport";var c="popper";var s="reference";var l=i.reduce((function(r,t){return r.concat([t+"-"+o,t+"-"+v])}),[]);var d=[].concat(i,[a]).reduce((function(r,t){return r.concat([t,t+"-"+o,t+"-"+v])}),[]);var p="beforeRead";var b="read";var h="afterRead";var y="beforeMain";var m="main";var x="afterMain";var w="beforeWrite";var O="write";var g="afterWrite";var j=[p,b,h,y,m,x,w,O,g];function M(r){return r?(r.nodeName||"").toLowerCase():null}function k(r){if(r==null){return window}if(r.toString()!=="[object Window]"){var t=r.ownerDocument;return t?t.defaultView||window:window}return r}function E(r){var t=k(r).Element;return r instanceof t||r instanceof Element}function q(r){var t=k(r).HTMLElement;return r instanceof t||r instanceof HTMLElement}function A(r){if(typeof ShadowRoot==="undefined"){return false}var t=k(r).ShadowRoot;return r instanceof t||r instanceof ShadowRoot}function B(r){var t=r.state;Object.keys(t.elements).forEach((function(r){var n=t.styles[r]||{};var e=t.attributes[r]||{};var a=t.elements[r];if(!q(a)||!M(a)){return}Object.assign(a.style,n);Object.keys(e).forEach((function(r){var t=e[r];if(t===false){a.removeAttribute(r)}else{a.setAttribute(r,t===true?"":t)}}))}))}function P(r){var t=r.state;var n={popper:{position:t.options.strategy,left:"0",top:"0",margin:"0"},arrow:{position:"absolute"},reference:{}};Object.assign(t.elements.popper.style,n.popper);t.styles=n;if(t.elements.arrow){Object.assign(t.elements.arrow.style,n.arrow)}return function(){Object.keys(t.elements).forEach((function(r){var e=t.elements[r];var a=t.attributes[r]||{};var i=Object.keys(t.styles.hasOwnProperty(r)?t.styles[r]:n[r]);var o=i.reduce((function(r,t){r[t]="";return r}),{});if(!q(e)||!M(e)){return}Object.assign(e.style,o);Object.keys(a).forEach((function(r){e.removeAttribute(r)}))}))}}const R={name:"applyStyles",enabled:true,phase:"write",fn:B,effect:P,requires:["computeStyles"]};function S(r){return r.split("-")[0]}var W=Math.max;var L=Math.min;var T=Math.round;function H(){var r=navigator.userAgentData;if(r!=null&&r.brands){return r.brands.map((function(r){return r.brand+"/"+r.version})).join(" ")}return navigator.userAgent}function I(){return!/^((?!chrome|android).)*safari/i.test(H())}function z(r,t,n){if(t===void 0){t=false}if(n===void 0){n=false}var e=r.getBoundingClientRect();var a=1;var i=1;if(t&&q(r)){a=r.offsetWidth>0?T(e.width)/r.offsetWidth||1:1;i=r.offsetHeight>0?T(e.height)/r.offsetHeight||1:1}var o=E(r)?k(r):window,v=o.visualViewport;var f=!I()&&n;var u=(e.left+(f&&v?v.offsetLeft:0))/a;var c=(e.top+(f&&v?v.offsetTop:0))/i;var s=e.width/a;var l=e.height/i;return{width:s,height:l,top:c,right:u+s,bottom:c+l,left:u,x:u,y:c}}function C(r){var t=z(r);var n=r.offsetWidth;var e=r.offsetHeight;if(Math.abs(t.width-n)<=1){n=t.width}if(Math.abs(t.height-e)<=1){e=t.height}return{x:r.offsetLeft,y:r.offsetTop,width:n,height:e}}function D(r,t){var n=t.getRootNode&&t.getRootNode();if(r.contains(t)){return true}else if(n&&A(n)){var e=t;do{if(e&&r.isSameNode(e)){return true}e=e.parentNode||e.host}while(e)}return false}function F(r){return k(r).getComputedStyle(r)}function U(r){return["table","td","th"].indexOf(M(r))>=0}function V(r){return((E(r)?r.ownerDocument:r.document)||window.document).documentElement}function _(r){if(M(r)==="html"){return r}return r.assignedSlot||r.parentNode||(A(r)?r.host:null)||V(r)}function G(r){if(!q(r)||F(r).position==="fixed"){return null}return r.offsetParent}function J(r){var t=/firefox/i.test(H());var n=/Trident/i.test(H());if(n&&q(r)){var e=F(r);if(e.position==="fixed"){return null}}var a=_(r);if(A(a)){a=a.host}while(q(a)&&["html","body"].indexOf(M(a))<0){var i=F(a);if(i.transform!=="none"||i.perspective!=="none"||i.contain==="paint"||["transform","perspective"].indexOf(i.willChange)!==-1||t&&i.willChange==="filter"||t&&i.filter&&i.filter!=="none"){return a}else{a=a.parentNode}}return null}function K(r){var t=k(r);var n=G(r);while(n&&U(n)&&F(n).position==="static"){n=G(n)}if(n&&(M(n)==="html"||M(n)==="body"&&F(n).position==="static")){return t}return n||J(r)||t}function N(r){return["top","bottom"].indexOf(r)>=0?"x":"y"}function Q(r,t,n){return W(r,L(t,n))}function X(r,t,n){var e=Q(r,t,n);return e>n?n:e}function Y(){return{top:0,right:0,bottom:0,left:0}}function Z(r){return Object.assign({},Y(),r)}function $(r,t){return t.reduce((function(t,n){t[n]=r;return t}),{})}var rr=function r(t,n){t=typeof t==="function"?t(Object.assign({},n.rects,{placement:n.placement})):t;return Z(typeof t!=="number"?t:$(t,i))};function tr(a){var i;var o=a.state,v=a.name,f=a.options;var u=o.elements.arrow;var c=o.modifiersData.popperOffsets;var s=S(o.placement);var l=N(s);var d=[e,n].indexOf(s)>=0;var p=d?"height":"width";if(!u||!c){return}var b=rr(f.padding,o);var h=C(u);var y=l==="y"?r:e;var m=l==="y"?t:n;var x=o.rects.reference[p]+o.rects.reference[l]-c[l]-o.rects.popper[p];var w=c[l]-o.rects.reference[l];var O=K(u);var g=O?l==="y"?O.clientHeight||0:O.clientWidth||0:0;var j=x/2-w/2;var M=b[y];var k=g-h[p]-b[m];var E=g/2-h[p]/2+j;var q=Q(M,E,k);var A=l;o.modifiersData[v]=(i={},i[A]=q,i.centerOffset=q-E,i)}function nr(r){var t=r.state,n=r.options;var e=n.element,a=e===void 0?"[data-popper-arrow]":e;if(a==null){return}if(typeof a==="string"){a=t.elements.popper.querySelector(a);if(!a){return}}if(!D(t.elements.popper,a)){return}t.elements.arrow=a}const er={name:"arrow",enabled:true,phase:"main",fn:tr,effect:nr,requires:["popperOffsets"],requiresIfExists:["preventOverflow"]};function ar(r){return r.split("-")[1]}var ir={top:"auto",right:"auto",bottom:"auto",left:"auto"};function or(r){var t=r.x,n=r.y;var e=window;var a=e.devicePixelRatio||1;return{x:T(t*a)/a||0,y:T(n*a)/a||0}}function vr(a){var i;var o=a.popper,f=a.popperRect,u=a.placement,c=a.variation,s=a.offsets,l=a.position,d=a.gpuAcceleration,p=a.adaptive,b=a.roundOffsets,h=a.isFixed;var y=s.x,m=y===void 0?0:y,x=s.y,w=x===void 0?0:x;var O=typeof b==="function"?b({x:m,y:w}):{x:m,y:w};m=O.x;w=O.y;var g=s.hasOwnProperty("x");var j=s.hasOwnProperty("y");var M=e;var E=r;var q=window;if(p){var A=K(o);var B="clientHeight";var P="clientWidth";if(A===k(o)){A=V(o);if(F(A).position!=="static"&&l==="absolute"){B="scrollHeight";P="scrollWidth"}}A=A;if(u===r||(u===e||u===n)&&c===v){E=t;var R=h&&A===q&&q.visualViewport?q.visualViewport.height:A[B];w-=R-f.height;w*=d?1:-1}if(u===e||(u===r||u===t)&&c===v){M=n;var S=h&&A===q&&q.visualViewport?q.visualViewport.width:A[P];m-=S-f.width;m*=d?1:-1}}var W=Object.assign({position:l},p&&ir);var L=b===true?or({x:m,y:w}):{x:m,y:w};m=L.x;w=L.y;if(d){var T;return Object.assign({},W,(T={},T[E]=j?"0":"",T[M]=g?"0":"",T.transform=(q.devicePixelRatio||1)<=1?"translate("+m+"px, "+w+"px)":"translate3d("+m+"px, "+w+"px, 0)",T))}return Object.assign({},W,(i={},i[E]=j?w+"px":"",i[M]=g?m+"px":"",i.transform="",i))}function fr(r){var t=r.state,n=r.options;var e=n.gpuAcceleration,a=e===void 0?true:e,i=n.adaptive,o=i===void 0?true:i,v=n.roundOffsets,f=v===void 0?true:v;var u={placement:S(t.placement),variation:ar(t.placement),popper:t.elements.popper,popperRect:t.rects.popper,gpuAcceleration:a,isFixed:t.options.strategy==="fixed"};if(t.modifiersData.popperOffsets!=null){t.styles.popper=Object.assign({},t.styles.popper,vr(Object.assign({},u,{offsets:t.modifiersData.popperOffsets,position:t.options.strategy,adaptive:o,roundOffsets:f})))}if(t.modifiersData.arrow!=null){t.styles.arrow=Object.assign({},t.styles.arrow,vr(Object.assign({},u,{offsets:t.modifiersData.arrow,position:"absolute",adaptive:false,roundOffsets:f})))}t.attributes.popper=Object.assign({},t.attributes.popper,{"data-popper-placement":t.placement})}const ur={name:"computeStyles",enabled:true,phase:"beforeWrite",fn:fr,data:{}};var cr={passive:true};function sr(r){var t=r.state,n=r.instance,e=r.options;var a=e.scroll,i=a===void 0?true:a,o=e.resize,v=o===void 0?true:o;var f=k(t.elements.popper);var u=[].concat(t.scrollParents.reference,t.scrollParents.popper);if(i){u.forEach((function(r){r.addEventListener("scroll",n.update,cr)}))}if(v){f.addEventListener("resize",n.update,cr)}return function(){if(i){u.forEach((function(r){r.removeEventListener("scroll",n.update,cr)}))}if(v){f.removeEventListener("resize",n.update,cr)}}}const lr={name:"eventListeners",enabled:true,phase:"write",fn:function r(){},effect:sr,data:{}};var dr={left:"right",right:"left",bottom:"top",top:"bottom"};function pr(r){return r.replace(/left|right|bottom|top/g,(function(r){return dr[r]}))}var br={start:"end",end:"start"};function hr(r){return r.replace(/start|end/g,(function(r){return br[r]}))}function yr(r){var t=k(r);var n=t.pageXOffset;var e=t.pageYOffset;return{scrollLeft:n,scrollTop:e}}function mr(r){return z(V(r)).left+yr(r).scrollLeft}function xr(r,t){var n=k(r);var e=V(r);var a=n.visualViewport;var i=e.clientWidth;var o=e.clientHeight;var v=0;var f=0;if(a){i=a.width;o=a.height;var u=I();if(u||!u&&t==="fixed"){v=a.offsetLeft;f=a.offsetTop}}return{width:i,height:o,x:v+mr(r),y:f}}function wr(r){var t;var n=V(r);var e=yr(r);var a=(t=r.ownerDocument)==null?void 0:t.body;var i=W(n.scrollWidth,n.clientWidth,a?a.scrollWidth:0,a?a.clientWidth:0);var o=W(n.scrollHeight,n.clientHeight,a?a.scrollHeight:0,a?a.clientHeight:0);var v=-e.scrollLeft+mr(r);var f=-e.scrollTop;if(F(a||n).direction==="rtl"){v+=W(n.clientWidth,a?a.clientWidth:0)-i}return{width:i,height:o,x:v,y:f}}function Or(r){var t=F(r),n=t.overflow,e=t.overflowX,a=t.overflowY;return/auto|scroll|overlay|hidden/.test(n+a+e)}function gr(r){if(["html","body","#document"].indexOf(M(r))>=0){return r.ownerDocument.body}if(q(r)&&Or(r)){return r}return gr(_(r))}function jr(r,t){var n;if(t===void 0){t=[]}var e=gr(r);var a=e===((n=r.ownerDocument)==null?void 0:n.body);var i=k(e);var o=a?[i].concat(i.visualViewport||[],Or(e)?e:[]):e;var v=t.concat(o);return a?v:v.concat(jr(_(o)))}function Mr(r){return Object.assign({},r,{left:r.x,top:r.y,right:r.x+r.width,bottom:r.y+r.height})}function kr(r,t){var n=z(r,false,t==="fixed");n.top=n.top+r.clientTop;n.left=n.left+r.clientLeft;n.bottom=n.top+r.clientHeight;n.right=n.left+r.clientWidth;n.width=r.clientWidth;n.height=r.clientHeight;n.x=n.left;n.y=n.top;return n}function Er(r,t,n){return t===u?Mr(xr(r,n)):E(t)?kr(t,n):Mr(wr(V(r)))}function qr(r){var t=jr(_(r));var n=["absolute","fixed"].indexOf(F(r).position)>=0;var e=n&&q(r)?K(r):r;if(!E(e)){return[]}return t.filter((function(r){return E(r)&&D(r,e)&&M(r)!=="body"}))}function Ar(r,t,n,e){var a=t==="clippingParents"?qr(r):[].concat(t);var i=[].concat(a,[n]);var o=i[0];var v=i.reduce((function(t,n){var a=Er(r,n,e);t.top=W(a.top,t.top);t.right=L(a.right,t.right);t.bottom=L(a.bottom,t.bottom);t.left=W(a.left,t.left);return t}),Er(r,o,e));v.width=v.right-v.left;v.height=v.bottom-v.top;v.x=v.left;v.y=v.top;return v}function Br(a){var i=a.reference,f=a.element,u=a.placement;var c=u?S(u):null;var s=u?ar(u):null;var l=i.x+i.width/2-f.width/2;var d=i.y+i.height/2-f.height/2;var p;switch(c){case r:p={x:l,y:i.y-f.height};break;case t:p={x:l,y:i.y+i.height};break;case n:p={x:i.x+i.width,y:d};break;case e:p={x:i.x-f.width,y:d};break;default:p={x:i.x,y:i.y}}var b=c?N(c):null;if(b!=null){var h=b==="y"?"height":"width";switch(s){case o:p[b]=p[b]-(i[h]/2-f[h]/2);break;case v:p[b]=p[b]+(i[h]/2-f[h]/2);break}}return p}function Pr(e,a){if(a===void 0){a={}}var o=a,v=o.placement,l=v===void 0?e.placement:v,d=o.strategy,p=d===void 0?e.strategy:d,b=o.boundary,h=b===void 0?f:b,y=o.rootBoundary,m=y===void 0?u:y,x=o.elementContext,w=x===void 0?c:x,O=o.altBoundary,g=O===void 0?false:O,j=o.padding,M=j===void 0?0:j;var k=Z(typeof M!=="number"?M:$(M,i));var q=w===c?s:c;var A=e.rects.popper;var B=e.elements[g?q:w];var P=Ar(E(B)?B:B.contextElement||V(e.elements.popper),h,m,p);var R=z(e.elements.reference);var S=Br({reference:R,element:A,strategy:"absolute",placement:l});var W=Mr(Object.assign({},A,S));var L=w===c?W:R;var T={top:P.top-L.top+k.top,bottom:L.bottom-P.bottom+k.bottom,left:P.left-L.left+k.left,right:L.right-P.right+k.right};var H=e.modifiersData.offset;if(w===c&&H){var I=H[l];Object.keys(T).forEach((function(e){var a=[n,t].indexOf(e)>=0?1:-1;var i=[r,t].indexOf(e)>=0?"y":"x";T[e]+=I[i]*a}))}return T}function Rr(r,t){if(t===void 0){t={}}var n=t,e=n.placement,a=n.boundary,o=n.rootBoundary,v=n.padding,f=n.flipVariations,u=n.allowedAutoPlacements,c=u===void 0?d:u;var s=ar(e);var p=s?f?l:l.filter((function(r){return ar(r)===s})):i;var b=p.filter((function(r){return c.indexOf(r)>=0}));if(b.length===0){b=p}var h=b.reduce((function(t,n){t[n]=Pr(r,{placement:n,boundary:a,rootBoundary:o,padding:v})[S(n)];return t}),{});return Object.keys(h).sort((function(r,t){return h[r]-h[t]}))}function Sr(r){if(S(r)===a){return[]}var t=pr(r);return[hr(r),t,hr(t)]}function Wr(i){var v=i.state,f=i.options,u=i.name;if(v.modifiersData[u]._skip){return}var c=f.mainAxis,s=c===void 0?true:c,l=f.altAxis,d=l===void 0?true:l,p=f.fallbackPlacements,b=f.padding,h=f.boundary,y=f.rootBoundary,m=f.altBoundary,x=f.flipVariations,w=x===void 0?true:x,O=f.allowedAutoPlacements;var g=v.options.placement;var j=S(g);var M=j===g;var k=p||(M||!w?[pr(g)]:Sr(g));var E=[g].concat(k).reduce((function(r,t){return r.concat(S(t)===a?Rr(v,{placement:t,boundary:h,rootBoundary:y,padding:b,flipVariations:w,allowedAutoPlacements:O}):t)}),[]);var q=v.rects.reference;var A=v.rects.popper;var B=new Map;var P=true;var R=E[0];for(var W=0;W<E.length;W++){var L=E[W];var T=S(L);var H=ar(L)===o;var I=[r,t].indexOf(T)>=0;var z=I?"width":"height";var C=Pr(v,{placement:L,boundary:h,rootBoundary:y,altBoundary:m,padding:b});var D=I?H?n:e:H?t:r;if(q[z]>A[z]){D=pr(D)}var F=pr(D);var U=[];if(s){U.push(C[T]<=0)}if(d){U.push(C[D]<=0,C[F]<=0)}if(U.every((function(r){return r}))){R=L;P=false;break}B.set(L,U)}if(P){var V=w?3:1;var _=function r(t){var n=E.find((function(r){var n=B.get(r);if(n){return n.slice(0,t).every((function(r){return r}))}}));if(n){R=n;return"break"}};for(var G=V;G>0;G--){var J=_(G);if(J==="break")break}}if(v.placement!==R){v.modifiersData[u]._skip=true;v.placement=R;v.reset=true}}const Lr={name:"flip",enabled:true,phase:"main",fn:Wr,requiresIfExists:["offset"],data:{_skip:false}};function Tr(r,t,n){if(n===void 0){n={x:0,y:0}}return{top:r.top-t.height-n.y,right:r.right-t.width+n.x,bottom:r.bottom-t.height+n.y,left:r.left-t.width-n.x}}function Hr(a){return[r,n,t,e].some((function(r){return a[r]>=0}))}function Ir(r){var t=r.state,n=r.name;var e=t.rects.reference;var a=t.rects.popper;var i=t.modifiersData.preventOverflow;var o=Pr(t,{elementContext:"reference"});var v=Pr(t,{altBoundary:true});var f=Tr(o,e);var u=Tr(v,a,i);var c=Hr(f);var s=Hr(u);t.modifiersData[n]={referenceClippingOffsets:f,popperEscapeOffsets:u,isReferenceHidden:c,hasPopperEscaped:s};t.attributes.popper=Object.assign({},t.attributes.popper,{"data-popper-reference-hidden":c,"data-popper-escaped":s})}const zr={name:"hide",enabled:true,phase:"main",requiresIfExists:["preventOverflow"],fn:Ir};function Cr(t,a,i){var o=S(t);var v=[e,r].indexOf(o)>=0?-1:1;var f=typeof i==="function"?i(Object.assign({},a,{placement:t})):i,u=f[0],c=f[1];u=u||0;c=(c||0)*v;return[e,n].indexOf(o)>=0?{x:c,y:u}:{x:u,y:c}}function Dr(r){var t=r.state,n=r.options,e=r.name;var a=n.offset,i=a===void 0?[0,0]:a;var o=d.reduce((function(r,n){r[n]=Cr(n,t.rects,i);return r}),{});var v=o[t.placement],f=v.x,u=v.y;if(t.modifiersData.popperOffsets!=null){t.modifiersData.popperOffsets.x+=f;t.modifiersData.popperOffsets.y+=u}t.modifiersData[e]=o}const Fr={name:"offset",enabled:true,phase:"main",requires:["popperOffsets"],fn:Dr};function Ur(r){var t=r.state,n=r.name;t.modifiersData[n]=Br({reference:t.rects.reference,element:t.rects.popper,strategy:"absolute",placement:t.placement})}const Vr={name:"popperOffsets",enabled:true,phase:"read",fn:Ur,data:{}};function _r(r){return r==="x"?"y":"x"}function Gr(a){var i=a.state,v=a.options,f=a.name;var u=v.mainAxis,c=u===void 0?true:u,s=v.altAxis,l=s===void 0?false:s,d=v.boundary,p=v.rootBoundary,b=v.altBoundary,h=v.padding,y=v.tether,m=y===void 0?true:y,x=v.tetherOffset,w=x===void 0?0:x;var O=Pr(i,{boundary:d,rootBoundary:p,padding:h,altBoundary:b});var g=S(i.placement);var j=ar(i.placement);var M=!j;var k=N(g);var E=_r(k);var q=i.modifiersData.popperOffsets;var A=i.rects.reference;var B=i.rects.popper;var P=typeof w==="function"?w(Object.assign({},i.rects,{placement:i.placement})):w;var R=typeof P==="number"?{mainAxis:P,altAxis:P}:Object.assign({mainAxis:0,altAxis:0},P);var T=i.modifiersData.offset?i.modifiersData.offset[i.placement]:null;var H={x:0,y:0};if(!q){return}if(c){var I;var z=k==="y"?r:e;var D=k==="y"?t:n;var F=k==="y"?"height":"width";var U=q[k];var V=U+O[z];var _=U-O[D];var G=m?-B[F]/2:0;var J=j===o?A[F]:B[F];var Z=j===o?-B[F]:-A[F];var $=i.elements.arrow;var rr=m&&$?C($):{width:0,height:0};var tr=i.modifiersData["arrow#persistent"]?i.modifiersData["arrow#persistent"].padding:Y();var nr=tr[z];var er=tr[D];var ir=Q(0,A[F],rr[F]);var or=M?A[F]/2-G-ir-nr-R.mainAxis:J-ir-nr-R.mainAxis;var vr=M?-A[F]/2+G+ir+er+R.mainAxis:Z+ir+er+R.mainAxis;var fr=i.elements.arrow&&K(i.elements.arrow);var ur=fr?k==="y"?fr.clientTop||0:fr.clientLeft||0:0;var cr=(I=T==null?void 0:T[k])!=null?I:0;var sr=U+or-cr-ur;var lr=U+vr-cr;var dr=Q(m?L(V,sr):V,U,m?W(_,lr):_);q[k]=dr;H[k]=dr-U}if(l){var pr;var br=k==="x"?r:e;var hr=k==="x"?t:n;var yr=q[E];var mr=E==="y"?"height":"width";var xr=yr+O[br];var wr=yr-O[hr];var Or=[r,e].indexOf(g)!==-1;var gr=(pr=T==null?void 0:T[E])!=null?pr:0;var jr=Or?xr:yr-A[mr]-B[mr]-gr+R.altAxis;var Mr=Or?yr+A[mr]+B[mr]-gr-R.altAxis:wr;var kr=m&&Or?X(jr,yr,Mr):Q(m?jr:xr,yr,m?Mr:wr);q[E]=kr;H[E]=kr-yr}i.modifiersData[f]=H}const Jr={name:"preventOverflow",enabled:true,phase:"main",fn:Gr,requiresIfExists:["offset"]};function Kr(r){return{scrollLeft:r.scrollLeft,scrollTop:r.scrollTop}}function Nr(r){if(r===k(r)||!q(r)){return yr(r)}else{return Kr(r)}}function Qr(r){var t=r.getBoundingClientRect();var n=T(t.width)/r.offsetWidth||1;var e=T(t.height)/r.offsetHeight||1;return n!==1||e!==1}function Xr(r,t,n){if(n===void 0){n=false}var e=q(t);var a=q(t)&&Qr(t);var i=V(t);var o=z(r,a,n);var v={scrollLeft:0,scrollTop:0};var f={x:0,y:0};if(e||!e&&!n){if(M(t)!=="body"||Or(i)){v=Nr(t)}if(q(t)){f=z(t,true);f.x+=t.clientLeft;f.y+=t.clientTop}else if(i){f.x=mr(i)}}return{x:o.left+v.scrollLeft-f.x,y:o.top+v.scrollTop-f.y,width:o.width,height:o.height}}function Yr(r){var t=new Map;var n=new Set;var e=[];r.forEach((function(r){t.set(r.name,r)}));function a(r){n.add(r.name);var i=[].concat(r.requires||[],r.requiresIfExists||[]);i.forEach((function(r){if(!n.has(r)){var e=t.get(r);if(e){a(e)}}}));e.push(r)}r.forEach((function(r){if(!n.has(r.name)){a(r)}}));return e}function Zr(r){var t=Yr(r);return j.reduce((function(r,n){return r.concat(t.filter((function(r){return r.phase===n})))}),[])}function $r(r){var t;return function(){if(!t){t=new Promise((function(n){Promise.resolve().then((function(){t=undefined;n(r())}))}))}return t}}function rt(r){var t=r.reduce((function(r,t){var n=r[t.name];r[t.name]=n?Object.assign({},n,t,{options:Object.assign({},n.options,t.options),data:Object.assign({},n.data,t.data)}):t;return r}),{});return Object.keys(t).map((function(r){return t[r]}))}var tt={placement:"bottom",modifiers:[],strategy:"absolute"};function nt(){for(var r=arguments.length,t=new Array(r),n=0;n<r;n++){t[n]=arguments[n]}return!t.some((function(r){return!(r&&typeof r.getBoundingClientRect==="function")}))}function et(r){if(r===void 0){r={}}var t=r,n=t.defaultModifiers,e=n===void 0?[]:n,a=t.defaultOptions,i=a===void 0?tt:a;return function r(t,n,a){if(a===void 0){a=i}var o={placement:"bottom",orderedModifiers:[],options:Object.assign({},tt,i),modifiersData:{},elements:{reference:t,popper:n},attributes:{},styles:{}};var v=[];var f=false;var u={state:o,setOptions:function r(a){var v=typeof a==="function"?a(o.options):a;s();o.options=Object.assign({},i,o.options,v);o.scrollParents={reference:E(t)?jr(t):t.contextElement?jr(t.contextElement):[],popper:jr(n)};var f=Zr(rt([].concat(e,o.options.modifiers)));o.orderedModifiers=f.filter((function(r){return r.enabled}));c();return u.update()},forceUpdate:function r(){if(f){return}var t=o.elements,n=t.reference,e=t.popper;if(!nt(n,e)){return}o.rects={reference:Xr(n,K(e),o.options.strategy==="fixed"),popper:C(e)};o.reset=false;o.placement=o.options.placement;o.orderedModifiers.forEach((function(r){return o.modifiersData[r.name]=Object.assign({},r.data)}));for(var a=0;a<o.orderedModifiers.length;a++){if(o.reset===true){o.reset=false;a=-1;continue}var i=o.orderedModifiers[a],v=i.fn,c=i.options,s=c===void 0?{}:c,l=i.name;if(typeof v==="function"){o=v({state:o,options:s,name:l,instance:u})||o}}},update:$r((function(){return new Promise((function(r){u.forceUpdate();r(o)}))})),destroy:function r(){s();f=true}};if(!nt(t,n)){return u}u.setOptions(a).then((function(r){if(!f&&a.onFirstUpdate){a.onFirstUpdate(r)}}));function c(){o.orderedModifiers.forEach((function(r){var t=r.name,n=r.options,e=n===void 0?{}:n,a=r.effect;if(typeof a==="function"){var i=a({state:o,name:t,instance:u,options:e});var f=function r(){};v.push(i||f)}}))}function s(){v.forEach((function(r){return r()}));v=[]}return u}}var at=[lr,Vr,ur,R,Fr,Lr,Jr,er,zr];var it=et({defaultModifiers:at});export{it as c};
-//# sourceMappingURL=p-ec26fc38.js.map