@zanichelli/albe-web-components 14.5.1 → 14.5.2-rc-anchor-navigation

package/dist/cjs/index-e5ff8fd3.js

@@ -1,65 +0,0 @@
-'use strict';
-
-const index = require('./index-dc60bee7.js');
-const index$1 = require('./index-39ce4edf.js');
-
-const stylesCss = ":host{position:relative;display:flex;min-width:128px;box-sizing:border-box;align-items:center;padding:var(--z-table--cells-padding, calc(var(--space-unit) * 2));background-color:var(--color-surface01);gap:calc(var(--space-unit) * 2) var(--space-unit)}:host([sticky]){position:sticky;z-index:1;top:0;left:0;box-shadow:8px 0 16px -8px var(--shadow-color-base)}:host([show-menu])::after{display:inline-block;height:100%;margin-right:calc(var(--space-unit) * 4);background:transparent;content:\"\";user-select:none}.cell--menu-container{position:absolute;z-index:1;top:var(--space-unit);right:var(--space-unit)}: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{opacity:1;pointer-events:all}@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{opacity:1;pointer-events:all}}:host{background-color:var(--color-surface02);font-weight:var(--font-sb)}:host([sortable]){cursor:pointer}.z-th--sort-button{display:flex;align-items:center;justify-content:center;padding:0;border:none;margin-top:auto;background-color:transparent;cursor:pointer}.z-th--sort-button:focus{box-shadow:var(--shadow-focus-primary);outline:none}";
-const ZThStyle0 = stylesCss;
-
-const ZTh = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.sort = index.createEvent(this, "sort", 7);
-        this.colspan = undefined;
-        this.showMenu = null;
-        this.sticky = false;
-        this.sortDirection = undefined;
-        this.popoverPosition = index$1.PopoverPosition.AUTO;
-        this.isMenuOpen = false;
-    }
-    /**
-     * Get the value to set to the `aria-sort` attribute based on the current sort direction.
-     */
-    get ariaSortDirection() {
-        if (!this.sortDirection) {
-            return null;
-        }
-        return this.sortDirection === index$1.SortDirection.ASC ? "ascending" : "descending";
-    }
-    /**
-     * Handle the click on the sort button.
-     * @fires sort
-     */
-    handleSort() {
-        if (!this.sortDirection) {
-            return;
-        }
-        this.sortDirection = this.sortDirection === index$1.SortDirection.ASC ? index$1.SortDirection.DESC : index$1.SortDirection.ASC;
-        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 (index.h(index.Host, { key: 'd164205e39355dbd733b9161a7a27e385c6ad44b', role: "columnheader", "menu-open": this.isMenuOpen, "aria-sort": this.ariaSortDirection }, index.h("slot", { key: 'ef5d623eaf0ff7aa7a1005d3d35e19fe027d731f' }), this.sortDirection && (index.h("button", { class: "z-th--sort-button", type: "button", onClick: this.handleSort.bind(this) }, index.h("z-icon", { name: this.sortDirection === index$1.SortDirection.ASC ? "arrow-simple-up" : "arrow-simple-down", width: 14, height: 14 }))), this.showMenu && (index.h("div", { class: "cell--menu-container" }, index.h("z-button", { variant: index$1.ButtonVariant.TERTIARY, icon: "contextual-menu", size: index$1.ControlSize.X_SMALL, ref: (el) => (this.menuTrigger = el), onClick: () => (this.popoverEl.open = !this.popoverEl.open) }), index.h("z-popover", { ref: (el) => (this.popoverEl = el), bindTo: this.menuTrigger, onOpenChange: (event) => (this.isMenuOpen = event.detail.open), position: this.popoverPosition }, index.h("slot", { name: "contextual-menu" }))))));
-    }
-    get host() { return index.getElement(this); }
-    static get watchers() { return {
-        "colspan": ["updateColspan"]
-    }; }
-};
-ZTh.style = ZThStyle0;
-
-exports.ZTh = ZTh;
-
-//# sourceMappingURL=index-e5ff8fd3.js.map

package/dist/cjs/index-e5ff8fd3.js.map

@@ -1 +0,0 @@
-{"file":"index-e5ff8fd3.js","mappings":";;;;;AAAA,MAAM,SAAS,GAAG,m2CAAm2C,CAAC;AACt3C,kBAAe,SAAS;;MCYX,GAAG;;;;;wBAekB,IAAI;sBAM3B,KAAK;;+BAaIA,uBAAe,CAAC,IAAI;0BAMzB,KAAK;;;;;IAiBlB,IAAY,iBAAiB;QAC3B,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE;YACvB,OAAO,IAAI,CAAC;SACb;QAED,OAAO,IAAI,CAAC,aAAa,KAAKC,qBAAa,CAAC,GAAG,GAAG,WAAW,GAAG,YAAY,CAAC;KAC9E;;;;;IAMO,UAAU;QAChB,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE;YACvB,OAAO;SACR;QAED,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,aAAa,KAAKA,qBAAa,CAAC,GAAG,GAAGA,qBAAa,CAAC,IAAI,GAAGA,qBAAa,CAAC,GAAG,CAAC;QACvG,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC;YACb,aAAa,EAAE,IAAI,CAAC,aAAa;SAClC,CAAC,CAAC;KACJ;IAGS,aAAa;QACrB,IAAI,IAAI,CAAC,OAAO,EAAE;YAChB,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,GAAG,QAAQ,IAAI,CAAC,OAAO,EAAE,CAAC;SACrD;aAAM;YACL,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC,CAAC;SAC/C;KACF;IAED,iBAAiB;QACf,IAAI,CAAC,aAAa,EAAE,CAAC;KACtB;IAED,MAAM;QACJ,QACEC,QAACC,UAAI,qDACH,IAAI,EAAC,cAAc,eACR,IAAI,CAAC,UAAU,eACf,IAAI,CAAC,iBAAiB,IAEjCD,oEAAa,EACZ,IAAI,CAAC,aAAa,KACjBA,oBACE,KAAK,EAAC,mBAAmB,EACzB,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,IAEnCA,oBACE,IAAI,EAAE,IAAI,CAAC,aAAa,KAAKD,qBAAa,CAAC,GAAG,GAAG,iBAAiB,GAAG,mBAAmB,EACxF,KAAK,EAAE,EAAE,EACT,MAAM,EAAE,EAAE,GACV,CACK,CACV,EACA,IAAI,CAAC,QAAQ,KACZC,iBAAK,KAAK,EAAC,sBAAsB,IAC/BA,sBACE,OAAO,EAAEE,qBAAa,CAAC,QAAQ,EAC/B,IAAI,EAAC,iBAAiB,EACtB,IAAI,EAAEC,mBAAW,CAAC,OAAO,EACzB,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,WAAW,GAAG,EAAiB,CAAC,EACnD,OAAO,EAAE,OAAO,IAAI,CAAC,SAAS,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,GAC3D,EACFH,uBACE,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,SAAS,GAAG,EAAyB,CAAC,EACzD,MAAM,EAAE,IAAI,CAAC,WAAW,EACxB,YAAY,EAAE,CAAC,KAAK,MAAM,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,EAC9D,QAAQ,EAAE,IAAI,CAAC,eAAe,IAE9BA,kBAAM,IAAI,EAAC,iBAAiB,GAAQ,CAC1B,CACR,CACP,CACI,EACP;KACH;;;;;;;;;;","names":["PopoverPosition","SortDirection","h","Host","ButtonVariant","ControlSize"],"sources":["src/components/table/cells/z-th/styles.css?tag=z-th&encapsulation=shadow","src/components/table/cells/z-th/index.tsx"],"sourcesContent":["@import \"../z-table-cells.css\";\n\n:host {\n  background-color: var(--color-surface02);\n  font-weight: var(--font-sb);\n}\n\n/* :host([sticky]) {\n  background-color: var(--color-surface02);\n} */\n\n:host([sortable]) {\n  cursor: pointer;\n}\n\n.z-th--sort-button {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0;\n  border: none;\n  margin-top: auto;\n  background-color: transparent;\n  cursor: pointer;\n}\n\n.z-th--sort-button:focus {\n  box-shadow: var(--shadow-focus-primary);\n  outline: none;\n}\n","import {Component, Element, Event, EventEmitter, Host, Prop, State, Watch, h} from \"@stencil/core\";\nimport {ButtonVariant, ControlSize, PopoverPosition, SortDirection, VisibilityCondition} from \"../../../../beans\";\n\n/**\n * ZTh component.\n * @slot - ZTh content.\n * @slot contextual-menu - Contextual menu content. Only visible when `showMenu` is true.\n */\n@Component({\n  tag: \"z-th\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZTh {\n  @Element() host: HTMLZThElement;\n\n  /**\n   * Number of columns that the cell should span.\n   */\n  @Prop()\n  colspan: number;\n\n  /**\n   * Enables the contextual menu.\n   * Can be set to \"hover\" or \"always\" to show the button only on cell hover or always.\n   * Set a nullish value to hide the menu button.\n   */\n  @Prop({reflect: true})\n  showMenu: VisibilityCondition = null;\n\n  /**\n   * Whether the cell should stick.\n   */\n  @Prop({reflect: true})\n  sticky = false;\n\n  /**\n   * Current sorting direction.\n   * Set `SortDirection.ASC` or `SortDirection.DESC` to show the sort icon.\n   */\n  @Prop({mutable: true})\n  sortDirection?: SortDirection;\n\n  /**\n   * Set popover position.\n   */\n  @Prop()\n  popoverPosition = PopoverPosition.AUTO;\n\n  /**\n   * Store the open state of the menu.\n   */\n  @State()\n  isMenuOpen = false;\n\n  /**\n   * Sort event fired when the user clicks on the sort button.\n   * The sorting logic must be implemented by the app.\n   * You can set an `id` on the `z-th` to easly identify the column in the event listener.\n   */\n  @Event()\n  private sort: EventEmitter;\n\n  private menuTrigger: HTMLElement;\n\n  private popoverEl: HTMLZPopoverElement;\n\n  /**\n   * Get the value to set to the `aria-sort` attribute based on the current sort direction.\n   */\n  private get ariaSortDirection(): string {\n    if (!this.sortDirection) {\n      return null;\n    }\n\n    return this.sortDirection === SortDirection.ASC ? \"ascending\" : \"descending\";\n  }\n\n  /**\n   * Handle the click on the sort button.\n   * @fires sort\n   */\n  private handleSort(): void {\n    if (!this.sortDirection) {\n      return;\n    }\n\n    this.sortDirection = this.sortDirection === SortDirection.ASC ? SortDirection.DESC : SortDirection.ASC;\n    this.sort.emit({\n      sortDirection: this.sortDirection,\n    });\n  }\n\n  @Watch(\"colspan\")\n  protected updateColspan(): void {\n    if (this.colspan) {\n      this.host.style.gridColumn = `span ${this.colspan}`;\n    } else {\n      this.host.style.removeProperty(\"grid-column\");\n    }\n  }\n\n  componentWillLoad(): void {\n    this.updateColspan();\n  }\n\n  render(): HTMLZThElement {\n    return (\n      <Host\n        role=\"columnheader\"\n        menu-open={this.isMenuOpen}\n        aria-sort={this.ariaSortDirection}\n      >\n        <slot></slot>\n        {this.sortDirection && (\n          <button\n            class=\"z-th--sort-button\"\n            type=\"button\"\n            onClick={this.handleSort.bind(this)}\n          >\n            <z-icon\n              name={this.sortDirection === SortDirection.ASC ? \"arrow-simple-up\" : \"arrow-simple-down\"}\n              width={14}\n              height={14}\n            />\n          </button>\n        )}\n        {this.showMenu && (\n          <div class=\"cell--menu-container\">\n            <z-button\n              variant={ButtonVariant.TERTIARY}\n              icon=\"contextual-menu\"\n              size={ControlSize.X_SMALL}\n              ref={(el) => (this.menuTrigger = el as HTMLElement)}\n              onClick={() => (this.popoverEl.open = !this.popoverEl.open)}\n            />\n            <z-popover\n              ref={(el) => (this.popoverEl = el as HTMLZPopoverElement)}\n              bindTo={this.menuTrigger}\n              onOpenChange={(event) => (this.isMenuOpen = event.detail.open)}\n              position={this.popoverPosition}\n            >\n              <slot name=\"contextual-menu\"></slot>\n            </z-popover>\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/collection/components/buttons/z-button/index.js

@@ -1,268 +0,0 @@
-import { h } from "@stencil/core";
-import { ButtonVariant, ButtonType, ControlSize } from "../../../beans";
-/**
- * @slot - button label
- */
-export class ZButton {
-    constructor() {
-        this.ariaLabel = "";
-        this.role = undefined;
-        this.href = undefined;
-        this.target = undefined;
-        this.htmlid = undefined;
-        this.name = undefined;
-        this.disabled = false;
-        this.type = ButtonType.BUTTON;
-        this.variant = ButtonVariant.PRIMARY;
-        this.icon = undefined;
-        this.size = ControlSize.BIG;
-    }
-    getAttributes() {
-        return {
-            id: this.htmlid,
-            class: {
-                "z-button--container": true,
-                "z-button--has-text": !!this.hostElement.textContent.trim(),
-            },
-        };
-    }
-    render() {
-        if (this.href) {
-            return (h("a", Object.assign({}, this.getAttributes(), { "aria-label": this.ariaLabel, href: this.href, target: this.target }), this.icon && h("z-icon", { name: this.icon }), h("slot", null)));
-        }
-        return (h("button", Object.assign({}, this.getAttributes(), { "aria-label": this.ariaLabel, name: this.name, type: this.type, role: this.role, disabled: this.disabled }), this.icon && h("z-icon", { name: this.icon }), h("slot", null)));
-    }
-    static get is() { return "z-button"; }
-    static get encapsulation() { return "scoped"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["styles.css"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["styles.css"]
-        };
-    }
-    static get properties() {
-        return {
-            "ariaLabel": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "defines a string value that labels an interactive element, used for accessibility."
-                },
-                "attribute": "aria-label",
-                "reflect": true,
-                "defaultValue": "\"\""
-            },
-            "role": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "defines role attribute, used for accessibility."
-                },
-                "attribute": "role",
-                "reflect": false
-            },
-            "href": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "HTML <a> href attribute. If it is set, it renders an HTML <a> tag."
-                },
-                "attribute": "href",
-                "reflect": false
-            },
-            "target": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "HTML a target attribute."
-                },
-                "attribute": "target",
-                "reflect": false
-            },
-            "htmlid": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Identifier, should be unique."
-                },
-                "attribute": "htmlid",
-                "reflect": false
-            },
-            "name": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "HTML button name attribute."
-                },
-                "attribute": "name",
-                "reflect": false
-            },
-            "disabled": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "HTML button disabled attribute."
-                },
-                "attribute": "disabled",
-                "reflect": true,
-                "defaultValue": "false"
-            },
-            "type": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "ButtonType",
-                    "resolved": "ButtonType.BUTTON | ButtonType.RESET | ButtonType.SUBMIT",
-                    "references": {
-                        "ButtonType": {
-                            "location": "import",
-                            "path": "../../../beans",
-                            "id": "src/beans/index.tsx::ButtonType"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "HTML button type attribute."
-                },
-                "attribute": "type",
-                "reflect": false,
-                "defaultValue": "ButtonType.BUTTON"
-            },
-            "variant": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "ButtonVariant",
-                    "resolved": "ButtonVariant.PRIMARY | ButtonVariant.SECONDARY | ButtonVariant.TERTIARY",
-                    "references": {
-                        "ButtonVariant": {
-                            "location": "import",
-                            "path": "../../../beans",
-                            "id": "src/beans/index.tsx::ButtonVariant"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Graphical variant: `primary`, `secondary`, `tertiary`. Defaults to `primary`."
-                },
-                "attribute": "variant",
-                "reflect": true,
-                "defaultValue": "ButtonVariant.PRIMARY"
-            },
-            "icon": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "`z-icon` name to use (optional)."
-                },
-                "attribute": "icon",
-                "reflect": false
-            },
-            "size": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "ButtonSize | ControlSize",
-                    "resolved": "ButtonSize.BIG | ButtonSize.SMALL | ButtonSize.X_SMALL | ControlSize.BIG | ControlSize.SMALL | ControlSize.X_SMALL",
-                    "references": {
-                        "ButtonSize": {
-                            "location": "import",
-                            "path": "../../../beans",
-                            "id": "src/beans/index.tsx::ButtonSize"
-                        },
-                        "ControlSize": {
-                            "location": "import",
-                            "path": "../../../beans",
-                            "id": "src/beans/index.tsx::ControlSize"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Available sizes: `big`, `small` and `x-small`. Defaults to `big`."
-                },
-                "attribute": "size",
-                "reflect": true,
-                "defaultValue": "ControlSize.BIG"
-            }
-        };
-    }
-    static get elementRef() { return "hostElement"; }
-}
-//# sourceMappingURL=index.js.map

package/dist/collection/components/buttons/z-button/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/buttons/z-button/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,OAAO,EAAC,MAAM,eAAe,CAAC;AAE1D,OAAO,EAAC,aAAa,EAAE,UAAU,EAAc,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAElF;;GAEG;AAOH,MAAM,OAAO,OAAO;;yBAKN,EAAE;;;;;;wBAwBO,KAAK;oBAIN,UAAU,CAAC,MAAM;uBAIX,aAAa,CAAC,OAAO;;oBAQb,WAAW,CAAC,GAAG;;IAEzC,aAAa;QACnB,OAAO;YACL,EAAE,EAAE,IAAI,CAAC,MAAM;YACf,KAAK,EAAE;gBACL,qBAAqB,EAAE,IAAI;gBAC3B,oBAAoB,EAAE,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,WAAW,CAAC,IAAI,EAAE;aAC5D;SACF,CAAC;IACJ,CAAC;IAED,MAAM;QACJ,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YACd,OAAO,CACL,yBACM,IAAI,CAAC,aAAa,EAAE,kBACZ,IAAI,CAAC,SAAS,EAC1B,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,MAAM,EAAE,IAAI,CAAC,MAAM;gBAElB,IAAI,CAAC,IAAI,IAAI,cAAQ,IAAI,EAAE,IAAI,CAAC,IAAI,GAAI;gBACzC,eAAQ,CACN,CACL,CAAC;QACJ,CAAC;QAED,OAAO,CACL,8BACM,IAAI,CAAC,aAAa,EAAE,kBACZ,IAAI,CAAC,SAAS,EAC1B,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,QAAQ,EAAE,IAAI,CAAC,QAAQ;YAEtB,IAAI,CAAC,IAAI,IAAI,cAAQ,IAAI,EAAE,IAAI,CAAC,IAAI,GAAI;YACzC,eAAQ,CACD,CACV,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {Component, Prop, h, Element} from \"@stencil/core\";\nimport {JSXBase} from \"@stencil/core/internal\";\nimport {ButtonVariant, ButtonType, ButtonSize, ControlSize} from \"../../../beans\";\n\n/**\n * @slot - button label\n */\n@Component({\n  tag: \"z-button\",\n  styleUrl: \"styles.css\",\n  shadow: false,\n  scoped: true,\n})\nexport class ZButton {\n  @Element() hostElement: HTMLZButtonElement;\n\n  /** defines a string value that labels an interactive element, used for accessibility. */\n  @Prop({reflect: true})\n  ariaLabel = \"\";\n\n  /** defines role attribute, used for accessibility. */\n  @Prop()\n  role?: string;\n\n  /** HTML <a> href attribute. If it is set, it renders an HTML <a> tag. */\n  @Prop()\n  href?: string;\n\n  /** HTML a target attribute. */\n  @Prop()\n  target?: string;\n\n  /** Identifier, should be unique. */\n  @Prop()\n  htmlid?: string;\n\n  /** HTML button name attribute. */\n  @Prop()\n  name?: string;\n\n  /** HTML button disabled attribute. */\n  @Prop({reflect: true})\n  disabled?: boolean = false;\n\n  /** HTML button type attribute. */\n  @Prop()\n  type?: ButtonType = ButtonType.BUTTON;\n\n  /** Graphical variant: `primary`, `secondary`, `tertiary`. Defaults to `primary`. */\n  @Prop({reflect: true})\n  variant?: ButtonVariant = ButtonVariant.PRIMARY;\n\n  /** `z-icon` name to use (optional). */\n  @Prop()\n  icon?: string;\n\n  /** Available sizes: `big`, `small` and `x-small`. Defaults to `big`. */\n  @Prop({reflect: true})\n  size?: ButtonSize | ControlSize = ControlSize.BIG;\n\n  private getAttributes(): JSXBase.HTMLAttributes<HTMLAnchorElement | HTMLButtonElement> {\n    return {\n      id: this.htmlid,\n      class: {\n        \"z-button--container\": true,\n        \"z-button--has-text\": !!this.hostElement.textContent.trim(),\n      },\n    };\n  }\n\n  render(): HTMLAnchorElement | HTMLButtonElement {\n    if (this.href) {\n      return (\n        <a\n          {...this.getAttributes()}\n          aria-label={this.ariaLabel}\n          href={this.href}\n          target={this.target}\n        >\n          {this.icon && <z-icon name={this.icon} />}\n          <slot />\n        </a>\n      );\n    }\n\n    return (\n      <button\n        {...this.getAttributes()}\n        aria-label={this.ariaLabel}\n        name={this.name}\n        type={this.type}\n        role={this.role}\n        disabled={this.disabled}\n      >\n        {this.icon && <z-icon name={this.icon} />}\n        <slot />\n      </button>\n    );\n  }\n}\n"]}

package/dist/collection/components/buttons/z-button/index.spec.js

@@ -1,101 +0,0 @@
-import { newSpecPage } from "@stencil/core/testing";
-import { ZButton } from "./index";
-describe("Suite test ZButton", () => {
-    it("Test render ZButton", async () => {
-        const page = await newSpecPage({
-            components: [ZButton],
-            html: `<z-button></z-button>`,
-        });
-        expect(page.root).toEqualHtml(`
-      <z-button aria-label="" size="big" variant="primary">
-        <button aria-label="" class="z-button--container" type="button"></button>
-      </z-button>
-    `);
-    });
-    it("Test render ZButton con testo e aria-label", async () => {
-        const page = await newSpecPage({
-            components: [ZButton],
-            html: `<z-button aria-label="Open">text</z-button>`,
-        });
-        expect(page.root).toEqualHtml(`
-      <z-button aria-label="Open" size="big" variant="primary">
-        <button aria-label="Open" type="button" class="z-button--container z-button--has-text">
-          text
-        </button>
-      </z-button>
-    `);
-    });
-    it("Test render ZButton con role=link", async () => {
-        const page = await newSpecPage({
-            components: [ZButton],
-            html: `<z-button role="link">link</z-button>`,
-        });
-        expect(page.root).toEqualHtml(`
-      <z-button aria-label="" role="link" size="big" variant="primary">
-        <button aria-label="" role="link" type="button" class="z-button--container z-button--has-text">
-          link
-        </button>
-      </z-button>
-    `);
-    });
-    it("Test render ZButton con icon", async () => {
-        const page = await newSpecPage({
-            components: [ZButton],
-            html: `<z-button icon="icon"></z-button>`,
-        });
-        expect(page.root).toEqualHtml(`
-      <z-button aria-label="" size="big" variant="primary" icon="icon">
-        <button aria-label="" type="button" class="z-button--container">
-          <z-icon name="icon"></z-icon>
-        </button>
-      </z-button>
-    `);
-    });
-    it("Test render ZButton variant", async () => {
-        const page = await newSpecPage({
-            components: [ZButton],
-            html: `<z-button variant="secondary"></z-button>`,
-        });
-        expect(page.root).toEqualHtml(`
-      <z-button aria-label="" size="big" variant="secondary">
-        <button aria-label="" type="button" class="z-button--container"></button>
-      </z-button>
-    `);
-    });
-    it("Test render ZButton small", async () => {
-        const page = await newSpecPage({
-            components: [ZButton],
-            html: `<z-button size="small"></z-button>`,
-        });
-        expect(page.root).toEqualHtml(`
-      <z-button aria-label="" size="small" variant="primary">
-        <button aria-label="" type="button" class="z-button--container"></button>
-      </z-button>
-    `);
-    });
-    it("Test render ZButton disabled", async () => {
-        const page = await newSpecPage({
-            components: [ZButton],
-            html: `<z-button disabled></z-button>`,
-        });
-        expect(page.root).toEqualHtml(`
-      <z-button aria-label="" size="big" variant="primary" disabled>
-        <button aria-label="" type="button" class="z-button--container" disabled></button>
-      </z-button>
-    `);
-    });
-    it("Test render ZButton with link and variant", async () => {
-        const page = await newSpecPage({
-            components: [ZButton],
-            html: `<z-button variant="primary" href="https://wikipedia.com">link</z-button>`,
-        });
-        expect(page.root).toEqualHtml(`
-      <z-button aria-label="" size="big" variant="primary" href="https://wikipedia.com">
-        <a aria-label="" href="https://wikipedia.com" class="z-button--container z-button--has-text">
-          link
-        </a>
-      </z-button>
-    `);
-    });
-});
-//# sourceMappingURL=index.spec.js.map

package/dist/collection/components/buttons/z-button/index.spec.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.spec.js","sourceRoot":"","sources":["../../../../src/components/buttons/z-button/index.spec.ts"],"names":[],"mappings":"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","sourcesContent":["import {newSpecPage} from \"@stencil/core/testing\";\n\nimport {ZButton} from \"./index\";\n\ndescribe(\"Suite test ZButton\", () => {\n  it(\"Test render ZButton\", async () => {\n    const page = await newSpecPage({\n      components: [ZButton],\n      html: `<z-button></z-button>`,\n    });\n    expect(page.root).toEqualHtml(`\n      <z-button aria-label=\"\" size=\"big\" variant=\"primary\">\n        <button aria-label=\"\" class=\"z-button--container\" type=\"button\"></button>\n      </z-button>\n    `);\n  });\n\n  it(\"Test render ZButton con testo e aria-label\", async () => {\n    const page = await newSpecPage({\n      components: [ZButton],\n      html: `<z-button aria-label=\"Open\">text</z-button>`,\n    });\n    expect(page.root).toEqualHtml(`\n      <z-button aria-label=\"Open\" size=\"big\" variant=\"primary\">\n        <button aria-label=\"Open\" type=\"button\" class=\"z-button--container z-button--has-text\">\n          text\n        </button>\n      </z-button>\n    `);\n  });\n\n  it(\"Test render ZButton con role=link\", async () => {\n    const page = await newSpecPage({\n      components: [ZButton],\n      html: `<z-button role=\"link\">link</z-button>`,\n    });\n    expect(page.root).toEqualHtml(`\n      <z-button aria-label=\"\" role=\"link\" size=\"big\" variant=\"primary\">\n        <button aria-label=\"\" role=\"link\" type=\"button\" class=\"z-button--container z-button--has-text\">\n          link\n        </button>\n      </z-button>\n    `);\n  });\n\n  it(\"Test render ZButton con icon\", async () => {\n    const page = await newSpecPage({\n      components: [ZButton],\n      html: `<z-button icon=\"icon\"></z-button>`,\n    });\n    expect(page.root).toEqualHtml(`\n      <z-button aria-label=\"\" size=\"big\" variant=\"primary\" icon=\"icon\">\n        <button aria-label=\"\" type=\"button\" class=\"z-button--container\">\n          <z-icon name=\"icon\"></z-icon>\n        </button>\n      </z-button>\n    `);\n  });\n\n  it(\"Test render ZButton variant\", async () => {\n    const page = await newSpecPage({\n      components: [ZButton],\n      html: `<z-button variant=\"secondary\"></z-button>`,\n    });\n    expect(page.root).toEqualHtml(`\n      <z-button aria-label=\"\" size=\"big\" variant=\"secondary\">\n        <button aria-label=\"\" type=\"button\" class=\"z-button--container\"></button>\n      </z-button>\n    `);\n  });\n\n  it(\"Test render ZButton small\", async () => {\n    const page = await newSpecPage({\n      components: [ZButton],\n      html: `<z-button size=\"small\"></z-button>`,\n    });\n    expect(page.root).toEqualHtml(`\n      <z-button aria-label=\"\" size=\"small\" variant=\"primary\">\n        <button aria-label=\"\" type=\"button\" class=\"z-button--container\"></button>\n      </z-button>\n    `);\n  });\n\n  it(\"Test render ZButton disabled\", async () => {\n    const page = await newSpecPage({\n      components: [ZButton],\n      html: `<z-button disabled></z-button>`,\n    });\n    expect(page.root).toEqualHtml(`\n      <z-button aria-label=\"\" size=\"big\" variant=\"primary\" disabled>\n        <button aria-label=\"\" type=\"button\" class=\"z-button--container\" disabled></button>\n      </z-button>\n    `);\n  });\n\n  it(\"Test render ZButton with link and variant\", async () => {\n    const page = await newSpecPage({\n      components: [ZButton],\n      html: `<z-button variant=\"primary\" href=\"https://wikipedia.com\">link</z-button>`,\n    });\n\n    expect(page.root).toEqualHtml(`\n      <z-button aria-label=\"\" size=\"big\" variant=\"primary\" href=\"https://wikipedia.com\">\n        <a aria-label=\"\" href=\"https://wikipedia.com\" class=\"z-button--container z-button--has-text\">\n          link\n        </a>\n      </z-button>\n    `);\n  });\n});\n"]}