@zanichelli/albe-web-components 19.6.1 → 20.0.0

package/dist/cjs/z-myz-card-info.cjs.entry.js

@@ -1,130 +0,0 @@
-'use strict';
-
-var index = require('./index-CZz7uP-M.js');
-var index$1 = require('./index-DppFfqsn.js');
-var utils = require('./utils-C0QY75C2.js');
-require('./breakpoints-B7vFm-3T.js');
-
-const stylesCss = () => `:host{width:100%;font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>div{position:relative;display:grid;width:calc(100% + calc(var(--space-unit) * 2));height:402px;box-sizing:border-box;padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 3);border:var(--border-size-small) solid var(--color-primary01);margin-left:calc(-1 * var(--space-unit));background:var(--color-surface01);border-radius:0;box-shadow:0 2px 4px 0 rgb(66 69 72 / 35%)}:host>div>z-icon{position:absolute;top:var(--space-unit);right:var(--space-unit);cursor:pointer;fill:var(--color-primary01)}:host>div>div.cta-wrapper{display:flex;flex-flow:column nowrap;align-self:end;justify-content:space-between}:host>div>div.content-wrapper{position:relative;overflow:hidden;align-self:stretch}:host>div>div.content-wrapper>section{box-sizing:border-box;padding:var(--space-unit) 0;border-bottom:var(--border-size-small) solid var(--color-surface04);color:var(--color-surface05);font-size:14px;line-height:20px}:host>div>div.content-wrapper>section:last-child{border-bottom:none}:host>div>div.content-wrapper>section.info-wrapper{position:relative;overflow:hidden;box-sizing:border-box}:host>div>div.content-wrapper>section.info-wrapper.hidden::after{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg, rgb(255 0 0 / 0%), rgb(255 0 0 / 0%) 60%, white);content:"";pointer-events:none}:host>div>div.content-wrapper>section>span.license-heading{display:flex;justify-content:space-between}:host>div>div.content-wrapper>section>span.license-heading>span.expired{color:var(--color-primary01);font-size:12px;font-weight:600}:host>div>div.content-wrapper>section>span.license-heading>span.expiring{color:var(--color-hover-warning);font-size:12px;font-weight:600}:host>div>div.content-wrapper>z-popover{position:absolute;top:0;left:calc(var(--space-unit) * 4)}`;
-
-const ZMyzCardInfo = class {
-    emitFlipCard(showBack = false) {
-        this.flipCard.emit(showBack);
-    }
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.flipCard = index.createEvent(this, "flipCard", 7);
-        /** tabindex link attribute (optional) */
-        this.htmltabindex = 0;
-        this.hiddenContent = false;
-        this.tooltip = false;
-        this.emitFlipCard = this.emitFlipCard.bind(this);
-    }
-    componentWillLoad() {
-        this.setStringOrArray();
-    }
-    componentWillUpdate() {
-        this.setStringOrArray();
-    }
-    componentDidRender() {
-        this.handleContentHeight();
-    }
-    handleContentHeight() {
-        if (!this.contentWrapper && !this.infoWrapper) {
-            this.hiddenContent = false;
-            return;
-        }
-        if (this.contentWrapper.scrollHeight > this.contentWrapper.offsetHeight ||
-            this.infoWrapper.scrollHeight > this.infoWrapper.offsetHeight) {
-            const height = this.contentWrapper.offsetHeight -
-                this.onlineLicenseWrapper.offsetHeight -
-                this.offlineLicenseWrapper.offsetHeight;
-            this.infoWrapper.style.height = `${height}px`;
-            this.hiddenContent = true;
-            return;
-        }
-        this.hiddenContent = false;
-    }
-    setStringOrArray() {
-        if (typeof this.data === "string") {
-            this.cardData = JSON.parse(this.data);
-        }
-        else {
-            this.cardData = this.data;
-        }
-    }
-    renderCloseIcon() {
-        return (index.h("z-icon", { name: "multiply-circled-filled", height: 18, width: 18, onClick: () => this.emitFlipCard(false), tabindex: this.htmltabindex, onKeyUp: (e) => {
-                utils.handleKeyboardSubmit(e, this.emitFlipCard, false);
-            } }));
-    }
-    renderGeneralSection() {
-        var _a, _b;
-        const title = (_a = this === null || this === void 0 ? void 0 : this.cardData) === null || _a === void 0 ? void 0 : _a.title;
-        const description = (_b = this === null || this === void 0 ? void 0 : this.cardData) === null || _b === void 0 ? void 0 : _b.description;
-        return (index.h("section", { class: `info-wrapper ${this.hiddenContent ? "hidden" : ""}`, onClick: () => {
-                if (this.hiddenContent) {
-                    this.tooltip = !this.tooltip;
-                }
-            }, ref: (el) => (this.infoWrapper = el) }, this.renderAuthor(), this.renderYear(), title, index.h("br", null), description));
-    }
-    renderAuthor() {
-        var _a;
-        const author = (_a = this === null || this === void 0 ? void 0 : this.cardData) === null || _a === void 0 ? void 0 : _a.author;
-        if (!author) {
-            return null;
-        }
-        return (index.h("span", null, "Autore: ", index.h("b", null, author), index.h("br", null)));
-    }
-    renderYear() {
-        var _a;
-        const year = (_a = this === null || this === void 0 ? void 0 : this.cardData) === null || _a === void 0 ? void 0 : _a.year;
-        if (!year) {
-            return null;
-        }
-        return (index.h("span", null, "Anno: ", index.h("b", null, year), index.h("br", null)));
-    }
-    renderTooltip() {
-        if (!this.tooltip) {
-            return;
-        }
-        if (!this.cardData) {
-            return;
-        }
-        const { title, year, author, description } = this.cardData;
-        return (index.h("z-popover", { position: index$1.PopoverPosition.RIGHT, onClick: () => (this.tooltip = false) }, `${title} ${year} ${author} ${description}`));
-    }
-    setExpirationLicenseMessage(type) {
-        if ((type === "online" && this.cardData.onlineLicense.expired) ||
-            (type === "offline" && this.cardData.offlineLicense.expired)) {
-            return index.h("span", { class: "expired" }, "SCADUTA");
-        }
-        if ((type === "online" && this.cardData.onlineLicense.expiring) ||
-            (type === "offline" && this.cardData.offlineLicense.expiring)) {
-            return index.h("span", { class: "expiring" }, "IN SCADENZA");
-        }
-    }
-    renderOnlineLicenseSection() {
-        var _a;
-        if (!((_a = this === null || this === void 0 ? void 0 : this.cardData) === null || _a === void 0 ? void 0 : _a.onlineLicense)) {
-            return;
-        }
-        return (index.h("section", { ref: (el) => (this.onlineLicenseWrapper = el) }, index.h("span", { class: "license-heading" }, index.h("span", null, "Licenza online"), this.setExpirationLicenseMessage("online")), "Scadenza il ", index.h("b", null, this.cardData.onlineLicense.expiration), index.h("br", null)));
-    }
-    renderOfflineLicenseSection() {
-        var _a;
-        if (!((_a = this === null || this === void 0 ? void 0 : this.cardData) === null || _a === void 0 ? void 0 : _a.offlineLicense)) {
-            return;
-        }
-        return (index.h("section", { ref: (el) => (this.offlineLicenseWrapper = el) }, index.h("span", { class: "license-heading" }, index.h("span", null, "Licenza offline"), this.setExpirationLicenseMessage("offline")), "Scadenza il ", index.h("b", null, this.cardData.offlineLicense.expiration), index.h("br", null), "Installazioni disponibili: ", index.h("b", null, this.cardData.offlineLicense.installations)));
-    }
-    render() {
-        return (index.h("div", { key: '36d2cfc3c5f6a1764b94a5e87cdbda020a485351' }, this.renderCloseIcon(), index.h("div", { key: '7bd40311e6c3b3975484516df8e2e6f55f28654c', class: "content-wrapper", ref: (el) => (this.contentWrapper = el) }, this.renderGeneralSection(), this.renderTooltip(), this.renderOnlineLicenseSection(), this.renderOfflineLicenseSection()), index.h("div", { key: 'bb2c078d38bb3aa7cda714c464ad5bc2f520d680', class: "cta-wrapper" }, index.h("slot", { key: '4321f3f48a2f2f2f5050960b9f9ea707664f1961' }))));
-    }
-};
-ZMyzCardInfo.style = stylesCss();
-
-exports.z_myz_card_info = ZMyzCardInfo;
-//# sourceMappingURL=z-myz-card-info.entry.cjs.js.map
-
-//# sourceMappingURL=z-myz-card-info.cjs.entry.js.map

package/dist/cjs/z-myz-card-info.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"z-myz-card-info.cjs.entry.js","mappings":"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","names":["h","handleKeyboardSubmit","PopoverPosition"],"sources":["src/snowflakes/myz/card/z-myz-card-info/styles.css?tag=z-myz-card-info&encapsulation=shadow","src/snowflakes/myz/card/z-myz-card-info/index.tsx"],"sourcesContent":[":host {\n  width: 100%;\n  font-family: var(--font-family-sans);\n  font-weight: var(--font-rg);\n}\n\n:host > div {\n  position: relative;\n  display: grid;\n  width: calc(100% + calc(var(--space-unit) * 2));\n  height: 402px;\n  box-sizing: border-box;\n  padding: calc(var(--space-unit) * 2) calc(var(--space-unit) * 3);\n  border: var(--border-size-small) solid var(--color-primary01);\n  margin-left: calc(-1 * var(--space-unit));\n  background: var(--color-surface01);\n  border-radius: 0;\n  box-shadow: 0 2px 4px 0 rgb(66 69 72 / 35%);\n}\n\n:host > div > z-icon {\n  position: absolute;\n  top: var(--space-unit);\n  right: var(--space-unit);\n  cursor: pointer;\n  fill: var(--color-primary01);\n}\n\n:host > div > div.cta-wrapper {\n  display: flex;\n  flex-flow: column nowrap;\n  align-self: end;\n  justify-content: space-between;\n}\n\n:host > div > div.content-wrapper {\n  position: relative;\n  overflow: hidden;\n  align-self: stretch;\n}\n\n:host > div > div.content-wrapper > section {\n  box-sizing: border-box;\n  padding: var(--space-unit) 0;\n  border-bottom: var(--border-size-small) solid var(--color-surface04);\n  color: var(--color-surface05);\n  font-size: 14px;\n  line-height: 20px;\n}\n\n:host > div > div.content-wrapper > section:last-child {\n  border-bottom: none;\n}\n\n:host > div > div.content-wrapper > section.info-wrapper {\n  position: relative;\n  overflow: hidden;\n  box-sizing: border-box;\n}\n\n:host > div > div.content-wrapper > section.info-wrapper.hidden::after {\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  background: linear-gradient(180deg, rgb(255 0 0 / 0%), rgb(255 0 0 / 0%) 60%, white);\n  content: \"\";\n  pointer-events: none;\n}\n\n:host > div > div.content-wrapper > section > span.license-heading {\n  display: flex;\n  justify-content: space-between;\n}\n\n:host > div > div.content-wrapper > section > span.license-heading > span.expired {\n  color: var(--color-primary01);\n  font-size: 12px;\n  font-weight: 600;\n}\n\n:host > div > div.content-wrapper > section > span.license-heading > span.expiring {\n  color: var(--color-hover-warning);\n  font-size: 12px;\n  font-weight: 600;\n}\n\n:host > div > div.content-wrapper > z-popover {\n  position: absolute;\n  top: 0;\n  left: calc(var(--space-unit) * 4);\n}\n","import {Component, ComponentInterface, Event, EventEmitter, Prop, State, h} from \"@stencil/core\";\nimport {DictionaryData, PopoverPosition} from \"../../../../beans\";\nimport {handleKeyboardSubmit} from \"../../../../utils/utils\";\n\n/**\n * @slot - content\n */\n@Component({\n  tag: \"z-myz-card-info\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZMyzCardInfo implements ComponentInterface {\n  /** dictionary info */\n  @Prop()\n  data: string | DictionaryData;\n\n  /** tabindex link attribute (optional) */\n  @Prop()\n  htmltabindex?: number = 0;\n\n  @State()\n  hiddenContent = false;\n\n  @State()\n  tooltip = false;\n\n  private cardData: DictionaryData;\n\n  private contentWrapper: HTMLElement;\n\n  private infoWrapper: HTMLElement;\n\n  private onlineLicenseWrapper: HTMLElement;\n\n  private offlineLicenseWrapper: HTMLElement;\n\n  /** flip card to front */\n  @Event()\n  flipCard: EventEmitter;\n\n  private emitFlipCard(showBack = false): void {\n    this.flipCard.emit(showBack);\n  }\n\n  constructor() {\n    this.emitFlipCard = this.emitFlipCard.bind(this);\n  }\n\n  componentWillLoad(): void {\n    this.setStringOrArray();\n  }\n\n  componentWillUpdate(): void {\n    this.setStringOrArray();\n  }\n\n  componentDidRender(): void {\n    this.handleContentHeight();\n  }\n\n  private handleContentHeight(): void {\n    if (!this.contentWrapper && !this.infoWrapper) {\n      this.hiddenContent = false;\n\n      return;\n    }\n\n    if (\n      this.contentWrapper.scrollHeight > this.contentWrapper.offsetHeight ||\n      this.infoWrapper.scrollHeight > this.infoWrapper.offsetHeight\n    ) {\n      const height =\n        this.contentWrapper.offsetHeight -\n        this.onlineLicenseWrapper.offsetHeight -\n        this.offlineLicenseWrapper.offsetHeight;\n      this.infoWrapper.style.height = `${height}px`;\n      this.hiddenContent = true;\n\n      return;\n    }\n\n    this.hiddenContent = false;\n  }\n\n  private setStringOrArray(): void {\n    if (typeof this.data === \"string\") {\n      this.cardData = JSON.parse(this.data);\n    } else {\n      this.cardData = this.data;\n    }\n  }\n\n  private renderCloseIcon(): HTMLZIconElement {\n    return (\n      <z-icon\n        name=\"multiply-circled-filled\"\n        height={18}\n        width={18}\n        onClick={() => this.emitFlipCard(false)}\n        tabindex={this.htmltabindex}\n        onKeyUp={(e: KeyboardEvent) => {\n          handleKeyboardSubmit(e, this.emitFlipCard, false);\n        }}\n      />\n    );\n  }\n\n  private renderGeneralSection(): HTMLElement {\n    const title = this?.cardData?.title;\n    const description = this?.cardData?.description;\n\n    return (\n      <section\n        class={`info-wrapper ${this.hiddenContent ? \"hidden\" : \"\"}`}\n        onClick={() => {\n          if (this.hiddenContent) {\n            this.tooltip = !this.tooltip;\n          }\n        }}\n        ref={(el) => (this.infoWrapper = el)}\n      >\n        {this.renderAuthor()}\n        {this.renderYear()}\n        {title}\n        <br />\n        {description}\n      </section>\n    );\n  }\n\n  private renderAuthor(): HTMLSpanElement {\n    const author = this?.cardData?.author;\n    if (!author) {\n      return null;\n    }\n\n    return (\n      <span>\n        Autore: <b>{author}</b>\n        <br />\n      </span>\n    );\n  }\n\n  private renderYear(): HTMLSpanElement {\n    const year = this?.cardData?.year;\n    if (!year) {\n      return null;\n    }\n\n    return (\n      <span>\n        Anno: <b>{year}</b>\n        <br />\n      </span>\n    );\n  }\n\n  private renderTooltip(): HTMLZPopoverElement {\n    if (!this.tooltip) {\n      return;\n    }\n\n    if (!this.cardData) {\n      return;\n    }\n    const {title, year, author, description} = this.cardData;\n\n    return (\n      <z-popover\n        position={PopoverPosition.RIGHT}\n        onClick={() => (this.tooltip = false)}\n      >\n        {`${title} ${year} ${author} ${description}`}\n      </z-popover>\n    );\n  }\n\n  private setExpirationLicenseMessage(type: string): HTMLSpanElement {\n    if (\n      (type === \"online\" && this.cardData.onlineLicense.expired) ||\n      (type === \"offline\" && this.cardData.offlineLicense.expired)\n    ) {\n      return <span class=\"expired\">SCADUTA</span>;\n    }\n\n    if (\n      (type === \"online\" && this.cardData.onlineLicense.expiring) ||\n      (type === \"offline\" && this.cardData.offlineLicense.expiring)\n    ) {\n      return <span class=\"expiring\">IN SCADENZA</span>;\n    }\n  }\n\n  private renderOnlineLicenseSection(): HTMLElement {\n    if (!this?.cardData?.onlineLicense) {\n      return;\n    }\n\n    return (\n      <section ref={(el) => (this.onlineLicenseWrapper = el)}>\n        <span class=\"license-heading\">\n          <span>Licenza online</span>\n          {this.setExpirationLicenseMessage(\"online\")}\n        </span>\n        Scadenza il <b>{this.cardData.onlineLicense.expiration}</b>\n        <br />\n      </section>\n    );\n  }\n\n  private renderOfflineLicenseSection(): HTMLElement {\n    if (!this?.cardData?.offlineLicense) {\n      return;\n    }\n\n    return (\n      <section ref={(el) => (this.offlineLicenseWrapper = el)}>\n        <span class=\"license-heading\">\n          <span>Licenza offline</span>\n          {this.setExpirationLicenseMessage(\"offline\")}\n        </span>\n        Scadenza il <b>{this.cardData.offlineLicense.expiration}</b>\n        <br />\n        Installazioni disponibili: <b>{this.cardData.offlineLicense.installations}</b>\n      </section>\n    );\n  }\n\n  render(): HTMLDivElement {\n    return (\n      <div>\n        {this.renderCloseIcon()}\n        <div\n          class=\"content-wrapper\"\n          ref={(el) => (this.contentWrapper = el)}\n        >\n          {this.renderGeneralSection()}\n          {this.renderTooltip()}\n          {this.renderOnlineLicenseSection()}\n          {this.renderOfflineLicenseSection()}\n        </div>\n        <div class=\"cta-wrapper\">\n          <slot />\n        </div>\n      </div>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/z-myz-card-list.cjs.entry.js

@@ -1,39 +0,0 @@
-'use strict';
-
-var index = require('./index-CZz7uP-M.js');
-
-const stylesCss = () => `*:focus{box-shadow:var(--shadow-focus-primary);outline:none !important}ul{overflow:hidden;width:auto;height:auto;padding:0;margin:0 calc(var(--space-unit) * 2);color:var(--color-primary01);font-family:var(--font-family-sans);list-style:none}ul>li{padding-left:10px;text-indent:-10px}ul>li>a{display:block;padding-top:calc(var(--space-unit) * 0.5);color:var(--color-primary01);font-size:14px;font-weight:var(--font-sb);letter-spacing:0.16px;line-height:calc(var(--space-unit) * 2.5);text-decoration:none}ul>li>a::before{padding-right:5px;content:"•"}ul>li>span{padding:0 calc(var(--space-unit) * 2);color:var(--color-surface04);font-size:14px;font-weight:var(--font-rg);letter-spacing:0.16px;line-height:calc(var(--space-unit) * 2.5);text-decoration:none}`;
-
-const ZMyzCardList = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.renderList = this.renderList.bind(this);
-    }
-    handleSpaceKeyPress(e, url) {
-        if (e.keyCode == 32 || e.keyCode == 13) {
-            e.preventDefault();
-            window.open(url, "_blank");
-        }
-    }
-    formatListContent(data) {
-        const { value, isLink, url } = data;
-        if (!isLink) {
-            return index.h("span", null, value);
-        }
-        return (index.h("a", { role: "button", onKeyPress: (e) => this.handleSpaceKeyPress(e, url), href: url, target: "_blank" }, value));
-    }
-    renderList(dataArray) {
-        return dataArray.map((data) => {
-            return index.h("li", null, this.formatListContent(data));
-        });
-    }
-    render() {
-        return index.h("ul", { key: 'a300da3bf2b9c83f59a6464b82fb2448f97555f9' }, this.renderList(JSON.parse(this.listdata)));
-    }
-};
-ZMyzCardList.style = stylesCss();
-
-exports.z_myz_card_list = ZMyzCardList;
-//# sourceMappingURL=z-myz-card-list.entry.cjs.js.map
-
-//# sourceMappingURL=z-myz-card-list.cjs.entry.js.map

package/dist/cjs/z-myz-card-list.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"z-myz-card-list.cjs.entry.js","mappings":";;;;AAAA,MAAM,SAAS,GAAG,MAAM,CAAC,kvBAAkvB,CAAC;;MCQ/vB,YAAY,GAAA,MAAA;AAKvB,IAAA,WAAA,CAAA,OAAA,EAAA;;QACE,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC;AAC7C;IAEO,mBAAmB,CAAC,CAAgB,EAAE,GAAW,EAAA;AACvD,QAAA,IAAI,CAAC,CAAC,OAAO,IAAI,EAAE,IAAI,CAAC,CAAC,OAAO,IAAI,EAAE,EAAE;YACtC,CAAC,CAAC,cAAc,EAAE;AAClB,YAAA,MAAM,CAAC,IAAI,CAAC,GAAG,EAAE,QAAQ,CAAC;;;AAItB,IAAA,iBAAiB,CAAC,IAAY,EAAA;QACpC,MAAM,EAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAC,GAAG,IAAI;QACjC,IAAI,CAAC,MAAM,EAAE;YACX,OAAOA,OAAA,CAAA,MAAA,EAAA,IAAA,EAAO,KAAK,CAAQ;;AAG7B,QAAA,QACEA,OAAA,CAAA,GAAA,EAAA,EACE,IAAI,EAAC,QAAQ,EACb,UAAU,EAAE,CAAC,CAAgB,KAAK,IAAI,CAAC,mBAAmB,CAAC,CAAC,EAAE,GAAG,CAAC,EAClE,IAAI,EAAE,GAAG,EACT,MAAM,EAAC,QAAQ,EAAA,EAEd,KAAK,CACJ;;AAIA,IAAA,UAAU,CAAC,SAAmB,EAAA;AACpC,QAAA,OAAO,SAAS,CAAC,GAAG,CAAC,CAAC,IAAY,KAAI;AACpC,YAAA,OAAOA,OAAA,CAAA,IAAA,EAAA,IAAA,EAAK,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,CAAM;AAChD,SAAC,CAAC;;IAGJ,MAAM,GAAA;QACJ,OAAOA,OAAA,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAK,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAM;;;;;;;","names":["h"],"sources":["src/snowflakes/myz/card/z-myz-card-list/styles.css?tag=z-myz-card-list&encapsulation=shadow","src/snowflakes/myz/card/z-myz-card-list/index.tsx"],"sourcesContent":["*:focus {\n  box-shadow: var(--shadow-focus-primary);\n  outline: none !important;\n}\n\nul {\n  overflow: hidden;\n  width: auto;\n  height: auto;\n  padding: 0;\n  margin: 0 calc(var(--space-unit) * 2);\n  color: var(--color-primary01);\n  font-family: var(--font-family-sans);\n  list-style: none;\n}\n\nul > li {\n  padding-left: 10px;\n  text-indent: -10px;\n}\n\nul > li > a {\n  display: block;\n  padding-top: calc(var(--space-unit) * 0.5);\n  color: var(--color-primary01);\n  font-size: 14px;\n  font-weight: var(--font-sb);\n  letter-spacing: 0.16px;\n  line-height: calc(var(--space-unit) * 2.5);\n  text-decoration: none;\n}\n\nul > li > a::before {\n  padding-right: 5px;\n  content: \"•\";\n}\n\nul > li > span {\n  padding: 0 calc(var(--space-unit) * 2);\n  color: var(--color-surface04);\n  font-size: 14px;\n  font-weight: var(--font-rg);\n  letter-spacing: 0.16px;\n  line-height: calc(var(--space-unit) * 2.5);\n  text-decoration: none;\n}\n","import {Component, ComponentInterface, Prop, h} from \"@stencil/core\";\nimport {Action} from \"../../../../beans\";\n\n@Component({\n  tag: \"z-myz-card-list\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZMyzCardList implements ComponentInterface {\n  /** list data stringified array */\n  @Prop()\n  listdata: string;\n\n  constructor() {\n    this.renderList = this.renderList.bind(this);\n  }\n\n  private handleSpaceKeyPress(e: KeyboardEvent, url: string): void {\n    if (e.keyCode == 32 || e.keyCode == 13) {\n      e.preventDefault();\n      window.open(url, \"_blank\");\n    }\n  }\n\n  private formatListContent(data: Action): HTMLAnchorElement {\n    const {value, isLink, url} = data;\n    if (!isLink) {\n      return <span>{value}</span>;\n    }\n\n    return (\n      <a\n        role=\"button\"\n        onKeyPress={(e: KeyboardEvent) => this.handleSpaceKeyPress(e, url)}\n        href={url}\n        target=\"_blank\"\n      >\n        {value}\n      </a>\n    );\n  }\n\n  private renderList(dataArray: Action[]): HTMLLIElement[] {\n    return dataArray.map((data: Action) => {\n      return <li>{this.formatListContent(data)}</li>;\n    });\n  }\n\n  render(): HTMLUListElement {\n    return <ul>{this.renderList(JSON.parse(this.listdata))}</ul>;\n  }\n}\n"],"version":3}

package/dist/cjs/z-myz-card_4.cjs.entry.js

@@ -1,109 +0,0 @@
-'use strict';
-
-var index = require('./index-CZz7uP-M.js');
-var index$1 = require('./index-DppFfqsn.js');
-
-const stylesCss$3 = () => `:host{--card-overflow:hidden}div{display:flex;overflow:var(--card-overflow);width:auto;width:256px;height:522px;box-sizing:border-box;flex-direction:column;border:var(--border-size-medium) solid var(--color-surface03);background-color:var(--color-surface01);border-radius:var(--border-radius)}div.real,div.trial,div.temp{border-color:var(--blue100)}div.faded{border:var(--border-size-medium) solid var(--color-background)}div.highlighted{box-shadow:var(--shadow-4);outline:none}div.pressed{box-shadow:var(--shadow-8);outline:none}div:focus{box-shadow:var(--shadow-focus-primary);outline:none}`;
-
-const ZMyzCardComponent = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        /** pressed status */
-        this.ispressed = false;
-        /** highlighted status */
-        this.ishighlighted = false;
-    }
-    retrieveClass() {
-        let elemClasses = "";
-        if (this.cardtype === index$1.LicenseType.REAL) {
-            elemClasses += "real";
-        }
-        else if (this.cardtype === index$1.LicenseType.TRIAL) {
-            elemClasses += "trial";
-        }
-        else if (this.cardtype === index$1.LicenseType.TEMP) {
-            elemClasses += "temp";
-        }
-        if (this.faded) {
-            elemClasses += " faded";
-        }
-        else if (this.ispressed) {
-            elemClasses += " pressed";
-        }
-        else if (this.ishighlighted) {
-            elemClasses += " highlighted";
-        }
-        return elemClasses;
-    }
-    render() {
-        return (index.h("div", { key: '7268d6cd9e424a3d8134ff4e96bc2ba665988a6c', class: this.retrieveClass(), tabindex: "0" }, index.h("slot", { key: '22c578f464737dcad6536f251e1dbea082a2eb1a' })));
-    }
-};
-ZMyzCardComponent.style = stylesCss$3();
-
-const stylesCss$2 = () => `:host{width:auto;height:340px}:host>div{position:relative;display:flex;width:auto;height:340px;align-items:center;justify-content:center}`;
-
-const ZMyzCardBody = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-    }
-    render() {
-        return (index.h("div", { key: '9a1f8e25043b54dd7ce20167622840c675d8282a' }, index.h("slot", { key: '5b24f58f0ca8db42b6a7e8a112fd0af3af64df96', name: "alert" }), index.h("slot", { key: '49f082fc29b4edab74ac4dfbd6c77d388eaa22cc', name: "cover" })));
-    }
-};
-ZMyzCardBody.style = stylesCss$2();
-
-const stylesCss$1 = () => `img{display:block;max-width:100%;height:340px;margin:auto;object-fit:cover}img.faded{opacity:0.3}`;
-
-const ZMyzCardCover = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-    }
-    hadleOnImageError() {
-        this.img = this.defaultimg;
-    }
-    render() {
-        return (index.h("img", { key: '74249d6955b0c1db6bbb2e5e77c847378861999f', class: this.faded && "faded", onError: this.hadleOnImageError.bind(this), alt: this.titolo, src: this.img }));
-    }
-};
-ZMyzCardCover.style = stylesCss$1();
-
-const stylesCss = () => `header{position:relative;display:flex;width:auto;height:calc(var(--space-unit) * 6);flex-direction:row;align-items:flex-start;justify-content:space-between;border-bottom:var(--border-size-medium) solid var(--color-surface03);background-color:var(--color-surface01);border-radius:var(--border-radius) var(--border-radius) var(--border-no-radius) var(--border-no-radius)}slot[name="aria-heading"]::slotted(*){position:absolute;overflow:hidden !important;width:1px !important;height:1px !important;padding:0 !important;border:0 none !important;margin:-1px !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important}header.real,header.trial,header.temp{border-bottom:var(--border-size-medium) solid var(--blue100);background-color:var(--color-primary03)}.card-title{overflow:hidden;height:calc(var(--space-unit) * 2);padding:calc(var(--space-unit) * 2);margin:0;color:var(--color-surface05);font-family:var(--font-family-sans);font-size:12px;font-weight:var(--font-sb);letter-spacing:0.22px;line-height:calc(var(--space-unit) * 2);text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap}.faded{border-bottom:var(--border-size-medium) solid var(--color-background)}.faded.real,.faded.trial,.faded.temp{border-top:var(--border-size-medium) solid var(--blue100);border-right:var(--border-size-medium) solid var(--blue100);border-left:var(--border-size-medium) solid var(--blue100)}`;
-
-const ZMyzCardHeader = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.allowTooltip = false;
-    }
-    getTitle() {
-        return this.allowTooltip ? this.titolo : "";
-    }
-    componentDidLoad() {
-        if (this.elementHasEllipsis()) {
-            this.allowTooltip = true;
-        }
-    }
-    elementHasEllipsis() {
-        return this.ellipsis.offsetWidth < this.ellipsis.scrollWidth;
-    }
-    retrieveClass() {
-        return {
-            real: this.cardtype === index$1.LicenseType.REAL,
-            trial: this.cardtype === index$1.LicenseType.TRIAL,
-            temp: this.cardtype === index$1.LicenseType.TEMP,
-            faded: this.faded,
-        };
-    }
-    render() {
-        return (index.h("header", { key: 'c48aea25ec119f8b56bf13004a9bb591d278706f', class: this.retrieveClass() }, index.h("slot", { key: '00aea3e21b5aade39b702d60e87b26ec1cb79904', name: "aria-heading" }), index.h("span", { key: 'ad56e6b17d0aa5e8965ace7bec60757a4e064ea7', class: "card-title", ref: (el) => (this.ellipsis = el), title: this.getTitle() }, this.titolo), index.h("slot", { key: '0da8178876227c66042f1c6dfe5378264baf519b', name: "icon" })));
-    }
-};
-ZMyzCardHeader.style = stylesCss();
-
-exports.z_myz_card = ZMyzCardComponent;
-exports.z_myz_card_body = ZMyzCardBody;
-exports.z_myz_card_cover = ZMyzCardCover;
-exports.z_myz_card_header = ZMyzCardHeader;
-//# sourceMappingURL=z-myz-card.z-myz-card-body.z-myz-card-cover.z-myz-card-header.entry.cjs.js.map
-
-//# sourceMappingURL=z-myz-card_4.cjs.entry.js.map

package/dist/cjs/z-myz-card_4.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"z-myz-card_4.cjs.entry.js","mappings":"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","names":["stylesCss","LicenseType","h"],"sources":["src/snowflakes/myz/card/z-myz-card/styles.css?tag=z-myz-card&encapsulation=shadow","src/snowflakes/myz/card/z-myz-card/index.tsx","src/snowflakes/myz/card/z-myz-card-body/styles.css?tag=z-myz-card-body&encapsulation=shadow","src/snowflakes/myz/card/z-myz-card-body/index.tsx","src/snowflakes/myz/card/z-myz-card-cover/styles.css?tag=z-myz-card-cover&encapsulation=shadow","src/snowflakes/myz/card/z-myz-card-cover/index.tsx","src/snowflakes/myz/card/z-myz-card-header/styles.css?tag=z-myz-card-header&encapsulation=shadow","src/snowflakes/myz/card/z-myz-card-header/index.tsx"],"sourcesContent":[":host {\n  --card-overflow: hidden;\n}\n\ndiv {\n  display: flex;\n  overflow: var(--card-overflow);\n  width: auto;\n  width: 256px; /* TODO: width must be 100% - must be handled in dashboard */\n  height: 522px;\n  box-sizing: border-box;\n  flex-direction: column;\n  border: var(--border-size-medium) solid var(--color-surface03);\n  background-color: var(--color-surface01);\n  border-radius: var(--border-radius);\n}\n\ndiv.real,\ndiv.trial,\ndiv.temp {\n  border-color: var(--blue100);\n}\n\n/* HIDDEN status */\ndiv.faded {\n  border: var(--border-size-medium) solid var(--color-background);\n}\n\n/* HIGHLIGHTED status */\ndiv.highlighted {\n  box-shadow: var(--shadow-4);\n  outline: none;\n}\n\n/* PRESSED status */\ndiv.pressed {\n  box-shadow: var(--shadow-8);\n  outline: none;\n}\n\ndiv:focus {\n  box-shadow: var(--shadow-focus-primary);\n  outline: none;\n}\n","import {Component, ComponentInterface, h, Prop} from \"@stencil/core\";\nimport {LicenseType} from \"../../../../beans/index\";\n\n/**\n * @slot - generic card slot\n */\n@Component({\n  tag: \"z-myz-card\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZMyzCardComponent implements ComponentInterface {\n  /** faded status */\n  @Prop()\n  faded: boolean;\n\n  /** graphic variant (optional) */\n  @Prop()\n  cardtype?: LicenseType;\n\n  /** pressed status */\n  @Prop()\n  ispressed = false;\n\n  /** highlighted status */\n  @Prop()\n  ishighlighted = false;\n\n  private retrieveClass(): string {\n    let elemClasses = \"\";\n\n    if (this.cardtype === LicenseType.REAL) {\n      elemClasses += \"real\";\n    } else if (this.cardtype === LicenseType.TRIAL) {\n      elemClasses += \"trial\";\n    } else if (this.cardtype === LicenseType.TEMP) {\n      elemClasses += \"temp\";\n    }\n\n    if (this.faded) {\n      elemClasses += \" faded\";\n    } else if (this.ispressed) {\n      elemClasses += \" pressed\";\n    } else if (this.ishighlighted) {\n      elemClasses += \" highlighted\";\n    }\n\n    return elemClasses;\n  }\n\n  render(): HTMLDivElement {\n    return (\n      <div\n        class={this.retrieveClass()}\n        tabindex=\"0\"\n      >\n        <slot />\n      </div>\n    );\n  }\n}\n",":host {\n  width: auto;\n  height: 340px;\n}\n\n:host > div {\n  position: relative;\n  display: flex;\n  width: auto;\n  height: 340px;\n  align-items: center;\n  justify-content: center;\n}\n","import {Component, ComponentInterface, h} from \"@stencil/core\";\n\n/**\n * @slot alert - card alert slot\n * @slot cover - book cover slot\n */\n@Component({\n  tag: \"z-myz-card-body\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZMyzCardBody implements ComponentInterface {\n  render(): HTMLDivElement {\n    return (\n      <div>\n        <slot name=\"alert\"></slot>\n        <slot name=\"cover\" />\n      </div>\n    );\n  }\n}\n","img {\n  display: block;\n  max-width: 100%;\n  height: 340px;\n  margin: auto;\n  object-fit: cover;\n}\n\nimg.faded {\n  opacity: 0.3;\n}\n","import {Component, ComponentInterface, Prop, h} from \"@stencil/core\";\n\n@Component({\n  tag: \"z-myz-card-cover\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZMyzCardCover implements ComponentInterface {\n  /** image source */\n  @Prop()\n  img: string;\n\n  /** cover alt title */\n  @Prop()\n  titolo: string;\n\n  /** faded status */\n  @Prop()\n  faded: boolean;\n\n  /** default error image source */\n  @Prop()\n  defaultimg: string;\n\n  private hadleOnImageError(): void {\n    this.img = this.defaultimg;\n  }\n\n  render(): HTMLImageElement {\n    return (\n      <img\n        class={this.faded && \"faded\"}\n        onError={this.hadleOnImageError.bind(this)}\n        alt={this.titolo}\n        src={this.img}\n      />\n    );\n  }\n}\n","header {\n  position: relative;\n  display: flex;\n  width: auto;\n  height: calc(var(--space-unit) * 6);\n  flex-direction: row;\n  align-items: flex-start;\n  justify-content: space-between;\n  border-bottom: var(--border-size-medium) solid var(--color-surface03);\n  background-color: var(--color-surface01);\n  border-radius: var(--border-radius) var(--border-radius) var(--border-no-radius) var(--border-no-radius);\n}\n\nslot[name=\"aria-heading\"]::slotted(*) {\n  position: absolute;\n  overflow: hidden !important;\n  width: 1px !important;\n  height: 1px !important;\n  padding: 0 !important;\n  border: 0 none !important;\n  margin: -1px !important;\n  clip: rect(0, 0, 0, 0) !important;\n  white-space: nowrap !important;\n}\n\nheader.real,\nheader.trial,\nheader.temp {\n  border-bottom: var(--border-size-medium) solid var(--blue100);\n  background-color: var(--color-primary03);\n}\n\n.card-title {\n  overflow: hidden;\n  height: calc(var(--space-unit) * 2);\n  padding: calc(var(--space-unit) * 2);\n  margin: 0;\n  color: var(--color-surface05);\n  font-family: var(--font-family-sans);\n  font-size: 12px;\n  font-weight: var(--font-sb);\n  letter-spacing: 0.22px;\n  line-height: calc(var(--space-unit) * 2);\n  text-overflow: ellipsis;\n  text-transform: uppercase;\n  white-space: nowrap;\n}\n\n.faded {\n  border-bottom: var(--border-size-medium) solid var(--color-background);\n}\n\n.faded.real,\n.faded.trial,\n.faded.temp {\n  border-top: var(--border-size-medium) solid var(--blue100);\n  border-right: var(--border-size-medium) solid var(--blue100);\n  border-left: var(--border-size-medium) solid var(--blue100);\n}\n","import {Component, ComponentInterface, Prop, State, h} from \"@stencil/core\";\nimport {JSXBase} from \"@stencil/core/internal\";\nimport {LicenseType} from \"../../../../beans/index\";\n\n/**\n * @slot icon - card header icon slot\n */\n@Component({\n  tag: \"z-myz-card-header\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZMyzCardHeader implements ComponentInterface {\n  /** volume title */\n  @Prop()\n  titolo: string;\n\n  /** faded status */\n  @Prop()\n  faded: boolean;\n\n  /** card graphic variant (optional) */\n  @Prop()\n  cardtype?: LicenseType;\n\n  @State()\n  allowTooltip = false;\n\n  private ellipsis?: HTMLElement;\n\n  private getTitle(): string {\n    return this.allowTooltip ? this.titolo : \"\";\n  }\n\n  componentDidLoad(): void {\n    if (this.elementHasEllipsis()) {\n      this.allowTooltip = true;\n    }\n  }\n\n  private elementHasEllipsis(): boolean {\n    return this.ellipsis.offsetWidth < this.ellipsis.scrollWidth;\n  }\n\n  private retrieveClass(): JSXBase.HTMLAttributes[\"class\"] {\n    return {\n      real: this.cardtype === LicenseType.REAL,\n      trial: this.cardtype === LicenseType.TRIAL,\n      temp: this.cardtype === LicenseType.TEMP,\n      faded: this.faded,\n    };\n  }\n\n  render(): HTMLElement {\n    return (\n      <header class={this.retrieveClass()}>\n        <slot name=\"aria-heading\" />\n        <span\n          class=\"card-title\"\n          ref={(el) => (this.ellipsis = el as HTMLElement)}\n          title={this.getTitle()}\n        >\n          {this.titolo}\n        </span>\n        <slot name=\"icon\" />\n      </header>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/z-myz-list-item.cjs.entry.js

@@ -1,38 +0,0 @@
-'use strict';
-
-var index = require('./index-CZz7uP-M.js');
-var utils = require('./utils-C0QY75C2.js');
-require('./index-DppFfqsn.js');
-require('./breakpoints-B7vFm-3T.js');
-
-const stylesCss = () => `:host li{all:unset;all:reset;width:100%;line-height:14px;list-style-type:none}:host li>span{display:flex;padding:calc(var(--space-unit) * 2) 0;color:var(--color-default-text);fill:var(--color-default-icon);font-family:var(--font-family-sans);font-size:16px;font-weight:var(--font-rg);letter-spacing:0.23px;line-height:14px}:host(.small) li>span{padding:calc(var(--space-unit) * 1.5) 0;font-size:var(--font-size-2)}:host(.x-small) li>span{padding:var(--space-unit) 0;font-size:var(--font-size-2)}:host(.small) li>span>z-icon,:host(.x-small) li>span>z-icon{--z-icon-width:16px;--z-icon-height:16px;--z-icon-right-margin:calc(var(--space-unit) * 0.5);padding:0}:host li>span.border{border-bottom:2px solid var(--color-surface03)}:host li span:hover,a:hover{color:var(--color-primary01);fill:var(--color-primary01)}a,a:visited,a:active{color:inherit;fill:inherit;text-decoration:none}:host li span z-icon{width:calc(var(--space-unit) * 2);height:calc(var(--space-unit) * 2);padding:0 calc(var(--space-unit) * 1.5) 0 0;background-repeat:no-repeat;background-size:contain;color:var(--color-primary01);fill:var(--color-primary01)}`;
-
-const ZMyzListItem = class {
-    emitZListItemLinkClick(e, linkId) {
-        this.zListItemLinkClick.emit({ e, linkId });
-    }
-    emitZListItemClick(e, listitemid) {
-        this.zListItemClick.emit({ e, listitemid });
-    }
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.zListItemLinkClick = index.createEvent(this, "zListItemLinkClick", 7);
-        this.zListItemClick = index.createEvent(this, "zListItemClick", 7);
-        /** link target (optional) */
-        this.linktarget = "_self";
-        /** underlined style flag */
-        this.underlined = true;
-        this.emitZListItemLinkClick = this.emitZListItemLinkClick.bind(this);
-        this.emitZListItemClick = this.emitZListItemClick.bind(this);
-    }
-    render() {
-        const linkId = this.listitemid ? `link_${this.listitemid}` : "";
-        return (index.h("li", { key: '5364c5d28f9c27c67edb4e0bdcb1149f82ced9b6', role: "button", id: this.listitemid, "data-action": this.action, onClick: (e) => this.emitZListItemClick(e, this.listitemid), onKeyPress: (ev) => utils.handleKeyboardSubmit(ev, this.emitZListItemClick, this.listitemid) }, index.h("span", { key: 'beb568968c53a442f27900b428f0fe5d0ac2703d', class: this.underlined && "border" }, this.icon && index.h("z-icon", { key: '60bb559247dc40d349b83469baf081dcd1a23fae', name: this.icon }), this.link ? (index.h("a", { href: this.link ? this.link : null, target: this.linktarget, id: linkId, onClick: (e) => this.emitZListItemLinkClick(e, linkId), onKeyPress: (ev) => utils.handleKeyboardSubmit(ev, this.emitZListItemLinkClick, linkId), role: this.link ? "link" : "button", tabindex: "0" }, this.text)) : (index.h("span", { innerHTML: this.text })), index.h("slot", { key: '2c8731d7877f7675d388f8be3eb833a8fcc75bd0' }))));
-    }
-};
-ZMyzListItem.style = stylesCss();
-
-exports.z_myz_list_item = ZMyzListItem;
-//# sourceMappingURL=z-myz-list-item.entry.cjs.js.map
-
-//# sourceMappingURL=z-myz-list-item.cjs.entry.js.map

package/dist/cjs/z-myz-list-item.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"z-myz-list-item.cjs.entry.js","mappings":";;;;;;;AAAA,MAAM,SAAS,GAAG,MAAM,CAAC,mmCAAmmC,CAAC;;MCQhnC,YAAY,GAAA,MAAA;IAiCf,sBAAsB,CAAC,CAAa,EAAE,MAAM,EAAA;QAClD,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,EAAC,CAAC,EAAE,MAAM,EAAC,CAAC;;IAOnC,kBAAkB,CAAC,CAAa,EAAE,UAAU,EAAA;QAClD,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,EAAC,CAAC,EAAE,UAAU,EAAC,CAAC;;AAG3C,IAAA,WAAA,CAAA,OAAA,EAAA;;;;;AAlCA,QAAA,IAAA,CAAA,UAAU,GAAY,OAAO;;AAgB7B,QAAA,IAAA,CAAA,UAAU,GAAG,IAAI;QAmBf,IAAI,CAAC,sBAAsB,GAAG,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,IAAI,CAAC;QACpE,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC;AAC7D;IAED,MAAM,GAAA;AACJ,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,UAAU,GAAG,CAAA,KAAA,EAAQ,IAAI,CAAC,UAAU,CAAA,CAAE,GAAG,EAAE;QAE/D,QACEA,OAAA,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,IAAI,EAAC,QAAQ,EACb,EAAE,EAAE,IAAI,CAAC,UAAU,EAAA,aAAA,EACN,IAAI,CAAC,MAAM,EACxB,OAAO,EAAE,CAAC,CAAa,KAAK,IAAI,CAAC,kBAAkB,CAAC,CAAC,EAAE,IAAI,CAAC,UAAU,CAAC,EACvE,UAAU,EAAE,CAAC,EAAiB,KAAKC,0BAAoB,CAAC,EAAE,EAAE,IAAI,CAAC,kBAAkB,EAAE,IAAI,CAAC,UAAU,CAAC,EAAA,EAErGD,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAE,IAAI,CAAC,UAAU,IAAI,QAAQ,EAAA,EACrC,IAAI,CAAC,IAAI,IAAIA,OAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAQ,IAAI,EAAE,IAAI,CAAC,IAAI,EAAA,CAAI,EACxC,IAAI,CAAC,IAAI,IACRA,OAAA,CAAA,GAAA,EAAA,EACE,IAAI,EAAE,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,GAAG,IAAI,EAClC,MAAM,EAAE,IAAI,CAAC,UAAU,EACvB,EAAE,EAAE,MAAM,EACV,OAAO,EAAE,CAAC,CAAa,KAAK,IAAI,CAAC,sBAAsB,CAAC,CAAC,EAAE,MAAM,CAAC,EAClE,UAAU,EAAE,CAAC,EAAiB,KAAKC,0BAAoB,CAAC,EAAE,EAAE,IAAI,CAAC,sBAAsB,EAAE,MAAM,CAAC,EAChG,IAAI,EAAE,IAAI,CAAC,IAAI,GAAG,MAAM,GAAG,QAAQ,EACnC,QAAQ,EAAC,GAAG,EAAA,EAEX,IAAI,CAAC,IAAI,CACR,KAEJD,OAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,IAAI,CAAC,IAAI,EAAA,CAAS,CACpC,EACDA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAQ,CACH,CACJ;;;;;;;","names":["h","handleKeyboardSubmit"],"sources":["src/snowflakes/myz/list/z-myz-list-item/styles.css?tag=z-myz-list-item&encapsulation=shadow","src/snowflakes/myz/list/z-myz-list-item/index.tsx"],"sourcesContent":[":host li {\n  all: unset;\n  all: reset;\n  width: 100%;\n  line-height: 14px;\n  list-style-type: none;\n}\n\n:host li > span {\n  display: flex;\n  padding: calc(var(--space-unit) * 2) 0;\n  color: var(--color-default-text);\n  fill: var(--color-default-icon);\n  font-family: var(--font-family-sans);\n  font-size: 16px;\n  font-weight: var(--font-rg);\n  letter-spacing: 0.23px;\n  line-height: 14px;\n}\n\n:host(.small) li > span {\n  padding: calc(var(--space-unit) * 1.5) 0;\n  font-size: var(--font-size-2);\n}\n\n:host(.x-small) li > span {\n  padding: var(--space-unit) 0;\n  font-size: var(--font-size-2);\n}\n\n:host(.small) li > span > z-icon,\n:host(.x-small) li > span > z-icon {\n  --z-icon-width: 16px;\n  --z-icon-height: 16px;\n  --z-icon-right-margin: calc(var(--space-unit) * 0.5);\n\n  padding: 0;\n}\n\n:host li > span.border {\n  border-bottom: 2px solid var(--color-surface03);\n}\n\n:host li span:hover,\na:hover {\n  color: var(--color-primary01);\n  fill: var(--color-primary01);\n}\n\na,\na:visited,\na:active {\n  color: inherit;\n  fill: inherit;\n  text-decoration: none;\n}\n\n:host li span z-icon {\n  width: calc(var(--space-unit) * 2);\n  height: calc(var(--space-unit) * 2);\n  padding: 0 calc(var(--space-unit) * 1.5) 0 0;\n  background-repeat: no-repeat;\n  background-size: contain;\n  color: var(--color-primary01);\n  fill: var(--color-primary01);\n}\n","import {Component, ComponentInterface, Event, EventEmitter, Prop, h} from \"@stencil/core\";\nimport {handleKeyboardSubmit} from \"../../../../utils/utils\";\n\n@Component({\n  tag: \"z-myz-list-item\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZMyzListItem implements ComponentInterface {\n  /** content text */\n  @Prop()\n  text: string;\n\n  /** link url (optional) */\n  @Prop()\n  link?: string;\n\n  /** link target (optional) */\n  @Prop()\n  linktarget?: string = \"_self\";\n\n  /** icon name (optional) */\n  @Prop()\n  icon?: string;\n\n  /** id (optional) */\n  @Prop()\n  listitemid?: string;\n\n  /** data-action attribute (optional) */\n  @Prop()\n  action?: string;\n\n  /** underlined style flag */\n  @Prop()\n  underlined = true;\n\n  /** emitted on list item link click, returns linkId */\n  @Event()\n  zListItemLinkClick: EventEmitter;\n\n  private emitZListItemLinkClick(e: MouseEvent, linkId): void {\n    this.zListItemLinkClick.emit({e, linkId});\n  }\n\n  /** emitted on list item click, returns listitemid */\n  @Event()\n  zListItemClick: EventEmitter;\n\n  private emitZListItemClick(e: MouseEvent, listitemid): void {\n    this.zListItemClick.emit({e, listitemid});\n  }\n\n  constructor() {\n    this.emitZListItemLinkClick = this.emitZListItemLinkClick.bind(this);\n    this.emitZListItemClick = this.emitZListItemClick.bind(this);\n  }\n\n  render(): HTMLLIElement {\n    const linkId = this.listitemid ? `link_${this.listitemid}` : \"\";\n\n    return (\n      <li\n        role=\"button\"\n        id={this.listitemid}\n        data-action={this.action}\n        onClick={(e: MouseEvent) => this.emitZListItemClick(e, this.listitemid)}\n        onKeyPress={(ev: KeyboardEvent) => handleKeyboardSubmit(ev, this.emitZListItemClick, this.listitemid)}\n      >\n        <span class={this.underlined && \"border\"}>\n          {this.icon && <z-icon name={this.icon} />}\n          {this.link ? (\n            <a\n              href={this.link ? this.link : null}\n              target={this.linktarget}\n              id={linkId}\n              onClick={(e: MouseEvent) => this.emitZListItemLinkClick(e, linkId)}\n              onKeyPress={(ev: KeyboardEvent) => handleKeyboardSubmit(ev, this.emitZListItemLinkClick, linkId)}\n              role={this.link ? \"link\" : \"button\"}\n              tabindex=\"0\"\n            >\n              {this.text}\n            </a>\n          ) : (\n            <span innerHTML={this.text}></span>\n          )}\n          <slot />\n        </span>\n      </li>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/z-myz-list.cjs.entry.js

@@ -1,38 +0,0 @@
-'use strict';
-
-var index = require('./index-CZz7uP-M.js');
-
-const stylesCss = () => `ul{padding:0;margin:0}`;
-
-const ZMyzList = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-    }
-    componentWillLoad() {
-        if (this.inputrawdata) {
-            this.parseinputrawdata(this.inputrawdata);
-        }
-    }
-    parseinputrawdata(inputrawdata) {
-        this.list = [...JSON.parse(inputrawdata)];
-    }
-    oninputrawdataChange(newValue) {
-        this.parseinputrawdata(newValue);
-    }
-    render() {
-        const lastElem = this.list ? this.list.length - 1 : -1;
-        return (index.h("ul", { key: '68407f9f3732f51af43763651c228bf950aada69' }, this.list &&
-            this.list.map((bean, i) => (index.h("z-myz-list-item", { listitemid: bean.listitemid, text: bean.text, link: bean.link, linktarget: bean.linktarget, icon: bean.icon, underlined: lastElem != i })))));
-    }
-    static get watchers() { return {
-        "inputrawdata": [{
-                "oninputrawdataChange": 0
-            }]
-    }; }
-};
-ZMyzList.style = stylesCss();
-
-exports.z_myz_list = ZMyzList;
-//# sourceMappingURL=z-myz-list.entry.cjs.js.map
-
-//# sourceMappingURL=z-myz-list.cjs.entry.js.map

package/dist/cjs/z-myz-list.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"z-myz-list.cjs.entry.js","mappings":";;;;AAAA,MAAM,SAAS,GAAG,MAAM,CAAC,sBAAsB,CAAC;;MCQnC,QAAQ,GAAA,MAAA;;;;IASnB,iBAAiB,GAAA;AACf,QAAA,IAAI,IAAI,CAAC,YAAY,EAAE;AACrB,YAAA,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,YAAY,CAAC;;;AAIrC,IAAA,iBAAiB,CAAC,YAAoB,EAAA;AAC5C,QAAA,IAAI,CAAC,IAAI,GAAG,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC;;AAI3C,IAAA,oBAAoB,CAAC,QAAgB,EAAA;AACnC,QAAA,IAAI,CAAC,iBAAiB,CAAC,QAAQ,CAAC;;IAGlC,MAAM,GAAA;QACJ,MAAM,QAAQ,GAAG,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,GAAG,EAAE;AAEtD,QAAA,QACEA,OAAA,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACG,IAAI,CAAC,IAAI;YACR,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,MACpBA,OAAA,CAAA,iBAAA,EAAA,EACE,UAAU,EAAE,IAAI,CAAC,UAAU,EAC3B,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,UAAU,EAAE,IAAI,CAAC,UAAU,EAC3B,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,UAAU,EAAE,QAAQ,IAAI,CAAC,EAAA,CACzB,CACH,CAAC,CACD;;;;;;;;;;;;","names":["h"],"sources":["src/snowflakes/myz/list/z-myz-list/styles.css?tag=z-myz-list&encapsulation=shadow","src/snowflakes/myz/list/z-myz-list/index.tsx"],"sourcesContent":["ul {\n  padding: 0;\n  margin: 0;\n}\n","import {Component, ComponentInterface, Prop, Watch, h} from \"@stencil/core\";\nimport {ListItem} from \"../../../../beans/index.js\";\n\n@Component({\n  tag: \"z-myz-list\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZMyzList implements ComponentInterface {\n  /** json stringified list data (mutable, optional) */\n  @Prop()\n  inputrawdata?: string;\n\n  /** list item data (mutable, optional)*/\n  @Prop({mutable: true})\n  list?: ListItem[];\n\n  componentWillLoad(): void {\n    if (this.inputrawdata) {\n      this.parseinputrawdata(this.inputrawdata);\n    }\n  }\n\n  private parseinputrawdata(inputrawdata: string): void {\n    this.list = [...JSON.parse(inputrawdata)];\n  }\n\n  @Watch(\"inputrawdata\")\n  oninputrawdataChange(newValue: string): void {\n    this.parseinputrawdata(newValue);\n  }\n\n  render(): HTMLUListElement {\n    const lastElem = this.list ? this.list.length - 1 : -1;\n\n    return (\n      <ul>\n        {this.list &&\n          this.list.map((bean, i) => (\n            <z-myz-list-item\n              listitemid={bean.listitemid}\n              text={bean.text}\n              link={bean.link}\n              linktarget={bean.linktarget}\n              icon={bean.icon}\n              underlined={lastElem != i}\n            />\n          ))}\n      </ul>\n    );\n  }\n}\n"],"version":3}

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

@@ -1,44 +0,0 @@
-'use strict';
-
-var index = require('./index-CZz7uP-M.js');
-var index$1 = require('./index-DppFfqsn.js');
-
-const stylesCss = () => `input:focus{box-shadow:var(--shadow-focus-primary);outline:none !important}:host{font-family:var(--font-family-sans);font-weight:var(--font-rg)}.digits-container{display:flex;justify-content:flex-start}input{width:calc(var(--space-unit) * 5);height:72px;box-sizing:border-box;padding:0;caret-color:transparent;color:var(--color-surface05);font-family:var(--font-family-sans);font-size:32px;font-weight:300;text-align:center}input.error{border:1px solid;border-color:var(--color-default-error);background-color:var(--color-inverse-error);border-radius:4px}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)}}`;
-
-const ZOtp = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.otpChange = index.createEvent(this, "otpChange", 7);
-        /** Input number */
-        this.inputNum = 6;
-    }
-    emitInputChange(value) {
-        this.otpChange.emit({ value });
-    }
-    componentWillLoad() {
-        this.otp = [...Array(this.inputNum)];
-        this.otpRef = [...Array(this.inputNum)];
-    }
-    render() {
-        return (index.h("div", { key: '82943f654f3601a203981bc476a5e58378604331', class: "otp-container" }, index.h("div", { key: '0e069bb23f23ff9e97bb094b3ccce57d5adeb1b1', class: "digits-container" }, this.otp.map((_val, i) => (index.h("input", { class: this.status == index$1.InputStatus.ERROR ? "error" : null, onKeyDown: (e) => {
-                if (e.keyCode > 47) {
-                    this.otpRef[i].value = "";
-                }
-            }, onKeyUp: (e) => {
-                if (e.keyCode > 47) {
-                    if (i < this.inputNum - 1) {
-                        this.otpRef[i + 1].focus();
-                    }
-                }
-            }, onInput: (e) => {
-                this.otp[i] = e.target.value;
-                this.emitInputChange(this.otp.join(""));
-            }, type: "text", minlength: "1", maxlength: "1", autoComplete: "off", ref: (el) => (this.otpRef[i] = el) })))), index.h("z-input-message", { key: '752f2b63c997e9b6ff2e239537e15b1a1a2719c7', message: this.message, status: this.status })));
-    }
-};
-ZOtp.style = stylesCss();
-
-exports.z_otp = ZOtp;
-//# sourceMappingURL=z-otp.entry.cjs.js.map
-
-//# sourceMappingURL=z-otp.cjs.entry.js.map

package/dist/cjs/z-otp.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"z-otp.cjs.entry.js","mappings":";;;;;AAAA,MAAM,SAAS,GAAG,MAAM,CAAC,oyBAAoyB,CAAC;;MCQjzB,IAAI,GAAA,MAAA;AALjB,IAAA,WAAA,CAAA,OAAA,EAAA;;;;AAQE,QAAA,IAAA,CAAA,QAAQ,GAAY,CAAC;AAiEtB;AA/CS,IAAA,eAAe,CAAC,KAAa,EAAA;QACnC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,EAAC,KAAK,EAAC,CAAC;;IAG9B,iBAAiB,GAAA;AACf,QAAA,IAAI,CAAC,GAAG,GAAG,CAAC,GAAG,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;AACpC,QAAA,IAAI,CAAC,MAAM,GAAG,CAAC,GAAG,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;;IAGzC,MAAM,GAAA;AACJ,QAAA,QACEA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,eAAe,EAAA,EACxBA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,kBAAkB,IAC1B,IAAI,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,MACpBA,mBACE,KAAK,EAAE,IAAI,CAAC,MAAM,IAAIC,mBAAW,CAAC,KAAK,GAAG,OAAO,GAAG,IAAI,EACxD,SAAS,EAAE,CAAC,CAAgB,KAAI;AAC9B,gBAAA,IAAI,CAAC,CAAC,OAAO,GAAG,EAAE,EAAE;oBAClB,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,KAAK,GAAG,EAAE;;AAE7B,aAAC,EACD,OAAO,EAAE,CAAC,CAAgB,KAAI;AAC5B,gBAAA,IAAI,CAAC,CAAC,OAAO,GAAG,EAAE,EAAE;oBAClB,IAAI,CAAC,GAAG,IAAI,CAAC,QAAQ,GAAG,CAAC,EAAE;wBACzB,IAAI,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,EAAE;;;AAGhC,aAAC,EACD,OAAO,EAAE,CAAC,CAAa,KAAI;gBACzB,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,GAAI,CAAC,CAAC,MAA2B,CAAC,KAAK;AAClD,gBAAA,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzC,aAAC,EACD,IAAI,EAAC,MAAM,EACX,SAAS,EAAC,GAAG,EACb,SAAS,EAAC,GAAG,EACb,YAAY,EAAC,KAAK,EAClB,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,EAAA,CAClC,CACH,CAAC,CACE,EACND,OAAA,CAAA,iBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,MAAM,EAAE,IAAI,CAAC,MAAM,EAAA,CACF,CACf;;;;;;;","names":["h","InputStatus"],"sources":["src/snowflakes/myz/z-otp/styles.css?tag=z-otp&encapsulation=shadow","src/snowflakes/myz/z-otp/index.tsx"],"sourcesContent":["input:focus {\n  box-shadow: var(--shadow-focus-primary);\n  outline: none !important;\n}\n\n:host {\n  font-family: var(--font-family-sans);\n  font-weight: var(--font-rg);\n}\n\n.digits-container {\n  display: flex;\n  justify-content: flex-start;\n}\n\ninput {\n  width: calc(var(--space-unit) * 5);\n  height: 72px;\n  box-sizing: border-box;\n  padding: 0;\n  caret-color: transparent;\n  color: var(--color-surface05);\n  font-family: var(--font-family-sans);\n  font-size: 32px;\n  font-weight: 300;\n  text-align: center;\n}\n\ninput.error {\n  border: 1px solid;\n  border-color: var(--color-default-error);\n  background-color: var(--color-inverse-error);\n  border-radius: 4px;\n}\n\ninput:not(:last-of-type) {\n  margin-right: var(--space-unit);\n}\n\n/* Tablet breakpoint */\n@media only screen and (min-width: 768px) {\n  input:not(:last-of-type) {\n    margin-right: calc(var(--space-unit) * 2);\n  }\n}\n\n/* Desktop breakpoint */\n@media only screen and (min-width: 1025px) {\n  input {\n    width: calc(var(--space-unit) * 6);\n  }\n}\n","import {Component, ComponentInterface, Event, EventEmitter, Prop, h} from \"@stencil/core\";\nimport {InputStatus} from \"../../../beans\";\n\n@Component({\n  tag: \"z-otp\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZOtp implements ComponentInterface {\n  /** Input number */\n  @Prop()\n  inputNum?: number = 6;\n\n  /** Input status */\n  @Prop()\n  status?: InputStatus;\n\n  /** Input message */\n  @Prop()\n  message?: string;\n\n  private otp: string[];\n\n  private otpRef: HTMLInputElement[];\n\n  /** Otp change event */\n  @Event()\n  otpChange: EventEmitter;\n\n  private emitInputChange(value: string): void {\n    this.otpChange.emit({value});\n  }\n\n  componentWillLoad(): void {\n    this.otp = [...Array(this.inputNum)];\n    this.otpRef = [...Array(this.inputNum)];\n  }\n\n  render(): HTMLDivElement {\n    return (\n      <div class=\"otp-container\">\n        <div class=\"digits-container\">\n          {this.otp.map((_val, i) => (\n            <input\n              class={this.status == InputStatus.ERROR ? \"error\" : null}\n              onKeyDown={(e: KeyboardEvent) => {\n                if (e.keyCode > 47) {\n                  this.otpRef[i].value = \"\";\n                }\n              }}\n              onKeyUp={(e: KeyboardEvent) => {\n                if (e.keyCode > 47) {\n                  if (i < this.inputNum - 1) {\n                    this.otpRef[i + 1].focus();\n                  }\n                }\n              }}\n              onInput={(e: InputEvent) => {\n                this.otp[i] = (e.target as HTMLInputElement).value;\n                this.emitInputChange(this.otp.join(\"\"));\n              }}\n              type=\"text\"\n              minlength=\"1\"\n              maxlength=\"1\"\n              autoComplete=\"off\"\n              ref={(el) => (this.otpRef[i] = el)}\n            />\n          ))}\n        </div>\n        <z-input-message\n          message={this.message}\n          status={this.status}\n        ></z-input-message>\n      </div>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/z-panel-elem.cjs.entry.js

@@ -1,30 +0,0 @@
-'use strict';
-
-var index = require('./index-CZz7uP-M.js');
-
-const stylesCss = () => `.sc-z-panel-elem-h{width:inherit;font-family:var(--font-family sans);font-weight:var(--font-rg)}.panel-elem-container.sc-z-panel-elem{width:100%}.panel-elem-icon.sc-z-panel-elem{margin:auto calc(var(--space-unit) * 3)}.panel-elem-icon.sc-z-panel-elem img.sc-z-panel-elem{display:block;max-width:96px;height:32px;margin:auto;object-fit:contain}.panel-elem-link.sc-z-panel-elem{display:flex;align-items:center;justify-content:center;margin:var(--space-unit) auto 0;border-radius:var(--border-no-radius);font-size:12px}.panel-elem-link.sc-z-panel-elem>a.z-link.sc-z-panel-elem{padding:calc(var(--space-unit) * 0.5) 0;font-weight:var(--font-sb)}.panel-elem-desc.sc-z-panel-elem{padding-top:var(--space-unit);margin:0;letter-spacing:0.16px;text-align:center}a.sc-z-panel-elem>z-icon.sc-z-panel-elem{margin-right:var(--space-unit)}`;
-
-const ZPanelElem = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        /** link target (optional) */
-        this.target = "_blank";
-        /** disabled status flag (optional) */
-        this.isdisabled = false;
-    }
-    render() {
-        const elemId = this.elemid ? this.elemid : "";
-        return (index.h("div", { key: '3d07681afc0fea36faebcb7feb5a8130db27672e', class: "panel-elem-container" }, (this.imgurl || this.imgalt) && (index.h("div", { key: '0ceb3c7b1a4a0b201dee2ae89ac094e4adfdff52', "aria-hidden": "true", class: "panel-elem-icon" }, index.h("img", { key: '5fbfffb0c4ab329e207ec4c9eccc87fa7ec85b4a', src: this.imgurl, alt: this.imgalt }))), index.h("div", { key: 'fc374daf3f398ce285209f2c4a11ecd78e2e1af6', class: "panel-elem-link" }, index.h("a", { key: '1aabbd26a88c3d6b9ae9da80330f882a1bedadf2', class: {
-                "z-link": true,
-                "z-link-disabled": this.isdisabled,
-                "z-link-icon": true,
-                "z-link-blue": true,
-            }, id: elemId + "link_id", href: this.url, target: this.target }, index.h("z-icon", { key: '2adfbfee7ceeb9f9ca87f5c3684424142dea1752', height: 14, width: 14, name: this.linkicon }), this.linklabel)), this.descrSlotName && (index.h("div", { key: '0dffd18adfba92a541a00e80857b7eef8219f8bf', class: "panel-elem-desc" }, index.h("slot", { key: 'd135bf6110db25151199d167c659e5bcab7acecd', name: this.descrSlotName })))));
-    }
-};
-ZPanelElem.style = stylesCss();
-
-exports.z_panel_elem = ZPanelElem;
-//# sourceMappingURL=z-panel-elem.entry.cjs.js.map
-
-//# sourceMappingURL=z-panel-elem.cjs.entry.js.map

package/dist/cjs/z-panel-elem.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"z-panel-elem.cjs.entry.js","mappings":";;;;AAAA,MAAM,SAAS,GAAG,MAAM,CAAC,yzBAAyzB,CAAC;;MCWt0B,UAAU,GAAA,MAAA;AANvB,IAAA,WAAA,CAAA,OAAA,EAAA;;;AAiCE,QAAA,IAAA,CAAA,MAAM,GAAY,QAAQ;;AAI1B,QAAA,IAAA,CAAA,UAAU,GAAa,KAAK;AAkD7B;IA5CC,MAAM,GAAA;AACJ,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM,GAAG,EAAE;QAE7C,QACEA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,sBAAsB,EAAA,EAC9B,CAAC,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,MAAM,MAC1BA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,aAAA,EACc,MAAM,EAClB,KAAK,EAAC,iBAAiB,EAAA,EAEvBA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,GAAG,EAAE,IAAI,CAAC,MAAM,EAChB,GAAG,EAAE,IAAI,CAAC,MAAM,EAAA,CAChB,CACE,CACP,EACDA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,iBAAiB,EAAA,EAC1BA,OAAA,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE;AACL,gBAAA,QAAQ,EAAE,IAAI;gBACd,iBAAiB,EAAE,IAAI,CAAC,UAAU;AAClC,gBAAA,aAAa,EAAE,IAAI;AACnB,gBAAA,aAAa,EAAE,IAAI;AACpB,aAAA,EACD,EAAE,EAAE,MAAM,GAAG,SAAS,EACtB,IAAI,EAAE,IAAI,CAAC,GAAG,EACd,MAAM,EAAE,IAAI,CAAC,MAAM,EAAA,EAEnBA,OAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,MAAM,EAAE,EAAE,EACV,KAAK,EAAE,EAAE,EACT,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAA,CACX,EACT,IAAI,CAAC,SAAS,CACb,CACA,EACL,IAAI,CAAC,aAAa,KACjBA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,iBAAiB,EAAA,EAC1BA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAE,IAAI,CAAC,aAAa,GAAI,CAC9B,CACP,CACG;;;;;;;","names":["h"],"sources":["src/components/z-panel-elem/styles.css?tag=z-panel-elem&encapsulation=scoped","src/components/z-panel-elem/index.tsx"],"sourcesContent":[":host {\n  width: inherit;\n  font-family: var(--font-family sans);\n  font-weight: var(--font-rg);\n}\n\n.panel-elem-container {\n  width: 100%;\n}\n\n.panel-elem-icon {\n  margin: auto calc(var(--space-unit) * 3);\n}\n\n.panel-elem-icon img {\n  display: block;\n  max-width: 96px;\n  height: 32px;\n  margin: auto;\n  object-fit: contain;\n}\n\n.panel-elem-link {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  margin: var(--space-unit) auto 0;\n  border-radius: var(--border-no-radius);\n  font-size: 12px;\n}\n\n.panel-elem-link > a.z-link {\n  padding: calc(var(--space-unit) * 0.5) 0;\n  font-weight: var(--font-sb);\n}\n\n.panel-elem-desc {\n  padding-top: var(--space-unit);\n  margin: 0;\n  letter-spacing: 0.16px;\n  text-align: center;\n}\n\na > z-icon {\n  margin-right: var(--space-unit);\n}\n","import {Component, ComponentInterface, Prop, h} from \"@stencil/core\";\n\n/**\n * @slot `descrSlotName` - description content\n */\n@Component({\n  tag: \"z-panel-elem\",\n  styleUrl: \"styles.css\",\n  shadow: false,\n  scoped: true,\n})\nexport class ZPanelElem implements ComponentInterface {\n  /** html element id (optional) */\n  @Prop()\n  elemid?: string;\n\n  /** image url source (optional) */\n  @Prop()\n  imgurl?: string;\n\n  /** alternative image text (optional) */\n  @Prop()\n  imgalt?: string;\n\n  /** icon link name (optional) */\n  @Prop()\n  linkicon?: string;\n\n  /** link label text*/\n  @Prop()\n  linklabel: string;\n\n  /** link url */\n  @Prop()\n  url: string;\n\n  /** link target (optional) */\n  @Prop()\n  target?: string = \"_blank\";\n\n  /** disabled status flag (optional) */\n  @Prop()\n  isdisabled?: boolean = false;\n\n  /** name of slot container (optional) */\n  @Prop()\n  descrSlotName?: string;\n\n  render(): HTMLDivElement {\n    const elemId = this.elemid ? this.elemid : \"\";\n\n    return (\n      <div class=\"panel-elem-container\">\n        {(this.imgurl || this.imgalt) && (\n          <div\n            aria-hidden=\"true\"\n            class=\"panel-elem-icon\"\n          >\n            <img\n              src={this.imgurl}\n              alt={this.imgalt}\n            />\n          </div>\n        )}\n        <div class=\"panel-elem-link\">\n          <a\n            class={{\n              \"z-link\": true,\n              \"z-link-disabled\": this.isdisabled,\n              \"z-link-icon\": true,\n              \"z-link-blue\": true,\n            }}\n            id={elemId + \"link_id\"}\n            href={this.url}\n            target={this.target}\n          >\n            <z-icon\n              height={14}\n              width={14}\n              name={this.linkicon}\n            ></z-icon>\n            {this.linklabel}\n          </a>\n        </div>\n        {this.descrSlotName && (\n          <div class=\"panel-elem-desc\">\n            <slot name={this.descrSlotName} />\n          </div>\n        )}\n      </div>\n    );\n  }\n}\n"],"version":3}

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

@@ -1,34 +0,0 @@
-'use strict';
-
-var index = require('./index-CZz7uP-M.js');
-var index$1 = require('./index-DppFfqsn.js');
-
-const stylesCss = () => `:host{--z-section-title--divider-color:var(--red500);display:flex;width:fit-content;flex-direction:column;align-items:flex-start;font-family:var(--font-family-sans)}: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);font-size:var(--font-size-3);font-weight:var(--font-sb);line-height:1.5rem;text-transform:uppercase}::slotted([slot="primary-title"]){font-size:var(--font-size-6);font-weight:var(--font-sb);line-height:2rem}:host([uppercase]:not([uppercase="false"])) ::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}}`;
-
-const ZSectionTitle = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        /**
-         * Divider position for the primary title.
-         * This prop only works if the secondary title is not set.
-         */
-        this.dividerPosition = index$1.ZSectionTitleDividerPosition.BEFORE;
-        /**
-         * Whether the primary title text is uppercase.
-         */
-        this.uppercase = true;
-    }
-    componentWillRender() {
-        this.hasSecondaryTitle = !!this.host.querySelector("[slot=secondary-title]");
-    }
-    render() {
-        return (index.h(index.Host, { key: '020c1a41ff7fa0881464463322b54754e7664957' }, index.h("slot", { key: 'c6d7baf944465d1092749cf288636fcd502e659c', name: "secondary-title" }), !this.hasSecondaryTitle && this.dividerPosition === index$1.ZSectionTitleDividerPosition.BEFORE && (index.h("z-divider", { key: 'ea70a8579ed61ba8b1d6488566473b90c47540d1', size: index$1.DividerSize.LARGE, color: "z-section-title--divider-color" })), index.h("slot", { key: '4cf602491394aaf97cead51bbc7f9b2da299bef3', name: "primary-title" }), !this.hasSecondaryTitle && this.dividerPosition === index$1.ZSectionTitleDividerPosition.AFTER && (index.h("z-divider", { key: '47275d6411b00769db2e244bad13032d43cc9144', size: index$1.DividerSize.LARGE, color: "z-section-title--divider-color" }))));
-    }
-    get host() { return index.getElement(this); }
-};
-ZSectionTitle.style = stylesCss();
-
-exports.z_section_title = ZSectionTitle;
-//# sourceMappingURL=z-section-title.entry.cjs.js.map
-
-//# sourceMappingURL=z-section-title.cjs.entry.js.map

package/dist/cjs/z-section-title.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"z-section-title.cjs.entry.js","mappings":";;;;;AAAA,MAAM,SAAS,GAAG,MAAM,CAAC,izBAAizB,CAAC;;MCgB9zB,aAAa,GAAA,MAAA;AAL1B,IAAA,WAAA,CAAA,OAAA,EAAA;;AAME;;;AAGG;AAEH,QAAA,IAAA,CAAA,eAAe,GAAiCA,oCAA4B,CAAC,MAAM;AAEnF;;AAEG;AAEH,QAAA,IAAA,CAAA,SAAS,GAAG,IAAI;AA8BjB;IAxBC,mBAAmB,GAAA;AACjB,QAAA,IAAI,CAAC,iBAAiB,GAAG,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,wBAAwB,CAAC;;IAG9E,MAAM,GAAA;QACJ,QACEC,QAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACHD,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,iBAAiB,EAAA,CAAG,EAC9B,CAAC,IAAI,CAAC,iBAAiB,IAAI,IAAI,CAAC,eAAe,KAAKD,oCAA4B,CAAC,MAAM,KACtFC,OAAA,CAAA,WAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,IAAI,EAAEE,mBAAW,CAAC,KAAK,EACvB,KAAK,EAAC,gCAAgC,EAAA,CACtC,CACH,EACDF,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,eAAe,EAAA,CAAG,EAC5B,CAAC,IAAI,CAAC,iBAAiB,IAAI,IAAI,CAAC,eAAe,KAAKD,oCAA4B,CAAC,KAAK,KACrFC,OAAA,CAAA,WAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,IAAI,EAAEE,mBAAW,CAAC,KAAK,EACvB,KAAK,EAAC,gCAAgC,EAAA,CACtC,CACH,CACI;;;;;;;;","names":["ZSectionTitleDividerPosition","h","Host","DividerSize"],"sources":["src/components/deprecated/z-section-title/styles.css?tag=z-section-title&encapsulation=shadow","src/components/deprecated/z-section-title/index.tsx"],"sourcesContent":[":host {\n  /**\n   * @prop --z-section-title--divider-color: Color of the divider. Use a CSS prop string like `\"--red500\"`. Default is `\"--red500\"`.\n   */\n  --z-section-title--divider-color: var(--red500);\n\n  display: flex;\n  width: fit-content;\n  flex-direction: column;\n  align-items: flex-start;\n  font-family: var(--font-family-sans);\n}\n\n:host,\n:host ::slotted(*) {\n  box-sizing: border-box;\n}\n\n::slotted(*) {\n  margin: 0;\n}\n\n::slotted([slot=\"secondary-title\"]) {\n  padding-bottom: calc(var(--space-unit) / 2);\n  border-bottom: var(--border-size-large) solid var(--z-section-title--divider-color);\n  font-size: var(--font-size-3);\n  font-weight: var(--font-sb);\n  line-height: 1.5rem;\n  text-transform: uppercase;\n}\n\n::slotted([slot=\"primary-title\"]) {\n  font-size: var(--font-size-6);\n  font-weight: var(--font-sb);\n  line-height: 2rem;\n}\n\n:host([uppercase]:not([uppercase=\"false\"])) ::slotted([slot=\"primary-title\"]) {\n  text-transform: uppercase;\n}\n\n/* Desktop breakpoint */\n@media (min-width: 1152px) {\n  ::slotted([slot=\"primary-title\"]) {\n    font-size: var(--font-size-7);\n    line-height: 2.25rem;\n  }\n}\n","import {Component, ComponentInterface, Element, h, Host, Prop} from \"@stencil/core\";\nimport {DividerSize, ZSectionTitleDividerPosition} from \"../../../beans\";\n\n/**\n * Section title component.\n * An optional secondary title can be put over the primary one.\n *\n * @slot secondary-title - Slot for the secondary title. When present, the divider is always displayed under it,\n * following its width and removing the one for the primary title.\n * @slot primary-title - Slot for the primary title.\n */\n@Component({\n  tag: \"z-section-title\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZSectionTitle implements ComponentInterface {\n  /**\n   * Divider position for the primary title.\n   * This prop only works if the secondary title is not set.\n   */\n  @Prop()\n  dividerPosition: ZSectionTitleDividerPosition = ZSectionTitleDividerPosition.BEFORE;\n\n  /**\n   * Whether the primary title text is uppercase.\n   */\n  @Prop({reflect: true})\n  uppercase = true;\n\n  @Element() host: HTMLZSectionTitleElement;\n\n  private hasSecondaryTitle: boolean;\n\n  componentWillRender(): void {\n    this.hasSecondaryTitle = !!this.host.querySelector(\"[slot=secondary-title]\");\n  }\n\n  render(): HTMLZSectionTitleElement {\n    return (\n      <Host>\n        <slot name=\"secondary-title\" />\n        {!this.hasSecondaryTitle && this.dividerPosition === ZSectionTitleDividerPosition.BEFORE && (\n          <z-divider\n            size={DividerSize.LARGE}\n            color=\"z-section-title--divider-color\"\n          />\n        )}\n        <slot name=\"primary-title\" />\n        {!this.hasSecondaryTitle && this.dividerPosition === ZSectionTitleDividerPosition.AFTER && (\n          <z-divider\n            size={DividerSize.LARGE}\n            color=\"z-section-title--divider-color\"\n          />\n        )}\n      </Host>\n    );\n  }\n}\n"],"version":3}