@oiz/stzh-components 3.0.0-beta3 → 3.0.0-beta5

package/dist/types/components/stzh-chipselect/stzh-chipselect.d.ts

@@ -14,15 +14,19 @@ export declare class StzhChipselect {
   /** The list of chips */
   data: string | StzhChipselectItem[];
   private _data;
-  private _dataDropdown;
   /** The name of the input element */
   name: string;
   /** Label */
   label: string;
+  /** Whether label is hidden. */
+  labelHidden: boolean;
+  /** Multiple */
+  multiple: boolean;
   /** Value */
-  value: string;
+  value: string | string[];
+  private _value;
   /** Default value (used by reset) */
-  defaultValue: string;
+  defaultValue: string | string[];
   /** Description message (use description slot as alternative) */
   description: string;
   /** Long description message appearing in a popover (use description-long slot as alternative) */
@@ -47,6 +51,7 @@ export declare class StzhChipselect {
   /** Change event */
   stzhChange: EventEmitter<StzhChipselectChangeEvent>;
   resetListener(event: Event): void;
+  valueWatcher(newValue: string[] | string): void;
   dataWatcher(newValue: StzhChipselectItem[] | string): void;
   errorWatcher(newValue: string | string[]): void;
   private id;
@@ -54,7 +59,6 @@ export declare class StzhChipselect {
   private waitForNextRender;
   private handleReset;
   private handleChipClick;
-  private handleDropdownChange;
   private handleKeydown;
   componentDidRender(): void;
   componentWillLoad(): Promise<void>;

package/dist/types/components/stzh-contact/stzh-contact.d.ts

@@ -19,6 +19,8 @@ export declare class StzhContact {
   headingLevel: "1" | "2" | "3" | "4";
   /** Name */
   name: string;
+  /** Name heading level */
+  nameHeadingLevel: "" | "1" | "2" | "3" | "4";
   /** Address (alternative for address slot or separate properties `street`, `streetInfo`, `postalCode` & `location`) */
   address: string;
   /** Street */

package/dist/types/components/stzh-cta/stzh-cta.d.ts

@@ -1,5 +1,5 @@
 import { EventEmitter } from "../../stencil-public-runtime";
-import { StzhCtaFocusEvent, StzhCtaBlurEvent } from "../../index";
+import { StzhCtaFocusEvent, StzhCtaBlurEvent, StzhCtaClickEvent } from "../../index";
 /**
  * @slot heading - Slot for heading as alternative for attribute
  * @slot lead - Slot for lead as alternative for attribute
@@ -22,10 +22,12 @@ export declare class StzhCta {
   stickyDisabled: boolean;
   loaded: boolean;
   element: HTMLStzhCtaElement;
-  /** Input focus event */
+  /** Focus event */
   stzhFocus: EventEmitter<StzhCtaFocusEvent>;
-  /** Input blur event */
+  /** Blur event */
   stzhBlur: EventEmitter<StzhCtaBlurEvent>;
+  /** Click event */
+  stzhClick: EventEmitter<StzhCtaClickEvent>;
   private button;
   private placeholderButton;
   private debounceResize;
@@ -34,6 +36,7 @@ export declare class StzhCta {
   private onRootFocus;
   private onFocus;
   private onBlur;
+  private onClick;
   private handlePlaceholderButtonResize;
   private updateButtonWidthByResize;
   componentDidLoad(): void;

package/dist/types/components/stzh-datalist-item/stzh-datalist-item.d.ts

@@ -1,5 +1,5 @@
 import { EventEmitter } from "../../stencil-public-runtime";
-import { StzhDatalistItemActionClickEvent, StzhDatalistVariant, StzhDatalistDirection, StzhStatusType } from "../../index";
+import { StzhDatalistItemActionClickEvent, StzhDatalistVariant, StzhDatalistDirection, StzhStatusType, StzhDatalistItemClickEvent } from "../../index";
 import { StzhLocaleComponent } from "../../utils/translation-utils";
 /**
  * @slot - Slot for nested datalist
@@ -20,6 +20,8 @@ export declare class StzhDatalistItem {
   leadingIcon: string;
   /** Icon of action button (if href is used, will only be for presentation) */
   icon: string;
+  /** Icon position */
+  iconPosition: "left" | "right";
   /** Overwrite aria-label of action button (default aria label is `label` and `value`). */
   iconLabel: string;
   /** Tooltip content of action button. Overwrites aria-label (set by default or `iconLabel`) of action button. */
@@ -43,6 +45,8 @@ export declare class StzhDatalistItem {
   a11yControls: string;
   /** Item action click event */
   stzhItemActionClick: EventEmitter<StzhDatalistItemActionClickEvent>;
+  /** Item click event */
+  stzhClick: EventEmitter<StzhDatalistItemClickEvent>;
   element: HTMLStzhDatalistItemElement;
   metaWatcher(newValue: string[] | string): void;
   externalWatcher(): void;
@@ -53,7 +57,8 @@ export declare class StzhDatalistItem {
   private isPhone;
   private datalist;
   private datalistItemId;
-  private actionClick;
+  private onActionClick;
+  private onClick;
   private handleDirectionChange;
   private handleVariantChange;
   private renderInner;

package/dist/types/components/stzh-datamessagelist-item/stzh-datamessagelist-item.d.ts

@@ -20,6 +20,8 @@ export declare class StzhDatamessagelistItem {
   description: string;
   /** Icon (`arrow-right` by default or `external-link` if rel="*external*" is used) */
   icon: string;
+  /** Whether item is not interactive (arrow icon and hover effect will disappear) */
+  nonInteractive: boolean;
   /** Loading status */
   loadingStatus: StzhDatamessagelistItemEntryLoadingStatus | string;
   private _loadingStatus;

package/dist/types/components/stzh-daterange/stzh-daterange.d.ts

@@ -0,0 +1,26 @@
+import { StzhDaterangeRanges } from "../../index";
+import { StzhDaterangeLocalizedText } from "./stzh-daterange.localization";
+/**
+ * @slot from - Slot for datepicker
+ * @slot to - Slot for datepicker
+ */
+export declare class StzhDaterange {
+  /** Translation strings */
+  localization: StzhDaterangeLocalizedText;
+  /** Legend */
+  legend: string;
+  /** Range links (current predefined available ranges: "today", "tomorrow", "next7days") */
+  rangeLinks: string | StzhDaterangeRanges[];
+  private _rangeLinks;
+  element: HTMLStzhDaterangeElement;
+  rangeLinksWatcher(newValue: StzhDaterangeRanges[] | string): void;
+  private observer;
+  private datefromElement;
+  private datetoElement;
+  private handleRangeClick;
+  componentWillLoad(): Promise<void>;
+  private init;
+  connectedCallback(): void;
+  disconnectedCallback(): void;
+  render(): any;
+}

package/dist/types/components/stzh-daterange/stzh-daterange.localization.d.ts

@@ -0,0 +1,9 @@
+import { StzhLocaleComponent } from "../../utils/translation-utils";
+export type StzhDaterangeLocalizedText = StzhLocaleComponent & {
+  legend: string;
+  labelFrom: string;
+  labelTo: string;
+  rangeToday: string;
+  rangeTomorrow: string;
+  rangeNextSevenDays: string;
+};

package/dist/types/components/stzh-dropdown/stzh-dropdown.d.ts

@@ -1,5 +1,5 @@
 import { EventEmitter } from "../../stencil-public-runtime";
-import { StzhDropdownOption, StzhDropdownChangeEvent, StzhDropdownItemAddEvent, StzhDropdownItemRemoveEvent, StzhDropdownOptionAddEvent, StzhDropdownOptionRemoveEvent, StzhDropdownOpenEvent, StzhDropdowCloseEvent, StzhDropdownFocusEvent, StzhDropdownBlurEvent, StzhDropdowInitEvent } from "../../index";
+import { StzhDropdownSize, StzhDropdownOption, StzhDropdownChangeEvent, StzhDropdownItemAddEvent, StzhDropdownItemRemoveEvent, StzhDropdownOptionAddEvent, StzhDropdownOptionRemoveEvent, StzhDropdownOpenEvent, StzhDropdowCloseEvent, StzhDropdownFocusEvent, StzhDropdownBlurEvent, StzhDropdowInitEvent } from "../../index";
 import { StzhDropdownLocalizedText } from './stzh-dropdown.localization';
 /**
  * @slot label - Slot for label content
@@ -82,9 +82,17 @@ export declare class StzhDropdown {
   /** Current open state (readonly) */
   isOpen: boolean;
   /** Variant */
-  variant: "default" | "plain";
+  variant: "default" | "plain" | "filter";
   /** Size variant */
-  size: "default" | "small";
+  size: StzhDropdownSize;
+  /** Size variant (above small breakpoint) */
+  sizeSmall: StzhDropdownSize;
+  /** Size variant (above medium breakpoint) */
+  sizeMedium: StzhDropdownSize;
+  /** Size variant (above large breakpoint) */
+  sizeLarge: StzhDropdownSize;
+  /** Size variant (above ultra breakpoint) */
+  sizeUltra: StzhDropdownSize;
   /** Whether the dropdown is disabled */
   disabled: boolean;
   /** Popover placement */

package/dist/types/components/stzh-header/stzh-header.d.ts

@@ -1,8 +1,10 @@
 import { EventEmitter } from "../../stencil-public-runtime";
-import { StzhDropdownOption, StzhHeaderMetanavItemClickEvent, StzhHeaderLanguageChangeEvent, StzhHeaderSearchChangeEvent, StzhHeaderSearchChangedEvent, StzhHeaderMenuItem, StzhHeaderMetanavItem } from "../../index";
+import { StzhDropdownOption, StzhHeaderMetanavItemClickEvent, StzhHeaderLanguageChangeEvent, StzhHeaderSearchChangeEvent, StzhHeaderSearchChangedEvent, StzhHeaderMenuItem, StzhHeaderMetanavItem, StzhHeaderMenuItemClickEvent } from "../../index";
 import { StzhHeaderLocalizedText } from './stzh-header.localization';
 /**
  * @slot logo - Slot for brand logo
+ * @slot menu-before - Slot for custom elements before other menu elements
+ * @slot menu-after - Slot for custom elements after other menu elements
  * @slot metanav-before - Slot for custom elements before other metanav elements
  * @slot metanav-after - Slot for custom elements after other metanav elements
  */
@@ -48,7 +50,7 @@ export declare class StzhHeader {
   /** Search input value */
   searchValue: string;
   /** Sticky behaviour */
-  sticky: "default" | "disabled";
+  sticky: "default" | "disabled" | "always-full" | "always";
   /**
    * For Adobe Analytics.
    * Will be rendered as value of `s-object-id` attribute to the logo link element.
@@ -56,6 +58,7 @@ export declare class StzhHeader {
    */
   logoAnalyticsId: string;
   hideLogo: boolean;
+  headerHeight: number;
   paddingTop: number;
   stickyActive: boolean;
   flyoutOpen: boolean;
@@ -76,6 +79,8 @@ export declare class StzhHeader {
   scrollListener(): void;
   /** Metanav item click event */
   stzhMetanavItemClick: EventEmitter<StzhHeaderMetanavItemClickEvent>;
+  /** Metanav item click event */
+  stzhMenuItemClick: EventEmitter<StzhHeaderMenuItemClickEvent>;
   /** Language change event */
   stzhLanguageChange: EventEmitter<StzhHeaderLanguageChangeEvent>;
   /** Search input change event */
@@ -94,7 +99,6 @@ export declare class StzhHeader {
   private belowStayStickyPoint;
   private belowStartStickyPoint;
   private headerTop;
-  private headerHeight;
   private mainHeight;
   private metabarHeight;
   private logobarHeight;
@@ -111,7 +115,7 @@ export declare class StzhHeader {
   private lastOpener;
   private flyoutOpenedByMetanavItem;
   private trap;
-  private parentElement;
+  private _parentElement;
   private getSiblings;
   private disableSiblings;
   private enableSiblings;
@@ -127,6 +131,7 @@ export declare class StzhHeader {
   private handleBurgerClick;
   private handleBackdropClick;
   private handleMetanavItemClick;
+  private handleMenuItemClick;
   private handleSearchInput;
   private handleSearchChange;
   private handleLanguageClick;

package/dist/types/components/stzh-iframe/stzh-iframe.d.ts

@@ -9,6 +9,34 @@ import { StzhIframeLocalizedText } from "./stzh-iframe.localization";
 export declare class StzhIframe {
   /** Translation strings */
   localization: StzhIframeLocalizedText;
+  /** Id of iframe */
+  iframeId: string;
+  /** Error text of iframe if couldn't be loaded */
+  iframeErrorText: string;
+  /**
+   * Name of iframe
+   * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe?retiredLocale=de#name
+   */
+  name: string;
+  /**
+   * Sandbox of iframe
+   * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe?retiredLocale=de#sandbox
+   */
+  sandbox: string;
+  /**
+   * ReferrerPolicy of Iframe
+   * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe?retiredLocale=de#referrerpolicy
+   */
+  referrerpolicy: "no-referrer" | "no-referrer-when-downgrade" | "origin" | "origin-when-cross-origin" | "same-origin" | "strict-origin" | "strict-origin-when-cross-origin" | "unsafe-url";
+  /**
+   * Allow of Iframe
+   * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe?retiredLocale=de#allow
+   */
+  allow: string;
+  /** Width of iframe */
+  width: string;
+  /** Width of iframe */
+  height: string;
   /** `src` of iframe */
   src: string;
   private _src;
@@ -45,7 +73,7 @@ export declare class StzhIframe {
   stzhViewChange: EventEmitter<StzhIframeViewChangeEvent>;
   srcWatcher(newValue: string): void;
   viewWatcher(newValue: StzhIframeView): void;
-  private iframeId;
+  private internalId;
   private iframeElement;
   private previewButtonElement;
   private confirmButtonElement;

package/dist/types/components/stzh-link/stzh-link.d.ts

@@ -1,5 +1,5 @@
 import { EventEmitter } from "../../stencil-public-runtime";
-import { StzhLinkFocusEvent, StzhLinkBlurEvent, StzhLinkSize, StzhBadgeType } from "../../index";
+import { StzhLinkFocusEvent, StzhLinkBlurEvent, StzhLinkSize, StzhBadgeType, StzhLinkClickEvent } from "../../index";
 import { StzhLocaleComponent } from "../../utils/translation-utils";
 /**
  * @slot - Slot for text content
@@ -12,17 +12,17 @@ export declare class StzhLink {
   icon: string;
   /** Icon Position */
   iconPosition: "left" | "right";
-  /** Size variant */
-  size: StzhLinkSize;
   /** Height variant (none prevent setting min-height for mikro and small breakpoint) */
   height: "default" | "auto";
-  /** Size variant (abobe small breakpoint) */
+  /** Size variant */
+  size: StzhLinkSize;
+  /** Size variant (above small breakpoint) */
   sizeSmall: StzhLinkSize;
-  /** Size variant (abobe medium breakpoint) */
+  /** Size variant (above medium breakpoint) */
   sizeMedium: StzhLinkSize;
-  /** Size variant (abobe large breakpoint) */
+  /** Size variant (above large breakpoint) */
   sizeLarge: StzhLinkSize;
-  /** Size variant (abobe ultra breakpoint) */
+  /** Size variant (above ultra breakpoint) */
   sizeUltra: StzhLinkSize;
   /** href attribute of the link */
   href: string;
@@ -81,6 +81,8 @@ export declare class StzhLink {
    */
   analyticsId: string;
   element: HTMLStzhLinkElement;
+  /** Click event */
+  stzhClick: EventEmitter<StzhLinkClickEvent>;
   /** Focus event */
   stzhFocus: EventEmitter<StzhLinkFocusEvent>;
   /** Input blur event */
@@ -91,6 +93,7 @@ export declare class StzhLink {
   private onRootFocus;
   private onFocus;
   private onBlur;
+  private onClick;
   private renderIcon;
   private renderContent;
   private renderInner;

package/dist/types/components/stzh-menu-item/stzh-menu-item.d.ts

@@ -1,5 +1,5 @@
 import { EventEmitter } from "../../stencil-public-runtime";
-import { StzhMenuItemFocusEvent, StzhMenuItemBlurEvent, StzhBadgeType, StzhMenuSize, StzhMenuVariant } from "../../index";
+import { StzhMenuItemFocusEvent, StzhMenuItemBlurEvent, StzhMenuItemClickEvent, StzhBadgeType, StzhMenuSize, StzhMenuVariant } from "../../index";
 /**
  * @slot - Slot for any content
  * @slot icon - Slot for `stzh-icon` element
@@ -40,14 +40,17 @@ export declare class StzhMenuItem {
   element: HTMLStzhMenuItemElement;
   /** Focus event */
   stzhFocus: EventEmitter<StzhMenuItemFocusEvent>;
-  /** Input blur event */
+  /** Blur event */
   stzhBlur: EventEmitter<StzhMenuItemBlurEvent>;
+  /** Click event */
+  stzhClick: EventEmitter<StzhMenuItemClickEvent>;
   private menuItem;
   private text;
   private focusedByInput;
   private onRootFocus;
   private onFocus;
   private onBlur;
+  private onClick;
   componentDidRender(): void;
   private renderInner;
   render(): any;

package/dist/types/components/stzh-search/stzh-search.d.ts

@@ -13,6 +13,10 @@ export declare class StzhSearch {
   autofetchMainFilters: boolean;
   /** Whether search results should be automatically fetched when a aside filters has changed. */
   autofetchAsideFilters: boolean;
+  /** Whether to hide the main filters slot */
+  hideMainFilters: boolean;
+  /** Whether to hide the aside filters slot */
+  hideAsideFilters: boolean;
   /** API URL */
   api: string;
   /** Debounce time in ms */
@@ -35,17 +39,25 @@ export declare class StzhSearch {
   });
   /** Heading level of results heading */
   resultHeadingLevel: "1" | "2" | "3" | "4";
+  /** Empty text */
+  emptyText: string;
+  /** Empty link href */
+  emptyLinkHref: string;
+  /** Empty link label */
+  emptyLinkLabel: string;
   element: HTMLStzhSearchElement;
   totalCountWatcher(): void;
   preventUpdateUrlWatcher(): void;
   totalCount: number;
   private _showMoreLink;
   loading: boolean;
+  error: string;
   results: StzhSearchResult[];
   resultsHeading: string;
   hasRequiredParams: boolean;
   firstFetched: boolean;
   initiallyFetched: boolean;
+  isDetailsOpen: boolean;
   private currentController;
   private params;
   private formElement;
@@ -57,8 +69,11 @@ export declare class StzhSearch {
   private handleAsideFilterChange;
   private handleFormSubmit;
   private handleMoreClick;
+  private handleMediaChange;
   private handleFormReset;
   componentDidLoad(): Promise<void>;
   componentWillLoad(): Promise<void>;
+  connectedCallback(): void;
+  disconnectedCallback(): void;
   render(): any;
 }

package/dist/types/components/stzh-search/stzh-search.localization.d.ts

@@ -1,6 +1,6 @@
 import { StzhLocaleComponent } from "../../utils/translation-utils";
 export type StzhSearchLocalizedText = StzhLocaleComponent & {
   showMore: string;
-  noResults: string;
   moreFilter: string;
+  error: string;
 };