@oiz/stzh-components 2.2.0 → 2.3.0-alpha2

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";
@@ -314,6 +314,10 @@ export namespace Components {
           * Effect/Animation used
          */
         "effect": "default" | "cta";
+        /**
+          * Whether the button is floating
+         */
+        "floating": boolean;
         /**
           * Whether the button is full width
          */
@@ -350,6 +354,10 @@ export namespace Components {
           * Rel (if href is used)
          */
         "rel": string;
+        /**
+          * Whether the button is rounded
+         */
+        "rounded": boolean;
         /**
           * Focus button
          */
@@ -719,6 +727,10 @@ export namespace Components {
           * Label
          */
         "label": string;
+        /**
+          * Whether chip is not interactive
+         */
+        "nonInteractive": boolean;
         /**
           * Whether remove button should be shown
          */
@@ -734,7 +746,7 @@ export namespace Components {
         /**
           * Size
          */
-        "size": "default" | "small";
+        "size": "default" | "small" | "large";
         /**
           * Target if the button is used as link (if `href` used)
          */
@@ -820,11 +832,11 @@ export namespace Components {
          */
         "linesUltra": number;
     }
-    interface StzhContactaddress {
+    interface StzhContact {
         /**
           * Availability times
          */
-        "availability": string | StzhContactaddressAvailabilityItem[];
+        "availability": string | StzhContactAvailabilityItem[];
         /**
           * Availability title
          */
@@ -848,7 +860,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
          */
@@ -887,6 +899,10 @@ export namespace Components {
         "withBorder": boolean;
     }
     interface StzhContainer {
+        /**
+          * Whether color should be inverted
+         */
+        "inverted": boolean;
     }
     interface StzhCspace {
     }
@@ -915,12 +931,16 @@ export namespace Components {
           * Direction above ultra breakpoint
          */
         "directionUltra": "vertical" | "horizontal" | "inherit";
+        /**
+          * Whether to disable min-width of datalist item label for the `horizontal` variant.  If `false`, the default `min-width` is `144px` (for >= 800px) and `120px` (for < 800px). If `true`, the `min-width` is `none`, so the label column, will have the width of cell with the widest content.  You can also overwrite the label min-width via CSS with the custom property `--item-label-min-width`.
+         */
+        "disableLabelMinWidth": boolean;
         /**
           * Hide border lines between items
          */
         "hideBorder": boolean;
         /**
-          * Items in datalist 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": [...]}]`
+          * Items in datalist Array of objects that must at least include `value` attribute. Can optionally contain `leadingIcon`, `label`, `meta`, `icon`, `href`, `statusLabel`, `statusType` attribute and be nested to display deeper levels: `[{"value":"Value 1", "label": "Label 1"}, {"value":"Value 2", "label": "Label 2", "items": [...]}]`
          */
         "items": StzhDatalistItemEntry[] | string;
     }
@@ -957,6 +977,10 @@ export namespace Components {
           * Label
          */
         "label": string;
+        /**
+          * Leading icon
+         */
+        "leadingIcon": string;
         /**
           * Meta
          */
@@ -965,6 +989,14 @@ export namespace Components {
           * Rel (if href is used)
          */
         "rel": string;
+        /**
+          * Status Label
+         */
+        "statusLabel": string;
+        /**
+          * Status Type
+         */
+        "statusType": "default" | "success" | "warning" | "error" | "info";
         /**
           * Target (if href is used)
          */
@@ -1023,6 +1055,10 @@ export namespace Components {
           * Columns
          */
         "columns": any[] | string;
+        /**
+          * Whether to disable min-width of the table.  If `false`, the default `min-width` is `700px` If `true`, the `min-width` is `none`, so the table will try to squeeze down content as much as possible.  You can also overwrite the min-width via CSS with the custom property `--min-width`.
+         */
+        "disableMinWidth": boolean;
         /**
           * ID field
          */
@@ -1153,6 +1189,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)
@@ -1226,6 +1265,10 @@ export namespace Components {
           * One or multiple error message (use error slot as alternative)
          */
         "error": string | string[];
+        /**
+          * Return current selected items
+         */
+        "getItems": () => Promise<any>;
         /**
           * Return loaded/cached search queries (calls from load property function)
          */
@@ -1247,7 +1290,7 @@ export namespace Components {
          */
         "invalid": boolean;
         /**
-          * Selected values
+          * Set selected options. Can be array set with JS or as JSON string. To get the current (user) selected options, use `getItems` method.
          */
         "items": string[] | string;
         /**
@@ -1402,7 +1445,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>;
     }
@@ -1428,6 +1480,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`.
@@ -1506,11 +1561,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
          */
@@ -1662,6 +1721,8 @@ export namespace Components {
          */
         "value": string;
     }
+    interface StzhInvert {
+    }
     interface StzhLangnav {
         /**
           * Active language of langnav
@@ -1896,6 +1957,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)
@@ -2052,6 +2117,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).
@@ -2103,7 +2171,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;
         /**
@@ -2133,6 +2201,7 @@ export namespace Components {
     }
     interface StzhProgressbarItem {
         "current": boolean;
+        "disabled": boolean;
         "dotted": boolean;
         "first": boolean;
         "hide": boolean;
@@ -2261,6 +2330,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
@@ -2365,6 +2448,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": [...]}]`
@@ -2423,6 +2532,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
@@ -2442,6 +2593,10 @@ export namespace Components {
         "withLoadingbar": boolean;
     }
     interface StzhSticky {
+        /**
+          * Whether to breakout container
+         */
+        "breakout": boolean;
         /**
           * Whether to disable sticking to bottom
          */
@@ -2451,7 +2606,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 the table.  If `false`, the default `min-width` is `700px` If `true`, the `min-width` is `none`, so the table will try to squeeze down content as much as possible.  You can also overwrite the min-width via CSS with the custom property `--min-width`.
+         */
+        "disableMinWidth": boolean;
         /**
           * Columns that should be sticky on the left side (column indexes separated by comma)
          */
@@ -2837,11 +3001,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
          */
@@ -3137,11 +3305,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 {
     }
@@ -3197,6 +3365,9 @@ declare global {
         prototype: HTMLStzhDetailsElement;
         new (): HTMLStzhDetailsElement;
     };
+    /**
+     * @prop --width: Width of dialog
+     */
     interface HTMLStzhDialogElement extends Components.StzhDialog, HTMLStencilElement {
     }
     var HTMLStzhDialogElement: {
@@ -3221,6 +3392,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: {
@@ -3233,6 +3409,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: {
@@ -3281,6 +3460,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: {
@@ -3341,6 +3526,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: {
@@ -3383,6 +3572,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: {
@@ -3419,6 +3611,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: {
@@ -3455,6 +3653,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: {
@@ -3473,6 +3677,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: {
@@ -3485,6 +3695,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: {
@@ -3572,7 +3787,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;
@@ -3596,6 +3811,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;
@@ -3619,15 +3835,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;
@@ -3957,6 +4176,10 @@ declare namespace LocalJSX {
           * Effect/Animation used
          */
         "effect"?: "default" | "cta";
+        /**
+          * Whether the button is floating
+         */
+        "floating"?: boolean;
         /**
           * Whether the button is full width
          */
@@ -4005,6 +4228,10 @@ declare namespace LocalJSX {
           * Rel (if href is used)
          */
         "rel"?: string;
+        /**
+          * Whether the button is rounded
+         */
+        "rounded"?: boolean;
         /**
           * Size variant
          */
@@ -4398,6 +4625,10 @@ declare namespace LocalJSX {
           * Label
          */
         "label"?: string;
+        /**
+          * Whether chip is not interactive
+         */
+        "nonInteractive"?: boolean;
         /**
           * Input blur event
          */
@@ -4425,7 +4656,7 @@ declare namespace LocalJSX {
         /**
           * Size
          */
-        "size"?: "default" | "small";
+        "size"?: "default" | "small" | "large";
         /**
           * Target if the button is used as link (if `href` used)
          */
@@ -4515,11 +4746,11 @@ declare namespace LocalJSX {
          */
         "linesUltra"?: number;
     }
-    interface StzhContactaddress {
+    interface StzhContact {
         /**
           * Availability times
          */
-        "availability"?: string | StzhContactaddressAvailabilityItem[];
+        "availability"?: string | StzhContactAvailabilityItem[];
         /**
           * Availability title
          */
@@ -4543,7 +4774,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
          */
@@ -4582,6 +4813,10 @@ declare namespace LocalJSX {
         "withBorder"?: boolean;
     }
     interface StzhContainer {
+        /**
+          * Whether color should be inverted
+         */
+        "inverted"?: boolean;
     }
     interface StzhCspace {
     }
@@ -4610,12 +4845,16 @@ declare namespace LocalJSX {
           * Direction above ultra breakpoint
          */
         "directionUltra"?: "vertical" | "horizontal" | "inherit";
+        /**
+          * Whether to disable min-width of datalist item label for the `horizontal` variant.  If `false`, the default `min-width` is `144px` (for >= 800px) and `120px` (for < 800px). If `true`, the `min-width` is `none`, so the label column, will have the width of cell with the widest content.  You can also overwrite the label min-width via CSS with the custom property `--item-label-min-width`.
+         */
+        "disableLabelMinWidth"?: boolean;
         /**
           * Hide border lines between items
          */
         "hideBorder"?: boolean;
         /**
-          * Items in datalist 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": [...]}]`
+          * Items in datalist Array of objects that must at least include `value` attribute. Can optionally contain `leadingIcon`, `label`, `meta`, `icon`, `href`, `statusLabel`, `statusType` attribute and be nested to display deeper levels: `[{"value":"Value 1", "label": "Label 1"}, {"value":"Value 2", "label": "Label 2", "items": [...]}]`
          */
         "items"?: StzhDatalistItemEntry[] | string;
         /**
@@ -4660,6 +4899,10 @@ declare namespace LocalJSX {
           * Label
          */
         "label"?: string;
+        /**
+          * Leading icon
+         */
+        "leadingIcon"?: string;
         /**
           * Meta
          */
@@ -4672,6 +4915,14 @@ declare namespace LocalJSX {
           * Rel (if href is used)
          */
         "rel"?: string;
+        /**
+          * Status Label
+         */
+        "statusLabel"?: string;
+        /**
+          * Status Type
+         */
+        "statusType"?: "default" | "success" | "warning" | "error" | "info";
         /**
           * Target (if href is used)
          */
@@ -4738,6 +4989,10 @@ declare namespace LocalJSX {
           * Columns
          */
         "columns"?: any[] | string;
+        /**
+          * Whether to disable min-width of the table.  If `false`, the default `min-width` is `700px` If `true`, the `min-width` is `none`, so the table will try to squeeze down content as much as possible.  You can also overwrite the min-width via CSS with the custom property `--min-width`.
+         */
+        "disableMinWidth"?: boolean;
         /**
           * ID field
          */
@@ -4867,6 +5122,9 @@ declare namespace LocalJSX {
          */
         "open"?: boolean;
     }
+    /**
+     * @prop --width: Width of dialog
+     */
     interface StzhDialog {
         /**
           * Accessible label for dialog (use if no heading is used)
@@ -4959,7 +5217,7 @@ declare namespace LocalJSX {
          */
         "invalid"?: boolean;
         /**
-          * Selected values
+          * Set selected options. Can be array set with JS or as JSON string. To get the current (user) selected options, use `getItems` method.
          */
         "items"?: string[] | string;
         /**
@@ -5138,7 +5396,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 {
@@ -5163,6 +5430,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`.
@@ -5243,11 +5513,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
          */
@@ -5407,6 +5681,8 @@ declare namespace LocalJSX {
          */
         "value"?: string;
     }
+    interface StzhInvert {
+    }
     interface StzhLangnav {
         /**
           * Active language of langnav
@@ -5659,6 +5935,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)
@@ -5809,6 +6089,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).
@@ -5863,7 +6146,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;
         /**
@@ -5893,6 +6176,7 @@ declare namespace LocalJSX {
     }
     interface StzhProgressbarItem {
         "current"?: boolean;
+        "disabled"?: boolean;
         "dotted"?: boolean;
         "first"?: boolean;
         "hide"?: boolean;
@@ -6037,6 +6321,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
@@ -6141,6 +6439,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": [...]}]`
@@ -6195,6 +6519,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
@@ -6214,6 +6580,10 @@ declare namespace LocalJSX {
         "withLoadingbar"?: boolean;
     }
     interface StzhSticky {
+        /**
+          * Whether to breakout container
+         */
+        "breakout"?: boolean;
         /**
           * Whether to disable sticking to bottom
          */
@@ -6231,7 +6601,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 the table.  If `false`, the default `min-width` is `700px` If `true`, the `min-width` is `none`, so the table will try to squeeze down content as much as possible.  You can also overwrite the min-width via CSS with the custom property `--min-width`.
+         */
+        "disableMinWidth"?: boolean;
         /**
           * Columns that should be sticky on the left side (column indexes separated by comma)
          */
@@ -6695,11 +7074,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
          */
@@ -6746,7 +7129,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;
@@ -6770,6 +7153,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;
@@ -6793,15 +7177,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;
@@ -6841,7 +7228,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>;
@@ -6851,12 +7238,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>;
@@ -6865,6 +7263,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>;
@@ -6875,6 +7274,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>;
@@ -6882,23 +7285,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>;