@zanichelli/albe-web-components 3.2.0 → 4.0.0

package/dist/esm/z-navigation-tab.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h } from './index-90e18641.js';
-import { N as NavigationTabsOrientations, q as NavigationTabsSizes } from './index-7424c64c.js';
+import { N as NavigationTabsOrientations, p as NavigationTabsSizes } from './index-46ca649a.js';
 import { i as icons } from './icons-92a7dcde.js';
 
 const navigationTabCss = "z-navigation-tab>button,z-navigation-tab-link>a{position:relative;z-index:0;display:inline-flex;align-items:center;justify-content:center;width:auto;margin:0;padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 5);background-color:unset;text-align:center;font-size:inherit;font-family:var(--font-family-sans);line-height:inherit;letter-spacing:inherit;white-space:nowrap;color:var(--color-primary01);fill:currentColor;border:none;border-radius:var(--border-no-radius);outline:none;cursor:pointer}z-navigation-tab-link>a{text-decoration:none}z-navigation-tab *,z-navigation-tab-link *,z-navigation-tab *::before,z-navigation-tab *::after,z-navigation-tab-link *::before,z-navigation-tab-link *::after{box-sizing:border-box}z-navigation-tab>*:focus:focus-visible,z-navigation-tab-link>*:focus:focus-visible{box-shadow:inset var(--shadow-focus-primary)}z-navigation-tab:not([disabled]):hover>*,z-navigation-tab[selected]>*,z-navigation-tab-link:not([disabled]):hover>*,z-navigation-tab-link[selected]>*{color:var(--color-hover-secondary);fill:currentColor}z-navigation-tab:not([disabled]):hover>*::after,z-navigation-tab[selected]>*::after,z-navigation-tab-link:not([disabled]):hover>*::after,z-navigation-tab-link[selected]>*::after{content:\"\";position:absolute;background-color:var(--color-hover-secondary)}z-navigation-tab[orientation=\"horizontal\"]:not([disabled]):hover>*::after,z-navigation-tab[orientation=\"horizontal\"][selected]>*::after,z-navigation-tab-link[orientation=\"horizontal\"]:not([disabled]):hover>*::after,z-navigation-tab-link[orientation=\"horizontal\"][selected]>*::after{bottom:0;left:0;width:100%;height:var(--border-size-large)}z-navigation-tab z-icon,z-navigation-tab-link z-icon{--z-icon-width:calc(var(--space-unit) * 2);--z-icon-height:calc(var(--space-unit) * 2);display:flex;margin:0}z-navigation-tab[orientation=\"horizontal\"] z-icon,z-navigation-tab-link[orientation=\"horizontal\"] z-icon{margin-right:var(--space-unit)}z-navigation-tab:not([disabled]):hover>*{background-color:var(--color-background)}z-navigation-tab[disabled]>*{pointer-events:all;cursor:not-allowed;color:var(--gray500);fill:currentColor}z-navigation-tab[size=\"small\"]>*,z-navigation-tab-link[size=\"small\"]>*{font-size:var(--font-size-2);line-height:1.4;letter-spacing:0.16px}z-navigation-tab[size=\"small\"][orientation=\"horizontal\"]>*,z-navigation-tab-link[size=\"small\"][orientation=\"horizontal\"]>*{padding:var(--space-unit) calc(var(--space-unit) * 2)}z-navigation-tab[size=\"small\"][orientation=\"horizontal\"]:not([disabled]):hover>*::after,z-navigation-tab[size=\"small\"][orientation=\"horizontal\"][selected]>*::after,z-navigation-tab-link[size=\"small\"][orientation=\"horizontal\"]:hover>*::after,z-navigation-tab-link[size=\"small\"][orientation=\"horizontal\"][selected]>*::after{height:var(--border-size-medium)}z-navigation-tab[size=\"small\"]:not([orientation=\"vertical\"]) z-icon,z-navigation-tab-link[size=\"small\"]:not([orientation=\"vertical\"]) z-icon{--z-icon-width:14px;--z-icon-height:14px}z-navigation-tab[orientation=\"vertical\"]>*,z-navigation-tab-link[orientation=\"vertical\"]>*{padding:calc(var(--space-unit) * 3) calc(var(--space-unit) * 2)}z-navigation-tab[orientation=\"vertical\"]:hover:not([disabled])>*::after,z-navigation-tab[orientation=\"vertical\"][selected]>*::after,z-navigation-tab-link[orientation=\"vertical\"]:hover>*::after,z-navigation-tab-link[orientation=\"vertical\"][selected]>*::after{width:var(--border-size-large);height:100%;top:0;right:0}";

package/dist/esm/z-navigation-tabs.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, H as Host, g as getElement } from './index-90e18641.js';
-import { N as NavigationTabsOrientations, q as NavigationTabsSizes } from './index-7424c64c.js';
+import { N as NavigationTabsOrientations, p as NavigationTabsSizes } from './index-46ca649a.js';
 
 const stylesCss = ":host{position:relative;display:flex;flex-direction:row;z-index:0;font-family:var(--font-family-sans);font-weight:var(--font-rg);overflow:hidden}:host,:host *,::slotted(*){box-sizing:border-box}::-webkit-scrollbar{display:none}.navigation-button{position:absolute;display:flex;align-items:center;justify-content:center;margin:0;padding:0;background:var(--color-white);border:none;outline:none;fill:var(--color-primary01);border-radius:var(--border-no-radius);cursor:pointer;z-index:1;box-shadow:0px 0px 4px 1px rgb(66, 69, 72, 0.40)}.navigation-button:focus:focus-visible{fill:var(--color-primary01);box-shadow:inset var(--shadow-focus-primary)}.navigation-button:disabled{display:none}nav{display:flex;align-items:center;justify-content:flex-start;overflow:auto;scroll-behavior:smooth;scrollbar-width:none}:host([orientation='horizontal']) nav{width:100%}:host([orientation='horizontal']) .navigation-button{top:0;height:100%;width:calc(var(--space-unit) * 4)}:host([orientation='horizontal']) .navigation-button:first-child{left:0}:host([orientation='horizontal']) .navigation-button:last-child{right:0}:host([orientation='vertical']){flex-direction:column;width:fit-content}:host([orientation='vertical']) nav{flex-direction:column;align-items:stretch;height:100%}:host([orientation='vertical']) .navigation-button{left:0;width:100%;height:calc(var(--space-unit) * 4)}:host([orientation='vertical']) .navigation-button:first-child{top:0}:host([orientation='vertical']) .navigation-button:last-child{bottom:0}:host([size='small'][orientation='vertical']) .navigation-button{height:calc(var(--space-unit) * 4)}";
 

package/dist/esm/z-otp.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h } from './index-90e18641.js';
-import { o as InputStatusEnum } from './index-7424c64c.js';
+import { n as InputStatusEnum } from './index-46ca649a.js';
 
 const stylesCss = ":host{font-family:var(--font-family-sans);font-weight:var(--font-rg)}.digits-container{display:flex;justify-content:flex-start}input{height:72px;width:calc(var(--space-unit) * 5);font-size:32px;font-weight:300;font-family:var(--font-family-sans);text-align:center;caret-color:transparent;box-sizing:border-box;padding:0;color:var(--color-surface05)}input.error{border:1px solid;border-radius:4px;border-color:var(--color-error01);background-color:var(--color-error-inverse)}input:not(:last-of-type){margin-right:var(--space-unit)}@media only screen and (min-width: 768px){input:not(:last-of-type){margin-right:calc(var(--space-unit) * 2)}}@media only screen and (min-width: 1025px){input{width:calc(var(--space-unit) * 6)}}";
 

package/dist/esm/z-pagination-bar.entry.js

@@ -1,8 +1,8 @@
 import { r as registerInstance, c as createEvent, h } from './index-90e18641.js';
 import { h as hammer } from './hammer-c3266b17.js';
-import { h as handleKeyboardSubmit } from './utils-93d2b922.js';
+import { h as handleKeyboardSubmit } from './utils-5d5963ef.js';
 import './_commonjsHelpers-9943807e.js';
-import './index-7424c64c.js';
+import './index-46ca649a.js';
 import './breakpoints-c386984e.js';
 
 const stylesCss = ":host>div{height:48px;display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:space-around;align-items:center;align-content:center}:host>div>z-icon{cursor:pointer;margin:calc(var(--space-unit) * 2) 0;color:var(--color-primary01);fill:var(--color-primary01)}:host>div>z-icon.disabled{cursor:default;pointer-events:none;color:var(--color-disabled01);fill:var(--color-disabled01)}";

package/dist/esm/z-pagination.entry.js

@@ -188,7 +188,7 @@ const ZPagination = class {
         pagesChunks.map((chunk) => (h("div", { class: "pages-chunk" }, chunk.map((page) => this.renderPage(page))))))), this.goToPage && (h("form", { class: "mobile-go-to-page", onSubmit: (ev) => {
           ev.preventDefault();
           this.selectPage(this.goToPageValue);
-        } }, h("z-input", { class: "go-to-page-input", type: "number", hasmessage: false, onInput: (ev) => { this.goToPageValue = ev.target.value; }, placeholder: this.currentPage.toString(), hasclearicon: false }), h("span", null, `/${this.totalPages}`))), this.renderForwardButton()),
+        } }, h("z-input", { class: "go-to-page-input", type: "number", message: false, onInput: (ev) => { this.goToPageValue = ev.target.value; }, placeholder: this.currentPage.toString(), hasclearicon: false }), h("span", null, `/${this.totalPages}`))), this.renderForwardButton()),
     ];
   }
   componentDidLoad() {
@@ -209,7 +209,7 @@ const ZPagination = class {
       h("div", { class: "pagination-bar" }, this.label && h("span", { class: "page-label body-1-sb" }, this.label), this.edges && (h("button", { class: "pagination-button", type: "button", title: "Vai alla pagina 1", disabled: this.currentPage === 1, onClick: () => this.selectPage(1) }, "Pagina 1")), this.skip < this.totalPages && this.skip > 1 && (h("button", { class: "pagination-button", type: "button", title: `Vai alla pagina ${this.currentPage - this.skip}`, disabled: this.currentPage <= this.skip, onClick: () => this.selectPage(this.currentPage - this.skip) }, "-", this.skip)), this.navArrows && this.renderBackButton(), h("div", { class: "pages-container", role: "navigation", tabIndex: -1 }, this.split ?
         this.renderSplitPages() :
         this.renderPages()), this.navArrows && this.renderForwardButton(), this.skip < this.totalPages && this.skip > 1 && (h("button", { class: "pagination-button", type: "button", title: `Vai alla pagina ${this.currentPage + this.skip}`, disabled: this.currentPage > this.totalPages - this.skip, onClick: () => this.selectPage(this.currentPage + this.skip) }, "+", this.skip)), this.edges && (h("button", { class: "pagination-button", type: "button", title: `Vai alla pagina ${this.totalPages}`, disabled: this.currentPage === this.totalPages, onClick: () => this.selectPage(this.totalPages) }, "Pagina ", this.totalPages))),
-      this.goToPage && (h("div", { class: "go-to-page" }, h("span", { class: "label body-5-sb" }, "Vai a pagina:"), h("div", { class: "inputs" }, h("z-input", { class: "go-to-page-input", type: "number", hasmessage: false, placeholder: "2", hasclearicon: false, onInput: (ev) => { this.goToPageValue = ev.target.value; }, onKeyDown: (ev) => ev.key === "Enter" && this.selectPage(this.goToPageValue) }), h("z-button", { disabled: !this.goToPageValue, title: "Vai alla pagina inserita", onClick: () => this.selectPage(this.goToPageValue) }, "vai")))),
+      this.goToPage && (h("div", { class: "go-to-page" }, h("span", { class: "label body-5-sb" }, "Vai a pagina:"), h("div", { class: "inputs" }, h("z-input", { class: "go-to-page-input", type: "number", message: false, placeholder: "2", hasclearicon: false, onInput: (ev) => { this.goToPageValue = ev.target.value; }, onKeyDown: (ev) => ev.key === "Enter" && this.selectPage(this.goToPageValue) }), h("z-button", { disabled: !this.goToPageValue, title: "Vai alla pagina inserita", onClick: () => this.selectPage(this.goToPageValue) }, "vai")))),
     ];
   }
   get host() { return getElement(this); }

package/dist/esm/z-pocket_3.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, g as getElement } from './index-90e18641.js';
-import { n as PocketStatusEnum } from './index-7424c64c.js';
-import { h as handleKeyboardSubmit } from './utils-93d2b922.js';
+import { m as PocketStatusEnum } from './index-46ca649a.js';
+import { h as handleKeyboardSubmit } from './utils-5d5963ef.js';
 import { h as hammer } from './hammer-c3266b17.js';
 import './breakpoints-c386984e.js';
 import './_commonjsHelpers-9943807e.js';

package/dist/esm/z-popover.entry.js

@@ -1,7 +1,7 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-90e18641.js';
 import { c as classnames } from './index-abb47b30.js';
-import { P as PopoverPosition, G as PopoverBorderRadius, H as PopoverShadow, K as KeyboardKeys } from './index-7424c64c.js';
-import { a as getElementTree } from './utils-93d2b922.js';
+import { P as PopoverPosition, G as PopoverBorderRadius, H as PopoverShadow, F as KeyboardKeys } from './index-46ca649a.js';
+import { a as getElementTree } from './utils-5d5963ef.js';
 import './_commonjsHelpers-9943807e.js';
 import './breakpoints-c386984e.js';
 

package/dist/esm/z-section-title.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, g as getElement } from './index-90e18641.js';
-import { r as ZSectionTitleDividerPositions, d as DividerSize } from './index-7424c64c.js';
+import { q as ZSectionTitleDividerPositions, d as DividerSize } from './index-46ca649a.js';
 
 const stylesCss = ":host{--z-section-title--divider-color:var(--red500);display:flex;flex-direction:column;align-items:flex-start;width:fit-content;font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host,:host ::slotted(*){box-sizing:border-box}::slotted(*){margin:0}::slotted([slot=\"secondary-title\"]){padding-bottom:calc(var(--space-unit) / 2);border-bottom:var(--border-size-large) solid var(--z-section-title--divider-color);text-transform:uppercase;font-size:var(--font-size-3);line-height:1.5rem}::slotted([slot=\"primary-title\"]){font-size:var(--font-size-6);line-height:2rem}:host([uppercase]) ::slotted([slot=\"primary-title\"]){text-transform:uppercase}@media (min-width: 1152px){::slotted([slot=\"primary-title\"]){font-size:var(--font-size-7);line-height:2.25rem}}";
 

package/dist/esm/z-skip-to-content.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, h, H as Host, g as getElement } from './index-90e18641.js';
-import { a as getElementTree, h as handleKeyboardSubmit } from './utils-93d2b922.js';
-import { T as ThemeVariant } from './index-7424c64c.js';
+import { a as getElementTree, h as handleKeyboardSubmit } from './utils-5d5963ef.js';
+import { T as ThemeVariant } from './index-46ca649a.js';
 import './breakpoints-c386984e.js';
 
 const stylesCss = ".sc-z-skip-to-content-h{font-family:var(--font-family-sans);font-weight:var(--font-rg);position:absolute;left:-100%;background-color:#24f4ff;padding:calc(var(--space-unit) * 1.5) calc(var(--space-unit) * 3);height:60px;box-sizing:border-box}.skip-to-content-visible.sc-z-skip-to-content-h,.sc-z-skip-to-content-h:focus{position:static;display:block}.sc-z-skip-to-content-h>z-link.sc-z-skip-to-content{display:block;text-align:center}.sc-z-skip-to-content-h>z-link.link-invisible.sc-z-skip-to-content{height:0;width:0;overflow:hidden}.sc-z-skip-to-content-h>z-link.link-visible.sc-z-skip-to-content{height:initial;width:initial}.dark.sc-z-skip-to-content-h{background-color:var(--bg-grey-800);color:var(--color-white)}.light.sc-z-skip-to-content-h{background-color:var(--bg-white);color:var(--text-grey-800);border:2px solid var(--text-grey-800)}@media (min-width: 768px){.sc-z-skip-to-content-h>z-link.sc-z-skip-to-content{text-align:left}}@media (min-width: 1152px){.sc-z-skip-to-content-h>z-link.sc-z-skip-to-content{display:inline-block;padding:0 calc(var(--space-unit) * 3);border-right:1px solid var(--bg-grey-800)}.sc-z-skip-to-content-h>z-link.link-invisible.sc-z-skip-to-content{height:initial;width:initial;overflow:initial}.sc-z-skip-to-content-h>z-link.sc-z-skip-to-content:first-child{padding-left:0}.sc-z-skip-to-content-h>z-link.sc-z-skip-to-content:last-child,.dark.sc-z-skip-to-content-h>z-link.sc-z-skip-to-content:last-child,.light.sc-z-skip-to-content-h>z-link.sc-z-skip-to-content:last-child{border-right:none;padding-right:0}.dark.sc-z-skip-to-content-h>z-link.sc-z-skip-to-content{border-right:1px solid var(--bg-white)}}";

package/dist/esm/z-slideshow.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, h, g as getElement } from './index-90e18641.js';
-import { D as DeviceEnum } from './index-7424c64c.js';
-import { b as convertJson, g as getDevice, h as handleKeyboardSubmit } from './utils-93d2b922.js';
+import { D as DeviceEnum } from './index-46ca649a.js';
+import { b as convertJson, g as getDevice, h as handleKeyboardSubmit } from './utils-5d5963ef.js';
 import './breakpoints-c386984e.js';
 
 const stylesCss = ":host{font-family:var(--font-family-sans);font-weight:var(--font-rg);display:block;width:inherit}:host>div{display:flex;flex-direction:column;width:inherit}main{position:relative;overflow:hidden;width:100%}main z-icon.scroll{position:absolute;top:50%;width:auto;cursor:pointer;transition:0.6s ease;margin:0 var(--space-unit);fill:var(--color-primary01);z-index:10}main .scroll.disabled{opacity:50%;pointer-events:none}main .scroll.right{right:0}#slides{display:flex;flex-wrap:wrap;transition:all 300ms;line-height:0px;overflow-y:hidden}footer{height:56px;width:100%;align-items:center;display:grid;grid-template-columns:2;grid-template-rows:2;grid-template-areas:\"center center\" \"left right\";border-top:var(--border-base) solid var(--color-surface02)}footer>div{align-items:center;width:100%}footer .footerCenter{grid-area:center}footer .footerLeft{grid-area:left}footer .footerRight{grid-area:right}footer .bulletContainer{display:flex;margin:0 auto;justify-content:center;align-items:center;min-height:60px}footer .bulletContainer .bullet{width:8px;height:8px;border-radius:50%;background-color:var(--bg-neutral-150);margin:var(--space-unit) 2px;pointer-events:none}footer .bulletContainer .bullet.selected{background-color:var(--bg-neutral-400)}@media only screen and (min-width: 768px){footer{grid-template-columns:1fr 2fr 1fr;grid-template-rows:1;grid-template-areas:\"left center right\";height:76px;border-top:var(--border-base) solid var(--color-surface02)}footer .bulletContainer .bullet{width:10px;height:10px;margin:var(--space-unit) 3px}}@media only screen and (min-width: 1025px){main z-icon.scroll{margin:0 10px}footer .bulletContainer .bullet{width:16px;height:16px;margin:var(--space-unit) calc(var(--space-unit) * 0.5);pointer-events:auto;cursor:pointer}}";

package/dist/esm/z-status-tag.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, H as Host } from './index-90e18641.js';
-import { S as StatusTagStatus } from './index-7424c64c.js';
+import { S as StatusTagStatus } from './index-46ca649a.js';
 import { c as classnames } from './index-abb47b30.js';
 import './_commonjsHelpers-9943807e.js';
 

package/dist/esm/z-table-cell.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, H as Host, g as getElement } from './index-90e18641.js';
-import { z as Size, b as ButtonVariantEnum, c as ButtonSizeEnum } from './index-7424c64c.js';
+import { x as Size, b as ButtonVariantEnum, c as ButtonSizeEnum } from './index-46ca649a.js';
 import { c as classnames } from './index-abb47b30.js';
 import './_commonjsHelpers-9943807e.js';
 

package/dist/esm/z-table-header.entry.js

@@ -1,7 +1,7 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-90e18641.js';
 import { c as classnames } from './index-abb47b30.js';
-import { z as Size, F as SortDirectionEnum, P as PopoverPosition, b as ButtonVariantEnum, c as ButtonSizeEnum } from './index-7424c64c.js';
-import { a as getElementTree } from './utils-93d2b922.js';
+import { x as Size, y as SortDirectionEnum, P as PopoverPosition, b as ButtonVariantEnum, c as ButtonSizeEnum } from './index-46ca649a.js';
+import { a as getElementTree } from './utils-5d5963ef.js';
 import './_commonjsHelpers-9943807e.js';
 import './breakpoints-c386984e.js';
 

package/dist/esm/z-table-row.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-90e18641.js';
-import { s as ZTableRowExpandedType } from './index-7424c64c.js';
+import { r as ZTableRowExpandedType } from './index-46ca649a.js';
 
 const stylesCss = "z-table-row{display:table-row;font-family:var(--font-family-sans)}z-table-row[expanded-type=\"expandable\"]:hover{cursor:pointer}z-table-row[expanded-type=\"expandable\"]>z-table-cell:first-child,z-table-row[expanded-type=\"padding\"]>z-table-cell:first-child{--z-icon-width:16px;--z-icon-height:16px;width:24px;padding-left:16px;padding-right:0px;box-sizing:border-box;text-align:center;fill:var(--gray800);user-select:none}.z-icon-placeholder{width:24px;padding-right:0px}z-table-row[expanded-type=\"expandable\"]>z-table-cell:nth-child(2),z-table-row[expanded-type=\"padding\"]>z-table-cell:nth-child(2){padding-left:8px}z-table-row[expanded-type]:hover>z-table-cell:first-child{fill:var(--myz-blue-dark)}z-table-row[expanded]>z-table-cell{background-color:var(--gray50)}z-table-row[expanded]+z-table-expanded-row{display:table-row}z-table-row[expanded]>z-table-cell{border-bottom:none}";
 

package/dist/esm/z-table.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-90e18641.js';
-import { b as ButtonVariantEnum, c as ButtonSizeEnum } from './index-7424c64c.js';
+import { b as ButtonVariantEnum, c as ButtonSizeEnum } from './index-46ca649a.js';
 import { m as mobileBreakpoint } from './breakpoints-c386984e.js';
 
 const stylesCss = "z-table{overflow-x:auto;display:block;width:100%;font-family:var(--dashboard-font);font-weight:var(--font-rg);background-color:var(--color-white)}z-table>div.table{display:table;width:100%;border-collapse:separate}z-table>div.table-bordered>z-table-body>z-table-row>z-table-cell:not(:last-child),z-table>div.table-bordered>z-table-head>z-table-header-row>z-table-header:not(:last-child){border-right:var(--border-size-small) solid var(--bg-grey-200)}z-table>div>z-table-body>z-table-row[expandable]>z-table-cell:first-child,z-table>div>z-table-head>z-table-header-row[expandable]>z-table-header:first-child{border-right:none}z-table>div>z-table-body>z-table-row[expanded]>z-table-cell{background-color:var(--gray50)}z-table>div>z-table-body>z-table-row[expanded]+z-table-expanded-row{border-bottom:1px solid var(--gray200)}z-table>div.table-column-sticky>z-table-body>z-table-row>z-table-cell:first-child,z-table>div.table-column-sticky>z-table-head>z-table-header-row>z-table-header:first-child{position:sticky;left:0;box-shadow:1px 0 4px -1px rgba(66, 69, 72, 0.4);z-index:1}z-table>div.table-header-sticky>z-table-head>z-table-header-row>z-table-header{position:sticky;top:0;box-shadow:0 2px 3px -3px rgba(66, 69, 72, 0.4)}z-table>div.table-header-sticky>z-table-head>z-table-header-row>z-table-header{z-index:2}z-table>div.table-header-sticky>z-table-head>z-table-header-row>z-table-header:first-child,z-table>div.table-column-sticky>z-table-head>z-table-header-row>z-table-header:first-child{z-index:5}z-table-body{width:auto;background-color:var(--color-white)}z-table-empty-box{display:flex;flex-direction:column;flex-grow:1;border-bottom:var(--border-size-small) solid var(--bg-grey-200)}z-table-empty-box.bordered{border-left:var(--border-size-small) solid var(--bg-grey-200)}.error-message{margin-top:calc(var(--space-unit) * 2)}.table-content{display:flex;flex-direction:row;width:100%}.error-content{font-family:var(--dashboard-font);padding:calc(var(--space-unit) * 3);display:flex}.error-content>img{width:244px;height:188px;margin-right:calc(var(--space-unit) * 3)}@media only screen and (max-width: 768px){z-table>div.table-empty{display:none}.error-content{display:flex;flex-direction:column}.error-content>img{width:auto;height:auto}.text{padding:calc(var(--space-unit) * 3) 0}}";

package/dist/esm/z-toast-notification-list.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, H as Host, g as getElement } from './index-90e18641.js';
-import { u as ToastNotificationPositionsEnum } from './index-7424c64c.js';
+import { t as ToastNotificationPositionsEnum } from './index-46ca649a.js';
 
 const stylesCss = ":host{font-family:var(--font-family-sans);font-weight:var(--font-rg);position:fixed;display:flex;flex-direction:column;flex-wrap:nowrap;z-index:10000;margin-bottom:calc(var(--space-unit) * 2);margin-top:calc(var(--space-unit) * 2)}::slotted(z-toast-notification){width:100vw}::slotted(:not(:last-child)){margin-bottom:calc(var(--space-unit) * 1)}:host(.bottom-centre),:host(.bottom-right),:host(.bottom-left){justify-content:flex-end;align-items:flex-end;bottom:0}:host(.top-left),:host(.top-right),:host(.top-centre){justify-content:flex-start;align-items:flex-start;top:0}@media only screen and (min-width: 768px){:host{margin:calc(var(--space-unit) * 3)}:host(.top-centre){justify-content:flex-start;align-items:center;top:0;left:50%;transform:translateX(-50%)}:host(.top-left){justify-content:flex-start;align-items:flex-start;top:0;left:0}:host(.top-right){justify-content:flex-start;align-items:flex-end;top:0;right:0}:host(.bottom-centre){justify-content:flex-end;align-items:center;bottom:0;left:50%;transform:translateX(-50%)}:host(.bottom-right){justify-content:flex-end;align-items:flex-end;bottom:0;right:0}:host(.bottom-left){justify-content:flex-end;align-items:flex-start;bottom:0;left:0}::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}}";
 

package/dist/esm/z-toast-notification.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-90e18641.js';
-import { t as ToastNotificationTransitionsEnum } from './index-7424c64c.js';
+import { s as ToastNotificationTransitionsEnum } from './index-46ca649a.js';
 import { m as mobileBreakpoint } from './breakpoints-c386984e.js';
 import { h as hammer } from './hammer-c3266b17.js';
 import './_commonjsHelpers-9943807e.js';

package/dist/esm/z-toggle-switch.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h } from './index-90e18641.js';
-import { r as randomId } from './utils-93d2b922.js';
-import { v as ZtoggleSwitchPositionEnum } from './index-7424c64c.js';
+import { r as randomId } from './utils-5d5963ef.js';
+import { u as LabelPositions } from './index-46ca649a.js';
 import './breakpoints-c386984e.js';
 
 const stylesCss = ".sc-z-toggle-switch-h{font-family:var(--font-family-sans);font-weight:var(--font-rg);display:inline-flex;position:relative}label.sc-z-toggle-switch{display:flex;align-items:center;flex-direction:row;cursor:pointer}label.disabled.sc-z-toggle-switch{cursor:default}label.right.sc-z-toggle-switch{flex-direction:row-reverse}label.sc-z-toggle-switch>span.sc-z-toggle-switch:first-child{letter-spacing:0;color:var(--color-text01)}label.left.sc-z-toggle-switch>span.sc-z-toggle-switch:first-child{margin-right:var(--space-unit)}label.right.sc-z-toggle-switch>span.sc-z-toggle-switch:first-child{margin-left:var(--space-unit)}label.sc-z-toggle-switch>span.container.sc-z-toggle-switch{display:flex;align-items:center}label.sc-z-toggle-switch>span.container.sc-z-toggle-switch{top:1px;left:1px;height:18px;width:calc(var(--space-unit) * 4);border-radius:var(--space-unit);color:var(--gray500);background-color:var(--gray500);position:relative;cursor:pointer}label.sc-z-toggle-switch>span.container.disabled.sc-z-toggle-switch,label.sc-z-toggle-switch>span.container.checked.disabled.sc-z-toggle-switch{background-color:var(--color-disabled01);cursor:default}label.sc-z-toggle-switch>span.container.checked.disabled.sc-z-toggle-switch>span.circle.sc-z-toggle-switch>z-icon.sc-z-toggle-switch{fill:var(--color-disabled01)}label.sc-z-toggle-switch>span.container.checked.sc-z-toggle-switch{background-color:var(--color-primary01);fill:var(--color-primary01)}input.sc-z-toggle-switch:focus:focus-visible+label.sc-z-toggle-switch>span.container.sc-z-toggle-switch:not(.disabled){outline:none;box-shadow:var(--shadow-focus-primary)}input.sc-z-toggle-switch:focus:focus-visible+label.sc-z-toggle-switch>span.container.disabled.sc-z-toggle-switch{outline:none}label.sc-z-toggle-switch>span.container.sc-z-toggle-switch:not(.disabled):hover{background-color:var(--color-hover-primary);fill:var(--color-hover-primary)}label.sc-z-toggle-switch>span.container.sc-z-toggle-switch>span.circle.sc-z-toggle-switch{top:1px;left:1px;position:absolute;display:flex;align-items:center;justify-content:center;margin:0;height:calc(var(--space-unit) * 2);width:calc(var(--space-unit) * 2);border-radius:7px;background-color:var(--color-white);box-shadow:var(--shadow-1);transition:transform 0.3s ease}label.sc-z-toggle-switch>span.container.checked.sc-z-toggle-switch>span.circle.sc-z-toggle-switch{transform:translateX(calc(100% - 2px))}input[type=\"checkbox\"].sc-z-toggle-switch{position:absolute;opacity:0;z-index:-1;pointer-events:none}";
@@ -10,7 +10,7 @@ const ZToggleSwitch = class {
     registerInstance(this, hostRef);
     this.toggleClick = createEvent(this, "toggleClick", 7);
     this.disabled = false;
-    this.labelPosition = ZtoggleSwitchPositionEnum.left;
+    this.labelPosition = LabelPositions.left;
     this.checked = false;
     this.htmlid = `toggle-switch-id-${randomId()}`;
   }

package/dist/esm/z-tooltip.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-90e18641.js';
-import { l as TooltipPosition } from './index-7424c64c.js';
+import { k as TooltipPosition } from './index-46ca649a.js';
 
 const stylesCss = ":host{--z-tooltip-theme--surface:var(--color-surface01);--z-tooltip-theme--text:var(--color-text01);--arrow-size:6px;--edge-offset:calc(-1 * (var(--arrow-size) + calc(var(--space-unit) * 2)));position:relative;display:none;align-items:center;justify-content:center;padding:var(--space-unit);min-width:calc(var(--space-unit) * 8);min-height:calc(var(--space-unit) * 4);color:var(--z-tooltip-theme--text);fill:currentColor;font-family:var(--font-family-sans);text-align:center;border-radius:var(--border-radius-small);background:var(--z-tooltip-theme--surface);filter:drop-shadow(0 4px 8px var(--shadow-color-base));will-change:filter}:host(.legacy){display:inline-flex;padding:calc(var(--space-unit) * 2);min-width:auto;min-height:auto;max-width:200px;font-style:italic;line-height:16px;letter-spacing:0.32px;font-size:12px;border:var(--border-size-small) solid var(--gray200);border-radius:var(--border-radius);filter:drop-shadow(0px 0px 2px rgba(0, 0, 0, 0.08))}:host(.legacy)::before{--arrow-size:14px}:host([position])::before{--arrow-edge-offset:calc(100% - var(--arrow-size) - var(--space-unit));--arrow-center-x-offset:calc(50% - calc(var(--arrow-size) / 2));--arrow-center-y-offset:calc(100% - calc(var(--arrow-size) / 2));content:'';position:absolute;width:var(--arrow-size);height:var(--arrow-size);background:inherit;transform:rotate(45deg)}:host([open][style*='top:']),:host([open][style*='inset:']){display:inline-flex}:host([position^='top']){margin-bottom:var(--space-unit)}:host([position='right']){margin-left:var(--space-unit)}:host([position='top_right']),:host([position='bottom_right']){margin-left:var(--edge-offset)}:host([position^='bottom']){margin-top:var(--space-unit)}:host([position='left']){margin-right:var(--space-unit)}:host([position='top_left']),:host([position='bottom_left']){margin-right:var(--edge-offset)}:host([position^='top'])::before{top:var(--arrow-center-y-offset)}:host([position^='bottom'])::before{bottom:var(--arrow-center-y-offset)}:host([position='top'])::before,:host([position='bottom'])::before{left:var(--arrow-center-x-offset)}:host([position='right'])::before,:host([position='left'])::before{top:var(--arrow-center-x-offset)}:host([position='right'])::before{right:var(--arrow-center-y-offset)}:host([position='top_right'])::before,:host([position='bottom_right'])::before{right:var(--arrow-edge-offset)}:host([position='left'])::before{left:var(--arrow-center-y-offset)}:host([position='top_left'])::before,:host([position='bottom_left'])::before{left:var(--arrow-edge-offset)}::slotted(*){flex:1 auto;overflow:auto}";
 

package/dist/types/beans/index.d.ts

@@ -130,15 +130,13 @@ export declare enum InputTypeEnum {
   email = "email",
   textarea = "textarea",
   checkbox = "checkbox",
-  radio = "radio",
-  select = "select"
+  radio = "radio"
 }
 export declare type InputStatusBean = keyof typeof InputStatusEnum;
 export declare enum InputStatusEnum {
   success = "success",
   error = "error",
-  warning = "warning",
-  selecting = "selecting"
+  warning = "warning"
 }
 export declare type TooltipPositionBean = keyof typeof TooltipPosition;
 export declare enum TooltipPosition {
@@ -152,7 +150,7 @@ export declare enum TooltipPosition {
   BOTTOM_RIGHT = "bottom_right",
   BOTTOM_LEFT = "bottom_left"
 }
-export declare enum keybordKeyCodeEnum {
+export declare enum KeyboardKeyCodeEnum {
   TAB = 9,
   SPACE = 32,
   ESC = 27,
@@ -162,7 +160,7 @@ export declare enum keybordKeyCodeEnum {
   BACKSPACE = 8,
   DELETE = 46
 }
-export declare enum keybordCodeEnum {
+export declare enum KeyboardCodeEnum {
   TAB = "Tab",
   SPACE = "Space",
   ESC = "Escape",
@@ -261,10 +259,11 @@ export declare enum ExpandableListButtonAlign {
   right = "right",
   left = "left"
 }
-export declare enum ZtoggleSwitchPositionEnum {
+export declare enum LabelPositions {
   right = "right",
   left = "left"
 }
+export declare type LabelPosition = keyof typeof LabelPositions;
 export declare enum ListDividerType {
   none = "none",
   header = "header",

package/dist/types/components/buttons/z-button/index.d.ts

@@ -6,7 +6,7 @@ export declare class ZButton {
   hostElement: HTMLElement;
   /** defines a string value that labels an interactive element, used for accessibility. */
   ariaLabel?: string;
-  /** HTML a href attribute. If it is set, it renders an HTML a tag. */
+  /** HTML <a> href attribute. If it is set, it renders an HTML <a> tag. */
   href?: string;
   /** HTML a target attribute. */
   target?: string;
@@ -26,10 +26,12 @@ export declare class ZButton {
   size?: ButtonSizeEnum;
   getAttributes(): {
     id: string;
-    class: string;
     "aria-label": string;
+    class: {
+      [x: string]: boolean;
+      container: boolean;
+      "has-text": boolean;
+    };
   };
-  componentDidLoad(): void;
-  componentWillRender(): void;
   render(): any;
 }

package/dist/types/components/buttons/z-toggle-switch/index.d.ts

@@ -1,8 +1,8 @@
 import { EventEmitter } from "../../../stencil-public-runtime";
-import { ZtoggleSwitchPositionEnum } from "../../../beans";
+import { LabelPosition } from "../../../beans";
 export declare class ZToggleSwitch {
   disabled?: boolean;
-  labelPosition?: ZtoggleSwitchPositionEnum;
+  labelPosition?: LabelPosition;
   checked?: boolean;
   htmlid: string;
   toggleClick: EventEmitter;

package/dist/types/components/inputs/z-input/index.d.ts

@@ -1,5 +1,5 @@
 import { EventEmitter } from "../../../stencil-public-runtime";
-import { InputTypeBean, InputStatusBean, SelectItemBean } from "../../../beans";
+import { InputTypeBean, InputStatusBean, LabelPosition } from "../../../beans";
 export declare class ZInput {
   hostElement: HTMLElement;
   /** the id of the input element */
@@ -26,42 +26,28 @@ export declare class ZInput {
   placeholder?: string;
   /** the input html title (optional) */
   htmltitle?: string;
-  /** the input status (optional): available for text, password, number, email, textarea, select */
+  /** the input status (optional): available for text, password, number, email, textarea */
   status?: InputStatusBean;
-  /** show input helper message (optional): available for text, password, number, email, textarea, select */
-  hasmessage?: boolean;
-  /** input helper message (optional): available for text, password, number, email, textarea, select */
-  message?: string;
+  /** input helper message (optional): available for text, password, number, email, textarea - if set to `false` message won't be displayed */
+  message?: string | boolean;
   /** the input label position: available for checkbox, radio */
-  labelafter?: boolean;
-  /** timeout setting before trigger `inputChange` event (optional): available for text, textarea */
-  typingtimeout?: number;
-  /** items (optional): available for select */
-  items?: SelectItemBean[] | string;
-  /** the input has autocomplete option (optional): available for select, input */
-  autocomplete?: boolean | string;
-  /** multiple options can be selected (optional): available for select */
-  multiple?: boolean;
+  labelPosition?: LabelPosition;
+  /** the input has autocomplete option (optional): available for text, password, number, email */
+  autocomplete?: string;
   /** render clear icon when typing (optional): available for text */
   hasclearicon?: boolean;
-  /** render icon (optional): available for text, select */
+  /** render icon (optional): available for text */
   icon?: string;
   isTyping: boolean;
-  textareaWrapperHover: string;
-  textareaWrapperFocus: string;
   passwordHidden: boolean;
   private timer;
-  private selectElem;
+  private typingtimeout;
   inputCheckListener(e: CustomEvent): void;
-  /** get the input value */
-  getValue(): Promise<string | string[]>;
-  /** set the input value */
-  setValue(value: string | string[]): Promise<void>;
   /** get checked status */
   isChecked(): Promise<boolean>;
-  /** Emitted on input value change, returns value, keycode, validity */
+  /** Emitted on input value change, returns value, validity */
   inputChange: EventEmitter;
-  emitInputChange(value: string, keycode: number): void;
+  emitInputChange(value: string): void;
   /** Emitted when user starts typing */
   startTyping: EventEmitter;
   emitStartTyping(): void;
@@ -71,8 +57,6 @@ export declare class ZInput {
   /** Emitted on checkbox check/uncheck, returns id, checked, type, name, value, validity */
   inputCheck: EventEmitter;
   emitInputCheck(checked: boolean): void;
-  /** Emitted on select option selection, returns select id, selected item id (or array of selected items ids if multiple) */
-  optionSelect: EventEmitter;
   getValidity(type: string): ValidityState;
   getTextAttributes(): {
     id: string;
@@ -83,7 +67,11 @@ export declare class ZInput {
     readonly: boolean;
     required: boolean;
     title: string;
-    class: string;
+    class: {
+      [x: string]: boolean;
+      filled: boolean;
+    };
+    autocomplete: string;
     onInput: (e: any) => void;
   };
   renderInputText(type?: InputTypeBean): any;
@@ -97,6 +85,5 @@ export declare class ZInput {
   handleCheck(ev: any): void;
   renderCheckbox(): any;
   renderRadio(): any;
-  renderSelect(): any;
   render(): any;
 }

package/dist/types/components/inputs/z-select/index.d.ts

@@ -20,40 +20,36 @@ export declare class ZSelect {
   placeholder?: string;
   /** the input html title (optional) */
   htmltitle?: string;
-  /** the input status (optional): available for text, password, number, email, textarea, select */
+  /** the input status (optional) */
   status?: InputStatusBean;
-  /** show input helper message (optional): available for text, password, number, email, textarea, select */
-  hasmessage?: boolean;
-  /** input helper message (optional): available for text, password, number, email, textarea, select */
-  message?: string;
+  /** input helper message (optional) - if set to `false` message won't be displayed */
+  message?: string | boolean;
   /** the input has autocomplete option */
-  autocomplete?: boolean | string;
-  /** multiple options can be selected */
-  multiple?: boolean;
+  autocomplete?: boolean;
   /** no result text message */
   noresultslabel?: string;
   isOpen: boolean;
-  selectedItems: SelectItemBean[];
+  selectedItem: null | SelectItemBean;
   searchString: null | string;
   private itemsList;
   constructor();
   watchItems(): void;
   /** get the input selected options */
-  getSelectedItems(): Promise<SelectItemBean[]>;
+  getSelectedItem(): Promise<SelectItemBean>;
   /** get the input value */
-  getValue(): Promise<string | string[]>;
+  getValue(): Promise<string>;
   /** set the input value */
   setValue(value: string | string[]): Promise<void>;
-  /** Emitted on select option selection, returns select id, selected item id (or array of selected items ids if multiple) */
+  /** Emitted on select option selection, returns select id, selected item id */
   optionSelect: EventEmitter;
   emitOptionSelect(): void;
   componentWillLoad(): void;
   componentWillRender(): void;
   getInitialItemsArray(): any;
-  mapSelectedItemsToItemsArray(): any;
-  getSelectedValues(): string | string[];
+  mapSelectedItemToItemsArray(): any;
+  getSelectedValue(): string;
   filterItems(searchString: string): void;
-  hasAutcomplete(): boolean;
+  hasAutocomplete(): boolean;
   handleInputChange(e: CustomEvent): void;
   selectItem(item: null | SelectItemBean, selected: boolean): void;
   arrowsSelectNav(e: KeyboardEvent, key: number): void;
@@ -62,9 +58,7 @@ export declare class ZSelect {
   handleInputClick(e: MouseEvent | KeyboardEvent): void;
   handleSelectFocus(e: MouseEvent | KeyboardEvent): void;
   scrollToLetter(letter: string): void;
-  renderLabel(): any;
   renderInput(): any;
-  renderChips(): any;
   renderSelectUl(): any;
   renderSelectUlItems(): any;
   renderNoSearchResults(): any;

package/dist/types/components/z-date-picker/index.d.ts

@@ -4,6 +4,10 @@ export declare class ZDatePicker {
   element: HTMLElement;
   /** unique id */
   datepickerid: string;
+  /** z-input aria label */
+  ariaLabel?: string;
+  /** z-input label */
+  label?: string;
   /** [Optional] datepicker mode: date, datetime, only months */
   mode: ZDatePickerMode;
   flatpickrPosition: ZDatePickerPosition;