@zanichelli/albe-web-components 6.3.0 → 6.3.2-rc1

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

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-e3299e0a.js');
-const index$1 = require('./index-f08f7171.js');
+const index$1 = require('./index-fa110f37.js');
 
 const stylesCss = ":host{--z-tooltip-theme--surface:var(--color-surface01);--z-tooltip-theme--text:var(--color-text01);--z-tooltip-shadow-filter:drop-shadow(0 1px 2px var(--shadow-color-base))}:host([dark]) z-popover{--z-popover-theme--surface:var(--color-surface05)}z-popover{--z-popover-padding:var(--space-unit);--z-popover-theme--surface:var(--z-tooltip-theme--surface);--z-popover-theme--text:var(--z-tooltip-theme--text);--z-popover-shadow-filter:var(--z-tooltip-shadow-filter)}";
 
@@ -11,7 +11,7 @@ const ZTooltip = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     /** Tooltip position. */
-    this.position = index$1.PopoverPositions.AUTO;
+    this.position = index$1.PopoverPosition.AUTO;
     /** Enable tooltip dark mode. */
     this.dark = false;
     /**

package/dist/collection/beans/index.js

@@ -60,55 +60,22 @@ export var InputStatus;
   InputStatus["ERROR"] = "error";
   InputStatus["WARNING"] = "warning";
 })(InputStatus || (InputStatus = {}));
-export var PopoverPositions;
-(function (PopoverPositions) {
-  PopoverPositions["AUTO"] = "auto";
-  PopoverPositions["TOP"] = "top";
-  PopoverPositions["RIGHT"] = "right";
-  PopoverPositions["BOTTOM"] = "bottom";
-  PopoverPositions["LEFT"] = "left";
-  PopoverPositions["TOP_RIGHT"] = "top_right";
-  PopoverPositions["TOP_LEFT"] = "top_left";
-  PopoverPositions["BOTTOM_RIGHT"] = "bottom_right";
-  PopoverPositions["BOTTOM_LEFT"] = "bottom_left";
-  PopoverPositions["RIGHT_TOP"] = "right_top";
-  PopoverPositions["RIGHT_BOTTOM"] = "right_bottom";
-  PopoverPositions["LEFT_TOP"] = "left_top";
-  PopoverPositions["LEFT_BOTTOM"] = "left_bottom";
-})(PopoverPositions || (PopoverPositions = {}));
 export var PopoverPosition;
 (function (PopoverPosition) {
-  PopoverPosition["AFTER_DOWN"] = "after-down";
-  PopoverPosition["AFTER_CENTER"] = "after-center";
-  PopoverPosition["AFTER_UP"] = "after-up";
-  PopoverPosition["BELOW_RIGHT"] = "below-right";
-  PopoverPosition["BELOW_CENTER"] = "below-center";
-  PopoverPosition["BELOW_LEFT"] = "below-left";
-  PopoverPosition["BEFORE_DOWN"] = "before-down";
-  PopoverPosition["BEFORE_CENTER"] = "before-center";
-  PopoverPosition["BEFORE_UP"] = "before-up";
-  PopoverPosition["ABOVE_RIGHT"] = "above-right";
-  PopoverPosition["ABOVE_CENTER"] = "above-center";
-  PopoverPosition["ABOVE_LEFT"] = "above-left";
+  PopoverPosition["AUTO"] = "auto";
+  PopoverPosition["TOP"] = "top";
+  PopoverPosition["RIGHT"] = "right";
+  PopoverPosition["BOTTOM"] = "bottom";
+  PopoverPosition["LEFT"] = "left";
+  PopoverPosition["TOP_RIGHT"] = "top_right";
+  PopoverPosition["TOP_LEFT"] = "top_left";
+  PopoverPosition["BOTTOM_RIGHT"] = "bottom_right";
+  PopoverPosition["BOTTOM_LEFT"] = "bottom_left";
+  PopoverPosition["RIGHT_TOP"] = "right_top";
+  PopoverPosition["RIGHT_BOTTOM"] = "right_bottom";
+  PopoverPosition["LEFT_TOP"] = "left_top";
+  PopoverPosition["LEFT_BOTTOM"] = "left_bottom";
 })(PopoverPosition || (PopoverPosition = {}));
-export var PopoverBorderRadius;
-(function (PopoverBorderRadius) {
-  PopoverBorderRadius["NONE"] = "none";
-  PopoverBorderRadius["SMALL"] = "small";
-  PopoverBorderRadius["MEDIUM"] = "medium";
-})(PopoverBorderRadius || (PopoverBorderRadius = {}));
-export var PopoverShadow;
-(function (PopoverShadow) {
-  PopoverShadow["SHADOW_1"] = "shadow-1";
-  PopoverShadow["SHADOW_2"] = "shadow-2";
-  PopoverShadow["SHADOW_3"] = "shadow-3";
-  PopoverShadow["SHADOW_4"] = "shadow-4";
-  PopoverShadow["SHADOW_6"] = "shadow-6";
-  PopoverShadow["SHADOW_8"] = "shadow-8";
-  PopoverShadow["SHADOW_12"] = "shadow-12";
-  PopoverShadow["SHADOW_16"] = "shadow-16";
-  PopoverShadow["SHADOW_24"] = "shadow-24";
-})(PopoverShadow || (PopoverShadow = {}));
 export var KeyboardKeyCode;
 (function (KeyboardKeyCode) {
   KeyboardKeyCode[KeyboardKeyCode["TAB"] = 9] = "TAB";
@@ -313,14 +280,6 @@ export var ZRangePickerMode;
   ZRangePickerMode["DATE"] = "date";
   ZRangePickerMode["DATE_TIME"] = "date-time";
 })(ZRangePickerMode || (ZRangePickerMode = {}));
-export var StatusTagStatus;
-(function (StatusTagStatus) {
-  StatusTagStatus["WARNING"] = "warning";
-  StatusTagStatus["ERROR"] = "error";
-  StatusTagStatus["SUCCESS"] = "success";
-  StatusTagStatus["NEUTRAL"] = "neutral";
-  StatusTagStatus["DEFAULT"] = "default";
-})(StatusTagStatus || (StatusTagStatus = {}));
 export var InfoRevealPosition;
 (function (InfoRevealPosition) {
   InfoRevealPosition["TOP_RIGHT"] = "top_right";

package/dist/collection/collection-manifest.json

@@ -11,10 +11,6 @@
     "./components/file-upload/z-dragdrop-area/index.js",
     "./components/file-upload/z-file/index.js",
     "./components/file-upload/z-file-upload/index.js",
-    "./components/footer/z-footer/index.js",
-    "./components/footer/z-footer-link/index.js",
-    "./components/footer/z-footer-section/index.js",
-    "./components/footer/z-footer-social/index.js",
     "./components/icons/z-icon/index.js",
     "./components/icons/z-icon-package/index.js",
     "./components/indicators/z-stepper/index.js",
@@ -41,8 +37,6 @@
     "./components/navigation/z-menu-dropdown/index.js",
     "./components/navigation/z-menu-section/index.js",
     "./components/navigation/z-user-dropdown/index.js",
-    "./components/notification/z-candybar/index.js",
-    "./components/notification/z-cookiebar/index.js",
     "./components/notification/z-info-box/index.js",
     "./components/notification/z-notification/index.js",
     "./components/notification/z-toast-notification/index.js",
@@ -78,16 +72,6 @@
     "./components/z-table/z-table-sticky-footer/index.js",
     "./components/z-tag/index.js",
     "./components/z-visually-hidden/index.js",
-    "./deprecated/pagination/z-pagination-bar/index.js",
-    "./deprecated/pagination/z-pagination-page/index.js",
-    "./deprecated/z-button-deprecated/index.js",
-    "./deprecated/z-button-filter/index.js",
-    "./deprecated/z-chip-deprecated/index.js",
-    "./deprecated/z-input-deprecated/index.js",
-    "./deprecated/z-input-label/index.js",
-    "./deprecated/z-popover-deprecated/index.js",
-    "./deprecated/z-status-tag/index.js",
-    "./deprecated/z-tooltip-deprecated/index.js",
     "./snowflakes/myz/card/z-myz-card/index.js",
     "./snowflakes/myz/card/z-myz-card-alert/index.js",
     "./snowflakes/myz/card/z-myz-card-body/index.js",
@@ -106,7 +90,6 @@
     "./snowflakes/myz/pocket/z-pocket-body/index.js",
     "./snowflakes/myz/pocket/z-pocket-header/index.js",
     "./snowflakes/myz/pocket/z-pocket-message/index.js",
-    "./snowflakes/myz/topbar/index.js",
     "./snowflakes/myz/z-alert/index.js",
     "./snowflakes/myz/z-otp/index.js",
     "./snowflakes/myz/z-slideshow/index.js"

package/dist/collection/components/file-upload/z-file/index.js

@@ -1,5 +1,5 @@
 import { h, Host } from "@stencil/core";
-import { PopoverPositions, ZChipType } from "../../../beans";
+import { PopoverPosition, ZChipType } from "../../../beans";
 import { tabletBreakpoint } from "../../../constants/breakpoints";
 export class ZFile {
   constructor() {
@@ -30,7 +30,7 @@ export class ZFile {
     return this.ellipsis.offsetWidth < this.ellipsis.scrollWidth;
   }
   render() {
-    return (h(Host, null, this.allowPopover && (h("z-popover", { open: this.popoverVisible, position: PopoverPositions.AUTO, bindTo: this.chip }, h("span", { class: "body-5 tooltip-content" }, this.ellipsis.innerText))), h("z-chip", { ref: (el) => (this.chip = el), id: `chip-${this.fileNumber}`, interactiveIcon: "multiply-circled", type: ZChipType.DEFAULT }, h("span", { ref: (el) => (this.ellipsis = el), tabIndex: -1 }, this.fileName))));
+    return (h(Host, null, this.allowPopover && (h("z-popover", { open: this.popoverVisible, position: PopoverPosition.AUTO, bindTo: this.chip }, h("span", { class: "body-5 tooltip-content" }, this.ellipsis.innerText))), h("z-chip", { ref: (el) => (this.chip = el), id: `chip-${this.fileNumber}`, interactiveIcon: "multiply-circled", type: ZChipType.DEFAULT }, h("span", { ref: (el) => (this.ellipsis = el), tabIndex: -1 }, this.fileName))));
   }
   static get is() { return "z-file"; }
   static get encapsulation() { return "scoped"; }

package/dist/collection/components/notification/z-tooltip/index.js

@@ -1,5 +1,5 @@
 import { h } from "@stencil/core";
-import { PopoverPositions } from "../../../beans";
+import { PopoverPosition } from "../../../beans";
 /**
  * Tooltip component.
  * It is basically a wrapper for the `<z-popover>` component with custom configuration.
@@ -11,7 +11,7 @@ import { PopoverPositions } from "../../../beans";
 export class ZTooltip {
   constructor() {
     /** Tooltip position. */
-    this.position = PopoverPositions.AUTO;
+    this.position = PopoverPosition.AUTO;
     /** Enable tooltip dark mode. */
     this.dark = false;
     /**
@@ -43,10 +43,10 @@ export class ZTooltip {
         "type": "string",
         "mutable": false,
         "complexType": {
-          "original": "PopoverPositions",
-          "resolved": "PopoverPositions.AUTO | PopoverPositions.BOTTOM | PopoverPositions.BOTTOM_LEFT | PopoverPositions.BOTTOM_RIGHT | PopoverPositions.LEFT | PopoverPositions.LEFT_BOTTOM | PopoverPositions.LEFT_TOP | PopoverPositions.RIGHT | PopoverPositions.RIGHT_BOTTOM | PopoverPositions.RIGHT_TOP | PopoverPositions.TOP | PopoverPositions.TOP_LEFT | PopoverPositions.TOP_RIGHT",
+          "original": "PopoverPosition",
+          "resolved": "PopoverPosition.AUTO | PopoverPosition.BOTTOM | PopoverPosition.BOTTOM_LEFT | PopoverPosition.BOTTOM_RIGHT | PopoverPosition.LEFT | PopoverPosition.LEFT_BOTTOM | PopoverPosition.LEFT_TOP | PopoverPosition.RIGHT | PopoverPosition.RIGHT_BOTTOM | PopoverPosition.RIGHT_TOP | PopoverPosition.TOP | PopoverPosition.TOP_LEFT | PopoverPosition.TOP_RIGHT",
           "references": {
-            "PopoverPositions": {
+            "PopoverPosition": {
               "location": "import",
               "path": "../../../beans"
             }
@@ -60,7 +60,7 @@ export class ZTooltip {
         },
         "attribute": "position",
         "reflect": true,
-        "defaultValue": "PopoverPositions.AUTO"
+        "defaultValue": "PopoverPosition.AUTO"
       },
       "dark": {
         "type": "boolean",

package/dist/collection/components/z-contextual-menu/index.js

@@ -1,5 +1,5 @@
 import { h, Host } from "@stencil/core";
-import { PopoverPositions } from "../../beans";
+import { PopoverPosition } from "../../beans";
 export class ZContextualMenu {
   constructor() {
     /**
@@ -9,7 +9,7 @@ export class ZContextualMenu {
     /**
      * [optional] Sets the position of the popover
      */
-    this.popoverPosition = PopoverPositions.BOTTOM_RIGHT;
+    this.popoverPosition = PopoverPosition.BOTTOM_RIGHT;
   }
   componentWillRender() {
     if (this.elements) {
@@ -84,10 +84,10 @@ export class ZContextualMenu {
         "type": "string",
         "mutable": false,
         "complexType": {
-          "original": "PopoverPositions",
-          "resolved": "PopoverPositions.AUTO | PopoverPositions.BOTTOM | PopoverPositions.BOTTOM_LEFT | PopoverPositions.BOTTOM_RIGHT | PopoverPositions.LEFT | PopoverPositions.LEFT_BOTTOM | PopoverPositions.LEFT_TOP | PopoverPositions.RIGHT | PopoverPositions.RIGHT_BOTTOM | PopoverPositions.RIGHT_TOP | PopoverPositions.TOP | PopoverPositions.TOP_LEFT | PopoverPositions.TOP_RIGHT",
+          "original": "PopoverPosition",
+          "resolved": "PopoverPosition.AUTO | PopoverPosition.BOTTOM | PopoverPosition.BOTTOM_LEFT | PopoverPosition.BOTTOM_RIGHT | PopoverPosition.LEFT | PopoverPosition.LEFT_BOTTOM | PopoverPosition.LEFT_TOP | PopoverPosition.RIGHT | PopoverPosition.RIGHT_BOTTOM | PopoverPosition.RIGHT_TOP | PopoverPosition.TOP | PopoverPosition.TOP_LEFT | PopoverPosition.TOP_RIGHT",
           "references": {
-            "PopoverPositions": {
+            "PopoverPosition": {
               "location": "import",
               "path": "../../beans"
             }
@@ -101,7 +101,7 @@ export class ZContextualMenu {
         },
         "attribute": "popover-position",
         "reflect": true,
-        "defaultValue": "PopoverPositions.BOTTOM_RIGHT"
+        "defaultValue": "PopoverPosition.BOTTOM_RIGHT"
       }
     };
   }

package/dist/collection/components/z-popover/index.js

@@ -1,5 +1,5 @@
 import { h } from "@stencil/core";
-import { PopoverPositions, KeyboardCode } from "../../beans";
+import { PopoverPosition, KeyboardCode } from "../../beans";
 import { getElementTree } from "../../utils/utils";
 const DOCUMENT_ELEMENT = document.documentElement;
 function getParentElement(element) {
@@ -93,7 +93,7 @@ function computeOffset(element, targetParentOffset) {
 export class ZPopover {
   constructor() {
     /** Popover position. */
-    this.position = PopoverPositions.AUTO;
+    this.position = PopoverPosition.AUTO;
     /**
      * The open state of the popover.
      */
@@ -128,8 +128,8 @@ export class ZPopover {
     }
   }
   validatePosition(newValue) {
-    if (newValue && !Object.values(PopoverPositions).includes(newValue)) {
-      this.position = PopoverPositions.AUTO;
+    if (newValue && !Object.values(PopoverPosition).includes(newValue)) {
+      this.position = PopoverPosition.AUTO;
     }
     this.currentPosition = this.position;
     this.positionChange.emit({ position: this.currentPosition });
@@ -195,28 +195,28 @@ export class ZPopover {
     const availableWidth = availableLeft + availableRight + boundingRect.width;
     let position = this.currentPosition;
     const positions = [];
-    if (this.position === PopoverPositions.AUTO) {
+    if (this.position === PopoverPosition.AUTO) {
       /**
        * The `AUTO` position tries to place the popover in the 'safest' area,
        * where there's more space available.
        */
       if (availableLeft / availableWidth > 0.6) {
-        positions.push(PopoverPositions.LEFT);
+        positions.push(PopoverPosition.LEFT);
       }
       else if (availableLeft / availableWidth < 0.4) {
-        positions.push(PopoverPositions.RIGHT);
+        positions.push(PopoverPosition.RIGHT);
       }
       if (availableTop / availableHeight > 0.9) {
-        positions.unshift(PopoverPositions.TOP);
+        positions.unshift(PopoverPosition.TOP);
       }
       else if (availableTop / availableHeight > 0.6) {
-        positions.push(PopoverPositions.TOP);
+        positions.push(PopoverPosition.TOP);
       }
       else if (availableTop / availableHeight < 0.1) {
-        positions.unshift(PopoverPositions.BOTTOM);
+        positions.unshift(PopoverPosition.BOTTOM);
       }
       else {
-        positions.push(PopoverPositions.BOTTOM);
+        positions.push(PopoverPosition.BOTTOM);
       }
       position = positions.join("_");
     }
@@ -228,17 +228,17 @@ export class ZPopover {
     const offsetLeft = boundingRect.left - relativeBoundingRect.left;
     const offsetModifier = this.center ? 0.5 : 0;
     const sizeModifier = this.center ? 0.5 : 0;
-    if (position === PopoverPositions.TOP || position === PopoverPositions.TOP_RIGHT) {
+    if (position === PopoverPosition.TOP || position === PopoverPosition.TOP_RIGHT) {
       style.top = "auto";
       style.right = "auto";
       style.bottom = `${offsetBottom + boundingRect.height}px`;
       style.left = `${offsetLeft + boundingRect.width * offsetModifier}px`;
       style.maxHeight = `${availableTop}px`;
-      if (position === PopoverPositions.TOP_RIGHT) {
+      if (position === PopoverPosition.TOP_RIGHT) {
         style.maxWidth = `${availableRight + boundingRect.width * sizeModifier}px`;
       }
     }
-    else if (position === PopoverPositions.TOP_LEFT) {
+    else if (position === PopoverPosition.TOP_LEFT) {
       style.top = "auto";
       style.right = `${offsetRight + boundingRect.width * offsetModifier}px`;
       style.bottom = `${offsetBottom + boundingRect.height}px`;
@@ -246,17 +246,17 @@ export class ZPopover {
       style.maxWidth = `${availableLeft}px`;
       style.maxHeight = `${availableTop}px`;
     }
-    else if (position === PopoverPositions.BOTTOM || position === PopoverPositions.BOTTOM_RIGHT) {
+    else if (position === PopoverPosition.BOTTOM || position === PopoverPosition.BOTTOM_RIGHT) {
       style.top = `${offsetTop + boundingRect.height}px`;
       style.right = "auto";
       style.bottom = "auto";
       style.left = `${offsetLeft + boundingRect.width * offsetModifier}px`;
       style.maxHeight = `${availableBottom}px`;
-      if (position === PopoverPositions.BOTTOM_RIGHT) {
+      if (position === PopoverPosition.BOTTOM_RIGHT) {
         style.maxWidth = `${availableRight + boundingRect.width * sizeModifier}px`;
       }
     }
-    else if (position === PopoverPositions.BOTTOM_LEFT) {
+    else if (position === PopoverPosition.BOTTOM_LEFT) {
       style.top = `${offsetTop + boundingRect.height}px`;
       style.right = `${offsetRight + boundingRect.width * offsetModifier}px`;
       style.bottom = "auto";
@@ -264,7 +264,7 @@ export class ZPopover {
       style.maxWidth = `${availableLeft}px`;
       style.maxHeight = `${availableBottom}px`;
     }
-    else if (position === PopoverPositions.RIGHT || position === PopoverPositions.RIGHT_BOTTOM) {
+    else if (position === PopoverPosition.RIGHT || position === PopoverPosition.RIGHT_BOTTOM) {
       style.top = `${offsetTop + boundingRect.height * offsetModifier}px`;
       style.right = "auto";
       style.bottom = "auto";
@@ -272,7 +272,7 @@ export class ZPopover {
       style.maxWidth = `${availableRight}px`;
       style.maxHeight = `${availableBottom + boundingRect.height * sizeModifier}px`;
     }
-    else if (position === PopoverPositions.RIGHT_TOP) {
+    else if (position === PopoverPosition.RIGHT_TOP) {
       style.top = "auto";
       style.right = "auto";
       style.bottom = `${offsetBottom + boundingRect.height * offsetModifier}px`;
@@ -280,7 +280,7 @@ export class ZPopover {
       style.maxWidth = `${availableRight}px`;
       style.maxHeight = `${availableTop + boundingRect.height * sizeModifier}px`;
     }
-    else if (position === PopoverPositions.LEFT || position === PopoverPositions.LEFT_BOTTOM) {
+    else if (position === PopoverPosition.LEFT || position === PopoverPosition.LEFT_BOTTOM) {
       style.top = `${offsetTop + boundingRect.height * offsetModifier}px`;
       style.right = `${offsetRight + boundingRect.width}px`;
       style.bottom = "auto";
@@ -288,7 +288,7 @@ export class ZPopover {
       style.maxWidth = `${availableLeft}px`;
       style.maxHeight = `${availableBottom + boundingRect.height * sizeModifier}px`;
     }
-    else if (position === PopoverPositions.LEFT_TOP) {
+    else if (position === PopoverPosition.LEFT_TOP) {
       style.top = "auto";
       style.right = `${offsetRight + boundingRect.width}px`;
       style.bottom = `${offsetBottom + boundingRect.height * offsetModifier}px`;
@@ -324,10 +324,10 @@ export class ZPopover {
         "type": "string",
         "mutable": false,
         "complexType": {
-          "original": "PopoverPositions",
-          "resolved": "PopoverPositions.AUTO | PopoverPositions.BOTTOM | PopoverPositions.BOTTOM_LEFT | PopoverPositions.BOTTOM_RIGHT | PopoverPositions.LEFT | PopoverPositions.LEFT_BOTTOM | PopoverPositions.LEFT_TOP | PopoverPositions.RIGHT | PopoverPositions.RIGHT_BOTTOM | PopoverPositions.RIGHT_TOP | PopoverPositions.TOP | PopoverPositions.TOP_LEFT | PopoverPositions.TOP_RIGHT",
+          "original": "PopoverPosition",
+          "resolved": "PopoverPosition.AUTO | PopoverPosition.BOTTOM | PopoverPosition.BOTTOM_LEFT | PopoverPosition.BOTTOM_RIGHT | PopoverPosition.LEFT | PopoverPosition.LEFT_BOTTOM | PopoverPosition.LEFT_TOP | PopoverPosition.RIGHT | PopoverPosition.RIGHT_BOTTOM | PopoverPosition.RIGHT_TOP | PopoverPosition.TOP | PopoverPosition.TOP_LEFT | PopoverPosition.TOP_RIGHT",
           "references": {
-            "PopoverPositions": {
+            "PopoverPosition": {
               "location": "import",
               "path": "../../beans"
             }
@@ -341,7 +341,7 @@ export class ZPopover {
         },
         "attribute": "position",
         "reflect": true,
-        "defaultValue": "PopoverPositions.AUTO"
+        "defaultValue": "PopoverPosition.AUTO"
       },
       "open": {
         "type": "boolean",

package/dist/collection/components/z-table/z-table-header/index.js

@@ -1,5 +1,5 @@
 import { h, Host } from "@stencil/core";
-import { ButtonSize, ButtonVariant, PopoverPositions, Size, SortDirection } from "../../../beans";
+import { ButtonSize, ButtonVariant, PopoverPosition, Size, SortDirection } from "../../../beans";
 import { getElementTree } from "../../../utils/utils";
 export class ZTableHeader {
   constructor() {
@@ -63,7 +63,7 @@ export class ZTableHeader {
   render() {
     return (h(Host, { class: {
         sortable: this.sortable,
-      }, onClick: () => this.handleSort() }, h("div", { class: "container" }, h("slot", null), this.sortable && this.sortDirection !== SortDirection.NONE && (h("z-icon", { name: this.sortDirection === SortDirection.ASC ? "arrow-up" : "arrow-down", class: "arrow" }))), this.showButton && (h("div", { class: "popover-container" }, h("z-button", { ref: (el) => (this.triggerButton = el), class: "contextual-popover-button", icon: "contextual-menu", variant: ButtonVariant.TERTIARY, size: ButtonSize.X_SMALL, onClick: () => this.handleMenuClick() }), h("z-popover", { ref: (el) => (this.popover = el), position: PopoverPositions.BOTTOM, center: true, bindTo: this.triggerButton }, h("div", null, h("slot", { name: "contextual-menu" })))))));
+      }, onClick: () => this.handleSort() }, h("div", { class: "container" }, h("slot", null), this.sortable && this.sortDirection !== SortDirection.NONE && (h("z-icon", { name: this.sortDirection === SortDirection.ASC ? "arrow-up" : "arrow-down", class: "arrow" }))), this.showButton && (h("div", { class: "popover-container" }, h("z-button", { ref: (el) => (this.triggerButton = el), class: "contextual-popover-button", icon: "contextual-menu", variant: ButtonVariant.TERTIARY, size: ButtonSize.X_SMALL, onClick: () => this.handleMenuClick() }), h("z-popover", { ref: (el) => (this.popover = el), position: PopoverPosition.BOTTOM, center: true, bindTo: this.triggerButton }, h("div", null, h("slot", { name: "contextual-menu" })))))));
   }
   static get is() { return "z-table-header"; }
   static get encapsulation() { return "shadow"; }

package/dist/collection/snowflakes/myz/card/z-myz-card-info/index.js

@@ -1,5 +1,5 @@
 import { h } from "@stencil/core";
-import { PopoverPositions } from "../../../../beans";
+import { PopoverPosition } from "../../../../beans";
 import { handleKeyboardSubmit } from "../../../../utils/utils";
 /**
  * @slot  - content
@@ -87,7 +87,7 @@ export class ZMyzCardInfo {
       return;
     }
     const { title, year, author, description } = this.cardData;
-    return (h("z-popover", { position: PopoverPositions.RIGHT, onClick: () => (this.tooltip = false) }, `${title} ${year} ${author} ${description}`));
+    return (h("z-popover", { position: PopoverPosition.RIGHT, onClick: () => (this.tooltip = false) }, `${title} ${year} ${author} ${description}`));
   }
   setExpirationLicenseMessage(type) {
     if ((type === "online" && this.cardData.onlineLicense.expired) ||

package/dist/esm/{index-aee91593.js → index-968a240f.js}

@@ -60,55 +60,22 @@ var InputStatus;
   InputStatus["ERROR"] = "error";
   InputStatus["WARNING"] = "warning";
 })(InputStatus || (InputStatus = {}));
-var PopoverPositions;
-(function (PopoverPositions) {
-  PopoverPositions["AUTO"] = "auto";
-  PopoverPositions["TOP"] = "top";
-  PopoverPositions["RIGHT"] = "right";
-  PopoverPositions["BOTTOM"] = "bottom";
-  PopoverPositions["LEFT"] = "left";
-  PopoverPositions["TOP_RIGHT"] = "top_right";
-  PopoverPositions["TOP_LEFT"] = "top_left";
-  PopoverPositions["BOTTOM_RIGHT"] = "bottom_right";
-  PopoverPositions["BOTTOM_LEFT"] = "bottom_left";
-  PopoverPositions["RIGHT_TOP"] = "right_top";
-  PopoverPositions["RIGHT_BOTTOM"] = "right_bottom";
-  PopoverPositions["LEFT_TOP"] = "left_top";
-  PopoverPositions["LEFT_BOTTOM"] = "left_bottom";
-})(PopoverPositions || (PopoverPositions = {}));
 var PopoverPosition;
 (function (PopoverPosition) {
-  PopoverPosition["AFTER_DOWN"] = "after-down";
-  PopoverPosition["AFTER_CENTER"] = "after-center";
-  PopoverPosition["AFTER_UP"] = "after-up";
-  PopoverPosition["BELOW_RIGHT"] = "below-right";
-  PopoverPosition["BELOW_CENTER"] = "below-center";
-  PopoverPosition["BELOW_LEFT"] = "below-left";
-  PopoverPosition["BEFORE_DOWN"] = "before-down";
-  PopoverPosition["BEFORE_CENTER"] = "before-center";
-  PopoverPosition["BEFORE_UP"] = "before-up";
-  PopoverPosition["ABOVE_RIGHT"] = "above-right";
-  PopoverPosition["ABOVE_CENTER"] = "above-center";
-  PopoverPosition["ABOVE_LEFT"] = "above-left";
+  PopoverPosition["AUTO"] = "auto";
+  PopoverPosition["TOP"] = "top";
+  PopoverPosition["RIGHT"] = "right";
+  PopoverPosition["BOTTOM"] = "bottom";
+  PopoverPosition["LEFT"] = "left";
+  PopoverPosition["TOP_RIGHT"] = "top_right";
+  PopoverPosition["TOP_LEFT"] = "top_left";
+  PopoverPosition["BOTTOM_RIGHT"] = "bottom_right";
+  PopoverPosition["BOTTOM_LEFT"] = "bottom_left";
+  PopoverPosition["RIGHT_TOP"] = "right_top";
+  PopoverPosition["RIGHT_BOTTOM"] = "right_bottom";
+  PopoverPosition["LEFT_TOP"] = "left_top";
+  PopoverPosition["LEFT_BOTTOM"] = "left_bottom";
 })(PopoverPosition || (PopoverPosition = {}));
-var PopoverBorderRadius;
-(function (PopoverBorderRadius) {
-  PopoverBorderRadius["NONE"] = "none";
-  PopoverBorderRadius["SMALL"] = "small";
-  PopoverBorderRadius["MEDIUM"] = "medium";
-})(PopoverBorderRadius || (PopoverBorderRadius = {}));
-var PopoverShadow;
-(function (PopoverShadow) {
-  PopoverShadow["SHADOW_1"] = "shadow-1";
-  PopoverShadow["SHADOW_2"] = "shadow-2";
-  PopoverShadow["SHADOW_3"] = "shadow-3";
-  PopoverShadow["SHADOW_4"] = "shadow-4";
-  PopoverShadow["SHADOW_6"] = "shadow-6";
-  PopoverShadow["SHADOW_8"] = "shadow-8";
-  PopoverShadow["SHADOW_12"] = "shadow-12";
-  PopoverShadow["SHADOW_16"] = "shadow-16";
-  PopoverShadow["SHADOW_24"] = "shadow-24";
-})(PopoverShadow || (PopoverShadow = {}));
 var KeyboardKeyCode;
 (function (KeyboardKeyCode) {
   KeyboardKeyCode[KeyboardKeyCode["TAB"] = 9] = "TAB";
@@ -313,14 +280,6 @@ var ZRangePickerMode;
   ZRangePickerMode["DATE"] = "date";
   ZRangePickerMode["DATE_TIME"] = "date-time";
 })(ZRangePickerMode || (ZRangePickerMode = {}));
-var StatusTagStatus;
-(function (StatusTagStatus) {
-  StatusTagStatus["WARNING"] = "warning";
-  StatusTagStatus["ERROR"] = "error";
-  StatusTagStatus["SUCCESS"] = "success";
-  StatusTagStatus["NEUTRAL"] = "neutral";
-  StatusTagStatus["DEFAULT"] = "default";
-})(StatusTagStatus || (StatusTagStatus = {}));
 var InfoRevealPosition;
 (function (InfoRevealPosition) {
   InfoRevealPosition["TOP_RIGHT"] = "top_right";
@@ -349,4 +308,4 @@ var CarouselProgressMode;
   CarouselProgressMode["NUMBERS"] = "numbers";
 })(CarouselProgressMode || (CarouselProgressMode = {}));
 
-export { AvatarSize as A, ButtonVariant as B, CardVariant as C, DividerSize as D, ExpandableListStyle as E, ZSectionTitleDividerPosition as F, ZDatePickerMode as G, ZDatePickerModeValue as H, InputType as I, ZDatePickerPosition as J, KeyboardKeyCode as K, LicenseType as L, ZRangePickerMode as M, NavigationTabsOrientation as N, OffCanvasVariant as O, PopoverPositions as P, StatusTagStatus as Q, InfoRevealPosition as R, SortDirection as S, ThemeVariant as T, CoverHeroVariant as U, CoverHeroContentPosition as V, CarouselArrowsPosition as W, CarouselProgressMode as X, ZTableRowExpandedType as Z, NavigationTabsSize as a, ButtonType as b, ButtonSize as c, InputStatus as d, PopoverPosition as e, PopoverBorderRadius as f, PopoverShadow as g, KeyboardCode as h, DividerOrientation as i, ListSize as j, Size as k, ExpandableListButtonAlign as l, LabelPosition as m, ListDividerType as n, ListType as o, NotificationType as p, AlertType as q, Device as r, PocketStatus as s, ToastNotification as t, ToastNotificationTransition as u, ToastNotificationPosition as v, ZAriaAlertMode as w, TransitionDirection as x, ZFileUploadType as y, ZChipType as z };
+export { AvatarSize as A, ButtonVariant as B, CardVariant as C, DividerSize as D, ExpandableListStyle as E, ZDatePickerPosition as F, ZRangePickerMode as G, InfoRevealPosition as H, InputType as I, CoverHeroVariant as J, KeyboardKeyCode as K, LicenseType as L, CoverHeroContentPosition as M, NavigationTabsOrientation as N, OffCanvasVariant as O, PopoverPosition as P, CarouselArrowsPosition as Q, CarouselProgressMode as R, SortDirection as S, ThemeVariant as T, ZTableRowExpandedType as Z, NavigationTabsSize as a, ButtonType as b, ButtonSize as c, InputStatus as d, KeyboardCode as e, DividerOrientation as f, ListSize as g, Size as h, ExpandableListButtonAlign as i, LabelPosition as j, ListDividerType as k, ListType as l, NotificationType as m, AlertType as n, Device as o, PocketStatus as p, ToastNotification as q, ToastNotificationTransition as r, ToastNotificationPosition as s, ZAriaAlertMode as t, TransitionDirection as u, ZFileUploadType as v, ZChipType as w, ZSectionTitleDividerPosition as x, ZDatePickerMode as y, ZDatePickerModeValue as z };