@oiz/stzh-components 3.3.0-beta1 → 3.3.0-beta2

package/dist/types/components.d.ts

@@ -5,11 +5,12 @@
  * It contains typing information for all components that exist in this project.
  */
 import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
-import { ContactEmail, ContactNumber, Font, Layout, OlmapLayer, PanoramaScene, ShareService, Space, StzhAccordionItemBlurEvent, StzhAccordionItemClosedEvent, StzhAccordionItemCloseEvent, StzhAccordionItemFocusEvent, StzhAccordionItemOpenedEvent, StzhAccordionItemOpenEvent, StzhAccordionVariant, StzhAccordionVariantChangeEvent, StzhActionsetItem, StzhActionsetItemClickEvent, StzhAmountChangeEvent, StzhAnchornavItem, StzhAnchornavItemClickEvent, StzhAppointmentsChangeEvent, StzhArchivelistItem, StzhArchivelistItemClickEvent, StzhAudioEndedEvent, StzhAudioEndEvent, StzhAudioErrorEvent, StzhAudioPauseEvent, StzhAudioPlayEvent, StzhAudioPlayingEvent, StzhAudioReplayEvent, StzhBadgeType, StzhBannerCloseEvent, StzhBannerOpenEvent, StzhBreadcrumbItem, StzhBreadcrumbItemClickEvent, StzhButtonBlurEvent, StzhButtonChangeEvent, StzhButtonClickEvent, StzhButtonFocusEvent, StzhButtonSize, StzhButtonVariant, StzhCalendarChangeEvent, StzhCalendarDateDisabledPredicate, StzhCardClickEvent, StzhCardCollapseEvent, StzhCardHeaderAction, StzhCardHeaderActionClickEvent, StzhCardlistCollapseAllEvent, StzhCardNavigationClickEvent, StzhCardSearchresultClickEvent, StzhCardStarClickEvent, StzhCardSubtitleClickEvent, StzhCardSuperteaserClickEvent, StzhCarouselSlideEndEvent, StzhCarouselSlidePassedEvent, StzhCarouselSlideStartEvent, StzhCheckboxBlurEvent, StzhCheckboxChangeEvent, StzhCheckboxFocusEvent, StzhCheckboxgroupChangeEvent, StzhChipBlurEvent, StzhChipClickEvent, StzhChipFocusEvent, StzhChipRemoveEvent, StzhChipselectChangeEvent, StzhChipselectItem, StzhChipSize, StzhChipType, StzhChipVariant, StzhClampClampEvent, StzhClampExpandEvent, StzhContactAvailabilityItem, StzhCtaBlurEvent, StzhCtaClickEvent, StzhCtaFocusEvent, StzhDatalistDirection, StzhDatalistDirectionChangeEvent, StzhDatalistItemActionClickEvent, StzhDatalistItemClickEvent, StzhDatalistItemEntry, StzhDatalistVariant, StzhDatalistVariantChangeEvent, StzhDatamessagelistItemActionClickEvent, StzhDatamessagelistItemClickEvent, StzhDatamessagelistItemEntryAction, StzhDatamessagelistItemEntryLoadingStatus, StzhDatamessagelistItemEntryMeta, StzhDatamessagelistItemEntryTag, StzhDatatableCellClickEvent, StzhDatatableCellData, StzhDatatableColumnData, StzhDatatableHeadingCellClickEvent, StzhDatatableInputRowData, StzhDatatableRowClickEvent, StzhDatatableSortByChangeEvent, StzhDatatableSortClickEvent, StzhDatatableSortDirectionChangeEvent, StzhDatepickerChangeEvent, StzhDaterangeRanges, StzhDialogCloseEvent, StzhDialogOpenEvent, StzhDisturberClosedEvent, StzhDisturberCloseEvent, StzhDisturberOpenedEvent, StzhDisturberOpenEvent, StzhDropdowCloseEvent, StzhDropdowInitEvent, StzhDropdownBlurEvent, StzhDropdownChangeEvent, StzhDropdownFocusEvent, StzhDropdownItemAddEvent, StzhDropdownItemRemoveEvent, StzhDropdownOpenEvent, StzhDropdownOption, StzhDropdownOptionAddEvent, StzhDropdownOptionRemoveEvent, StzhDropdownSize, StzhEditorLink, StzhEventinfoItemInput, StzhGalleryItem, StzhGhettoboxCloseEvent, StzhGhettoboxOpenEvent, StzhHeaderLanguageChangeEvent, StzhHeaderMenuItem, StzhHeaderMenuItemClickEvent, StzhHeaderMetanavItem, StzhHeaderMetanavItemButtonClickEvent, StzhHeaderMetanavItemChildClickEvent, StzhHeaderMetanavItemClickEvent, StzhHeaderSearchChangedEvent, StzhHeaderSearchChangeEvent, StzhIframePreviewSkipEvent, StzhIframeViewChangeEvent, StzhImagecomparisonChangeEvent, StzhInputBlurEvent, StzhInputChangedEvent, StzhInputChangeEvent, StzhInputFocusEvent, StzhLinkBlurEvent, StzhLinkClickEvent, StzhLinkFocusEvent, StzhLinkSize, StzhLocaleAdapter as StzhLocaleAdapter1, StzhMenuItemBlurEvent, StzhMenuItemClickEvent, StzhMenuItemFocusEvent, StzhMenuSize, StzhMenuVariant, StzhMessageCloseEvent, StzhMessageOpenEvent, StzhMicrositeTeaserlistTag, StzhMonthyearpickerChangeEvent, StzhMostsearchedItem, StzhOlmapInitializedEvent, StzhOlmapMoveEndEvent, StzhOlmapMoveStartEvent, StzhOlmapPostRenderEvent, StzhOverlayCloseEvent, StzhOverlayOpenEvent, StzhPaginationChangeEvent, StzhPanoramaChangeEvent, StzhPanoramaFullscreenChangeEvent, StzhPanoramaLoadEvent, StzhPanoramaSceneChangeEvent, StzhPanoramaZoomChangeEvent, StzhPiCardNavigationClickEvent, StzhPiMenuClosedEvent, StzhPiMenuCloseEvent, StzhPiMenuItemClickEvent, StzhPiMenuOpenedEvent, StzhPiMenuOpenEvent, StzhPiPagetitleMenuItem, StzhPiTeaserClickEvent, StzhPopoverClosedEvent, StzhPopoverCloseEvent, StzhPopoverOpenedEvent, StzhPopoverOpenEvent, StzhProgressbarDataItem, StzhProgressbarItemClickEvent, StzhProgressbarItemDottedClickEvent, StzhRadioBlurEvent, StzhRadioChangeEvent, StzhRadioFocusEvent, StzhSearchOverlayCloseClickEvent, StzhSearchResult, StzhSkiplinkBlurEvent, StzhSkiplinkFocusEvent, StzhSortableDisableEvent, StzhSortableUpdateEvent, StzhStatusType, StzhStickyStuckBottomEvent, StzhStickyStuckTopEvent, StzhTagBlurEvent, StzhTagClickEvent, StzhTagFocusEvent, StzhTagSize, StzhTagType, StzhTimelineFoldableChangeEvent, StzhTimelineItemBlurEvent, StzhTimelineItemClosedEvent, StzhTimelineItemCloseEvent, StzhTimelineItemFocusEvent, StzhTimelineItemOpenedEvent, StzhTimelineItemOpenEvent, StzhTimepickerChangeEvent, StzhToastbarInitialToast, StzhToastClosedEvent, StzhToastCloseEvent, StzhToastOpenedEvent, StzhToastOpenEvent, StzhToastType, StzhToggleBlurEvent, StzhToggleChangeEvent, StzhToggleFocusEvent, StzhTooltipClosedEvent, StzhTooltipCloseEvent, StzhTooltipOpenedEvent, StzhTooltipOpenEvent, StzhTopnewsItem, StzhUploadCanceledEvent, StzhUploadCanceledMultipleEvent, StzhUploadCompleteEvent, StzhUploadCompleteMultipleEvent, StzhUploadErrorEvent, StzhUploadErrorMultipleEvent, StzhUploadFileAddedEvent, StzhUploadFileRemovedEvent, StzhUploadFileRemoveEvent, StzhUploadFilesAddedEvent, StzhUploadFilesItem, StzhUploadProcessingEvent, StzhUploadProcessingMultipleEvent, StzhUploadProgressEvent, StzhUploadProgressTotalEvent, StzhUploadSendingEvent, StzhUploadSendingMultipleEvent, StzhUploadSuccessEvent, StzhUploadSuccessMultipleEvent, StzhVbzLinechipBlurEvent, StzhVbzLinechipFocusEvent, StzhVbzMajortickerDisturbance, StzhVbzMajortickerDisturbanceFetchedEvent, StzhVbzQuicklink, VBZ } from "./index";
+import { ContactEmail, ContactNumber, Font, Layout, OlmapLayer, PanoramaScene, ShareService, Space, StzhAccordionItemBlurEvent, StzhAccordionItemClosedEvent, StzhAccordionItemCloseEvent, StzhAccordionItemFocusEvent, StzhAccordionItemOpenedEvent, StzhAccordionItemOpenEvent, StzhAccordionVariant, StzhAccordionVariantChangeEvent, StzhActionsetItem, StzhActionsetItemClickEvent, StzhAmountChangeEvent, StzhAnchornavItem, StzhAnchornavItemClickEvent, StzhAppNavItem, StzhAppointmentsChangeEvent, StzhArchivelistItem, StzhArchivelistItemClickEvent, StzhAudioEndedEvent, StzhAudioEndEvent, StzhAudioErrorEvent, StzhAudioPauseEvent, StzhAudioPlayEvent, StzhAudioPlayingEvent, StzhAudioReplayEvent, StzhBadgeType, StzhBannerCloseEvent, StzhBannerOpenEvent, StzhBreadcrumbItem, StzhBreadcrumbItemClickEvent, StzhButtonBlurEvent, StzhButtonChangeEvent, StzhButtonClickEvent, StzhButtonFocusEvent, StzhButtonSize, StzhButtonVariant, StzhCalendarChangeEvent, StzhCalendarDateDisabledPredicate, StzhCardClickEvent, StzhCardCollapseEvent, StzhCardHeaderAction, StzhCardHeaderActionClickEvent, StzhCardlistCollapseAllEvent, StzhCardNavigationClickEvent, StzhCardSearchresultClickEvent, StzhCardStarClickEvent, StzhCardSubtitleClickEvent, StzhCardSuperteaserClickEvent, StzhCarouselSlideEndEvent, StzhCarouselSlidePassedEvent, StzhCarouselSlideStartEvent, StzhCheckboxBlurEvent, StzhCheckboxChangeEvent, StzhCheckboxFocusEvent, StzhCheckboxgroupChangeEvent, StzhChipBlurEvent, StzhChipClickEvent, StzhChipFocusEvent, StzhChipRemoveEvent, StzhChipselectChangeEvent, StzhChipselectItem, StzhChipSize, StzhChipType, StzhChipVariant, StzhClampClampEvent, StzhClampExpandEvent, StzhContactAvailabilityItem, StzhCtaBlurEvent, StzhCtaClickEvent, StzhCtaFocusEvent, StzhDatalistDirection, StzhDatalistDirectionChangeEvent, StzhDatalistItemActionClickEvent, StzhDatalistItemClickEvent, StzhDatalistItemEntry, StzhDatalistVariant, StzhDatalistVariantChangeEvent, StzhDatamessagelistItemActionClickEvent, StzhDatamessagelistItemClickEvent, StzhDatamessagelistItemEntryAction, StzhDatamessagelistItemEntryLoadingStatus, StzhDatamessagelistItemEntryMeta, StzhDatamessagelistItemEntryTag, StzhDatatableCellClickEvent, StzhDatatableCellData, StzhDatatableColumnData, StzhDatatableHeadingCellClickEvent, StzhDatatableInputRowData, StzhDatatableRowClickEvent, StzhDatatableSortByChangeEvent, StzhDatatableSortClickEvent, StzhDatatableSortDirectionChangeEvent, StzhDatepickerChangeEvent, StzhDaterangeRanges, StzhDialogCloseEvent, StzhDialogOpenEvent, StzhDisturberClosedEvent, StzhDisturberCloseEvent, StzhDisturberOpenedEvent, StzhDisturberOpenEvent, StzhDropdowCloseEvent, StzhDropdowInitEvent, StzhDropdownBlurEvent, StzhDropdownChangeEvent, StzhDropdownFocusEvent, StzhDropdownItemAddEvent, StzhDropdownItemRemoveEvent, StzhDropdownOpenEvent, StzhDropdownOption, StzhDropdownOptionAddEvent, StzhDropdownOptionRemoveEvent, StzhDropdownSize, StzhEditorLink, StzhEventinfoItemInput, StzhGalleryItem, StzhGhettoboxCloseEvent, StzhGhettoboxOpenEvent, StzhHeaderLanguageChangeEvent, StzhHeaderMenuItem, StzhHeaderMenuItemClickEvent, StzhHeaderMetanavItem, StzhHeaderMetanavItemButtonClickEvent, StzhHeaderMetanavItemChildClickEvent, StzhHeaderMetanavItemClickEvent, StzhHeaderSearchChangedEvent, StzhHeaderSearchChangeEvent, StzhIframePreviewSkipEvent, StzhIframeViewChangeEvent, StzhImagecomparisonChangeEvent, StzhInputBlurEvent, StzhInputChangedEvent, StzhInputChangeEvent, StzhInputFocusEvent, StzhLinkBlurEvent, StzhLinkClickEvent, StzhLinkFocusEvent, StzhLinkSize, StzhLocaleAdapter as StzhLocaleAdapter1, StzhMenuItemBlurEvent, StzhMenuItemClickEvent, StzhMenuItemFocusEvent, StzhMenuSize, StzhMenuVariant, StzhMessageCloseEvent, StzhMessageOpenEvent, StzhMicrositeTeaserlistTag, StzhMonthyearpickerChangeEvent, StzhMostsearchedItem, StzhOlmapInitializedEvent, StzhOlmapMoveEndEvent, StzhOlmapMoveStartEvent, StzhOlmapPostRenderEvent, StzhOverlayCloseEvent, StzhOverlayOpenEvent, StzhPaginationChangeEvent, StzhPanoramaChangeEvent, StzhPanoramaFullscreenChangeEvent, StzhPanoramaLoadEvent, StzhPanoramaSceneChangeEvent, StzhPanoramaZoomChangeEvent, StzhPiCardNavigationClickEvent, StzhPiMenuClosedEvent, StzhPiMenuCloseEvent, StzhPiMenuItemClickEvent, StzhPiMenuOpenedEvent, StzhPiMenuOpenEvent, StzhPiPagetitleMenuItem, StzhPiTeaserClickEvent, StzhPopoverClosedEvent, StzhPopoverCloseEvent, StzhPopoverOpenedEvent, StzhPopoverOpenEvent, StzhProgressbarDataItem, StzhProgressbarItemClickEvent, StzhProgressbarItemDottedClickEvent, StzhRadioBlurEvent, StzhRadioChangeEvent, StzhRadioFocusEvent, StzhSearchOverlayCloseClickEvent, StzhSearchResult, StzhSkiplinkBlurEvent, StzhSkiplinkFocusEvent, StzhSortableDisableEvent, StzhSortableUpdateEvent, StzhStatusType, StzhStickyStuckBottomEvent, StzhStickyStuckTopEvent, StzhTagBlurEvent, StzhTagClickEvent, StzhTagFocusEvent, StzhTagSize, StzhTagType, StzhTimelineFoldableChangeEvent, StzhTimelineItemBlurEvent, StzhTimelineItemClosedEvent, StzhTimelineItemCloseEvent, StzhTimelineItemFocusEvent, StzhTimelineItemOpenedEvent, StzhTimelineItemOpenEvent, StzhTimepickerChangeEvent, StzhToastbarInitialToast, StzhToastClosedEvent, StzhToastCloseEvent, StzhToastOpenedEvent, StzhToastOpenEvent, StzhToastType, StzhToggleBlurEvent, StzhToggleChangeEvent, StzhToggleFocusEvent, StzhTooltipClosedEvent, StzhTooltipCloseEvent, StzhTooltipOpenedEvent, StzhTooltipOpenEvent, StzhTopnewsItem, StzhUploadCanceledEvent, StzhUploadCanceledMultipleEvent, StzhUploadCompleteEvent, StzhUploadCompleteMultipleEvent, StzhUploadErrorEvent, StzhUploadErrorMultipleEvent, StzhUploadFileAddedEvent, StzhUploadFileRemovedEvent, StzhUploadFileRemoveEvent, StzhUploadFilesAddedEvent, StzhUploadFilesItem, StzhUploadProcessingEvent, StzhUploadProcessingMultipleEvent, StzhUploadProgressEvent, StzhUploadProgressTotalEvent, StzhUploadSendingEvent, StzhUploadSendingMultipleEvent, StzhUploadSuccessEvent, StzhUploadSuccessMultipleEvent, StzhVbzLinechipBlurEvent, StzhVbzLinechipFocusEvent, StzhVbzMajortickerDisturbance, StzhVbzMajortickerDisturbanceFetchedEvent, StzhVbzQuicklink, VBZ } from "./index";
 import { StzhActionsetLocalizedText } from "./components/stzh-actionset/stzh-actionset.localization";
 import { Placement } from "@floating-ui/dom";
 import { StzhAmountLocalizedText } from "./components/stzh-amount/stzh-amount.localization";
 import { StzhAnchornavLocalizedText } from "./components/stzh-anchornav/stzh-anchornav.localization";
+import { StzhAppNavLocalizedText } from "./components/stzh-app-nav/stzh-app-nav.localization";
 import { StzhAppointmentsLocalizedText } from "./components/stzh-appointments/stzh-appointments.localization";
 import { StzhLocaleAdapter } from "./utils/date-adapter";
 import { StzhArchivelistLocalizedText } from "./components/stzh-archivelist/stzh-archivelist.localization";
@@ -62,11 +63,12 @@ import { StzhVbzIntroLocalizedText } from "./components/stzh-vbz-intro/stzh-vbz-
 import { StzhVbzMajortickerLocalizedText } from "./components/stzh-vbz-majorticker/stzh-vbz-majorticker.localization";
 import { StzhVbzTickerLocalizedText } from "./components/stzh-vbz-ticker/stzh-vbz-ticker.localization";
 import { StzhYoutubeLocalizedText } from "./components/stzh-youtube/stzh-youtube.localization";
-export { ContactEmail, ContactNumber, Font, Layout, OlmapLayer, PanoramaScene, ShareService, Space, StzhAccordionItemBlurEvent, StzhAccordionItemClosedEvent, StzhAccordionItemCloseEvent, StzhAccordionItemFocusEvent, StzhAccordionItemOpenedEvent, StzhAccordionItemOpenEvent, StzhAccordionVariant, StzhAccordionVariantChangeEvent, StzhActionsetItem, StzhActionsetItemClickEvent, StzhAmountChangeEvent, StzhAnchornavItem, StzhAnchornavItemClickEvent, StzhAppointmentsChangeEvent, StzhArchivelistItem, StzhArchivelistItemClickEvent, StzhAudioEndedEvent, StzhAudioEndEvent, StzhAudioErrorEvent, StzhAudioPauseEvent, StzhAudioPlayEvent, StzhAudioPlayingEvent, StzhAudioReplayEvent, StzhBadgeType, StzhBannerCloseEvent, StzhBannerOpenEvent, StzhBreadcrumbItem, StzhBreadcrumbItemClickEvent, StzhButtonBlurEvent, StzhButtonChangeEvent, StzhButtonClickEvent, StzhButtonFocusEvent, StzhButtonSize, StzhButtonVariant, StzhCalendarChangeEvent, StzhCalendarDateDisabledPredicate, StzhCardClickEvent, StzhCardCollapseEvent, StzhCardHeaderAction, StzhCardHeaderActionClickEvent, StzhCardlistCollapseAllEvent, StzhCardNavigationClickEvent, StzhCardSearchresultClickEvent, StzhCardStarClickEvent, StzhCardSubtitleClickEvent, StzhCardSuperteaserClickEvent, StzhCarouselSlideEndEvent, StzhCarouselSlidePassedEvent, StzhCarouselSlideStartEvent, StzhCheckboxBlurEvent, StzhCheckboxChangeEvent, StzhCheckboxFocusEvent, StzhCheckboxgroupChangeEvent, StzhChipBlurEvent, StzhChipClickEvent, StzhChipFocusEvent, StzhChipRemoveEvent, StzhChipselectChangeEvent, StzhChipselectItem, StzhChipSize, StzhChipType, StzhChipVariant, StzhClampClampEvent, StzhClampExpandEvent, StzhContactAvailabilityItem, StzhCtaBlurEvent, StzhCtaClickEvent, StzhCtaFocusEvent, StzhDatalistDirection, StzhDatalistDirectionChangeEvent, StzhDatalistItemActionClickEvent, StzhDatalistItemClickEvent, StzhDatalistItemEntry, StzhDatalistVariant, StzhDatalistVariantChangeEvent, StzhDatamessagelistItemActionClickEvent, StzhDatamessagelistItemClickEvent, StzhDatamessagelistItemEntryAction, StzhDatamessagelistItemEntryLoadingStatus, StzhDatamessagelistItemEntryMeta, StzhDatamessagelistItemEntryTag, StzhDatatableCellClickEvent, StzhDatatableCellData, StzhDatatableColumnData, StzhDatatableHeadingCellClickEvent, StzhDatatableInputRowData, StzhDatatableRowClickEvent, StzhDatatableSortByChangeEvent, StzhDatatableSortClickEvent, StzhDatatableSortDirectionChangeEvent, StzhDatepickerChangeEvent, StzhDaterangeRanges, StzhDialogCloseEvent, StzhDialogOpenEvent, StzhDisturberClosedEvent, StzhDisturberCloseEvent, StzhDisturberOpenedEvent, StzhDisturberOpenEvent, StzhDropdowCloseEvent, StzhDropdowInitEvent, StzhDropdownBlurEvent, StzhDropdownChangeEvent, StzhDropdownFocusEvent, StzhDropdownItemAddEvent, StzhDropdownItemRemoveEvent, StzhDropdownOpenEvent, StzhDropdownOption, StzhDropdownOptionAddEvent, StzhDropdownOptionRemoveEvent, StzhDropdownSize, StzhEditorLink, StzhEventinfoItemInput, StzhGalleryItem, StzhGhettoboxCloseEvent, StzhGhettoboxOpenEvent, StzhHeaderLanguageChangeEvent, StzhHeaderMenuItem, StzhHeaderMenuItemClickEvent, StzhHeaderMetanavItem, StzhHeaderMetanavItemButtonClickEvent, StzhHeaderMetanavItemChildClickEvent, StzhHeaderMetanavItemClickEvent, StzhHeaderSearchChangedEvent, StzhHeaderSearchChangeEvent, StzhIframePreviewSkipEvent, StzhIframeViewChangeEvent, StzhImagecomparisonChangeEvent, StzhInputBlurEvent, StzhInputChangedEvent, StzhInputChangeEvent, StzhInputFocusEvent, StzhLinkBlurEvent, StzhLinkClickEvent, StzhLinkFocusEvent, StzhLinkSize, StzhLocaleAdapter as StzhLocaleAdapter1, StzhMenuItemBlurEvent, StzhMenuItemClickEvent, StzhMenuItemFocusEvent, StzhMenuSize, StzhMenuVariant, StzhMessageCloseEvent, StzhMessageOpenEvent, StzhMicrositeTeaserlistTag, StzhMonthyearpickerChangeEvent, StzhMostsearchedItem, StzhOlmapInitializedEvent, StzhOlmapMoveEndEvent, StzhOlmapMoveStartEvent, StzhOlmapPostRenderEvent, StzhOverlayCloseEvent, StzhOverlayOpenEvent, StzhPaginationChangeEvent, StzhPanoramaChangeEvent, StzhPanoramaFullscreenChangeEvent, StzhPanoramaLoadEvent, StzhPanoramaSceneChangeEvent, StzhPanoramaZoomChangeEvent, StzhPiCardNavigationClickEvent, StzhPiMenuClosedEvent, StzhPiMenuCloseEvent, StzhPiMenuItemClickEvent, StzhPiMenuOpenedEvent, StzhPiMenuOpenEvent, StzhPiPagetitleMenuItem, StzhPiTeaserClickEvent, StzhPopoverClosedEvent, StzhPopoverCloseEvent, StzhPopoverOpenedEvent, StzhPopoverOpenEvent, StzhProgressbarDataItem, StzhProgressbarItemClickEvent, StzhProgressbarItemDottedClickEvent, StzhRadioBlurEvent, StzhRadioChangeEvent, StzhRadioFocusEvent, StzhSearchOverlayCloseClickEvent, StzhSearchResult, StzhSkiplinkBlurEvent, StzhSkiplinkFocusEvent, StzhSortableDisableEvent, StzhSortableUpdateEvent, StzhStatusType, StzhStickyStuckBottomEvent, StzhStickyStuckTopEvent, StzhTagBlurEvent, StzhTagClickEvent, StzhTagFocusEvent, StzhTagSize, StzhTagType, StzhTimelineFoldableChangeEvent, StzhTimelineItemBlurEvent, StzhTimelineItemClosedEvent, StzhTimelineItemCloseEvent, StzhTimelineItemFocusEvent, StzhTimelineItemOpenedEvent, StzhTimelineItemOpenEvent, StzhTimepickerChangeEvent, StzhToastbarInitialToast, StzhToastClosedEvent, StzhToastCloseEvent, StzhToastOpenedEvent, StzhToastOpenEvent, StzhToastType, StzhToggleBlurEvent, StzhToggleChangeEvent, StzhToggleFocusEvent, StzhTooltipClosedEvent, StzhTooltipCloseEvent, StzhTooltipOpenedEvent, StzhTooltipOpenEvent, StzhTopnewsItem, StzhUploadCanceledEvent, StzhUploadCanceledMultipleEvent, StzhUploadCompleteEvent, StzhUploadCompleteMultipleEvent, StzhUploadErrorEvent, StzhUploadErrorMultipleEvent, StzhUploadFileAddedEvent, StzhUploadFileRemovedEvent, StzhUploadFileRemoveEvent, StzhUploadFilesAddedEvent, StzhUploadFilesItem, StzhUploadProcessingEvent, StzhUploadProcessingMultipleEvent, StzhUploadProgressEvent, StzhUploadProgressTotalEvent, StzhUploadSendingEvent, StzhUploadSendingMultipleEvent, StzhUploadSuccessEvent, StzhUploadSuccessMultipleEvent, StzhVbzLinechipBlurEvent, StzhVbzLinechipFocusEvent, StzhVbzMajortickerDisturbance, StzhVbzMajortickerDisturbanceFetchedEvent, StzhVbzQuicklink, VBZ } from "./index";
+export { ContactEmail, ContactNumber, Font, Layout, OlmapLayer, PanoramaScene, ShareService, Space, StzhAccordionItemBlurEvent, StzhAccordionItemClosedEvent, StzhAccordionItemCloseEvent, StzhAccordionItemFocusEvent, StzhAccordionItemOpenedEvent, StzhAccordionItemOpenEvent, StzhAccordionVariant, StzhAccordionVariantChangeEvent, StzhActionsetItem, StzhActionsetItemClickEvent, StzhAmountChangeEvent, StzhAnchornavItem, StzhAnchornavItemClickEvent, StzhAppNavItem, StzhAppointmentsChangeEvent, StzhArchivelistItem, StzhArchivelistItemClickEvent, StzhAudioEndedEvent, StzhAudioEndEvent, StzhAudioErrorEvent, StzhAudioPauseEvent, StzhAudioPlayEvent, StzhAudioPlayingEvent, StzhAudioReplayEvent, StzhBadgeType, StzhBannerCloseEvent, StzhBannerOpenEvent, StzhBreadcrumbItem, StzhBreadcrumbItemClickEvent, StzhButtonBlurEvent, StzhButtonChangeEvent, StzhButtonClickEvent, StzhButtonFocusEvent, StzhButtonSize, StzhButtonVariant, StzhCalendarChangeEvent, StzhCalendarDateDisabledPredicate, StzhCardClickEvent, StzhCardCollapseEvent, StzhCardHeaderAction, StzhCardHeaderActionClickEvent, StzhCardlistCollapseAllEvent, StzhCardNavigationClickEvent, StzhCardSearchresultClickEvent, StzhCardStarClickEvent, StzhCardSubtitleClickEvent, StzhCardSuperteaserClickEvent, StzhCarouselSlideEndEvent, StzhCarouselSlidePassedEvent, StzhCarouselSlideStartEvent, StzhCheckboxBlurEvent, StzhCheckboxChangeEvent, StzhCheckboxFocusEvent, StzhCheckboxgroupChangeEvent, StzhChipBlurEvent, StzhChipClickEvent, StzhChipFocusEvent, StzhChipRemoveEvent, StzhChipselectChangeEvent, StzhChipselectItem, StzhChipSize, StzhChipType, StzhChipVariant, StzhClampClampEvent, StzhClampExpandEvent, StzhContactAvailabilityItem, StzhCtaBlurEvent, StzhCtaClickEvent, StzhCtaFocusEvent, StzhDatalistDirection, StzhDatalistDirectionChangeEvent, StzhDatalistItemActionClickEvent, StzhDatalistItemClickEvent, StzhDatalistItemEntry, StzhDatalistVariant, StzhDatalistVariantChangeEvent, StzhDatamessagelistItemActionClickEvent, StzhDatamessagelistItemClickEvent, StzhDatamessagelistItemEntryAction, StzhDatamessagelistItemEntryLoadingStatus, StzhDatamessagelistItemEntryMeta, StzhDatamessagelistItemEntryTag, StzhDatatableCellClickEvent, StzhDatatableCellData, StzhDatatableColumnData, StzhDatatableHeadingCellClickEvent, StzhDatatableInputRowData, StzhDatatableRowClickEvent, StzhDatatableSortByChangeEvent, StzhDatatableSortClickEvent, StzhDatatableSortDirectionChangeEvent, StzhDatepickerChangeEvent, StzhDaterangeRanges, StzhDialogCloseEvent, StzhDialogOpenEvent, StzhDisturberClosedEvent, StzhDisturberCloseEvent, StzhDisturberOpenedEvent, StzhDisturberOpenEvent, StzhDropdowCloseEvent, StzhDropdowInitEvent, StzhDropdownBlurEvent, StzhDropdownChangeEvent, StzhDropdownFocusEvent, StzhDropdownItemAddEvent, StzhDropdownItemRemoveEvent, StzhDropdownOpenEvent, StzhDropdownOption, StzhDropdownOptionAddEvent, StzhDropdownOptionRemoveEvent, StzhDropdownSize, StzhEditorLink, StzhEventinfoItemInput, StzhGalleryItem, StzhGhettoboxCloseEvent, StzhGhettoboxOpenEvent, StzhHeaderLanguageChangeEvent, StzhHeaderMenuItem, StzhHeaderMenuItemClickEvent, StzhHeaderMetanavItem, StzhHeaderMetanavItemButtonClickEvent, StzhHeaderMetanavItemChildClickEvent, StzhHeaderMetanavItemClickEvent, StzhHeaderSearchChangedEvent, StzhHeaderSearchChangeEvent, StzhIframePreviewSkipEvent, StzhIframeViewChangeEvent, StzhImagecomparisonChangeEvent, StzhInputBlurEvent, StzhInputChangedEvent, StzhInputChangeEvent, StzhInputFocusEvent, StzhLinkBlurEvent, StzhLinkClickEvent, StzhLinkFocusEvent, StzhLinkSize, StzhLocaleAdapter as StzhLocaleAdapter1, StzhMenuItemBlurEvent, StzhMenuItemClickEvent, StzhMenuItemFocusEvent, StzhMenuSize, StzhMenuVariant, StzhMessageCloseEvent, StzhMessageOpenEvent, StzhMicrositeTeaserlistTag, StzhMonthyearpickerChangeEvent, StzhMostsearchedItem, StzhOlmapInitializedEvent, StzhOlmapMoveEndEvent, StzhOlmapMoveStartEvent, StzhOlmapPostRenderEvent, StzhOverlayCloseEvent, StzhOverlayOpenEvent, StzhPaginationChangeEvent, StzhPanoramaChangeEvent, StzhPanoramaFullscreenChangeEvent, StzhPanoramaLoadEvent, StzhPanoramaSceneChangeEvent, StzhPanoramaZoomChangeEvent, StzhPiCardNavigationClickEvent, StzhPiMenuClosedEvent, StzhPiMenuCloseEvent, StzhPiMenuItemClickEvent, StzhPiMenuOpenedEvent, StzhPiMenuOpenEvent, StzhPiPagetitleMenuItem, StzhPiTeaserClickEvent, StzhPopoverClosedEvent, StzhPopoverCloseEvent, StzhPopoverOpenedEvent, StzhPopoverOpenEvent, StzhProgressbarDataItem, StzhProgressbarItemClickEvent, StzhProgressbarItemDottedClickEvent, StzhRadioBlurEvent, StzhRadioChangeEvent, StzhRadioFocusEvent, StzhSearchOverlayCloseClickEvent, StzhSearchResult, StzhSkiplinkBlurEvent, StzhSkiplinkFocusEvent, StzhSortableDisableEvent, StzhSortableUpdateEvent, StzhStatusType, StzhStickyStuckBottomEvent, StzhStickyStuckTopEvent, StzhTagBlurEvent, StzhTagClickEvent, StzhTagFocusEvent, StzhTagSize, StzhTagType, StzhTimelineFoldableChangeEvent, StzhTimelineItemBlurEvent, StzhTimelineItemClosedEvent, StzhTimelineItemCloseEvent, StzhTimelineItemFocusEvent, StzhTimelineItemOpenedEvent, StzhTimelineItemOpenEvent, StzhTimepickerChangeEvent, StzhToastbarInitialToast, StzhToastClosedEvent, StzhToastCloseEvent, StzhToastOpenedEvent, StzhToastOpenEvent, StzhToastType, StzhToggleBlurEvent, StzhToggleChangeEvent, StzhToggleFocusEvent, StzhTooltipClosedEvent, StzhTooltipCloseEvent, StzhTooltipOpenedEvent, StzhTooltipOpenEvent, StzhTopnewsItem, StzhUploadCanceledEvent, StzhUploadCanceledMultipleEvent, StzhUploadCompleteEvent, StzhUploadCompleteMultipleEvent, StzhUploadErrorEvent, StzhUploadErrorMultipleEvent, StzhUploadFileAddedEvent, StzhUploadFileRemovedEvent, StzhUploadFileRemoveEvent, StzhUploadFilesAddedEvent, StzhUploadFilesItem, StzhUploadProcessingEvent, StzhUploadProcessingMultipleEvent, StzhUploadProgressEvent, StzhUploadProgressTotalEvent, StzhUploadSendingEvent, StzhUploadSendingMultipleEvent, StzhUploadSuccessEvent, StzhUploadSuccessMultipleEvent, StzhVbzLinechipBlurEvent, StzhVbzLinechipFocusEvent, StzhVbzMajortickerDisturbance, StzhVbzMajortickerDisturbanceFetchedEvent, StzhVbzQuicklink, VBZ } from "./index";
 export { StzhActionsetLocalizedText } from "./components/stzh-actionset/stzh-actionset.localization";
 export { Placement } from "@floating-ui/dom";
 export { StzhAmountLocalizedText } from "./components/stzh-amount/stzh-amount.localization";
 export { StzhAnchornavLocalizedText } from "./components/stzh-anchornav/stzh-anchornav.localization";
+export { StzhAppNavLocalizedText } from "./components/stzh-app-nav/stzh-app-nav.localization";
 export { StzhAppointmentsLocalizedText } from "./components/stzh-appointments/stzh-appointments.localization";
 export { StzhLocaleAdapter } from "./utils/date-adapter";
 export { StzhArchivelistLocalizedText } from "./components/stzh-archivelist/stzh-archivelist.localization";
@@ -338,6 +340,16 @@ export namespace Components {
     }
     interface StzhAppBar {
     }
+    interface StzhAppNav {
+        /**
+          * App-nav items
+         */
+        "items": StzhAppNavItem[];
+        /**
+          * Translation strings
+         */
+        "localization": StzhAppNavLocalizedText;
+    }
     interface StzhAppointments {
         /**
           * Initial selected values
@@ -2565,6 +2577,10 @@ export namespace Components {
         "show": () => Promise<void>;
     }
     interface StzhHeader {
+        /**
+          * App-nav items
+         */
+        "appNavItems": StzhAppNavItem[];
         /**
           * Whether language switch should stay on mobile
          */
@@ -2597,6 +2613,10 @@ export namespace Components {
           * Translation strings
          */
         "localization": StzhHeaderLocalizedText;
+        /**
+          * Is sent to stzh-toastbar when the fetch for the user specific data fails
+         */
+        "loginErrorMessage": string;
         /**
           * For Adobe Analytics. Will be rendered as value of `s-object-id` attribute to the logo link element. Default value is "Header Logo".
          */
@@ -2621,10 +2641,6 @@ export namespace Components {
           * Metanav element ID
          */
         "metanavId": string;
-        /**
-          * Meta navigation items
-         */
-        "metanavItems": StzhHeaderMetanavItem[] | string;
         /**
           * Search form action (if given, searchfield will be shown)
          */
@@ -2641,6 +2657,10 @@ export namespace Components {
           * Search input value
          */
         "searchValue": string;
+        /**
+          * Generic meta navigation items
+         */
+        "standardMetanavItems": StzhHeaderMetanavItem[] | string;
         /**
           * Sticky behaviour
          */
@@ -2649,6 +2669,14 @@ export namespace Components {
           * Update position / sticky state of header
          */
         "updatePosition": () => Promise<void>;
+        /**
+          * Endpoint for cart and user menu when logged in
+         */
+        "userSpecificMetanavItemsEndpoint": string;
+        /**
+          * User specific meta navigation items when the user is not logged in or the api call failed
+         */
+        "userSpecificMetanavItemsNotLoggedIn": StzhHeaderMetanavItem[];
     }
     interface StzhHeading {
         /**
@@ -3403,7 +3431,7 @@ export namespace Components {
          */
         "addIconMarker": (coordinates: number[]) => Promise<any>;
         /**
-          * Initial center position
+          * Initial center position in the format of Swiss Grid LV95 coordinates
          */
         "center": string | [number, number];
         /**
@@ -5651,6 +5679,12 @@ declare global {
         prototype: HTMLStzhAppBarElement;
         new (): HTMLStzhAppBarElement;
     };
+    interface HTMLStzhAppNavElement extends Components.StzhAppNav, HTMLStencilElement {
+    }
+    var HTMLStzhAppNavElement: {
+        prototype: HTMLStzhAppNavElement;
+        new (): HTMLStzhAppNavElement;
+    };
     interface HTMLStzhAppointmentsElement extends Components.StzhAppointments, HTMLStencilElement {
     }
     var HTMLStzhAppointmentsElement: {
@@ -6449,6 +6483,7 @@ declare global {
         "stzh-amount": HTMLStzhAmountElement;
         "stzh-anchornav": HTMLStzhAnchornavElement;
         "stzh-app-bar": HTMLStzhAppBarElement;
+        "stzh-app-nav": HTMLStzhAppNavElement;
         "stzh-appointments": HTMLStzhAppointmentsElement;
         "stzh-archivelist": HTMLStzhArchivelistElement;
         "stzh-audio": HTMLStzhAudioElement;
@@ -6825,6 +6860,16 @@ declare namespace LocalJSX {
     }
     interface StzhAppBar {
     }
+    interface StzhAppNav {
+        /**
+          * App-nav items
+         */
+        "items"?: StzhAppNavItem[];
+        /**
+          * Translation strings
+         */
+        "localization"?: StzhAppNavLocalizedText;
+    }
     interface StzhAppointments {
         /**
           * Initial selected values
@@ -9274,6 +9319,10 @@ declare namespace LocalJSX {
         "onStzhOpen"?: (event: StzhGhettoboxCustomEvent<StzhGhettoboxOpenEvent>) => void;
     }
     interface StzhHeader {
+        /**
+          * App-nav items
+         */
+        "appNavItems"?: StzhAppNavItem[];
         /**
           * Whether language switch should stay on mobile
          */
@@ -9306,6 +9355,10 @@ declare namespace LocalJSX {
           * Translation strings
          */
         "localization"?: StzhHeaderLocalizedText;
+        /**
+          * Is sent to stzh-toastbar when the fetch for the user specific data fails
+         */
+        "loginErrorMessage"?: string;
         /**
           * For Adobe Analytics. Will be rendered as value of `s-object-id` attribute to the logo link element. Default value is "Header Logo".
          */
@@ -9330,10 +9383,6 @@ declare namespace LocalJSX {
           * Metanav element ID
          */
         "metanavId"?: string;
-        /**
-          * Meta navigation items
-         */
-        "metanavItems"?: StzhHeaderMetanavItem[] | string;
         /**
           * Language change event
          */
@@ -9378,10 +9427,22 @@ declare namespace LocalJSX {
           * Search input value
          */
         "searchValue"?: string;
+        /**
+          * Generic meta navigation items
+         */
+        "standardMetanavItems"?: StzhHeaderMetanavItem[] | string;
         /**
           * Sticky behaviour
          */
         "sticky"?: "default" | "disabled" | "always-full" | "always";
+        /**
+          * Endpoint for cart and user menu when logged in
+         */
+        "userSpecificMetanavItemsEndpoint"?: string;
+        /**
+          * User specific meta navigation items when the user is not logged in or the api call failed
+         */
+        "userSpecificMetanavItemsNotLoggedIn"?: StzhHeaderMetanavItem[];
     }
     interface StzhHeading {
         /**
@@ -10191,7 +10252,7 @@ declare namespace LocalJSX {
     }
     interface StzhOlmap {
         /**
-          * Initial center position
+          * Initial center position in the format of Swiss Grid LV95 coordinates
          */
         "center"?: string | [number, number];
         /**
@@ -12313,6 +12374,7 @@ declare namespace LocalJSX {
         "stzh-amount": StzhAmount;
         "stzh-anchornav": StzhAnchornav;
         "stzh-app-bar": StzhAppBar;
+        "stzh-app-nav": StzhAppNav;
         "stzh-appointments": StzhAppointments;
         "stzh-archivelist": StzhArchivelist;
         "stzh-audio": StzhAudio;
@@ -12457,6 +12519,7 @@ declare module "@stencil/core" {
             "stzh-amount": LocalJSX.StzhAmount & JSXBase.HTMLAttributes<HTMLStzhAmountElement>;
             "stzh-anchornav": LocalJSX.StzhAnchornav & JSXBase.HTMLAttributes<HTMLStzhAnchornavElement>;
             "stzh-app-bar": LocalJSX.StzhAppBar & JSXBase.HTMLAttributes<HTMLStzhAppBarElement>;
+            "stzh-app-nav": LocalJSX.StzhAppNav & JSXBase.HTMLAttributes<HTMLStzhAppNavElement>;
             "stzh-appointments": LocalJSX.StzhAppointments & JSXBase.HTMLAttributes<HTMLStzhAppointmentsElement>;
             "stzh-archivelist": LocalJSX.StzhArchivelist & JSXBase.HTMLAttributes<HTMLStzhArchivelistElement>;
             "stzh-audio": LocalJSX.StzhAudio & JSXBase.HTMLAttributes<HTMLStzhAudioElement>;

package/dist/types/index.d.ts

@@ -329,6 +329,7 @@ export type StzhHeaderMetanavItem = {
   id?: string;
   items?: StzhHeaderMetanavItemChild[];
   itemButton?: StzhHeaderMetanavItemButton;
+  cssOrder?: boolean;
 };
 export type StzhHeaderMetanavItemChild = {
   label: string;
@@ -381,6 +382,15 @@ export type StzhHeaderSearchChangedEvent = {
   originalEvent: InputEvent | MouseEvent;
   value: string;
 };
+export type StzhAppNavItem = {
+  text: string;
+  href: string;
+  badge: string;
+  badgeType: StzhBadgeType;
+  icon: string;
+  active: boolean;
+  a11yCurrent: string;
+};
 export type StzhPiPagetitleMenuItem = {
   label: string;
   href?: string;

package/dist/vscode-data.json

@@ -408,6 +408,14 @@
       },
       "attributes": []
     },
+    {
+      "name": "stzh-app-nav",
+      "description": {
+        "kind": "markdown",
+        "value": "The STZH app nav component.\n\nRenders multiple `stzh-links` components as an app navigation.\nUser as a variant inside `stzh-header`.<br/>\nIf you want to use more then 4 items you should use the `menuItems` variant of the `stzh-header` instead (burger menu)."
+      },
+      "attributes": []
+    },
     {
       "name": "stzh-appointments",
       "description": {
@@ -3772,6 +3780,10 @@
           "name": "languages",
           "description": "Available language (paths) in language switch"
         },
+        {
+          "name": "login-error-message",
+          "description": "Is sent to stzh-toastbar when the fetch for the user specific data fails"
+        },
         {
           "name": "logo-analytics-id",
           "description": "For Adobe Analytics.\nWill be rendered as value of `s-object-id` attribute to the logo link element.\nDefault value is \"Header Logo\"."
@@ -3813,10 +3825,6 @@
           "name": "metanav-id",
           "description": "Metanav element ID"
         },
-        {
-          "name": "metanav-items",
-          "description": "Meta navigation items"
-        },
         {
           "name": "search-action",
           "description": "Search form action (if given, searchfield will be shown)"
@@ -3833,6 +3841,10 @@
           "name": "search-value",
           "description": "Search input value"
         },
+        {
+          "name": "standard-metanav-items",
+          "description": "Generic meta navigation items"
+        },
         {
           "name": "sticky",
           "description": "Sticky behaviour",
@@ -3850,6 +3862,10 @@
               "name": "disabled"
             }
           ]
+        },
+        {
+          "name": "user-specific-metanav-items-endpoint",
+          "description": "Endpoint for cart and user menu when logged in"
         }
       ]
     },
@@ -5386,12 +5402,12 @@
       "name": "stzh-olmap",
       "description": {
         "kind": "markdown",
-        "value": "The STZH olmap component."
+        "value": "The STZH olmap component is used to display places on a map (Switzerland only). It uses the Swiss Grid LV95 coordinates system. Use online tools like [Swisstopo converter](https://www.swisstopo.admin.ch/de/koordinaten-konvertieren-navref) to convert coordinates from the more commonly used WGS84 format."
       },
       "attributes": [
         {
           "name": "center",
-          "description": "Initial center position"
+          "description": "Initial center position in the format of Swiss Grid LV95 coordinates"
         },
         {
           "name": "center-marker",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oiz/stzh-components",
-  "version": "3.3.0-beta1",
+  "version": "3.3.0-beta2",
   "description": "STZH Web Components Library",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",

package/dist/stzh-components/p-6e29bc61.entry.js

@@ -1,2 +0,0 @@
-import{r as t,h as e,a,g as s}from"./p-c7bfac7a.js";import{s as i,h}from"./p-d789f265.js";import{m as r}from"./p-10e2901a.js";import"./p-9b063923.js";const l=".sc-stzh-pagetitle-h{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);color:var(--stzh-base-color);box-sizing:border-box;display:block}[hidden].sc-stzh-pagetitle-h{display:none}.sc-stzh-pagetitle-h::-moz-selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-pagetitle-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-pagetitle-h *.sc-stzh-pagetitle,.sc-stzh-pagetitle-h *.sc-stzh-pagetitle::before,.sc-stzh-pagetitle-h *.sc-stzh-pagetitle::after{box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness);-webkit-text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink);text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink)}.sc-stzh-pagetitle-h .has-focus.sc-stzh-pagetitle{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-pagetitle-h .stzh-fylingfocus-focused.sc-stzh-pagetitle{outline-style:none !important}.sc-stzh-pagetitle-h .stzh-fylingfocus-focused.sc-stzh-pagetitle::-moz-focus-inner{border:0 !important}.sc-stzh-pagetitle-h{--background-color:var(--stzh-pagetitle-background-color, var(--stzh-pagetitle-background-color));--image-background-color:var(--stzh-ratio-background-color)}.sc-stzh-pagetitle-h .sc-stzh-pagetitle-s>[slot=image]{position:absolute;inset:0;width:100%;height:100%;-o-object-fit:cover;object-fit:cover}[background=default].sc-stzh-pagetitle-h{--stzh-readspeaker-background-color:var(--background-color);--stzh-readspeaker-audio-track-progress-background-color:var(--stzh-color-white)}[background=transparent].sc-stzh-pagetitle-h{--background-color:transparent}.stzh-pagetitle.sc-stzh-pagetitle{background-color:var(--background-color)}.stzh-pagetitle__container.sc-stzh-pagetitle{margin-left:1.25rem;margin-right:1.25rem}@media screen and (min-width: 600px){.stzh-pagetitle__container.sc-stzh-pagetitle{margin-left:2rem;margin-right:2rem}}@media screen and (min-width: 900px){.stzh-pagetitle__container.sc-stzh-pagetitle{margin-left:2.5rem;margin-right:2.5rem}}@media screen and (min-width: 1260px){.stzh-pagetitle__container.sc-stzh-pagetitle{margin-left:4rem;margin-right:4rem}}@media screen and (min-width: 1600px){.stzh-pagetitle__container.sc-stzh-pagetitle{margin-left:auto;margin-right:auto;max-width:84.25rem}}.stzh-pagetitle__wrapper.sc-stzh-pagetitle{position:relative;display:grid}.stzh-pagetitle__text.sc-stzh-pagetitle{padding-top:var(--stzh-space-xxlarge);padding-bottom:var(--stzh-space-xxlarge);display:flex;flex-direction:column;justify-content:center}@media screen and (min-width: 600px){.stzh-pagetitle__text.sc-stzh-pagetitle{padding-top:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 900px){.stzh-pagetitle__text.sc-stzh-pagetitle{padding-top:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 1260px){.stzh-pagetitle__text.sc-stzh-pagetitle{padding-top:var(--stzh-space-xbig)}}@media screen and (min-width: 600px){.stzh-pagetitle__text.sc-stzh-pagetitle{padding-bottom:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 900px){.stzh-pagetitle__text.sc-stzh-pagetitle{padding-bottom:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 1260px){.stzh-pagetitle__text.sc-stzh-pagetitle{padding-bottom:var(--stzh-space-xbig)}}.stzh-pagetitle__image-wrapper.sc-stzh-pagetitle{position:relative}.stzh-pagetitle__ratio.sc-stzh-pagetitle{--background-color:var(--image-background-color)}.stzh-pagetitle__image-inner-wrapper.sc-stzh-pagetitle{background-color:var(--image-background-color);position:absolute;inset:0;height:100%;margin-left:calc(1.25rem / -1);margin-right:calc(1.25rem / -1)}@media screen and (min-width: 600px){.stzh-pagetitle__image-inner-wrapper.sc-stzh-pagetitle{margin-left:calc(2rem / -1);margin-right:calc(2rem / -1)}}@media screen and (min-width: 900px){.stzh-pagetitle__image-inner-wrapper.sc-stzh-pagetitle{margin-left:0;margin-right:0;width:calc(100% + 2.5rem)}}@media screen and (min-width: 1260px){.stzh-pagetitle__image-inner-wrapper.sc-stzh-pagetitle{width:calc(100% + 4rem)}}@media screen and (min-width: 1600px){.stzh-pagetitle__image-inner-wrapper.sc-stzh-pagetitle{width:calc(100% + ((100rem - 84.25rem) / 2))}}.stzh-pagetitle__meta.sc-stzh-pagetitle{display:flex;flex-direction:column-reverse;row-gap:var(--stzh-space-xsmall)}@media screen and (min-width: 900px){.stzh-pagetitle__meta.sc-stzh-pagetitle{flex-direction:row}}.stzh-pagetitle__tag.sc-stzh-pagetitle:not(:empty){margin-right:auto}@media screen and (min-width: 600px) and (max-width: 899px){.stzh-pagetitle__readspeaker.sc-stzh-pagetitle{--stzh-readspeaker-dropdown-position:relative;--stzh-readspeaker-dropdown-top:auto}}.stzh-pagetitle__dateline.sc-stzh-pagetitle{font-size:var(--stzh-font-milli-font-size);line-height:var(--stzh-font-milli-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing);margin-top:var(--stzh-space-medium);color:var(--stzh-color-primary70);margin-bottom:var(--stzh-space-xsmall)}@media screen and (min-width: 600px){.stzh-pagetitle__dateline.sc-stzh-pagetitle{margin-top:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pagetitle__dateline.sc-stzh-pagetitle{margin-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-pagetitle__dateline.sc-stzh-pagetitle{margin-top:var(--stzh-space-xxlarge)}}.stzh-pagetitle__lead.sc-stzh-pagetitle{--stzh-base-lead-color:var(--stzh-heading-color)}.stzh-pagetitle__heading.sc-stzh-pagetitle:not(:empty)+.stzh-pagetitle__lead.sc-stzh-pagetitle:not(:empty){margin-top:var(--stzh-space-xlarge)}@media screen and (min-width: 900px){.stzh-pagetitle__heading.sc-stzh-pagetitle:not(:empty)+.stzh-pagetitle__lead.sc-stzh-pagetitle:not(:empty){margin-top:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){.stzh-pagetitle__heading.sc-stzh-pagetitle:not(:empty)+.stzh-pagetitle__lead.sc-stzh-pagetitle:not(:empty){margin-top:var(--stzh-space-xxxlarge)}}.stzh-pagetitle__disturber.sc-stzh-pagetitle{z-index:var(--stzh-z-index-sticky);position:fixed;left:0;right:0;bottom:0}@media screen and (min-width: 900px){.stzh-pagetitle__disturber.sc-stzh-pagetitle{z-index:initial;position:absolute;width:calc(((100% - 7 * var(--stzh-grid-gutter-medium)) / 8 * 3) + 2 * var(--stzh-grid-gutter-medium));left:auto;bottom:calc((var(--stzh-space-big) - var(--stzh-space-xlarge)) / -1)}}@media screen and (min-width: 1260px){.stzh-pagetitle__disturber.sc-stzh-pagetitle{width:calc(((100% - 11 * var(--stzh-grid-gutter-large)) / 12 * 4) + 3 * var(--stzh-grid-gutter-large));bottom:calc(var(--stzh-space-huge) / -1)}}@media screen and (min-width: 1600px){.stzh-pagetitle__disturber.sc-stzh-pagetitle{width:calc(((100% - 11 * var(--stzh-grid-gutter-ultra)) / 12 * 4) + 3 * var(--stzh-grid-gutter-ultra))}}.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__ratio.sc-stzh-pagetitle{display:none}.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__text.sc-stzh-pagetitle{-moz-column-gap:var(--stzh-grid-gutter);column-gap:var(--stzh-grid-gutter);display:grid;grid-template-columns:repeat(4, minmax(0, 1fr))}@media screen and (min-width: 600px){.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__text.sc-stzh-pagetitle{-moz-column-gap:var(--stzh-grid-gutter-small);column-gap:var(--stzh-grid-gutter-small)}}@media screen and (min-width: 900px){.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__text.sc-stzh-pagetitle{-moz-column-gap:var(--stzh-grid-gutter-medium);column-gap:var(--stzh-grid-gutter-medium)}}@media screen and (min-width: 1260px){.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__text.sc-stzh-pagetitle{-moz-column-gap:var(--stzh-grid-gutter-large);column-gap:var(--stzh-grid-gutter-large)}}@media screen and (min-width: 1600px){.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__text.sc-stzh-pagetitle{-moz-column-gap:var(--stzh-grid-gutter-ultra);column-gap:var(--stzh-grid-gutter-ultra)}}@media screen and (min-width: 900px){.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__text.sc-stzh-pagetitle{grid-template-columns:repeat(8, minmax(0, 1fr))}}@media screen and (min-width: 1260px){.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__text.sc-stzh-pagetitle{grid-template-columns:repeat(12, minmax(0, 1fr))}}.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__meta.sc-stzh-pagetitle,.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__dateline.sc-stzh-pagetitle,.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__heading.sc-stzh-pagetitle,.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__lead.sc-stzh-pagetitle{grid-column:1/span 4}@media screen and (min-width: 900px){.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__meta.sc-stzh-pagetitle,.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__dateline.sc-stzh-pagetitle,.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__heading.sc-stzh-pagetitle{grid-column:1/span 8}}@media screen and (min-width: 900px){.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__lead.sc-stzh-pagetitle{grid-column:1/span 6}}@media screen and (min-width: 1260px){.stzh-pagetitle--has-no-image.sc-stzh-pagetitle .stzh-pagetitle__lead.sc-stzh-pagetitle{grid-column:1/span 7}}@media screen and (min-width: 900px){.stzh-pagetitle--has-image.sc-stzh-pagetitle .stzh-pagetitle__wrapper.sc-stzh-pagetitle{grid-template-columns:repeat(2, minmax(0, 1fr));gap:var(--stzh-space-xxlarge)}}.stzh-pagetitle--has-meta.sc-stzh-pagetitle .stzh-pagetitle__text.sc-stzh-pagetitle{padding-top:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-pagetitle--has-meta.sc-stzh-pagetitle .stzh-pagetitle__text.sc-stzh-pagetitle{padding-top:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pagetitle--has-meta.sc-stzh-pagetitle .stzh-pagetitle__text.sc-stzh-pagetitle{padding-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-pagetitle--has-meta.sc-stzh-pagetitle .stzh-pagetitle__text.sc-stzh-pagetitle{padding-top:var(--stzh-space-xxlarge)}}@media screen and (min-width: 900px){.stzh-pagetitle--has-tag.sc-stzh-pagetitle .stzh-pagetitle__readspeaker.sc-stzh-pagetitle{--stzh-readspeaker-dropdown-left:auto;--stzh-readspeaker-dropdown-right:0px;--stzh-readspeaker-dropdown-settings-left:auto;--stzh-readspeaker-dropdown-settings-right:0px}}.stzh-pagetitle--background-default.sc-stzh-pagetitle .stzh-pagetitle__text.sc-stzh-pagetitle{--stzh-selection-background-color:var(--stzh-color-white)}.stzh-pagetitle--background-transparent.sc-stzh-pagetitle .stzh-pagetitle__text.sc-stzh-pagetitle{padding-bottom:var(--stzh-space-xxlarge)}@media screen and (min-width: 900px){.stzh-pagetitle--background-transparent.sc-stzh-pagetitle .stzh-pagetitle__text.sc-stzh-pagetitle{padding-bottom:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){.stzh-pagetitle--background-transparent.sc-stzh-pagetitle .stzh-pagetitle__text.sc-stzh-pagetitle{padding-bottom:var(--stzh-space-xxxxlarge)}}.stzh-pagetitle--hyphens.sc-stzh-pagetitle .stzh-pagetitle__heading.sc-stzh-pagetitle{-webkit-hyphens:auto;hyphens:auto}";const g=class{constructor(e){t(this,e);this.isDisturberOpen=false;this.update=()=>{var t;if(!this.disturberElement){return}const e=r("medium").matches;const a=((t=this.disturberElement)===null||t===void 0?void 0:t.offsetHeight)||0;const s=a&&this.isDisturberOpen;const i=s&&!e;document.documentElement.style.setProperty("--stzh-pagetitle-disturber-height",s?`${a}px`:"0px");document.documentElement.style.setProperty("--stzh-pagetitle-disturber-stuck-height",i?`${a}px`:"0px");document.documentElement.style.setProperty("--stzh-pagetitle-disturber-is-stuck",i?"1":"0");document.documentElement.style.setProperty("--stzh-pagetitle-disturber-is-not-stuck",i?"0":"1")};this.init=()=>{const t=this.element.querySelector('stzh-heading[slot="heading"], [slot="heading"] stzh-heading');const e=this.element.querySelector('stzh-disturber[slot="disturber"], [slot="disturber"] stzh-disturber');const a=this.element.querySelectorAll('stzh-text[slot="lead"], [slot="lead"] stzh-text');const s=this.element.querySelector('stzh-show[slot="disturber"], [slot="disturber"] stzh-show');const h=this.element.querySelector('[slot="readspeaker"] stzh-button');const r=this.element.querySelector('stzh-tag[slot="tag"], [slot="tag"] stzh-tag');if(t){i(t,{curve:"hero",level:"1"})}if(e){i(e,{initialOpenAnimation:true})}if(s){i(s,{mikro:true})}if(r){i(r,{type:"secondary",size:"large",nonInteractive:true})}if(h){i(h,{variant:"tertiary-plain",noPaddingLeft:true,noPaddingRight:true,size:"small",sizeMedium:"tiny",buttonAccesskey:"L"})}a.forEach((t=>{i(t,{lead:true})}))};this.background="default";this.hyphensEnabled=false;this.dateline=undefined}handleResize(){if(this.debounceResize){window.cancelAnimationFrame(this.debounceResize)}this.debounceResize=requestAnimationFrame(this.update)}handleStzhOpen(t){if(t.detail.component==="stzh-disturber"){this.isDisturberOpen=true;requestAnimationFrame((()=>{requestAnimationFrame(this.update)}))}}handleStzhClose(t){if(t.detail.component==="stzh-disturber"){this.isDisturberOpen=false;requestAnimationFrame((()=>{requestAnimationFrame(this.update)}))}}componentDidRender(){requestAnimationFrame((()=>{requestAnimationFrame(this.update)}))}connectedCallback(){this.init();this.observer=new MutationObserver(this.init);this.observer.observe(this.element,{childList:true,subtree:true})}disconnectedCallback(){var t;(t=this.observer)===null||t===void 0?void 0:t.disconnect()}render(){const t=h(this.element,"image");const s=h(this.element,"lead");const i=h(this.element,"tag");const r=h(this.element,"readspeaker");const l={"stzh-pagetitle":true,"stzh-pagetitle--has-image":t,"stzh-pagetitle--has-no-image":!t,"stzh-pagetitle--has-lead":s,"stzh-pagetitle--has-tag":i,"stzh-pagetitle--has-meta":i||r,"stzh-pagetitle--hyphens":this.hyphensEnabled,[`stzh-pagetitle--background-${this.background}`]:!!this.background};return e(a,null,e("div",{class:l},e("div",{class:"stzh-pagetitle__container"},e("div",{class:"stzh-pagetitle__wrapper"},e("div",{class:"stzh-pagetitle__text"},e("div",{class:"stzh-pagetitle__meta"},e("div",{class:"stzh-pagetitle__tag"},e("slot",{name:"tag"})),e("div",{class:"stzh-pagetitle__readspeaker"},e("slot",{name:"readspeaker"}))),this.dateline&&e("div",{class:"stzh-pagetitle__dateline"},this.dateline),e("div",{class:"stzh-pagetitle__heading"},e("slot",{name:"heading"})),e("div",{class:"stzh-pagetitle__lead"},e("slot",{name:"lead"}))),e("div",{class:"stzh-pagetitle__image-wrapper"},e("stzh-ratio",{ratio:"16:9",ratioSmall:"3:2",ratioMedium:"16:9",class:"stzh-pagetitle__ratio"}),e("div",{class:"stzh-pagetitle__image-inner-wrapper"},e("slot",{name:"image"}))),e("div",{class:"stzh-pagetitle__disturber",ref:t=>this.disturberElement=t},e("slot",{name:"disturber"}))))))}get element(){return s(this)}};g.style=l;export{g as stzh_pagetitle};
-//# sourceMappingURL=p-6e29bc61.entry.js.map

package/dist/stzh-components/p-6e29bc61.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["stzhPagetitleCss","StzhPagetitle","this","isDisturberOpen","update","disturberElement","isMedium","media","matches","disturberHeight","_a","offsetHeight","hasDisturber","isStuck","document","documentElement","style","setProperty","init","heading","element","querySelector","disturber","leads","querySelectorAll","show","readspeakerButton","tag","setPropsIfNull","curve","level","initialOpenAnimation","mikro","type","size","nonInteractive","variant","noPaddingLeft","noPaddingRight","sizeMedium","buttonAccesskey","forEach","lead","handleResize","debounceResize","window","cancelAnimationFrame","requestAnimationFrame","handleStzhOpen","event","detail","component","handleStzhClose","componentDidRender","connectedCallback","observer","MutationObserver","observe","childList","subtree","disconnectedCallback","disconnect","render","imageSlotUsed","hasSlot","leadSlotUsed","tagSlotUsed","readspeakerSlotUsed","classes","hyphensEnabled","background","h","Host","class","name","dateline","ratio","ratioSmall","ratioMedium","ref","el"],"sources":["src/components/stzh-pagetitle/stzh-pagetitle.scss?tag=stzh-pagetitle&encapsulation=scoped","src/components/stzh-pagetitle/stzh-pagetitle.tsx"],"sourcesContent":["/**\n * @prop --background-color: Background color\n * @prop --image-background-color: Background color of image\n *\n * @prop --stzh-pagetitle-disturber-height: Global: Disturber height\n * @prop --stzh-pagetitle-disturber-stuck-height: Global: Disturber height when sticky (below medium breakpoint)\n * @prop --stzh-pagetitle-disturber-is-stuck: **Global**: Whether disturber is currently sticky (readonly variable on `<html>`)\n * @prop --stzh-pagetitle-disturber-is-not-stuck: **Global**: Whether disturber is currently not sticky (readonly variable on `<html>`)\n * @prop --stzh-pagetitle-background-color: **Global**: Background color of pagetitle.\n */\n\n:host {\n  --background-color: var(--stzh-pagetitle-background-color, #{$pagetitleBackgroundColor});\n  --image-background-color: #{$ratioBackgroundColor};\n\n  ::slotted([slot=\"image\"]) {\n    position: absolute;\n    inset: 0;\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n  }\n\n  &[background=\"default\"] {\n    --stzh-readspeaker-background-color: var(--background-color);\n    --stzh-readspeaker-audio-track-progress-background-color: #{$colorWhite};\n  }\n\n  &[background=\"transparent\"] {\n    --background-color: transparent;\n  }\n}\n\n.stzh-pagetitle {\n  background-color: var(--background-color);\n\n  &__container {\n    @include container;\n  }\n\n  &__wrapper {\n    position: relative;\n    display: grid;\n  }\n\n  &__text {\n    @include spaceCurve('padding-top', 'big');\n    @include spaceCurve('padding-bottom', 'big');\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n  }\n\n  &__image-wrapper {\n    position: relative;\n  }\n\n  &__ratio {\n    --background-color: var(--image-background-color);\n  }\n\n  &__image-inner-wrapper {\n    background-color: var(--image-background-color);\n    position: absolute;\n    inset: 0;\n    height: 100%;\n    margin-left: calc(#{$containerMargin} / -1);\n    margin-right: calc(#{$containerMargin} / -1);\n\n    @include mq($from: small) {\n      margin-left: calc(#{$containerMarginSmall} / -1);\n      margin-right: calc(#{$containerMarginSmall} / -1);\n    }\n\n    @include mq($from: medium) {\n      margin-left: 0;\n      margin-right: 0;\n      width: calc(100% + #{$containerMarginMedium});\n    }\n\n    @include mq($from: large) {\n      width: calc(100% + #{$containerMarginLarge});\n    }\n\n    @include mq($from: ultra) {\n      width: calc(100% + ((#{map-get($breakpoints, 'ultra')} - #{$containerMaxWidth}) / 2));\n    }\n  }\n\n  &__meta {\n    display: flex;\n    flex-direction: column-reverse;\n    row-gap: space('xsmall');\n\n    @include mq($from: medium) {\n      flex-direction: row;\n    }\n  }\n\n  &__tag {\n    &:not(:empty) {\n      margin-right: auto;\n    }\n  }\n\n  &__readspeaker {\n    @include mq($from: small, $to: medium) {\n      --stzh-readspeaker-dropdown-position: relative;\n      --stzh-readspeaker-dropdown-top: auto;\n    }\n  }\n\n  &__dateline {\n    @include fontSize('milli');\n    @include spaceCurve('margin-top', 'regular');\n    color: $colorPrimary70;\n    margin-bottom: space('xsmall');\n  }\n\n  &__lead {\n    --stzh-base-lead-color: #{$headingColor};\n  }\n\n  &__heading:not(:empty) + &__lead:not(:empty) {\n    @include spaceCurve('margin-top', 'medium');\n  }\n\n  &__disturber {\n    z-index: $zIndexSticky;\n    position: fixed;\n    left: 0;\n    right: 0;\n    bottom: 0;\n\n    @include mq($from: medium) {\n      z-index: initial;\n      position: absolute;\n      width: calc(((100% - 7 * #{$gridGutterMedium}) / 8 * 3) + 2 * #{$gridGutterMedium});\n      left: auto;\n      bottom: calc((#{spaceCurveValue('huge', 'medium')} - #{spaceCurveValue('regular', 'medium')}) / -1);\n    }\n\n    @include mq($from: large) {\n      width: calc(((100% - 11 * #{$gridGutterLarge}) / 12 * 4) + 3 * #{$gridGutterLarge});\n      bottom: calc(#{spaceCurveValue('huge', 'large')} / -1);\n    }\n\n    @include mq($from: ultra) {\n      width: calc(((100% - 11 * #{$gridGutterUltra}) / 12 * 4) + 3 * #{$gridGutterUltra});\n    }\n  }\n\n  /* Has no image variant */\n\n  &--has-no-image &__ratio {\n    display: none;\n  }\n\n  &--has-no-image &__text {\n    @include grid;\n  }\n\n  &--has-no-image &__meta,\n  &--has-no-image &__dateline,\n  &--has-no-image &__heading,\n  &--has-no-image &__lead {\n    grid-column: 1 / span 4;\n  }\n\n  &--has-no-image &__meta,\n  &--has-no-image &__dateline,\n  &--has-no-image &__heading {\n    @include mq($from: medium) {\n      grid-column: 1 / span 8;\n    }\n  }\n\n  &--has-no-image &__lead {\n    @include mq($from: medium) {\n      grid-column: 1 / span 6;\n    }\n\n    @include mq($from: large) {\n      grid-column: 1 / span 7;\n    }\n  }\n\n  /* Has image variant */\n\n  &--has-image &__wrapper {\n    @include mq($from: medium) {\n      grid-template-columns: repeat(2, minmax(0, 1fr));\n      gap: space('xxlarge');\n    }\n  }\n\n  /* Has meta */\n\n  &--has-meta &__text {\n    @include spaceCurve('padding-top', 'regular');\n  }\n\n  /* Has tag */\n\n  &--has-tag &__readspeaker {\n    @include mq($from: medium) {\n      --stzh-readspeaker-dropdown-left: auto;\n      --stzh-readspeaker-dropdown-right: 0px;\n\n      --stzh-readspeaker-dropdown-settings-left: auto;\n      --stzh-readspeaker-dropdown-settings-right: 0px;\n    }\n  }\n\n  /* Default background */\n\n  &--background-default &__text {\n    --stzh-selection-background-color: #{$colorWhite};\n  }\n\n  /* Transparent background */\n\n  &--background-transparent &__text {\n    @include spaceCurve('padding-bottom', 'large');\n  }\n\n  /* Hyphens */\n  &--hyphens &__heading {\n    hyphens: auto;\n  }\n}\n","import { Component, Element, h, Host, Listen, Prop } from \"@stencil/core\";\n\nimport { StzhDisturberCloseEvent, StzhDisturberOpenEvent } from \"../../index\";\n\nimport { hasSlot, setPropsIfNull } from \"../../utils/utils\";\nimport { media } from \"../../utils/media-utils\";\n\n/**\n * @slot heading - Slot for `stzh-heading` element\n * @slot image - Slot for `stzh-figure` or `img` element\n * @slot lead - Slot for `stzh-text` element\n * @slot tag - Slot for `stzh-tag` element\n * @slot readspeaker - Slot for `stzh-readspeaker` element\n * @slot disturber - Slot for disturber content\n */\n@Component({\n  tag: \"stzh-pagetitle\",\n  styleUrl: \"stzh-pagetitle.scss\",\n  scoped: true,\n})\nexport class StzhPagetitle {\n  @Element() element: HTMLStzhPagetitleElement;\n\n  /** Background color */\n  @Prop({ reflect: true }) background: \"default\" | \"transparent\" = \"default\";\n\n  /** Automatic Hyphens */\n  @Prop({ reflect: true }) hyphensEnabled: boolean = false;\n\n  /** Dateline */\n  @Prop() dateline: string;\n\n  @Listen(\"resize\", { target: \"window\" })\n  handleResize() {\n    if (this.debounceResize) {\n      window.cancelAnimationFrame(this.debounceResize);\n    }\n\n    this.debounceResize = requestAnimationFrame(this.update);\n  }\n\n  @Listen(\"stzhOpen\")\n  handleStzhOpen(event: CustomEvent<StzhDisturberOpenEvent>) {\n    if (event.detail.component === \"stzh-disturber\") {\n      this.isDisturberOpen = true;\n      requestAnimationFrame(() => {\n        requestAnimationFrame(this.update);\n      });\n    }\n  }\n\n  @Listen(\"stzhClose\")\n  handleStzhClose(event: CustomEvent<StzhDisturberCloseEvent>) {\n    if (event.detail.component === \"stzh-disturber\") {\n      this.isDisturberOpen = false;\n      requestAnimationFrame(() => {\n        requestAnimationFrame(this.update);\n      });\n    }\n  }\n\n  private observer: MutationObserver;\n  private debounceResize: number;\n  private disturberElement: HTMLDivElement;\n  private isDisturberOpen: boolean = false;\n\n  private update = () => {\n    if (!this.disturberElement) {\n      return;\n    }\n\n    const isMedium = media(\"medium\").matches;\n    const disturberHeight = this.disturberElement?.offsetHeight || 0;\n    const hasDisturber = disturberHeight && this.isDisturberOpen;\n    const isStuck = hasDisturber && !isMedium;\n\n    document.documentElement.style.setProperty(\n      \"--stzh-pagetitle-disturber-height\",\n      hasDisturber ? `${disturberHeight}px` : \"0px\"\n    );\n    document.documentElement.style.setProperty(\n      \"--stzh-pagetitle-disturber-stuck-height\",\n      isStuck ? `${disturberHeight}px` : \"0px\"\n    );\n    document.documentElement.style.setProperty(\"--stzh-pagetitle-disturber-is-stuck\", isStuck ? \"1\" : \"0\");\n    document.documentElement.style.setProperty(\"--stzh-pagetitle-disturber-is-not-stuck\", isStuck ? \"0\" : \"1\");\n\n    // document.documentElement.classList.toggle(\"stzh-pagetitle-disturber-is-stuck\", isStuck);\n  };\n\n  private init = () => {\n    const heading = this.element.querySelector('stzh-heading[slot=\"heading\"], [slot=\"heading\"] stzh-heading');\n    const disturber = this.element.querySelector('stzh-disturber[slot=\"disturber\"], [slot=\"disturber\"] stzh-disturber');\n    const leads = this.element.querySelectorAll('stzh-text[slot=\"lead\"], [slot=\"lead\"] stzh-text');\n    const show = this.element.querySelector('stzh-show[slot=\"disturber\"], [slot=\"disturber\"] stzh-show');\n    const readspeakerButton = this.element.querySelector('[slot=\"readspeaker\"] stzh-button');\n    const tag = this.element.querySelector('stzh-tag[slot=\"tag\"], [slot=\"tag\"] stzh-tag');\n\n    if (heading) {\n      setPropsIfNull(heading, {\n        curve: \"hero\",\n        level: \"1\",\n      } as HTMLStzhHeadingElement);\n    }\n\n    if (disturber) {\n      setPropsIfNull(disturber, {\n        initialOpenAnimation: true,\n      } as HTMLStzhDisturberElement);\n    }\n\n    if (show) {\n      setPropsIfNull(show, {\n        mikro: true,\n      } as HTMLStzhShowElement);\n    }\n\n    if (tag) {\n      setPropsIfNull(tag, {\n        type: \"secondary\",\n        size: \"large\",\n        nonInteractive: true,\n      } as HTMLStzhTagElement);\n    }\n\n    if (readspeakerButton) {\n      setPropsIfNull(readspeakerButton, {\n        variant: \"tertiary-plain\",\n        noPaddingLeft: true,\n        noPaddingRight: true,\n        size: \"small\",\n        sizeMedium: \"tiny\",\n        buttonAccesskey: \"L\",\n      } as HTMLStzhButtonElement);\n    }\n\n    leads.forEach(lead => {\n      setPropsIfNull(lead, {\n        lead: true,\n      } as HTMLStzhTextElement);\n    });\n  };\n\n  componentDidRender() {\n    requestAnimationFrame(() => {\n      requestAnimationFrame(this.update);\n    });\n  }\n\n  connectedCallback() {\n    this.init();\n\n    this.observer = new MutationObserver(this.init);\n    this.observer.observe(this.element, {\n      childList: true,\n      subtree: true,\n    });\n  }\n\n  disconnectedCallback() {\n    this.observer?.disconnect();\n  }\n\n  render() {\n    const imageSlotUsed = hasSlot(this.element, \"image\");\n    const leadSlotUsed = hasSlot(this.element, \"lead\");\n    const tagSlotUsed = hasSlot(this.element, \"tag\");\n    const readspeakerSlotUsed = hasSlot(this.element, \"readspeaker\");\n\n    const classes = {\n      \"stzh-pagetitle\": true,\n      \"stzh-pagetitle--has-image\": imageSlotUsed,\n      \"stzh-pagetitle--has-no-image\": !imageSlotUsed,\n      \"stzh-pagetitle--has-lead\": leadSlotUsed,\n      \"stzh-pagetitle--has-tag\": tagSlotUsed,\n      \"stzh-pagetitle--has-meta\": tagSlotUsed || readspeakerSlotUsed,\n      \"stzh-pagetitle--hyphens\": this.hyphensEnabled,\n      [`stzh-pagetitle--background-${this.background}`]: !!this.background,\n    };\n\n    return (\n      <Host>\n        <div class={classes}>\n          <div class=\"stzh-pagetitle__container\">\n            <div class=\"stzh-pagetitle__wrapper\">\n              <div class=\"stzh-pagetitle__text\">\n                <div class=\"stzh-pagetitle__meta\">\n                  <div class=\"stzh-pagetitle__tag\">\n                    <slot name=\"tag\"></slot>\n                  </div>\n\n                  <div class=\"stzh-pagetitle__readspeaker\">\n                    <slot name=\"readspeaker\"></slot>\n                  </div>\n                </div>\n\n                {this.dateline && <div class=\"stzh-pagetitle__dateline\">{this.dateline}</div>}\n\n                <div class=\"stzh-pagetitle__heading\">\n                  <slot name=\"heading\"></slot>\n                </div>\n\n                <div class=\"stzh-pagetitle__lead\">\n                  <slot name=\"lead\"></slot>\n                </div>\n              </div>\n\n              <div class=\"stzh-pagetitle__image-wrapper\">\n                <stzh-ratio\n                  ratio={\"16:9\"}\n                  ratioSmall={\"3:2\"}\n                  ratioMedium={\"16:9\"}\n                  class=\"stzh-pagetitle__ratio\"\n                ></stzh-ratio>\n                <div class=\"stzh-pagetitle__image-inner-wrapper\">\n                  <slot name=\"image\"></slot>\n                </div>\n              </div>\n\n              <div class=\"stzh-pagetitle__disturber\" ref={el => (this.disturberElement = el as HTMLDivElement)}>\n                <slot name=\"disturber\"></slot>\n              </div>\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"sJAAA,MAAMA,EAAmB,qlW,MCoBZC,EAAa,M,yBA4ChBC,KAAAC,gBAA2B,MAE3BD,KAAAE,OAAS,K,MACf,IAAKF,KAAKG,iBAAkB,CAC1B,M,CAGF,MAAMC,EAAWC,EAAM,UAAUC,QACjC,MAAMC,IAAkBC,EAAAR,KAAKG,oBAAgB,MAAAK,SAAA,SAAAA,EAAEC,eAAgB,EAC/D,MAAMC,EAAeH,GAAmBP,KAAKC,gBAC7C,MAAMU,EAAUD,IAAiBN,EAEjCQ,SAASC,gBAAgBC,MAAMC,YAC7B,oCACAL,EAAe,GAAGH,MAAsB,OAE1CK,SAASC,gBAAgBC,MAAMC,YAC7B,0CACAJ,EAAU,GAAGJ,MAAsB,OAErCK,SAASC,gBAAgBC,MAAMC,YAAY,sCAAuCJ,EAAU,IAAM,KAClGC,SAASC,gBAAgBC,MAAMC,YAAY,0CAA2CJ,EAAU,IAAM,IAAI,EAKpGX,KAAAgB,KAAO,KACb,MAAMC,EAAUjB,KAAKkB,QAAQC,cAAc,+DAC3C,MAAMC,EAAYpB,KAAKkB,QAAQC,cAAc,uEAC7C,MAAME,EAAQrB,KAAKkB,QAAQI,iBAAiB,mDAC5C,MAAMC,EAAOvB,KAAKkB,QAAQC,cAAc,6DACxC,MAAMK,EAAoBxB,KAAKkB,QAAQC,cAAc,oCACrD,MAAMM,EAAMzB,KAAKkB,QAAQC,cAAc,+CAEvC,GAAIF,EAAS,CACXS,EAAeT,EAAS,CACtBU,MAAO,OACPC,MAAO,K,CAIX,GAAIR,EAAW,CACbM,EAAeN,EAAW,CACxBS,qBAAsB,M,CAI1B,GAAIN,EAAM,CACRG,EAAeH,EAAM,CACnBO,MAAO,M,CAIX,GAAIL,EAAK,CACPC,EAAeD,EAAK,CAClBM,KAAM,YACNC,KAAM,QACNC,eAAgB,M,CAIpB,GAAIT,EAAmB,CACrBE,EAAeF,EAAmB,CAChCU,QAAS,iBACTC,cAAe,KACfC,eAAgB,KAChBJ,KAAM,QACNK,WAAY,OACZC,gBAAiB,K,CAIrBjB,EAAMkB,SAAQC,IACZd,EAAec,EAAM,CACnBA,KAAM,MACiB,GACzB,E,gBApH6D,U,oBAGd,M,wBAMnD,YAAAC,GACE,GAAIzC,KAAK0C,eAAgB,CACvBC,OAAOC,qBAAqB5C,KAAK0C,e,CAGnC1C,KAAK0C,eAAiBG,sBAAsB7C,KAAKE,O,CAInD,cAAA4C,CAAeC,GACb,GAAIA,EAAMC,OAAOC,YAAc,iBAAkB,CAC/CjD,KAAKC,gBAAkB,KACvB4C,uBAAsB,KACpBA,sBAAsB7C,KAAKE,OAAO,G,EAMxC,eAAAgD,CAAgBH,GACd,GAAIA,EAAMC,OAAOC,YAAc,iBAAkB,CAC/CjD,KAAKC,gBAAkB,MACvB4C,uBAAsB,KACpBA,sBAAsB7C,KAAKE,OAAO,G,EAuFxC,kBAAAiD,GACEN,uBAAsB,KACpBA,sBAAsB7C,KAAKE,OAAO,G,CAItC,iBAAAkD,GACEpD,KAAKgB,OAELhB,KAAKqD,SAAW,IAAIC,iBAAiBtD,KAAKgB,MAC1ChB,KAAKqD,SAASE,QAAQvD,KAAKkB,QAAS,CAClCsC,UAAW,KACXC,QAAS,M,CAIb,oBAAAC,G,OACElD,EAAAR,KAAKqD,YAAQ,MAAA7C,SAAA,SAAAA,EAAEmD,Y,CAGjB,MAAAC,GACE,MAAMC,EAAgBC,EAAQ9D,KAAKkB,QAAS,SAC5C,MAAM6C,EAAeD,EAAQ9D,KAAKkB,QAAS,QAC3C,MAAM8C,EAAcF,EAAQ9D,KAAKkB,QAAS,OAC1C,MAAM+C,EAAsBH,EAAQ9D,KAAKkB,QAAS,eAElD,MAAMgD,EAAU,CACd,iBAAkB,KAClB,4BAA6BL,EAC7B,gCAAiCA,EACjC,2BAA4BE,EAC5B,0BAA2BC,EAC3B,2BAA4BA,GAAeC,EAC3C,0BAA2BjE,KAAKmE,eAChC,CAAC,8BAA8BnE,KAAKoE,gBAAiBpE,KAAKoE,YAG5D,OACEC,EAACC,EAAI,KACHD,EAAA,OAAKE,MAAOL,GACVG,EAAA,OAAKE,MAAM,6BACTF,EAAA,OAAKE,MAAM,2BACTF,EAAA,OAAKE,MAAM,wBACTF,EAAA,OAAKE,MAAM,wBACTF,EAAA,OAAKE,MAAM,uBACTF,EAAA,QAAMG,KAAK,SAGbH,EAAA,OAAKE,MAAM,+BACTF,EAAA,QAAMG,KAAK,kBAIdxE,KAAKyE,UAAYJ,EAAA,OAAKE,MAAM,4BAA4BvE,KAAKyE,UAE9DJ,EAAA,OAAKE,MAAM,2BACTF,EAAA,QAAMG,KAAK,aAGbH,EAAA,OAAKE,MAAM,wBACTF,EAAA,QAAMG,KAAK,WAIfH,EAAA,OAAKE,MAAM,iCACTF,EAAA,cACEK,MAAO,OACPC,WAAY,MACZC,YAAa,OACbL,MAAM,0BAERF,EAAA,OAAKE,MAAM,uCACTF,EAAA,QAAMG,KAAK,YAIfH,EAAA,OAAKE,MAAM,4BAA4BM,IAAKC,GAAO9E,KAAKG,iBAAmB2E,GACzET,EAAA,QAAMG,KAAK,kB"}

package/dist/stzh-components/p-b047262a.entry.js

@@ -1,2 +0,0 @@
-import{r as t,h as e,a as s}from"./p-c7bfac7a.js";const l=':host{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);color:var(--stzh-base-color);box-sizing:border-box;display:block;}:host[hidden]{display:none}:host::-moz-selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}:host::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}:host *,:host *::before,:host *::after{box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness);-webkit-text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink);text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink)}:host .has-focus{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}:host .stzh-fylingfocus-focused{outline-style:none !important}:host .stzh-fylingfocus-focused::-moz-focus-inner{border:0 !important}:host{width:100%;--row-gap:var(--stzh-row-row-gap, 0px)}:host([span="1"]) ::slotted(stzh-cell:not([span])){--cell-width:8.3333333333%}:host([span="2"]) ::slotted(stzh-cell:not([span])){--cell-width:16.6666666667%}:host([span="3"]) ::slotted(stzh-cell:not([span])){--cell-width:25%}:host([span="4"]) ::slotted(stzh-cell:not([span])){--cell-width:33.3333333333%}:host([span="5"]) ::slotted(stzh-cell:not([span])){--cell-width:41.6666666667%}:host([span="6"]) ::slotted(stzh-cell:not([span])){--cell-width:50%}:host([span="7"]) ::slotted(stzh-cell:not([span])){--cell-width:58.3333333333%}:host([span="8"]) ::slotted(stzh-cell:not([span])){--cell-width:66.6666666667%}:host([span="9"]) ::slotted(stzh-cell:not([span])){--cell-width:75%}:host([span="10"]) ::slotted(stzh-cell:not([span])){--cell-width:83.3333333333%}:host([span="11"]) ::slotted(stzh-cell:not([span])){--cell-width:91.6666666667%}:host([span="12"]) ::slotted(stzh-cell:not([span])){--cell-width:100%}@media screen and (min-width: 600px){:host([span-small="1"]) ::slotted(stzh-cell:not([span-small])){--cell-width:8.3333333333%}}@media screen and (min-width: 600px){:host([span-small="2"]) ::slotted(stzh-cell:not([span-small])){--cell-width:16.6666666667%}}@media screen and (min-width: 600px){:host([span-small="3"]) ::slotted(stzh-cell:not([span-small])){--cell-width:25%}}@media screen and (min-width: 600px){:host([span-small="4"]) ::slotted(stzh-cell:not([span-small])){--cell-width:33.3333333333%}}@media screen and (min-width: 600px){:host([span-small="5"]) ::slotted(stzh-cell:not([span-small])){--cell-width:41.6666666667%}}@media screen and (min-width: 600px){:host([span-small="6"]) ::slotted(stzh-cell:not([span-small])){--cell-width:50%}}@media screen and (min-width: 600px){:host([span-small="7"]) ::slotted(stzh-cell:not([span-small])){--cell-width:58.3333333333%}}@media screen and (min-width: 600px){:host([span-small="8"]) ::slotted(stzh-cell:not([span-small])){--cell-width:66.6666666667%}}@media screen and (min-width: 600px){:host([span-small="9"]) ::slotted(stzh-cell:not([span-small])){--cell-width:75%}}@media screen and (min-width: 600px){:host([span-small="10"]) ::slotted(stzh-cell:not([span-small])){--cell-width:83.3333333333%}}@media screen and (min-width: 600px){:host([span-small="11"]) ::slotted(stzh-cell:not([span-small])){--cell-width:91.6666666667%}}@media screen and (min-width: 600px){:host([span-small="12"]) ::slotted(stzh-cell:not([span-small])){--cell-width:100%}}@media screen and (min-width: 900px){:host([span-medium="1"]) ::slotted(stzh-cell:not([span-medium])){--cell-width:8.3333333333%}}@media screen and (min-width: 900px){:host([span-medium="2"]) ::slotted(stzh-cell:not([span-medium])){--cell-width:16.6666666667%}}@media screen and (min-width: 900px){:host([span-medium="3"]) ::slotted(stzh-cell:not([span-medium])){--cell-width:25%}}@media screen and (min-width: 900px){:host([span-medium="4"]) ::slotted(stzh-cell:not([span-medium])){--cell-width:33.3333333333%}}@media screen and (min-width: 900px){:host([span-medium="5"]) ::slotted(stzh-cell:not([span-medium])){--cell-width:41.6666666667%}}@media screen and (min-width: 900px){:host([span-medium="6"]) ::slotted(stzh-cell:not([span-medium])){--cell-width:50%}}@media screen and (min-width: 900px){:host([span-medium="7"]) ::slotted(stzh-cell:not([span-medium])){--cell-width:58.3333333333%}}@media screen and (min-width: 900px){:host([span-medium="8"]) ::slotted(stzh-cell:not([span-medium])){--cell-width:66.6666666667%}}@media screen and (min-width: 900px){:host([span-medium="9"]) ::slotted(stzh-cell:not([span-medium])){--cell-width:75%}}@media screen and (min-width: 900px){:host([span-medium="10"]) ::slotted(stzh-cell:not([span-medium])){--cell-width:83.3333333333%}}@media screen and (min-width: 900px){:host([span-medium="11"]) ::slotted(stzh-cell:not([span-medium])){--cell-width:91.6666666667%}}@media screen and (min-width: 900px){:host([span-medium="12"]) ::slotted(stzh-cell:not([span-medium])){--cell-width:100%}}@media screen and (min-width: 1260px){:host([span-large="1"]) ::slotted(stzh-cell:not([span-large])){--cell-width:8.3333333333%}}@media screen and (min-width: 1260px){:host([span-large="2"]) ::slotted(stzh-cell:not([span-large])){--cell-width:16.6666666667%}}@media screen and (min-width: 1260px){:host([span-large="3"]) ::slotted(stzh-cell:not([span-large])){--cell-width:25%}}@media screen and (min-width: 1260px){:host([span-large="4"]) ::slotted(stzh-cell:not([span-large])){--cell-width:33.3333333333%}}@media screen and (min-width: 1260px){:host([span-large="5"]) ::slotted(stzh-cell:not([span-large])){--cell-width:41.6666666667%}}@media screen and (min-width: 1260px){:host([span-large="6"]) ::slotted(stzh-cell:not([span-large])){--cell-width:50%}}@media screen and (min-width: 1260px){:host([span-large="7"]) ::slotted(stzh-cell:not([span-large])){--cell-width:58.3333333333%}}@media screen and (min-width: 1260px){:host([span-large="8"]) ::slotted(stzh-cell:not([span-large])){--cell-width:66.6666666667%}}@media screen and (min-width: 1260px){:host([span-large="9"]) ::slotted(stzh-cell:not([span-large])){--cell-width:75%}}@media screen and (min-width: 1260px){:host([span-large="10"]) ::slotted(stzh-cell:not([span-large])){--cell-width:83.3333333333%}}@media screen and (min-width: 1260px){:host([span-large="11"]) ::slotted(stzh-cell:not([span-large])){--cell-width:91.6666666667%}}@media screen and (min-width: 1260px){:host([span-large="12"]) ::slotted(stzh-cell:not([span-large])){--cell-width:100%}}@media screen and (min-width: 1600px){:host([span-ultra="1"]) ::slotted(stzh-cell:not([span-ultra])){--cell-width:8.3333333333%}}@media screen and (min-width: 1600px){:host([span-ultra="2"]) ::slotted(stzh-cell:not([span-ultra])){--cell-width:16.6666666667%}}@media screen and (min-width: 1600px){:host([span-ultra="3"]) ::slotted(stzh-cell:not([span-ultra])){--cell-width:25%}}@media screen and (min-width: 1600px){:host([span-ultra="4"]) ::slotted(stzh-cell:not([span-ultra])){--cell-width:33.3333333333%}}@media screen and (min-width: 1600px){:host([span-ultra="5"]) ::slotted(stzh-cell:not([span-ultra])){--cell-width:41.6666666667%}}@media screen and (min-width: 1600px){:host([span-ultra="6"]) ::slotted(stzh-cell:not([span-ultra])){--cell-width:50%}}@media screen and (min-width: 1600px){:host([span-ultra="7"]) ::slotted(stzh-cell:not([span-ultra])){--cell-width:58.3333333333%}}@media screen and (min-width: 1600px){:host([span-ultra="8"]) ::slotted(stzh-cell:not([span-ultra])){--cell-width:66.6666666667%}}@media screen and (min-width: 1600px){:host([span-ultra="9"]) ::slotted(stzh-cell:not([span-ultra])){--cell-width:75%}}@media screen and (min-width: 1600px){:host([span-ultra="10"]) ::slotted(stzh-cell:not([span-ultra])){--cell-width:83.3333333333%}}@media screen and (min-width: 1600px){:host([span-ultra="11"]) ::slotted(stzh-cell:not([span-ultra])){--cell-width:91.6666666667%}}@media screen and (min-width: 1600px){:host([span-ultra="12"]) ::slotted(stzh-cell:not([span-ultra])){--cell-width:100%}}.stzh-row{display:flex;flex-wrap:wrap;justify-content:flex-start;row-gap:var(--row-gap);margin-left:calc(var(--stzh-grid-gutter) / -2);margin-right:calc(var(--stzh-grid-gutter) / -2);}@media screen and (min-width: 600px){.stzh-row{margin-left:calc(var(--stzh-grid-gutter-small) / -2);margin-right:calc(var(--stzh-grid-gutter-small) / -2)}}@media screen and (min-width: 900px){.stzh-row{margin-left:calc(var(--stzh-grid-gutter-medium) / -2);margin-right:calc(var(--stzh-grid-gutter-medium) / -2)}}@media screen and (min-width: 1260px){.stzh-row{margin-left:calc(var(--stzh-grid-gutter-large) / -2);margin-right:calc(var(--stzh-grid-gutter-large) / -2)}}@media screen and (min-width: 1600px){.stzh-row{margin-left:calc(var(--stzh-grid-gutter-ultra) / -2);margin-right:calc(var(--stzh-grid-gutter-ultra) / -2)}}.stzh-row--justify-end{justify-content:flex-end}.stzh-row--justify-center{justify-content:center}.stzh-row--justify-between{justify-content:space-between}.stzh-row--justify-around{justify-content:space-around}.stzh-row--justify-evenly{justify-content:space-evenly}.stzh-row--items-end{align-items:flex-end}.stzh-row--items-center{align-items:center}.stzh-row--items-baseline{align-items:baseline}.stzh-row--items-stretch{align-items:stretch}.stzh-row--content-end{align-content:flex-end}.stzh-row--content-center{align-content:center}.stzh-row--content-between{align-content:space-between}.stzh-row--content-around{align-content:space-around}.stzh-row--content-evenly{align-content:space-evenly}';const n=class{constructor(e){t(this,e);this.span=12;this.spanSmall=undefined;this.spanMedium=undefined;this.spanLarge=undefined;this.spanUltra=undefined;this.justify="start";this.items="start";this.content="start"}render(){return e(s,null,e("div",{class:{"stzh-row":true,[`stzh-row--justify-${this.justify}`]:!!this.justify,[`stzh-row--items-${this.items}`]:!!this.items,[`stzh-row--content-${this.content}`]:!!this.content}},e("slot",null)))}};n.style=l;export{n as stzh_row};
-//# sourceMappingURL=p-b047262a.entry.js.map

package/dist/stzh-components/p-b047262a.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["stzhRowCss","StzhRow","render","h","Host","class","this","justify","items","content"],"sources":["src/components/stzh-row/stzh-row.scss?tag=stzh-row&encapsulation=shadow","src/components/stzh-row/stzh-row.tsx"],"sourcesContent":[":host {\n  width: 100%;\n\n  --row-gap: var(--stzh-row-row-gap, 0px);\n}\n\n@mixin cellProps($breakpoint: null) {\n  @for $i from 1 through $gridCells {\n    @if $breakpoint {\n      :host([span-#{$breakpoint}=\"#{$i}\"])\n      ::slotted(stzh-cell:not([span-#{$breakpoint}])) {\n        @include mq($from: $breakpoint) {\n          --cell-width: #{100% / ($gridCells / $i)};\n        }\n      }\n    } @else {\n      :host([span=\"#{$i}\"])\n      ::slotted(stzh-cell:not([span])) {\n        --cell-width: #{100% / ($gridCells / $i)};\n      }\n    }\n  }\n}\n\n@include cellProps();\n\n@each $breakpoint, $size in $breakpoints {\n  @include cellProps($breakpoint);\n}\n\n.stzh-row {\n  display: flex;\n\tflex-wrap: wrap;\n\tjustify-content: flex-start;\n  row-gap: var(--row-gap);\n  margin-left: calc(#{$gridGutter} / -2);\n  margin-right: calc(#{$gridGutter} / -2);\n\n  @include mq($from: small) {\n    margin-left: calc(#{$gridGutterSmall} / -2);\n    margin-right: calc(#{$gridGutterSmall} / -2);\n  }\n\n  @include mq($from: medium) {\n    margin-left: calc(#{$gridGutterMedium} / -2);\n    margin-right: calc(#{$gridGutterMedium} / -2);\n  }\n\n  @include mq($from: large) {\n    margin-left: calc(#{$gridGutterLarge} / -2);\n    margin-right: calc(#{$gridGutterLarge} / -2);\n  }\n\n  @include mq($from: ultra) {\n    margin-left: calc(#{$gridGutterUltra} / -2);\n    margin-right: calc(#{$gridGutterUltra} / -2);\n  }\n\n  /* Justify content variants */\n\n  &--justify-end {\n    justify-content: flex-end;\n  }\n\n  &--justify-center {\n    justify-content: center;\n  }\n\n  &--justify-between {\n    justify-content: space-between;\n  }\n\n  &--justify-around {\n    justify-content: space-around;\n  }\n\n  &--justify-evenly {\n    justify-content: space-evenly;\n  }\n\n  /* Align items variants */\n\n  &--items-end {\n    align-items: flex-end;\n  }\n\n  &--items-center {\n    align-items: center;\n  }\n\n  &--items-baseline {\n    align-items: baseline;\n  }\n\n  &--items-stretch {\n    align-items: stretch;\n  }\n\n  /* Align content variants */\n\n  &--content-end {\n    align-content: flex-end;\n  }\n\n  &--content-center {\n    align-content: center;\n  }\n\n  &--content-between {\n    align-content: space-between;\n  }\n\n  &--content-around {\n    align-content: space-around;\n  }\n\n  &--content-evenly {\n    align-content: space-evenly;\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n} from \"@stencil/core\";\n\nimport { Layout } from \"../../index\";\n\n/**\n * @slot - Slot for `stzh-cell` elements\n */\n@Component({\n  tag: \"stzh-row\",\n  styleUrl: \"stzh-row.scss\",\n  shadow: true\n})\nexport class StzhRow {\n  /** Default span of each cell */\n  @Prop({ reflect: true }) span: number = 12;\n  /** Default span of each cell above small breakpoint */\n  @Prop({ reflect: true }) spanSmall: number;\n  /** Default span of each cell above medium breakpoint */\n  @Prop({ reflect: true }) spanMedium: number;\n  /** Default span of each cell above large breakpoint */\n  @Prop({ reflect: true }) spanLarge: number;\n  /** Default span of each cell above ultra breakpoint */\n  @Prop({ reflect: true }) spanUltra: number;\n\n  /** Controlling how cells are positioned along a container's main axis */\n  @Prop({ reflect: true }) justify: Layout.Justify = \"start\";\n\n  /** Control how cells items are positioned along a container's cross axis */\n  @Prop({ reflect: true }) items: Layout.Items = \"start\";\n\n  /** Utilities for controlling how rows are positioned in multi-row flex containers. */\n  @Prop({ reflect: true }) content: Layout.Justify = \"start\";\n\n  render() {\n    return (\n      <Host>\n        <div\n          class={{\n            \"stzh-row\": true,\n            [`stzh-row--justify-${this.justify}`]: !!this.justify,\n            [`stzh-row--items-${this.items}`]: !!this.items,\n            [`stzh-row--content-${this.content}`]: !!this.content\n          }}\n        >\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAa,60S,MCiBNC,EAAO,M,mCAEsB,G,kHAWW,Q,WAGJ,Q,aAGI,O,CAEnD,MAAAC,GACE,OACEC,EAACC,EAAI,KACHD,EAAA,OACEE,MAAO,CACL,WAAY,KACZ,CAAC,qBAAqBC,KAAKC,aAAcD,KAAKC,QAC9C,CAAC,mBAAmBD,KAAKE,WAAYF,KAAKE,MAC1C,CAAC,qBAAqBF,KAAKG,aAAcH,KAAKG,UAGhDN,EAAA,c"}