@zywave/zui-bundle/dist/zui-bundle.js

ZUI, out of the box, provides ES modules with bare path modifiers (e.g. `import '@zywave/zui-foo-bar'`). This is great as that's the way browsers are _going_, but they aren't there quite yet. Tooling exists to help solve this problem like webpack or rollu

import{i as e,n as t,Z as i,x as o,c as r,a as s,d as a,E as n,t as l,T as d,f as c,g as h,u,B as p}from"./internals/_def61d4d.js";import{e as g,o as b}from"./internals/_27151a9c.js";import{s as m,r as v}from"./internals/_9175c937.js";import{n as f}from"./internals/_0e55c1bc.js";import{o as y}from"./internals/_f2c0bbb6.js";function z(e,t){if(!e)return null;for(const i of e.assignedNodes({flatten:!0}))if(i.nodeType===Node.ELEMENT_NODE){const e=i;if(e.matches(t))return e}return null}function w(e,t){const i=[];if(!e)return i;for(const o of e.assignedNodes({flatten:!0}))if(o.nodeType===Node.ELEMENT_NODE){const e=o;e.matches(t)&&i.push(e)}return i}const x=e`:host{display:flex;width:100%;flex-wrap:wrap;align-items:center;line-height:1.6}:host .show-all-button{display:inline-flex;align-items:center;margin:0 .625rem 0 0;padding:0;background:rgba(0,0,0,0);border:0;font-weight:700;line-height:inherit;cursor:pointer;color:var(--zui-blue-500);transition:color .25s ease-out}:host .show-all-button:hover{color:var(--zui-blue-700)}:host .show-all-button:focus{box-shadow:inset 0 0 0 1px var(--zui-blue);outline:0}:host .show-all-button zui-icon[icon=zui-left]{--zui-icon-size:1rem;width:1rem;margin-right:.1875rem}:host ::slotted(zui-breadcrumb:last-of-type:not(:first-of-type)){color:var(--zui-gray-400)}@media(max-width:44.9375rem){:host ::slotted(zui-breadcrumb){display:none}:host ::slotted(zui-breadcrumb:nth-last-of-type(2)){display:inline-flex}:host ::slotted(zui-breadcrumb:first-of-type:last-of-type){display:inline-flex}}`;var k=function(e,t,i,o){var r,s=arguments.length,a=s<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,o);else for(var n=e.length-1;n>=0;n--)(r=e[n])&&(a=(s<3?r(a):s>3?r(t,i,a):r(t,i))||a);return s>3&&a&&Object.defineProperty(t,i,a),a};class _ extends i{constructor(){super(...arguments),this.showAll=!1,this.visibleCount=4,this._isMobile=!1}static get styles(){return[super.styles,x]}get _slottedBreadcrumbs(){return w(this._slotEl,"zui-breadcrumb")}get _slottedFirstBreadcrumb(){return z(this._slotElFirstBreadcrumb,"zui-breadcrumb")}get _listOfBreadcrumbsToTruncate(){return this._slottedBreadcrumbs.slice(0,this._slottedBreadcrumbs.length-(this.visibleCount-1))}get _listOfBreadcrumbsToReveal(){return this._slottedBreadcrumbs.slice(this._slottedBreadcrumbs.length-(this.visibleCount-1),this._slottedBreadcrumbs.length)}get _isTruncated(){return!(this.showAll||this._isMobile||this.visibleCount>=this._slottedBreadcrumbs.length+1)}_onClickRevealHiddenBreadcrumbs(){this._listOfBreadcrumbsToTruncate.forEach((e=>{e.removeAttribute("style")})),this.showAll=!0,this.requestUpdate()}_moveFirstBreadcrumbToFirstSlot(){const e=this._slottedBreadcrumbs,t=this._slottedBreadcrumbs[0];for(let t=1;t<e.length;t++)e[t].removeAttribute("slot");t&&t.setAttribute("slot","first")}_hideBreadcrumbs(e){e.forEach((e=>{e.style.display="none"}))}_unhideBreadcrumbs(e){e.forEach((e=>{e.removeAttribute("style")}))}_setupMediaQueryListener(){const e=window.matchMedia(`(max-width: ${(()=>{const e=m.xsmall.split("em");return parseInt(e[0])-1/16+"em"})()})`);e.addEventListener("change",function(e,t=50,i){let o;return function(...r){const s=this,a=i&&void 0===o;void 0!==o&&clearTimeout(o),o=setTimeout((function(){o=void 0,i||e.apply(s,r)}),t),a&&e.apply(s,r)}}((e=>{this._isMobile=e.matches,this._isTruncated?this._hideBreadcrumbs(this._listOfBreadcrumbsToTruncate):this._unhideBreadcrumbs(this._listOfBreadcrumbsToTruncate),this.requestUpdate()}),100)),this._isMobile=e.matches}firstUpdated(e){super.firstUpdated(e),this._setupMediaQueryListener(),this._moveFirstBreadcrumbToFirstSlot(),this._isTruncated&&(this.requestUpdate(),this._hideBreadcrumbs(this._listOfBreadcrumbsToTruncate)),this._slotElFirstBreadcrumb.addEventListener("slotchange",(()=>{this._slottedFirstBreadcrumb||(this._moveFirstBreadcrumbToFirstSlot(),this._slottedFirstBreadcrumb.removeAttribute("style"),this._isTruncated&&(this._unhideBreadcrumbs(this._listOfBreadcrumbsToReveal),this._hideBreadcrumbs(this._listOfBreadcrumbsToTruncate)),this.requestUpdate())})),this._slotEl.addEventListener("slotchange",(()=>{this._isTruncated?(this._unhideBreadcrumbs(this._listOfBreadcrumbsToReveal),this._hideBreadcrumbs(this._listOfBreadcrumbsToTruncate)):this._unhideBreadcrumbs(this._slottedBreadcrumbs),this.requestUpdate()}))}render(){return o`<slot name="first"></slot>${this._isTruncated?o`<button class="show-all-button" @click="${this._onClickRevealHiddenBreadcrumbs}"><zui-icon icon="zui-left"></zui-icon><span>...</span></button>`:""}<slot></slot>`}}k([t({type:Boolean,attribute:"show-all"})],_.prototype,"showAll",void 0),k([t({type:Number,attribute:"visible-count"})],_.prototype,"visibleCount",void 0),k([g('slot:not([name="first"])')],_.prototype,"_slotEl",void 0),k([g('slot[name="first"]')],_.prototype,"_slotElFirstBreadcrumb",void 0),window.customElements.define("zui-breadcrumbs",_);const S=e`:host{display:inline-flex;align-items:center;line-height:inherit;cursor:pointer;color:var(--zui-blue-500);transition:color .25s ease-out}@media(max-width:44.9375rem){:host{width:calc(100% - 1rem - .1875rem - .0625rem)}}:host(:hover){color:var(--zui-blue-400)}:host(:focus){box-shadow:inset 0 0 0 1px var(--zui-blue);outline:0}:host(:active){color:var(--zui-blue-600)}:host(:first-of-type:last-of-type),:host(:not(:last-of-type)){margin-right:.625rem}zui-icon[icon=zui-left]{--zui-icon-size:1rem;margin-right:.1875rem}::slotted(*){display:inline-block;max-width:30ch;overflow-x:hidden;margin:0;padding:0;background:0 0;border:0;outline:0;font:inherit;line-height:inherit!important;text-align:left;white-space:nowrap;cursor:inherit;color:inherit;transition:inherit;text-overflow:ellipsis;text-decoration:none}@media(max-width:44.9375rem){::slotted(*){width:calc(100% - 1rem - .1875rem - .0625rem);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}}:host([expand-text]) ::slotted(*){max-width:none}`;var $=function(e,t,i,o){var r,s=arguments.length,a=s<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,o);else for(var n=e.length-1;n>=0;n--)(r=e[n])&&(a=(s<3?r(a):s>3?r(t,i,a):r(t,i))||a);return s>3&&a&&Object.defineProperty(t,i,a),a};class C extends i{constructor(){super(...arguments),this.expandText=!1}get _slottedControl(){return z(this._slotEl,"a,button,div")}connectedCallback(){super.connectedCallback(),this.setAttribute("role","button");const e=[13,32];this.addEventListener("keydown",(t=>{e.includes(t.keyCode)&&(this.focus(),t.preventDefault(),t.stopPropagation())})),this.addEventListener("keyup",(t=>{e.includes(t.keyCode)&&(this.click(),t.preventDefault(),t.stopPropagation())})),this.addEventListener("click",(e=>{this._slottedControl&&!e.composedPath().includes(this._slottedControl)&&this._slottedControl.click()}))}_setTabIndex(){this._slottedControl?(this._slottedControl.setAttribute("tabindex","-1"),this.tabIndex=0):this.tabIndex=0}static get styles(){return[super.styles,S]}firstUpdated(e){super.firstUpdated(e),this._setTabIndex()}render(){return o`<zui-icon icon="zui-left"></zui-icon><slot></slot>`}}$([g("slot")],C.prototype,"_slotEl",void 0),$([t({type:Boolean,attribute:"expand-text",reflect:!0})],C.prototype,"expandText",void 0),window.customElements.define("zui-breadcrumb",C);const O=e`:host{display:inline-flex}:host div{display:flex;height:2.25rem;flex-grow:0;flex-shrink:0;justify-content:center;align-items:center;padding:0 .9375rem;background:var(--zui-button-color,var(--zui-blue));border:0;border-radius:var(--zui-button-border-radius,1.25rem);box-shadow:var(--zui-button-box-shadow,none);outline:0;font:inherit;font-weight:600;line-height:1.25rem;text-align:center;cursor:pointer;color:var(--zui-button-text-color,#fff);transition:background .1s ease-out,box-shadow .1s ease-out,color .1s ease-out;user-select:none}:host div ::slotted(a){background:inherit!important;color:inherit!important;text-decoration:none!important}:host div ::slotted(button){margin:0!important;padding:0!important;background:rgba(0,0,0,0)!important;border:0!important;outline:0!important;font:inherit!important;cursor:inherit!important;color:inherit!important}:host div ::slotted(svg),:host div ::slotted(zui-icon),:host div ::slotted(zui-svg){--zui-icon-size:1rem;--zui-svg-width:1rem;--zui-svg-height:1rem;display:inline-block;width:1rem;height:1rem;vertical-align:middle;margin-right:.625rem;margin-left:0;fill:var(--zui-button-icon-color,currentColor)}:host(:hover) div{background:var(--zui-button-hover-color,var(--zui-blue-400));color:var(--zui-button-text-hover-color,var(--zui-button-text-color,#fff));text-decoration:none}:host(:focus){outline:0}:host(:focus) div{background:var(--zui-button-focus-color,var(--zui-button-hover-color,var(--zui-blue)));box-shadow:var(--zui-button-box-shadow-focus,0 0 0 .0625rem #fff,0 0 0 .125rem var(--zui-button-focus-color,var(--zui-button-hover-color,var(--zui-blue))));outline:0;color:var(--zui-button-text-focus-color,var(--zui-button-text-hover-color,var(--zui-button-text-color,#fff)))}:host(:active) div{background:var(--zui-button-active-color,var(--zui-blue-600));box-shadow:var(--zui-button-box-shadow,none);outline:0}:host([disabled]){pointer-events:none}:host([disabled]) div{background:var(--zui-gray-200);box-shadow:var(--zui-button-box-shadow,none);outline:0;color:var(--zui-gray);transform:none}:host([disabled]) div ::slotted(*){pointer-events:none}:host([disabled]) div ::slotted(svg),:host([disabled]) div ::slotted(zui-icon),:host([disabled]) div ::slotted(zui-svg){fill:var(--zui-gray)}:host(.secondary) div,:host([type~=secondary]) div{background:rgba(0,0,0,0);box-shadow:var(--zui-button-secondary-box-shadow,inset 0 0 0 .0625rem var(--zui-gray-200));color:var(--zui-button-text-color,var(--zui-button-color,var(--zui-blue)))}:host(.secondary:hover) div,:host([type~=secondary]:hover) div{background:rgba(0,0,0,0);box-shadow:var(--zui-button-secondary-box-shadow-hover,inset 0 0 0 .0625rem var(--zui-button-hover-color,var(--zui-blue-400)))}:host(.secondary:focus) div,:host([type~=secondary]:focus) div{background:rgba(0,0,0,0);box-shadow:var(--zui-button-secondary-box-shadow-focus,inset 0 0 0 .0625rem var(--zui-gray-200),0 0 0 .0625rem #fff,0 0 0 .125rem var(--zui-button-focus-color,var(--zui-button-hover-color,var(--zui-blue))))}:host(.secondary:active) div,:host([type~=secondary]:active) div{background:rgba(0,0,0,0);box-shadow:var(--zui-button-secondary-box-shadow-active,inset 0 0 0 .0625rem var(--zui-button-hover-color,var(--zui-blue-600)))}:host(.secondary[disabled]) div,:host([type~=secondary][disabled]) div{box-shadow:var(--zui-button-secondary-box-shadow,inset 0 0 0 .0625rem var(--zui-gray-200));color:var(--zui-gray-400)}:host(.link) div,:host([type~=link]) div{background:rgba(0,0,0,0);color:var(--zui-link-button-text-color,var(--zui-button-color,var(--zui-blue)))}:host(.link:hover) div,:host([type~=link]:hover) div{background:var(--zui-link-button-hover-color,var(--zui-gray-100))}:host(.link:focus) div,:host([type~=link]:focus) div{box-shadow:inset 0 0 0 .0625rem var(--zui-link-button-text-color,var(--zui-button-focus-color,var(--zui-button-hover-color,var(--zui-blue))))}:host(.link:active) div,:host([type~=link]:active) div{background:var(--zui-link-button-active-color,var(--zui-gray-200));box-shadow:none}:host(.link[disabled]) div,:host([type~=link][disabled]) div{color:var(--zui-gray)}:host(.danger) div,:host([danger]) div{background:var(--zui-red);color:#fff}:host(.danger:hover) div,:host([danger]:hover) div{background:var(--zui-red-400)}:host(.danger:focus) div,:host([danger]:focus) div{background:var(--zui-red);box-shadow:0 0 0 .0625rem #fff,0 0 0 .125rem var(--zui-red)}:host(.danger:active) div,:host([danger]:active) div{background:var(--zui-red-600);box-shadow:none}:host(.danger[disabled]) div,:host([danger][disabled]) div{background:var(--zui-gray-200);color:var(--zui-gray)}:host(.secondary[danger]) div,:host([type~=secondary][danger]) div{background:rgba(0,0,0,0);color:var(--zui-red)}:host(.secondary[danger]:hover) div,:host([type~=secondary][danger]:hover) div{background:rgba(0,0,0,0);box-shadow:inset 0 0 0 .0625rem var(--zui-red-400)}:host(.secondary[danger]:focus) div,:host([type~=secondary][danger]:focus) div{background:rgba(0,0,0,0);box-shadow:inset 0 0 0 .0625rem var(--zui-gray-200),0 0 0 .0625rem #fff,0 0 0 .125rem var(--zui-red)}:host(.secondary[danger]:active) div,:host([type~=secondary][danger]:active) div{background:rgba(0,0,0,0);box-shadow:inset 0 0 0 .0625rem var(--zui-red-600);color:var(--zui-red-600)}:host([type~=link][danger]) div{background:rgba(0,0,0,0);color:var(--zui-red)}:host([type~=link][danger]:hover) div{background:var(--zui-gray-100)}:host([type~=link][danger]:focus) div{box-shadow:inset 0 0 0 .0625rem var(--zui-red)}:host([type~=link][danger]:active) div{background:var(--zui-gray-200);box-shadow:none;color:var(--zui-red-600)}:host([type~=link][danger][disabled]) div{color:var(--zui-gray)}:host(.icon-right) div ::slotted(svg),:host(.icon-right) div ::slotted(zui-icon),:host(.icon-right) div ::slotted(zui-svg),:host([icon-right]) div ::slotted(svg),:host([icon-right]) div ::slotted(zui-icon),:host([icon-right]) div ::slotted(zui-svg){margin-right:0;margin-left:.625rem}:host(.icon-only) div,:host([icon]) div{width:var(--zui-button-width,2.25rem);height:2.25rem;margin:0;padding:var(--zui-button-padding,0);border-radius:var(--zui-button-border-radius,50%)}:host(.icon-only) div ::slotted(svg),:host(.icon-only) div ::slotted(zui-icon),:host(.icon-only) div ::slotted(zui-svg),:host([icon]) div ::slotted(svg),:host([icon]) div ::slotted(zui-icon),:host([icon]) div ::slotted(zui-svg){width:1rem;height:1rem;margin:0}:host([block]){display:block;width:100%}:host([block]) div{width:100%}`;var E=function(e,t,i,o){var r,s=arguments.length,a=s<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,o);else for(var n=e.length-1;n>=0;n--)(r=e[n])&&(a=(s<3?r(a):s>3?r(t,i,a):r(t,i))||a);return s>3&&a&&Object.defineProperty(t,i,a),a};const A=["Space","Enter"];class N extends i{constructor(){super(...arguments),this.type="primary",this.icon=!1,this.iconRight=!1,this.block=!1,this.danger=!1,this.disabled=!1}get _slottedControl(){return z(this._slotEl,"a,button")}get _hasWrappedAnchor(){return!!this.parentElement&&"a"===this.parentElement.nodeName.toLowerCase()}firstUpdated(){this._setTabIndex(),this.setAttribute("role","button"),this._slottedControl&&(this._slottedControl.tabIndex=-1),this.addEventListener("keydown",(e=>{this._onKeydown(e)})),this.addEventListener("keyup",(e=>{this._onKeyup(e)})),this.addEventListener("click",(e=>{e.composedPath().includes(this._wrapperDivEl)||this._onClick(e)}))}updated(e){e.has("disabled")&&this._setTabIndex()}_setTabIndex(){this.disabled||this._hasWrappedAnchor?this.removeAttribute("tabindex"):this.tabIndex=0}static get styles(){return[super.styles,O]}render(){return o`<div part="button" @click="${this._onClick}" @keyup="${this._onKeyup}" @keydown="${this._onKeydown}"><slot></slot></div>`}_onClick(e,t){if(this.disabled)return e.preventDefault(),e.stopPropagation(),!1;t?this.click():this._slottedControl&&!e.composedPath().includes(this._slottedControl)&&this._slottedControl.click()}_onKeyup(e){A.includes(e.code)&&this._onClick(e,!0)}_onKeydown(e){A.includes(e.code)&&(this.disabled||(this.focus(),e.preventDefault(),e.stopPropagation()))}}E([t({type:String,reflect:!0})],N.prototype,"type",void 0),E([t({type:Boolean,reflect:!0})],N.prototype,"icon",void 0),E([t({type:Boolean,reflect:!0,attribute:"icon-right"})],N.prototype,"iconRight",void 0),E([t({type:Boolean,reflect:!0})],N.prototype,"block",void 0),E([t({type:Boolean,reflect:!0})],N.prototype,"danger",void 0),E([t({type:Boolean,reflect:!0})],N.prototype,"disabled",void 0),E([g("slot")],N.prototype,"_slotEl",void 0),E([g("div")],N.prototype,"_wrapperDivEl",void 0),window.customElements.define("zui-button",N);const T=e`:host div{display:inline-flex;width:3.25rem;height:3.25rem;justify-content:center;align-items:center;padding:0;background-color:var(--zui-button-color,var(--zui-blue));border:0;border-radius:50%;box-shadow:0 .25rem .5rem 0 rgba(0,0,0,.25);cursor:pointer;color:var(--zui-button-text-color,#fff);transition:box-shadow .1s ease-in-out;user-select:none;box-sizing:border-box;text-decoration:none}:host div ::slotted(svg),:host div ::slotted(zui-icon),:host div ::slotted(zui-svg){display:inline-block;width:var(--zui-button-icon-size,var(--zui-icon-size,1.5rem));height:var(--zui-button-icon-size,var(--zui-icon-size,1.5rem));font-size:var(--zui-button-icon-size, 1.875rem);font-weight:400;font-style:normal;line-height:1;letter-spacing:normal;text-transform:none;white-space:nowrap;fill:var(--zui-floating-action-button-icon-color,currentColor);direction:ltr;word-wrap:normal}:host div:hover{background-color:var(--zui-button-hover-color,var(--zui-blue-400));box-shadow:0 .4375rem .75rem 0 rgba(0,0,0,.25);text-decoration:none}:host div:focus{background-color:var(--zui-button-hover-color,var(--zui-blue));outline:0}:host div:active{background-color:var(--zui-button-active-color,var(--zui-blue-600))}:host([disabled]){pointer-events:none}:host([disabled]) div{background-color:var(--zui-gray-200);box-shadow:none;outline:0;color:var(--zui-gray)}:host([disabled]) div ::slotted(*){pointer-events:none}:host([disabled]) div ::slotted(svg),:host([disabled]) div ::slotted(zui-icon),:host([disabled]) div ::slotted(zui-svg){fill:var(--zui-gray-400)!important}`;var R=function(e,t,i,o){var r,s=arguments.length,a=s<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,o);else for(var n=e.length-1;n>=0;n--)(r=e[n])&&(a=(s<3?r(a):s>3?r(t,i,a):r(t,i))||a);return s>3&&a&&Object.defineProperty(t,i,a),a};class P extends i{constructor(){super(...arguments),this.disabled=!1}connectedCallback(){super.connectedCallback(),this.setAttribute("role","button"),this.addEventListener("click",(e=>{if(this.disabled)return e.preventDefault(),e.stopPropagation(),!1}))}static get styles(){return[super.styles,T]}render(){return o`<div tabindex="1"><slot></slot></div>`}}R([t({type:Boolean,attribute:"disabled"})],P.prototype,"disabled",void 0),window.customElements.define("zui-fab",P);const L=e`:host{contain:none;display:inline-flex}.zui-button-group{display:inline-flex}::slotted(zui-button),::slotted(zui-button-dropdown){--zui-button-border-radius:0;--zui-button-box-shadow:inset 0.0625rem 0 0 0 var(--zui-button-group-divider-color, #fff);--zui-button-box-shadow-focus:inset 0.0625rem 0 0 0 var(--zui-button-group-divider-color, #fff),inset 0.125rem 0 0 0 var(--zui-button-focus-color, var(--zui-button-hover-color, var(--zui-blue))),inset 0 0 0 0.0625rem var(--zui-button-focus-color, var(--zui-button-hover-color, var(--zui-blue))),inset 0.1875rem 0 0 0 #fff,inset 0 0 0 0.125rem #fff;--zui-button-secondary-box-shadow:inset 0 -0.0625rem 0 0 var(--zui-gray-200),inset 0 0.0625rem 0 0 var(--zui-gray-200),inset 0.0625rem 0 0 0 var(--zui-gray-200);--zui-button-secondary-box-shadow-focus:inset 0 0.0625rem 0 0 var(--zui-gray-200),inset 0 -0.0625rem 0 0 var(--zui-gray-200),inset 0.0625rem 0 0 0 var(--zui-gray-200),inset 0 0.125rem 0 0 #fff,inset -0.0625rem 0 0 0 #fff,inset 0 -0.125rem 0 0 #fff,inset 0.125rem 0 0 0 #fff,inset 0 0.1875rem 0 0 var(--zui-button-focus-color, var(--zui-button-hover-color, var(--zui-blue))),inset -0.125rem 0 0 0 var(--zui-button-focus-color, var(--zui-button-hover-color, var(--zui-blue))),inset 0 -0.1875rem 0 0 var(--zui-button-focus-color, var(--zui-button-hover-color, var(--zui-blue))),inset 0.1875rem 0 0 0 var(--zui-button-focus-color, var(--zui-button-hover-color, var(--zui-blue)))}::slotted(zui-button-dropdown:first-child),::slotted(zui-button:first-child){--zui-button-border-radius:1.25rem 0 0 1.25rem!important}::slotted(zui-button-dropdown:last-child),::slotted(zui-button:last-child){--zui-button-border-radius:0 1.25rem 1.25rem 0!important;--zui-button-secondary-box-shadow:inset 0 0 0 0.0625rem var(--zui-gray-200);--zui-button-secondary-box-shadow-focus:inset 0 0 0 0.0625rem var(--zui-gray-200),inset 0 0 0 0.125rem #fff,inset 0 0 0 0.1875rem var(--zui-button-focus-color, var(--zui-button-hover-color, var(--zui-blue)))}::slotted(zui-button-dropdown:first-child),::slotted(zui-button-dropdown:last-child),::slotted(zui-button-dropdown[icon]),::slotted(zui-button-dropdown[type=icon]),::slotted(zui-button.icon-only),::slotted(zui-button[icon]){--zui-button-width:3.1875rem;--zui-button-padding:0 0.9375rem}::slotted(zui-button-dropdown:only-child),::slotted(zui-button:only-child){--zui-button-border-radius:1.25rem!important}`;window.customElements.define("zui-button-group",class extends i{static get styles(){return[super.styles,L]}render(){return o`<div class="zui-button-group"><slot></slot></div>`}});const I=e`:host{contain:none;position:relative;display:inline-flex}:host .menu{contain:layout;position:absolute;top:2.25rem;left:0;display:none;width:12.5rem;z-index:1;flex-direction:column;padding-top:.375rem;padding-bottom:.375rem;background-color:#fff;border-radius:.25rem;box-shadow:rgba(0,0,0,.04) 0 .25rem .375rem .125rem,rgba(0,0,0,.06) 0 .125rem .625rem .1875rem,rgba(0,0,0,.02) 0 .25rem .3125rem -.125rem}:host .menu ::slotted(a),:host .menu ::slotted(button){display:flex;align-items:center;padding:.625rem .9375rem!important;font-weight:400;text-align:left;cursor:pointer;color:var(--zui-gray-800);transition:background-color .3s ease;gap:.625rem}:host .menu ::slotted(a:focus),:host .menu ::slotted(a:hover),:host .menu ::slotted(button:focus),:host .menu ::slotted(button:hover){background-color:var(--zui-gray-100);border:0;box-shadow:none;outline:0}:host .menu ::slotted(button){background-color:rgba(0,0,0,0);border:0;outline:0;font:inherit}:host .menu ::slotted(:-moz-focusring){outline:0!important}:host .menu ::slotted(button[disabled]){color:var(--zui-gray-400)!important;pointer-events:none}:host .menu ::slotted(button[disabled]:hover){background-color:rgba(0,0,0,0)}:host .menu ::slotted(a){text-decoration:none!important}:host([open]){z-index:1}:host([open]) .menu{display:flex}:host(:not([icon])) zui-icon{margin:0 0 0 .625rem}:host ::slotted(:not([slot=option])){pointer-events:none}`;var B=function(e,t,i,o){var r,s=arguments.length,a=s<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,o);else for(var n=e.length-1;n>=0;n--)(r=e[n])&&(a=(s<3?r(a):s>3?r(t,i,a):r(t,i))||a);return s>3&&a&&Object.defineProperty(t,i,a),a};class M extends i{constructor(){super(...arguments),this.open=!1,this.disabled=!1,this.type="primary",this.icon=!1}static get styles(){return[super.styles,I]}connectedCallback(){super.connectedCallback(),this.addEventListener("keydown",(e=>{if(this.open){e.shiftKey&&"Tab"===e.code&&(e.preventDefault(),e.stopPropagation(),this.#e()),"Tab"===e.code&&(e.preventDefault(),e.stopPropagation(),this.#e(),this.shadowRoot.querySelector("zui-button").focus()),"Enter"!==e.code&&"Space"!==e.code||(e.preventDefault(),document.activeElement.click(),this.shadowRoot.querySelector("zui-button").focus()),"Escape"===e.code&&this.#e();if(["ArrowUp","ArrowDown"].includes(e.code)){const t=Array.from(this.querySelectorAll("a:not([disabled]),button:not([disabled])")),i=document.activeElement;let o=t.findIndex((e=>e===i));if(-1!==o)if("ArrowDown"===e.code){const e=o+1;o=e===t.length?t.length-1:e}else{const e=o-1;o=e<0?0:e}else o=0;t[o].focus(),e.preventDefault(),e.stopPropagation()}}["Space","Enter"].includes(e.code)&&this.#e()}),{capture:!0}),document.addEventListener("click",(e=>{e.composedPath().includes(this)||(this.open=!1)}))}updated(e){super.updated(e),this._chevronIcon&&(this._chevronIcon.style.transition="transform .3s ease-out",this._chevronIcon.style.transform=this.open?"rotate(-180deg)":""),(this.type.includes("icon")||this.type.includes("icon-only")||this.icon)&&this._zuiButton.setAttribute("icon",""),(this.type.includes("icon-right")||this.hasAttribute("icon-right"))&&this._zuiButton.setAttribute("icon-right",""),(this.type.includes("danger")||this.hasAttribute("danger"))&&this._zuiButton.setAttribute("danger","")}render(){return o`<zui-button type="${this.#t()}" @click="${this.#e}" ?disabled="${this.disabled}"><slot></slot>${this.icon||this.type.includes("icon")?o``:o`<zui-icon icon="zui-down"></zui-icon>`}</zui-button><div part="menu" class="menu"><slot name="option" @click="${()=>this.open=!1}"></slot></div>`}#t(){return this.type.includes("primary")?"primary":this.type.includes("secondary")?"secondary":this.type.includes("link")?"link":""}#e(){this.open=!this.open}}B([t({type:Boolean,reflect:!0})],M.prototype,"open",void 0),B([t({type:Boolean,reflect:!0})],M.prototype,"disabled",void 0),B([t({type:String,reflect:!0})],M.prototype,"type",void 0),B([t({type:Boolean,reflect:!0})],M.prototype,"icon",void 0),B([g("zui-icon")],M.prototype,"_chevronIcon",void 0),B([g("zui-button")],M.prototype,"_zuiButton",void 0),window.customElements.define("zui-button-dropdown",M);const D=e`:host{contain:none;position:relative;display:block;width:auto;flex-wrap:wrap;margin:var(--zui-card-margin,0 0 1.875rem);background-color:var(--zui-card-background-color,#fff);border-radius:.125rem;box-shadow:0 .0625rem .1875rem rgba(0,0,0,.16)}.container{width:100%;height:100%;padding:1.25rem;transition:.2s padding ease-in-out;box-sizing:border-box}@media(min-width:80em){.container{padding:1.875rem}}.container ::slotted(.header){margin-bottom:0;font-size:var(--zui-card-header-text);font-weight:600;color:var(--zui-card-header-color,inherit)}.container ::slotted(.footer){display:flex;justify-content:flex-end;margin:var(--zui-card-footer-margin,1.875rem 0 0);background-color:var(--zui-card-footer-background-color,#fff)}.container ::slotted(.footer.align-left){justify-content:flex-start}`;window.customElements.define("zui-card",class extends i{static get styles(){return[super.styles,D]}render(){return o`<div part="content" class="container"><slot></slot></div>`}});const j=e`:host{display:inline-flex;outline:0;font-size:inherit;cursor:pointer}:host .checkbox-container{position:relative;display:flex}:host .checkbox{position:relative;display:flex;width:1.25rem;height:1.25rem;flex-shrink:0;justify-content:center;align-items:center;margin:var(--zui-checkbox-checkbox-margin,.6875rem .6875rem .6875rem 0);background:#fff;border:.125rem solid var(--zui-gray);border-radius:.125rem;transition:border 125ms ease-out,opacity 125ms ease-out}:host .checkbox .checkmark-container{position:relative;display:flex;width:.75rem;height:.75rem;justify-content:center;align-items:center;transform:rotate(-50deg)}:host .checkbox .checkmark{position:absolute;top:.1875rem;left:.0625rem;display:block;width:.75rem;height:.35rem;border:solid transparent;border-width:0 0 .125rem .125rem;transform-origin:left top;border-bottom-left-radius:.09375rem}:host .checkbox .indeterminate-container{display:flex;width:.75rem;height:.75rem;justify-content:center;align-items:center}:host .checkbox .indeterminate{width:.75rem;height:0;border:solid #fff;border-width:.0625rem;border-radius:.0625rem}:host .label{display:block;width:100%;margin:var(--zui-checkbox-label-margin,.5625rem 1.25rem .5625rem 0)}:host .label .icon{display:none}:host .label .icon ::slotted(*){display:block}:host(:hover) .checkbox{border-color:var(--zui-gray-600)}:host(:hover) .checkbox .checkmark{border-color:transparent}:host([checked]) .checkbox{background:var(--zui-checkbox-color,var(--zui-blue));border-color:var(--zui-checkbox-color,var(--zui-blue))}:host([checked]) .checkbox .checkmark{border-color:#fff}:host([checked]) .checkbox.checked-changed .checkmark{animation:check .5s}:host([checked]) .checkbox.checked-changed .animate{position:absolute;top:0;right:0;bottom:0;left:-.125rem;width:2.625rem;height:2.625rem;margin:auto auto auto -.6875rem;background:var(--zui-checkbox-animate-color,var(--zui-blue-200));border-radius:.125rem;animation:scaleIn .35s ease-in-out forwards}:host(:hover[checked]) .checkbox{opacity:.9}:host(:hover[checked]) .checkbox .checkmark{border-color:#fff}:host([indeterminate]) .checkbox{background:var(--zui-checkbox-color,var(--zui-blue));border-color:var(--zui-checkbox-color,var(--zui-blue))}:host([indeterminate]) .checkbox .indeterminate{border-color:#fff}:host([indeterminate]) .checkbox.checked-changed .indeterminate{animation:indeterminate 250ms}:host([indeterminate]) .checkbox.checked-changed .animate{position:absolute;top:0;right:0;bottom:0;left:-.125rem;width:2.625rem;height:2.625rem;margin:auto auto auto -.6875rem;background:var(--zui-checkbox-animate-color,var(--zui-blue-200));border-radius:.125rem;animation:scaleIn .35s ease-in-out forwards}:host(:hover[indeterminate]) .checkbox{opacity:.9}:host(:hover[indeterminate]) .checkbox .indeterminate{border-color:#fff}:host([disabled]){cursor:not-allowed}:host([disabled]) .checkbox{border-color:var(--zui-gray-200)}:host([disabled]) .label{color:var(--zui-gray-300)}:host([disabled][checked]) .checkbox{background:var(--zui-gray-200)}:host([disabled][checked]) .checkbox .animate{background:var(--zui-gray-200)}:host(.gallery) .checkbox-container{position:relative;width:100%;max-width:var(--zui-checkbox-gallery-width,8.125rem);padding:1.875rem;background:#fff;border:.0625rem solid transparent;border-radius:.375rem;box-shadow:0 .0625rem .1875rem 0 rgba(0,0,0,.16);transition:background .3s ease-out,border .3s ease-out,box-shadow .3s ease-out}:host(.gallery) .checkbox-container:hover{background:var(--zui-gray-50);box-shadow:0 .1875rem .375rem 0 rgba(0,0,0,.16)}:host(.gallery) .checkbox-container:hover .checkbox{background:rgba(0,0,0,0)}:host(.gallery) .checkbox{position:absolute;top:-.375rem;left:-.375rem;margin:.6875rem;transition:opacity .3s ease-out,background .3s ease-out}:host(.gallery) .label{display:block;margin:0;text-align:center}:host(.gallery) .label .icon{display:block;width:100%;padding-bottom:.9375rem}:host(.gallery) .label .icon *{max-width:100%;margin:0 auto}:host(.gallery) .label .label-text{font-weight:600}:host(.gallery[checked]) .checkbox-container{background:var(--zui-checkbox-gallery-background,var(--zui-blue-100));border:.0625rem solid var(--zui-checkbox-color,var(--zui-blue));box-shadow:none}:host(.gallery[checked]) .checkbox-container:hover{border-color:var(--zui-checkbox-hover-color,var(--zui-blue-600))}:host(.gallery[checked]) .checkbox-container:hover .checkbox{background:var(--zui-checkbox-color,var(--zui-blue))}:host(.gallery[checked]) .checkbox{background:var(--zui-checkbox-color,var(--zui-blue));border-color:var(--zui-checkbox-color,var(--zui-blue))}:host(.gallery[disabled]) .checkbox-container,:host(.gallery[disabled]) .checkbox-container:hover{background:var(--zui-gray-100);border:0;box-shadow:none}:host(.gallery[disabled]) .checkbox{background:rgba(0,0,0,0);border-color:var(--zui-gray-200)}:host(.gallery[disabled]) .checkbox .checkmark{border-color:transparent}:host(.gallery[disabled]) .label .icon{opacity:.5}:host(.gallery[checked][disabled]) .checkbox-container:hover .checkbox{background:var(--zui-gray-200)}:host(.gallery[checked][disabled]) .checkbox{background:var(--zui-gray-200);border-color:var(--zui-gray-200)}:host(.gallery[checked][disabled]) .checkbox .checkmark{border-color:#fff}:host(.gallery.no-dropshadow) .checkbox-container{border:.0625rem solid var(--zui-gray-300);box-shadow:none}:host(.gallery.no-dropshadow) .checkbox-container:hover{background:var(--zui-gray-50)}:host(.gallery.no-dropshadow[checked]) .checkbox-container:hover{background:var(--zui-checkbox-gallery-color,var(--zui-blue-100))}@keyframes check{0%{width:0;height:0}33%{width:0;height:.35rem}66%{width:.6875rem;height:.35rem}}@keyframes scaleIn{from{opacity:.5;transform:scale(.5,.5)}to{opacity:0;transform:scale(1,1)}}@keyframes indeterminate{0%{width:0}50%{width:.34375rem}100%{width:.6875rem}}`;var U=function(e,t,i,o){var r,s=arguments.length,a=s<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,o);else for(var n=e.length-1;n>=0;n--)(r=e[n])&&(a=(s<3?r(a):s>3?r(t,i,a):r(t,i))||a);return s>3&&a&&Object.defineProperty(t,i,a),a};class V extends r{constructor(){super(...arguments),this.#i=!1,this.checked=!1,this.value="on",this.indeterminate=!1,this.#o=!1,this.#r=!1}get _formValue(){return this.checked?this.value:null}get _focusControlSelector(){return".checkbox"}#i;#o;#r;formResetCallback(){this.checked=this.#i,this._setFormValue(this._formValue)}connectedCallback(){super.connectedCallback();const e=this.checked||this.hasAttribute("checked"),t=this.value||this.getAttribute("value");this.#i=e,this._setFormValue(e?t:null),this.setAttribute("role","checkbox"),this.addEventListener("click",this.#s),this.addEventListener("keydown",this.#a)}firstUpdated(e){super.firstUpdated(e),this.#o=!0,this.requestUpdate()}update(e){super.update(e),e.has("value")&&this._setFormValue(this._formValue),e.has("checked")&&this.#o&&(this.#r=!0,this.requestUpdate())}#a(e){this.disabled||"Enter"!==e.key&&" "!==e.key||(this.#n(),e.preventDefault(),e.stopPropagation())}#s(e){this.disabled||this.#n(),e.preventDefault(),e.stopPropagation()}#n(){this.checked=!this.checked,this.indeterminate=!1,this._setFormValue(this._formValue),this.dispatchEvent(new CustomEvent("change",{detail:{checked:this.checked},bubbles:!0}))}#l(){this.checked?this.setAttribute("aria-checked","true"):this.setAttribute("aria-checked","false")}#d(){this.disabled?this.setAttribute("aria-disabled","true"):this.setAttribute("aria-disabled","false")}static get styles(){return[super.styles,j]}render(){this.#l(),this.#d();const e=this.disabled?"-1":"0";return o`<section class="checkbox-container" @click="${this.#s}" @keydown="${this.#a}"><div class="checkbox ${s({"checked-changed":this.#r})}" tabindex="${e}">${this.indeterminate?o`<div class="indeterminate-container"><div class="indeterminate"></div></div>`:o`<div class="checkmark-container"><div class="checkmark"></div></div>`}<div class="animate"></div></div><div class="label"><div class="icon"><slot name="icon"></slot></div><div class="label-text"><slot></slot></div></div></section>`}}U([t({type:Boolean,reflect:!0})],V.prototype,"checked",void 0),U([t({type:String,reflect:!0})],V.prototype,"value",void 0),U([t({type:Boolean,reflect:!0})],V.prototype,"indeterminate",void 0),window.customElements.define("zui-checkbox",V);const H=e`@supports(scrollbar-width:thin){dialog,dialog.scrolling .header-content-container{scrollbar-color:var(--zui-gray-400) rgba(0,0,0,0);scrollbar-width:thin}}dialog.scrolling .header-content-container::-webkit-scrollbar,dialog::-webkit-scrollbar{width:7px;height:7px}dialog.scrolling .header-content-container::-webkit-scrollbar-track,dialog::-webkit-scrollbar-track{background-color:rgba(0,0,0,0);border-radius:7px}dialog.scrolling .header-content-container::-webkit-scrollbar-thumb,dialog::-webkit-scrollbar-thumb{background-color:var(--zui-gray-400);border-radius:7px}dialog.scrolling .header-content-container::-webkit-scrollbar-thumb:hover,dialog::-webkit-scrollbar-thumb:hover{background-color:var(--zui-gray-300)}dialog.scrolling .header-content-container::-webkit-scrollbar-thumb:active,dialog::-webkit-scrollbar-thumb:active{background-color:var(--zui-gray-600)}:host{contain:none;z-index:6000}:host dialog::backdrop{background:var(--zui-dialog-backdrop-color,rgba(0,0,0,.6))}:host .header-content-container{padding:1.875rem}:host .footer ::slotted(*),:host .header ::slotted(*){margin-bottom:0!important}:host .header{margin-bottom:1.25rem}:host .content{min-height:7.5rem;transition:height 1s cubic-bezier(.25, .8, .25, 1)}:host .footer{display:flex;height:5.625rem;justify-content:flex-end;padding:1.25rem 1.875rem 1.875rem}:host .footer ::slotted(div){display:flex}:host .footer ::slotted(:last-child:not(:only-child)){margin-left:.625rem}:host .footer ::slotted(:nth-last-child(3)){margin-right:auto}:host([hide-backdrop]) dialog::backdrop{background:rgba(0,0,0,0)}:host(:not([opened])){display:none}dialog{--dialog-margin-spacer:1.0625rem;position:fixed;top:0;bottom:0;left:0;width:100%;max-width:min(100% - var(--dialog-margin-spacer)*2,var(--zui-dialog-max-width,42.1875rem));max-height:calc(100% - var(--dialog-margin-spacer)*2);overflow:visible;padding:0;background:#fff;border:0;border-radius:4px;box-shadow:0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14),0 9px 46px 8px rgba(0,0,0,.12);color:var(--zui-gray-800)}@media(min-width:45em){dialog{max-height:calc(100% - var(--dialog-margin-spacer)*2 - 1.875rem)}}dialog.scrolling{overflow-y:hidden}dialog.scrolling .header-content-container{height:calc(100vh - 9.375rem);overflow-y:auto}dialog.scrolling .footer{border-top:1px solid var(--zui-gray-100)}dialog:-internal-modal{position:fixed;top:0;bottom:0;max-width:calc(100% - 6px - 2em);max-height:calc(100% - 6px - 2em);overflow:auto}dialog::backdrop{position:fixed;top:0;right:0;bottom:0;left:0}:host(.small) dialog{--zui-dialog-max-width:29.6875rem}:host(.large) dialog{--zui-dialog-max-width:54.6875rem}:host(.full) dialog{max-width:calc(100% - var(--dialog-margin-spacer)*2)}@supports(background:-webkit-named-image(i)) and (not (contain:content)){dialog{top:var(--dialog-margin-spacer);right:var(--dialog-margin-spacer);bottom:unset;left:var(--dialog-margin-spacer);margin:0 auto}}`;var q,F=function(e,t,i,o){var r,s=arguments.length,a=s<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,o);else for(var n=e.length-1;n>=0;n--)(r=e[n])&&(a=(s<3?r(a):s>3?r(t,i,a):r(t,i))||a);return s>3&&a&&Object.defineProperty(t,i,a),a};class Y extends i{constructor(){super(...arguments),this.#c=!1,this.#h=!1,this.noCancelOutsideDialog=!1}#c;#u;#p;static#g=new Map;#h;static get styles(){return[super.styles,H]}get opened(){return this.#c}set opened(e){const t=this.#c;t!==e&&(this.#c=e,this.requestUpdate("opened",t),this.#b(e),e?this.#m():this.#v(!1),e?this.#f():this.#y(),e||(this.#u=!0))}get canceled(){return this.#u}open(){this.opened=!0}close(e=!1){this.#c&&(this.#c=!1,this.#b(!1),this.#u=!e,this.requestUpdate("opened"),this.#v(e),this.#y())}connectedCallback(){super.connectedCallback(),this.setAttribute("role","dialog"),this.setAttribute("aria-labelledby","dialogTitle"),this.setAttribute("aria-describedby","dialogDesc"),this.#z(),q.#g.set(this,!1)}disconnectedCallback(){super.disconnectedCallback(),this.close(!1),q.#g.delete(this),this.#w()}async firstUpdated(){this.#b(this.#c),this.#x(),this.#k()}#b(e,t=1){if(!this.isConnected)return void q.#g.set(this,!1);if(!(this._dialogElement&&this._dialogElement.isConnected)&&t>0)return this.requestUpdate(),void this.updateComplete.then((()=>this.#b(e,--t)));const i=this._dialogElement?.hasAttribute("open");e&&!i?this._dialogElement.showModal():!e&&i&&this._dialogElement.close(),q.#g.set(this,e);const o=e||Array.from(q.#g.values()).find((e=>e));document.body.style.overflow=o?"hidden":""}#m(){this.dispatchEvent(new CustomEvent("open",{bubbles:!0,cancelable:!0}))}#v(e){this.dispatchEvent(new CustomEvent("close",{bubbles:!0,cancelable:!0,detail:e}))}#_(e){const t=e.target;t.hasAttribute("dialog-confirm")?this.close(!0):t.hasAttribute("dialog-close")&&this.close(!1)}#S(e){"dialog"!==e.target.method&&"dialog"!==e.submitter?.getAttribute("formmethod")||this.close()}#$(e){e.target===this._dialogElement&&this.close(!1)}#x(){const e=this.shadowRoot.querySelector(".header");0===this._headerSlottedNodes.length?e.style.display="none":this._headerSlottedNodes.length>0&&"none"===e.style.display&&e.style.removeProperty("display"),this.requestUpdate()}#k(){const e=this.shadowRoot.querySelector(".footer");0===this._footerSlottedNodes.length?e.style.display="none":this._footerSlottedNodes.length>0&&"none"===e.style.display&&e.style.removeProperty("display"),this.requestUpdate()}async#f(){await this.updateComplete,!this.#h&&this._dialogElement?.scrollHeight>this._dialogElement?.clientHeight&&(this.#h=!0),this.requestUpdate()}#y(){this.#h&&(this.#h=!1),this.requestUpdate()}#z(){this.#p=new MutationObserver((e=>{for(const t of e)"childList"===t.type&&this.#f()})),this.#p?.observe(this,{childList:!0,subtree:!0}),this.requestUpdate()}#w(){this.#p&&this.#p.disconnect()}render(){return o`<dialog class="${s({scrolling:this.#h})}" @click="${e=>!this.noCancelOutsideDialog&&this.#$(e)}" @close="${()=>this.close(!1)}"><article class="header-content-container"><header class="header" part="header" id="dialogTitle"><slot name="header" @slotchange="${this.#x}"></slot></header><div class="content" part="content" id="dialogDesc"><slot @submit="${this.#S}"></slot><slot name="content"></slot></div></article><footer class="footer" part="footer"><slot name="footer" @click="${this.#_}" @slotchange="${this.#k}"></slot></footer></dialog>`}}q=Y,F([g("dialog")],Y.prototype,"_dialogElement",void 0),F([f({slot:"header"})],Y.prototype,"_headerSlottedNodes",void 0),F([f({slot:"footer"})],Y.prototype,"_footerSlottedNodes",void 0),F([t({type:Boolean,reflect:!0})],Y.prototype,"opened",null),F([t({type:Boolean,attribute:"no-cancel-outside-dialog"})],Y.prototype,"noCancelOutsideDialog",void 0),window.customElements.define("zui-dialog",Y);let G=class extends a{constructor(e){if(super(e),this.it=n,e.type!==l.CHILD)throw Error(this.constructor.directiveName+"() can only be used in child bindings")}render(e){if(e===n||null==e)return this._t=void 0,this.it=e;if(e===d)return e;if("string"!=typeof e)throw Error(this.constructor.directiveName+"() called with a non-string value");if(e===this.it)return this._t;this.it=e;const t=[e];return t.raw=t,this._t={_$litType$:this.constructor.resultType,strings:t,values:[]}}};G.directiveName="unsafeHTML",G.resultType=1;const W=c(G),K={401:()=>import("./internals/_16fc9f30.js"),403:()=>import("./internals/_4770875c.js"),404:()=>import("./internals/_8027d0e7.js"),500:()=>import("./internals/_398edc20.js")},X=e`:host .message a{vertical-align:baseline;margin:0;padding:0;font-weight:500;cursor:pointer;color:var(--zui-blue);text-decoration:underline}:host .message a:hover{color:var(--zui-blue-400)}:host .message a:focus{outline:.0625rem solid var(--zui-blue);outline-offset:.25rem;text-decoration:none}:host .message a:active{outline:0;color:var(--zui-blue-600);text-decoration:underline}:host{display:flex;width:100%}:host .container{display:flex;width:100%;flex-direction:column;align-items:center;margin:1.875rem;text-align:center}:host svg{width:100%;max-width:31.25rem;margin:0 0 1.875rem}:host .header{margin:0 0 1.25rem;font-size:2rem;font-weight:300}:host .subheader{margin:0 0 .625rem;font-size:1.25rem;font-weight:600}:host .message{margin:0}:host .slot-wrapper{display:none;margin-top:1.875rem}:host .slot-wrapper.show{display:block}`;var Z=function(e,t,i,o){var r,s=arguments.length,a=s<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,o);else for(var n=e.length-1;n>=0;n--)(r=e[n])&&(a=(s<3?r(a):s>3?r(t,i,a):r(t,i))||a);return s>3&&a&&Object.defineProperty(t,i,a),a};class Q extends i{constructor(){super(...arguments),this.error=null,this.header=null,this.subheader=null,this.message=null}static get styles(){return[super.styles,X]}#C;async#O(){const e=K[this.error];if("function"==typeof e){const t=(await e()).svgSprite;this.#C=t,this.requestUpdate(),await this.updateComplete;const i=new CustomEvent("svg-load");this.dispatchEvent(i)}}updated(e){e.has("error")&&this.#O()}firstUpdated(){this.#E()}render(){return o`<div class="container">
      ${this.#C?this.#C:o``}
      ${this.header?o`<h1 class="header">${this.header}</h1>`:o``}
      ${this.subheader?o`<h2 class="subheader">${this.subheader}</h2>`:o``}
      ${this.message?o`<p class="message">${W(this.message)}</p>`:o``}
      <div class="slot-wrapper"><slot @slotchange="${this.#E}"></slot></div>
    </div>`}async#E(){(await this._slottedNodes).length>0?this._slotWrapper.classList.toggle("show",!0):this._slotWrapper.classList.toggle("show",!1),this.requestUpdate()}}Z([t({type:String,attribute:"error"})],Q.prototype,"error",void 0),Z([t({type:String,attribute:"header"})],Q.prototype,"header",void 0),Z([t({type:String,attribute:"subheader"})],Q.prototype,"subheader",void 0),Z([t({type:String,attribute:"message"})],Q.prototype,"message",void 0),Z([g(".slot-wrapper")],Q.prototype,"_slotWrapper",void 0),Z([f({slot:""})],Q.prototype,"_slottedNodes",void 0),window.customElements.define("zui-error-page",Q);const J=e`:host{display:flex;flex-wrap:wrap;align-items:center}:host ::slotted([slot=title]){margin:0}:host .trigger{display:flex;width:100%;justify-content:var(--zui-expander-trigger-placement,flex-start);order:1}:host .trigger .clickable{display:inline-flex;align-items:center;background-color:rgba(0,0,0,0);border:0;font:inherit;word-break:break-word;cursor:pointer}:host .trigger .clickable::-moz-focus-inner,:host .trigger .clickable:focus{border:0;outline:0}:host .trigger [icon=zui-down],:host .trigger [icon=zui-right]{flex-shrink:0;cursor:pointer;transition:color .2s ease-out,var(--zui-expander-trigger-animation, transform .2s ease-out)}:host([open]) [icon=zui-down]{transform:rotate(-180deg)}:host([open]:not([type=group-standard]):not([type=group-lightweight]):not([type=group-popout])) .trigger{margin-top:.9375rem}:host .trigger .clickable{padding:.3125rem .9375rem;border-radius:1.25rem;outline:0;color:var(--zui-blue)}:host .trigger .clickable .trigger-text-less,:host .trigger .clickable .trigger-text-more{margin-left:.3125rem;font-weight:600}:host .trigger .clickable .trigger-text-less{display:none}:host .trigger .clickable:hover{background-color:var(--zui-gray-100)}:host .trigger .clickable:focus{box-shadow:inset 0 0 0 1px var(--zui-blue)}:host .trigger .clickable:active{background:var(--zui-gray-200)}:host([open]) .trigger .clickable .trigger-text-more{display:none}:host([open]) .trigger .clickable .trigger-text-less{display:inline-block}:host [name=content]{display:none;width:inherit;animation:expanderOpen .2s;transform-origin:top center}@keyframes expanderOpen{0%{transform:scaleY(.75)}100%{transform:scaleY(1)}}:host([open]) [name=content]{display:initial;width:100%}:host([type=group-standard]) .trigger{justify-content:space-between;align-items:center;order:0;padding:1.25rem;cursor:pointer;color:var(--zui-gray-800)}:host([type=group-standard]) ::slotted([slot=content]){padding:1.25rem}:host([type=group-standard][open]:focus){animation:1s forwards fadeBackground}@keyframes fadeBackground{from{background:#fafafa}to{background:#fff}}:host([type=group-lightweight]) .header-content-wrapper{display:flex;width:100%;align-items:center}:host([type=group-lightweight]) .trigger{width:auto;align-items:center;padding:.875rem .875rem .875rem .4375rem;cursor:pointer;color:var(--zui-gray)}:host([type=group-lightweight]) .trigger:hover{color:var(--zui-gray-800)}:host([type=group-lightweight]) zui-icon{margin-right:.3125rem}:host([type=group-lightweight]) ::slotted([slot=content]){padding:.875rem}:host([type=group-lightweight]:focus) .trigger{color:var(--zui-gray-800)}:host([type=group-lightweight][open]) [icon=zui-right]{transform:rotate(90deg)}:host([type=group-popout]) .header-content-wrapper{display:flex;flex-direction:var(--zui-expander-group-popout-flex-direction,column);justify-content:center}:host([type=group-popout]) .header{display:flex;width:100%;justify-content:space-between}:host([type=group-popout]) ::slotted([slot=trigger]){align-self:center}:host([type=group-popout]) ::slotted([slot=subtitle]){margin-bottom:0;font-size:.6875rem;font-weight:400;color:var(--zui-gray)}:host([type=group-popout]) .footer-container{display:none}:host([type=group-popout][open]) ::slotted([slot=trigger]){display:none}:host([type=group-popout][open]) .footer-container{display:var(--zui-expander-popout-footer-display,flex);width:100%;flex-wrap:wrap;justify-content:var(--zui-expander-popout-footer-position,flex-end);align-items:center}:host([type=group-popout][open]) ::slotted([slot=footer-button]){margin:var(--zui-expander-popout-footer-buttons-margin,0 0 0 .625rem)}`;var ee=function(e,t,i,o){var r,s=arguments.length,a=s<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,o);else for(var n=e.length-1;n>=0;n--)(r=e[n])&&(a=(s<3?r(a):s>3?r(t,i,a):r(t,i))||a);return s>3&&a&&Object.defineProperty(t,i,a),a};class te extends i{constructor(){super(...arguments),this.open=!1,this.type=null,this.expandLabel="See more",this.collapseLabel="See less"}get _trigger(){return z(this._triggerSlotEl,"*")}get _footerTriggers(){return w(this._footerSlotEl,"[expander-close]")}setOpen(e){this.open=e}toggleOpen(){this.open=!this.open}onKeydownToggleOpen(){const e=["Space","Enter"];this.addEventListener("keydown",(t=>{e.includes(t.code)&&this===document.activeElement&&(t.preventDefault(),t.stopPropagation(),this.toggleOpen())}))}setTabIndex(){this.tabIndex=0,this.setAttribute("role","button")}firstUpdated(){"group-popout"===this.type&&this._trigger&&this._trigger.addEventListener("click",(()=>this.toggleOpen())),"group-popout"===this.type&&this._footerTriggers&&this._footerTriggers.forEach((e=>{e.addEventListener("click",(()=>{this.toggleOpen()}))})),"group-lightweight"!==this.type&&"group-standard"!==this.type||(this.setTabIndex(),this.onKeydownToggleOpen())}static get styles(){return[super.styles,J]}render(){let e;switch(this._raiseOpenCloseEvent(this.open),this.type){case"group-standard":e=this._renderGroupStandard();break;case"group-lightweight":e=this._renderGroupLightweight();break;case"group-popout":e=this._renderGroupPopout();break;default:e=this._renderStandard()}return o`${e}`}_re