@zanichelli/albe-web-components 2.33.2 → 2.33.5-rc1

package/dist/collection/components/navigation/z-app-topbar/styles.css

@@ -1,71 +0,0 @@
-:host {
-  display: block;
-  position: sticky;
-  box-sizing: border-box;
-  top: 0;
-  height: calc(var(--space-unit) * 6);
-  padding: calc(var(--space-unit) / 2) calc(var(--space-unit) * 2);
-  border-radius: var(--border-no-radius);
-  background-color: var(--gray900);
-  z-index: 99;
-}
-
-:host(.light) {
-  background-color: var(--color-white);
-}
-
-:host > div {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-}
-
-:host(.limited-width) #content-container {
-  margin: auto;
-  max-width: var(--mw);
-}
-
-.content-panel {
-  display: flex;
-  align-items: center
-}
-
-.content-panel > :not(:last-child) {
-  margin-right: calc(var(--space-unit) * 2);
-}
-
-#divider-container {
-  display: none;
-}
-
-z-link {
-  font-family: var(--font-family-sans);
-  font-weight: var(--font-sb);
-  font-size: 14px;
-  line-height: 20px;
-  letter-spacing: 0.3px;
-}
-
-/* Tablet breakpoint */
-@media only screen and (min-width: 768px) {
-  :host {
-    padding: var(--space-unit) calc(var(--space-unit) * 2) var(--space-unit) var(--space-unit);
-  }
-
-  :host(.limited-width) {
-    padding: var(--space-unit);
-  }
-
-  #divider-container {
-    display: block;
-    height: calc(var(--space-unit) * 3);
-  }
-}
-
-/* Desktop breakpoint */
-@media only screen and (min-width: 1152px) {
-}
-
-/* Wide breakpoint */
-@media only screen and (min-width: 1366px) {
-}

package/dist/collection/components/navigation/z-link/index.js

@@ -1,309 +0,0 @@
-import { Component, Prop, h, Event, Element } from "@stencil/core";
-import { Host, State } from "@stencil/core/internal";
-/**
- * @slot - link content
- */
-export class ZLink {
-  constructor() {
-    /** link target (optional) */
-    this.target = "_self";
-    /** tabindex link attribute (optional) */
-    this.htmltabindex = 0;
-    /** disable link flag (optional) */
-    this.isdisabled = false;
-    /** active link flag (optional) */
-    this.isactive = false;
-    /** white variant flag (optional) */
-    this.iswhite = false;
-    /** link text variant (optional) */
-    this.textcolor = "primary";
-    /** big link version */
-    this.big = false;
-    /** link icon position (optional) */
-    this.iconposition = "left";
-    /** draw underline on text (optional) */
-    this.underline = false;
-    this.iconSize = 18;
-    this.emitZLinkClick = this.emitZLinkClick.bind(this);
-    this.emitZLinkInteraction = this.emitZLinkInteraction.bind(this);
-  }
-  componentWillRender() {
-    if (this.iswhite) {
-      console.warn("z-link iswhite prop is deprecated and will be dropped in a next release, please use textcolor prop instead");
-    }
-    if (this.big) {
-      console.warn("z-link big prop is deprecated and will be dropped in a next release, please override --font-size-link and --font-weight-link variables instead");
-    }
-  }
-  emitZLinkClick(e, linkId) {
-    this.emitZLinkInteraction(e, linkId);
-  }
-  emitZLinkInteraction(e, linkId) {
-    this.zLinkClick.emit({ e, linkId });
-  }
-  componentDidRender() {
-    if (this.icon) {
-      const height = parseFloat(window.getComputedStyle(this.hostElement).getPropertyValue('font-size'));
-      const currentSize = this.big ? 18 : Math.round(height * 1.125);
-      if (!Number.isNaN(currentSize) && this.iconSize !== currentSize) {
-        this.iconSize = currentSize;
-      }
-    }
-  }
-  render() {
-    const style = this.big ? { "--font-size-link": "16px", "--font-weight-link": "600" } : {};
-    return (h(Host, { style: style },
-      h("a", { id: this.htmlid, href: this.href ? this.href : null, class: `${this.isdisabled ? "disabled" : ""}
-            ${this.isactive ? "active" : ""}
-            ${this.textcolor}
-            ${this.iswhite ? "white" : ""}
-            ${this.underline ? "underline" : ""}`, target: this.target, role: this.href ? "link" : "button", tabindex: this.isdisabled ? -1 : this.htmltabindex, onClick: (e) => this.emitZLinkClick(e, this.htmlid) },
-        this.iconposition === "right" && h("slot", null),
-        this.icon &&
-          h("z-icon", { style: { "--z-icon-width": this.iconSize.toString(), "--z-icon-height": this.iconSize.toString() }, name: this.icon, height: this.iconSize, width: this.iconSize }),
-        this.iconposition === "left" && h("slot", null))));
-  }
-  static get is() { return "z-link"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["styles.css"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["styles.css"]
-  }; }
-  static get properties() { return {
-    "htmlid": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "link id (optional)"
-      },
-      "attribute": "htmlid",
-      "reflect": false
-    },
-    "href": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "link url (optional)"
-      },
-      "attribute": "href",
-      "reflect": false
-    },
-    "target": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "link target (optional)"
-      },
-      "attribute": "target",
-      "reflect": false,
-      "defaultValue": "\"_self\""
-    },
-    "htmltabindex": {
-      "type": "number",
-      "mutable": false,
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "tabindex link attribute (optional)"
-      },
-      "attribute": "htmltabindex",
-      "reflect": false,
-      "defaultValue": "0"
-    },
-    "isdisabled": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "disable link flag (optional)"
-      },
-      "attribute": "isdisabled",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "isactive": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "active link flag (optional)"
-      },
-      "attribute": "isactive",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "iswhite": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "white variant flag (optional)"
-      },
-      "attribute": "iswhite",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "textcolor": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "\"primary\"| \"inverse\" | \"white\" | \"black\"",
-        "resolved": "\"black\" | \"inverse\" | \"primary\" | \"white\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "link text variant (optional)"
-      },
-      "attribute": "textcolor",
-      "reflect": false,
-      "defaultValue": "\"primary\""
-    },
-    "icon": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "link icon name (optional)"
-      },
-      "attribute": "icon",
-      "reflect": false
-    },
-    "big": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "big link version"
-      },
-      "attribute": "big",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "iconposition": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "\"left\" | \"right\"",
-        "resolved": "\"left\" | \"right\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "link icon position (optional)"
-      },
-      "attribute": "iconposition",
-      "reflect": false,
-      "defaultValue": "\"left\""
-    },
-    "underline": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "draw underline on text (optional)"
-      },
-      "attribute": "underline",
-      "reflect": false,
-      "defaultValue": "false"
-    }
-  }; }
-  static get states() { return {
-    "iconSize": {}
-  }; }
-  static get events() { return [{
-      "method": "zLinkClick",
-      "name": "zLinkClick",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "emitted on link click, returns linkId"
-      },
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
-      }
-    }]; }
-  static get elementRef() { return "hostElement"; }
-}

package/dist/collection/components/navigation/z-link/styles.css

@@ -1,160 +0,0 @@
-:host {
-  --font-size-link: inherit;
-  --font-weight-link: inherit;
-}
-
-:host {
-  font-family: var(--dashboard-font);
-  font-weight: var(--font-weight-link);
-  font-size: var(--font-size-link);
-  line-height: inherit;
-  outline: none;
-}
-
-a {
-  cursor: pointer;
-  color: var(--color-link-primary);
-  fill: var(--color-link-primary);
-  display: inline-flex;
-  align-items: center;
-  text-decoration: none;
-  padding: calc(var(--space-unit) * .5) 0;
-  border-top: var(--border-size-medium) solid transparent;
-  border-bottom: var(--border-size-medium) solid transparent;
-}
-
-a:hover,
-a:focus,
-a:active {
-  text-decoration: underline;
-}
-
-a.active {
-  color: var(--color-active-link);
-  fill: var(--color-active-link);
-}
-
-a:hover,
-a:focus {
-  color: var(--color-hover-link);
-  fill: var(--color-hover-link);
-}
-
-a:active {
-  color: var(--color-pressed-link);
-  fill: var(--color-pressed-link);
-}
-
-a:visited {
-  color: var(--color-visited-link);
-  fill: var(--color-visited-link);
-}
-
-a.disabled,
-a.inverse.disabled {
-  cursor: default;
-  pointer-events: none;
-  color: var(--color-disabled03);
-  fill: var(--color-disabled03);
-}
-
-a.underline,
-a.underline:active,
-a.underline:hover,
-a.underline:visited,
-a.underline.disabled,
-a.underline.black,
-a.underline.white {
-  text-decoration: underline;
-}
-
-a.disabled,
-a.disabled:active,
-a.disabled:visited,
-a.disabled:hover {
-  text-decoration: none;
-}
-
-a.inverse {
-  color: var(--color-inverse-link);
-  fill: var(--color-inverse-link);
-}
-
-a.inverse.active {
-  color: var(--color-inverse-active-link);
-  fill: var(--color-inverse-active-link);
-}
-
-a.inverse:hover,
-a.inverse:focus {
-  color: var(--color-inverse-hover-link);
-  fill: var(--color-inverse-hover-link);
-}
-
-a.inverse:active {
-  color: var(--color-inverse-pressed-link);
-  fill: var(--color-inverse-pressed-link);
-}
-
-a.inverse:visited {
-  color: var(--color-inverse-visited-link);
-  fill: var(--color-inverse-visited-link);
-}
-
-a.black {
-  color: var(--gray800);
-  fill: var(--gray800);
-  text-decoration: none;
-}
-
-a.black:hover,
-a.black.active,
-a.black:visited {
-  color: var(--color-black);
-  fill: var(--color-black);
-}
-
-a.black:hover,
-a.black:focus,
-a.black:active {
-  text-decoration: underline;
-}
-
-a.black:active {
-  color: var(--gray700);
-  fill: var(--gray700);
-}
-
-a.white,
-a.white:active,
-a.white:hover,
-a.white.active {
-  color: var(--bg-white);
-  fill: var(--bg-white);
-  text-decoration: none;
-}
-
-a.white:visited {
-  color: var(--bg-white);
-  fill: var(--bg-white);
-}
-
-a.white:hover,
-a.white:focus,
-a.white:active {
-  text-decoration: underline;
-}
-
-a.white.disabled,
-a.black.disabled {
-  color: var(--gray500);
-  fill: var(--gray500);
-}
-
-a > z-icon:first-child {
-  margin-right: 8px;
-}
-
-a > z-icon:last-child {
-  margin-left: 8px;
-}