@zanichelli/albe-web-components 5.0.1 → 5.3.0

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

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

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

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-90e18641.js';
-import { P as PopoverPositions } from './index-3786a7ff.js';
+import { P as PopoverPositions } from './index-e5e2b27f.js';
 
 const stylesCss = ":host{--z-tooltip-theme--surface:var(--color-surface01);--z-tooltip-theme--text:var(--color-text01);--arrow-size:6px;--edge-offset:calc(-1 * (var(--arrow-size) + calc(var(--space-unit) * 2)));position:relative;display:none;align-items:center;justify-content:center;padding:var(--space-unit);min-width:calc(var(--space-unit) * 8);min-height:calc(var(--space-unit) * 4);color:var(--z-tooltip-theme--text);fill:currentColor;font-family:var(--font-family-sans);text-align:center;border-radius:var(--border-radius-small);background:var(--z-tooltip-theme--surface);filter:drop-shadow(0 4px 8px var(--shadow-color-base));will-change:filter}:host(.legacy){display:inline-flex;padding:calc(var(--space-unit) * 2);min-width:auto;min-height:auto;max-width:200px;font-style:italic;line-height:16px;letter-spacing:0.32px;font-size:12px;border:var(--border-size-small) solid var(--gray200);border-radius:var(--border-radius);filter:drop-shadow(0px 0px 2px rgba(0, 0, 0, 0.08))}:host(.legacy)::before{--arrow-size:14px}:host([position])::before{--arrow-edge-offset:calc(100% - var(--arrow-size) - var(--space-unit));--arrow-center-x-offset:calc(50% - calc(var(--arrow-size) / 2));--arrow-center-y-offset:calc(100% - calc(var(--arrow-size) / 2));content:'';position:absolute;width:var(--arrow-size);height:var(--arrow-size);background:inherit;transform:rotate(45deg)}:host([open][style*='top:']),:host([open][style*='inset:']){display:inline-flex}:host([position^='top']){margin-bottom:var(--space-unit)}:host([position='right']){margin-left:var(--space-unit)}:host([position='top_right']),:host([position='bottom_right']){margin-left:var(--edge-offset)}:host([position^='bottom']){margin-top:var(--space-unit)}:host([position='left']){margin-right:var(--space-unit)}:host([position='top_left']),:host([position='bottom_left']){margin-right:var(--edge-offset)}:host([position^='top'])::before{top:var(--arrow-center-y-offset)}:host([position^='bottom'])::before{bottom:var(--arrow-center-y-offset)}:host([position='top'])::before,:host([position='bottom'])::before{left:var(--arrow-center-x-offset)}:host([position='right'])::before,:host([position='left'])::before{top:var(--arrow-center-x-offset)}:host([position='right'])::before{right:var(--arrow-center-y-offset)}:host([position='top_right'])::before,:host([position='bottom_right'])::before{right:var(--arrow-edge-offset)}:host([position='left'])::before{left:var(--arrow-center-y-offset)}:host([position='top_left'])::before,:host([position='bottom_left'])::before{left:var(--arrow-edge-offset)}::slotted(*){flex:1 auto;overflow:auto}";
 
@@ -85,7 +85,7 @@ const ZTooltipDeprecated = class {
     registerInstance(this, hostRef);
     this.positionChange = createEvent(this, "positionChange", 7);
     /** Tooltip position. */
-    this.type = PopoverPositions.AUTO;
+    this.type = PopoverPositions.auto;
     /**
      * The open state of the tooltip.
      */
@@ -96,7 +96,7 @@ const ZTooltipDeprecated = class {
       Object
         .values(PopoverPositions)
         .every((position) => newValue !== position)) {
-      this.type = PopoverPositions.AUTO;
+      this.type = PopoverPositions.auto;
     }
   }
   onPositionChange() {
@@ -165,29 +165,29 @@ const ZTooltipDeprecated = class {
     const availableHeight = availableTop + availableBottom + boundingRect.height;
     const availableWidth = availableLeft + availableRight + boundingRect.width;
     let position = this.type;
-    if (position === PopoverPositions.AUTO) {
+    if (position === PopoverPositions.auto) {
       /**
        * The `AUTO` position tries to place the tooltip in the "safest" area,
        * where there's more space available.
        */
       const positions = [];
       if (availableTop / availableHeight > 0.9) {
-        positions.unshift(PopoverPositions.TOP);
+        positions.unshift(PopoverPositions.top);
       }
       else if (availableTop / availableHeight > 0.6) {
-        positions.push(PopoverPositions.TOP);
+        positions.push(PopoverPositions.top);
       }
       else if (availableTop / availableHeight < 0.1) {
-        positions.unshift(PopoverPositions.BOTTOM);
+        positions.unshift(PopoverPositions.bottom);
       }
       else {
-        positions.push(PopoverPositions.BOTTOM);
+        positions.push(PopoverPositions.bottom);
       }
       if (availableLeft / availableWidth > 0.6) {
-        positions.push(PopoverPositions.LEFT);
+        positions.push(PopoverPositions.left);
       }
       else if (availableLeft / availableWidth < 0.4) {
-        positions.push(PopoverPositions.RIGHT);
+        positions.push(PopoverPositions.right);
       }
       position = positions.join("_");
     }
@@ -199,46 +199,46 @@ const ZTooltipDeprecated = class {
     const offsetRight = boundingRect.right - relativeBoundingRect.right;
     const offsetBottom = boundingRect.bottom - relativeBoundingRect.bottom;
     const offsetLeft = boundingRect.left - relativeBoundingRect.left;
-    if (position === PopoverPositions.TOP ||
-      position === PopoverPositions.TOP_RIGHT ||
-      position === PopoverPositions.TOP_LEFT) {
+    if (position === PopoverPositions.top ||
+      position === PopoverPositions.top_right ||
+      position === PopoverPositions.top_left) {
       style.top = "auto";
       style.bottom = `${offsetBottom + boundingRect.height}px`;
     }
-    if (position === PopoverPositions.BOTTOM ||
-      position === PopoverPositions.BOTTOM_RIGHT ||
-      position === PopoverPositions.BOTTOM_LEFT) {
+    if (position === PopoverPositions.bottom ||
+      position === PopoverPositions.bottom_right ||
+      position === PopoverPositions.bottom_left) {
       style.top = `${offsetTop + boundingRect.height}px`;
       style.bottom = "auto";
     }
-    if (position === PopoverPositions.TOP ||
-      position === PopoverPositions.BOTTOM) {
+    if (position === PopoverPositions.top ||
+      position === PopoverPositions.bottom) {
       style.left = `${offsetLeft +
         (boundingRect.width / 2) -
         (this.host.clientWidth / 2)}px`;
     }
-    if (position === PopoverPositions.TOP_RIGHT ||
-      position === PopoverPositions.BOTTOM_RIGHT) {
+    if (position === PopoverPositions.top_right ||
+      position === PopoverPositions.bottom_right) {
       style.right = "auto";
       style.left = `${offsetLeft + boundingRect.width}px`;
     }
-    if (position === PopoverPositions.TOP_LEFT ||
-      position === PopoverPositions.BOTTOM_LEFT) {
+    if (position === PopoverPositions.top_left ||
+      position === PopoverPositions.bottom_left) {
       style.left = "auto";
       style.right = `${offsetRight + boundingRect.width}px`;
     }
-    if (position === PopoverPositions.RIGHT ||
-      position === PopoverPositions.LEFT) {
+    if (position === PopoverPositions.right ||
+      position === PopoverPositions.left) {
       style.top = `${offsetTop +
         (boundingRect.height / 2) -
         (this.host.clientHeight / 2)}px`;
       style.bottom = "auto";
     }
-    if (position === PopoverPositions.RIGHT) {
+    if (position === PopoverPositions.right) {
       style.right = "auto";
       style.left = `${offsetLeft + boundingRect.width}px`;
     }
-    if (position === PopoverPositions.LEFT) {
+    if (position === PopoverPositions.left) {
       style.left = "auto";
       style.right = `${offsetRight + boundingRect.width}px`;
     }

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

@@ -1,5 +1,5 @@
 import { r as registerInstance, h } from './index-90e18641.js';
-import { P as PopoverPositions } from './index-3786a7ff.js';
+import { P as PopoverPositions } from './index-e5e2b27f.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)}";
 
@@ -7,7 +7,7 @@ const ZTooltip = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     /** Tooltip position. */
-    this.position = PopoverPositions.AUTO;
+    this.position = PopoverPositions.auto;
     /** Enable tooltip dark mode. */
     this.dark = false;
     /**

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

@@ -130,7 +130,10 @@ export declare enum InputTypeEnum {
   email = "email",
   textarea = "textarea",
   checkbox = "checkbox",
-  radio = "radio"
+  radio = "radio",
+  tel = "tel",
+  url = "url",
+  search = "search"
 }
 export declare type InputStatusBean = keyof typeof InputStatusEnum;
 export declare enum InputStatusEnum {
@@ -140,19 +143,19 @@ export declare enum InputStatusEnum {
 }
 export declare type PopoverPositionBean = keyof typeof PopoverPositions;
 export declare enum PopoverPositions {
-  AUTO = "auto",
-  TOP = "top",
-  RIGHT = "right",
-  BOTTOM = "bottom",
-  LEFT = "left",
-  TOP_RIGHT = "top_right",
-  TOP_LEFT = "top_left",
-  BOTTOM_RIGHT = "bottom_right",
-  BOTTOM_LEFT = "bottom_left",
-  RIGHT_TOP = "right_top",
-  RIGHT_BOTTOM = "right_bottom",
-  LEFT_TOP = "left_top",
-  LEFT_BOTTOM = "left_bottom"
+  auto = "auto",
+  top = "top",
+  right = "right",
+  bottom = "bottom",
+  left = "left",
+  top_right = "top_right",
+  top_left = "top_left",
+  bottom_right = "bottom_right",
+  bottom_left = "bottom_left",
+  right_top = "right_top",
+  right_bottom = "right_bottom",
+  left_top = "left_top",
+  left_bottom = "left_bottom"
 }
 export declare enum PopoverPosition {
   "after-down" = "after-down",
@@ -384,6 +387,10 @@ export declare enum ZDatePickerPosition {
   top = "top",
   bottom = "bottom"
 }
+export declare enum ZRangePickerMode {
+  date = "date",
+  dateTime = "date-time"
+}
 export declare type SkipToContentLink = {
   label: string;
   href: string;
@@ -396,3 +403,10 @@ export declare enum StatusTagStatus {
   neutral = "neutral",
   default = "default"
 }
+export declare type InfoRevealPositionBean = keyof typeof InfoRevealPosition;
+export declare enum InfoRevealPosition {
+  top_right = "top_right",
+  top_left = "top_left",
+  bottom_right = "bottom_right",
+  bottom_left = "bottom_left"
+}

package/dist/types/components/date-picker/utils.d.ts

@@ -1,3 +1,4 @@
-import { ZDatePickerMode, ZDatePickerPosition } from "../../beans";
-export declare function setFlatpickrPosition(element: HTMLElement, mode: ZDatePickerMode): ZDatePickerPosition;
-export declare function setAriaOptions(element: HTMLElement, mode: ZDatePickerMode): void;
+import { ZDatePickerPosition } from "../../beans";
+export declare function validateDate(dateStr: any, hasTime?: boolean): boolean;
+export declare function setFlatpickrPosition(element: HTMLElement, mode: any): ZDatePickerPosition;
+export declare function setAriaOptions(element: HTMLElement, mode: any): void;

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

@@ -11,14 +11,19 @@ export declare class ZDatePicker {
   /** [Optional] datepicker mode: date, datetime, only months */
   mode: ZDatePickerMode;
   flatpickrPosition: ZDatePickerPosition;
-  private flatpickrInstance;
+  inputError: boolean;
+  private picker;
   private hasChildren;
+  watchMode(): void;
   /** emitted when date changes, returns selected date */
   dateSelect: EventEmitter;
   emitDateSelect(date: any): void;
   handleKeyDown(ev: KeyboardEvent): void;
   componentWillLoad(): void;
   componentDidLoad(): void;
+  setupPickers(): void;
+  formatDate(date: any): string;
+  onStopTyping(value: any): void;
   renderSlottedContent(): any;
   renderZInput(): any;
   render(): any;

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

@@ -1,5 +1,5 @@
 import { EventEmitter } from "../../../stencil-public-runtime";
-import { ZDatePickerMode, ZDatePickerPosition } from "../../../beans";
+import { ZRangePickerMode, ZDatePickerPosition } from "../../../beans";
 export declare class ZRangePicker {
   element: HTMLElement;
   /** unique id */
@@ -12,32 +12,33 @@ export declare class ZRangePicker {
   secondAriaLabel?: string;
   /** second z-input label */
   secondLabel?: string;
-  /** [Optional] datepicker mode: date, datetime, only months */
-  mode: ZDatePickerMode;
+  /** [Optional] datepicker mode: date or datetime */
+  mode: ZRangePickerMode;
   flatpickrPosition: ZDatePickerPosition;
   activeInput: string;
-  private flatpickrInstance;
-  private flatpickrInstance2;
+  firstInputError: boolean;
+  lastInputError: boolean;
+  private firstPicker;
+  private lastPicker;
   /** emitted when date changes, returns an array with the two selected dates */
   dateSelect: EventEmitter;
+  watchMode(): void;
   handleClick(): void;
   handleKeyDown(ev: KeyboardEvent): void;
-  /** Set background color before or after first selected date, before selecting the second one */
-  onMouseOver(e: CustomEvent): void;
   componentDidLoad(): void;
-  onDateSelect(selectedDates: any, instance: any): void;
-  getDate(date: any): string;
+  setupPickers(): void;
+  onDateSelect(): void;
+  disableDates(date: any, index: any): void;
+  formatDate(date: any): string;
   printDate(firstDate: any, lastDate: any): void;
+  getTime(): string;
+  getDateWithoutTime(date: any): Date;
   /** Replace month word to month number */
-  parseDate(date: any): Date;
+  replaceMonths(date: any, time: any): Date;
   /** Get the current focused input, first or last */
   getFocusedInput(): void;
-  /** Set current month after flatpickr opened */
-  getCurrentMonth(): void;
   /** Set style of the days between the two selected dates */
-  setRangeStyle(): void;
-  /** Set style of the days between first selected date and hovered date */
-  setRangeHoverStyle(e: any, flatpickr: any, calendar: any): void;
+  setRangeStyle(index: any): void;
   onStopTyping(value: any): void;
   render(): any;
 }

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

@@ -38,6 +38,14 @@ export declare class ZInput {
   hasclearicon?: boolean;
   /** render icon (optional): available for text */
   icon?: string;
+  /** min number value (optional): available for number */
+  min?: number;
+  /** max number value (optional): available for number */
+  max?: number;
+  /** step number value (optional): available for number */
+  step?: number;
+  /** pattern value (optional): available for tel, text, search, url, email, password*/
+  pattern?: string;
   isTyping: boolean;
   passwordHidden: boolean;
   private timer;
@@ -74,6 +82,14 @@ export declare class ZInput {
     autocomplete: string;
     onInput: (e: any) => void;
   };
+  getNumberAttributes(type: InputTypeBean): {
+    min: number;
+    max: number;
+    step: number;
+  };
+  getPatternAttribute(type: InputTypeBean): {
+    pattern: string;
+  };
   renderInputText(type?: InputTypeBean): any;
   renderLabel(): any;
   renderIcons(): any;

package/dist/types/components/z-info-reveal/index.d.ts

@@ -0,0 +1,28 @@
+import { InfoRevealPositionBean } from "../../beans";
+export declare class ZInfoReveal {
+  el: HTMLElement;
+  /** Name of the icon for the open button */
+  icon?: string;
+  position?: InfoRevealPositionBean;
+  /** Text that appears on closed panel next to the open button. */
+  label?: string;
+  /** Whether the info panel is open. */
+  open: boolean;
+  /** Current index for the info queue. */
+  currentIndex: number;
+  watchItems(): void;
+  /**
+   * Open the info box.
+   */
+  openInfoBox(): void;
+  /**
+   * Close the info box.
+   */
+  closeInfoBox(): void;
+  /**
+   * Navigate slotted info.
+   * It closes the info box after the last info has been navigated.
+   */
+  next(): void;
+  render(): any;
+}

package/dist/types/components/z-popover/index.d.ts

@@ -1,5 +1,5 @@
 import { EventEmitter } from "../../stencil-public-runtime";
-import { PopoverPositions } from "../../beans";
+import { PopoverPositionBean } from "../../beans";
 /**
  * Popover component.
  *
@@ -10,7 +10,7 @@ import { PopoverPositions } from "../../beans";
  */
 export declare class ZPopover {
   /** Popover position. */
-  position: PopoverPositions;
+  position: PopoverPositionBean;
   /**
    * The open state of the popover.
    */
@@ -34,7 +34,7 @@ export declare class ZPopover {
   /**
    * The current position of the popover.
    */
-  currentPosition?: PopoverPositions;
+  currentPosition?: PopoverPositionBean;
   /**
    * Position change event.
    */

package/dist/types/components.d.ts

@@ -6,7 +6,7 @@
  */
 import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
 import { AlertTypes, LicenseTypeEnum, MenuItem as MenuItem1, PopoverPositions as PopoverPositions1 } from "./beans/index";
-import { AvatarSize, ButtonSizeEnum, ButtonVariantBean, ButtonVariantEnum, CardVariants, ComboItemBean, DictionaryData, DividerOrientation, DividerSize, ExpandableListButtonAlign, ExpandableListStyle, HeaderUserData, InputStatusBean, InputTypeBean, LabelPosition, ListDividerType, ListSize, MenuItem, NavigationTabsOrientation, NavigationTabsSize, NotificationType, OffCanvasVariantsEnum, PocketStatus, PopoverBorderRadius, PopoverPosition, PopoverPositions, PopoverShadow, SelectItemBean, Size, SkipToContentLink, SortDirection, StatusTagStatus, ThemeVariant, ThemeVariantBean, ToastNotificationPositionsTypes, ToastNotificationTransitionTypes, ToastNotificationTypes, TransitionDirectionEnum, ZChipType, ZDatePickerMode, ZFileUploadTypeEnum, ZSectionTitleDividerPosition, ZTableRowExpandedType } from "./beans";
+import { AvatarSize, ButtonSizeEnum, ButtonVariantBean, ButtonVariantEnum, CardVariants, ComboItemBean, DictionaryData, DividerOrientation, DividerSize, ExpandableListButtonAlign, ExpandableListStyle, HeaderUserData, InfoRevealPositionBean, InputStatusBean, InputTypeBean, LabelPosition, ListDividerType, ListSize, MenuItem, NavigationTabsOrientation, NavigationTabsSize, NotificationType, OffCanvasVariantsEnum, PocketStatus, PopoverBorderRadius, PopoverPosition, PopoverPositionBean, PopoverPositions, PopoverShadow, SelectItemBean, Size, SkipToContentLink, SortDirection, StatusTagStatus, ThemeVariant, ThemeVariantBean, ToastNotificationPositionsTypes, ToastNotificationTransitionTypes, ToastNotificationTypes, TransitionDirectionEnum, ZChipType, ZDatePickerMode, ZFileUploadTypeEnum, ZRangePickerMode, ZSectionTitleDividerPosition, ZTableRowExpandedType } from "./beans";
 import { ListItemBean } from "./beans/index.js";
 import { ZTypographyLevels } from "./components/typography/z-typography/index";
 export namespace Components {
@@ -531,6 +531,17 @@ export namespace Components {
          */
         "isclosable": boolean;
     }
+    interface ZInfoReveal {
+        /**
+          * Name of the icon for the open button
+         */
+        "icon"?: string;
+        /**
+          * Text that appears on closed panel next to the open button.
+         */
+        "label"?: string;
+        "position"?: InfoRevealPositionBean;
+    }
     interface ZInput {
         /**
           * the input aria-label
@@ -576,14 +587,26 @@ export namespace Components {
           * the input label position: available for checkbox, radio
          */
         "labelPosition"?: LabelPosition;
+        /**
+          * max number value (optional): available for number
+         */
+        "max"?: number;
         /**
           * input helper message (optional): available for text, password, number, email, textarea - if set to `false` message won't be displayed
          */
         "message"?: string | boolean;
+        /**
+          * min number value (optional): available for number
+         */
+        "min"?: number;
         /**
           * the input name
          */
         "name"?: string;
+        /**
+          * pattern value (optional): available for tel, text, search, url, email, password
+         */
+        "pattern"?: string;
         /**
           * the input placeholder (optional)
          */
@@ -600,6 +623,10 @@ export namespace Components {
           * the input status (optional): available for text, password, number, email, textarea
          */
         "status"?: InputStatusBean;
+        /**
+          * step number value (optional): available for number
+         */
+        "step"?: number;
         /**
           * input types
          */
@@ -1513,7 +1540,7 @@ export namespace Components {
         /**
           * Popover position.
          */
-        "position": PopoverPositions;
+        "position": PopoverPositionBean;
         /**
           * Whether to show popover's arrow.
          */
@@ -1555,9 +1582,9 @@ export namespace Components {
          */
         "firstLabel"?: string;
         /**
-          * [Optional] datepicker mode: date, datetime, only months
+          * [Optional] datepicker mode: date or datetime
          */
-        "mode": ZDatePickerMode;
+        "mode": ZRangePickerMode;
         /**
           * unique id
          */
@@ -2170,6 +2197,12 @@ declare global {
         prototype: HTMLZInfoBoxElement;
         new (): HTMLZInfoBoxElement;
     };
+    interface HTMLZInfoRevealElement extends Components.ZInfoReveal, HTMLStencilElement {
+    }
+    var HTMLZInfoRevealElement: {
+        prototype: HTMLZInfoRevealElement;
+        new (): HTMLZInfoRevealElement;
+    };
     interface HTMLZInputElement extends Components.ZInput, HTMLStencilElement {
     }
     var HTMLZInputElement: {
@@ -2648,6 +2681,7 @@ declare global {
         "z-icon": HTMLZIconElement;
         "z-icon-package": HTMLZIconPackageElement;
         "z-info-box": HTMLZInfoBoxElement;
+        "z-info-reveal": HTMLZInfoRevealElement;
         "z-input": HTMLZInputElement;
         "z-input-deprecated": HTMLZInputDeprecatedElement;
         "z-input-label": HTMLZInputLabelElement;
@@ -3310,6 +3344,17 @@ declare namespace LocalJSX {
          */
         "onInfoBoxClose"?: (event: CustomEvent<any>) => void;
     }
+    interface ZInfoReveal {
+        /**
+          * Name of the icon for the open button
+         */
+        "icon"?: string;
+        /**
+          * Text that appears on closed panel next to the open button.
+         */
+        "label"?: string;
+        "position"?: InfoRevealPositionBean;
+    }
     interface ZInput {
         /**
           * the input aria-label
@@ -3351,10 +3396,18 @@ declare namespace LocalJSX {
           * the input label position: available for checkbox, radio
          */
         "labelPosition"?: LabelPosition;
+        /**
+          * max number value (optional): available for number
+         */
+        "max"?: number;
         /**
           * input helper message (optional): available for text, password, number, email, textarea - if set to `false` message won't be displayed
          */
         "message"?: string | boolean;
+        /**
+          * min number value (optional): available for number
+         */
+        "min"?: number;
         /**
           * the input name
          */
@@ -3375,6 +3428,10 @@ declare namespace LocalJSX {
           * Emitted when user stops typing, returns value, validity
          */
         "onStopTyping"?: (event: CustomEvent<any>) => void;
+        /**
+          * pattern value (optional): available for tel, text, search, url, email, password
+         */
+        "pattern"?: string;
         /**
           * the input placeholder (optional)
          */
@@ -3391,6 +3448,10 @@ declare namespace LocalJSX {
           * the input status (optional): available for text, password, number, email, textarea
          */
         "status"?: InputStatusBean;
+        /**
+          * step number value (optional): available for number
+         */
+        "step"?: number;
         /**
           * input types
          */
@@ -4431,7 +4492,7 @@ declare namespace LocalJSX {
         /**
           * Popover position.
          */
-        "position"?: PopoverPositions;
+        "position"?: PopoverPositionBean;
         /**
           * Whether to show popover's arrow.
          */
@@ -4477,9 +4538,9 @@ declare namespace LocalJSX {
          */
         "firstLabel"?: string;
         /**
-          * [Optional] datepicker mode: date, datetime, only months
+          * [Optional] datepicker mode: date or datetime
          */
-        "mode"?: ZDatePickerMode;
+        "mode"?: ZRangePickerMode;
         /**
           * emitted when date changes, returns an array with the two selected dates
          */
@@ -4956,6 +5017,7 @@ declare namespace LocalJSX {
         "z-icon": ZIcon;
         "z-icon-package": ZIconPackage;
         "z-info-box": ZInfoBox;
+        "z-info-reveal": ZInfoReveal;
         "z-input": ZInput;
         "z-input-deprecated": ZInputDeprecated;
         "z-input-label": ZInputLabel;
@@ -5069,6 +5131,7 @@ declare module "@stencil/core" {
             "z-icon": LocalJSX.ZIcon & JSXBase.HTMLAttributes<HTMLZIconElement>;
             "z-icon-package": LocalJSX.ZIconPackage & JSXBase.HTMLAttributes<HTMLZIconPackageElement>;
             "z-info-box": LocalJSX.ZInfoBox & JSXBase.HTMLAttributes<HTMLZInfoBoxElement>;
+            "z-info-reveal": LocalJSX.ZInfoReveal & JSXBase.HTMLAttributes<HTMLZInfoRevealElement>;
             "z-input": LocalJSX.ZInput & JSXBase.HTMLAttributes<HTMLZInputElement>;
             "z-input-deprecated": LocalJSX.ZInputDeprecated & JSXBase.HTMLAttributes<HTMLZInputDeprecatedElement>;
             "z-input-label": LocalJSX.ZInputLabel & JSXBase.HTMLAttributes<HTMLZInputLabelElement>;

package/dist/web-components-library/index.esm.js

@@ -1 +1 @@
-import{c as o}from"./p-d41ca4c3.js";import"./p-6897ca8c.js";import"./p-d69e14fb.js";const c={colorFromId:o};export{c as Utils}
+import{c as o}from"./p-5aa819f8.js";import"./p-0c3e7bc3.js";import"./p-d69e14fb.js";const p={colorFromId:o};export{p as Utils}