@oiz/stzh-components 2.2.0-beta → 2.3.0-alpha

package/dist/types/components.d.ts

@@ -5,7 +5,7 @@
  * It contains typing information for all components that exist in this project.
  */
 import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
-import { ContactaddressNumber, Font, Layout, OlmapLayer, ShareService, Space, StzhAccordionItemClosedEvent, StzhAccordionItemCloseEvent, StzhAccordionItemOpenedEvent, StzhAccordionItemOpenEvent, StzhActionsetItem, StzhActionsetItemClickEvent, StzhAnchornavItem, StzhAnchornavItemClickEvent, StzhAppointmentsChangeEvent, StzhAudioEndedEvent, StzhAudioEndEvent, StzhAudioErrorEvent, StzhAudioPauseEvent, StzhAudioPlayEvent, StzhAudioPlayingEvent, StzhAudioReplayEvent, StzhButtonBlurEvent, StzhButtonChangeEvent, StzhButtonFocusEvent, StzhCalendarChangeEvent, StzhCalendarDateDisabledPredicate, StzhCardClickEvent, StzhCardCollapseEvent, StzhCardHeaderAction, StzhCardHeaderActionClickEvent, StzhCardListCollapseAllEvent, StzhCardStarClickEvent, StzhCardSubtitleClickEvent, StzhCheckboxBlurEvent, StzhCheckboxChangeEvent, StzhCheckboxFocusEvent, StzhChipBlurEvent, StzhChipClickEvent, StzhChipFocusEvent, StzhChipRemoveEvent, StzhChipSelectChangeEvent, StzhChipSelectItem, StzhContactaddressAvailabilityItem, StzhDatalistDirectionChangeEvent, StzhDatalistHideBorderChangeEvent, StzhDatalistItemActionClickEvent, StzhDatalistItemEntry, StzhDatamessagelistItemActionClickEvent, StzhDatamessagelistItemClickEvent, StzhDatamessagelistItemEntryAction, StzhDatamessagelistItemEntryLoadingStatus, StzhDatamessagelistItemEntryMeta, StzhDatamessagelistItemEntryTag, StzhDatepickerChangeEvent, StzhDialogCloseEvent, StzhDialogOpenEvent, StzhDropdowCloseEvent, StzhDropdowInitEvent, StzhDropdownBlurEvent, StzhDropdownChangeEvent, StzhDropdownFocusEvent, StzhDropdownItemAddEvent, StzhDropdownItemRemoveEvent, StzhDropdownOpenEvent, StzhDropdownOptionAddEvent, StzhDropdownOptionRemoveEvent, StzhGhettoboxCloseEvent, StzhGhettoboxOpenEvent, StzhInputBlurEvent, StzhInputChangeEvent, StzhInputFocusEvent, StzhLangnavChangeEvent, StzhLinkBlurEvent, StzhLinkFocusEvent, StzhMenuItemBlurEvent, StzhMenuItemFocusEvent, StzhMessageCloseEvent, StzhMessageOpenEvent, StzhMicrositeTeaserlistTag, StzhOlmapInitializedEvent, StzhOlmapMoveEndEvent, StzhOlmapMoveStartEvent, StzhOlmapPostRenderEvent, StzhOverlayCloseEvent, StzhOverlayOpenEvent, StzhPopoverClosedEvent, StzhPopoverCloseEvent, StzhPopoverOpenedEvent, StzhPopoverOpenEvent, StzhProgressbarDataItem, StzhProgressbarItemClickEvent, StzhProgressbarItemDottedClickEvent, StzhRadioBlurEvent, StzhRadioChangeEvent, StzhRadioFocusEvent, StzhSortableDisableEvent, StzhSortableUpdateEvent, StzhStickyStuckBottomEvent, StzhStickyStuckTopEvent, StzhToggleBlurEvent, StzhToggleChangeEvent, StzhToggleFocusEvent, StzhTooltipClosedEvent, StzhTooltipCloseEvent, StzhTooltipOpenedEvent, StzhTooltipOpenEvent, StzhUploadCanceledEvent, StzhUploadCanceledMultipleEvent, StzhUploadCompleteEvent, StzhUploadCompleteMultipleEvent, StzhUploadErrorEvent, StzhUploadErrorMultipleEvent, StzhUploadFileAddedEvent, StzhUploadFileRemovedEvent, StzhUploadFilesAddedEvent, StzhUploadFilesItem, StzhUploadProcessingEvent, StzhUploadProcessingMultipleEvent, StzhUploadProgressEvent, StzhUploadProgressTotalEvent, StzhUploadSendingEvent, StzhUploadSendingMultipleEvent, StzhUploadSuccessEvent, StzhUploadSuccessMultipleEvent, StzhVbzLinechipBlurEvent, StzhVbzLinechipFocusEvent, StzhVbzMajortickerDisturbance, StzhVbzMajortickerDisturbanceFetchedEvent, VBZ } from "./index";
+import { ContactNumber, Font, Layout, OlmapLayer, ShareService, Space, StzhAccordionItemClosedEvent, StzhAccordionItemCloseEvent, StzhAccordionItemOpenedEvent, StzhAccordionItemOpenEvent, StzhActionsetItem, StzhActionsetItemClickEvent, StzhAnchornavItem, StzhAnchornavItemClickEvent, StzhAppointmentsChangeEvent, StzhAudioEndedEvent, StzhAudioEndEvent, StzhAudioErrorEvent, StzhAudioPauseEvent, StzhAudioPlayEvent, StzhAudioPlayingEvent, StzhAudioReplayEvent, StzhButtonBlurEvent, StzhButtonChangeEvent, StzhButtonFocusEvent, StzhCalendarChangeEvent, StzhCalendarDateDisabledPredicate, StzhCardClickEvent, StzhCardCollapseEvent, StzhCardHeaderAction, StzhCardHeaderActionClickEvent, StzhCardListCollapseAllEvent, StzhCardStarClickEvent, StzhCardSubtitleClickEvent, StzhCheckboxBlurEvent, StzhCheckboxChangeEvent, StzhCheckboxFocusEvent, StzhChipBlurEvent, StzhChipClickEvent, StzhChipFocusEvent, StzhChipRemoveEvent, StzhChipSelectChangeEvent, StzhChipSelectItem, StzhContactAvailabilityItem, StzhDatalistDirectionChangeEvent, StzhDatalistHideBorderChangeEvent, StzhDatalistItemActionClickEvent, StzhDatalistItemEntry, StzhDatamessagelistItemActionClickEvent, StzhDatamessagelistItemClickEvent, StzhDatamessagelistItemEntryAction, StzhDatamessagelistItemEntryLoadingStatus, StzhDatamessagelistItemEntryMeta, StzhDatamessagelistItemEntryTag, StzhDatepickerChangeEvent, StzhDialogCloseEvent, StzhDialogOpenEvent, StzhDropdowCloseEvent, StzhDropdowInitEvent, StzhDropdownBlurEvent, StzhDropdownChangeEvent, StzhDropdownFocusEvent, StzhDropdownItemAddEvent, StzhDropdownItemRemoveEvent, StzhDropdownOpenEvent, StzhDropdownOptionAddEvent, StzhDropdownOptionRemoveEvent, StzhGhettoboxCloseEvent, StzhGhettoboxOpenEvent, StzhInputBlurEvent, StzhInputChangeEvent, StzhInputFocusEvent, StzhLangnavChangeEvent, StzhLinkBlurEvent, StzhLinkFocusEvent, StzhMenuItemBlurEvent, StzhMenuItemFocusEvent, StzhMessageCloseEvent, StzhMessageOpenEvent, StzhMicrositeTeaserlistTag, StzhOlmapInitializedEvent, StzhOlmapMoveEndEvent, StzhOlmapMoveStartEvent, StzhOlmapPostRenderEvent, StzhOverlayCloseEvent, StzhOverlayOpenEvent, StzhPopoverClosedEvent, StzhPopoverCloseEvent, StzhPopoverOpenedEvent, StzhPopoverOpenEvent, StzhProgressbarDataItem, StzhProgressbarItemClickEvent, StzhProgressbarItemDottedClickEvent, StzhRadioBlurEvent, StzhRadioChangeEvent, StzhRadioFocusEvent, StzhSortableDisableEvent, StzhSortableUpdateEvent, StzhStickyStuckBottomEvent, StzhStickyStuckTopEvent, StzhToggleBlurEvent, StzhToggleChangeEvent, StzhToggleFocusEvent, StzhTooltipClosedEvent, StzhTooltipCloseEvent, StzhTooltipOpenedEvent, StzhTooltipOpenEvent, StzhUploadCanceledEvent, StzhUploadCanceledMultipleEvent, StzhUploadCompleteEvent, StzhUploadCompleteMultipleEvent, StzhUploadErrorEvent, StzhUploadErrorMultipleEvent, StzhUploadFileAddedEvent, StzhUploadFileRemovedEvent, StzhUploadFilesAddedEvent, StzhUploadFilesItem, StzhUploadProcessingEvent, StzhUploadProcessingMultipleEvent, StzhUploadProgressEvent, StzhUploadProgressTotalEvent, StzhUploadSendingEvent, StzhUploadSendingMultipleEvent, StzhUploadSuccessEvent, StzhUploadSuccessMultipleEvent, StzhVbzLinechipBlurEvent, StzhVbzLinechipFocusEvent, StzhVbzMajortickerDisturbance, StzhVbzMajortickerDisturbanceFetchedEvent, VBZ } from "./index";
 import { StzhActionsetLocalizedText } from "./components/stzh-actionset/stzh-actionset.localization";
 import { Placement } from "@floating-ui/dom";
 import { StzhAppointmentsLocalizedText } from "./components/stzh-appointments/stzh-appointments.localization";
@@ -498,6 +498,10 @@ export namespace Components {
           * The value of the input element (if card is selectable)
          */
         "value": string;
+        /**
+          * Whether card arrow is shown in footer area
+         */
+        "withArrow": boolean;
     }
     interface StzhCardList {
         /**
@@ -680,13 +684,17 @@ export namespace Components {
     }
     interface StzhChip {
         /**
-          * Id for element which describes the button
+          * Id for element which describes the link/button
          */
         "a11yDescribedby": string;
         /**
           * Accessible label for screen readers to replace visible text
          */
         "a11yLabel": string;
+        /**
+          * Tabindex of link/button
+         */
+        "a11yTabindex": string;
         /**
           * Active
          */
@@ -711,6 +719,10 @@ export namespace Components {
           * Label
          */
         "label": string;
+        /**
+          * Whether chip is not interactive
+         */
+        "nonInteractive": boolean;
         /**
           * Whether remove button should be shown
          */
@@ -812,11 +824,11 @@ export namespace Components {
          */
         "linesUltra": number;
     }
-    interface StzhContactaddress {
+    interface StzhContact {
         /**
           * Availability times
          */
-        "availability": string | StzhContactaddressAvailabilityItem[];
+        "availability": string | StzhContactAvailabilityItem[];
         /**
           * Availability title
          */
@@ -840,7 +852,7 @@ export namespace Components {
         /**
           * Numbers Array of objects that can include the attributes `type` = `tel`|`fax`, `label` and `number`.
          */
-        "numbers": ContactaddressNumber[] | string;
+        "numbers": ContactNumber[] | string;
         /**
           * Post office box heading
          */
@@ -879,6 +891,10 @@ export namespace Components {
         "withBorder": boolean;
     }
     interface StzhContainer {
+        /**
+          * Whether color should be inverted
+         */
+        "inverted": boolean;
     }
     interface StzhCspace {
     }
@@ -907,6 +923,10 @@ export namespace Components {
           * Direction above ultra breakpoint
          */
         "directionUltra": "vertical" | "horizontal" | "inherit";
+        /**
+          * Whether to disable min-width of datalist item
+         */
+        "disableMinWidth": boolean;
         /**
           * Hide border lines between items
          */
@@ -1015,6 +1035,10 @@ export namespace Components {
           * Columns
          */
         "columns": any[] | string;
+        /**
+          * Whether to disable min-width of table
+         */
+        "disableMinWidth": boolean;
         /**
           * ID field
          */
@@ -1145,6 +1169,9 @@ export namespace Components {
         "show": () => Promise<void>;
         "toggle": () => Promise<void>;
     }
+    /**
+     * @prop --width: Width of dialog
+     */
     interface StzhDialog {
         /**
           * Accessible label for dialog (use if no heading is used)
@@ -1394,7 +1421,16 @@ export namespace Components {
           * Copyright
          */
         "copyright": string;
+        /**
+          * Whether to stretch slotted content to fullwidth
+         */
+        "fullwidth": boolean;
     }
+    /**
+     * Flyingfocus component.
+     * Inpsired by: https://github.com/Q42/floating-focus-a11y
+     * https://engineering.q42.nl/floating-focus/
+     */
     interface StzhFlyingfocus {
         "reposition": () => Promise<void>;
     }
@@ -1420,6 +1456,9 @@ export namespace Components {
          */
         "withBorder": boolean;
     }
+    /**
+     * @prop --background-color: Set background and button text hover color
+     */
     interface StzhGhettobox {
         /**
           * Name of cookie to compare its value with set `publishDate` to determine if ghettobox was already closed before by the user. If empty (""), no check is done and ghettobox will always be shown again after a refresh. Cookie name will be prefixed with `stzh-components-ghettobox-close-time`.
@@ -1498,11 +1537,15 @@ export namespace Components {
         /**
           * Add border
          */
-        "border": "none" | "left" | "right";
+        "border": "none" | "left" | "right" | "left-right";
         /**
           * Type of curve
          */
         "curve": Space.Curves;
+        /**
+          * Control how cells items are positioned along a container's cross axis
+         */
+        "items": Layout.Items;
         /**
           * Alignment
          */
@@ -1654,6 +1697,8 @@ export namespace Components {
          */
         "value": string;
     }
+    interface StzhInvert {
+    }
     interface StzhLangnav {
         /**
           * Active language of langnav
@@ -1888,6 +1933,10 @@ export namespace Components {
     }
     interface StzhMetanav {
     }
+    /**
+     * @see https://www.stadt-zuerich.ch/site/fuer-zueri/de/index.html
+     * @see https://www.stadt-zuerich.ch/site/iazh/de/index.html
+     */
     interface StzhMicrositeTeaserlist {
         /**
           * API URL (`{lang}` is replaced in the URL)
@@ -2044,6 +2093,9 @@ export namespace Components {
          */
         "subtitle": string;
     }
+    /**
+     * @prop --min-width: Minimum width of popover above small breakpoint
+     */
     interface StzhPopover {
         /**
           * Distance from popover content to trigger. "8" when default variant, "16" when tooltip variant (arrow height + 8px).
@@ -2095,7 +2147,7 @@ export namespace Components {
     }
     interface StzhProgressbar {
         /**
-          * Step data (JSON array with objects that have `label` attribute and optional `icon`, if icon instead of step number should be displayed):  ``` {   "label": "Step Label"   "icon": "clock" } ```
+          * Step data (JSON array with objects that have `label` attribute and optional: - `disabled`, if step should be disabled - `icon`, if icon instead of step number should be displayed):  ``` {   "label": "Step Label"   "icon": "clock",   "disabled": true } ```
          */
         "data": StzhProgressbarDataItem[] | string;
         /**
@@ -2125,6 +2177,7 @@ export namespace Components {
     }
     interface StzhProgressbarItem {
         "current": boolean;
+        "disabled": boolean;
         "dotted": boolean;
         "first": boolean;
         "hide": boolean;
@@ -2253,6 +2306,20 @@ export namespace Components {
          */
         "value": string;
     }
+    interface StzhRatio {
+        /**
+          * Fit mode
+         */
+        "fit": "cover" | "contain";
+        /**
+          * Whether aspect ratio is in portrait mode
+         */
+        "portrait": boolean;
+        /**
+          * Available aspect ratios
+         */
+        "ratio": "16:9" | "1:1" | "5:4" | "4:3" | "3:2" | "2:1" | "21:9";
+    }
     interface StzhReadspeaker {
         /**
           * RS event ID
@@ -2357,6 +2424,32 @@ export namespace Components {
          */
         "url": string;
     }
+    interface StzhShow {
+        /**
+          * Hide from date
+         */
+        "hideFromDate": Date | string;
+        /**
+          * Large
+         */
+        "large": boolean;
+        /**
+          * Medium
+         */
+        "medium": boolean;
+        /**
+          * Mikro
+         */
+        "mikro": boolean;
+        /**
+          * Small
+         */
+        "small": boolean;
+        /**
+          * Ultra
+         */
+        "ultra": boolean;
+    }
     interface StzhSitemap {
         /**
           * Items in sitemap Array of objects that must at least include `value` attribute. Can optionally contain `label`, `meta`, `icon`, `href` attribute and be nested to display deeper levels: `[{"value":"Value 1", "label": "Label 1"}, {"value":"Value 2", "label": "Label 2", "items": [...]}]`
@@ -2415,6 +2508,48 @@ export namespace Components {
          */
         "toArray": () => Promise<string[]>;
     }
+    interface StzhSpace {
+        /**
+          * Apply spacing to slotted elements
+         */
+        "around": boolean;
+        /**
+          * Add border
+         */
+        "border": "none" | "top" | "bottom" | "left" | "right" | "left-right" | "top-bottom";
+        /**
+          * Type of curve
+         */
+        "curve": Space.Curves;
+        /**
+          * Control how cells items are positioned along a container's cross axis
+         */
+        "items": Layout.Items;
+        /**
+          * Alignment
+         */
+        "justify": Layout.Justify;
+        /**
+          * Type of size
+         */
+        "size": Space.Sizes;
+        /**
+          * Type of size above large breakpoint
+         */
+        "sizeLarge": Space.Sizes;
+        /**
+          * Type of size above medium breakpoint
+         */
+        "sizeMedium": Space.Sizes;
+        /**
+          * Type of size above small breakpoint
+         */
+        "sizeSmall": Space.Sizes;
+        /**
+          * Type of size above ultra breakpoint
+         */
+        "sizeUltra": Space.Sizes;
+    }
     interface StzhStatus {
         /**
           * Label
@@ -2434,6 +2569,10 @@ export namespace Components {
         "withLoadingbar": boolean;
     }
     interface StzhSticky {
+        /**
+          * Whether to breakout container
+         */
+        "breakout": boolean;
         /**
           * Whether to disable sticking to bottom
          */
@@ -2443,7 +2582,16 @@ export namespace Components {
          */
         "disableStickyTop": boolean;
     }
+    /**
+     * @prop --max-height: Maximum height of table
+     * @prop --min-width: Minium width of table
+     * @prop --cell-padding: Cells padding
+     */
     interface StzhTable {
+        /**
+          * Whether to disable min-width of table
+         */
+        "disableMinWidth": boolean;
         /**
           * Columns that should be sticky on the left side (column indexes separated by comma)
          */
@@ -2492,6 +2640,10 @@ export namespace Components {
           * Whether to float left content
          */
         "floating": boolean;
+        /**
+          * Whether display columns fullwidth on every breakpoint (not just mobile)
+         */
+        "fullwidth": boolean;
         /**
           * Size variant
          */
@@ -2825,11 +2977,15 @@ export namespace Components {
         /**
           * Add border
          */
-        "border": "none" | "top" | "bottom";
+        "border": "none" | "top" | "bottom" | "top-bottom";
         /**
           * Type of curve
          */
         "curve": Space.Curves;
+        /**
+          * Control how cells items are positioned along a container's cross axis
+         */
+        "items": Layout.Items;
         /**
           * Alignment
          */
@@ -3125,11 +3281,11 @@ declare global {
         prototype: HTMLStzhClampElement;
         new (): HTMLStzhClampElement;
     };
-    interface HTMLStzhContactaddressElement extends Components.StzhContactaddress, HTMLStencilElement {
+    interface HTMLStzhContactElement extends Components.StzhContact, HTMLStencilElement {
     }
-    var HTMLStzhContactaddressElement: {
-        prototype: HTMLStzhContactaddressElement;
-        new (): HTMLStzhContactaddressElement;
+    var HTMLStzhContactElement: {
+        prototype: HTMLStzhContactElement;
+        new (): HTMLStzhContactElement;
     };
     interface HTMLStzhContainerElement extends Components.StzhContainer, HTMLStencilElement {
     }
@@ -3185,6 +3341,9 @@ declare global {
         prototype: HTMLStzhDetailsElement;
         new (): HTMLStzhDetailsElement;
     };
+    /**
+     * @prop --width: Width of dialog
+     */
     interface HTMLStzhDialogElement extends Components.StzhDialog, HTMLStencilElement {
     }
     var HTMLStzhDialogElement: {
@@ -3209,6 +3368,11 @@ declare global {
         prototype: HTMLStzhFigureElement;
         new (): HTMLStzhFigureElement;
     };
+    /**
+     * Flyingfocus component.
+     * Inpsired by: https://github.com/Q42/floating-focus-a11y
+     * https://engineering.q42.nl/floating-focus/
+     */
     interface HTMLStzhFlyingfocusElement extends Components.StzhFlyingfocus, HTMLStencilElement {
     }
     var HTMLStzhFlyingfocusElement: {
@@ -3221,6 +3385,9 @@ declare global {
         prototype: HTMLStzhFooterElement;
         new (): HTMLStzhFooterElement;
     };
+    /**
+     * @prop --background-color: Set background and button text hover color
+     */
     interface HTMLStzhGhettoboxElement extends Components.StzhGhettobox, HTMLStencilElement {
     }
     var HTMLStzhGhettoboxElement: {
@@ -3269,6 +3436,12 @@ declare global {
         prototype: HTMLStzhInputElement;
         new (): HTMLStzhInputElement;
     };
+    interface HTMLStzhInvertElement extends Components.StzhInvert, HTMLStencilElement {
+    }
+    var HTMLStzhInvertElement: {
+        prototype: HTMLStzhInvertElement;
+        new (): HTMLStzhInvertElement;
+    };
     interface HTMLStzhLangnavElement extends Components.StzhLangnav, HTMLStencilElement {
     }
     var HTMLStzhLangnavElement: {
@@ -3329,6 +3502,10 @@ declare global {
         prototype: HTMLStzhMetanavElement;
         new (): HTMLStzhMetanavElement;
     };
+    /**
+     * @see https://www.stadt-zuerich.ch/site/fuer-zueri/de/index.html
+     * @see https://www.stadt-zuerich.ch/site/iazh/de/index.html
+     */
     interface HTMLStzhMicrositeTeaserlistElement extends Components.StzhMicrositeTeaserlist, HTMLStencilElement {
     }
     var HTMLStzhMicrositeTeaserlistElement: {
@@ -3371,6 +3548,9 @@ declare global {
         prototype: HTMLStzhPagetitleHeroElement;
         new (): HTMLStzhPagetitleHeroElement;
     };
+    /**
+     * @prop --min-width: Minimum width of popover above small breakpoint
+     */
     interface HTMLStzhPopoverElement extends Components.StzhPopover, HTMLStencilElement {
     }
     var HTMLStzhPopoverElement: {
@@ -3407,6 +3587,12 @@ declare global {
         prototype: HTMLStzhRadiogroupElement;
         new (): HTMLStzhRadiogroupElement;
     };
+    interface HTMLStzhRatioElement extends Components.StzhRatio, HTMLStencilElement {
+    }
+    var HTMLStzhRatioElement: {
+        prototype: HTMLStzhRatioElement;
+        new (): HTMLStzhRatioElement;
+    };
     interface HTMLStzhReadspeakerElement extends Components.StzhReadspeaker, HTMLStencilElement {
     }
     var HTMLStzhReadspeakerElement: {
@@ -3443,6 +3629,12 @@ declare global {
         prototype: HTMLStzhShareElement;
         new (): HTMLStzhShareElement;
     };
+    interface HTMLStzhShowElement extends Components.StzhShow, HTMLStencilElement {
+    }
+    var HTMLStzhShowElement: {
+        prototype: HTMLStzhShowElement;
+        new (): HTMLStzhShowElement;
+    };
     interface HTMLStzhSitemapElement extends Components.StzhSitemap, HTMLStencilElement {
     }
     var HTMLStzhSitemapElement: {
@@ -3461,6 +3653,12 @@ declare global {
         prototype: HTMLStzhSortableElement;
         new (): HTMLStzhSortableElement;
     };
+    interface HTMLStzhSpaceElement extends Components.StzhSpace, HTMLStencilElement {
+    }
+    var HTMLStzhSpaceElement: {
+        prototype: HTMLStzhSpaceElement;
+        new (): HTMLStzhSpaceElement;
+    };
     interface HTMLStzhStatusElement extends Components.StzhStatus, HTMLStencilElement {
     }
     var HTMLStzhStatusElement: {
@@ -3473,6 +3671,11 @@ declare global {
         prototype: HTMLStzhStickyElement;
         new (): HTMLStzhStickyElement;
     };
+    /**
+     * @prop --max-height: Maximum height of table
+     * @prop --min-width: Minium width of table
+     * @prop --cell-padding: Cells padding
+     */
     interface HTMLStzhTableElement extends Components.StzhTable, HTMLStencilElement {
     }
     var HTMLStzhTableElement: {
@@ -3560,7 +3763,7 @@ declare global {
         "stzh-chip": HTMLStzhChipElement;
         "stzh-chip-select": HTMLStzhChipSelectElement;
         "stzh-clamp": HTMLStzhClampElement;
-        "stzh-contactaddress": HTMLStzhContactaddressElement;
+        "stzh-contact": HTMLStzhContactElement;
         "stzh-container": HTMLStzhContainerElement;
         "stzh-cspace": HTMLStzhCspaceElement;
         "stzh-datalist": HTMLStzhDatalistElement;
@@ -3584,6 +3787,7 @@ declare global {
         "stzh-icon": HTMLStzhIconElement;
         "stzh-icon-sprite": HTMLStzhIconSpriteElement;
         "stzh-input": HTMLStzhInputElement;
+        "stzh-invert": HTMLStzhInvertElement;
         "stzh-langnav": HTMLStzhLangnavElement;
         "stzh-link": HTMLStzhLinkElement;
         "stzh-list": HTMLStzhListElement;
@@ -3607,15 +3811,18 @@ declare global {
         "stzh-progressbar-item": HTMLStzhProgressbarItemElement;
         "stzh-radio": HTMLStzhRadioElement;
         "stzh-radiogroup": HTMLStzhRadiogroupElement;
+        "stzh-ratio": HTMLStzhRatioElement;
         "stzh-readspeaker": HTMLStzhReadspeakerElement;
         "stzh-richtext": HTMLStzhRichtextElement;
         "stzh-row": HTMLStzhRowElement;
         "stzh-saptcha": HTMLStzhSaptchaElement;
         "stzh-section": HTMLStzhSectionElement;
         "stzh-share": HTMLStzhShareElement;
+        "stzh-show": HTMLStzhShowElement;
         "stzh-sitemap": HTMLStzhSitemapElement;
         "stzh-skiplink": HTMLStzhSkiplinkElement;
         "stzh-sortable": HTMLStzhSortableElement;
+        "stzh-space": HTMLStzhSpaceElement;
         "stzh-status": HTMLStzhStatusElement;
         "stzh-sticky": HTMLStzhStickyElement;
         "stzh-table": HTMLStzhTableElement;
@@ -4153,6 +4360,10 @@ declare namespace LocalJSX {
           * The value of the input element (if card is selectable)
          */
         "value"?: string;
+        /**
+          * Whether card arrow is shown in footer area
+         */
+        "withArrow"?: boolean;
     }
     interface StzhCardList {
         /**
@@ -4347,13 +4558,17 @@ declare namespace LocalJSX {
     }
     interface StzhChip {
         /**
-          * Id for element which describes the button
+          * Id for element which describes the link/button
          */
         "a11yDescribedby"?: string;
         /**
           * Accessible label for screen readers to replace visible text
          */
         "a11yLabel"?: string;
+        /**
+          * Tabindex of link/button
+         */
+        "a11yTabindex"?: string;
         /**
           * Active
          */
@@ -4378,6 +4593,10 @@ declare namespace LocalJSX {
           * Label
          */
         "label"?: string;
+        /**
+          * Whether chip is not interactive
+         */
+        "nonInteractive"?: boolean;
         /**
           * Input blur event
          */
@@ -4495,11 +4714,11 @@ declare namespace LocalJSX {
          */
         "linesUltra"?: number;
     }
-    interface StzhContactaddress {
+    interface StzhContact {
         /**
           * Availability times
          */
-        "availability"?: string | StzhContactaddressAvailabilityItem[];
+        "availability"?: string | StzhContactAvailabilityItem[];
         /**
           * Availability title
          */
@@ -4523,7 +4742,7 @@ declare namespace LocalJSX {
         /**
           * Numbers Array of objects that can include the attributes `type` = `tel`|`fax`, `label` and `number`.
          */
-        "numbers"?: ContactaddressNumber[] | string;
+        "numbers"?: ContactNumber[] | string;
         /**
           * Post office box heading
          */
@@ -4562,6 +4781,10 @@ declare namespace LocalJSX {
         "withBorder"?: boolean;
     }
     interface StzhContainer {
+        /**
+          * Whether color should be inverted
+         */
+        "inverted"?: boolean;
     }
     interface StzhCspace {
     }
@@ -4590,6 +4813,10 @@ declare namespace LocalJSX {
           * Direction above ultra breakpoint
          */
         "directionUltra"?: "vertical" | "horizontal" | "inherit";
+        /**
+          * Whether to disable min-width of datalist item
+         */
+        "disableMinWidth"?: boolean;
         /**
           * Hide border lines between items
          */
@@ -4718,6 +4945,10 @@ declare namespace LocalJSX {
           * Columns
          */
         "columns"?: any[] | string;
+        /**
+          * Whether to disable min-width of table
+         */
+        "disableMinWidth"?: boolean;
         /**
           * ID field
          */
@@ -4847,6 +5078,9 @@ declare namespace LocalJSX {
          */
         "open"?: boolean;
     }
+    /**
+     * @prop --width: Width of dialog
+     */
     interface StzhDialog {
         /**
           * Accessible label for dialog (use if no heading is used)
@@ -5118,7 +5352,16 @@ declare namespace LocalJSX {
           * Copyright
          */
         "copyright"?: string;
+        /**
+          * Whether to stretch slotted content to fullwidth
+         */
+        "fullwidth"?: boolean;
     }
+    /**
+     * Flyingfocus component.
+     * Inpsired by: https://github.com/Q42/floating-focus-a11y
+     * https://engineering.q42.nl/floating-focus/
+     */
     interface StzhFlyingfocus {
     }
     interface StzhFooter {
@@ -5143,6 +5386,9 @@ declare namespace LocalJSX {
          */
         "withBorder"?: boolean;
     }
+    /**
+     * @prop --background-color: Set background and button text hover color
+     */
     interface StzhGhettobox {
         /**
           * Name of cookie to compare its value with set `publishDate` to determine if ghettobox was already closed before by the user. If empty (""), no check is done and ghettobox will always be shown again after a refresh. Cookie name will be prefixed with `stzh-components-ghettobox-close-time`.
@@ -5223,11 +5469,15 @@ declare namespace LocalJSX {
         /**
           * Add border
          */
-        "border"?: "none" | "left" | "right";
+        "border"?: "none" | "left" | "right" | "left-right";
         /**
           * Type of curve
          */
         "curve"?: Space.Curves;
+        /**
+          * Control how cells items are positioned along a container's cross axis
+         */
+        "items"?: Layout.Items;
         /**
           * Alignment
          */
@@ -5387,6 +5637,8 @@ declare namespace LocalJSX {
          */
         "value"?: string;
     }
+    interface StzhInvert {
+    }
     interface StzhLangnav {
         /**
           * Active language of langnav
@@ -5639,6 +5891,10 @@ declare namespace LocalJSX {
     }
     interface StzhMetanav {
     }
+    /**
+     * @see https://www.stadt-zuerich.ch/site/fuer-zueri/de/index.html
+     * @see https://www.stadt-zuerich.ch/site/iazh/de/index.html
+     */
     interface StzhMicrositeTeaserlist {
         /**
           * API URL (`{lang}` is replaced in the URL)
@@ -5789,6 +6045,9 @@ declare namespace LocalJSX {
          */
         "subtitle"?: string;
     }
+    /**
+     * @prop --min-width: Minimum width of popover above small breakpoint
+     */
     interface StzhPopover {
         /**
           * Distance from popover content to trigger. "8" when default variant, "16" when tooltip variant (arrow height + 8px).
@@ -5843,7 +6102,7 @@ declare namespace LocalJSX {
     }
     interface StzhProgressbar {
         /**
-          * Step data (JSON array with objects that have `label` attribute and optional `icon`, if icon instead of step number should be displayed):  ``` {   "label": "Step Label"   "icon": "clock" } ```
+          * Step data (JSON array with objects that have `label` attribute and optional: - `disabled`, if step should be disabled - `icon`, if icon instead of step number should be displayed):  ``` {   "label": "Step Label"   "icon": "clock",   "disabled": true } ```
          */
         "data"?: StzhProgressbarDataItem[] | string;
         /**
@@ -5873,6 +6132,7 @@ declare namespace LocalJSX {
     }
     interface StzhProgressbarItem {
         "current"?: boolean;
+        "disabled"?: boolean;
         "dotted"?: boolean;
         "first"?: boolean;
         "hide"?: boolean;
@@ -6017,6 +6277,20 @@ declare namespace LocalJSX {
          */
         "value"?: string;
     }
+    interface StzhRatio {
+        /**
+          * Fit mode
+         */
+        "fit"?: "cover" | "contain";
+        /**
+          * Whether aspect ratio is in portrait mode
+         */
+        "portrait"?: boolean;
+        /**
+          * Available aspect ratios
+         */
+        "ratio"?: "16:9" | "1:1" | "5:4" | "4:3" | "3:2" | "2:1" | "21:9";
+    }
     interface StzhReadspeaker {
         /**
           * RS event ID
@@ -6121,6 +6395,32 @@ declare namespace LocalJSX {
          */
         "url"?: string;
     }
+    interface StzhShow {
+        /**
+          * Hide from date
+         */
+        "hideFromDate"?: Date | string;
+        /**
+          * Large
+         */
+        "large"?: boolean;
+        /**
+          * Medium
+         */
+        "medium"?: boolean;
+        /**
+          * Mikro
+         */
+        "mikro"?: boolean;
+        /**
+          * Small
+         */
+        "small"?: boolean;
+        /**
+          * Ultra
+         */
+        "ultra"?: boolean;
+    }
     interface StzhSitemap {
         /**
           * Items in sitemap Array of objects that must at least include `value` attribute. Can optionally contain `label`, `meta`, `icon`, `href` attribute and be nested to display deeper levels: `[{"value":"Value 1", "label": "Label 1"}, {"value":"Value 2", "label": "Label 2", "items": [...]}]`
@@ -6175,6 +6475,48 @@ declare namespace LocalJSX {
          */
         "onStzhUpdate"?: (event: StzhSortableCustomEvent<StzhSortableUpdateEvent>) => void;
     }
+    interface StzhSpace {
+        /**
+          * Apply spacing to slotted elements
+         */
+        "around"?: boolean;
+        /**
+          * Add border
+         */
+        "border"?: "none" | "top" | "bottom" | "left" | "right" | "left-right" | "top-bottom";
+        /**
+          * Type of curve
+         */
+        "curve"?: Space.Curves;
+        /**
+          * Control how cells items are positioned along a container's cross axis
+         */
+        "items"?: Layout.Items;
+        /**
+          * Alignment
+         */
+        "justify"?: Layout.Justify;
+        /**
+          * Type of size
+         */
+        "size"?: Space.Sizes;
+        /**
+          * Type of size above large breakpoint
+         */
+        "sizeLarge"?: Space.Sizes;
+        /**
+          * Type of size above medium breakpoint
+         */
+        "sizeMedium"?: Space.Sizes;
+        /**
+          * Type of size above small breakpoint
+         */
+        "sizeSmall"?: Space.Sizes;
+        /**
+          * Type of size above ultra breakpoint
+         */
+        "sizeUltra"?: Space.Sizes;
+    }
     interface StzhStatus {
         /**
           * Label
@@ -6194,6 +6536,10 @@ declare namespace LocalJSX {
         "withLoadingbar"?: boolean;
     }
     interface StzhSticky {
+        /**
+          * Whether to breakout container
+         */
+        "breakout"?: boolean;
         /**
           * Whether to disable sticking to bottom
          */
@@ -6211,7 +6557,16 @@ declare namespace LocalJSX {
          */
         "onStzhStuckTop"?: (event: StzhStickyCustomEvent<StzhStickyStuckTopEvent>) => void;
     }
+    /**
+     * @prop --max-height: Maximum height of table
+     * @prop --min-width: Minium width of table
+     * @prop --cell-padding: Cells padding
+     */
     interface StzhTable {
+        /**
+          * Whether to disable min-width of table
+         */
+        "disableMinWidth"?: boolean;
         /**
           * Columns that should be sticky on the left side (column indexes separated by comma)
          */
@@ -6260,6 +6615,10 @@ declare namespace LocalJSX {
           * Whether to float left content
          */
         "floating"?: boolean;
+        /**
+          * Whether display columns fullwidth on every breakpoint (not just mobile)
+         */
+        "fullwidth"?: boolean;
         /**
           * Size variant
          */
@@ -6671,11 +7030,15 @@ declare namespace LocalJSX {
         /**
           * Add border
          */
-        "border"?: "none" | "top" | "bottom";
+        "border"?: "none" | "top" | "bottom" | "top-bottom";
         /**
           * Type of curve
          */
         "curve"?: Space.Curves;
+        /**
+          * Control how cells items are positioned along a container's cross axis
+         */
+        "items"?: Layout.Items;
         /**
           * Alignment
          */
@@ -6722,7 +7085,7 @@ declare namespace LocalJSX {
         "stzh-chip": StzhChip;
         "stzh-chip-select": StzhChipSelect;
         "stzh-clamp": StzhClamp;
-        "stzh-contactaddress": StzhContactaddress;
+        "stzh-contact": StzhContact;
         "stzh-container": StzhContainer;
         "stzh-cspace": StzhCspace;
         "stzh-datalist": StzhDatalist;
@@ -6746,6 +7109,7 @@ declare namespace LocalJSX {
         "stzh-icon": StzhIcon;
         "stzh-icon-sprite": StzhIconSprite;
         "stzh-input": StzhInput;
+        "stzh-invert": StzhInvert;
         "stzh-langnav": StzhLangnav;
         "stzh-link": StzhLink;
         "stzh-list": StzhList;
@@ -6769,15 +7133,18 @@ declare namespace LocalJSX {
         "stzh-progressbar-item": StzhProgressbarItem;
         "stzh-radio": StzhRadio;
         "stzh-radiogroup": StzhRadiogroup;
+        "stzh-ratio": StzhRatio;
         "stzh-readspeaker": StzhReadspeaker;
         "stzh-richtext": StzhRichtext;
         "stzh-row": StzhRow;
         "stzh-saptcha": StzhSaptcha;
         "stzh-section": StzhSection;
         "stzh-share": StzhShare;
+        "stzh-show": StzhShow;
         "stzh-sitemap": StzhSitemap;
         "stzh-skiplink": StzhSkiplink;
         "stzh-sortable": StzhSortable;
+        "stzh-space": StzhSpace;
         "stzh-status": StzhStatus;
         "stzh-sticky": StzhSticky;
         "stzh-table": StzhTable;
@@ -6817,7 +7184,7 @@ declare module "@stencil/core" {
             "stzh-chip": LocalJSX.StzhChip & JSXBase.HTMLAttributes<HTMLStzhChipElement>;
             "stzh-chip-select": LocalJSX.StzhChipSelect & JSXBase.HTMLAttributes<HTMLStzhChipSelectElement>;
             "stzh-clamp": LocalJSX.StzhClamp & JSXBase.HTMLAttributes<HTMLStzhClampElement>;
-            "stzh-contactaddress": LocalJSX.StzhContactaddress & JSXBase.HTMLAttributes<HTMLStzhContactaddressElement>;
+            "stzh-contact": LocalJSX.StzhContact & JSXBase.HTMLAttributes<HTMLStzhContactElement>;
             "stzh-container": LocalJSX.StzhContainer & JSXBase.HTMLAttributes<HTMLStzhContainerElement>;
             "stzh-cspace": LocalJSX.StzhCspace & JSXBase.HTMLAttributes<HTMLStzhCspaceElement>;
             "stzh-datalist": LocalJSX.StzhDatalist & JSXBase.HTMLAttributes<HTMLStzhDatalistElement>;
@@ -6827,12 +7194,23 @@ declare module "@stencil/core" {
             "stzh-datatable": LocalJSX.StzhDatatable & JSXBase.HTMLAttributes<HTMLStzhDatatableElement>;
             "stzh-datepicker": LocalJSX.StzhDatepicker & JSXBase.HTMLAttributes<HTMLStzhDatepickerElement>;
             "stzh-details": LocalJSX.StzhDetails & JSXBase.HTMLAttributes<HTMLStzhDetailsElement>;
+            /**
+             * @prop --width: Width of dialog
+             */
             "stzh-dialog": LocalJSX.StzhDialog & JSXBase.HTMLAttributes<HTMLStzhDialogElement>;
             "stzh-dropdown": LocalJSX.StzhDropdown & JSXBase.HTMLAttributes<HTMLStzhDropdownElement>;
             "stzh-fieldset": LocalJSX.StzhFieldset & JSXBase.HTMLAttributes<HTMLStzhFieldsetElement>;
             "stzh-figure": LocalJSX.StzhFigure & JSXBase.HTMLAttributes<HTMLStzhFigureElement>;
+            /**
+             * Flyingfocus component.
+             * Inpsired by: https://github.com/Q42/floating-focus-a11y
+             * https://engineering.q42.nl/floating-focus/
+             */
             "stzh-flyingfocus": LocalJSX.StzhFlyingfocus & JSXBase.HTMLAttributes<HTMLStzhFlyingfocusElement>;
             "stzh-footer": LocalJSX.StzhFooter & JSXBase.HTMLAttributes<HTMLStzhFooterElement>;
+            /**
+             * @prop --background-color: Set background and button text hover color
+             */
             "stzh-ghettobox": LocalJSX.StzhGhettobox & JSXBase.HTMLAttributes<HTMLStzhGhettoboxElement>;
             "stzh-header": LocalJSX.StzhHeader & JSXBase.HTMLAttributes<HTMLStzhHeaderElement>;
             "stzh-heading": LocalJSX.StzhHeading & JSXBase.HTMLAttributes<HTMLStzhHeadingElement>;
@@ -6841,6 +7219,7 @@ declare module "@stencil/core" {
             "stzh-icon": LocalJSX.StzhIcon & JSXBase.HTMLAttributes<HTMLStzhIconElement>;
             "stzh-icon-sprite": LocalJSX.StzhIconSprite & JSXBase.HTMLAttributes<HTMLStzhIconSpriteElement>;
             "stzh-input": LocalJSX.StzhInput & JSXBase.HTMLAttributes<HTMLStzhInputElement>;
+            "stzh-invert": LocalJSX.StzhInvert & JSXBase.HTMLAttributes<HTMLStzhInvertElement>;
             "stzh-langnav": LocalJSX.StzhLangnav & JSXBase.HTMLAttributes<HTMLStzhLangnavElement>;
             "stzh-link": LocalJSX.StzhLink & JSXBase.HTMLAttributes<HTMLStzhLinkElement>;
             "stzh-list": LocalJSX.StzhList & JSXBase.HTMLAttributes<HTMLStzhListElement>;
@@ -6851,6 +7230,10 @@ declare module "@stencil/core" {
             "stzh-menu-item": LocalJSX.StzhMenuItem & JSXBase.HTMLAttributes<HTMLStzhMenuItemElement>;
             "stzh-message": LocalJSX.StzhMessage & JSXBase.HTMLAttributes<HTMLStzhMessageElement>;
             "stzh-metanav": LocalJSX.StzhMetanav & JSXBase.HTMLAttributes<HTMLStzhMetanavElement>;
+            /**
+             * @see https://www.stadt-zuerich.ch/site/fuer-zueri/de/index.html
+             * @see https://www.stadt-zuerich.ch/site/iazh/de/index.html
+             */
             "stzh-microsite-teaserlist": LocalJSX.StzhMicrositeTeaserlist & JSXBase.HTMLAttributes<HTMLStzhMicrositeTeaserlistElement>;
             "stzh-olmap": LocalJSX.StzhOlmap & JSXBase.HTMLAttributes<HTMLStzhOlmapElement>;
             "stzh-overlay": LocalJSX.StzhOverlay & JSXBase.HTMLAttributes<HTMLStzhOverlayElement>;
@@ -6858,23 +7241,34 @@ declare module "@stencil/core" {
             "stzh-pagebottom": LocalJSX.StzhPagebottom & JSXBase.HTMLAttributes<HTMLStzhPagebottomElement>;
             "stzh-pagetitle": LocalJSX.StzhPagetitle & JSXBase.HTMLAttributes<HTMLStzhPagetitleElement>;
             "stzh-pagetitle-hero": LocalJSX.StzhPagetitleHero & JSXBase.HTMLAttributes<HTMLStzhPagetitleHeroElement>;
+            /**
+             * @prop --min-width: Minimum width of popover above small breakpoint
+             */
             "stzh-popover": LocalJSX.StzhPopover & JSXBase.HTMLAttributes<HTMLStzhPopoverElement>;
             "stzh-portal-mitwirken": LocalJSX.StzhPortalMitwirken & JSXBase.HTMLAttributes<HTMLStzhPortalMitwirkenElement>;
             "stzh-progressbar": LocalJSX.StzhProgressbar & JSXBase.HTMLAttributes<HTMLStzhProgressbarElement>;
             "stzh-progressbar-item": LocalJSX.StzhProgressbarItem & JSXBase.HTMLAttributes<HTMLStzhProgressbarItemElement>;
             "stzh-radio": LocalJSX.StzhRadio & JSXBase.HTMLAttributes<HTMLStzhRadioElement>;
             "stzh-radiogroup": LocalJSX.StzhRadiogroup & JSXBase.HTMLAttributes<HTMLStzhRadiogroupElement>;
+            "stzh-ratio": LocalJSX.StzhRatio & JSXBase.HTMLAttributes<HTMLStzhRatioElement>;
             "stzh-readspeaker": LocalJSX.StzhReadspeaker & JSXBase.HTMLAttributes<HTMLStzhReadspeakerElement>;
             "stzh-richtext": LocalJSX.StzhRichtext & JSXBase.HTMLAttributes<HTMLStzhRichtextElement>;
             "stzh-row": LocalJSX.StzhRow & JSXBase.HTMLAttributes<HTMLStzhRowElement>;
             "stzh-saptcha": LocalJSX.StzhSaptcha & JSXBase.HTMLAttributes<HTMLStzhSaptchaElement>;
             "stzh-section": LocalJSX.StzhSection & JSXBase.HTMLAttributes<HTMLStzhSectionElement>;
             "stzh-share": LocalJSX.StzhShare & JSXBase.HTMLAttributes<HTMLStzhShareElement>;
+            "stzh-show": LocalJSX.StzhShow & JSXBase.HTMLAttributes<HTMLStzhShowElement>;
             "stzh-sitemap": LocalJSX.StzhSitemap & JSXBase.HTMLAttributes<HTMLStzhSitemapElement>;
             "stzh-skiplink": LocalJSX.StzhSkiplink & JSXBase.HTMLAttributes<HTMLStzhSkiplinkElement>;
             "stzh-sortable": LocalJSX.StzhSortable & JSXBase.HTMLAttributes<HTMLStzhSortableElement>;
+            "stzh-space": LocalJSX.StzhSpace & JSXBase.HTMLAttributes<HTMLStzhSpaceElement>;
             "stzh-status": LocalJSX.StzhStatus & JSXBase.HTMLAttributes<HTMLStzhStatusElement>;
             "stzh-sticky": LocalJSX.StzhSticky & JSXBase.HTMLAttributes<HTMLStzhStickyElement>;
+            /**
+             * @prop --max-height: Maximum height of table
+             * @prop --min-width: Minium width of table
+             * @prop --cell-padding: Cells padding
+             */
             "stzh-table": LocalJSX.StzhTable & JSXBase.HTMLAttributes<HTMLStzhTableElement>;
             "stzh-text": LocalJSX.StzhText & JSXBase.HTMLAttributes<HTMLStzhTextElement>;
             "stzh-textandimage": LocalJSX.StzhTextandimage & JSXBase.HTMLAttributes<HTMLStzhTextandimageElement>;