@zanichelli/albe-web-components 12.1.3-rc → 12.2.0-rc

package/dist/types/components/navigation/z-app-header/index.d.ts

@@ -0,0 +1,149 @@
+import { EventEmitter } from "../../../stencil-public-runtime";
+/**
+ * @slot title - Slot for the main title
+ * @slot subtitle - Slot for the bottom subtitle. It will not appear in stuck header.
+ * @slot top-subtitle - Slot for the top subtitle. It will not appear in stuck header.
+ * @slot stucked-title - Title for the stuck header. By default it uses the text from the `title` slot.
+ * @cssprop --app-header-typography-1-size - Part of the heading typography's scale. Use it if you have to override the default value. Value: `24px`.
+ * @cssprop --app-header-typography-2-size - Part of the heading typography's scale. Use it if you have to override the default value. Value: `28px`.
+ * @cssprop --app-header-typography-3-size - Part of the heading typography's scale. Use it if you have to override the default value. Value: `32px`.
+ * @cssprop --app-header-typography-4-size - Part of the heading typography's scale. Use it if you have to override the default value. Value: `36px`.
+ * @cssprop --app-header-typography-5-size - Part of the heading typography's scale. Use it if you have to override the default value. Value: `42px`.
+ * @cssprop --app-header-typography-6-size - Part of the heading typography's scale. Use it if you have to override the default value. Value: `48px`.
+ * @cssprop --app-header-typography-7-size - Part of the heading typography's scale. Use it if you have to override the default value. Value: `54px`.
+ * @cssprop --app-header-typography-8-size - Part of the heading typography's scale. Use it if you have to override the default value. Value: `60px`.
+ * @cssprop --app-header-typography-9-size - Part of the heading typography's scale. Use it if you have to override the default value. Value: `68px`.
+ * @cssprop --app-header-typography-10-size - Part of the heading typography's scale. Use it if you have to override the default value. Value: `76px`.
+ * @cssprop --app-header-typography-11-size - Part of the heading typography's scale. Use it if you have to override the default value. Value: `84px`.
+ * @cssprop --app-header-typography-12-size - Part of the heading typography's scale. Use it if you have to override the default value. Value: `92px`.
+ * @cssprop --app-header-typography-1-lineheight - Part of the heading typography's scale. Use it if you have to override the default value. Value: `1.33`.
+ * @cssprop --app-header-typography-2-lineheight - Part of the heading typography's scale. Use it if you have to override the default value. Value: `1.29`.
+ * @cssprop --app-header-typography-3-lineheight - Part of the heading typography's scale. Use it if you have to override the default value. Value: `1.25`.
+ * @cssprop --app-header-typography-4-lineheight - Part of the heading typography's scale. Use it if you have to override the default value. Value: `1.24`.
+ * @cssprop --app-header-typography-5-lineheight - Part of the heading typography's scale. Use it if you have to override the default value. Value: `1.24`.
+ * @cssprop --app-header-typography-6-lineheight - Part of the heading typography's scale. Use it if you have to override the default value. Value: `1.25`.
+ * @cssprop --app-header-typography-7-lineheight - Part of the heading typography's scale. Use it if you have to override the default value. Value: `1.2`.
+ * @cssprop --app-header-typography-8-lineheight - Part of the heading typography's scale. Use it if you have to override the default value. Value: `1.26`.
+ * @cssprop --app-header-typography-9-lineheight - Part of the heading typography's scale. Use it if you have to override the default value. Value: `1.24`.
+ * @cssprop --app-header-typography-10-lineheight - Part of the heading typography's scale. Use it if you have to override the default value. Value: `1.26`.
+ * @cssprop --app-header-typography-11-lineheight - Part of the heading typography's scale. Use it if you have to override the default value. Value: `1.2`.
+ * @cssprop --app-header-typography-12-lineheight - Part of the heading typography's scale. Use it if you have to override the default value. Value: `1.2`.
+ * @cssprop --app-header-typography-1-tracking - Part of the heading typography's scale. Use it if you have to override the default value. Value: `calc(-0.2 / 1em)`.
+ * @cssprop --app-header-typography-2-tracking - Part of the heading typography's scale. Use it if you have to override the default value. Value: `calc(-0.4 / 1em)`.
+ * @cssprop --app-header-typography-3-tracking - Part of the heading typography's scale. Use it if you have to override the default value. Value: `calc(-0.6 / 1em)`.
+ * @cssprop --app-header-typography-4-tracking - Part of the heading typography's scale. Use it if you have to override the default value. Value: `calc(-0.8 / 1em)`.
+ * @cssprop --app-header-typography-5-tracking - Part of the heading typography's scale. Use it if you have to override the default value. Value: `calc(-1 / 1em)`.
+ * @cssprop --app-header-typography-6-tracking - Part of the heading typography's scale. Use it if you have to override the default value. Value: `calc(-1.2 / 1em)`.
+ * @cssprop --app-header-typography-7-tracking - Part of the heading typography's scale. Use it if you have to override the default value. Value: `calc(-1.4 / 1em)`.
+ * @cssprop --app-header-typography-8-tracking - Part of the heading typography's scale. Use it if you have to override the default value. Value: `calc(-1.6 / 1em)`.
+ * @cssprop --app-header-typography-9-tracking - Part of the heading typography's scale. Use it if you have to override the default value. Value: `calc(-1.8 / 1em)`.
+ * @cssprop --app-header-typography-10-tracking - Part of the heading typography's scale. Use it if you have to override the default value. Value: `calc(-2 / 1em)`.
+ * @cssprop --app-header-typography-11-tracking - Part of the heading typography's scale. Use it if you have to override the default value. Value: `calc(-2.2 / 1em)`.
+ * @cssprop --app-header-typography-12-tracking - Part of the heading typography's scale. Use it if you have to override the default value. Value: `calc(-2.4 / 1em)`.
+ * @cssprop --app-header-content-max-width - Use it to set header's content max width. Useful when the project use a fixed width layout. Defaults to `100%`.
+ * @cssprop --app-header-height - Defaults to `auto`.
+ * @cssprop --app-header-top-offset - Top offset for the stuck header. Useful when there are other fixed elements above the header. Defaults to `48px` (the height of the main topbar).
+ * @cssprop --app-header-drawer-trigger-size - The size of the drawer icon. Defaults to `--space-unit * 4`.
+ * @cssprop --app-header-bg - Header background color. Defaults to `--color-surface01`.
+ * @cssprop --app-header-stucked-bg - Stuck header background color. Defaults to `--color-surface01`.
+ * @cssprop --app-header-text-color - Text color. Useful on `hero` variant to set text color based on the colors of the background image. Defaults to `--color-text01`.
+ * @cssprop --app-header-title-font-size - Variable to customize the title's font size.
+ * NOTE: Only use one of the exported `--app-header-typography-*-size` as a value.
+ * Defaults to `--app-header-typography-3-size`.
+ * @cssprop --app-header-title-lineheight - Variable to customize the title's line-height.
+ * NOTE: Only use one of the exported `--app-header-typography-*-lineheight` as a value and use the same level as the one of the font size.
+ * Defaults to `--app-header-typography-3-lineheight`.
+ * @cssprop --app-header-title-letter-spacing - Variable to customize the title's letter-spacing.
+ * NOTE: Only use one of the exported `--app-header-typography-*-tracking` as a value and use the same level as the one of the font size.
+ * Defaults to `--app-header-typography-3-tracking`.
+ * @cssprop --app-header-stucked-text-color - Stuck header text color. Defaults to `--color-text01`.
+ */
+export declare class ZAppHeader {
+  hostElement: HTMLZAppHeaderElement;
+  /**
+   * Stuck mode for the header.
+   * You can programmatically set it using an IntersectionObserver.
+   */
+  stuck: boolean;
+  /**
+   * Set the hero image source for the header.
+   * You can also use a [slot="hero"] node for advanced customization.
+   */
+  hero: string;
+  /**
+   * Should place an overlay over the hero image.
+   * Useful for legibility purpose.
+   */
+  overlay: boolean;
+  /**
+   * Control menu bar position in the header.
+   * - auto: the menu bar is positioned near the title
+   * - stack: the menu bar is positioned below the title
+   * - offcanvas: the menu bar is not displayed and a burger icon appears to open the offcanvas menu
+   */
+  flow: "auto" | "stack" | "offcanvas";
+  /**
+   * The opening state of the drawer.
+   */
+  drawerOpen: boolean;
+  /**
+   * Enable the search bar.
+   */
+  enableSearch: boolean;
+  /**
+   * Placeholder text for the search bar.
+   */
+  searchPlaceholder: string;
+  /**
+   * Search string for the search bar.
+   */
+  searchString: string;
+  /**
+   * Url to the search page.
+   * Set this prop and `enableSearch` to show a link-button on mobile and tablet viewports, instead of the normal searchbar.
+   * The link will also appear on the sticky header.
+   */
+  searchPageUrl: string;
+  /**
+   * The stuck state of the bar.
+   */
+  private _stuck;
+  /**
+   * Current viewport.
+   * Used to change the aspect of the search button (icon only) on mobile and tablet.
+   */
+  private currentViewport;
+  /**
+   * Current count of menu items.
+   */
+  menuLength: number;
+  /**
+   * Emitted when the `stuck` state of the header changes
+   */
+  sticking: EventEmitter;
+  private container?;
+  private menuElements?;
+  private observer?;
+  constructor();
+  evaluateViewport(): void;
+  onStuck(): void;
+  setMenuFloatingMode(): void;
+  private get title();
+  private get scrollParent();
+  private get canShowMenu();
+  private get canShowSearchbar();
+  /**
+   * Whether the header has a hero image, either as a prop or as a slot.
+   */
+  private get hasHero();
+  private openDrawer;
+  private closeDrawer;
+  private collectMenuElements;
+  private enableStuckObserver;
+  private disableStuckMode;
+  onStuckMode(): void;
+  private renderSearchLinkButton;
+  private renderSeachbar;
+  componentDidLoad(): void;
+  render(): HTMLZAppHeaderElement;
+}

package/dist/types/components/navigation/z-menu/index.d.ts

@@ -0,0 +1,61 @@
+import { EventEmitter } from "../../../stencil-public-runtime";
+/**
+ * @slot - Menu label
+ * @slot header - Header to display as the first entry of the open menu.
+ * @slot item - Single entry of the section. Can be slotted multiple times to insert items onto the menu. Use `z-menu-section` for submenus.
+ * @cssprop --z-menu-label-color - Color of the label's text.
+ */
+export declare class ZMenu {
+  hostElement: HTMLZMenuElement;
+  /** Flag to set the active status of the menu. */
+  active?: boolean;
+  /**
+   * Flag to set the display mode of the list.
+   * If true, the list will be absolutely positioned under the menu label,
+   * stacked beneath it otherwise.
+   */
+  floating?: boolean;
+  /** The opening state of the menu. */
+  open: boolean;
+  /**
+   * Tells the component that it's placed in a vertical context with other `ZMenu`s (e.g. in the ZAppHeader's offcanvas).
+   * A small border is placed under it as a separator from other elements.
+   */
+  verticalContext: boolean;
+  hasHeader: boolean;
+  hasContent: boolean;
+  private content;
+  /** Animation frame request id. */
+  private raf;
+  /** The menu has been opened. */
+  opened: EventEmitter;
+  /** The menu has been closed. */
+  closed: EventEmitter;
+  private toggle;
+  /** Close the floating list when a click is performed outside of this Element. */
+  handleClick(ev: MouseEvent): void;
+  onOpenChanged(): void;
+  constructor();
+  componentWillLoad(): void;
+  /**
+   * Sets slotted item text as `data-text` attribute value, to let CSS use it through `attr()`.
+   * @param ev Slotchange event
+   */
+  private onLabelSlotChange;
+  /**
+   * Correctly set position of the floating menu in order to prevent overflow.
+   * @param live Should run the method on every refresh frame.
+   */
+  private reflow;
+  /**
+   * Check if some content slot is set.
+   */
+  private checkContent;
+  /**
+   * Set `menuitem` role to all menu items.
+   * Set the item's inner text to the `data-text` attribute (this is for using bold text avoiding layout shifts).
+   */
+  private onItemsChange;
+  private renderMenuLabel;
+  render(): HTMLZMenuElement;
+}

package/dist/types/components/navigation/z-menu-section/index.d.ts

@@ -0,0 +1,31 @@
+import { EventEmitter } from "../../../stencil-public-runtime";
+/**
+ * A component to create submenus inside the ZMenu.
+ * @slot - Label of the menu section.
+ * @slot item - Single entry of the section. Set the same slot name to different items to put many of them. Add the `active` attribute to a slotted item to highlight it.
+ */
+export declare class ZMenuSection {
+  hostElement: HTMLZMenuSectionElement;
+  /** Active state */
+  active?: boolean;
+  open: boolean;
+  hasContent: boolean;
+  /** The section has been opened. */
+  opened: EventEmitter;
+  /** The section has been closed. */
+  closed: EventEmitter;
+  private toggle;
+  /** Close the list when a click is performed outside of this Element. */
+  handleClick(ev: MouseEvent): void;
+  /**
+   * Check if some content slot is set.
+   */
+  private checkContent;
+  /**
+   * Sets slotted item text as `data-text` attribute value, to let CSS use it through `attr()`.
+   * @param ev Slotchange event
+   */
+  private onLabelSlotChange;
+  componentWillLoad(): void;
+  render(): HTMLZMenuSectionElement;
+}

package/dist/types/components/navigation/z-navigation-tabs/index.d.ts

@@ -0,0 +1,114 @@
+import { EventEmitter } from "../../../stencil-public-runtime";
+import { NavigationTabsSize, NavigationTabsOrientation } from "../../../beans";
+/**
+ * Navigation tabs component.
+ * To select a specific tab programmatically, set the `aria-selected` attribute to `true` on the desired tab.
+ * @slot - Main slot. Use `<button>` or `<a>` tags as children.
+ * @cssprop --z-navigation-tabs-nav-buttons-bg - Navigation buttons background color.
+ * @cssprop --z-navigation-tabs-nav-buttons-fg - Navigation buttons foreground color.
+ */
+export declare class ZNavigationTabs {
+  /**
+   * Set `aria-label` attribute to the internal `<nav>` element with `tablist` role.
+   */
+  ariaLabel?: string;
+  /**
+   * Navigation tabs orientation.
+   */
+  orientation?: NavigationTabsOrientation;
+  /**
+   * Navigation tabs size.
+   */
+  size?: NavigationTabsSize;
+  /**
+   * Index of the selected tab.
+   * Useful to programmatically select a tab.
+   * The tab can also be selected by setting the `aria-selected` attribute to `true` on the desired tab.
+   */
+  selectedTab: number;
+  /**
+   * Emitted when the selected tab changes.
+   * Contains the index of the new selected tab in the `detail` of the event.
+   */
+  selected: EventEmitter<number>;
+  /**
+   * Whether to show navigation buttons.
+   */
+  canNavigate: boolean;
+  /**
+   * Whether backwards navigation is allowed.
+   */
+  canNavigatePrev: boolean;
+  /**
+   * Whether forward navigation is allowed.
+   */
+  canNavigateNext: boolean;
+  host: HTMLZNavigationTabsElement;
+  /**
+   * Index of the last tab that held focus.
+   */
+  private focusedTab;
+  /**
+   * Reference to the `<nav>` element
+   */
+  private nav;
+  /**
+   * Getter for the direction to check based on current orientation.
+   */
+  get direction(): string;
+  /**
+   * Getter for the dimension to check based on current orientation.
+   */
+  get dimension(): string;
+  get tabs(): HTMLElement[];
+  private resizeObserver;
+  /**
+   * Scroll into view to center the tab.
+   */
+  private scrollToTab;
+  /**
+   * Scroll the navigation bar half of its size backward.
+   */
+  private navigateBackwards;
+  /**
+   * Scroll the navigation bar half of its size forward.
+   */
+  private navigateForward;
+  /**
+   * Check if a keyboard event was triggered by an arrow key.
+   */
+  private isArrowNavigation;
+  /**
+   * Check if the navigation buttons are needed.
+   */
+  private checkScrollVisible;
+  /**
+   * Check if navigation buttons can be enabled for each direction.
+   */
+  checkScrollEnabled(): void;
+  /**
+   * When the selected tab changes, update the `aria-selected` attribute on each tab and scroll to the selected tab.
+   */
+  onTabSelected(): void;
+  /**
+   * Handle click on the tabs.
+   * @param event `click` event triggered by a child tab
+   */
+  handleTabClick(event: MouseEvent): void;
+  /**
+   * When a tab is focused, temporarily set to -1 the `tabindex` of the selected tab (if any) and set the `focusedTab` to the index of the focused tab.
+   */
+  onTabFocusIn(event: FocusEvent): void;
+  /**
+   * Handle keyboard navigation through tabs with arrow keys.
+   */
+  navigateThroughTabs(event: KeyboardEvent): void | boolean;
+  /**
+   * If the focus is not going on a tab (`relatedTarget` is the new focused element), set to 0 the `tabindex` of the selected tab or the one of the first tab, then unset the `focusedTab`.
+   */
+  onTabFocusOut(event: FocusEvent): void;
+  connectedCallback(): void;
+  componentDidLoad(): void;
+  disconnectedCallback(): void;
+  render(): HTMLZNavigationTabsElement;
+}

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

@@ -0,0 +1,14 @@
+import { EventEmitter } from "../../../stencil-public-runtime";
+/**
+ * @slot content - set the info box content
+ */
+export declare class ZInfoBox {
+  /** info box unique id */
+  boxid: string;
+  /** render close icon flag */
+  isclosable: boolean;
+  /** emitted on close icon click */
+  infoBoxClose: EventEmitter;
+  private emitInfoBoxClose;
+  render(): HTMLDivElement;
+}

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

@@ -0,0 +1,32 @@
+import { EventEmitter } from "../../../stencil-public-runtime";
+import { NotificationType } from "../../../beans";
+/**
+ * Notification bar component.
+ * @slot - The text of the notification.
+ * @cssprop --z-notification--top-offset - The top offset of the notification. Use it when `sticky` prop is set to `true` and you need the notification to stay under other sticky elements. Default: 0px.
+ */
+export declare class ZNotification {
+  /** Name of the icon on the left of the content */
+  contenticonname?: string;
+  /** Action button text */
+  actiontext?: string;
+  /** Alert variant type */
+  type: NotificationType;
+  /** Enable close icon */
+  showclose?: boolean;
+  /**
+   * Enable shadow.
+   * @deprecated shadow is available only for the `sticky` version of the notification.
+   */
+  showshadow?: boolean;
+  /** Enable sticky notification bar. */
+  sticky?: boolean;
+  /** Call to action clicked */
+  notificationAction: EventEmitter;
+  private handleActionButtonClick;
+  /** Close button clicked */
+  notificationClose: EventEmitter;
+  private handleCloseButtonClick;
+  constructor();
+  render(): HTMLZNotificationElement;
+}

package/dist/types/components/notification/z-toast-notification/index.d.ts

@@ -0,0 +1,56 @@
+import { EventEmitter } from "../../../stencil-public-runtime";
+import { ToastNotificationTransition, ToastNotification } from "../../../beans";
+export declare class ZToastNotification {
+  hostElement: HTMLZToastNotificationElement;
+  /** toast notification's title */
+  heading?: string;
+  /** toast notification's message */
+  message: string;
+  /** toggles closing button rendering */
+  closebutton: boolean;
+  /** toast notification closing timeout (ms) */
+  autoclose?: number;
+  /** toast notification autoclose can be paused */
+  pauseonfocusloss?: boolean;
+  /** toast notification type: dark, light, accent, error, success, warning */
+  type?: ToastNotification;
+  /** toast notification can be draggable*/
+  isdraggable?: boolean;
+  /** toast notification draggable percentage*/
+  draggablepercentage?: number;
+  /** toast notification animation type: slide-in-left, slide-in-right, slide-in-down, slide-in-up*/
+  transition?: ToastNotificationTransition;
+  percentage: number;
+  private isTextLong;
+  private container;
+  private toastText;
+  private sliderManager;
+  private elapsedTime;
+  private timeoutHandle;
+  private startTime;
+  private isMobile;
+  private isCloseEventCalled;
+  watchPropIsdraggable(newValue: boolean): void;
+  watchPropAutoclose(newValue: number): void;
+  watchPropPauseonfocusloss(newValue: boolean): void;
+  /** notification close event */
+  toastClose: EventEmitter;
+  private emitToastClose;
+  componentWillLoad(): void;
+  componentDidLoad(): void;
+  private visibilityChangeEventHandler;
+  private validateAutoclose;
+  private mapSlideOutClass;
+  private calculateDraggedPercentage;
+  private handleSlideOutDragAnimation;
+  private onFocus;
+  private onBlur;
+  private startClosingTimeout;
+  private detectWrap;
+  private renderText;
+  private renderButton;
+  private renderCloseIcon;
+  private renderContainer;
+  private renderMobileContainer;
+  render(): HTMLZToastNotificationElement;
+}

package/dist/types/components/notification/z-tooltip/index.d.ts

@@ -0,0 +1,32 @@
+import { PopoverPosition } from "../../../beans";
+/**
+ * Tooltip component.
+ * It is basically a wrapper for the `<z-popover>` component with custom configuration.
+ *
+ * @cssprop --z-tooltip-theme--surface - background color of the popover.
+ * @cssprop --z-tooltip-theme--text - foreground color of the popover.
+ * @cssprop --z-tooltip-shadow-filter - drop-shadow filter of the popover.
+ */
+export declare class ZTooltip {
+  /** Tooltip position. */
+  position: PopoverPosition;
+  /** Enable tooltip dark mode. */
+  dark: boolean;
+  /**
+   * The open state of the tooltip.
+   */
+  open: boolean;
+  /**
+   * The selector or the element bound with the tooltip.
+   */
+  bindTo?: string | HTMLElement;
+  /**
+   * Reflects `closable` prop of the popover.
+   * "If true, the popover can be closed by clicking outside of it or pressing the escape key.
+   * Otherwise, it will be closed only programmatically (by setting `open` to `false`)."
+   */
+  closable: boolean;
+  private popoverEl;
+  onPopoverOpenChange(): void;
+  render(): HTMLZPopoverElement;
+}

package/dist/types/components/panel/z-panel-elem/index.d.ts

@@ -0,0 +1,25 @@
+/**
+ * @slot `descrSlotName` - description content
+ */
+export declare class ZPanelElem {
+  /** html element id (optional) */
+  elemid?: string;
+  /** image url source (optional) */
+  imgurl?: string;
+  /** alternative image text (optional) */
+  imgalt?: string;
+  /** icon link name (optional) */
+  linkicon?: string;
+  /** link label text*/
+  linklabel: string;
+  /** link url */
+  url: string;
+  /** link target (optional) */
+  target?: string;
+  /** disabled status flag (optional) */
+  isdisabled?: boolean;
+  /** name of slot container (optional) */
+  descrSlotName?: string;
+  private renderIcon;
+  render(): HTMLDivElement;
+}

package/dist/types/components/table/cells/z-td/index.d.ts

@@ -0,0 +1,37 @@
+import { EventEmitter } from "../../../../stencil-public-runtime";
+import { VisibilityCondition } from "../../../../beans";
+/**
+ * ZTd component.
+ * @slot - ZTd content.
+ */
+export declare class ZTd {
+  host: HTMLZTdElement;
+  /**
+   * Number of columns that the cell should span.
+   */
+  colspan: number;
+  /**
+   * Whether the cell should stick.
+   */
+  sticky: boolean;
+  /**
+   * Enables the contextual menu.
+   * Can be set to "hover" or "always" to show the button only on cell hover or always.
+   * Set a nullish value to hide the menu button.
+   */
+  showMenu: VisibilityCondition;
+  /**
+   * Store the open state of the menu.
+   */
+  isMenuOpen: boolean;
+  private menuTrigger;
+  private popoverEl;
+  /**
+   * Emitted when the value of the `colspan` changes.
+   */
+  colspanChange: EventEmitter<number>;
+  protected updateColspan(): void;
+  private onMenuButtonClick;
+  componentWillLoad(): void;
+  render(): HTMLZTdElement;
+}

package/dist/types/components/table/cells/z-th/index.d.ts

@@ -0,0 +1,56 @@
+import { PopoverPosition, SortDirection, VisibilityCondition } from "../../../../beans";
+/**
+ * ZTh component.
+ * @slot - ZTh content.
+ * @slot contextual-menu - Contextual menu content. Only visible when `showMenu` is true.
+ */
+export declare class ZTh {
+  host: HTMLZThElement;
+  /**
+   * Number of columns that the cell should span.
+   */
+  colspan: number;
+  /**
+   * Enables the contextual menu.
+   * Can be set to "hover" or "always" to show the button only on cell hover or always.
+   * Set a nullish value to hide the menu button.
+   */
+  showMenu: VisibilityCondition;
+  /**
+   * Whether the cell should stick.
+   */
+  sticky: boolean;
+  /**
+   * Current sorting direction.
+   * Set `SortDirection.ASC` or `SortDirection.DESC` to show the sort icon.
+   */
+  sortDirection?: SortDirection;
+  /**
+   * Set popover position.
+   */
+  popoverPosition: PopoverPosition;
+  /**
+   * Store the open state of the menu.
+   */
+  isMenuOpen: boolean;
+  /**
+   * Sort event fired when the user clicks on the sort button.
+   * The sorting logic must be implemented by the app.
+   * You can set an `id` on the `z-th` to easly identify the column in the event listener.
+   */
+  private sort;
+  private menuTrigger;
+  private popoverEl;
+  /**
+   * Get the value to set to the `aria-sort` attribute based on the current sort direction.
+   */
+  private get ariaSortDirection();
+  /**
+   * Handle the click on the sort button.
+   * @fires sort
+   */
+  private handleSort;
+  protected updateColspan(): void;
+  componentWillLoad(): void;
+  render(): HTMLZThElement;
+}

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

@@ -0,0 +1,28 @@
+import "../z-thead/index";
+import "../z-tbody/index";
+import "../z-tr/index";
+import "../z-tfoot/index";
+/**
+ * ZTable component.
+ * @slot - Table content (`z-thead`, `z-tbody`, `z-tfoot`, `z-tr`).
+ * @cssprop --z-table--cells-padding - Padding of the cells.
+ */
+export declare class ZTable {
+  host: HTMLZTableElement;
+  /**
+   * Whether the table cells should show a border between them.
+   */
+  bordered: boolean;
+  /**
+   * Whether the table contains some expandable rows.
+   */
+  expandable: boolean;
+  private updateExpandable;
+  private expandableMutationObserver;
+  /**
+   * Setup the table creating a mutation observer for the expandable attribute.
+   */
+  componentWillLoad(): void;
+  disconnectedCallback(): void;
+  render(): HTMLZTableElement;
+}

package/dist/types/components/table/z-tbody/index.d.ts

@@ -0,0 +1,7 @@
+/**
+ * ZTbody component.
+ * @slot - ZTbody content (`z-tr`).
+ */
+export declare class ZTbody {
+  render(): HTMLZTbodyElement;
+}

package/dist/types/components/table/z-tfoot/index.d.ts

@@ -0,0 +1,11 @@
+/**
+ * ZTFoot component.
+ * @slot - ZTFoot content (`z-tr`).
+ */
+export declare class ZTfoot {
+  /**
+   * If true, the footer will be stuck to the bottom of the table.
+   */
+  sticky: boolean;
+  render(): void;
+}

package/dist/types/components/table/z-thead/index.d.ts

@@ -0,0 +1,11 @@
+/**
+ * ZThead component.
+ * @slot - ZThead content (`z-tr`).
+ */
+export declare class ZThead {
+  /**
+   * If true, the header will be stuck to the top of the table.
+   */
+  sticky: boolean;
+  render(): HTMLZTheadElement;
+}