@zanichelli/albe-web-components 20.0.2 → 20.0.3

package/dist/components/z-stepper-item.js

@@ -1,2 +1,2 @@
-import{proxyCustomElement as e,HTMLElement as t,h as i,Host as r,transformTag as o}from"@stencil/core/internal/client";import{d as c}from"./index3.js";const a=()=>`:host{position:relative;width:calc(var(--space-unit) * 5);font-family:var(--font-family-sans);font-weight:var(--font-rg);--z-icon-width:20px;--z-icon-height:20px}:host(:not(:last-child)){flex:1}:host(:not(:last-child))::after{position:absolute;z-index:1;top:calc(var(--space-unit) * 4 - var(--border-size-medium) / 2);right:calc(var(--space-unit) * 2);left:calc(var(--space-unit) * 3);display:block;width:auto;border-bottom:var(--border-size-medium) solid var(--color-disabled03);margin:0 calc(var(--space-unit) * -2) 0 calc(var(--space-unit) * 2);content:""}.stepper-item{display:flex;width:calc(var(--space-unit) * 5);flex-direction:column;align-items:center;padding:0;border:0;appearance:none;background:transparent;color:inherit;font-family:inherit;font-size:12px;line-height:16px;outline:0;text-decoration:none}.stepper-item span{display:none;width:calc(100% + calc(var(--space-unit) * 4));color:var(--color-default-text);text-align:center}:host([href]:not([disabled],[pressed])) .stepper-item{cursor:pointer}:host([disabled]) .stepper-item{pointer-events:none}:host([pressed]),:host([pressed]) .stepper-item{pointer-events:none}.indicator{display:flex;width:calc(var(--space-unit) * 4);height:calc(var(--space-unit) * 4);box-sizing:border-box;align-items:center;justify-content:center;border:var(--border-size-medium) solid var(--color-primary01);margin:calc(var(--space-unit) * 2);background:var(--color-surface01);border-radius:50%;color:var(--color-primary01);content:counter(stepper);font-size:14px;font-weight:var(--font-sb);line-height:1}:host([pressed]:not([disabled])) .indicator{border-color:var(--color-hover-primary);background:var(--color-hover-primary);color:var(--color-text-inverse)}:host([href]:not([disabled]):focus-within) .indicator{box-shadow:var(--shadow-focus-primary)}:host([href]:not([disabled],[pressed],[checked])) .indicator:hover{border-color:var(--color-hover-primary);color:var(--color-hover-primary)}:host([disabled]) .indicator{border-color:var(--color-disabled02);background:var(--color-disabled01);color:var(--color-disabled03)}:host([checked]:not([disabled])) .indicator{border-color:var(--color-default-success);color:var(--color-default-success)}:host([checked]:not([disabled])) .indicator z-icon{fill:var(--color-default-success)}:host([checked]) .indicator z-icon>svg{width:24px;height:24px}@media (min-width: 768px){.stepper-item span{display:block}}@media (min-width: 1152px){:host{width:calc(var(--space-unit) * 10);--z-icon-width:24px;--z-icon-height:24px}:host(:not(:last-child))::after{top:calc(var(--space-unit) * 5 - var(--border-size-medium) / 2);left:calc(var(--space-unit) * 8)}.stepper-item{width:calc(var(--space-unit) * 10);font-size:18px;line-height:28px}.indicator{width:calc(var(--space-unit) * 6);height:calc(var(--space-unit) * 6);font-size:16px}}`;const s=e(class e extends t{constructor(e){super();if(e!==false){this.__registerHost()}this.__attachShadow()}getAttributes(){const e=this.href&&!this.pressed&&!this.disabled?{onClick:()=>location.href=this.href}:undefined;const t=e?{role:"link"}:undefined;const i=this.pressed&&!this.disabled?{"aria-current":"step"}:undefined;const r=this.pressed||this.href===""?{tabIndex:-1}:undefined;return Object.assign(Object.assign(Object.assign(Object.assign({},e),t),i),r)}render(){return i(r,{key:"dd8a6a8aba1009e581a91944a84850f53e054dbd",role:"listitem"},i("button",Object.assign({key:"186641b0594970354812cf014f8565fda837d4eb",class:"stepper-item",disabled:this.disabled},this.getAttributes()),i("div",{key:"b27c548e3b9e670031ac095df8858c7fd864ac5e",class:"indicator"},this.checked?i("z-icon",{name:"checkmark"}):this.index),i("span",{key:"7d079d8f9eb730da9883735563dd57dfcc74259a"},i("slot",{key:"f8b378d874e958668b83dad6f4688b4590783198"}))))}static get style(){return a()}},[257,"z-stepper-item",{index:[514],href:[513],pressed:[516],checked:[516],disabled:[516]}]);function n(){if(typeof customElements==="undefined"){return}const e=["z-stepper-item","z-icon"];e.forEach((e=>{switch(e){case"z-stepper-item":if(!customElements.get(o(e))){customElements.define(o(e),s)}break;case"z-icon":if(!customElements.get(o(e))){c()}break}}))}const d=s;const l=n;export{d as ZStepperItem,l as defineCustomElement};
+import{proxyCustomElement as e,HTMLElement as t,h as i,Host as r,transformTag as o}from"@stencil/core/internal/client";import{d as s}from"./index3.js";const a=()=>`:host{position:relative;display:flex;font-family:var(--font-family-sans);font-weight:var(--font-rg);--z-icon-width:18px;--z-icon-height:18px;--indicator-size:calc(var(--space-unit) * 3.5);--stepper-item-size:calc(var(--space-unit) * 3.5);--indicator-overflow:calc((var(--indicator-size) - var(--stepper-item-size)) / 2);--connector-top:calc(var(--stepper-item-size) / 2)}:host(:not(:first-child)){flex:1;justify-content:flex-end}:host(:not(:first-child))::before{position:absolute;z-index:1;top:var(--connector-top);right:calc(var(--stepper-item-size) + var(--indicator-overflow));left:0;display:block;width:auto;border-bottom:var(--border-size-medium) solid var(--color-disabled03);content:"";transform:translateY(-50%)}:host(:not([disabled],:first-child))::before{border-bottom:var(--border-size-large) solid var(--color-primary01)}.stepper-item{display:grid;width:var(--stepper-item-size);align-items:center;padding:0;border:0;appearance:none;background:transparent;gap:10px;grid-template-columns:var(--stepper-item-size);grid-template-rows:var(--stepper-item-size) auto;justify-items:center;outline:0;text-decoration:none}.indicator{position:relative;z-index:2;display:flex;width:var(--indicator-size);min-width:0;height:var(--indicator-size);min-height:0;box-sizing:border-box;align-items:center;justify-content:center;border:var(--border-size-medium) solid var(--color-primary01);background:var(--color-surface01);border-radius:50%;color:var(--color-primary01);font-size:var(--font-size-1);font-weight:var(--font-sb);letter-spacing:0.32px;line-height:1.333}.stepper-item span{min-width:50px;color:var(--color-default-text);font-size:var(--font-size-2);letter-spacing:0.16px;line-height:1.4;text-align:center}:host([pressed]){--indicator-size:calc(var(--space-unit) * 4)}:host([pressed]) .stepper-item{gap:8px}:host([pressed]) .stepper-item .indicator{font-size:var(--font-size-4);font-weight:var(--font-sb)}:host([pressed]) .stepper-item span{font-weight:var(--font-sb);line-height:1.5}:host([href]:not([disabled])) .stepper-item{cursor:pointer}:host([disabled]) .stepper-item{pointer-events:none}:host([pressed]:not([disabled])) .indicator{border-color:var(--color-hover-primary);background:var(--color-hover-primary);color:var(--color-text-inverse)}:host([href]:not([disabled]):focus-within) .indicator{box-shadow:var(--shadow-focus-primary)}:host([href]:not([disabled],[pressed],[checked])) .indicator:hover{border-color:var(--color-hover-primary);color:var(--color-hover-primary)}:host([disabled]) .indicator{border-color:var(--color-form-disabled01-icon);color:var(--color-form-disabled01-icon)}:host([checked]:not([disabled])) .indicator{border-color:var(--color-primary01);background-color:var(--color-primary01)}:host([checked]:not([disabled])) .indicator z-icon{fill:var(--color-white)}@media (min-width: 1152px){:host{--z-icon-width:24px;--z-icon-height:24px;--indicator-size:calc(var(--space-unit) * 4.5);--stepper-item-size:calc(var(--space-unit) * 4.5)}.stepper-item{gap:12px}.stepper-item .indicator,.stepper-item span{font-size:var(--font-size-3);line-height:1.5}:host([pressed]){--indicator-size:calc(var(--space-unit) * 5)}:host([pressed]) .stepper-item{gap:10px}:host([pressed]) .stepper-item .indicator{font-size:var(--font-size-6)}}`;const n=e(class e extends t{constructor(e){super();if(e!==false){this.__registerHost()}this.__attachShadow()}getAttributes(){const e=this.href&&!this.disabled?{onClick:()=>location.href=this.href}:undefined;const t=e?{role:"link"}:undefined;const i=this.pressed&&!this.disabled?{"aria-current":"step"}:undefined;const r=this.href===""?{tabIndex:-1}:undefined;const o=!t&&this.pressed!==undefined?{"aria-pressed":String(this.pressed)}:undefined;const s=this.disabled!==undefined?{"aria-disabled":String(this.disabled)}:undefined;return Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({},e),t),i),r),o),s)}render(){return i(r,{key:"42329c166903a0ce77e82d222371804f3e7279b1",role:"listitem"},i("button",Object.assign({key:"ed6351193460e7a873cd9867bbd2ded798bbad8f",class:"stepper-item",disabled:this.disabled},this.getAttributes(),{"aria-label":this.htmlAriaLabel}),i("div",{key:"fc09e304cff2a9651859002047bd825f32c08e88",class:"indicator"},this.checked?i("z-icon",{name:"checkmark"}):this.index),i("span",{key:"5a9055a16e1e2481a995ad13ae307d8d67a07b70"},i("slot",{key:"68926fc154893ac5ed50ded8065590cfb586eb90"}))))}static get style(){return a()}},[257,"z-stepper-item",{index:[514],href:[513],pressed:[516],checked:[516],disabled:[516],htmlAriaLabel:[1,"html-aria-label"]}]);function c(){if(typeof customElements==="undefined"){return}const e=["z-stepper-item","z-icon"];e.forEach((e=>{switch(e){case"z-stepper-item":if(!customElements.get(o(e))){customElements.define(o(e),n)}break;case"z-icon":if(!customElements.get(o(e))){s()}break}}))}const d=n;const p=c;export{d as ZStepperItem,p as defineCustomElement};
 //# sourceMappingURL=z-stepper-item.js.map

package/dist/components/z-stepper-item.js.map

@@ -1 +1 @@
-{"version":3,"names":["stylesCss","ZStepperItem","__stencil_proxyCustomElement","HTMLElement","getAttributes","href","this","pressed","disabled","onClick","location","undefined","role","current","tabindex","tabIndex","Object","assign","render","h","Host","key","class","checked","name","index"],"sources":["src/components/z-stepper-item/styles.css?tag=z-stepper-item&encapsulation=shadow","src/components/z-stepper-item/index.tsx"],"sourcesContent":[":host {\n  position: relative;\n  width: calc(var(--space-unit) * 5);\n  font-family: var(--font-family-sans);\n  font-weight: var(--font-rg);\n\n  --z-icon-width: 20px;\n  --z-icon-height: 20px;\n}\n\n:host(:not(:last-child)) {\n  flex: 1;\n}\n\n:host(:not(:last-child))::after {\n  position: absolute;\n  z-index: 1;\n  top: calc(var(--space-unit) * 4 - var(--border-size-medium) / 2);\n  right: calc(var(--space-unit) * 2);\n  left: calc(var(--space-unit) * 3);\n  display: block;\n  width: auto;\n  border-bottom: var(--border-size-medium) solid var(--color-disabled03);\n  margin: 0 calc(var(--space-unit) * -2) 0 calc(var(--space-unit) * 2);\n  content: \"\";\n}\n\n.stepper-item {\n  display: flex;\n  width: calc(var(--space-unit) * 5);\n  flex-direction: column;\n  align-items: center;\n  padding: 0;\n  border: 0;\n  appearance: none;\n  background: transparent;\n  color: inherit;\n  font-family: inherit;\n  font-size: 12px;\n  line-height: 16px;\n  outline: 0;\n  text-decoration: none;\n}\n\n.stepper-item span {\n  display: none;\n  width: calc(100% + calc(var(--space-unit) * 4));\n  color: var(--color-default-text);\n  text-align: center;\n}\n\n:host([href]:not([disabled], [pressed])) .stepper-item {\n  cursor: pointer;\n}\n\n:host([disabled]) .stepper-item {\n  pointer-events: none;\n}\n\n:host([pressed]),\n:host([pressed]) .stepper-item {\n  pointer-events: none;\n}\n\n.indicator {\n  display: flex;\n  width: calc(var(--space-unit) * 4);\n  height: calc(var(--space-unit) * 4);\n  box-sizing: border-box;\n  align-items: center;\n  justify-content: center;\n  border: var(--border-size-medium) solid var(--color-primary01);\n  margin: calc(var(--space-unit) * 2);\n  background: var(--color-surface01);\n  border-radius: 50%;\n  color: var(--color-primary01);\n  content: counter(stepper);\n  font-size: 14px;\n  font-weight: var(--font-sb);\n  line-height: 1;\n}\n\n:host([pressed]:not([disabled])) .indicator {\n  border-color: var(--color-hover-primary);\n  background: var(--color-hover-primary);\n  color: var(--color-text-inverse);\n}\n\n:host([href]:not([disabled]):focus-within) .indicator {\n  box-shadow: var(--shadow-focus-primary);\n}\n\n:host([href]:not([disabled], [pressed], [checked])) .indicator:hover {\n  border-color: var(--color-hover-primary);\n  color: var(--color-hover-primary);\n}\n\n:host([disabled]) .indicator {\n  border-color: var(--color-disabled02);\n  background: var(--color-disabled01);\n  color: var(--color-disabled03);\n}\n\n:host([checked]:not([disabled])) .indicator {\n  border-color: var(--color-default-success);\n  color: var(--color-default-success);\n}\n\n:host([checked]:not([disabled])) .indicator z-icon {\n  fill: var(--color-default-success);\n}\n\n:host([checked]) .indicator z-icon > svg {\n  width: 24px;\n  height: 24px;\n}\n\n/* Tablet breakpoint */\n@media (min-width: 768px) {\n  .stepper-item span {\n    display: block;\n  }\n}\n\n/* Desktop breakpoint */\n@media (min-width: 1152px) {\n  :host {\n    width: calc(var(--space-unit) * 10);\n\n    --z-icon-width: 24px;\n    --z-icon-height: 24px;\n  }\n\n  :host(:not(:last-child))::after {\n    top: calc(var(--space-unit) * 5 - var(--border-size-medium) / 2);\n    left: calc(var(--space-unit) * 8);\n  }\n\n  .stepper-item {\n    width: calc(var(--space-unit) * 10);\n    font-size: 18px;\n    line-height: 28px;\n  }\n\n  .indicator {\n    width: calc(var(--space-unit) * 6);\n    height: calc(var(--space-unit) * 6);\n    font-size: 16px;\n  }\n}\n","import {Component, ComponentInterface, Host, Prop, h} from \"@stencil/core\";\n\n@Component({\n  tag: \"z-stepper-item\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZStepperItem implements ComponentInterface {\n  /**\n   * The number of the step item.\n   */\n  @Prop({reflect: true})\n  index: number;\n\n  /**\n   * The href to navigate on click.\n   */\n  @Prop({reflect: true})\n  href: string;\n\n  /**\n   * The pressed state of the item.\n   */\n  @Prop({reflect: true})\n  pressed: boolean;\n\n  /**\n   * The checked state of the item.\n   */\n  @Prop({reflect: true})\n  checked: boolean;\n\n  /**\n   * The disabled state of the item.\n   */\n  @Prop({reflect: true})\n  disabled: boolean;\n\n  private getAttributes(): Record<string, unknown> {\n    const href =\n      this.href && !this.pressed && !this.disabled ? {onClick: () => (location.href = this.href)} : undefined;\n    const role = href ? {role: \"link\"} : undefined;\n    const current = this.pressed && !this.disabled ? {\"aria-current\": \"step\"} : undefined;\n    const tabindex = this.pressed || this.href === \"\" ? {tabIndex: -1} : undefined;\n\n    return {\n      ...href,\n      ...role,\n      ...current,\n      ...tabindex,\n    };\n  }\n\n  render(): HTMLAnchorElement | HTMLButtonElement {\n    return (\n      <Host role=\"listitem\">\n        <button\n          class=\"stepper-item\"\n          disabled={this.disabled}\n          {...this.getAttributes()}\n        >\n          <div class=\"indicator\">{this.checked ? <z-icon name=\"checkmark\" /> : this.index}</div>\n          <span>\n            <slot />\n          </span>\n        </button>\n      </Host>\n    );\n  }\n}\n"],"mappings":"uJAAA,MAAMA,EAAY,IAAM,8vF,MCOXC,EAAYC,EAAA,MAAAD,UAAAE,E,iFA+Bf,aAAAC,GACN,MAAMC,EACJC,KAAKD,OAASC,KAAKC,UAAYD,KAAKE,SAAW,CAACC,QAAS,IAAOC,SAASL,KAAOC,KAAKD,MAASM,UAChG,MAAMC,EAAOP,EAAO,CAACO,KAAM,QAAUD,UACrC,MAAME,EAAUP,KAAKC,UAAYD,KAAKE,SAAW,CAAC,eAAgB,QAAUG,UAC5E,MAAMG,EAAWR,KAAKC,SAAWD,KAAKD,OAAS,GAAK,CAACU,UAAU,GAAMJ,UAErE,OAAAK,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAA,GACKZ,GACAO,GACAC,GACAC,E,CAIP,MAAAI,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACT,KAAK,YACTO,EAAA,SAAAH,OAAAC,OAAA,CAAAI,IAAA,2CACEC,MAAM,eACNd,SAAUF,KAAKE,UACXF,KAAKF,iBAETe,EAAA,OAAAE,IAAA,2CAAKC,MAAM,aAAahB,KAAKiB,QAAUJ,EAAA,UAAQK,KAAK,cAAiBlB,KAAKmB,OAC1EN,EAAA,QAAAE,IAAA,4CACEF,EAAA,QAAAE,IAAA,+C","ignoreList":[]}
+{"version":3,"names":["stylesCss","ZStepperItem","__stencil_proxyCustomElement","HTMLElement","getAttributes","href","this","disabled","onClick","location","undefined","role","current","pressed","tabindex","tabIndex","ariaPressed","String","ariaDisabled","Object","assign","render","h","Host","key","class","htmlAriaLabel","checked","name","index"],"sources":["src/components/z-stepper-item/styles.css?tag=z-stepper-item&encapsulation=shadow","src/components/z-stepper-item/index.tsx"],"sourcesContent":[":host {\n  position: relative;\n  display: flex;\n  font-family: var(--font-family-sans);\n  font-weight: var(--font-rg);\n\n  --z-icon-width: 18px;\n  --z-icon-height: 18px;\n  --indicator-size: calc(var(--space-unit) * 3.5);\n  --stepper-item-size: calc(var(--space-unit) * 3.5);\n  --indicator-overflow: calc((var(--indicator-size) - var(--stepper-item-size)) / 2);\n  --connector-top: calc(var(--stepper-item-size) / 2);\n}\n\n:host(:not(:first-child)) {\n  flex: 1;\n  justify-content: flex-end;\n}\n\n:host(:not(:first-child))::before {\n  position: absolute;\n  z-index: 1;\n  top: var(--connector-top);\n  right: calc(var(--stepper-item-size) + var(--indicator-overflow));\n  left: 0;\n  display: block;\n  width: auto;\n  border-bottom: var(--border-size-medium) solid var(--color-disabled03);\n  content: \"\";\n  transform: translateY(-50%);\n}\n\n:host(:not([disabled], :first-child))::before {\n  border-bottom: var(--border-size-large) solid var(--color-primary01);\n}\n\n.stepper-item {\n  display: grid;\n  width: var(--stepper-item-size);\n  align-items: center;\n  padding: 0;\n  border: 0;\n  appearance: none;\n  background: transparent;\n  gap: 10px;\n  grid-template-columns: var(--stepper-item-size);\n  grid-template-rows: var(--stepper-item-size) auto;\n  justify-items: center;\n  outline: 0;\n  text-decoration: none;\n}\n\n.indicator {\n  position: relative;\n  z-index: 2;\n  display: flex;\n  width: var(--indicator-size);\n  min-width: 0;\n  height: var(--indicator-size);\n  min-height: 0;\n  box-sizing: border-box;\n  align-items: center;\n  justify-content: center;\n  border: var(--border-size-medium) solid var(--color-primary01);\n  background: var(--color-surface01);\n  border-radius: 50%;\n  color: var(--color-primary01);\n  font-size: var(--font-size-1);\n  font-weight: var(--font-sb);\n  letter-spacing: 0.32px;\n  line-height: 1.333;\n}\n\n.stepper-item span {\n  min-width: 50px;\n  color: var(--color-default-text);\n  font-size: var(--font-size-2);\n  letter-spacing: 0.16px;\n  line-height: 1.4;\n  text-align: center;\n}\n\n:host([pressed]) {\n  --indicator-size: calc(var(--space-unit) * 4);\n}\n\n:host([pressed]) .stepper-item {\n  gap: 8px;\n}\n\n:host([pressed]) .stepper-item .indicator {\n  font-size: var(--font-size-4);\n  font-weight: var(--font-sb);\n}\n\n:host([pressed]) .stepper-item span {\n  font-weight: var(--font-sb);\n  line-height: 1.5;\n}\n\n:host([href]:not([disabled])) .stepper-item {\n  cursor: pointer;\n}\n\n:host([disabled]) .stepper-item {\n  pointer-events: none;\n}\n\n:host([pressed]:not([disabled])) .indicator {\n  border-color: var(--color-hover-primary);\n  background: var(--color-hover-primary);\n  color: var(--color-text-inverse);\n}\n\n:host([href]:not([disabled]):focus-within) .indicator {\n  box-shadow: var(--shadow-focus-primary);\n}\n\n:host([href]:not([disabled], [pressed], [checked])) .indicator:hover {\n  border-color: var(--color-hover-primary);\n  color: var(--color-hover-primary);\n}\n\n:host([disabled]) .indicator {\n  border-color: var(--color-form-disabled01-icon);\n  color: var(--color-form-disabled01-icon);\n}\n\n:host([checked]:not([disabled])) .indicator {\n  border-color: var(--color-primary01);\n  background-color: var(--color-primary01);\n}\n\n:host([checked]:not([disabled])) .indicator z-icon {\n  fill: var(--color-white);\n}\n\n/* Desktop breakpoint */\n@media (min-width: 1152px) {\n  :host {\n    --z-icon-width: 24px;\n    --z-icon-height: 24px;\n    --indicator-size: calc(var(--space-unit) * 4.5);\n    --stepper-item-size: calc(var(--space-unit) * 4.5);\n  }\n\n  .stepper-item {\n    gap: 12px;\n  }\n\n  .stepper-item .indicator,\n  .stepper-item span {\n    font-size: var(--font-size-3);\n    line-height: 1.5;\n  }\n\n  :host([pressed]) {\n    --indicator-size: calc(var(--space-unit) * 5);\n  }\n\n  :host([pressed]) .stepper-item {\n    gap: 10px;\n  }\n\n  :host([pressed]) .stepper-item .indicator {\n    font-size: var(--font-size-6);\n  }\n}\n","import {Component, ComponentInterface, Host, Prop, h} from \"@stencil/core\";\n\n@Component({\n  tag: \"z-stepper-item\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZStepperItem implements ComponentInterface {\n  /**\n   * The number of the step item.\n   */\n  @Prop({reflect: true})\n  index: number;\n\n  /**\n   * The href to navigate on click.\n   */\n  @Prop({reflect: true})\n  href: string;\n\n  /**\n   * The pressed state of the item.\n   */\n  @Prop({reflect: true})\n  pressed: boolean;\n\n  /**\n   * The checked state of the item.\n   */\n  @Prop({reflect: true})\n  checked: boolean;\n\n  /**\n   * The disabled state of the item.\n   */\n  @Prop({reflect: true})\n  disabled: boolean;\n\n  /**\n   * Aria label of the item.\n   */\n  @Prop()\n  htmlAriaLabel: string;\n\n  private getAttributes(): Record<string, unknown> {\n    const href = this.href && !this.disabled ? {onClick: () => (location.href = this.href)} : undefined;\n    const role = href ? {role: \"link\"} : undefined;\n    const current = this.pressed && !this.disabled ? {\"aria-current\": \"step\"} : undefined;\n    const tabindex = this.href === \"\" ? {tabIndex: -1} : undefined;\n    const ariaPressed = !role && this.pressed !== undefined ? {\"aria-pressed\": String(this.pressed)} : undefined;\n    const ariaDisabled = this.disabled !== undefined ? {\"aria-disabled\": String(this.disabled)} : undefined;\n\n    return {\n      ...href,\n      ...role,\n      ...current,\n      ...tabindex,\n      ...ariaPressed,\n      ...ariaDisabled,\n    };\n  }\n\n  render(): HTMLAnchorElement | HTMLButtonElement {\n    return (\n      <Host role=\"listitem\">\n        <button\n          class=\"stepper-item\"\n          disabled={this.disabled}\n          {...this.getAttributes()}\n          aria-label={this.htmlAriaLabel}\n        >\n          <div class=\"indicator\">{this.checked ? <z-icon name=\"checkmark\" /> : this.index}</div>\n          <span>\n            <slot />\n          </span>\n        </button>\n      </Host>\n    );\n  }\n}\n"],"mappings":"uJAAA,MAAMA,EAAY,IAAM,6rG,MCOXC,EAAYC,EAAA,MAAAD,UAAAE,E,iFAqCf,aAAAC,GACN,MAAMC,EAAOC,KAAKD,OAASC,KAAKC,SAAW,CAACC,QAAS,IAAOC,SAASJ,KAAOC,KAAKD,MAASK,UAC1F,MAAMC,EAAON,EAAO,CAACM,KAAM,QAAUD,UACrC,MAAME,EAAUN,KAAKO,UAAYP,KAAKC,SAAW,CAAC,eAAgB,QAAUG,UAC5E,MAAMI,EAAWR,KAAKD,OAAS,GAAK,CAACU,UAAU,GAAML,UACrD,MAAMM,GAAeL,GAAQL,KAAKO,UAAYH,UAAY,CAAC,eAAgBO,OAAOX,KAAKO,UAAYH,UACnG,MAAMQ,EAAeZ,KAAKC,WAAaG,UAAY,CAAC,gBAAiBO,OAAOX,KAAKC,WAAaG,UAE9F,OAAAS,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAA,GACKf,GACAM,GACAC,GACAE,GACAE,GACAE,E,CAIP,MAAAG,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACb,KAAK,YACTW,EAAA,SAAAH,OAAAC,OAAA,CAAAI,IAAA,2CACEC,MAAM,eACNlB,SAAUD,KAAKC,UACXD,KAAKF,gBAAe,cACZE,KAAKoB,gBAEjBJ,EAAA,OAAAE,IAAA,2CAAKC,MAAM,aAAanB,KAAKqB,QAAUL,EAAA,UAAQM,KAAK,cAAiBtB,KAAKuB,OAC1EP,EAAA,QAAAE,IAAA,4CACEF,EAAA,QAAAE,IAAA,+C","ignoreList":[]}

package/dist/components/z-stepper.js

@@ -1,2 +1,2 @@
-import{proxyCustomElement as e,HTMLElement as t,h as n,Host as s,transformTag as i}from"@stencil/core/internal/client";const o=()=>`:host{position:relative;display:flex;width:100%;max-width:100%;box-sizing:border-box;flex-direction:row;padding:0;margin:0;font-family:var(--font-family-sans);font-weight:var(--font-rg);list-style:none}@media (min-width: 768px){:host{padding:0 calc(var(--space-unit) * 2)}}`;const r=e(class e extends t{constructor(e){super();if(e!==false){this.__registerHost()}this.__attachShadow()}render(){return n(s,{key:"e2eae6f73c524f4a2c72861732bf03b17f23ca75",role:"navigation"},n("slot",{key:"567a94fe682d471b145e8519be859dd860bd6669"}))}static get style(){return o()}},[257,"z-stepper"]);function a(){if(typeof customElements==="undefined"){return}const e=["z-stepper"];e.forEach((e=>{switch(e){case"z-stepper":if(!customElements.get(i(e))){customElements.define(i(e),r)}break}}))}const c=r;const f=a;export{c as ZStepper,f as defineCustomElement};
+import{proxyCustomElement as e,HTMLElement as t,h as s,Host as i,transformTag as c}from"@stencil/core/internal/client";const n=()=>`:host{position:relative;display:flex;width:100%;max-width:100%;box-sizing:border-box;font-family:var(--font-family-sans);font-weight:var(--font-rg)}.stepper-list{display:flex;width:100%;box-sizing:border-box;flex-direction:row;padding:0 calc(var(--space-unit) * 3);margin:0}`;const r=e(class e extends t{constructor(e){super();if(e!==false){this.__registerHost()}this.__attachShadow()}render(){return s(i,{key:"c16bf08a310caae7b712a922a74eace29c560221",role:"navigation"},s("div",{key:"df1dcc32d712bd68f12900faf3e7ac72eb4fc6dc",class:"stepper-list",role:"list"},s("slot",{key:"c7c8775a5fe29029d271ea6442b094175c695c66"})))}static get style(){return n()}},[257,"z-stepper"]);function o(){if(typeof customElements==="undefined"){return}const e=["z-stepper"];e.forEach((e=>{switch(e){case"z-stepper":if(!customElements.get(c(e))){customElements.define(c(e),r)}break}}))}const a=r;const l=o;export{a as ZStepper,l as defineCustomElement};
 //# sourceMappingURL=z-stepper.js.map

package/dist/components/z-stepper.js.map

@@ -1 +1 @@
-{"version":3,"names":["stylesCss","ZStepper","__stencil_proxyCustomElement","HTMLElement","render","h","Host","key","role"],"sources":["src/components/z-stepper/styles.css?tag=z-stepper&encapsulation=shadow","src/components/z-stepper/index.tsx"],"sourcesContent":[":host {\n  position: relative;\n  display: flex;\n  width: 100%;\n  max-width: 100%;\n  box-sizing: border-box;\n  flex-direction: row;\n  padding: 0;\n  margin: 0;\n  font-family: var(--font-family-sans);\n  font-weight: var(--font-rg);\n  list-style: none;\n}\n\n@media (min-width: 768px) {\n  :host {\n    padding: 0 calc(var(--space-unit) * 2);\n  }\n}\n","import {Component, ComponentInterface, Host, h} from \"@stencil/core\";\n\n/**\n * @slot - slot for `z-stepper-item`\n */\n@Component({\n  tag: \"z-stepper\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZStepper implements ComponentInterface {\n  render(): HTMLSlotElement {\n    return (\n      <Host role=\"navigation\">\n        <slot />\n      </Host>\n    );\n  }\n}\n"],"mappings":"uHAAA,MAAMA,EAAY,IAAM,oR,MCUXC,EAAQC,EAAA,MAAAD,UAAAE,E,iFACnB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,KAAK,cACTH,EAAA,QAAAE,IAAA,6C","ignoreList":[]}
+{"version":3,"names":["stylesCss","ZStepper","__stencil_proxyCustomElement","HTMLElement","render","h","Host","key","role","class"],"sources":["src/components/z-stepper/styles.css?tag=z-stepper&encapsulation=shadow","src/components/z-stepper/index.tsx"],"sourcesContent":[":host {\n  position: relative;\n  display: flex;\n  width: 100%;\n  max-width: 100%;\n  box-sizing: border-box;\n  font-family: var(--font-family-sans);\n  font-weight: var(--font-rg);\n}\n\n.stepper-list {\n  display: flex;\n  width: 100%;\n  box-sizing: border-box;\n  flex-direction: row;\n  padding: 0 calc(var(--space-unit) * 3);\n  margin: 0;\n}\n","import {Component, ComponentInterface, Host, h} from \"@stencil/core\";\n\n/**\n * @slot - slot for `z-stepper-item`\n */\n@Component({\n  tag: \"z-stepper\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZStepper implements ComponentInterface {\n  render(): HTMLDivElement {\n    return (\n      <Host role=\"navigation\">\n        <div\n          class=\"stepper-list\"\n          role=\"list\"\n        >\n          <slot />\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"uHAAA,MAAMA,EAAY,IAAM,qR,MCUXC,EAAQC,EAAA,MAAAD,UAAAE,E,iFACnB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,KAAK,cACTH,EAAA,OAAAE,IAAA,2CACEE,MAAM,eACND,KAAK,QAELH,EAAA,QAAAE,IAAA,8C","ignoreList":[]}

package/dist/components/z-table.js

@@ -1,2 +1,2 @@
-import{proxyCustomElement as t,HTMLElement as e,h as r,Host as o,transformTag as a}from"@stencil/core/internal/client";import"./index2.js";import"./breakpoints.js";import"./iconset.js";import"./index16.js";const l=()=>`:host{position:relative;display:block;overflow:auto;min-width:max-content;max-width:100%;box-sizing:border-box;padding:var(--space-unit)}:host([expandable]){--z-table--expand-button-size:40px}`;const b=()=>`z-table,table.z-table{background-color:var(--color-surface01);--z-table--cells-padding:calc(var(--space-unit) * 2)}table.z-table{border-collapse:collapse}z-thead,table.z-table thead{background-color:var(--color-background);--z-table--cells-bottom-border-size:var(--border-size-medium)}z-tfoot,table.z-table tfoot{border-top:var(--border-size-medium) solid var(--color-surface03);border-bottom:var(--border-size-medium) solid var(--color-surface03)}z-tfoot z-tr,table.z-table tfoot tr{border-bottom:calc(var(--z-table--cells-bottom-border-size)) solid var(--color-surface03) !important}z-tr,table.z-table tr{border-bottom:var(--z-table--cells-bottom-border-size, var(--border-size-small)) solid var(--color-surface03)}z-td,z-th,table.z-table td,table.z-table th{padding:var(--z-table--cells-padding, calc(var(--space-unit) * 2));text-align:left}z-th:not(:first-child),z-td:not(:first-child),table.z-table th:not(:first-child),table.z-table td:not(:first-child){border-left:var(--z-table--cell-left-border, none)}z-table[bordered],table.z-table.z-table-bordered{--z-table--cell-left-border:1px solid var(--color-surface03)}table.z-table-hover>tbody>tr:hover>td,table.z-table-hover>tfoot>tr:hover>td{position:relative;background-color:var(--color-surface02)}table.z-table-hover>tbody>tr:hover>td::after,table.z-table-hover>tfoot>tr:hover>td::after{position:absolute;z-index:1;top:0;right:0;bottom:0;left:-1px;box-shadow:inset 0 var(--border-size-small) 0 var(--color-surface04),     inset 0 calc(var(--border-size-small) * -1) 0 var(--color-surface04);content:""}table.z-table-hover>tbody>tr:hover>td:first-child::after,table.z-table-hover>thead>tr:hover>th:first-child::after,table.z-table-hover>tfoot>tr:hover>td:first-child::after{left:0}`;const s=t(class t extends e{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow();this.bordered=false;this.expandable=false}updateExpandable(){this.expandable=this.host.querySelectorAll("z-tr[expandable]").length>0}componentWillLoad(){this.expandableMutationObserver=new MutationObserver((()=>{this.updateExpandable()}));this.expandableMutationObserver.observe(this.host,{childList:true,subtree:true,attributes:true,attributeFilter:["expandable"],attributeOldValue:false})}disconnectedCallback(){var t;(t=this.expandableMutationObserver)===null||t===void 0?void 0:t.disconnect()}render(){return r(o,{key:"07719fd45b5b0cc2e5d5798f397048b4e233ce88",expandable:this.expandable},r("div",{key:"f333241ac885ebdaeed659b2aeb1f6af811fa0ec",class:"table",role:"table"},r("slot",{key:"e9072d50375eb35757b393ec5a843459dafd4cc2"})))}get host(){return this}static get style(){return l()+b()}},[257,"z-table",{bordered:[516],expandable:[32]}]);function i(){if(typeof customElements==="undefined"){return}const t=["z-table"];t.forEach((t=>{switch(t){case"z-table":if(!customElements.get(a(t))){customElements.define(a(t),s)}break}}))}const d=s;const c=i;export{d as ZTable,c as defineCustomElement};
+import{proxyCustomElement as t,HTMLElement as e,h as r,Host as a,transformTag as o}from"@stencil/core/internal/client";import"./index2.js";import"./breakpoints.js";import"./iconset.js";import"./index16.js";const l=()=>`:host{position:relative;display:block;overflow:auto;min-width:max-content;max-width:100%;box-sizing:border-box;padding:var(--space-unit)}:host([expandable]){--z-table--expand-button-size:40px}`;const b=()=>`z-table,table.z-table{background-color:var(--color-surface01);--z-table--cells-padding:calc(var(--space-unit) * 2)}table.z-table{border-collapse:collapse}z-thead,table.z-table thead{background-color:var(--color-background);--z-table--cells-bottom-border-size:var(--border-size-medium)}z-tfoot,table.z-table tfoot{border-top:var(--border-size-medium) solid var(--color-surface03);border-bottom:var(--border-size-medium) solid var(--color-surface03)}z-tfoot z-tr,table.z-table tfoot tr{border-bottom:calc(var(--z-table--cells-bottom-border-size)) solid var(--color-surface03) !important}z-tr,table.z-table tr{border-bottom:var(--z-table--cells-bottom-border-size, var(--border-size-small)) solid var(--color-surface03)}z-td,z-th,table.z-table td,table.z-table th{padding:var(--z-table--cells-padding, calc(var(--space-unit) * 2));text-align:left}z-th:not(:first-child),z-td:not(:first-child),table.z-table th:not(:first-child),table.z-table td:not(:first-child){border-left:var(--z-table--cell-left-border, none)}z-table[bordered],table.z-table.z-table-bordered{--z-table--cell-left-border:1px solid var(--color-surface03)}table.z-table-hover>tbody>tr:hover>td,table.z-table-hover>tfoot>tr:hover>td{position:relative;background-color:var(--color-surface02)}table.z-table-hover>tbody>tr:hover>td::after,table.z-table-hover>tfoot>tr:hover>td::after{position:absolute;z-index:1;top:0;right:0;bottom:0;left:-1px;box-shadow:inset 0 var(--border-size-small) 0 var(--color-surface04),     inset 0 calc(var(--border-size-small) * -1) 0 var(--color-surface04);content:""}table.z-table-hover>tbody>tr:hover>td:first-child::after,table.z-table-hover>thead>tr:hover>th:first-child::after,table.z-table-hover>tfoot>tr:hover>td:first-child::after{left:0}`;const s=t(class t extends e{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow();this.bordered=false;this.expandable=false}updateExpandable(){this.expandable=this.host.querySelectorAll("z-tr[expandable]").length>0}componentWillLoad(){this.expandableMutationObserver=new MutationObserver((()=>{this.updateExpandable()}));this.expandableMutationObserver.observe(this.host,{childList:true,subtree:true,attributes:true,attributeFilter:["expandable"],attributeOldValue:false})}disconnectedCallback(){var t;(t=this.expandableMutationObserver)===null||t===void 0?void 0:t.disconnect()}render(){return r(a,{key:"2accba3d35c252853a9b19b15528855070165077",expandable:this.expandable},r("div",{key:"bdd3382b246e669c8600d116cda8a6ebc11f530d",class:"table",role:"table"},r("slot",{key:"c3cbdb04a91f0cd4301d8ba73578878864e0c3a1"})))}get host(){return this}static get style(){return l()+b()}},[257,"z-table",{bordered:[516],expandable:[32]}]);function d(){if(typeof customElements==="undefined"){return}const t=["z-table"];t.forEach((t=>{switch(t){case"z-table":if(!customElements.get(o(t))){customElements.define(o(t),s)}break}}))}const i=s;const c=d;export{i as ZTable,c as defineCustomElement};
 //# sourceMappingURL=z-table.js.map

package/dist/components/z-tbody.js

@@ -1,2 +1,2 @@
-import{proxyCustomElement as t,HTMLElement as e,h as r,Host as o,transformTag as a}from"@stencil/core/internal/client";const l=()=>`:host{display:block;box-sizing:border-box}`;const b=()=>`z-table,table.z-table{background-color:var(--color-surface01);--z-table--cells-padding:calc(var(--space-unit) * 2)}table.z-table{border-collapse:collapse}z-thead,table.z-table thead{background-color:var(--color-background);--z-table--cells-bottom-border-size:var(--border-size-medium)}z-tfoot,table.z-table tfoot{border-top:var(--border-size-medium) solid var(--color-surface03);border-bottom:var(--border-size-medium) solid var(--color-surface03)}z-tfoot z-tr,table.z-table tfoot tr{border-bottom:calc(var(--z-table--cells-bottom-border-size)) solid var(--color-surface03) !important}z-tr,table.z-table tr{border-bottom:var(--z-table--cells-bottom-border-size, var(--border-size-small)) solid var(--color-surface03)}z-td,z-th,table.z-table td,table.z-table th{padding:var(--z-table--cells-padding, calc(var(--space-unit) * 2));text-align:left}z-th:not(:first-child),z-td:not(:first-child),table.z-table th:not(:first-child),table.z-table td:not(:first-child){border-left:var(--z-table--cell-left-border, none)}z-table[bordered],table.z-table.z-table-bordered{--z-table--cell-left-border:1px solid var(--color-surface03)}table.z-table-hover>tbody>tr:hover>td,table.z-table-hover>tfoot>tr:hover>td{position:relative;background-color:var(--color-surface02)}table.z-table-hover>tbody>tr:hover>td::after,table.z-table-hover>tfoot>tr:hover>td::after{position:absolute;z-index:1;top:0;right:0;bottom:0;left:-1px;box-shadow:inset 0 var(--border-size-small) 0 var(--color-surface04),     inset 0 calc(var(--border-size-small) * -1) 0 var(--color-surface04);content:""}table.z-table-hover>tbody>tr:hover>td:first-child::after,table.z-table-hover>thead>tr:hover>th:first-child::after,table.z-table-hover>tfoot>tr:hover>td:first-child::after{left:0}`;const c=t(class t extends e{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow()}render(){return r(o,{key:"5dab686ef543637640d464ad532250d642f73508",role:"rowgroup"},r("slot",{key:"36c4272ae7ba5eee71ffc682ca0d086c1a6cdc07"}))}static get style(){return l()+b()}},[257,"z-tbody"]);function d(){if(typeof customElements==="undefined"){return}const t=["z-tbody"];t.forEach((t=>{switch(t){case"z-tbody":if(!customElements.get(a(t))){customElements.define(a(t),c)}break}}))}const s=c;const i=d;export{s as ZTbody,i as defineCustomElement};
+import{proxyCustomElement as t,HTMLElement as e,h as r,Host as o,transformTag as l}from"@stencil/core/internal/client";const a=()=>`:host{display:block;box-sizing:border-box}`;const b=()=>`z-table,table.z-table{background-color:var(--color-surface01);--z-table--cells-padding:calc(var(--space-unit) * 2)}table.z-table{border-collapse:collapse}z-thead,table.z-table thead{background-color:var(--color-background);--z-table--cells-bottom-border-size:var(--border-size-medium)}z-tfoot,table.z-table tfoot{border-top:var(--border-size-medium) solid var(--color-surface03);border-bottom:var(--border-size-medium) solid var(--color-surface03)}z-tfoot z-tr,table.z-table tfoot tr{border-bottom:calc(var(--z-table--cells-bottom-border-size)) solid var(--color-surface03) !important}z-tr,table.z-table tr{border-bottom:var(--z-table--cells-bottom-border-size, var(--border-size-small)) solid var(--color-surface03)}z-td,z-th,table.z-table td,table.z-table th{padding:var(--z-table--cells-padding, calc(var(--space-unit) * 2));text-align:left}z-th:not(:first-child),z-td:not(:first-child),table.z-table th:not(:first-child),table.z-table td:not(:first-child){border-left:var(--z-table--cell-left-border, none)}z-table[bordered],table.z-table.z-table-bordered{--z-table--cell-left-border:1px solid var(--color-surface03)}table.z-table-hover>tbody>tr:hover>td,table.z-table-hover>tfoot>tr:hover>td{position:relative;background-color:var(--color-surface02)}table.z-table-hover>tbody>tr:hover>td::after,table.z-table-hover>tfoot>tr:hover>td::after{position:absolute;z-index:1;top:0;right:0;bottom:0;left:-1px;box-shadow:inset 0 var(--border-size-small) 0 var(--color-surface04),     inset 0 calc(var(--border-size-small) * -1) 0 var(--color-surface04);content:""}table.z-table-hover>tbody>tr:hover>td:first-child::after,table.z-table-hover>thead>tr:hover>th:first-child::after,table.z-table-hover>tfoot>tr:hover>td:first-child::after{left:0}`;const c=t(class t extends e{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow()}render(){return r(o,{key:"9cae384882eb06e5e0ec93393ac6849e22da48c5",role:"rowgroup"},r("slot",{key:"64c4e7e784638e3f7319783429b29f1e2a38b584"}))}static get style(){return a()+b()}},[257,"z-tbody"]);function s(){if(typeof customElements==="undefined"){return}const t=["z-tbody"];t.forEach((t=>{switch(t){case"z-tbody":if(!customElements.get(l(t))){customElements.define(l(t),c)}break}}))}const d=c;const i=s;export{d as ZTbody,i as defineCustomElement};
 //# sourceMappingURL=z-tbody.js.map

package/dist/components/z-td.js

@@ -1,2 +1,2 @@
-import{proxyCustomElement as e,HTMLElement as t,createEvent as o,h as a,Host as r,transformTag as l}from"@stencil/core/internal/client";import{P as s,e as n,B as i}from"./index2.js";import{d as c}from"./index4.js";import{d}from"./index3.js";import{d as b}from"./index16.js";const h=()=>`:host{position:relative;display:flex;max-width:100%;align-items:center;background-color:var(--color-surface01);gap:calc(var(--space-unit) * 2) var(--space-unit)}:host,*{box-sizing:border-box}:host([sticky]){position:sticky;z-index:1;top:0;left:0;box-shadow:8px 0 16px -8px var(--shadow-color-base)}:host([menu-open]){z-index:2}.cell--content{display:flex;width:100%;height:100%;align-items:center}:host([show-menu]) .cell--content{column-gap:var(--space-unit)}.cell--menu-container{margin-left:auto}:host(:not([show-menu])) .cell--menu-container{opacity:0;pointer-events:none}:host(:is([show-menu],[menu-open])) .cell--menu-container,:host([show-menu]) .cell--menu-container:focus-within{z-index:1;opacity:1;pointer-events:all}:host .cell-popover{z-index:100}@media (min-width: 768px) and (hover: hover){:host([show-menu="hover"]) .cell--menu-container{opacity:0;pointer-events:none}:host([show-menu="hover"]:hover) .cell--menu-container{z-index:1;opacity:1;pointer-events:all}}`;const p=()=>`z-table,table.z-table{background-color:var(--color-surface01);--z-table--cells-padding:calc(var(--space-unit) * 2)}table.z-table{border-collapse:collapse}z-thead,table.z-table thead{background-color:var(--color-background);--z-table--cells-bottom-border-size:var(--border-size-medium)}z-tfoot,table.z-table tfoot{border-top:var(--border-size-medium) solid var(--color-surface03);border-bottom:var(--border-size-medium) solid var(--color-surface03)}z-tfoot z-tr,table.z-table tfoot tr{border-bottom:calc(var(--z-table--cells-bottom-border-size)) solid var(--color-surface03) !important}z-tr,table.z-table tr{border-bottom:var(--z-table--cells-bottom-border-size, var(--border-size-small)) solid var(--color-surface03)}z-td,z-th,table.z-table td,table.z-table th{padding:var(--z-table--cells-padding, calc(var(--space-unit) * 2));text-align:left}z-th:not(:first-child),z-td:not(:first-child),table.z-table th:not(:first-child),table.z-table td:not(:first-child){border-left:var(--z-table--cell-left-border, none)}z-table[bordered],table.z-table.z-table-bordered{--z-table--cell-left-border:1px solid var(--color-surface03)}table.z-table-hover>tbody>tr:hover>td,table.z-table-hover>tfoot>tr:hover>td{position:relative;background-color:var(--color-surface02)}table.z-table-hover>tbody>tr:hover>td::after,table.z-table-hover>tfoot>tr:hover>td::after{position:absolute;z-index:1;top:0;right:0;bottom:0;left:-1px;box-shadow:inset 0 var(--border-size-small) 0 var(--color-surface04),     inset 0 calc(var(--border-size-small) * -1) 0 var(--color-surface04);content:""}table.z-table-hover>tbody>tr:hover>td:first-child::after,table.z-table-hover>thead>tr:hover>th:first-child::after,table.z-table-hover>tfoot>tr:hover>td:first-child::after{left:0}`;const f=e(class e extends t{constructor(e){super();if(e!==false){this.__registerHost()}this.__attachShadow();this.colspanChange=o(this,"colspanChange",6);this.sticky=false;this.showMenu=null;this.popoverPosition=s.AUTO;this.isMenuOpen=false}updateColspan(){if(this.colspan){this.host.style.gridColumn=`span ${this.colspan}`}else{this.host.style.removeProperty("grid-column")}this.colspanChange.emit(this.colspan||1)}onMenuButtonClick(e){e.stopPropagation();this.popoverEl.open=!this.popoverEl.open}componentWillLoad(){this.updateColspan()}render(){return a(r,{key:"4ea61b4c4d2e924b925e7b8f579e6827e0ee22c8",role:"cell","menu-open":this.isMenuOpen},a("div",{key:"98db4baee9fbf028c36f201b1fca8959bf955eb8",class:"cell--content"},a("slot",{key:"633725c94623d66b2e4c2820bfb0453d500b6ac6"}),this.showMenu&&a("div",{key:"61f2fb0cc589bc32acd0e51b7ddae92be78d18f0",class:"cell--menu-container prevent-expand"},a("z-button",{key:"86132a5a7762b97d0646071d54339930269d1ce3",variant:i.TERTIARY,icon:"contextual-menu",size:n.X_SMALL,ref:e=>this.menuTrigger=e,onClick:this.onMenuButtonClick.bind(this)}),a("z-popover",{key:"bf2d2b8f0114562d49cd4a88b895b2b9dca22389",class:"cell-popover",ref:e=>this.popoverEl=e,bindTo:this.menuTrigger,onOpenChange:e=>this.isMenuOpen=e.detail.open,position:this.popoverPosition},a("slot",{key:"f3512195bf82945f0fca0ca3c3c389d04b5d98c0",name:"contextual-menu"})))))}get host(){return this}static get watchers(){return{colspan:[{updateColspan:0}]}}static get style(){return h()+p()}},[257,"z-td",{colspan:[2],sticky:[516],showMenu:[513,"show-menu"],popoverPosition:[1,"popover-position"],isMenuOpen:[32]},undefined,{colspan:[{updateColspan:0}]}]);function u(){if(typeof customElements==="undefined"){return}const e=["z-td","z-button","z-icon","z-popover"];e.forEach((e=>{switch(e){case"z-td":if(!customElements.get(l(e))){customElements.define(l(e),f)}break;case"z-button":if(!customElements.get(l(e))){c()}break;case"z-icon":if(!customElements.get(l(e))){d()}break;case"z-popover":if(!customElements.get(l(e))){b()}break}}))}const m=f;const z=u;export{m as ZTd,z as defineCustomElement};
+import{proxyCustomElement as e,HTMLElement as t,createEvent as o,h as a,Host as r,transformTag as l}from"@stencil/core/internal/client";import{P as s,e as n,B as i}from"./index2.js";import{d as c}from"./index4.js";import{d}from"./index3.js";import{d as b}from"./index16.js";const h=()=>`:host{position:relative;display:flex;max-width:100%;align-items:center;background-color:var(--color-surface01);gap:calc(var(--space-unit) * 2) var(--space-unit)}:host,*{box-sizing:border-box}:host([sticky]){position:sticky;z-index:1;top:0;left:0;box-shadow:8px 0 16px -8px var(--shadow-color-base)}:host([menu-open]){z-index:2}.cell--content{display:flex;width:100%;height:100%;align-items:center}:host([show-menu]) .cell--content{column-gap:var(--space-unit)}.cell--menu-container{margin-left:auto}:host(:not([show-menu])) .cell--menu-container{opacity:0;pointer-events:none}:host(:is([show-menu],[menu-open])) .cell--menu-container,:host([show-menu]) .cell--menu-container:focus-within{z-index:1;opacity:1;pointer-events:all}:host .cell-popover{z-index:100}@media (min-width: 768px) and (hover: hover){:host([show-menu="hover"]) .cell--menu-container{opacity:0;pointer-events:none}:host([show-menu="hover"]:hover) .cell--menu-container{z-index:1;opacity:1;pointer-events:all}}`;const f=()=>`z-table,table.z-table{background-color:var(--color-surface01);--z-table--cells-padding:calc(var(--space-unit) * 2)}table.z-table{border-collapse:collapse}z-thead,table.z-table thead{background-color:var(--color-background);--z-table--cells-bottom-border-size:var(--border-size-medium)}z-tfoot,table.z-table tfoot{border-top:var(--border-size-medium) solid var(--color-surface03);border-bottom:var(--border-size-medium) solid var(--color-surface03)}z-tfoot z-tr,table.z-table tfoot tr{border-bottom:calc(var(--z-table--cells-bottom-border-size)) solid var(--color-surface03) !important}z-tr,table.z-table tr{border-bottom:var(--z-table--cells-bottom-border-size, var(--border-size-small)) solid var(--color-surface03)}z-td,z-th,table.z-table td,table.z-table th{padding:var(--z-table--cells-padding, calc(var(--space-unit) * 2));text-align:left}z-th:not(:first-child),z-td:not(:first-child),table.z-table th:not(:first-child),table.z-table td:not(:first-child){border-left:var(--z-table--cell-left-border, none)}z-table[bordered],table.z-table.z-table-bordered{--z-table--cell-left-border:1px solid var(--color-surface03)}table.z-table-hover>tbody>tr:hover>td,table.z-table-hover>tfoot>tr:hover>td{position:relative;background-color:var(--color-surface02)}table.z-table-hover>tbody>tr:hover>td::after,table.z-table-hover>tfoot>tr:hover>td::after{position:absolute;z-index:1;top:0;right:0;bottom:0;left:-1px;box-shadow:inset 0 var(--border-size-small) 0 var(--color-surface04),     inset 0 calc(var(--border-size-small) * -1) 0 var(--color-surface04);content:""}table.z-table-hover>tbody>tr:hover>td:first-child::after,table.z-table-hover>thead>tr:hover>th:first-child::after,table.z-table-hover>tfoot>tr:hover>td:first-child::after{left:0}`;const p=e(class e extends t{constructor(e){super();if(e!==false){this.__registerHost()}this.__attachShadow();this.colspanChange=o(this,"colspanChange",6);this.sticky=false;this.showMenu=null;this.popoverPosition=s.AUTO;this.isMenuOpen=false}updateColspan(){if(this.colspan){this.host.style.gridColumn=`span ${this.colspan}`}else{this.host.style.removeProperty("grid-column")}this.colspanChange.emit(this.colspan||1)}onMenuButtonClick(e){e.stopPropagation();this.popoverEl.open=!this.popoverEl.open}componentWillLoad(){this.updateColspan()}render(){return a(r,{key:"6f49c2168c28a2acd1eb77401b6664a909770330",role:"cell","menu-open":this.isMenuOpen},a("div",{key:"dca80731605efa309f88f6c4e5b3e05fc1b6f2d8",class:"cell--content"},a("slot",{key:"980d81d5d5296f41f535488dcad732e5d5eb58ce"}),this.showMenu&&a("div",{key:"f58e65a67d7a897be2bcbec22b50b8efb4d82995",class:"cell--menu-container prevent-expand"},a("z-button",{key:"3d701ae5ba5af6372fad70bc0582a46ac48b75c2",variant:i.TERTIARY,icon:"contextual-menu",size:n.X_SMALL,ref:e=>this.menuTrigger=e,onClick:this.onMenuButtonClick.bind(this)}),a("z-popover",{key:"5d5f94967a72ffdb7384c071d965e90abfb8ea0b",class:"cell-popover",ref:e=>this.popoverEl=e,bindTo:this.menuTrigger,onOpenChange:e=>this.isMenuOpen=e.detail.open,position:this.popoverPosition},a("slot",{key:"fef55973f37e93062c6e3229fdbdd5311d0f2920",name:"contextual-menu"})))))}get host(){return this}static get watchers(){return{colspan:[{updateColspan:0}]}}static get style(){return h()+f()}},[257,"z-td",{colspan:[2],sticky:[516],showMenu:[513,"show-menu"],popoverPosition:[1,"popover-position"],isMenuOpen:[32]},undefined,{colspan:[{updateColspan:0}]}]);function u(){if(typeof customElements==="undefined"){return}const e=["z-td","z-button","z-icon","z-popover"];e.forEach((e=>{switch(e){case"z-td":if(!customElements.get(l(e))){customElements.define(l(e),p)}break;case"z-button":if(!customElements.get(l(e))){c()}break;case"z-icon":if(!customElements.get(l(e))){d()}break;case"z-popover":if(!customElements.get(l(e))){b()}break}}))}const m=p;const z=u;export{m as ZTd,z as defineCustomElement};
 //# sourceMappingURL=z-td.js.map

package/dist/components/z-tfoot.js

@@ -1,2 +1,2 @@
-import{proxyCustomElement as t,HTMLElement as e,h as o,Host as r,transformTag as l}from"@stencil/core/internal/client";const a=()=>`:host{display:block;box-sizing:border-box;margin-top:-1px}:host([sticky]){position:sticky;z-index:1;bottom:0;background-color:var(--color-surface01)}`;const b=()=>`z-table,table.z-table{background-color:var(--color-surface01);--z-table--cells-padding:calc(var(--space-unit) * 2)}table.z-table{border-collapse:collapse}z-thead,table.z-table thead{background-color:var(--color-background);--z-table--cells-bottom-border-size:var(--border-size-medium)}z-tfoot,table.z-table tfoot{border-top:var(--border-size-medium) solid var(--color-surface03);border-bottom:var(--border-size-medium) solid var(--color-surface03)}z-tfoot z-tr,table.z-table tfoot tr{border-bottom:calc(var(--z-table--cells-bottom-border-size)) solid var(--color-surface03) !important}z-tr,table.z-table tr{border-bottom:var(--z-table--cells-bottom-border-size, var(--border-size-small)) solid var(--color-surface03)}z-td,z-th,table.z-table td,table.z-table th{padding:var(--z-table--cells-padding, calc(var(--space-unit) * 2));text-align:left}z-th:not(:first-child),z-td:not(:first-child),table.z-table th:not(:first-child),table.z-table td:not(:first-child){border-left:var(--z-table--cell-left-border, none)}z-table[bordered],table.z-table.z-table-bordered{--z-table--cell-left-border:1px solid var(--color-surface03)}table.z-table-hover>tbody>tr:hover>td,table.z-table-hover>tfoot>tr:hover>td{position:relative;background-color:var(--color-surface02)}table.z-table-hover>tbody>tr:hover>td::after,table.z-table-hover>tfoot>tr:hover>td::after{position:absolute;z-index:1;top:0;right:0;bottom:0;left:-1px;box-shadow:inset 0 var(--border-size-small) 0 var(--color-surface04),     inset 0 calc(var(--border-size-small) * -1) 0 var(--color-surface04);content:""}table.z-table-hover>tbody>tr:hover>td:first-child::after,table.z-table-hover>thead>tr:hover>th:first-child::after,table.z-table-hover>tfoot>tr:hover>td:first-child::after{left:0}`;const s=t(class t extends e{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow();this.sticky=false}render(){return o(r,{key:"a5e96868b6f2f28cd25fe134b8346f0f9d800de1",role:"rowgroup",tabIndex:-1},o("slot",{key:"bbb1478d0fdd700bf4e9601eb7d008f54ff02cb3"}))}static get style(){return a()+b()}},[257,"z-tfoot",{sticky:[516]}]);function c(){if(typeof customElements==="undefined"){return}const t=["z-tfoot"];t.forEach((t=>{switch(t){case"z-tfoot":if(!customElements.get(l(t))){customElements.define(l(t),s)}break}}))}const d=s;const i=c;export{d as ZTfoot,i as defineCustomElement};
+import{proxyCustomElement as t,HTMLElement as e,h as o,Host as r,transformTag as a}from"@stencil/core/internal/client";const l=()=>`:host{display:block;box-sizing:border-box;margin-top:-1px}:host([sticky]){position:sticky;z-index:1;bottom:0;background-color:var(--color-surface01)}`;const b=()=>`z-table,table.z-table{background-color:var(--color-surface01);--z-table--cells-padding:calc(var(--space-unit) * 2)}table.z-table{border-collapse:collapse}z-thead,table.z-table thead{background-color:var(--color-background);--z-table--cells-bottom-border-size:var(--border-size-medium)}z-tfoot,table.z-table tfoot{border-top:var(--border-size-medium) solid var(--color-surface03);border-bottom:var(--border-size-medium) solid var(--color-surface03)}z-tfoot z-tr,table.z-table tfoot tr{border-bottom:calc(var(--z-table--cells-bottom-border-size)) solid var(--color-surface03) !important}z-tr,table.z-table tr{border-bottom:var(--z-table--cells-bottom-border-size, var(--border-size-small)) solid var(--color-surface03)}z-td,z-th,table.z-table td,table.z-table th{padding:var(--z-table--cells-padding, calc(var(--space-unit) * 2));text-align:left}z-th:not(:first-child),z-td:not(:first-child),table.z-table th:not(:first-child),table.z-table td:not(:first-child){border-left:var(--z-table--cell-left-border, none)}z-table[bordered],table.z-table.z-table-bordered{--z-table--cell-left-border:1px solid var(--color-surface03)}table.z-table-hover>tbody>tr:hover>td,table.z-table-hover>tfoot>tr:hover>td{position:relative;background-color:var(--color-surface02)}table.z-table-hover>tbody>tr:hover>td::after,table.z-table-hover>tfoot>tr:hover>td::after{position:absolute;z-index:1;top:0;right:0;bottom:0;left:-1px;box-shadow:inset 0 var(--border-size-small) 0 var(--color-surface04),     inset 0 calc(var(--border-size-small) * -1) 0 var(--color-surface04);content:""}table.z-table-hover>tbody>tr:hover>td:first-child::after,table.z-table-hover>thead>tr:hover>th:first-child::after,table.z-table-hover>tfoot>tr:hover>td:first-child::after{left:0}`;const c=t(class t extends e{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow();this.sticky=false}render(){return o(r,{key:"760c32f2385aff5e84785bc1415b5cf29fd063da",role:"rowgroup",tabIndex:-1},o("slot",{key:"c36cf634b18c1216cfc6f31abe07b53600305737"}))}static get style(){return l()+b()}},[257,"z-tfoot",{sticky:[516]}]);function s(){if(typeof customElements==="undefined"){return}const t=["z-tfoot"];t.forEach((t=>{switch(t){case"z-tfoot":if(!customElements.get(a(t))){customElements.define(a(t),c)}break}}))}const d=c;const i=s;export{d as ZTfoot,i as defineCustomElement};
 //# sourceMappingURL=z-tfoot.js.map

package/dist/components/z-th.js

@@ -1,2 +1,2 @@
-import{proxyCustomElement as t,HTMLElement as e,createEvent as o,h as r,Host as s,transformTag as a}from"@stencil/core/internal/client";import{P as n,S as i,e as l,B as c}from"./index2.js";import{d as h}from"./index4.js";import{d}from"./index3.js";import{d as b}from"./index16.js";const u=()=>`:host{position:relative;display:flex;max-width:100%;align-items:center;background-color:var(--color-surface01);gap:calc(var(--space-unit) * 2) var(--space-unit)}:host,*{box-sizing:border-box}:host([sticky]){position:sticky;z-index:1;top:0;left:0;box-shadow:8px 0 16px -8px var(--shadow-color-base)}:host([menu-open]){z-index:2}.cell--content{display:flex;width:100%;height:100%;align-items:center}:host([show-menu]) .cell--content{column-gap:var(--space-unit)}.cell--menu-container{margin-left:auto}:host(:not([show-menu])) .cell--menu-container{opacity:0;pointer-events:none}:host(:is([show-menu],[menu-open])) .cell--menu-container,:host([show-menu]) .cell--menu-container:focus-within{z-index:1;opacity:1;pointer-events:all}:host .cell-popover{z-index:100}@media (min-width: 768px) and (hover: hover){:host([show-menu="hover"]) .cell--menu-container{opacity:0;pointer-events:none}:host([show-menu="hover"]:hover) .cell--menu-container{z-index:1;opacity:1;pointer-events:all}}`;const f=()=>`:host{z-index:1;padding:0;background-color:var(--color-background);font-weight:var(--font-sb)}:host([show-sorting]) .cell--content{column-gap:var(--space-unit)}.z-th--sort-button{position:relative;padding:0;border:none;background-color:transparent;cursor:pointer;outline:none}.z-th--sort-button:focus,.z-th--sort-button:focus-visible{box-shadow:var(--shadow-focus-primary);opacity:1;outline:none;pointer-events:all}@media (min-width: 768px) and (hover: hover){:host([show-sorting="hover"]) .z-th--sort-button{opacity:0;pointer-events:none}:host([show-sorting="hover"]:hover) .z-th--sort-button,:host([show-sorting="hover"]) .z-th--sort-button:focus:focus-visible,:host([show-sorting="always"]) .z-th--sort-button,:host([sorted]) .z-th--sort-button{opacity:1;pointer-events:all}}:host([show-sorting="hover"]:hover) .z-th--sort-button::after,:host([show-sorting="hover"]) .z-th--sort-button:focus:focus-visible::after,:host([show-sorting="always"]) .z-th--sort-button::after,:host([sorted]) .z-th--sort-button::after{position:absolute;top:6px;left:6px;width:calc(100% - 12px);height:calc(100% - 10px);background-color:transparent;content:""}`;const p=()=>`z-table,table.z-table{background-color:var(--color-surface01);--z-table--cells-padding:calc(var(--space-unit) * 2)}table.z-table{border-collapse:collapse}z-thead,table.z-table thead{background-color:var(--color-background);--z-table--cells-bottom-border-size:var(--border-size-medium)}z-tfoot,table.z-table tfoot{border-top:var(--border-size-medium) solid var(--color-surface03);border-bottom:var(--border-size-medium) solid var(--color-surface03)}z-tfoot z-tr,table.z-table tfoot tr{border-bottom:calc(var(--z-table--cells-bottom-border-size)) solid var(--color-surface03) !important}z-tr,table.z-table tr{border-bottom:var(--z-table--cells-bottom-border-size, var(--border-size-small)) solid var(--color-surface03)}z-td,z-th,table.z-table td,table.z-table th{padding:var(--z-table--cells-padding, calc(var(--space-unit) * 2));text-align:left}z-th:not(:first-child),z-td:not(:first-child),table.z-table th:not(:first-child),table.z-table td:not(:first-child){border-left:var(--z-table--cell-left-border, none)}z-table[bordered],table.z-table.z-table-bordered{--z-table--cell-left-border:1px solid var(--color-surface03)}table.z-table-hover>tbody>tr:hover>td,table.z-table-hover>tfoot>tr:hover>td{position:relative;background-color:var(--color-surface02)}table.z-table-hover>tbody>tr:hover>td::after,table.z-table-hover>tfoot>tr:hover>td::after{position:absolute;z-index:1;top:0;right:0;bottom:0;left:-1px;box-shadow:inset 0 var(--border-size-small) 0 var(--color-surface04),     inset 0 calc(var(--border-size-small) * -1) 0 var(--color-surface04);content:""}table.z-table-hover>tbody>tr:hover>td:first-child::after,table.z-table-hover>thead>tr:hover>th:first-child::after,table.z-table-hover>tfoot>tr:hover>td:first-child::after{left:0}`;const v=t(class t extends e{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow();this.sort=o(this,"sort",7);this.showMenu=null;this.showSorting=null;this.sticky=false;this.sorted=false;this.popoverPosition=n.AUTO;this.isMenuOpen=false}get ariaSortDirection(){if(!this.sortDirection){return null}return this.sortDirection===i.ASC?"ascending":"descending"}handleSort(){if(!this.sortDirection){this.sorted=false;return}this.sortDirection=this.sortDirection===i.ASC?i.DESC:i.ASC;this.sorted=true;this.sort.emit({sortDirection:this.sortDirection})}updateColspan(){if(this.colspan){this.host.style.gridColumn=`span ${this.colspan}`}else{this.host.style.removeProperty("grid-column")}}componentWillLoad(){this.updateColspan()}render(){return r(s,{key:"d677564cf6d2351a9188098d58b98e4bf9ffbf9e",role:"columnheader","menu-open":this.isMenuOpen,"aria-sort":this.ariaSortDirection,sortable:this.showSorting},r("div",{key:"267fd4a41682a6a1475ba74739ff148957dc6626",class:"cell--content"},r("slot",{key:"a77588e6dd5645f6b384a7564a06cffae72bed4e"}),this.showSorting&&r("button",{key:"8a565667e7bdbd223d38efe7be5128c69947577c",class:"z-th--sort-button",type:"button",onClick:this.handleSort.bind(this)},r("z-icon",{key:"a527e6e217f5cbabf1baac1c292111ab406aa792",name:this.sortDirection===i.DESC?"arrow-simple-up":"arrow-simple-down",width:14,height:14})),this.showMenu&&r("div",{key:"396eb46a6aa10d47419cd437412ce69d797f2047",class:"cell--menu-container"},r("z-button",{key:"6e014d9922c15041950772ee0c377b9f31d4d743",variant:c.TERTIARY,icon:"contextual-menu",size:l.X_SMALL,ref:t=>this.menuTrigger=t,onClick:()=>this.popoverEl.open=!this.popoverEl.open}),r("z-popover",{key:"11a7861d3151f616c9d9761709611bac37a02ec6",ref:t=>this.popoverEl=t,bindTo:this.menuTrigger,onOpenChange:t=>this.isMenuOpen=t.detail.open,position:this.popoverPosition},r("slot",{key:"99545a1fb846906941ce882d6f21676de1fa7fb2",name:"contextual-menu"})))))}get host(){return this}static get watchers(){return{colspan:[{updateColspan:0}]}}static get style(){return u()+(f()+p())}},[257,"z-th",{colspan:[2],showMenu:[513,"show-menu"],showSorting:[513,"show-sorting"],sticky:[516],sortDirection:[1025,"sort-direction"],sorted:[1540],popoverPosition:[1,"popover-position"],isMenuOpen:[32]},undefined,{colspan:[{updateColspan:0}]}]);function z(){if(typeof customElements==="undefined"){return}const t=["z-th","z-button","z-icon","z-popover"];t.forEach((t=>{switch(t){case"z-th":if(!customElements.get(a(t))){customElements.define(a(t),v)}break;case"z-button":if(!customElements.get(a(t))){h()}break;case"z-icon":if(!customElements.get(a(t))){d()}break;case"z-popover":if(!customElements.get(a(t))){b()}break}}))}const m=v;const g=z;export{m as ZTh,g as defineCustomElement};
+import{proxyCustomElement as t,HTMLElement as e,createEvent as o,h as r,Host as s,transformTag as a}from"@stencil/core/internal/client";import{P as n,S as i,e as l,B as c}from"./index2.js";import{d as h}from"./index4.js";import{d}from"./index3.js";import{d as b}from"./index16.js";const u=()=>`:host{position:relative;display:flex;max-width:100%;align-items:center;background-color:var(--color-surface01);gap:calc(var(--space-unit) * 2) var(--space-unit)}:host,*{box-sizing:border-box}:host([sticky]){position:sticky;z-index:1;top:0;left:0;box-shadow:8px 0 16px -8px var(--shadow-color-base)}:host([menu-open]){z-index:2}.cell--content{display:flex;width:100%;height:100%;align-items:center}:host([show-menu]) .cell--content{column-gap:var(--space-unit)}.cell--menu-container{margin-left:auto}:host(:not([show-menu])) .cell--menu-container{opacity:0;pointer-events:none}:host(:is([show-menu],[menu-open])) .cell--menu-container,:host([show-menu]) .cell--menu-container:focus-within{z-index:1;opacity:1;pointer-events:all}:host .cell-popover{z-index:100}@media (min-width: 768px) and (hover: hover){:host([show-menu="hover"]) .cell--menu-container{opacity:0;pointer-events:none}:host([show-menu="hover"]:hover) .cell--menu-container{z-index:1;opacity:1;pointer-events:all}}`;const p=()=>`:host{z-index:1;padding:0;background-color:var(--color-background);font-weight:var(--font-sb)}:host([show-sorting]) .cell--content{column-gap:var(--space-unit)}.z-th--sort-button{position:relative;padding:0;border:none;background-color:transparent;cursor:pointer;outline:none}.z-th--sort-button:focus,.z-th--sort-button:focus-visible{box-shadow:var(--shadow-focus-primary);opacity:1;outline:none;pointer-events:all}@media (min-width: 768px) and (hover: hover){:host([show-sorting="hover"]) .z-th--sort-button{opacity:0;pointer-events:none}:host([show-sorting="hover"]:hover) .z-th--sort-button,:host([show-sorting="hover"]) .z-th--sort-button:focus:focus-visible,:host([show-sorting="always"]) .z-th--sort-button,:host([sorted]) .z-th--sort-button{opacity:1;pointer-events:all}}:host([show-sorting="hover"]:hover) .z-th--sort-button::after,:host([show-sorting="hover"]) .z-th--sort-button:focus:focus-visible::after,:host([show-sorting="always"]) .z-th--sort-button::after,:host([sorted]) .z-th--sort-button::after{position:absolute;top:6px;left:6px;width:calc(100% - 12px);height:calc(100% - 10px);background-color:transparent;content:""}`;const f=()=>`z-table,table.z-table{background-color:var(--color-surface01);--z-table--cells-padding:calc(var(--space-unit) * 2)}table.z-table{border-collapse:collapse}z-thead,table.z-table thead{background-color:var(--color-background);--z-table--cells-bottom-border-size:var(--border-size-medium)}z-tfoot,table.z-table tfoot{border-top:var(--border-size-medium) solid var(--color-surface03);border-bottom:var(--border-size-medium) solid var(--color-surface03)}z-tfoot z-tr,table.z-table tfoot tr{border-bottom:calc(var(--z-table--cells-bottom-border-size)) solid var(--color-surface03) !important}z-tr,table.z-table tr{border-bottom:var(--z-table--cells-bottom-border-size, var(--border-size-small)) solid var(--color-surface03)}z-td,z-th,table.z-table td,table.z-table th{padding:var(--z-table--cells-padding, calc(var(--space-unit) * 2));text-align:left}z-th:not(:first-child),z-td:not(:first-child),table.z-table th:not(:first-child),table.z-table td:not(:first-child){border-left:var(--z-table--cell-left-border, none)}z-table[bordered],table.z-table.z-table-bordered{--z-table--cell-left-border:1px solid var(--color-surface03)}table.z-table-hover>tbody>tr:hover>td,table.z-table-hover>tfoot>tr:hover>td{position:relative;background-color:var(--color-surface02)}table.z-table-hover>tbody>tr:hover>td::after,table.z-table-hover>tfoot>tr:hover>td::after{position:absolute;z-index:1;top:0;right:0;bottom:0;left:-1px;box-shadow:inset 0 var(--border-size-small) 0 var(--color-surface04),     inset 0 calc(var(--border-size-small) * -1) 0 var(--color-surface04);content:""}table.z-table-hover>tbody>tr:hover>td:first-child::after,table.z-table-hover>thead>tr:hover>th:first-child::after,table.z-table-hover>tfoot>tr:hover>td:first-child::after{left:0}`;const v=t(class t extends e{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow();this.sort=o(this,"sort",7);this.showMenu=null;this.showSorting=null;this.sticky=false;this.sorted=false;this.popoverPosition=n.AUTO;this.isMenuOpen=false}get ariaSortDirection(){if(!this.sortDirection){return null}return this.sortDirection===i.ASC?"ascending":"descending"}handleSort(){if(!this.sortDirection){this.sorted=false;return}this.sortDirection=this.sortDirection===i.ASC?i.DESC:i.ASC;this.sorted=true;this.sort.emit({sortDirection:this.sortDirection})}updateColspan(){if(this.colspan){this.host.style.gridColumn=`span ${this.colspan}`}else{this.host.style.removeProperty("grid-column")}}componentWillLoad(){this.updateColspan()}render(){return r(s,{key:"db3a788009481e7bf625db4787850ddfc9b65203",role:"columnheader","menu-open":this.isMenuOpen,"aria-sort":this.ariaSortDirection,sortable:this.showSorting},r("div",{key:"b9e3d66c8b74bd054257deccf64575bad12166b4",class:"cell--content"},r("slot",{key:"b9297277121a0798491644ca9e7fd86e99766975"}),this.showSorting&&r("button",{key:"e2fa7f525d8138c95540ce5216e7d0df9fecdfd4",class:"z-th--sort-button",type:"button",onClick:this.handleSort.bind(this)},r("z-icon",{key:"3c8b5d576386da794abdbc4ea48e9d9bab2ad1c9",name:this.sortDirection===i.DESC?"arrow-simple-up":"arrow-simple-down",width:14,height:14})),this.showMenu&&r("div",{key:"38a8b3f1cd7dd75c90953179c8527484f2c17fc7",class:"cell--menu-container"},r("z-button",{key:"f5ce6e168efba6c456a6fedad8a0103e37130d13",variant:c.TERTIARY,icon:"contextual-menu",size:l.X_SMALL,ref:t=>this.menuTrigger=t,onClick:()=>this.popoverEl.open=!this.popoverEl.open}),r("z-popover",{key:"c989b847fa08f6b9f7a87a645c52a1163191b406",ref:t=>this.popoverEl=t,bindTo:this.menuTrigger,onOpenChange:t=>this.isMenuOpen=t.detail.open,position:this.popoverPosition},r("slot",{key:"aac102b6bbc90923ce404a1b6499cf58c7277a00",name:"contextual-menu"})))))}get host(){return this}static get watchers(){return{colspan:[{updateColspan:0}]}}static get style(){return u()+(p()+f())}},[257,"z-th",{colspan:[2],showMenu:[513,"show-menu"],showSorting:[513,"show-sorting"],sticky:[516],sortDirection:[1025,"sort-direction"],sorted:[1540],popoverPosition:[1,"popover-position"],isMenuOpen:[32]},undefined,{colspan:[{updateColspan:0}]}]);function z(){if(typeof customElements==="undefined"){return}const t=["z-th","z-button","z-icon","z-popover"];t.forEach((t=>{switch(t){case"z-th":if(!customElements.get(a(t))){customElements.define(a(t),v)}break;case"z-button":if(!customElements.get(a(t))){h()}break;case"z-icon":if(!customElements.get(a(t))){d()}break;case"z-popover":if(!customElements.get(a(t))){b()}break}}))}const m=v;const g=z;export{m as ZTh,g as defineCustomElement};
 //# sourceMappingURL=z-th.js.map

package/dist/components/z-thead.js

@@ -1,2 +1,2 @@
-import{proxyCustomElement as t,HTMLElement as e,h as o,Host as r,transformTag as a}from"@stencil/core/internal/client";const l=()=>`:host{--z-table--cells-background:var(     --color-background   );display:block;box-sizing:border-box}:host([sticky]){position:sticky;z-index:2;top:0;box-shadow:0 2px 4px -2px var(--shadow-color-base)}:host(:focus-visible){box-shadow:none;outline:none}`;const b=()=>`z-table,table.z-table{background-color:var(--color-surface01);--z-table--cells-padding:calc(var(--space-unit) * 2)}table.z-table{border-collapse:collapse}z-thead,table.z-table thead{background-color:var(--color-background);--z-table--cells-bottom-border-size:var(--border-size-medium)}z-tfoot,table.z-table tfoot{border-top:var(--border-size-medium) solid var(--color-surface03);border-bottom:var(--border-size-medium) solid var(--color-surface03)}z-tfoot z-tr,table.z-table tfoot tr{border-bottom:calc(var(--z-table--cells-bottom-border-size)) solid var(--color-surface03) !important}z-tr,table.z-table tr{border-bottom:var(--z-table--cells-bottom-border-size, var(--border-size-small)) solid var(--color-surface03)}z-td,z-th,table.z-table td,table.z-table th{padding:var(--z-table--cells-padding, calc(var(--space-unit) * 2));text-align:left}z-th:not(:first-child),z-td:not(:first-child),table.z-table th:not(:first-child),table.z-table td:not(:first-child){border-left:var(--z-table--cell-left-border, none)}z-table[bordered],table.z-table.z-table-bordered{--z-table--cell-left-border:1px solid var(--color-surface03)}table.z-table-hover>tbody>tr:hover>td,table.z-table-hover>tfoot>tr:hover>td{position:relative;background-color:var(--color-surface02)}table.z-table-hover>tbody>tr:hover>td::after,table.z-table-hover>tfoot>tr:hover>td::after{position:absolute;z-index:1;top:0;right:0;bottom:0;left:-1px;box-shadow:inset 0 var(--border-size-small) 0 var(--color-surface04),     inset 0 calc(var(--border-size-small) * -1) 0 var(--color-surface04);content:""}table.z-table-hover>tbody>tr:hover>td:first-child::after,table.z-table-hover>thead>tr:hover>th:first-child::after,table.z-table-hover>tfoot>tr:hover>td:first-child::after{left:0}`;const s=t(class t extends e{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow();this.sticky=false;this.isFocusable=false}render(){return o(r,{key:"7344ed54861bf06e14d98898db49edb576668e9b",role:"rowgroup",tabIndex:this.isFocusable?0:-1},o("slot",{key:"72be057fd58c9da5280dee692324cb5192865dba"}))}get host(){return this}static get style(){return l()+b()}},[257,"z-thead",{sticky:[516],isFocusable:[516,"is-focusable"]}]);function d(){if(typeof customElements==="undefined"){return}const t=["z-thead"];t.forEach((t=>{switch(t){case"z-thead":if(!customElements.get(a(t))){customElements.define(a(t),s)}break}}))}const c=s;const i=d;export{c as ZThead,i as defineCustomElement};
+import{proxyCustomElement as t,HTMLElement as e,h as o,Host as r,transformTag as a}from"@stencil/core/internal/client";const l=()=>`:host{--z-table--cells-background:var(     --color-background   );display:block;box-sizing:border-box}:host([sticky]){position:sticky;z-index:2;top:0;box-shadow:0 2px 4px -2px var(--shadow-color-base)}:host(:focus-visible){box-shadow:none;outline:none}`;const s=()=>`z-table,table.z-table{background-color:var(--color-surface01);--z-table--cells-padding:calc(var(--space-unit) * 2)}table.z-table{border-collapse:collapse}z-thead,table.z-table thead{background-color:var(--color-background);--z-table--cells-bottom-border-size:var(--border-size-medium)}z-tfoot,table.z-table tfoot{border-top:var(--border-size-medium) solid var(--color-surface03);border-bottom:var(--border-size-medium) solid var(--color-surface03)}z-tfoot z-tr,table.z-table tfoot tr{border-bottom:calc(var(--z-table--cells-bottom-border-size)) solid var(--color-surface03) !important}z-tr,table.z-table tr{border-bottom:var(--z-table--cells-bottom-border-size, var(--border-size-small)) solid var(--color-surface03)}z-td,z-th,table.z-table td,table.z-table th{padding:var(--z-table--cells-padding, calc(var(--space-unit) * 2));text-align:left}z-th:not(:first-child),z-td:not(:first-child),table.z-table th:not(:first-child),table.z-table td:not(:first-child){border-left:var(--z-table--cell-left-border, none)}z-table[bordered],table.z-table.z-table-bordered{--z-table--cell-left-border:1px solid var(--color-surface03)}table.z-table-hover>tbody>tr:hover>td,table.z-table-hover>tfoot>tr:hover>td{position:relative;background-color:var(--color-surface02)}table.z-table-hover>tbody>tr:hover>td::after,table.z-table-hover>tfoot>tr:hover>td::after{position:absolute;z-index:1;top:0;right:0;bottom:0;left:-1px;box-shadow:inset 0 var(--border-size-small) 0 var(--color-surface04),     inset 0 calc(var(--border-size-small) * -1) 0 var(--color-surface04);content:""}table.z-table-hover>tbody>tr:hover>td:first-child::after,table.z-table-hover>thead>tr:hover>th:first-child::after,table.z-table-hover>tfoot>tr:hover>td:first-child::after{left:0}`;const b=t(class t extends e{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow();this.sticky=false;this.isFocusable=false}render(){return o(r,{key:"daa59cf6627acea2cbd48f1b56910a22146f90f3",role:"rowgroup",tabIndex:this.isFocusable?0:-1},o("slot",{key:"ba7897a89465398dff471d7eb9d7a0d276599269"}))}get host(){return this}static get style(){return l()+s()}},[257,"z-thead",{sticky:[516],isFocusable:[516,"is-focusable"]}]);function c(){if(typeof customElements==="undefined"){return}const t=["z-thead"];t.forEach((t=>{switch(t){case"z-thead":if(!customElements.get(a(t))){customElements.define(a(t),b)}break}}))}const d=b;const i=c;export{d as ZThead,i as defineCustomElement};
 //# sourceMappingURL=z-thead.js.map

package/dist/components/z-toast-notification-list.js

@@ -1,2 +1,2 @@
-import{proxyCustomElement as t,HTMLElement as o,h as s,transformTag as i}from"@stencil/core/internal/client";import{s as n}from"./index2.js";const e=()=>`:host{position:fixed;z-index:10000;display:flex;flex-flow:column nowrap;margin-top:calc(var(--space-unit) * 2);margin-bottom:calc(var(--space-unit) * 2);font-family:var(--font-family-sans);font-weight:var(--font-rg)}::slotted(z-toast-notification){width:100vw}::slotted(:not(:last-child)){margin-bottom:calc(var(--space-unit) * 1)}:host([position="bottom-centre"]),:host([position="bottom-right"]),:host([position="bottom-left"]){bottom:0;align-items:flex-end;justify-content:flex-end}:host([position="top-left"]),:host([position="top-right"]),:host([position="top-centre"]){top:0;align-items:flex-start;justify-content:flex-start}@media only screen and (min-width: 768px){:host{margin:calc(var(--space-unit) * 3)}:host([position="top-centre"]){top:0;left:50%;align-items:center;justify-content:flex-start;transform:translateX(-50%)}:host([position="top-left"]){top:0;left:0;align-items:flex-start;justify-content:flex-start}:host([position="top-right"]){top:0;right:0;align-items:flex-end;justify-content:flex-start}:host([position="bottom-centre"]){bottom:0;left:50%;align-items:center;justify-content:flex-end;transform:translateX(-50%)}:host([position="bottom-right"]){right:0;bottom:0;align-items:flex-end;justify-content:flex-end}:host([position="bottom-left"]){bottom:0;left:0;align-items:flex-start;justify-content:flex-end}::slotted(z-toast-notification){width:50vw}}@media only screen and (min-width: 1366px){:host{margin:calc(var(--space-unit) * 4)}::slotted(z-toast-notification){width:33vw}}`;const a=t(class t extends o{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow();this.position=n.TOP_RIGHT;this.newestontop=true;this.notificationArray=[]}watchPropNewestontop(t){this.hostElement.append(...this.notificationArray.reverse());if(t){this.hostElement.shadowRoot.addEventListener("slotchange",this.slotChangeHandler)}else{this.hostElement.shadowRoot.removeEventListener("slotchange",this.slotChangeHandler)}}componentWillLoad(){if(this.newestontop){this.handleNewestOnTop()}}handleNewestOnTop(){this.notificationArray=Array.from(this.hostElement.children);this.hostElement.append(...this.notificationArray.reverse());this.hostElement.shadowRoot.addEventListener("slotchange",this.slotChangeHandler.bind(this))}slotChangeHandler(){const t=Array.from(this.hostElement.children).filter((t=>!this.notificationArray.includes(t)));if(t){t.forEach((t=>{this.notificationArray.push(t);const o=t;t.remove();this.hostElement.prepend(o)}))}}render(){return s("slot",{key:"124469b727158c7221ff11aa3b0614bd28591a50",name:"toasts"})}get hostElement(){return this}static get watchers(){return{newestontop:[{watchPropNewestontop:0}]}}static get style(){return e()}},[257,"z-toast-notification-list",{position:[513],newestontop:[4]},undefined,{newestontop:[{watchPropNewestontop:0}]}]);function l(){if(typeof customElements==="undefined"){return}const t=["z-toast-notification-list"];t.forEach((t=>{switch(t){case"z-toast-notification-list":if(!customElements.get(i(t))){customElements.define(i(t),a)}break}}))}const r=a;const c=l;export{r as ZToastNotificationList,c as defineCustomElement};
+import{proxyCustomElement as t,HTMLElement as o,h as s,transformTag as i}from"@stencil/core/internal/client";import{s as e}from"./index2.js";const n=()=>`:host{position:fixed;z-index:10000;display:flex;flex-flow:column nowrap;margin-top:calc(var(--space-unit) * 2);margin-bottom:calc(var(--space-unit) * 2);font-family:var(--font-family-sans);font-weight:var(--font-rg)}::slotted(z-toast-notification){width:100vw}::slotted(:not(:last-child)){margin-bottom:calc(var(--space-unit) * 1)}:host([position="bottom-centre"]),:host([position="bottom-right"]),:host([position="bottom-left"]){bottom:0;align-items:flex-end;justify-content:flex-end}:host([position="top-left"]),:host([position="top-right"]),:host([position="top-centre"]){top:0;align-items:flex-start;justify-content:flex-start}@media only screen and (min-width: 768px){:host{margin:calc(var(--space-unit) * 3)}:host([position="top-centre"]){top:0;left:50%;align-items:center;justify-content:flex-start;transform:translateX(-50%)}:host([position="top-left"]){top:0;left:0;align-items:flex-start;justify-content:flex-start}:host([position="top-right"]){top:0;right:0;align-items:flex-end;justify-content:flex-start}:host([position="bottom-centre"]){bottom:0;left:50%;align-items:center;justify-content:flex-end;transform:translateX(-50%)}:host([position="bottom-right"]){right:0;bottom:0;align-items:flex-end;justify-content:flex-end}:host([position="bottom-left"]){bottom:0;left:0;align-items:flex-start;justify-content:flex-end}::slotted(z-toast-notification){width:50vw}}@media only screen and (min-width: 1366px){:host{margin:calc(var(--space-unit) * 4)}::slotted(z-toast-notification){width:33vw}}`;const a=t(class t extends o{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow();this.position=e.TOP_RIGHT;this.newestontop=true;this.notificationArray=[]}watchPropNewestontop(t){this.hostElement.append(...this.notificationArray.reverse());if(t){this.hostElement.shadowRoot.addEventListener("slotchange",this.slotChangeHandler)}else{this.hostElement.shadowRoot.removeEventListener("slotchange",this.slotChangeHandler)}}componentWillLoad(){if(this.newestontop){this.handleNewestOnTop()}}handleNewestOnTop(){this.notificationArray=Array.from(this.hostElement.children);this.hostElement.append(...this.notificationArray.reverse());this.hostElement.shadowRoot.addEventListener("slotchange",this.slotChangeHandler.bind(this))}slotChangeHandler(){const t=Array.from(this.hostElement.children).filter((t=>!this.notificationArray.includes(t)));if(t){t.forEach((t=>{this.notificationArray.push(t);const o=t;t.remove();this.hostElement.prepend(o)}))}}render(){return s("slot",{key:"369ca36cde4f86f5e390568b3526ffab0aad053f",name:"toasts"})}get hostElement(){return this}static get watchers(){return{newestontop:[{watchPropNewestontop:0}]}}static get style(){return n()}},[257,"z-toast-notification-list",{position:[513],newestontop:[4]},undefined,{newestontop:[{watchPropNewestontop:0}]}]);function l(){if(typeof customElements==="undefined"){return}const t=["z-toast-notification-list"];t.forEach((t=>{switch(t){case"z-toast-notification-list":if(!customElements.get(i(t))){customElements.define(i(t),a)}break}}))}const r=a;const c=l;export{r as ZToastNotificationList,c as defineCustomElement};
 //# sourceMappingURL=z-toast-notification-list.js.map