tuix-webcomponents 0.64.0 → 0.65.0

package/dist/assets/index-DBzYXxxs.js

@@ -1,1554 +0,0 @@
-import{r as l,i as u,T as It,s as H,x as d,A as z,m as zt,f as K,c as nt,p as ft,a as Mt}from"./iframe-ClsPaEIM.js";import{e as St,i as Et,t as Ot,o as dt,a as Y}from"./state-CLjydI9z.js";import{S as g,n as a,e as M}from"./screenSizes.enum-C1IhC_dy.js";import{T as p,M as Q,a as N,c as Dt,b as Bt}from"./tuix-text.enums-Ck8cVqZZ.js";import{s as b,b as Rt,h as Nt,a as Vt,T as jt}from"./TuixIconButton-eQtxZNXh.js";import{P as c,D as h,a as st,I as k}from"./tuix-icon.enums-DYTtwLZl.js";import{P as Z,B as Ht}from"./tuix-paper.enum-DhmlUJB7.js";import"./TuixToast-BhxwZIGo.js";import"./TuixModal-BZFIHTi_.js";/**
- * @license
- * Copyright 2017 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */const Yt=({finisher:t,descriptor:e})=>(o,n)=>{var i;if(n===void 0){const r=(i=o.originalKey)!==null&&i!==void 0?i:o.key,s=e!=null?{kind:"method",placement:"prototype",key:r,descriptor:e(o.key)}:{...o,key:r};return t!=null&&(s.finisher=function(O){t(O,r)}),s}{const r=o.constructor;e!==void 0&&Object.defineProperty(o,n,e(n)),t?.(r,n)}};/**
- * @license
- * Copyright 2017 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */function _t(t,e){return Yt({descriptor:o=>({get(){var i,r;return(r=(i=this.renderRoot)===null||i===void 0?void 0:i.querySelector(t))!==null&&r!==void 0?r:null},enumerable:!0,configurable:!0})})}const At=u`
-  ${l(`
-  ${b(p.Link)} {
-    font-family: 'Rubik', sans-serif;
-    font-size: 1rem;
-    font-weight: 400;
-    line-height: 1.25rem;    
-  }
-  @media only screen and (max-width: ${g.TABLET}px) {
-    ${b(p.Link)} {   
-      font-size: 0.938rem;
-      line-height: 1.125rem;    
-    }  
-  }
-  @media only screen and (max-width: ${g.MOBILE}px) {
-    ${b(p.Link)} {   
-      font-size: 0.875rem;
-      line-height: 1rem;    
-    }  
-  }
-`)}
-`,Ft=u`
-  ${l(`
-  ${b(p.XL)} {
-    font-size: 3.375rem;
-    font-weight: 600;
-    line-height: 3.688rem;
-  }
-
-  ${b(p.L)} {
-    font-size: 2.813rem;
-    font-weight: 600;
-    line-height: 3.375rem;
-  }
-
-  ${b(p.M)} {
-    font-size: 2.313rem;
-    font-weight: 600;
-    line-height: 2.75rem;
-  }
-
-  ${b(p.S)} {
-    font-size: 1.938rem;
-    font-weight: 600;
-    line-height: 2.313rem;
-  }
-
-  ${b(p.XS)} {
-    font-size: 1.313rem;
-    font-weight: 600;
-    line-height: 1.563rem;
-  }
-
-  ${b(p.Body1)} {
-    font-size: 1.125rem;
-    font-weight: 300;
-    line-height: 1.688rem;
-  }
-
-  ${b(p.Body2)} {
-    font-size: 0.938rem;
-    font-weight: 300;
-    line-height: 1.313rem;
-  }
-
-  ${b(p.Field1)} {
-    font-size: 1rem;
-    font-weight: 300;
-    line-height: 1.25rem;
-  }
-
-  ${b(p.Field2)} {
-    font-size: 0.75rem;
-    font-weight: 300;
-    line-height: 0.875rem;
-  }
-
-  @media only screen and (max-width: ${g.TABLET}px) {
-    ${b(p.XL)} {
-      font-size: 3rem;
-      line-height: 3.313rem;
-    }
-    ${b(p.L)} {
-      font-size: 2.5rem;
-      line-height: 3rem;
-    }
-    ${b(p.M)} {
-      font-size: 2.063rem;
-      line-height: 2.5rem;
-    }
-    ${b(p.S)} {
-      font-size: 1.75rem;
-      line-height: 2.125rem;
-    }
-    ${b(p.XS)} {
-      font-size: 1.188rem;
-      line-height: 1.438rem;
-    }
-
-    ${b(p.Body1)} {
-      font-size: 1rem;
-      line-height: 1.5rem;
-    }
-
-    ${b(p.Body2)} {
-      font-size: 0.875rem;
-      line-height: 1.125rem;
-    }
-
-    ${b(p.Field1)} {
-      font-size: 0.938rem;
-      line-height: 1.125rem;
-    }
-  }
-
-  @media only screen and (max-width: ${g.MOBILE}px) {
-    ${b(p.Body1)} {
-      font-size: 0.875rem;
-      font-weight: 300;
-      line-height: 1.313rem;
-    }
-    ${b(p.Body2)} {
-      font-size: 0.75rem;
-      line-height: 1rem;
-    }
-    ${b(p.Field1)} {
-      font-size: 0.875rem;
-      font-weight: 300;
-      line-height: 1rem;
-    }
-    ${b(p.XL)} {
-      font-size: 2.625rem;
-      line-height: 2.875rem;
-    }
-    ${b(p.L)} {
-      font-size: 2.188rem;
-      line-height: 2.438rem;
-    }
-    ${b(p.M)} {
-      font-size: 1.813rem;
-      line-height: 2rem;
-    }
-    ${b(p.S)} {
-      font-size: 1.5rem;
-      line-height: 1.625rem;
-    }
-    ${b(p.XS)} {
-      font-size: 1.063rem;
-      line-height: 1.188rem;
-    }
-  }
-`)}
-`;/**
- * @license
- * Copyright 2018 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */const E=St(class extends Et{constructor(t){var e;if(super(t),t.type!==Ot.ATTRIBUTE||t.name!=="class"||((e=t.strings)===null||e===void 0?void 0:e.length)>2)throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.")}render(t){return" "+Object.keys(t).filter((e=>t[e])).join(" ")+" "}update(t,[e]){var o,n;if(this.it===void 0){this.it=new Set,t.strings!==void 0&&(this.nt=new Set(t.strings.join(" ").split(/\s/).filter((r=>r!==""))));for(const r in e)e[r]&&!(!((o=this.nt)===null||o===void 0)&&o.has(r))&&this.it.add(r);return this.render(e)}const i=t.element.classList;this.it.forEach((r=>{r in e||(i.remove(r),this.it.delete(r))}));for(const r in e){const s=!!e[r];s===this.it.has(r)||!((n=this.nt)===null||n===void 0)&&n.has(r)||(s?(i.add(r),this.it.add(r)):(i.remove(r),this.it.delete(r)))}return It}}),B="--t-link-text-color",Ut=u`
-  ${l(`
-  :host {
-    --t-link-border-color: ${c.MAIN};
-    ${B}: ${c.MAIN}
-  }
-
-  :host([dark]) {
-    --t-link-border-color: ${h.MAIN};
-    ${B}: ${h.MAIN}
-  }
-
-  :host([variant=${Q.SECONDARY}]) {
-    --t-link-border-color: ${c.WHITE};
-    ${B}: ${c.WHITE}
-  }
-
-  :host([variant=${Q.SECONDARY}][dark]) {
-    --t-link-border-color: ${h.WHITE};
-    ${B}: ${h.WHITE}
-  }
-
-  :host([disabled]) .link.disabled {
-    --t-link-border-color: ${c.PRIMARY_300};
-    ${B}: ${c.PRIMARY_300}
-  }
-
-  .link {    
-    text-decoration: none;
-    display: inline;
-    color: var(${B});
-    border-bottom: solid 1px var(--t-link-border-active-color, transparent);
-  }
-  .link:hover {
-    border-bottom: solid 1px var(--t-link-border-color);
-    cursor: pointer;
-  }
-  .link.secondary {
-    color: var(${B});
-  }
-  .link.secondary:hover {
-    border-bottom: solid 1px var(--t-link-border-color);
-  }  
-  .link.disabled {
-    border-bottom: solid 1px var(--t-link-border-color);
-    color: var(${B});
-    cursor: not-allowed;
-  }  
-`)}
-`;var Xt=Object.defineProperty,Wt=Object.getOwnPropertyDescriptor,ht=(t,e,o,n)=>{for(var i=n>1?void 0:n?Wt(e,o):e,r=t.length-1,s;r>=0;r--)(s=t[r])&&(i=(n?s(e,o,i):s(i))||i);return n&&i&&Xt(e,o,i),i};let tt=class extends H{constructor(){super(...arguments),this.size=p.Body1,this.color=N.PRIMARY,this.dark=!1,this._getStyleMap=()=>({color:`var(${B}, ${this._getTextColor()})`}),this._getClassMap=()=>({text:!0,[this.size]:!0})}_getTextColor(){return(this.dark?Dt:Bt)[this.color||N.PRIMARY]}render(){return d` <div
-      class="${E(this._getClassMap())}"
-      style="${dt(this._getStyleMap())}"
-    >
-      <slot></slot>
-    </div>`}};tt.styles=[u`
-      ${l(b("text"))} {
-        font-family: 'Rubik', sans-serif;
-        display: inline;
-        margin: 0;
-      }
-    `,Ft,At,Rt];ht([a({type:p})],tt.prototype,"size",2);ht([a({type:N})],tt.prototype,"color",2);ht([a({type:Boolean,reflect:!0})],tt.prototype,"dark",2);tt=ht([M("tuix-text")],tt);var Kt=Object.defineProperty,Gt=Object.getOwnPropertyDescriptor,ut=(t,e,o,n)=>{for(var i=n>1?void 0:n?Gt(e,o):e,r=t.length-1,s;r>=0;r--)(s=t[r])&&(i=(n?s(e,o,i):s(i))||i);return n&&i&&Kt(e,o,i),i};let et=class extends jt{constructor(){super(...arguments),this.full=!1}_updateIconColor(){!this.iconLeft&&!this.iconRight||(this.iconColor=this._getTextColor())}_buttonContent(){let t=st.MEDIUM;return screen.width<=g.TABLET&&(t=st.SMALL),d` <div class="container">
-      ${this.iconLeft?this._iconTemplate(this.iconLeft,t):z}
-      <slot></slot>
-      ${this.iconRight?this._iconTemplate(this.iconRight,t):z}
-    </div>`}};et.styles=[u`
-      :host([full]) .button {
-        width: 100%;
-      }
-      .button {
-        padding: 16px 32px;
-        border-radius: 4px;
-        border: none;
-        font-family: 'Rubik', sans-serif;
-      }
-
-      @media only screen and (max-width: ${g.TABLET}px) {
-        .button {
-          padding: 14px 32px;
-        }
-      }
-
-      @media only screen and (max-width: ${g.MOBILE}px) {
-        .button {
-          padding: 12px 24px;
-        }
-      }
-
-      .container {
-        display: flex;
-        flex-direction: row;
-        justify-content: center;
-        align-items: center;
-        gap: 8px;
-      }
-
-      @media only screen and (max-width: ${g.MOBILE}px) {
-        .container {
-          gap: 6px;
-        }
-      }
-    `,Nt,Vt,Rt];ut([a({type:Boolean,reflect:!0})],et.prototype,"full",2);ut([a({type:k})],et.prototype,"iconRight",2);ut([a({type:k})],et.prototype,"iconLeft",2);et=ut([M("tuix-button")],et);const qt=Object.values(Z).slice(1,-1).map((t,e)=>`
-  .elevation.variant_${t} {
-    box-shadow: 0px ${2**e}px ${2**(e+2)}px ${c.SHADOW};
-  }
-  .elevation.dark_${t} {
-    background-color:rgb(${23+3*e},${23+3*e},${26+5*e});
-  }`).join(`
-`),Jt=u`
-  ${l(`
-  .elevation {
-    background-color: ${c.WHITE};
-  }
-  .elevation.dark_${Z.VARIANT_0} {
-    background-color: ${c.BLACK};
-  }
-  ${qt}
-  .elevation.variant_${Z.VARIANT_4} {
-    box-shadow: 0px 7px 24px ${c.SHADOW};
-  }
-  .elevation.dark_${Z.VARIANT_4} {
-    background-color: rgb(33, 33, 40);
-  }
-`)}
-`;var Qt=Object.defineProperty,Zt=Object.getOwnPropertyDescriptor,bt=(t,e,o,n)=>{for(var i=n>1?void 0:n?Zt(e,o):e,r=t.length-1,s;r>=0;r--)(s=t[r])&&(i=(n?s(e,o,i):s(i))||i);return n&&i&&Qt(e,o,i),i};let it=class extends H{constructor(){super(...arguments),this.elevation=Z.VARIANT_1,this.borderRadius=Ht.NONE,this.dark=!1}_getOptionalClasses(){const t=`variant_${this.elevation}`,e=`dark_${this.elevation}`;return{elevation:!0,[t]:!this.dark,[e]:this.dark}}render(){return d` <div
-      class="${E(this._getOptionalClasses())}"
-      style="${dt({borderRadius:this.borderRadius})}"
-    >
-      <slot></slot>
-    </div>`}};it.styles=[Jt];bt([a({type:Z})],it.prototype,"elevation",2);bt([a({type:String,attribute:"border-radius"})],it.prototype,"borderRadius",2);bt([a({type:Boolean,reflect:!0})],it.prototype,"dark",2);it=bt([M("tuix-paper")],it);var pt=(t=>(t.BLANK="_blank",t.SELF="_self",t.PARENT="_parent",t.TOP="_top",t))(pt||{}),te=Object.defineProperty,ee=Object.getOwnPropertyDescriptor,ot=(t,e,o,n)=>{for(var i=n>1?void 0:n?ee(e,o):e,r=t.length-1,s;r>=0;r--)(s=t[r])&&(i=(n?s(e,o,i):s(i))||i);return n&&i&&te(e,o,i),i};let U=class extends H{constructor(){super(...arguments),this.target=pt.BLANK,this.variant=Q.PRIMARY,this.disabled=!1,this.dark=!1}_getClassMap(){return{link:!0,disabled:this.disabled,[Q.SECONDARY]:this.variant===Q.SECONDARY}}_anchorTemplate(){return d`
-      <a
-        target="${this.disabled?pt.SELF:this.target}"
-        class="${E(this._getClassMap())}"
-        href="${this.disabled?"javascript:void(0)":this.href}"
-      >
-        <slot></slot>
-      </a>
-    `}_divTemplate(){return d`
-      <div class="${E(this._getClassMap())}">
-        <slot></slot>
-      </div>
-    `}render(){return this.href&&!this.disabled?this._anchorTemplate():this._divTemplate()}};U.styles=[Ut,At];ot([a({type:String})],U.prototype,"href",2);ot([a({type:pt})],U.prototype,"target",2);ot([a({type:Q,reflect:!0})],U.prototype,"variant",2);ot([a({type:Boolean,reflect:!0})],U.prototype,"disabled",2);ot([a({type:Boolean,reflect:!0})],U.prototype,"dark",2);U=ot([M("tuix-link")],U);const Pt=t=>{const o=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(t);return o?{r:parseInt(o[1],16),g:parseInt(o[2],16),b:parseInt(o[3],16)}:{r:0,g:0,b:0}},F={gapX:"10px",iconDesktopSize:"1.5rem",iconMobileSize:"1rem"},mt=Pt(h.VALIDATION),vt=Pt(h.ERROR),Lt=u`
-  :host {
-    --t-field-color-form: ${l(c.PRIMARY_50)};
-    --t-field-color-title: ${l(c.PRIMARY_600)};
-    --t-field-color-text: ${l(c.BLACK)};
-    --t-field-color-description: ${l(c.NEUTRAL_600)};
-    --t-field-color-stroke-hover: ${l(c.PRIMARY_300)};
-    --t-field-color-stroke-focus: ${l(c.MAIN)};
-    --t-field-color-text-disabled: ${l(c.PRIMARY_300)};
-    --t-field-color-stroke-validation: ${l(c.VALIDATION_200)};
-    --t-field-color-bg-validation: ${l(c.VALIDATION_50)};
-    --t-field-color-stroke-loading: ${l(c.PRIMARY_300)};
-    --t-field-color-bg-error: ${l(c.ERROR_50)};
-    --t-field-color-stroke-error: ${l(c.ERROR_200)};
-    --t-field-input-cursor: auto;
-    --t-field-font-size: 1rem;
-    --t-field-font-weight: 300;
-    --t-field-line-height: 1.25rem;
-    --t-field-padding-x: 1.25rem;
-    --t-field-padding-y: 1.125rem;
-    --t-field-padding-top: 1.625rem;
-    --t-field-padding-bottom: 0.625rem;
-    --t-field-title-left-position: 1.25rem;
-  }
-  :host([dark]) {
-    --t-field-color-form: ${l(h.PRIMARY_950)};
-    --t-field-color-text: ${l(h.PRIMARY_100)};
-    --t-field-color-description: ${l(h.NEUTRAL_200)};
-    --t-field-color-stroke-focus: ${l(h.SECONDARY)};
-    --t-field-color-text-disabled: ${l(h.PRIMARY_800)};
-    --t-field-color-stroke-validation: ${l(h.VALIDATION_200)};
-    --t-field-color-bg-validation: rgba(
-      ${mt.r},
-      ${mt.g},
-      ${mt.b},
-      0.2
-    );
-    --t-field-color-bg-error: rgba(
-      ${vt.r},
-      ${vt.g},
-      ${vt.b},
-      0.2
-    );
-    --t-field-color-stroke-error: ${l(h.ERROR_200)};
-  }
-`,ie=u`
-  .t-textarea-main-container {
-    display: flex;
-    flex-direction: column;
-    width: 100%;
-    height: 100%;
-  }
-  .t-input-container {
-    position: relative;
-    --t-padding-x-desktop-with-icon: calc(
-      var(--t-field-padding-x) + ${l(F.iconDesktopSize)} +
-        ${l(F.gapX)}
-    );
-    --t-padding-x-mobile-with-icon: calc(
-      var(--t-field-padding-x) + ${l(F.iconMobileSize)} +
-        ${l(F.gapX)}
-    );
-    --t-border-size: 1px;
-  }
-  .t-input-container.t-textarea-container {
-    height: 100%;
-  }
-  .t-input {
-    padding: calc(var(--t-field-padding-y) - var(--t-border-size))
-      var(--t-field-padding-x);
-    border-radius: 4px;
-    font-family: 'Rubik', sans-serif;
-    cursor: var(--t-field-input-cursor);
-    width: 100%;
-    box-sizing: border-box;
-  }
-  .t-input.t-textarea {
-    height: 100%;
-    display: block;
-  }
-  .t-input.with-title {
-    padding-top: calc(var(--t-field-padding-top) - var(--t-border-size));
-    padding-bottom: calc(var(--t-field-padding-bottom) - var(--t-border-size));
-  }
-  .t-input.with-icon-right {
-    padding-right: var(--t-padding-x-desktop-with-icon);
-  }
-  @media only screen and (max-width: ${g.MOBILE}px) {
-    .t-input.with-icon-right {
-      padding-right: var(--t-padding-x-mobile-with-icon);
-    }
-  }
-`,oe=u`
-  .t-input::placeholder,
-  .t-input,
-  .t-title {
-    font-size: var(--t-field-font-size);
-    font-weight: var(--t-field-font-weight);
-    line-height: var(--t-field-line-height);
-  }
-  @media only screen and (max-width: ${g.TABLET}px) {
-    :host {
-      --t-field-font-size: 0.813rem;
-      --t-field-line-height: 1.125rem;
-      --t-field-padding-y: 1.063rem;
-      --t-field-padding-top: 1.5rem;
-    }
-  }
-  @media only screen and (max-width: ${g.MOBILE}px) {
-    :host {
-      --t-field-font-size: 0.813rem;
-      --t-field-line-height: 1rem;
-      --t-field-padding-y: 1rem;
-      --t-field-padding-top: 1.375rem;
-    }
-  }
-`,re=u`
-  .t-input {
-    background-color: var(--t-field-color-form);
-    border: 1px solid var(--t-field-color-form);
-    color: var(--t-field-color-text);
-  }
-  .t-input-container:hover .t-input,
-  .t-input:hover {
-    border: 1px solid var(--t-field-color-stroke-hover);
-  }
-  .t-input:focus {
-    border: 1px solid var(--t-field-color-stroke-focus);
-    outline: 1px solid var(--t-field-color-stroke-focus);
-  }
-  .t-input[disabled]:disabled {
-    cursor: not-allowed;
-    border: 1px solid var(--t-field-color-form);
-    color: var(--t-field-color-text-disabled);
-  }
-  .t-input.with-title::placeholder {
-    color: transparent;
-  }
-  .t-input::placeholder,
-  .t-input.with-title:focus::placeholder {
-    color: var(--t-field-color-title);
-  }
-  .t-input.with-warning {
-    border: 1px solid var(--t-field-color-stroke-validation);
-    background-color: var(--t-field-color-bg-validation);
-  }
-  .t-input.with-error {
-    border: 1px solid var(--t-field-color-stroke-error);
-    background-color: var(--t-field-color-bg-error);
-  }
-  .t-input.with-loading {
-    border: 1px solid var(--t-field-color-stroke-loading);
-  }
-`,ne=u`
-  .t-title {
-    position: absolute;
-    top: 50%;
-    left: var(--t-field-title-left-position);
-    font-family: 'Rubik', sans-serif;
-    color: var(--t-field-color-title);
-    transform: translateY(-50%);
-    transition-duration: 0.3s;
-    pointer-events: none;
-    -webkit-user-select: none;
-    -moz-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
-  }
-  .t-textarea-container .t-title {
-    top: 1rem;
-    transform: none;
-  }
-  .t-input.with-title:focus + .t-title,
-  .t-input.with-title:not(:placeholder-shown) + .t-title {
-    font-size: 0.75rem;
-    font-weight: 300;
-    line-height: 0.875rem;
-    transform: translateY(0);
-    top: 0.5rem;
-  }
-`,se=u`
-  .t-input-container .t-icon-set-container {
-    height: ${l(F.iconDesktopSize)};
-    width: ${l(F.iconDesktopSize)};
-    cursor: var(--t-field-input-cursor);
-  }
-  .t-icon-set-container.t-icon-click {
-    cursor: pointer;
-  }
-  .t-input-container .t-icon-set-container.t-icon-right {
-    position: absolute;
-    top: 50%;
-    right: var(--t-field-padding-x);
-    transform: translateY(-50%);
-  }
-  .t-input-container .t-icon-set-container.t-icon-left {
-    position: absolute;
-    top: 50%;
-    left: var(--t-field-padding-x);
-    transform: translateY(-50%);
-  }
-  .t-icon-inactive {
-    display: inline;
-  }
-  .t-icon-active {
-    display: none;
-  }
-  .t-icon-disabled {
-    display: none;
-  }
-  .t-input-container:hover .t-icon-set-container .t-icon-inactive,
-  .t-input:hover ~ .t-icon-set-container .t-icon-inactive,
-  .t-input:focus ~ .t-icon-set-container .t-icon-inactive {
-    display: none;
-  }
-  .t-input-container:hover .t-icon-set-container .t-icon-active,
-  .t-input:hover ~ .t-icon-set-container .t-icon-active,
-  .t-input:focus ~ .t-icon-set-container .t-icon-active {
-    display: inline;
-  }
-  .t-input[disabled] ~ .t-icon-set-container .t-icon-active {
-    display: none;
-  }
-  .t-input[disabled] ~ .t-icon-set-container .t-icon-inactive {
-    display: none;
-  }
-  .t-input[disabled] ~ .t-icon-set-container .t-icon-disabled {
-    display: inline;
-    cursor: not-allowed;
-  }
-  @media only screen and (max-width: ${g.MOBILE}px) {
-    .t-input-container .t-icon-set-container {
-      height: ${l(F.iconMobileSize)};
-      width: ${l(F.iconMobileSize)};
-    }
-  }
-`,ae=u`
-  .t-input[type='search'] {
-    padding-left: var(--t-padding-x-desktop-with-icon);
-  }
-  .t-input[type='search'] + .t-title {
-    left: var(--t-padding-x-desktop-with-icon);
-  }
-  @media only screen and (max-width: ${g.MOBILE}px) {
-    .t-input[type='search'] {
-      padding-left: var(--t-padding-x-mobile-with-icon);
-    }
-    .t-input[type='search'] + .t-title {
-      left: var(--t-padding-x-mobile-with-icon);
-    }
-  }
-  input[type='search']::-webkit-search-decoration,
-  input[type='search']::-webkit-search-cancel-button,
-  input[type='search']::-webkit-search-results-button,
-  input[type='search']::-webkit-search-results-decoration {
-    display: none;
-  }
-`,le=u`
-  .t-input-description-container {
-    margin-top: 0.5rem;
-    font-family: 'Rubik', sans-serif;
-    font-size: 0.75rem;
-    line-height: 1rem;
-    color: var(--t-field-color-description);
-    display: flex;
-    justify-content: space-between;
-  }
-  .t-input-description-container .t-letter-counter {
-    align-self: flex-end;
-  }
-  .t-input-description-container .t-input-description {
-    display: flex;
-    gap: 0.5rem;
-  }
-`;var f=(t=>(t.TEXT="text",t.SEARCH="search",t.PASSWORD="password",t.TEXT_AREA="textarea",t))(f||{}),yt=(t=>(t.LEFT="left",t.RIGHT="right",t))(yt||{}),w=(t=>(t.TEXT="text",t.WARNING="warning",t.ERROR="error",t.SUCCESS="success",t.LOADING="loading",t))(w||{});const ce={warning:k.TRIANGLE_EXCLAMATION,error:k.CIRCLE_X,success:k.CIRCLE_CHECK,loading:k.LOADER},de={warning:c.VALIDATION,error:c.ERROR,success:c.SUCCESS,loading:c.PRIMARY_300},pe={warning:h.VALIDATION,error:h.ERROR,success:h.SUCCESS,loading:h.PRIMARY_300},A={INACTIVE:"inactive",ACTIVE:"active",DISABLED:"disabled"};var _=[];for(var xt=0;xt<256;++xt)_.push((xt+256).toString(16).slice(1));function he(t,e=0){return(_[t[e+0]]+_[t[e+1]]+_[t[e+2]]+_[t[e+3]]+"-"+_[t[e+4]]+_[t[e+5]]+"-"+_[t[e+6]]+_[t[e+7]]+"-"+_[t[e+8]]+_[t[e+9]]+"-"+_[t[e+10]]+_[t[e+11]]+_[t[e+12]]+_[t[e+13]]+_[t[e+14]]+_[t[e+15]]).toLowerCase()}var lt,ue=new Uint8Array(16);function be(){if(!lt&&(lt=typeof crypto<"u"&&crypto.getRandomValues&&crypto.getRandomValues.bind(crypto),!lt))throw new Error("crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported");return lt(ue)}var ge=typeof crypto<"u"&&crypto.randomUUID&&crypto.randomUUID.bind(crypto);const Tt={randomUUID:ge};function fe(t,e,o){if(Tt.randomUUID&&!t)return Tt.randomUUID();t=t||{};var n=t.random||(t.rng||be)();return n[6]=n[6]&15|64,n[8]=n[8]&63|128,he(n)}var me=Object.defineProperty,ve=Object.getOwnPropertyDescriptor,T=(t,e,o,n)=>{for(var i=n>1?void 0:n?ve(e,o):e,r=t.length-1,s;r>=0;r--)(s=t[r])&&(i=(n?s(e,o,i):s(i))||i);return n&&i&&me(e,o,i),i};let x=class extends H{constructor(){super(...arguments),this._inputId=this._setIdInput(),this.disabled=!1,this.value="",this.placeholder="",this.title="",this.type=f.TEXT,this.descriptionType=w.TEXT,this.dark=!1,this.readonly=!1,this.autofocus=!1,this._type=this.type,this._letterCounter=this.value?.length||0,this._previousType=this.type,this._previousValue="",this._generalIconColorsLight={[A.INACTIVE]:c.BLACK,[A.ACTIVE]:c.MAIN,[A.DISABLED]:c.PRIMARY_300},this._generalIconColorsDark={[A.INACTIVE]:h.PRIMARY_100,[A.ACTIVE]:h.MAIN,[A.DISABLED]:h.PRIMARY_800}}_handleInputBase(t,e){this.dispatchEvent(new CustomEvent(e,{detail:{value:(t.target instanceof HTMLInputElement||t.target instanceof HTMLTextAreaElement)&&t.target.value},bubbles:!0}))}_handleClickOnInput(){this.disabled||this.dispatchEvent(new CustomEvent("on-click",{bubbles:!0}))}_handleInput(t){this._handleInputBase(t,"on-change"),this._updateLetterCounter()}_handleBlur(t){this._handleInputBase(t,"on-blur")}_handlePasswordIconClick(){this._type===f.PASSWORD?(this._type=f.TEXT,this._inputElement.setAttribute("type",f.TEXT)):(this._type=f.PASSWORD,this._inputElement.setAttribute("type",f.PASSWORD))}_formatIconSet({iconName:t,colorByState:e,location:o=yt.RIGHT,clickHandler:n=void 0}){const i={"t-icon-set-container":!0,"t-icon-click":!!n,[`t-icon-${o}`]:!0};return d`<div
-      class="${E(i)}"
-      @click="${n}"
-    >
-      ${Object.entries(e).map(([r,s])=>d`<tuix-icon
-          size="${st.FULL}"
-          name="${t}"
-          color="${s}"
-          class="t-icon-${r}"
-        ></tuix-icon>`)}
-    </div>`}_updateLetterCounter(){this.maxlength!=null&&this.type===f.TEXT_AREA&&(this._letterCounter=Number(this._inputElement.value?.length))}_getInputTextFeatureTemplate(){return d`${this.iconRight?this._formatIconSet({iconName:this.iconRight,colorByState:this.dark?this._generalIconColorsDark:this._generalIconColorsLight}):z}`}_getInputSearchFeatureTemplate(){const t={[A.INACTIVE]:c.BLACK,[A.ACTIVE]:c.BLACK,[A.DISABLED]:c.PRIMARY_300},e={[A.INACTIVE]:h.PRIMARY_100,[A.ACTIVE]:h.PRIMARY_100,[A.DISABLED]:h.PRIMARY_800};return d`${this._formatIconSet({iconName:k.SEARCH,colorByState:this.dark?e:t,location:yt.LEFT})}`}_getInputPasswordFeatureTemplate(){return d`${this._formatIconSet({iconName:this._type===f.PASSWORD?k.EYE_CLOSE_LINE:k.EYE_ON,colorByState:this.dark?this._generalIconColorsDark:this._generalIconColorsLight,clickHandler:this._handlePasswordIconClick})} `}_getFeatureTemplateByInputType(){switch(this.type){case f.SEARCH:return this._getInputSearchFeatureTemplate();case f.TEXT:return this._getInputTextFeatureTemplate();case f.PASSWORD:return this._getInputPasswordFeatureTemplate();default:return d`${z}`}}_getInputElementClasses(){const t=this.type===f.PASSWORD||this.type===f.TEXT?!!this.iconRight:!1;return{"t-input":!0,"t-textarea":this.type===f.TEXT_AREA,"with-title":!!this.title,"with-icon-right":t,[`with-${this.descriptionType}`]:this.descriptionType!==w.TEXT}}_getInputContainerClasses(){return{"t-input-container":!0,"t-textarea-container":this.type===f.TEXT_AREA}}_getMainContainerClasses(){return{"t-textarea-main-container":this.type===f.TEXT_AREA}}_setIdInput(){return fe()}_getInputTemplate(){return d`<input
-      id=${this._inputId}
-      type="text"
-      class="${E(this._getInputElementClasses())}"
-      ?disabled="${this.disabled}"
-      ?readonly="${this.readonly}"
-      .value="${this.value}"
-      .type="${this.type}"
-      placeholder="${this.placeholder||" "}"
-      maxlength="${this.maxlength}"
-      @input="${this._handleInput}"
-      @blur="${this._handleBlur}"
-    >
-    </input>
-    ${this.title?d`<label for=${this._inputId} class="t-title"
-            >${this.title}</label
-          >`:z}
-    ${this._getFeatureTemplateByInputType()}
-    `}_getLetterCounterTemplate(){return this._hasLetterCounter()?d`<div class="t-letter-counter">
-      ${this.maxlength?d`${this._letterCounter}/${this.maxlength}`:z}
-    </div> `:d`${z}`}_hasLetterCounter(){return this.type===f.TEXT_AREA&&typeof this.maxlength=="number"&&this.maxlength>=0}_getTextAreaTemplate(){return d`<textarea
-        id="${this._inputId}"
-        class="${E(this._getInputElementClasses())}"
-        ?disabled="${this.disabled}"
-        ?readonly="${this.readonly}"
-        .value="${this.value}"
-        placeholder="${this.placeholder}"
-        maxlength="${this.maxlength}"
-        @input="${this._handleInput}"
-        @blur="${this._handleBlur}"
-      ></textarea>
-      ${this.title?d`<label for=${this._inputId} class="t-title"
-            >${this.title}</label
-          >`:z} `}_getIconDescriptionTemplate(){return!this.descriptionType||this.descriptionType===w.TEXT?d`${z}`:d`<tuix-icon
-      size="${st.SMALL}"
-      name="${ce[this.descriptionType]}"
-      color="${this.dark?pe[this.descriptionType]:de[this.descriptionType]}"
-    >
-    </tuix-icon>`}_getDescriptionTemplate(){if(!this._hasValidDescriptionType())return d`<div></div>`;const e={[w.WARNING]:"Warning",[w.ERROR]:"Error",[w.SUCCESS]:"Success",[w.LOADING]:"Loading",[w.TEXT]:""};return d`<div class="t-input-description">
-      ${this._getIconDescriptionTemplate()}
-      <span
-        >${this.description??e[this.descriptionType]}</span
-      >
-    </div>`}_hasValidDescriptionType(){return Object.values(w).includes(this.descriptionType)}_getDescriptionContainerTemplate(){const t=this._hasLetterCounter(),e=this._hasValidDescriptionType()&&(this.descriptionType===w.TEXT?!!this.description:!0);return!t&&!e?d`${z}`:d`<div class="t-input-description-container">
-      ${this._getDescriptionTemplate()} ${this._getLetterCounterTemplate()}
-    </div>`}render(){return this._previousType!==this.type&&(this._previousType=this.type,this._type=this.type),this._previousValue!==this.value&&(this._previousValue=this.value,this._letterCounter=this.value.length),d`<div class="${E(this._getMainContainerClasses())}">
-      <div
-        class="${E(this._getInputContainerClasses())}"
-        @click="${this._handleClickOnInput}"
-      >
-        ${this.type===f.TEXT_AREA?this._getTextAreaTemplate():this._getInputTemplate()}
-      </div>
-      ${this._getDescriptionContainerTemplate()}
-    </div>`}updated(t){for(const[e]of t){if(this.disabled||this.readonly)break;String(e)==="autofocus"&&this.autofocus&&this._inputElement.focus()}}};x.styles=[Lt,ie,oe,re,ne,se,ae,le];T([a({type:Boolean,reflect:!0})],x.prototype,"disabled",2);T([a({type:k})],x.prototype,"iconRight",2);T([a({type:String})],x.prototype,"value",2);T([a({type:String})],x.prototype,"placeholder",2);T([a({type:String})],x.prototype,"title",2);T([a({type:f})],x.prototype,"type",2);T([a({type:Number})],x.prototype,"maxlength",2);T([a({type:String})],x.prototype,"description",2);T([a({type:w})],x.prototype,"descriptionType",2);T([a({type:Boolean,reflect:!0})],x.prototype,"dark",2);T([a({type:Boolean})],x.prototype,"readonly",2);T([a({type:Boolean,reflect:!0})],x.prototype,"autofocus",2);T([_t(".t-input-container .t-input")],x.prototype,"_inputElement",2);T([Y()],x.prototype,"_type",2);T([Y()],x.prototype,"_letterCounter",2);x=T([M("tuix-input")],x);const xe=u`
-  ${Lt}
-  :host {
-    --t-field-color-option: ${l(c.WHITE)};
-    --t-field-color-main: ${l(c.MAIN)};
-  }
-
-  :host .t-input-dropdown {
-    --t-field-font-weight: 300;
-    --t-field-font-size: 1rem;
-    --t-field-padding-x: 1rem;
-    --t-field-title-left-position: 1rem;
-  }
-
-  @media only screen and (max-width: ${g.TABLET}px) {
-    :host .t-input-dropdown {
-      --t-field-font-size: 0.938rem;
-      --t-field-line-height: 1.125rem;
-    }
-  }
-
-  @media only screen and (max-width: ${g.MOBILE}px) {
-    :host .t-input-dropdown {
-      --t-field-font-size: 0.813rem;
-      --t-field-line-height: 1rem;
-    }
-  }
-
-  :host([dark]) {
-    --t-field-color-option: ${l(h.ELEVATION_2)};
-  }
-`,ye=u`
-  .t-dropdown-full-container {
-    position: relative;
-    font-family: 'Rubik', sans-serif;
-  }
-  .t-dropdown-container .t-input-dropdown {
-    --t-field-input-cursor: pointer;
-  }
-`,_e=u`
-  .t-options-container {
-    width: 100%;
-    position: absolute;
-    top: calc(100% + 2px);
-    left: 0;
-    border: none;
-    border-radius: 0 0 5px 5px;
-    background-color: var(--t-field-color-option);
-    visibility: collapse;
-    overflow-y: auto;
-    max-height: 250px;
-    color: var(--t-field-color-text);
-    box-shadow: 0px 2px 8px 0px ${l(c.SHADOW)};
-    z-index: 9999;
-  }
-  .t-options-container::-webkit-scrollbar {
-    width: 0.75rem;
-  }
-  .t-options-container::-webkit-scrollbar-track {
-    background-color: transparent;
-  }
-  .t-options-container::-webkit-scrollbar-thumb {
-    background-color: ${l(c.PRIMARY_100)};
-    border-radius: 0.25rem;
-    border: 0.188rem solid transparent;
-    background-clip: content-box;
-  }
-  .t-options-container.show {
-    visibility: visible;
-  }
-  .t-options-container.show.t-with-description {
-    top: calc(100% + 2px - 1.5rem);
-  }
-  @media only screen and (max-height: 500px) {
-    .t-options-container {
-      max-height: 50vh;
-    }
-  }
-  .t-dropdown-option {
-    padding: var(--t-field-padding-y) 1rem;
-    cursor: pointer;
-    font-size: 1rem;
-    line-height: 1.25rem;
-    font-weight: 300;
-    -webkit-user-select: none;
-    -moz-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
-  }
-  .t-dropdown-option.t-option-hover {
-    background-color: var(--t-field-color-form);
-  }
-  .t-dropdown-option.t-option-selected {
-    color: var(--t-field-color-main);
-  }
-  .t-dropdown-option.t-option-filtered {
-    display: none;
-  }
-  .t-dropdown-option:focus {
-    outline: none;
-  }
-  @media only screen and (max-width: ${g.TABLET}px) {
-    .t-dropdown-option {
-      font-size: 0.938rem;
-      line-height: 1.125rem;
-      --t-field-padding-y: 1.063rem;
-      --t-field-padding-top: 1.5rem;
-    }
-  }
-  @media only screen and (max-width: ${g.MOBILE}px) {
-    .t-dropdown-option {
-      font-size: 0.813rem;
-      line-height: 1rem;
-      --t-field-padding-y: 1rem;
-      --t-field-padding-top: 1.375rem;
-    }
-  }
-`;var L=(t=>(t.SINGLE="single",t.SEARCH="search",t))(L||{}),$e=Object.defineProperty,we=Object.getOwnPropertyDescriptor,C=(t,e,o,n)=>{for(var i=n>1?void 0:n?we(e,o):e,r=t.length-1,s;r>=0;r--)(s=t[r])&&(i=(n?s(e,o,i):s(i))||i);return n&&i&&$e(e,o,i),i};let y=class extends H{constructor(){super(...arguments),this.value=void 0,this.options=[],this.placeholder="",this.title="",this.disabled=!1,this.dark=!1,this.descriptionType=w.TEXT,this.type=L.SINGLE,this._value="",this._isOptionsVisible=!1,this._searchingOption=!1,this._extendedOptions=[],this._previousSelectedOption=null,this._previousFocusedOption=null,this._handleClickOutside=t=>{t.composedPath().includes(this)||(this._isOptionsVisible=!1)}}connectedCallback(){super.connectedCallback(),window.addEventListener("click",this._handleClickOutside),this.addEventListener("blur",this._handleBlur.bind(this))}disconnectedCallback(){window.removeEventListener("click",this._handleClickOutside),super.disconnectedCallback()}_onEnterPress(t){t.key==="Enter"&&this._toggleOptions()}_onKeyDownOption(t){switch(t.key){case"ArrowDown":return this._handleArrowDown();case"ArrowUp":return this._handleArrowUp();case"Escape":this._isOptionsVisible=!1;break}}_onKeyPressOption(t){t.key==="Enter"&&this._onClickOption(t)}_onMouseOverOption(t){const e=t.target;this._focusTargetOption(e)}_onClickOption(t){const e=t.target;this._value=e.innerText,this._isOptionsVisible=!1,this._unselectPreviousOption(),e.classList.add("t-option-selected"),this._previousSelectedOption=e,this._handleSelectEvent(t)}_onInputSingle(t){this._handleInputBase(t,"input-single")}_handleSelectEvent(t){const e=t.target.getAttribute("data-value"),o=this.options[Number(e)];this.dispatchEvent(new CustomEvent("select",{detail:{value:this._getOptionValue(o)},bubbles:!0})),this.type===L.SEARCH&&(this._extendOptionsList(this._getOptionName(o)),this._searchingOption=!1)}_handleBlur(){if(this.type===L.SEARCH&&this._searchingOption){const t=this._previousSelectedOption?.getAttribute("data-value"),e=typeof t=="string"?this.options[Number(t)]:"";this._value=this._getOptionName(e),this._extendOptionsList()}}_getOptionName(t){return String(typeof t=="object"?t?.name:t)}_getOptionValue(t){return typeof t=="object"?t.value:t}_findIndex(t){return this._extendedOptions.findIndex(e=>e.value===this._getOptionValue(t))}_handleInputBase(t,e){this._searchingOption||(this._searchingOption=!0),this._extendOptionsList(t.detail.value),this._isOptionsVisible=!0,this.dispatchEvent(new CustomEvent(e,{detail:{value:t.detail.value},bubbles:!0})),this._value=t.detail.value}_extendOptionsList(t=""){t=t.trim(),this._extendedOptions=this.options.map(e=>{const o=this._getOptionName(e);return{name:o,value:this._getOptionValue(e),filtered:this.type===L.SEARCH&&t!==""&&!o.toLowerCase().includes(t.toLowerCase())}})}_handleArrowDown(){const t=this._previousFocusedOption?.nextElementSibling;t&&this._focusTargetOption(t)}_handleArrowUp(){const t=this._previousFocusedOption?.previousElementSibling;t&&this._focusTargetOption(t)}_focusTargetOption(t,e=!0){this._previousFocusedOption?.classList?.remove("t-option-hover"),t?.classList.add("t-option-hover"),e&&t?.focus(),this._previousFocusedOption=t}_toggleOptions(){this.disabled||(this._isOptionsVisible=!this._isOptionsVisible,this._isOptionsVisible&&this.type===L.SEARCH&&this._previousSelectedOption&&(this._optionsContainer?.scrollTo({top:this._previousSelectedOption.offsetTop,behavior:"auto"}),this._inputDropdown?.shadowRoot?.querySelector("input")?.select()))}_focusOptionsContainer(){if(this.type===L.SEARCH){this._previousSelectedOption&&this._focusTargetOption(this._previousSelectedOption,!1);return}if(!this._isOptionsVisible||!this._optionsContainer){this._inputDropdown?.shadowRoot?.querySelector("input")?.focus();return}if(this._previousSelectedOption)this._focusTargetOption(this._previousSelectedOption);else{const t=this._optionsContainer.firstElementChild;t&&this._focusTargetOption(t)}}_unselectPreviousOption(){this._previousSelectedOption&&(this._previousSelectedOption.classList?.remove("t-option-selected"),this._previousSelectedOption=null)}_hasCompleteDescription(){return Object.values(w).includes(this.descriptionType)&&(this.descriptionType===w.TEXT?!!this.description:!0)}_getOptionsContainerClasses(){return{"t-options-container":!0,show:this._isOptionsVisible,"t-with-description":this._hasCompleteDescription()}}_triggerUpdateByExternalValueChange(){if(this._unselectPreviousOption(),!this.value){this._value="",this._extendOptionsList();return}const t=this._findIndex(this.value);if(this.type===L.SEARCH&&this._extendOptionsList(""),t<0){this._value="";return}const e=this._optionsContainer?.children[t];e?.classList.add("t-option-selected"),this._previousSelectedOption=e||null,this._value=e?this._getOptionName(this.options[t]):""}_resetPreviousSelection(){this._value="",this._unselectPreviousOption()}_getOptionsTemplate(){return(this.type===L.SINGLE||this._searchingOption===!1)&&this._extendOptionsList(),this._extendedOptions?.map((t,e)=>d`<div
-        class="${E({"t-dropdown-option":!0,"t-option-filtered":t.filtered})}"
-        @click="${this._onClickOption}"
-        data-value="${e}"
-        tabindex="0"
-        @keydown="${this._onKeyDownOption}"
-        @keypress="${this._onKeyPressOption}"
-        @mouseover="${this._onMouseOverOption}"
-      >
-        ${t.name}
-      </div>`)}updated(t){t.has("_isOptionsVisible")?this._focusOptionsContainer():t.has("value")&&this._triggerUpdateByExternalValueChange()}willUpdate(t){t.has("options")&&this._resetPreviousSelection()}firstUpdated(t){super.firstUpdated(t),this._triggerUpdateByExternalValueChange()}render(){return d`<div class="t-dropdown-full-container">
-      <div class="t-dropdown-container">
-        <tuix-input
-          .value="${this._value}"
-          class="t-input-dropdown"
-          iconRight="${this._isOptionsVisible?k.CHEVRON_UP:k.CHEVRON_DOWN}"
-          placeholder="${this.placeholder}"
-          title="${this.title}"
-          .description="${this.description}"
-          descriptionType="${this.descriptionType}"
-          ?disabled="${this.disabled}"
-          ?dark="${this.dark}"
-          ?readonly="${this.type!==L.SEARCH}"
-          @on-click="${this._toggleOptions}"
-          @keypress="${this._onEnterPress}"
-          @on-change="${this._onInputSingle}"
-        >
-        </tuix-input>
-      </div>
-      <div class="${E(this._getOptionsContainerClasses())}">
-        ${this._getOptionsTemplate()}
-      </div>
-    </div>`}};y.styles=[xe,ye,_e];C([a({type:Object})],y.prototype,"value",2);C([a({type:Array})],y.prototype,"options",2);C([a({type:String})],y.prototype,"placeholder",2);C([a({type:String})],y.prototype,"title",2);C([a({type:Boolean,reflect:!0})],y.prototype,"disabled",2);C([a({type:Boolean,reflect:!0})],y.prototype,"dark",2);C([a({type:String})],y.prototype,"description",2);C([a({type:w})],y.prototype,"descriptionType",2);C([a({type:String})],y.prototype,"type",2);C([Y()],y.prototype,"_value",2);C([Y()],y.prototype,"_isOptionsVisible",2);C([Y()],y.prototype,"_searchingOption",2);C([Y()],y.prototype,"_extendedOptions",2);C([_t(".t-options-container")],y.prototype,"_optionsContainer",2);C([_t(".t-dropdown-container .t-input-dropdown")],y.prototype,"_inputDropdown",2);y=C([M("tuix-dropdown")],y);const $t=u`
-  :host {
-    --t-main-color-tuix: ${l(c.MAIN)};
-    --t-bg-color-primary: ${l(c.WHITE)};
-    --t-bg-color-disabled: ${l(c.PRIMARY_100)};
-    --t-text-color-error: ${l(c.ERROR)};
-    --t-stroke-color-focus: ${l(c.SECONDARY)};
-    --t-stroke-color-grey: ${l(c.PRIMARY_300)};
-    --t-text-color-label: ${l(c.BLACK)};
-    --t-label-right-default-justify: flex-start;
-    --t-label-left-default-justify: space-between;
-  }
-  :host([dark]) {
-    --t-main-color-tuix: ${l(h.MAIN)};
-    --t-bg-color-primary: ${l(h.BLACK)};
-    --t-bg-color-disabled: ${l(h.PRIMARY_800)};
-    --t-text-color-error: ${l(h.ERROR)};
-    --t-stroke-color-focus: ${l(h.SECONDARY)};
-    --t-stroke-color-grey: ${l(h.PRIMARY_100)};
-    --t-text-color-label: ${l(h.WHITE)};
-  }
-`,ke=u`
-  .t-checkbox-full-container {
-    display: flex;
-    justify-content: var(--t-label-right-default-justify, flex-start);
-    cursor: pointer;
-    -webkit-user-select: none;
-    -moz-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
-  }
-  :host([disabled]) .t-checkbox-full-container {
-    cursor: not-allowed;
-  }
-  .t-checkbox-container {
-    --t-checkbox-size-box: 1.5rem;
-    --t-checkbox-shadow-width: 2px;
-    --t-checkbox-border-radius: 0.25rem;
-    display: block;
-    position: relative;
-    height: var(--t-checkbox-size-box);
-    width: var(--t-checkbox-size-box);
-    min-width: var(--t-checkbox-size-box);
-  }
-  .t-checkbox-container .t-checkbox {
-    position: absolute;
-    opacity: 0;
-    height: 0;
-    width: 0;
-  }
-  @media only screen and (max-width: ${g.MOBILE}px) {
-    .t-checkbox-container {
-      --t-checkbox-size-box: 1rem;
-      --t-checkbox-shadow-width: 1px;
-      --t-checkbox-border-radius: 0.125rem;
-      margin-top: 1px;
-    }
-  }
-`,Te=u`
-  .t-checkbox-container .t-checkbox-checkmark {
-    position: absolute;
-    top: 0;
-    left: 0;
-    display: flex;
-    height: var(--t-checkbox-size-box);
-    width: var(--t-checkbox-size-box);
-    border-radius: var(--t-checkbox-border-radius);
-    background-color: var(--t-bg-color-primary);
-    border: 1px solid var(--t-stroke-color-grey);
-    box-sizing: border-box;
-  }
-  .t-checkbox-container .t-checkbox-checkmark tuix-icon {
-    margin: auto;
-    display: none;
-    width: calc(var(--t-checkbox-size-box) - 0.5rem);
-    height: calc(var(--t-checkbox-size-box) - 0.5rem);
-  }
-  .t-checkbox-container .t-checkbox:checked ~ .t-checkbox-checkmark {
-    background-color: var(--t-main-color-tuix);
-    border: none;
-  }
-  .t-checkbox-container .t-checkbox:focus ~ .t-checkbox-checkmark {
-    box-shadow: 0 0 0px var(--t-checkbox-shadow-width)
-      var(--t-stroke-color-focus);
-    border: 1px solid var(--t-main-color-tuix);
-  }
-  .t-checkbox-container .t-checkbox:checked ~ .t-checkbox-checkmark tuix-icon {
-    display: block;
-  }
-  .t-checkbox-full-container:hover .t-checkbox-container .t-checkbox-checkmark {
-    border: 1px solid var(--t-main-color-tuix);
-  }
-  .t-checkbox-full-container.t-with-error
-    .t-checkbox-container
-    .t-checkbox-checkmark {
-    border: 1px solid var(--t-text-color-error);
-  }
-  .t-checkbox-full-container.t-with-error
-    .t-checkbox-container
-    .t-checkbox:checked
-    ~ .t-checkbox-checkmark {
-    background-color: var(--t-text-color-error);
-    border: none;
-  }
-
-  .t-checkbox-container .t-checkbox:disabled ~ .t-checkbox-checkmark {
-    background-color: var(--t-bg-color-disabled);
-    border: none;
-    box-shadow: none;
-  }
-`,Ce=u`
-  .t-checkbox-label {
-    display: block;
-    color: var(--t-text-color-label);
-    margin-left: 0.625rem;
-  }
-  .t-checkbox-full-container.t-with-label-left {
-    flex-direction: row-reverse;
-    justify-content: var(--t-label-left-default-justify, space-between);
-  }
-  .t-checkbox-full-container.t-with-label-left .t-checkbox-label {
-    margin-right: 0.625rem;
-    margin-left: 0;
-  }
-`;var ct=(t=>(t.DEFAULT="default",t.DISABLED="disabled",t.ERROR="error",t))(ct||{}),G=(t=>(t.LEFT="left",t.RIGHT="right",t))(G||{});const Ie={default:c.WHITE,disabled:c.PRIMARY_300,error:c.WHITE},Se={default:h.WHITE,disabled:h.PRIMARY_100,error:h.WHITE};var Ee=Object.defineProperty,Oe=Object.getOwnPropertyDescriptor,q=(t,e,o,n)=>{for(var i=n>1?void 0:n?Oe(e,o):e,r=t.length-1,s;r>=0;r--)(s=t[r])&&(i=(n?s(e,o,i):s(i))||i);return n&&i&&Ee(e,o,i),i};let V=class extends H{constructor(){super(...arguments),this.checked=!1,this.disabled=!1,this.dark=!1,this.error=!1,this.label="",this.labelSide=G.RIGHT}_onCheckboxChange(t){this.dispatchEvent(new CustomEvent("change",{detail:{value:t.target.checked,label:this.label},bubbles:!0}))}_getIconMode(){return this.disabled?ct.DISABLED:this.error?ct.ERROR:ct.DEFAULT}_getFullContainerClasses(){return{"t-checkbox-full-container":!0,"t-with-error":this.error&&!this.disabled,"t-with-label-left":this.labelSide===G.LEFT}}render(){return d`<label class="${E(this._getFullContainerClasses())}">
-      <div class="t-checkbox-container">
-        <input
-          type="checkbox"
-          class="t-checkbox"
-          .checked="${this.checked}"
-          ?disabled="${this.disabled}"
-          @change="${this._onCheckboxChange}"
-        />
-        <div class="t-checkbox-checkmark">
-          <tuix-icon
-            size="${st.FULL}"
-            name="${k.CHECK}"
-            color="${this.dark?Se[this._getIconMode()]:Ie[this._getIconMode()]}"
-          >
-          </tuix-icon>
-        </div>
-      </div>
-      <div class="t-checkbox-label">
-        <slot>
-          <tuix-text
-            size="${p.Field1}"
-            color="${N.PRIMARY}"
-            ?dark="${this.dark}"
-          >
-            ${this.label}
-          </tuix-text>
-        </slot>
-      </div>
-    </label>`}};V.styles=[$t,ke,Te,Ce];q([a({type:Boolean})],V.prototype,"checked",2);q([a({type:Boolean,reflect:!0})],V.prototype,"disabled",2);q([a({type:Boolean,reflect:!0})],V.prototype,"dark",2);q([a({type:Boolean,reflect:!0})],V.prototype,"error",2);q([a({type:String})],V.prototype,"label",2);q([a({type:String})],V.prototype,"labelSide",2);V=q([M("tuix-checkbox")],V);const Re=u`
-  ${$t}
-  :host {
-    --t-margin-between-radio-buttons: 1rem;
-    --t-radio-button-inner-color-disabled: ${l(c.PRIMARY_300)};
-  }
-`,Ae=u`
-  .t-radio-button-full-container {
-    display: flex;
-    justify-content: var(--t-label-right-default-justify, flex-start);
-    cursor: pointer;
-    -webkit-user-select: none;
-    -moz-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
-  }
-  :host([disabled]) .t-radio-button-full-container {
-    cursor: not-allowed;
-  }
-  .t-radio-button-container {
-    --t-radio-button-size-box: 1.5rem;
-    --t-radio-button-shadow-width: 2px;
-    display: block;
-    position: relative;
-    height: var(--t-radio-button-size-box);
-    width: var(--t-radio-button-size-box);
-    min-width: var(--t-radio-button-size-box);
-  }
-  .t-radio-button-container .t-radio-button {
-    position: absolute;
-    opacity: 0;
-    height: 0;
-    width: 0;
-  }
-  @media only screen and (max-width: ${g.MOBILE}px) {
-    .t-radio-button-container {
-      --t-radio-button-size-box: 1rem;
-      --t-radio-button-shadow-width: 1px;
-      margin-top: 1px;
-    }
-  }
-`,Pe=u`
-  .t-radio-button-full-container.t-multiple-options {
-    margin-bottom: var(--t-margin-between-radio-buttons);
-  }
-  .t-radio-button-container .t-radio-button-checkmark {
-    position: absolute;
-    top: 0;
-    left: 0;
-    display: flex;
-    height: var(--t-radio-button-size-box);
-    width: var(--t-radio-button-size-box);
-    background-color: var(--t-bg-color-primary);
-    border: 1px solid var(--t-stroke-color-grey);
-    box-sizing: border-box;
-    border-radius: 50%;
-  }
-  .t-radio-button-container
-    .t-radio-button:checked
-    ~ .t-radio-button-checkmark {
-    border: 1px solid var(--t-main-color-tuix);
-  }
-  .t-radio-button-container .t-radio-button:focus ~ .t-radio-button-checkmark {
-    box-shadow: 0 0 0px var(--t-radio-button-shadow-width)
-      var(--t-stroke-color-focus);
-  }
-  .t-radio-button-full-container:hover
-    .t-radio-button-container
-    .t-radio-button-checkmark {
-    border: 1px solid var(--t-main-color-tuix);
-  }
-  .t-radio-button-full-container.t-with-error
-    .t-radio-button-container
-    .t-radio-button-checkmark {
-    border: 1px solid var(--t-text-color-error);
-  }
-
-  .t-radio-button-container
-    .t-radio-button:disabled
-    ~ .t-radio-button-checkmark {
-    background-color: var(--t-bg-color-disabled);
-    border: none;
-    box-shadow: none;
-  }
-`,Le=u`
-  .t-radio-button-container .t-radio-button-checkmark .t-radio-button-inner {
-    background-color: var(--t-main-color-tuix);
-    margin: auto;
-    height: calc(var(--t-radio-button-size-box) / 2 - 2px);
-    width: calc(var(--t-radio-button-size-box) / 2 - 2px);
-    border-radius: 50%;
-    display: none;
-  }
-  .t-radio-button-container
-    .t-radio-button:checked
-    ~ .t-radio-button-checkmark
-    .t-radio-button-inner {
-    display: block;
-  }
-  :host([error])
-    .t-radio-button-container
-    .t-radio-button-checkmark
-    .t-radio-button-inner {
-    background-color: var(--t-text-color-error);
-  }
-  :host([disabled])
-    .t-radio-button-container
-    .t-radio-button-checkmark
-    .t-radio-button-inner {
-    background-color: var(--t-radio-button-inner-color-disabled);
-    cursor: not-allowed;
-  }
-`,ze=u`
-  .t-radio-button-label {
-    display: block;
-    color: var(--t-text-color-label);
-    margin-left: 0.625rem;
-  }
-  .t-radio-button-full-container.t-with-label-left {
-    flex-direction: row-reverse;
-    justify-content: var(--t-label-left-default-justify, space-between);
-  }
-  .t-radio-button-full-container.t-with-label-left .t-radio-button-label {
-    margin-right: 0.625rem;
-    margin-left: 0;
-  }
-`;var Me=Object.defineProperty,De=Object.getOwnPropertyDescriptor,J=(t,e,o,n)=>{for(var i=n>1?void 0:n?De(e,o):e,r=t.length-1,s;r>=0;r--)(s=t[r])&&(i=(n?s(e,o,i):s(i))||i);return n&&i&&Me(e,o,i),i};let j=class extends H{constructor(){super(...arguments),this.disabled=!1,this.dark=!1,this.error=!1,this.options=[],this.labelSide=G.RIGHT,this.selectedOption=null}_onRadioButtonChange(t){this.dispatchEvent(new CustomEvent("change",{detail:{value:t.target.value},bubbles:!0}))}_getFullContainerClasses(){return{"t-radio-button-full-container":!0,"t-with-error":this.error&&!this.disabled,"t-with-label-left":this.labelSide===G.LEFT,"t-multiple-options":this.options.length>1}}_formatTemplate(t,e){return d`<label class="${E(this._getFullContainerClasses())}">
-      <div class="t-radio-button-container">
-        <input
-          type="radio"
-          class="t-radio-button"
-          ?disabled="${this.disabled}"
-          .value="${t}"
-          name="tuix-radio-button"
-          ?checked="${this.selectedOption===t}"
-          @change="${this._onRadioButtonChange}"
-        />
-        <div class="t-radio-button-checkmark">
-          <div class="t-radio-button-inner"></div>
-        </div>
-      </div>
-      <div class="t-radio-button-label">
-        <slot name="label-${e}">
-          <tuix-text
-            size="${p.Field1}"
-            color="${N.PRIMARY}"
-            ?dark="${this.dark}"
-          >
-            ${t}
-          </tuix-text>
-        </slot>
-      </div>
-    </label>`}render(){return d`${this.options.map((t,e)=>this._formatTemplate(t,e))}`}};j.styles=[Re,Ae,Pe,Le,ze];J([a({type:Boolean,reflect:!0})],j.prototype,"disabled",2);J([a({type:Boolean,reflect:!0})],j.prototype,"dark",2);J([a({type:Boolean,reflect:!0})],j.prototype,"error",2);J([a({type:Array})],j.prototype,"options",2);J([a({type:String})],j.prototype,"labelSide",2);J([a({type:String})],j.prototype,"selectedOption",2);j=J([M("tuix-radio-button")],j);const Be=u`
-  ${$t}
-  :host {
-    --t-bg-color-primary: ${l(c.PRIMARY_300)};
-    --t-bg-color-disabled: ${l(c.PRIMARY_100)};
-    --t-toggle-shadow-color-focus: rgba(142, 141, 208, 0.16);
-  }
-  :host([dark]) {
-    --t-bg-color-primary: ${l(h.PRIMARY_800)};
-    --t-bg-color-disabled: ${l(h.PRIMARY_800)};
-    --t-bg-color-inner: ${l(h.WHITE)};
-  }
-  :host([dark][disabled]) {
-    --t-bg-color-inner: ${l(h.MAIN)};
-  }
-`,Ne=u`
-  .t-toggle-button-full-container {
-    display: flex;
-    justify-content: var(--t-label-right-default-justify, flex-start);
-    cursor: pointer;
-    -webkit-user-select: none;
-    -moz-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
-  }
-  :host([disabled]) .t-toggle-button-full-container {
-    cursor: not-allowed;
-  }
-  .t-toggle-button-container {
-    --t-toggle-button-size-box: 3rem;
-    --t-toggle-button-shadow-width: 2px;
-    --t-toggle-inner-radio: 1rem;
-    display: block;
-    position: relative;
-    height: calc(var(--t-toggle-button-size-box) / 2);
-    width: var(--t-toggle-button-size-box);
-    min-width: var(--t-toggle-button-size-box);
-  }
-  .t-toggle-button-container .t-toggle-button {
-    position: absolute;
-    opacity: 0;
-    height: 0;
-    width: 0;
-  }
-  .t-radio-button-full-container:not(.t-with-label-left) {
-    justify-content: flex-start;
-  }
-  @media only screen and (max-width: ${g.MOBILE}px) {
-    .t-toggle-button-container {
-      --t-toggle-button-size-box: 2rem;
-      --t-toggle-button-shadow-width: 1px;
-      --t-toggle-inner-radio: 0.75rem;
-      margin-top: 1px;
-    }
-  }
-`,Ve=u`
-  .t-toggle-button-container .t-toggle-button-checkmark {
-    position: absolute;
-    top: 0;
-    left: 0;
-    display: flex;
-    height: calc(var(--t-toggle-button-size-box) / 2);
-    width: var(--t-toggle-button-size-box);
-    border-radius: 0.75rem;
-    background-color: var(--t-bg-color-primary);
-    box-sizing: border-box;
-  }
-  .t-toggle-button-container
-    .t-toggle-button:checked
-    ~ .t-toggle-button-checkmark {
-    background-color: var(--t-main-color-tuix);
-  }
-  .t-toggle-button-full-container:hover
-    .t-toggle-button-container
-    .t-toggle-button-checkmark {
-    box-shadow: 0px 4px 4px 0px var(--t-toggle-shadow-color-focus);
-  }
-  .t-toggle-button-container
-    .t-toggle-button:focus
-    ~ .t-toggle-button-checkmark {
-    box-shadow: 0 0 0px var(--t-toggle-button-shadow-width)
-      var(--t-stroke-color-focus);
-  }
-  .t-toggle-button-container
-    .t-toggle-button:disabled
-    ~ .t-toggle-button-checkmark {
-    background-color: var(--t-bg-color-disabled);
-    box-shadow: none;
-  }
-`,je=u`
-  .t-toggle-button-container .t-toggle-button-checkmark .t-toggle-button-inner {
-    background-color: var(--t-bg-color-inner, ${l(c.WHITE)});
-    margin: auto auto auto calc(var(--t-toggle-button-shadow-width) * 2);
-    height: var(--t-toggle-inner-radio);
-    width: var(--t-toggle-inner-radio);
-    border-radius: 50%;
-    display: block;
-    transition: 0.3s;
-  }
-  .t-toggle-button-container
-    .t-toggle-button:checked
-    ~ .t-toggle-button-checkmark
-    .t-toggle-button-inner {
-    transform: translateX(
-      calc(
-        var(--t-toggle-button-size-box) - var(--t-toggle-inner-radio) -
-          var(--t-toggle-button-shadow-width) * 4
-      )
-    );
-  }
-`,He=u`
-  .t-toggle-button-label {
-    display: block;
-    color: var(--t-text-color-label);
-    margin-left: 0.625rem;
-  }
-  .t-toggle-button-full-container.t-with-label-left {
-    flex-direction: row-reverse;
-    justify-content: var(--t-label-left-default-justify, space-between);
-  }
-  .t-toggle-button-full-container.t-with-label-left .t-toggle-button-label {
-    margin-right: 0.625rem;
-    margin-left: 0;
-  }
-`;var Ye=Object.defineProperty,Fe=Object.getOwnPropertyDescriptor,rt=(t,e,o,n)=>{for(var i=n>1?void 0:n?Fe(e,o):e,r=t.length-1,s;r>=0;r--)(s=t[r])&&(i=(n?s(e,o,i):s(i))||i);return n&&i&&Ye(e,o,i),i};let X=class extends H{constructor(){super(...arguments),this.checked=!1,this.disabled=!1,this.dark=!1,this.label="",this.labelSide=G.RIGHT}_onToggleButtonChange(t){this.dispatchEvent(new CustomEvent("change",{detail:{value:t.target.checked,label:this.label},bubbles:!0}))}_getFullContainerClasses(){return{"t-toggle-button-full-container":!0,"t-with-label-left":this.labelSide===G.LEFT}}render(){return d`<label class="${E(this._getFullContainerClasses())}">
-      <div class="t-toggle-button-container">
-        <input
-          type="checkbox"
-          class="t-toggle-button"
-          .checked="${this.checked}"
-          ?disabled="${this.disabled}"
-          @change="${this._onToggleButtonChange}"
-        />
-        <div class="t-toggle-button-checkmark">
-          <div class="t-toggle-button-inner"></div>
-        </div>
-      </div>
-      <div class="t-toggle-button-label">
-        <slot>
-          <tuix-text
-            size="${p.Field1}"
-            color="${N.PRIMARY}"
-            ?dark="${this.dark}"
-          >
-            ${this.label}
-          </tuix-text>
-        </slot>
-      </div>
-    </label>`}};X.styles=[Be,Ne,Ve,je,He];rt([a({type:Boolean})],X.prototype,"checked",2);rt([a({type:Boolean,reflect:!0})],X.prototype,"disabled",2);rt([a({type:Boolean,reflect:!0})],X.prototype,"dark",2);rt([a({type:String})],X.prototype,"label",2);rt([a({type:String})],X.prototype,"labelSide",2);X=rt([M("tuix-toggle-button")],X);/**
- * @license
- * Copyright 2017 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */const Ct=(t,e,o)=>{const n=new Map;for(let i=e;i<=o;i++)n.set(t[i],i);return n},Ue=St(class extends Et{constructor(t){if(super(t),t.type!==Ot.CHILD)throw Error("repeat() can only be used in text expressions")}ct(t,e,o){let n;o===void 0?o=e:e!==void 0&&(n=e);const i=[],r=[];let s=0;for(const O of t)i[s]=n?n(O,s):s,r[s]=o(O,s),s++;return{values:r,keys:i}}render(t,e,o){return this.ct(t,e,o).values}update(t,[e,o,n]){var i;const r=zt(t),{values:s,keys:O}=this.ct(e,o,n);if(!Array.isArray(r))return this.ut=O,s;const W=(i=this.ut)!==null&&i!==void 0?i:this.ut=[],P=[];let at,wt,m=0,I=r.length-1,v=0,R=s.length-1;for(;m<=I&&v<=R;)if(r[m]===null)m++;else if(r[I]===null)I--;else if(W[m]===O[v])P[v]=K(r[m],s[v]),m++,v++;else if(W[I]===O[R])P[R]=K(r[I],s[R]),I--,R--;else if(W[m]===O[R])P[R]=K(r[m],s[R]),nt(t,P[R+1],r[m]),m++,R--;else if(W[I]===O[v])P[v]=K(r[I],s[v]),nt(t,r[m],r[I]),I--,v++;else if(at===void 0&&(at=Ct(O,v,R),wt=Ct(W,m,I)),at.has(W[m]))if(at.has(W[I])){const D=wt.get(O[v]),gt=D!==void 0?r[D]:null;if(gt===null){const kt=nt(t,r[m]);K(kt,s[v]),P[v]=kt}else P[v]=K(gt,s[v]),nt(t,r[m],gt),r[D]=null;v++}else ft(r[I]),I--;else ft(r[m]),m++;for(;v<=R;){const D=nt(t,P[R+1]);K(D,s[v]),P[v++]=D}for(;m<=I;){const D=r[m++];D!==null&&ft(D)}return this.ut=O,Mt(t,P),It}}),Xe=u`
-  :host {
-    display: block;
-    width: 100%;
-  }
-
-  .table_wrapper {
-    width: 100%;
-    overflow-x: auto;
-  }
-
-  table {
-    min-width: 650px;
-    table-layout: fixed;
-    width: 100%;
-    border-collapse: collapse;
-  }
-
-  thead th {
-    box-sizing: border-box;
-    padding: 8px;
-    text-align: left;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-  }
-
-  tbody tr td {
-    box-sizing: border-box;
-    height: 52px;
-    padding: 6px 8px;
-    text-align: left;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-  }
-
-  ::slotted(*) {
-    display: inline-flex;
-    align-items: center;
-    margin-right: 8px;
-    gap: 10px;
-  }
-
-  .dropdown_container {
-    position: relative;
-    border-radius: 4px;
-  }
-
-  .dropdown_container .items-per-page-dropdown {
-    width: 55px;
-    border: none;
-    background-color: transparent;
-    padding: 8px;
-    cursor: pointer;
-    -webkit-appearance: none;
-    -moz-appearance: none;
-    appearance: none;
-  }
-
-  .dropdown_container .items-per-page-dropdown:focus-visible {
-    border: none;
-    outline: none;
-  }
-
-  .dropdown_container .arrow-icon {
-    position: absolute;
-    right: 8px;
-    bottom: 8px;
-    cursor: pointer;
-    pointer-events: none;
-  }
-
-  footer.table_footer {
-    height: 48px;
-    padding: 8px;
-    width: 100%;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    box-sizing: border-box;
-  }
-
-  footer.table_footer .items-per-page {
-    display: flex;
-    align-items: center;
-    gap: 8px;
-  }
-
-  footer.table_footer .navigation {
-    display: flex;
-    align-items: center;
-    gap: 8px;
-  }
-
-  footer.table_footer .navigation .buttons {
-    display: flex;
-    gap: 8px;
-    cursor: pointer;
-  }
-
-  .mobile_table {
-    display: none;
-  }
-
-  @media only screen and (max-width: ${g.TABLET}px) {
-    .mobile_table {
-      display: block;
-    }
-
-    footer.table_footer {
-      align-items: flex-start;
-      gap: 8px;
-    }
-
-    .mobile_table .table_row {
-      display: flex;
-      min-height: 40px;
-    }
-
-    .mobile_table .table_row > * {
-      padding: 0 16px;
-      width: 50%;
-      text-overflow: ellipsis;
-      overflow: hidden;
-      display: flex;
-      align-items: center;
-    }
-  }
-`,We=u`
-  .tuix-spinner-wrapper {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    padding: 24px 0;
-  }
-
-  .three-dots-wrapper {
-    display: inline-flex;
-    gap: calc(var(--dot-size) * 0.5);
-    align-items: center;
-    justify-content: center;
-    position: relative;
-  }
-  .three-dots-wrapper .dot {
-    width: var(--dot-size);
-    height: var(--dot-size);
-    background: var(--dot-color);
-    border-radius: 50%;
-    display: inline-block;
-    animation: threeDots 0.9s infinite ease-in-out both;
-  }
-  .three-dots-wrapper .dot:nth-child(2) {
-    animation-delay: 0.15s;
-  }
-  .three-dots-wrapper .dot:nth-child(3) {
-    animation-delay: 0.3s;
-  }
-
-  @keyframes threeDots {
-    0%,
-    80%,
-    100% {
-      transform: scale(0.6);
-      opacity: 0.6;
-    }
-    40% {
-      transform: scale(1);
-      opacity: 1;
-    }
-  }
-
-  .sr-only {
-    border: 0;
-    clip: rect(1px, 1px, 1px, 1px);
-    -webkit-clip-path: inset(50%);
-    clip-path: inset(50%);
-    height: 1px;
-    margin: -1px;
-    overflow: hidden;
-    padding: 0;
-    position: absolute;
-    width: 1px;
-    white-space: nowrap;
-  }
-
-  .clientsLoader,
-  .mobileClientsLoader,
-  .tabletClientsLoader {
-    display: flex;
-    justify-content: center;
-    padding: 16px 0;
-  }
-`;var Ke=Object.defineProperty,Ge=Object.getOwnPropertyDescriptor,S=(t,e,o,n)=>{for(var i=n>1?void 0:n?Ge(e,o):e,r=t.length-1,s;r>=0;r--)(s=t[r])&&(i=(n?s(e,o,i):s(i))||i);return n&&i&&Ke(e,o,i),i};let $=class extends H{constructor(){super(...arguments),this.paginated=!1,this.disableMobileTable=!1,this.showMobileTableInTablet=!1,this.data=[],this.headers=[],this.pageSizeOptions=[5,10,20],this.isLoadingData=!1,this._isTabletView=!1,this._isMobileView=!1,this._headerPercents=[],this._onScreenSizeChange=()=>{this._isTabletView=!!this._mqTablet?.matches,this._isMobileView=!!this._mqMobile?.matches},this._nextPage=()=>{if(this.currentPage===this.totalPages)return;const e={page:Math.min(this.totalPages,this._effectiveCurrentPage+1),pageSize:this._effectivePageSize};this.dispatchEvent(new CustomEvent("next-page",{detail:e,bubbles:!0,composed:!0}))},this._prevPage=()=>{if(this.currentPage===1)return;const e={page:Math.max(1,this._effectiveCurrentPage-1),pageSize:this._effectivePageSize};this.dispatchEvent(new CustomEvent("previous-page",{detail:e,bubbles:!0,composed:!0}))},this._setPageSize=t=>{const n={page:1,pageSize:Math.max(1,Math.floor(t))};this.dispatchEvent(new CustomEvent("page-size-change",{detail:n,bubbles:!0,composed:!0}))}}connectedCallback(){super.connectedCallback(),this._mqTablet=window.matchMedia(`(max-width:${g.TABLET}px)`),this._mqMobile=window.matchMedia(`(max-width:${g.MOBILE}px)`),this._onScreenSizeChange(),this._mqTablet.addEventListener("change",this._onScreenSizeChange),this._mqMobile.addEventListener("change",this._onScreenSizeChange),this._computeHeaderPercents()}disconnectedCallback(){super.disconnectedCallback(),this._mqTablet?.removeEventListener("change",this._onScreenSizeChange),this._mqMobile?.removeEventListener("change",this._onScreenSizeChange)}updated(t){t.has("headers")&&this._computeHeaderPercents()}get _effectiveTotalItems(){return this.totalItems??this.data.length}get _effectiveCurrentPage(){return this.currentPage??1}get _effectivePageSize(){return this.currentSize??this.pageSizeOptions[0]}get totalPages(){const t=this._effectivePageSize;return Math.max(1,Math.ceil(this._effectiveTotalItems/t))}get _paginationProps(){const t=this._effectiveTotalItems,e=this._effectivePageSize,o=t?(this._effectiveCurrentPage-1)*e+1:0,n=Math.min(this._effectiveCurrentPage*e,t);return{totalItems:t,currentPage:this._effectiveCurrentPage,itemsPerPage:e,startItem:o,endItem:n,onNextPage:this._nextPage,onPreviousPage:this._prevPage,onItemsPerPageChange:this._setPageSize,isLoading:this.isLoadingData}}_computeHeaderPercents(){const t=this.headers.reduce((e,o)=>e+o.width,0);this._headerPercents=t===0?this.headers.map(()=>100/this.headers.length):this.headers.map(e=>e.width/t*100)}_cellStyleString(){return`border-bottom:1px solid ${c.NEUTRAL_200};`}_textVariantColor(t,e){return t.cellColor?t.cellColor(e):N.PRIMARY}_renderHeaderCells(){return d`<tr>
-      ${this.headers.map((t,e)=>d`<th
-          style=${dt({width:`${this._headerPercents[e]}%`,color:c.WHITE})}
-        >
-          <tuix-text size=${p.Body1} color=${N.SECONDARY}
-            >${t.name}</tuix-text
-          >
-        </th>`)}
-    </tr>`}_renderCell(t,e){if(t.isSlot){const n=`${t.slotName}-${e.id}`;return d`<td style="${this._cellStyleString()}">
-        <slot name=${n}></slot>
-      </td>`}const o=e[t.dataKey];return d`<td style="${this._cellStyleString()}">
-      <tuix-text
-        size=${p.Body1}
-        color=${this._textVariantColor(t,e)}
-        >${o}</tuix-text
-      >
-    </td>`}_renderRows(){const t=this.data;return Ue(t,e=>e.id,e=>d`<tr>
-          ${this.headers.map(o=>this._renderCell(o,e))}
-        </tr>`)}_onPageSizeChange(t){const e=parseInt(t.target.value);this._setPageSize(e)}_renderPageSizeOptions(){return this.pageSizeOptions.map(t=>d`<option value=${t}>${t}</option>`)}_renderSpinner(){const t={size:"14px",color:c.MAIN,visible:!0,ariaLabel:"Loading",wrapperStyle:{width:"100%",display:"flex",justifyContent:"center",padding:"48px 0"},...this.loader};if(!t.visible)return null;const e={"--dot-size":t.size,"--dot-color":t.color,...t.wrapperStyle},o=t.ariaLabel;return d`<div class="tuix-spinner-wrapper">
-      <div
-        class="three-dots-wrapper"
-        role="status"
-        aria-label=${o}
-        style=${dt(e)}
-      >
-        <span class="dot" aria-hidden="true"></span>
-        <span class="dot" aria-hidden="true"></span>
-        <span class="dot" aria-hidden="true"></span>
-        <span class="sr-only">${o}</span>
-      </div>
-    </div>`}_renderPagination(){const{totalItems:t,startItem:e,endItem:o,itemsPerPage:n,isLoading:i}=this._paginationProps;return d`<footer
-      style="background-color:${c.SECTION_BG};"
-      class="table_footer sticky"
-    >
-      <div class="items-per-page">
-        <tuix-text size=${p.Body2}>Items per page</tuix-text>
-        <div
-          style="outline: 1px solid ${c.NEUTRAL_200};"
-          class="dropdown_container"
-        >
-          <select
-            class="items-per-page-dropdown"
-            .value=${String(n)}
-            @change=${this._onPageSizeChange}
-            ?disabled=${i}
-          >
-            ${this._renderPageSizeOptions()}
-          </select>
-          <tuix-icon
-            class="arrow-icon"
-            name=${k.CHEVRON_DOWN}
-          ></tuix-icon>
-        </div>
-      </div>
-
-      <div class="navigation">
-        <tuix-text size=${p.Body2}
-          >${e} - ${o} of ${t}</tuix-text
-        >
-        <div class="buttons">
-          <tuix-icon
-            class="arrow-icon"
-            name=${k.CHEVRON_LEFT}
-            @click=${this._prevPage}
-          ></tuix-icon>
-          <tuix-icon
-            class="arrow-icon"
-            name=${k.CHEVRON_RIGHT}
-            @click=${this._nextPage}
-          ></tuix-icon>
-        </div>
-      </div>
-    </footer>`}_renderTable(){return d`<table>
-        <thead style="background-color: ${c.MAIN}">
-          ${this._renderHeaderCells()}
-        </thead>
-        ${this.isLoadingData?d`<tbody>
-              <tr>
-                <td colspan=${this.headers.length}>${this._renderSpinner()}</td>
-              </tr>
-            </tbody>`:d`<tbody>
-              ${this._renderRows()}
-            </tbody>`}
-      </table>
-      ${this.paginated?this._renderPagination():null}`}_renderCards(){const t=this.data;return d`<div class="mobile_table">
-        ${this.isLoadingData?this._renderSpinner():t.map(e=>d`<div
-                style="border-bottom: 2px solid ${c.MAIN};"
-                class="table_entity"
-              >
-                ${this.headers.map(o=>d`<div
-                    class="table_row"
-                    style="border-bottom:1px solid ${c.NEUTRAL_200};"
-                  >
-                    <div
-                      class="header"
-                      style="background-color:${c.SECTION_BG};"
-                    >
-                      <tuix-text
-                        size=${p.Body1}
-                        color=${N.PRIMARY}
-                        >${o.name}</tuix-text
-                      >
-                    </div>
-                    <div class="content">
-                      ${o.isSlot?d`<slot
-                            name="${o.slotName}-${e.id}"
-                          ></slot>`:d`<tuix-text size=${p.Body1}
-                            >${e[o.dataKey]}</tuix-text
-                          >`}
-                    </div>
-                  </div>`)}
-              </div>`)}
-      </div>
-      ${this.paginated?this._renderPagination():null}`}render(){return!this.disableMobileTable&&(this._isMobileView||this._isTabletView&&this.showMobileTableInTablet)?d`${this._renderCards()}`:d`${this._renderTable()}`}};$.styles=[Xe,We];S([a({type:Boolean})],$.prototype,"paginated",2);S([a({type:Boolean})],$.prototype,"disableMobileTable",2);S([a({type:Boolean})],$.prototype,"showMobileTableInTablet",2);S([a({type:Object})],$.prototype,"loader",2);S([a({type:Array})],$.prototype,"data",2);S([a({type:Array})],$.prototype,"headers",2);S([a({type:Array})],$.prototype,"pageSizeOptions",2);S([a({type:Number})],$.prototype,"totalItems",2);S([a({type:Number})],$.prototype,"currentPage",2);S([a({type:Number})],$.prototype,"currentSize",2);S([a({type:Boolean})],$.prototype,"isLoadingData",2);S([Y()],$.prototype,"_isTabletView",2);S([Y()],$.prototype,"_isMobileView",2);S([Y()],$.prototype,"_headerPercents",2);$=S([M("tuix-table")],$);function ni(){const t=document.createElement("link");t.rel="preconnect",t.href="https://fonts.googleapis.com";const e=document.createElement("link");e.rel="preconnect",e.href="https://fonts.gstatic.com";const o=document.createElement("link");o.rel="stylesheet",o.href="https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap",document.head.appendChild(t),document.head.appendChild(e),document.head.appendChild(o)}export{G as C,L as D,f as I,pt as L,w as a,ni as l};