@oiz/stzh-components 3.3.0-beta5 → 3.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/{app-globals-95815145.js → app-globals-333c7ab2.js} +2 -2
- package/dist/cjs/{app-globals-95815145.js.map → app-globals-333c7ab2.js.map} +1 -1
- package/dist/cjs/index-92254d32.js +6 -10
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/stzh-appointments.cjs.entry.js +19 -2
- package/dist/cjs/stzh-appointments.cjs.entry.js.map +1 -1
- package/dist/cjs/stzh-badge_3.cjs.entry.js +1 -1
- package/dist/cjs/stzh-badge_3.cjs.entry.js.map +1 -1
- package/dist/cjs/stzh-components.cjs.js +2 -2
- package/dist/cjs/stzh-datepicker_3.cjs.entry.js +1 -1
- package/dist/cjs/stzh-datepicker_3.cjs.entry.js.map +1 -1
- package/dist/cjs/{stzh-dialog.cjs.entry.js → stzh-dialog_2.cjs.entry.js} +141 -1
- package/dist/cjs/stzh-dialog_2.cjs.entry.js.map +1 -0
- package/dist/cjs/stzh-header.cjs.entry.js +29 -19
- package/dist/cjs/stzh-header.cjs.entry.js.map +1 -1
- package/dist/cjs/stzh-saptcha.cjs.entry.js +9 -1
- package/dist/cjs/stzh-saptcha.cjs.entry.js.map +1 -1
- package/dist/cjs/stzh-upload.cjs.entry.js +25 -14
- package/dist/cjs/stzh-upload.cjs.entry.js.map +1 -1
- package/dist/collection/assets/i18n/de.json +6 -4
- package/dist/collection/assets/i18n/en.json +6 -4
- package/dist/collection/components/stzh-button/stzh-button.css +3 -2
- package/dist/collection/components/stzh-header/stzh-header.css +1 -1
- package/dist/collection/components/stzh-header/stzh-header.js +39 -25
- package/dist/collection/components/stzh-header/stzh-header.js.map +1 -1
- package/dist/collection/components/stzh-header/stzh-header.stories.js +7 -9
- package/dist/collection/components/stzh-radiogroup/stzh-radiogroup.css +6 -0
- package/dist/collection/components/stzh-radiogroup/stzh-radiogroup.stories.js +10 -0
- package/dist/collection/components/stzh-saptcha/stzh-saptcha.js +16 -1
- package/dist/collection/components/stzh-saptcha/stzh-saptcha.js.map +1 -1
- package/dist/collection/components/stzh-saptcha/stzh-saptcha.stories.js +2 -1
- package/dist/collection/components/stzh-upload/stzh-upload.js +26 -15
- package/dist/collection/components/stzh-upload/stzh-upload.js.map +1 -1
- package/dist/collection/components/stzh-upload/stzh-upload.localization.js.map +1 -1
- package/dist/collection/components/stzh-upload/stzh-upload.stories.js +1 -1
- package/dist/collection/index.js.map +1 -1
- package/dist/components/index.js +1 -1
- package/dist/components/index2.js.map +1 -1
- package/dist/components/stzh-appointments.js +18 -1
- package/dist/components/stzh-appointments.js.map +1 -1
- package/dist/components/stzh-button2.js +1 -1
- package/dist/components/stzh-button2.js.map +1 -1
- package/dist/components/stzh-header.js +33 -22
- package/dist/components/stzh-header.js.map +1 -1
- package/dist/components/stzh-radiogroup2.js +1 -1
- package/dist/components/stzh-radiogroup2.js.map +1 -1
- package/dist/components/stzh-saptcha.js +12 -2
- package/dist/components/stzh-saptcha.js.map +1 -1
- package/dist/components/stzh-toastbar.js +1 -185
- package/dist/components/stzh-toastbar.js.map +1 -1
- package/dist/{esm/stzh-toastbar.entry.js → components/stzh-toastbar2.js} +56 -11
- package/dist/components/stzh-toastbar2.js.map +1 -0
- package/dist/components/stzh-upload.js +53 -30
- package/dist/components/stzh-upload.js.map +1 -1
- package/dist/esm/{app-globals-10ef946d.js → app-globals-cff24d08.js} +2 -2
- package/dist/esm/{app-globals-10ef946d.js.map → app-globals-cff24d08.js.map} +1 -1
- package/dist/esm/index-e3050b18.js +6 -10
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/loader.js +2 -2
- package/dist/esm/stzh-appointments.entry.js +18 -1
- package/dist/esm/stzh-appointments.entry.js.map +1 -1
- package/dist/esm/stzh-badge_3.entry.js +1 -1
- package/dist/esm/stzh-badge_3.entry.js.map +1 -1
- package/dist/esm/stzh-components.js +2 -2
- package/dist/esm/stzh-datepicker_3.entry.js +1 -1
- package/dist/esm/stzh-datepicker_3.entry.js.map +1 -1
- package/dist/esm/{stzh-dialog.entry.js → stzh-dialog_2.entry.js} +141 -2
- package/dist/esm/stzh-dialog_2.entry.js.map +1 -0
- package/dist/esm/stzh-header.entry.js +29 -19
- package/dist/esm/stzh-header.entry.js.map +1 -1
- package/dist/esm/stzh-saptcha.entry.js +9 -1
- package/dist/esm/stzh-saptcha.entry.js.map +1 -1
- package/dist/esm/stzh-upload.entry.js +25 -14
- package/dist/esm/stzh-upload.entry.js.map +1 -1
- package/dist/stzh-components/assets/i18n/de.json +6 -4
- package/dist/stzh-components/assets/i18n/en.json +6 -4
- package/dist/stzh-components/index.esm.js.map +1 -1
- package/dist/stzh-components/{p-487b6e52.entry.js → p-35bf0d6a.entry.js} +2 -2
- package/dist/stzh-components/{p-487b6e52.entry.js.map → p-35bf0d6a.entry.js.map} +1 -1
- package/dist/stzh-components/p-37a50532.entry.js +2 -0
- package/dist/stzh-components/p-37a50532.entry.js.map +1 -0
- package/dist/stzh-components/{p-9d050177.entry.js → p-50c32fd1.entry.js} +2 -2
- package/dist/stzh-components/p-50c32fd1.entry.js.map +1 -0
- package/dist/stzh-components/p-5d9912f3.entry.js +2 -0
- package/dist/stzh-components/p-5d9912f3.entry.js.map +1 -0
- package/dist/stzh-components/p-cf4727ad.entry.js +2 -0
- package/dist/stzh-components/p-cf4727ad.entry.js.map +1 -0
- package/dist/stzh-components/p-e45e3147.js +2 -0
- package/dist/stzh-components/{p-45be0b3e.js.map → p-e45e3147.js.map} +1 -1
- package/dist/stzh-components/p-ecbac5ca.entry.js +2 -0
- package/dist/stzh-components/p-ecbac5ca.entry.js.map +1 -0
- package/dist/stzh-components/p-f63a00c1.entry.js +2 -0
- package/dist/stzh-components/p-f63a00c1.entry.js.map +1 -0
- package/dist/stzh-components/stzh-components.esm.js +1 -1
- package/dist/stzh-components/stzh-components.esm.js.map +1 -1
- package/dist/types/components/stzh-header/stzh-header.d.ts +7 -5
- package/dist/types/components/stzh-saptcha/stzh-saptcha.d.ts +4 -0
- package/dist/types/components/stzh-upload/stzh-upload.d.ts +1 -0
- package/dist/types/components/stzh-upload/stzh-upload.localization.d.ts +2 -0
- package/dist/types/components.d.ts +12 -12
- package/dist/types/index.d.ts +5 -5
- package/dist/vscode-data.json +9 -5
- package/package.json +1 -1
- package/dist/cjs/stzh-dialog.cjs.entry.js.map +0 -1
- package/dist/cjs/stzh-toastbar.cjs.entry.js +0 -148
- package/dist/cjs/stzh-toastbar.cjs.entry.js.map +0 -1
- package/dist/cjs/translation-utils-18767769.js +0 -23
- package/dist/cjs/translation-utils-18767769.js.map +0 -1
- package/dist/components/translation-utils.js +0 -21
- package/dist/components/translation-utils.js.map +0 -1
- package/dist/esm/stzh-dialog.entry.js.map +0 -1
- package/dist/esm/stzh-toastbar.entry.js.map +0 -1
- package/dist/esm/translation-utils-ffb7823c.js +0 -21
- package/dist/esm/translation-utils-ffb7823c.js.map +0 -1
- package/dist/stzh-components/p-24feb79f.entry.js +0 -2
- package/dist/stzh-components/p-24feb79f.entry.js.map +0 -1
- package/dist/stzh-components/p-287f518f.entry.js +0 -2
- package/dist/stzh-components/p-287f518f.entry.js.map +0 -1
- package/dist/stzh-components/p-41529de9.js +0 -2
- package/dist/stzh-components/p-41529de9.js.map +0 -1
- package/dist/stzh-components/p-45be0b3e.js +0 -2
- package/dist/stzh-components/p-4f7f4362.entry.js +0 -2
- package/dist/stzh-components/p-4f7f4362.entry.js.map +0 -1
- package/dist/stzh-components/p-9d050177.entry.js.map +0 -1
- package/dist/stzh-components/p-acd03caf.entry.js +0 -2
- package/dist/stzh-components/p-acd03caf.entry.js.map +0 -1
- package/dist/stzh-components/p-bb4dea97.entry.js +0 -2
- package/dist/stzh-components/p-bb4dea97.entry.js.map +0 -1
- package/dist/stzh-components/p-f0887c02.entry.js +0 -2
- package/dist/stzh-components/p-f0887c02.entry.js.map +0 -1
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"stzh-dialog.entry.cjs.js","mappings":"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","names":["setPropsIfNull","createFocusTrap","createBaseFocusTrapOptions","h","Host"],"sources":["src/components/stzh-dialog/stzh-dialog.scss?tag=stzh-dialog&encapsulation=scoped","src/components/stzh-dialog/stzh-dialog.tsx"],"sourcesContent":["/**\n * @prop --width: Width of dialog\n * @prop --padding-top: Padding top of dialog\n * @prop --padding-bottom: Padding bottom of dialog\n * @prop --padding-left: Padding left of dialog\n * @prop --padding-right: Padding right of dialog\n * @prop --backdrop-opacity: Opacity of dialog backdrop\n * @prop --backdrop-background-color: Opacity of dialog background color\n *\n * @prop --stzh-dialog-backdrop-opacity: **Global**: Opacity of backdrops\n * @prop --stzh-dialog-backdrop-background-color: **Global**: Background color of backdrops\n */\n\n:host {\n @include spaceCurve('--padding-top', 'large');\n @include spaceCurve('--padding-bottom', 'large');\n @include spaceCurve('--padding-left', 'medium');\n @include spaceCurve('--padding-right', 'medium');\n --width: 100%;\n --backdrop-opacity: #{$dialogBackdropOpacity};\n --backdrop-background-color: #{$dialogBackdropBackgroundColor};\n\n @include mq($from: small) {\n --width: 536px;\n }\n\n @include mq($from: medium) {\n --width: 610px; // 786 before\n }\n\n @include mq($from: large) {\n --width: 866px; // 832 before\n }\n\n @include mq($from: ultra) {\n --width: 888px;\n }\n\n &[size=\"small\"] {\n @include mq($from: small) {\n --width: 395px;\n }\n\n @include mq($from: medium) {\n --width: 460px;\n }\n\n @include mq($from: large) {\n --width: 512px;\n }\n }\n}\n\n.stzh-dialog {\n z-index: $zIndexDialog;\n display: none;\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n flex-direction: column;\n align-items: stretch;\n justify-content: stretch;\n\n &__content {\n z-index: 2;\n position: relative;\n display: flex;\n flex-direction: column;\n align-items: center;\n flex-grow: 1;\n overflow: auto;\n }\n\n &__dialog {\n position: relative;\n display: flex;\n flex-direction: column;\n margin: auto;\n border: none;\n background-color: $colorWhite;\n width: var(--width);\n max-width: 100%;\n box-shadow: $boxShadowOverlay;\n height: 100vh;\n max-height: 100vh;\n // overflow: visible;\n overflow: hidden;\n outline: none;\n\n @include mq($from: small) {\n height: auto;\n }\n }\n\n &__backdrop {\n z-index: 1;\n position: absolute;\n top: 0px;\n left: 0px;\n width: 100%;\n height: 100%;\n overflow-x: hidden;\n overflow-y: auto;\n text-align: center;\n background-color: var(--backdrop-background-color);\n opacity: var(--backdrop-opacity);\n }\n\n &__heading {\n @include spaceCurve('padding-bottom', 'regular');\n padding-top: var(--padding-top);\n padding-left: var(--padding-left);\n padding-right: var(--padding-right);\n }\n\n &__dialog-content {\n padding-left: var(--padding-left);\n padding-right: var(--padding-right);\n @include spaceCurve('padding-top', 'medium');\n @include spaceCurve('padding-bottom', 'medium');\n overflow: auto;\n flex-grow: 1;\n }\n\n &__actions {\n &:not(:empty) {\n padding-top: space('medium');\n padding-bottom: var(--padding-bottom);\n padding-left: var(--padding-left);\n padding-right: var(--padding-right);\n }\n }\n\n &__close-button {\n position: absolute;\n top: space('xsmall');\n right: space('xsmall');\n\n @include mq($from: medium) {\n top: space('large');\n right: space('large');\n }\n }\n\n &--is-open {\n display: flex;\n }\n}\n","import {\n Host,\n Component,\n Element,\n Method,\n Listen,\n Prop,\n Event,\n EventEmitter,\n h,\n} from \"@stencil/core\";\n\nimport {\n StzhDialogOpenEvent,\n StzhDialogCloseEvent\n} from \"../../index\";\n\nimport { setPropsIfNull } from \"../../utils/utils\";\nimport { createBaseFocusTrapOptions } from \"../../utils/overlay-utils\";\n\nimport { StzhDialogLocalizedText } from \"./stzh-dialog.localization\"\n\nimport { createFocusTrap, FocusTrap } from 'focus-trap';\n\nconst CLASS_BODY_OPEN = \"stzh-dialog-open\";\n\nlet activeDialog: StzhDialog = null;\nlet dialogCounter = 0;\n\n/**\n * @slot actions - Slot for actions element\n * @slot - Slot for any content inside the dialog\n */\n@Component({\n tag: \"stzh-dialog\",\n styleUrl: \"stzh-dialog.scss\",\n scoped: true\n})\nexport class StzhDialog {\n /** Translation strings */\n @Prop() localization: StzhDialogLocalizedText;\n\n /** Close dialog when pressing ESC */\n @Prop() closeOnEscapeKey: boolean = false;\n\n /** Close dialog when clicking outside of it */\n @Prop() closeOnBackdropClick: boolean = false;\n\n /** Open status */\n @Prop({ mutable: true }) open: boolean = false;\n\n /** Stay in original position (true) or move to body (false) */\n @Prop() stay: boolean = true;\n\n /** Size */\n @Prop({ reflect: true }) size: \"default\" | \"small\" = \"default\";\n\n /** Whether to hide close button */\n @Prop() hideClose: boolean = false;\n\n /** Heading text */\n @Prop() heading: string = \"\";\n\n /** Accessibility role */\n @Prop({ attribute: \"a11y-role\" }) a11yRole: \"dialog\" | \"alertdialog\" = \"alertdialog\";\n\n /** Accessible label for dialog (use if no heading is used) */\n @Prop({ attribute: \"a11y-label\" }) a11yLabel: string = \"\";\n\n /**\n * For Adobe Analytics.\n * Will be rendered as value of `s-object-id` attribute to the close button element.\n * Default value will be taken from translations.\n */\n @Prop() closeAnalyticsId: string;\n\n /** Dialog open event */\n @Event() stzhOpen: EventEmitter<StzhDialogOpenEvent>;\n\n /** Dialog close event */\n @Event() stzhClose: EventEmitter<StzhDialogCloseEvent>;\n\n @Element() element: HTMLStzhDialogElement;\n\n @Listen(\"click\", { target: \"document\", capture: true })\n handleOutsideClick(event: MouseEvent) {\n if (!this.open || !this.closeOnBackdropClick) {\n return\n }\n\n const isClickOutside = event.target !== this.dialogElement\n && this.dialogElement.contains(event.target as HTMLElement) === false\n\n if (isClickOutside) {\n this.hide()\n }\n }\n\n @Listen(\"keydown\", { target: \"document\" })\n handleKeydown(event: KeyboardEvent) {\n if (\n event.key === \"Escape\"\n && activeDialog === this\n && this.closeOnEscapeKey\n ) {\n this.hide();\n }\n }\n\n @Listen(\"click\", { target: \"document\" })\n handleOpenTriggerClick(event: MouseEvent) {\n const target = event.target as HTMLElement;\n\n if (target.dataset.stzhDialogTrigger === this.element.id) {\n this.show();\n } else {\n const closest = target.closest(\"[data-stzh-dialog-trigger]\") as HTMLElement;\n\n if (closest && closest.dataset.stzhDialogTrigger === this.element.id) {\n this.show();\n }\n }\n }\n\n @Method()\n async show() {\n this.open = true;\n this.stzhOpen.emit({\n component: \"stzh-dialog\"\n });\n }\n\n @Method()\n async hide() {\n this.open = false;\n this.stzhClose.emit({\n component: \"stzh-dialog\"\n });\n }\n\n private observer: MutationObserver;\n private id: string;\n private trap: FocusTrap;\n private parentElement: HTMLElement;\n private dialogElement: HTMLDivElement;\n\n private handleDialogClick = (event: MouseEvent) => {\n const target = event.target as HTMLElement;\n if (target.dataset.stzhDialogClose) {\n this.hide();\n } else {\n const closest = target.closest(\"[data-stzh-dialog-close]\");\n\n if (closest) {\n this.hide();\n }\n }\n }\n\n private handleCloseButtonClick = () => {\n this.hide();\n }\n\n private init = () => {\n const actions = this.element.querySelector('stzh-actions[slot=\"actions\"]');\n\n if (actions) {\n setPropsIfNull(actions, {\n variant: \"dialog\"\n } as HTMLStzhActionsElement)\n }\n }\n\n private getSiblings() {\n if (!this.parentElement) {\n return [];\n }\n\n return Array.from(this.parentElement.children).filter(\n (child) => child !== this.element\n );\n }\n\n private disableSiblings() {\n this.getSiblings().forEach((sibling) => {\n sibling.setAttribute(\"aria-hidden\", \"true\");\n });\n }\n\n private enableSiblings() {\n this.getSiblings().forEach((sibling) => {\n sibling.removeAttribute(\"aria-hidden\");\n });\n }\n\n private dialogShown() {\n activeDialog = this;\n document.body.classList.add(CLASS_BODY_OPEN);\n this.disableSiblings();\n\n if (this.trap) {\n this.trap.activate();\n }\n }\n\n private dialogHidden() {\n document.body.classList.remove(CLASS_BODY_OPEN);\n this.enableSiblings();\n\n if (this.trap) {\n this.trap.deactivate();\n }\n\n activeDialog = null;\n }\n\n async componentWillLoad() {\n this.id = `stzh-dialog-${dialogCounter}`;\n dialogCounter++;\n\n if (!this.localization) {\n this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, \"dialog\");\n }\n }\n\n componentDidRender() {\n this.open ? this.dialogShown() : this.dialogHidden();\n }\n\n componentDidUpdate() {\n this.trap.updateContainerElements(this.element);\n }\n\n componentDidLoad() {\n this.trap = createFocusTrap(this.element, {\n fallbackFocus: this.dialogElement,\n ...createBaseFocusTrapOptions()\n });\n\n if (this.open) {\n this.dialogShown();\n }\n }\n\n connectedCallback() {\n if (!this.stay && this.element.parentElement !== document.body) {\n document.body.appendChild(this.element);\n }\n\n this.parentElement = this.element.parentElement;\n\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.dialogHidden();\n\n if (this.observer) {\n this.observer.disconnect();\n }\n }\n\n render() {\n return (\n <Host>\n <div\n class={{\n \"stzh-dialog\": true,\n \"stzh-dialog--is-open\": this.open,\n \"stzh-dialog--has-heading\": !!this.heading,\n \"stzh-dialog--has-close-hidden\": this.hideClose,\n [`stzh-dialog--size-${this.size}`]: !!this.size,\n }}\n >\n <div class=\"stzh-dialog__backdrop\"></div>\n <div class=\"stzh-dialog__content\">\n <div\n class=\"stzh-dialog__dialog\"\n ref={(el) => (this.dialogElement = el as HTMLDivElement)}\n tabindex=\"-1\"\n role={this.a11yRole}\n aria-label={this.a11yLabel || null}\n aria-labelledby={this.heading ? `${this.id}-heading` : null}\n aria-hidden={this.open ? \"false\" : \"true\"}\n onClick={this.handleDialogClick}\n >\n {this.heading &&\n <stzh-heading\n id={`${this.id}-heading`}\n class=\"stzh-dialog__heading\"\n level=\"2\"\n >\n {this.heading}\n </stzh-heading>\n }\n\n <div class=\"stzh-dialog__dialog-content\">\n <slot></slot>\n </div>\n\n <div class=\"stzh-dialog__actions\">\n <slot name=\"actions\"></slot>\n </div>\n\n {!this.hideClose &&\n <stzh-button\n class=\"stzh-dialog__close-button\"\n variant=\"tertiary\"\n size=\"small\"\n icon=\"close\"\n iconOnly={true}\n onClick={this.handleCloseButtonClick}\n a11yLabel={this.localization.close}\n analyticsId={this.closeAnalyticsId || this.localization.close}\n ></stzh-button>\n }\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n\n"],"version":3}
|
|
@@ -1,148 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
-
|
|
5
|
-
const index = require('./index-92254d32.js');
|
|
6
|
-
const js_cookie = require('./js.cookie-b422ea10.js');
|
|
7
|
-
require('./_commonjsHelpers-dcc4cf71.js');
|
|
8
|
-
|
|
9
|
-
const stzhToastbarCss = ":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{bottom:var(--stzh-space-medium);z-index:var(--stzh-z-index-overlay);position:fixed;pointer-events:none;left:1.25rem;right:1.25rem;bottom:calc( var(--stzh-pagetitle-disturber-stuck-height, 0px) + var(--stzh-sticky-cta-stuck-bottom-height, 0px) )}@media screen and (min-width: 600px){:host{bottom:var(--stzh-space-large)}}@media screen and (min-width: 900px){:host{bottom:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){:host{bottom:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){:host{left:2rem;right:auto;max-width:26.8125rem}}@media screen and (min-width: 900px){:host{left:2.5rem;max-width:27.5rem}}@media screen and (min-width: 1260px){:host{left:4rem;max-width:30.3125rem}}@media screen and (min-width: 1600px){:host{left:calc((100vw - 84.25rem - var(--stzh-scrollbar-width, 0px)) / 2);max-width:34.625rem}}:host ::slotted(*:not([hidden]):not([slot])){margin-bottom:var(--stzh-space-small)}.stzh-toastbar{display:flex;flex-direction:column;justify-content:flex-end}@media screen and (min-width: 600px){.stzh-toastbar{align-items:flex-start}}";
|
|
10
|
-
|
|
11
|
-
const KEY_PREFIX_CLOSED = "stzh-components-toastbar-closed";
|
|
12
|
-
const StzhToastbar = class {
|
|
13
|
-
constructor(hostRef) {
|
|
14
|
-
index.registerInstance(this, hostRef);
|
|
15
|
-
this._initialToasts = [];
|
|
16
|
-
this.handleSlotchange = () => {
|
|
17
|
-
this.toastsAppended();
|
|
18
|
-
this.hideOverflowingItems();
|
|
19
|
-
};
|
|
20
|
-
this.hideAfter = 30;
|
|
21
|
-
this.max = 5;
|
|
22
|
-
this.initialToasts = [];
|
|
23
|
-
}
|
|
24
|
-
/** Create new toast. */
|
|
25
|
-
async toast(label, { type, link } = { type: "info" }) {
|
|
26
|
-
const toast = document.createElement("stzh-toast");
|
|
27
|
-
toast.hidden = true;
|
|
28
|
-
toast.label = label;
|
|
29
|
-
toast.role = "alert";
|
|
30
|
-
toast.type = type || "info";
|
|
31
|
-
toast.initialOpenAnimation = true;
|
|
32
|
-
if (link) {
|
|
33
|
-
link.slot = "link";
|
|
34
|
-
link.size = "small";
|
|
35
|
-
toast.appendChild(link);
|
|
36
|
-
}
|
|
37
|
-
this.element.appendChild(toast);
|
|
38
|
-
return toast;
|
|
39
|
-
}
|
|
40
|
-
initialToastsWatcher(newValue) {
|
|
41
|
-
if (typeof newValue === "string") {
|
|
42
|
-
this._initialToasts = JSON.parse(newValue);
|
|
43
|
-
}
|
|
44
|
-
else {
|
|
45
|
-
this._initialToasts = newValue;
|
|
46
|
-
}
|
|
47
|
-
}
|
|
48
|
-
toastAppended(toast) {
|
|
49
|
-
if (toast.getAttribute('data-stzh-toastbar-managed')) {
|
|
50
|
-
return;
|
|
51
|
-
}
|
|
52
|
-
toast.setAttribute('data-stzh-toastbar-managed', '');
|
|
53
|
-
toast.addEventListener("stzhClosed", () => {
|
|
54
|
-
toast.remove();
|
|
55
|
-
});
|
|
56
|
-
if (toast.type !== "error") {
|
|
57
|
-
let timeoutStarted = new Date().getTime();
|
|
58
|
-
let restTime = this.hideAfter * 1000;
|
|
59
|
-
let currentTimeout = window.setTimeout(() => {
|
|
60
|
-
toast.hide();
|
|
61
|
-
}, restTime);
|
|
62
|
-
toast.addEventListener("pointerenter", () => {
|
|
63
|
-
if (currentTimeout) {
|
|
64
|
-
window.clearTimeout(currentTimeout);
|
|
65
|
-
const timePassed = new Date().getTime() - timeoutStarted;
|
|
66
|
-
restTime = restTime - timePassed;
|
|
67
|
-
}
|
|
68
|
-
});
|
|
69
|
-
toast.addEventListener("pointerleave", () => {
|
|
70
|
-
timeoutStarted = new Date().getTime();
|
|
71
|
-
currentTimeout = window.setTimeout(() => {
|
|
72
|
-
toast.hide();
|
|
73
|
-
}, restTime);
|
|
74
|
-
});
|
|
75
|
-
}
|
|
76
|
-
}
|
|
77
|
-
toastsAppended() {
|
|
78
|
-
var _a;
|
|
79
|
-
const host = ((_a = this.element.getRootNode()) === null || _a === void 0 ? void 0 : _a.host) || this.element;
|
|
80
|
-
Array.from(host.children).forEach((toast) => {
|
|
81
|
-
this.toastAppended(toast);
|
|
82
|
-
});
|
|
83
|
-
}
|
|
84
|
-
hideOverflowingItems() {
|
|
85
|
-
var _a;
|
|
86
|
-
const host = ((_a = this.element.getRootNode()) === null || _a === void 0 ? void 0 : _a.host) || this.element;
|
|
87
|
-
const childCount = host.children.length;
|
|
88
|
-
Array.from(host.children)
|
|
89
|
-
.splice(0, childCount - this.max)
|
|
90
|
-
.forEach((toast) => {
|
|
91
|
-
toast.hide();
|
|
92
|
-
});
|
|
93
|
-
}
|
|
94
|
-
componentWillLoad() {
|
|
95
|
-
this.initialToastsWatcher(this.initialToasts);
|
|
96
|
-
}
|
|
97
|
-
componentDidLoad() {
|
|
98
|
-
this._initialToasts.forEach(async (data) => {
|
|
99
|
-
if (data.cookie) {
|
|
100
|
-
const alreadyClosedBefore = js_cookie.js_cookie.get(`${KEY_PREFIX_CLOSED}-${data.cookie}`);
|
|
101
|
-
if (alreadyClosedBefore) {
|
|
102
|
-
return;
|
|
103
|
-
}
|
|
104
|
-
}
|
|
105
|
-
let link = data.link;
|
|
106
|
-
if (!(link instanceof HTMLElement)) {
|
|
107
|
-
const generatedLink = document.createElement("stzh-button");
|
|
108
|
-
generatedLink.slot = "link";
|
|
109
|
-
generatedLink.size = "small";
|
|
110
|
-
Object.assign(generatedLink, data.link);
|
|
111
|
-
link = generatedLink;
|
|
112
|
-
}
|
|
113
|
-
const toast = await this.toast(data.label, {
|
|
114
|
-
type: data.type,
|
|
115
|
-
link: link
|
|
116
|
-
});
|
|
117
|
-
if (data.cookie) {
|
|
118
|
-
let cookieExpires = 365;
|
|
119
|
-
if (data.cookieExpires === 0) {
|
|
120
|
-
cookieExpires = null;
|
|
121
|
-
}
|
|
122
|
-
else if (data.cookieExpires) {
|
|
123
|
-
cookieExpires = data.cookieExpires;
|
|
124
|
-
}
|
|
125
|
-
toast.addEventListener("stzhClosed", () => {
|
|
126
|
-
js_cookie.js_cookie.set(`${KEY_PREFIX_CLOSED}-${data.cookie}`, '1', {
|
|
127
|
-
expires: cookieExpires
|
|
128
|
-
});
|
|
129
|
-
});
|
|
130
|
-
}
|
|
131
|
-
});
|
|
132
|
-
}
|
|
133
|
-
render() {
|
|
134
|
-
const classes = {
|
|
135
|
-
"stzh-toastbar": true,
|
|
136
|
-
};
|
|
137
|
-
return (index.h(index.Host, null, index.h("div", { class: classes }, index.h("slot", { onSlotchange: this.handleSlotchange }))));
|
|
138
|
-
}
|
|
139
|
-
get element() { return index.getElement(this); }
|
|
140
|
-
static get watchers() { return {
|
|
141
|
-
"initialToasts": ["initialToastsWatcher"]
|
|
142
|
-
}; }
|
|
143
|
-
};
|
|
144
|
-
StzhToastbar.style = stzhToastbarCss;
|
|
145
|
-
|
|
146
|
-
exports.stzh_toastbar = StzhToastbar;
|
|
147
|
-
|
|
148
|
-
//# sourceMappingURL=stzh-toastbar.cjs.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"stzh-toastbar.entry.cjs.js","mappings":"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","names":["Cookie","h","Host"],"sources":["src/components/stzh-toastbar/stzh-toastbar.scss?tag=stzh-toastbar&encapsulation=shadow","src/components/stzh-toastbar/stzh-toastbar.tsx"],"sourcesContent":[":host {\n @include spaceCurve('bottom', 'regular');\n z-index: $zIndexOverlay;\n position: fixed;\n pointer-events: none;\n left: $containerMargin;\n right: $containerMargin;\n bottom: calc(\n var(--stzh-pagetitle-disturber-stuck-height, 0px)\n + var(--stzh-sticky-cta-stuck-bottom-height, 0px)\n );\n\n @include mq($from: small) {\n left: $containerMarginSmall;\n right: auto;\n max-width: 429px;\n }\n\n @include mq($from: medium) {\n left: $containerMarginMedium;\n max-width: 440px;\n }\n\n @include mq($from: large) {\n left: $containerMarginLarge;\n max-width: 485px;\n }\n\n @include mq($from: ultra) {\n left: calc((100vw - #{$containerMaxWidth} - var(--stzh-scrollbar-width, 0px)) / 2);\n max-width: 554px;\n }\n\n ::slotted(*:not([hidden]):not([slot])) {\n margin-bottom: space('small');\n }\n}\n\n.stzh-toastbar {\n display: flex;\n flex-direction: column;\n justify-content: flex-end;\n\n @include mq($from: small) {\n align-items: flex-start;\n }\n}\n","import {\n Component,\n Host,\n h,\n Element,\n Prop,\n Method,\n Watch,\n} from \"@stencil/core\";\n\nimport {\n StzhToastbarInitialToast,\n StzhToastType,\n} from \"../../index\";\n\nimport Cookie from \"js-cookie\";\n\nconst KEY_PREFIX_CLOSED = \"stzh-components-toastbar-closed\";\n\n/**\n * @slot - Slot for stzh-toast elements\n */\n@Component({\n tag: \"stzh-toastbar\",\n styleUrl: \"stzh-toastbar.scss\",\n shadow: true\n})\nexport class StzhToastbar {\n /**\n * Time after toasts are hidden (in seconds).\n * Toasts with type `error` will stay, until the user closes them manually.\n */\n @Prop() hideAfter: number = 30;\n\n /**\n * Maximum of toasts allowed to be shown.\n * If more are created, oldest will be hidden, even if timeout not ended yet or toast type is `error`.\n */\n @Prop() max: number = 5;\n\n /**\n * Initial toasts.\n *\n * Array of objects that at least includes `label` and optionally `type`, `link` (object with `href` and `label`) `cookie` and `cookieExpires`:\n * `[{\"label\": \"Lorem ipsum\", \"link\": { \"label\": \"More info\", \"href\": \"https://example.com\" }, \"cookie\": \"cookie-banner\", \"cookieExpires\": 365 }]`\n *\n * If `cookie` exists in an object, it will check for that cookie name first (prefixed with `stzh-components-toastbar-closed-`) and only show if cookie doesn't exist.\n * `cookieExpires` sets the cookie lifetime (default 365 days, set 0 for session cookie).\n */\n @Prop() initialToasts: StzhToastbarInitialToast[] | string = [];\n private _initialToasts: StzhToastbarInitialToast[] = [];\n\n @Element() element: HTMLStzhToastbarElement;\n\n /** Create new toast. */\n @Method()\n async toast(\n label: string,\n { type, link }: { type?: StzhToastType, link?: HTMLStzhButtonElement } = { type: \"info\" }\n ): Promise<HTMLStzhToastElement> {\n const toast = document.createElement(\"stzh-toast\");\n toast.hidden = true;\n toast.label = label;\n toast.role = \"alert\";\n toast.type = type || \"info\";\n toast.initialOpenAnimation = true;\n\n if (link) {\n link.slot = \"link\";\n link.size = \"small\";\n toast.appendChild(link);\n }\n\n this.element.appendChild(toast);\n\n return toast;\n }\n\n @Watch(\"initialToasts\")\n initialToastsWatcher(newValue: any[] | string) {\n if (typeof newValue === \"string\") {\n this._initialToasts = JSON.parse(newValue);\n } else {\n this._initialToasts = newValue;\n }\n }\n\n private toastAppended(toast: HTMLStzhToastElement) {\n if (toast.getAttribute('data-stzh-toastbar-managed')) {\n return;\n }\n\n toast.setAttribute('data-stzh-toastbar-managed', '');\n\n toast.addEventListener(\"stzhClosed\", () => {\n toast.remove();\n });\n\n if (toast.type !== \"error\") {\n let timeoutStarted = new Date().getTime();\n let restTime = this.hideAfter * 1000;\n let currentTimeout = window.setTimeout(() => {\n toast.hide();\n }, restTime);\n\n toast.addEventListener(\"pointerenter\", () => {\n if (currentTimeout) {\n window.clearTimeout(currentTimeout);\n const timePassed = new Date().getTime() - timeoutStarted;\n restTime = restTime - timePassed;\n }\n });\n\n toast.addEventListener(\"pointerleave\", () => {\n timeoutStarted = new Date().getTime();\n currentTimeout = window.setTimeout(() => {\n toast.hide();\n }, restTime);\n });\n }\n }\n\n private toastsAppended() {\n const host = (this.element.getRootNode() as ShadowRoot)?.host || this.element;\n Array.from(host.children).forEach((toast: HTMLStzhToastElement) => {\n this.toastAppended(toast);\n });\n }\n\n private hideOverflowingItems() {\n const host = (this.element.getRootNode() as ShadowRoot)?.host || this.element;\n const childCount = host.children.length;\n\n Array.from(host.children)\n .splice(0, childCount - this.max)\n .forEach((toast: HTMLStzhToastElement) => {\n toast.hide();\n });\n }\n\n private handleSlotchange = () => {\n this.toastsAppended();\n this.hideOverflowingItems();\n }\n\n componentWillLoad() {\n this.initialToastsWatcher(this.initialToasts);\n }\n\n componentDidLoad() {\n this._initialToasts.forEach(async (data) => {\n if (data.cookie) {\n const alreadyClosedBefore = Cookie.get(`${KEY_PREFIX_CLOSED}-${data.cookie}`);\n\n if (alreadyClosedBefore) {\n return;\n }\n }\n\n let link = data.link;\n\n if (!(link instanceof HTMLElement)) {\n const generatedLink = document.createElement(\"stzh-button\");\n generatedLink.slot = \"link\";\n generatedLink.size = \"small\";\n\n Object.assign(generatedLink, data.link);\n link = generatedLink;\n }\n\n const toast = await this.toast(data.label, {\n type: data.type,\n link: link as HTMLStzhButtonElement\n })\n\n if (data.cookie) {\n let cookieExpires = 365;\n\n if (data.cookieExpires === 0) {\n cookieExpires = null;\n } else if (data.cookieExpires) {\n cookieExpires = data.cookieExpires;\n }\n\n toast.addEventListener(\"stzhClosed\", () => {\n Cookie.set(`${KEY_PREFIX_CLOSED}-${data.cookie}`, '1', {\n expires: cookieExpires\n });\n });\n }\n })\n }\n\n render() {\n const classes = {\n \"stzh-toastbar\": true,\n };\n\n return (\n <Host>\n <div class={classes}>\n <slot onSlotchange={this.handleSlotchange}></slot>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
function tc(translation, count) {
|
|
4
|
-
if (!translation) {
|
|
5
|
-
return "";
|
|
6
|
-
}
|
|
7
|
-
const parts = translation.split('|');
|
|
8
|
-
let part = parts[0].trim();
|
|
9
|
-
if (parts.length === 3 && count === 1) {
|
|
10
|
-
part = parts[1].trim();
|
|
11
|
-
}
|
|
12
|
-
else if (parts.length === 3 && (count > 1 || count === null)) {
|
|
13
|
-
part = parts[2].trim();
|
|
14
|
-
}
|
|
15
|
-
if (parts.length === 2 && count !== 1) {
|
|
16
|
-
part = parts[1].trim();
|
|
17
|
-
}
|
|
18
|
-
return part.replace(/\{n\}/ig, (count === null || count === void 0 ? void 0 : count.toString()) || '');
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
exports.tc = tc;
|
|
22
|
-
|
|
23
|
-
//# sourceMappingURL=translation-utils-18767769.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"translation-utils-18767769.js","mappings":";;SAqEgB,EAAE,CAAC,WAAmB,EAAE,KAAa;EACnD,IAAI,CAAC,WAAW,EAAE;IAChB,OAAO,EAAE,CAAC;GACX;EAED,MAAM,KAAK,GAAG,WAAW,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;EACrC,IAAI,IAAI,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC;EAE3B,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,IAAI,KAAK,KAAK,CAAC,EAAE;IACrC,IAAI,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC;GACxB;OAAM,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,KAAK,KAAK,GAAG,CAAC,IAAI,KAAK,KAAK,IAAI,CAAC,EAAE;IAC9D,IAAI,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC;GACxB;EAED,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,IAAI,KAAK,KAAK,CAAC,EAAE;IACrC,IAAI,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC;GACxB;EAED,OAAO,IAAI,CAAC,OAAO,CAAC,SAAS,EAAE,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,QAAQ,EAAE,KAAI,EAAE,CAAC,CAAC;AAC1D;;;;","names":[],"sources":["src/utils/translation-utils.ts"],"sourcesContent":["import {\n StzhDateFormat,\n StzhDateParse\n} from \"./date-adapter\";\n\nexport type StzhLocaleFormats = {\n datetime?: {\n format: string | StzhDateFormat,\n parse: string | StzhDateParse\n },\n datetimeLong?: {\n format: string | StzhDateFormat,\n parse: string | StzhDateParse\n },\n datetimeInput?: {\n format: string | StzhDateFormat,\n parse: string | StzhDateParse\n },\n date?: {\n format: string | StzhDateFormat,\n parse: string | StzhDateParse\n },\n dateLong?: {\n format: string | StzhDateFormat,\n parse: string | StzhDateParse\n },\n dateInput?: {\n format: string | StzhDateFormat,\n parse: string | StzhDateParse\n },\n time?: {\n format: string | StzhDateFormat,\n parse: string | StzhDateParse\n },\n timeInput?: {\n format: string | StzhDateFormat,\n parse: string | StzhDateParse\n },\n}\n\ntype MonthsNames = [string, string, string, string, string, string, string, string, string, string, string, string]\ntype DayNames = [string, string, string, string, string, string, string]\n\nexport type StzhLocaleGlobals = {\n dateRange: string,\n timeRange: string,\n externalLinkLabel: string\n downloadLinkLabel: string\n requiredFieldMarker: string\n requiredFieldText: string\n optionalFieldMarker: string\n optionalFieldText: string\n invalidFieldText: string\n clearButtonLabel: string\n moreInfoButtonLabel: string\n dayNames: DayNames\n dayNamesShort: DayNames\n monthNames: MonthsNames\n monthNamesShort: MonthsNames\n}\n\nexport type StzhLocaleComponent = {\n $locale: \"de\" | \"en\",\n $formats: StzhLocaleFormats,\n $formatsIso: StzhLocaleFormats,\n $formatsLegacy: StzhLocaleFormats,\n $globals: StzhLocaleGlobals\n}\n\nexport function tc(translation: string, count: number): string {\n if (!translation) {\n return \"\";\n }\n\n const parts = translation.split('|');\n let part = parts[0].trim();\n\n if (parts.length === 3 && count === 1) {\n part = parts[1].trim();\n } else if (parts.length === 3 && (count > 1 || count === null)) {\n part = parts[2].trim();\n }\n\n if (parts.length === 2 && count !== 1) {\n part = parts[1].trim();\n }\n\n return part.replace(/\\{n\\}/ig, count?.toString() || '');\n}\n"],"version":3}
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
function tc(translation, count) {
|
|
2
|
-
if (!translation) {
|
|
3
|
-
return "";
|
|
4
|
-
}
|
|
5
|
-
const parts = translation.split('|');
|
|
6
|
-
let part = parts[0].trim();
|
|
7
|
-
if (parts.length === 3 && count === 1) {
|
|
8
|
-
part = parts[1].trim();
|
|
9
|
-
}
|
|
10
|
-
else if (parts.length === 3 && (count > 1 || count === null)) {
|
|
11
|
-
part = parts[2].trim();
|
|
12
|
-
}
|
|
13
|
-
if (parts.length === 2 && count !== 1) {
|
|
14
|
-
part = parts[1].trim();
|
|
15
|
-
}
|
|
16
|
-
return part.replace(/\{n\}/ig, (count === null || count === void 0 ? void 0 : count.toString()) || '');
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
export { tc as t };
|
|
20
|
-
|
|
21
|
-
//# sourceMappingURL=translation-utils.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"translation-utils.js","mappings":"SAqEgB,EAAE,CAAC,WAAmB,EAAE,KAAa;EACnD,IAAI,CAAC,WAAW,EAAE;IAChB,OAAO,EAAE,CAAC;GACX;EAED,MAAM,KAAK,GAAG,WAAW,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;EACrC,IAAI,IAAI,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC;EAE3B,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,IAAI,KAAK,KAAK,CAAC,EAAE;IACrC,IAAI,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC;GACxB;OAAM,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,KAAK,KAAK,GAAG,CAAC,IAAI,KAAK,KAAK,IAAI,CAAC,EAAE;IAC9D,IAAI,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC;GACxB;EAED,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,IAAI,KAAK,KAAK,CAAC,EAAE;IACrC,IAAI,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC;GACxB;EAED,OAAO,IAAI,CAAC,OAAO,CAAC,SAAS,EAAE,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,QAAQ,EAAE,KAAI,EAAE,CAAC,CAAC;AAC1D;;;;","names":[],"sources":["src/utils/translation-utils.ts"],"sourcesContent":["import {\n StzhDateFormat,\n StzhDateParse\n} from \"./date-adapter\";\n\nexport type StzhLocaleFormats = {\n datetime?: {\n format: string | StzhDateFormat,\n parse: string | StzhDateParse\n },\n datetimeLong?: {\n format: string | StzhDateFormat,\n parse: string | StzhDateParse\n },\n datetimeInput?: {\n format: string | StzhDateFormat,\n parse: string | StzhDateParse\n },\n date?: {\n format: string | StzhDateFormat,\n parse: string | StzhDateParse\n },\n dateLong?: {\n format: string | StzhDateFormat,\n parse: string | StzhDateParse\n },\n dateInput?: {\n format: string | StzhDateFormat,\n parse: string | StzhDateParse\n },\n time?: {\n format: string | StzhDateFormat,\n parse: string | StzhDateParse\n },\n timeInput?: {\n format: string | StzhDateFormat,\n parse: string | StzhDateParse\n },\n}\n\ntype MonthsNames = [string, string, string, string, string, string, string, string, string, string, string, string]\ntype DayNames = [string, string, string, string, string, string, string]\n\nexport type StzhLocaleGlobals = {\n dateRange: string,\n timeRange: string,\n externalLinkLabel: string\n downloadLinkLabel: string\n requiredFieldMarker: string\n requiredFieldText: string\n optionalFieldMarker: string\n optionalFieldText: string\n invalidFieldText: string\n clearButtonLabel: string\n moreInfoButtonLabel: string\n dayNames: DayNames\n dayNamesShort: DayNames\n monthNames: MonthsNames\n monthNamesShort: MonthsNames\n}\n\nexport type StzhLocaleComponent = {\n $locale: \"de\" | \"en\",\n $formats: StzhLocaleFormats,\n $formatsIso: StzhLocaleFormats,\n $formatsLegacy: StzhLocaleFormats,\n $globals: StzhLocaleGlobals\n}\n\nexport function tc(translation: string, count: number): string {\n if (!translation) {\n return \"\";\n }\n\n const parts = translation.split('|');\n let part = parts[0].trim();\n\n if (parts.length === 3 && count === 1) {\n part = parts[1].trim();\n } else if (parts.length === 3 && (count > 1 || count === null)) {\n part = parts[2].trim();\n }\n\n if (parts.length === 2 && count !== 1) {\n part = parts[1].trim();\n }\n\n return part.replace(/\\{n\\}/ig, count?.toString() || '');\n}\n"],"version":3}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"stzh-dialog.entry.js","mappings":";;;;;;AAAA,MAAM,aAAa,GAAG,s7KAAs7K;;ACwB58K,MAAM,eAAe,GAAG,kBAAkB,CAAC;AAE3C,IAAI,YAAY,GAAe,IAAI,CAAC;AACpC,IAAI,aAAa,GAAG,CAAC,CAAC;MAWT,UAAU;;;;;IA4Gb,sBAAiB,GAAG,CAAC,KAAiB;MAC5C,MAAM,MAAM,GAAG,KAAK,CAAC,MAAqB,CAAC;MAC3C,IAAI,MAAM,CAAC,OAAO,CAAC,eAAe,EAAE;QAClC,IAAI,CAAC,IAAI,EAAE,CAAC;OACb;WAAM;QACL,MAAM,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC,0BAA0B,CAAC,CAAC;QAE3D,IAAI,OAAO,EAAE;UACX,IAAI,CAAC,IAAI,EAAE,CAAC;SACb;OACF;KACF,CAAA;IAEO,2BAAsB,GAAG;MAC/B,IAAI,CAAC,IAAI,EAAE,CAAC;KACb,CAAA;IAEO,SAAI,GAAG;MACb,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,8BAA8B,CAAC,CAAC;MAE3E,IAAI,OAAO,EAAE;QACX,cAAc,CAAC,OAAO,EAAE;UACtB,OAAO,EAAE,QAAQ;SACQ,CAAC,CAAA;OAC7B;KACF,CAAA;;4BAhImC,KAAK;gCAGD,KAAK;gBAGJ,KAAK;gBAGtB,IAAI;gBAGyB,SAAS;qBAGjC,KAAK;mBAGR,EAAE;oBAG2C,aAAa;qBAG7B,EAAE;;;EAkBzD,kBAAkB,CAAC,KAAiB;IAClC,IAAI,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,oBAAoB,EAAE;MAC5C,OAAM;KACP;IAED,MAAM,cAAc,GAAG,KAAK,CAAC,MAAM,KAAK,IAAI,CAAC,aAAa;SACrD,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAqB,CAAC,KAAK,KAAK,CAAA;IAEvE,IAAI,cAAc,EAAE;MAClB,IAAI,CAAC,IAAI,EAAE,CAAA;KACZ;GACF;EAGD,aAAa,CAAC,KAAoB;IAChC,IACE,KAAK,CAAC,GAAG,KAAK,QAAQ;SACnB,YAAY,KAAK,IAAI;SACrB,IAAI,CAAC,gBAAgB,EACxB;MACA,IAAI,CAAC,IAAI,EAAE,CAAC;KACb;GACF;EAGD,sBAAsB,CAAC,KAAiB;IACtC,MAAM,MAAM,GAAG,KAAK,CAAC,MAAqB,CAAC;IAE3C,IAAI,MAAM,CAAC,OAAO,CAAC,iBAAiB,KAAK,IAAI,CAAC,OAAO,CAAC,EAAE,EAAE;MACxD,IAAI,CAAC,IAAI,EAAE,CAAC;KACb;SAAM;MACL,MAAM,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC,4BAA4B,CAAgB,CAAC;MAE5E,IAAI,OAAO,IAAI,OAAO,CAAC,OAAO,CAAC,iBAAiB,KAAK,IAAI,CAAC,OAAO,CAAC,EAAE,EAAE;QACpE,IAAI,CAAC,IAAI,EAAE,CAAC;OACb;KACF;GACF;EAGD,MAAM,IAAI;IACR,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;IACjB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC;MACjB,SAAS,EAAE,aAAa;KACzB,CAAC,CAAC;GACJ;EAGD,MAAM,IAAI;IACR,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;IAClB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC;MAClB,SAAS,EAAE,aAAa;KACzB,CAAC,CAAC;GACJ;EAmCO,WAAW;IACjB,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE;MACvB,OAAO,EAAE,CAAC;KACX;IAED,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC,MAAM,CACnD,CAAC,KAAK,KAAK,KAAK,KAAK,IAAI,CAAC,OAAO,CAClC,CAAC;GACH;EAEO,eAAe;IACrB,IAAI,CAAC,WAAW,EAAE,CAAC,OAAO,CAAC,CAAC,OAAO;MACjC,OAAO,CAAC,YAAY,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;KAC7C,CAAC,CAAC;GACJ;EAEO,cAAc;IACpB,IAAI,CAAC,WAAW,EAAE,CAAC,OAAO,CAAC,CAAC,OAAO;MACjC,OAAO,CAAC,eAAe,CAAC,aAAa,CAAC,CAAC;KACxC,CAAC,CAAC;GACJ;EAEO,WAAW;IACjB,YAAY,GAAG,IAAI,CAAC;IACpB,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;IAC7C,IAAI,CAAC,eAAe,EAAE,CAAC;IAEvB,IAAI,IAAI,CAAC,IAAI,EAAE;MACb,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;KACtB;GACF;EAEO,YAAY;IAClB,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC;IAChD,IAAI,CAAC,cAAc,EAAE,CAAC;IAEtB,IAAI,IAAI,CAAC,IAAI,EAAE;MACb,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE,CAAC;KACxB;IAED,YAAY,GAAG,IAAI,CAAC;GACrB;EAED,MAAM,iBAAiB;IACrB,IAAI,CAAC,EAAE,GAAG,eAAe,aAAa,EAAE,CAAC;IACzC,aAAa,EAAE,CAAC;IAEhB,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE;MACtB,IAAI,CAAC,YAAY,GAAG,MAAM,MAAM,CAAC,cAAc,CAAC,KAAK,CAAC,iBAAiB,CAAC,IAAI,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAC;KACjG;GACF;EAED,kBAAkB;IAChB,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,WAAW,EAAE,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC;GACtD;EAED,kBAAkB;IAChB,IAAI,CAAC,IAAI,CAAC,uBAAuB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;GACjD;EAED,gBAAgB;IACd,IAAI,CAAC,IAAI,GAAG,eAAe,CAAC,IAAI,CAAC,OAAO,kBACtC,aAAa,EAAE,IAAI,CAAC,aAAa,IAC9B,0BAA0B,EAAE,EAC/B,CAAC;IAEH,IAAI,IAAI,CAAC,IAAI,EAAE;MACb,IAAI,CAAC,WAAW,EAAE,CAAC;KACpB;GACF;EAED,iBAAiB;IACf,IAAI,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,OAAO,CAAC,aAAa,KAAK,QAAQ,CAAC,IAAI,EAAE;MAC9D,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;KACzC;IAED,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC;IAEhD,IAAI,CAAC,IAAI,EAAE,CAAC;IAEZ,IAAI,CAAC,QAAQ,GAAG,IAAI,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAChD,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE;MAClC,SAAS,EAAE,IAAI;MACf,OAAO,EAAE,IAAI;KACd,CAAC,CAAC;GACJ;EAED,oBAAoB;IAClB,IAAI,CAAC,YAAY,EAAE,CAAC;IAEpB,IAAI,IAAI,CAAC,QAAQ,EAAE;MACjB,IAAI,CAAC,QAAQ,CAAC,UAAU,EAAE,CAAC;KAC5B;GACF;EAED,MAAM;IACJ,QACE,EAAC,IAAI,QACH,WACE,KAAK,EAAE;QACL,aAAa,EAAE,IAAI;QACnB,sBAAsB,EAAE,IAAI,CAAC,IAAI;QACjC,0BAA0B,EAAE,CAAC,CAAC,IAAI,CAAC,OAAO;QAC1C,+BAA+B,EAAE,IAAI,CAAC,SAAS;QAC/C,CAAC,qBAAqB,IAAI,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,IAAI;OAChD,IAED,WAAK,KAAK,EAAC,uBAAuB,GAAO,EACzC,WAAK,KAAK,EAAC,sBAAsB,IAC/B,WACE,KAAK,EAAC,qBAAqB,EAC3B,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,aAAa,GAAG,EAAoB,CAAC,EACxD,QAAQ,EAAC,IAAI,EACb,IAAI,EAAE,IAAI,CAAC,QAAQ,gBACP,IAAI,CAAC,SAAS,IAAI,IAAI,qBACjB,IAAI,CAAC,OAAO,GAAG,GAAG,IAAI,CAAC,EAAE,UAAU,GAAG,IAAI,iBAC9C,IAAI,CAAC,IAAI,GAAG,OAAO,GAAG,MAAM,EACzC,OAAO,EAAE,IAAI,CAAC,iBAAiB,IAE9B,IAAI,CAAC,OAAO;MACX,oBACE,EAAE,EAAE,GAAG,IAAI,CAAC,EAAE,UAAU,EACxB,KAAK,EAAC,sBAAsB,EAC5B,KAAK,EAAC,GAAG,IAER,IAAI,CAAC,OAAO,CACA,EAGjB,WAAK,KAAK,EAAC,6BAA6B,IACtC,eAAa,CACT,EAEN,WAAK,KAAK,EAAC,sBAAsB,IAC/B,YAAM,IAAI,EAAC,SAAS,GAAQ,CACxB,EAEL,CAAC,IAAI,CAAC,SAAS;MACd,mBACE,KAAK,EAAC,2BAA2B,EACjC,OAAO,EAAC,UAAU,EAClB,IAAI,EAAC,OAAO,EACZ,IAAI,EAAC,OAAO,EACZ,QAAQ,EAAE,IAAI,EACd,OAAO,EAAE,IAAI,CAAC,sBAAsB,EACpC,SAAS,EAAE,IAAI,CAAC,YAAY,CAAC,KAAK,EAClC,WAAW,EAAE,IAAI,CAAC,gBAAgB,IAAI,IAAI,CAAC,YAAY,CAAC,KAAK,GAChD,CAEb,CACF,CACF,CACD,EACP;GACH;;;;;;;","names":[],"sources":["src/components/stzh-dialog/stzh-dialog.scss?tag=stzh-dialog&encapsulation=scoped","src/components/stzh-dialog/stzh-dialog.tsx"],"sourcesContent":["/**\n * @prop --width: Width of dialog\n * @prop --padding-top: Padding top of dialog\n * @prop --padding-bottom: Padding bottom of dialog\n * @prop --padding-left: Padding left of dialog\n * @prop --padding-right: Padding right of dialog\n * @prop --backdrop-opacity: Opacity of dialog backdrop\n * @prop --backdrop-background-color: Opacity of dialog background color\n *\n * @prop --stzh-dialog-backdrop-opacity: **Global**: Opacity of backdrops\n * @prop --stzh-dialog-backdrop-background-color: **Global**: Background color of backdrops\n */\n\n:host {\n @include spaceCurve('--padding-top', 'large');\n @include spaceCurve('--padding-bottom', 'large');\n @include spaceCurve('--padding-left', 'medium');\n @include spaceCurve('--padding-right', 'medium');\n --width: 100%;\n --backdrop-opacity: #{$dialogBackdropOpacity};\n --backdrop-background-color: #{$dialogBackdropBackgroundColor};\n\n @include mq($from: small) {\n --width: 536px;\n }\n\n @include mq($from: medium) {\n --width: 610px; // 786 before\n }\n\n @include mq($from: large) {\n --width: 866px; // 832 before\n }\n\n @include mq($from: ultra) {\n --width: 888px;\n }\n\n &[size=\"small\"] {\n @include mq($from: small) {\n --width: 395px;\n }\n\n @include mq($from: medium) {\n --width: 460px;\n }\n\n @include mq($from: large) {\n --width: 512px;\n }\n }\n}\n\n.stzh-dialog {\n z-index: $zIndexDialog;\n display: none;\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n flex-direction: column;\n align-items: stretch;\n justify-content: stretch;\n\n &__content {\n z-index: 2;\n position: relative;\n display: flex;\n flex-direction: column;\n align-items: center;\n flex-grow: 1;\n overflow: auto;\n }\n\n &__dialog {\n position: relative;\n display: flex;\n flex-direction: column;\n margin: auto;\n border: none;\n background-color: $colorWhite;\n width: var(--width);\n max-width: 100%;\n box-shadow: $boxShadowOverlay;\n height: 100vh;\n max-height: 100vh;\n // overflow: visible;\n overflow: hidden;\n outline: none;\n\n @include mq($from: small) {\n height: auto;\n }\n }\n\n &__backdrop {\n z-index: 1;\n position: absolute;\n top: 0px;\n left: 0px;\n width: 100%;\n height: 100%;\n overflow-x: hidden;\n overflow-y: auto;\n text-align: center;\n background-color: var(--backdrop-background-color);\n opacity: var(--backdrop-opacity);\n }\n\n &__heading {\n @include spaceCurve('padding-bottom', 'regular');\n padding-top: var(--padding-top);\n padding-left: var(--padding-left);\n padding-right: var(--padding-right);\n }\n\n &__dialog-content {\n padding-left: var(--padding-left);\n padding-right: var(--padding-right);\n @include spaceCurve('padding-top', 'medium');\n @include spaceCurve('padding-bottom', 'medium');\n overflow: auto;\n flex-grow: 1;\n }\n\n &__actions {\n &:not(:empty) {\n padding-top: space('medium');\n padding-bottom: var(--padding-bottom);\n padding-left: var(--padding-left);\n padding-right: var(--padding-right);\n }\n }\n\n &__close-button {\n position: absolute;\n top: space('xsmall');\n right: space('xsmall');\n\n @include mq($from: medium) {\n top: space('large');\n right: space('large');\n }\n }\n\n &--is-open {\n display: flex;\n }\n}\n","import {\n Host,\n Component,\n Element,\n Method,\n Listen,\n Prop,\n Event,\n EventEmitter,\n h,\n} from \"@stencil/core\";\n\nimport {\n StzhDialogOpenEvent,\n StzhDialogCloseEvent\n} from \"../../index\";\n\nimport { setPropsIfNull } from \"../../utils/utils\";\nimport { createBaseFocusTrapOptions } from \"../../utils/overlay-utils\";\n\nimport { StzhDialogLocalizedText } from \"./stzh-dialog.localization\"\n\nimport { createFocusTrap, FocusTrap } from 'focus-trap';\n\nconst CLASS_BODY_OPEN = \"stzh-dialog-open\";\n\nlet activeDialog: StzhDialog = null;\nlet dialogCounter = 0;\n\n/**\n * @slot actions - Slot for actions element\n * @slot - Slot for any content inside the dialog\n */\n@Component({\n tag: \"stzh-dialog\",\n styleUrl: \"stzh-dialog.scss\",\n scoped: true\n})\nexport class StzhDialog {\n /** Translation strings */\n @Prop() localization: StzhDialogLocalizedText;\n\n /** Close dialog when pressing ESC */\n @Prop() closeOnEscapeKey: boolean = false;\n\n /** Close dialog when clicking outside of it */\n @Prop() closeOnBackdropClick: boolean = false;\n\n /** Open status */\n @Prop({ mutable: true }) open: boolean = false;\n\n /** Stay in original position (true) or move to body (false) */\n @Prop() stay: boolean = true;\n\n /** Size */\n @Prop({ reflect: true }) size: \"default\" | \"small\" = \"default\";\n\n /** Whether to hide close button */\n @Prop() hideClose: boolean = false;\n\n /** Heading text */\n @Prop() heading: string = \"\";\n\n /** Accessibility role */\n @Prop({ attribute: \"a11y-role\" }) a11yRole: \"dialog\" | \"alertdialog\" = \"alertdialog\";\n\n /** Accessible label for dialog (use if no heading is used) */\n @Prop({ attribute: \"a11y-label\" }) a11yLabel: string = \"\";\n\n /**\n * For Adobe Analytics.\n * Will be rendered as value of `s-object-id` attribute to the close button element.\n * Default value will be taken from translations.\n */\n @Prop() closeAnalyticsId: string;\n\n /** Dialog open event */\n @Event() stzhOpen: EventEmitter<StzhDialogOpenEvent>;\n\n /** Dialog close event */\n @Event() stzhClose: EventEmitter<StzhDialogCloseEvent>;\n\n @Element() element: HTMLStzhDialogElement;\n\n @Listen(\"click\", { target: \"document\", capture: true })\n handleOutsideClick(event: MouseEvent) {\n if (!this.open || !this.closeOnBackdropClick) {\n return\n }\n\n const isClickOutside = event.target !== this.dialogElement\n && this.dialogElement.contains(event.target as HTMLElement) === false\n\n if (isClickOutside) {\n this.hide()\n }\n }\n\n @Listen(\"keydown\", { target: \"document\" })\n handleKeydown(event: KeyboardEvent) {\n if (\n event.key === \"Escape\"\n && activeDialog === this\n && this.closeOnEscapeKey\n ) {\n this.hide();\n }\n }\n\n @Listen(\"click\", { target: \"document\" })\n handleOpenTriggerClick(event: MouseEvent) {\n const target = event.target as HTMLElement;\n\n if (target.dataset.stzhDialogTrigger === this.element.id) {\n this.show();\n } else {\n const closest = target.closest(\"[data-stzh-dialog-trigger]\") as HTMLElement;\n\n if (closest && closest.dataset.stzhDialogTrigger === this.element.id) {\n this.show();\n }\n }\n }\n\n @Method()\n async show() {\n this.open = true;\n this.stzhOpen.emit({\n component: \"stzh-dialog\"\n });\n }\n\n @Method()\n async hide() {\n this.open = false;\n this.stzhClose.emit({\n component: \"stzh-dialog\"\n });\n }\n\n private observer: MutationObserver;\n private id: string;\n private trap: FocusTrap;\n private parentElement: HTMLElement;\n private dialogElement: HTMLDivElement;\n\n private handleDialogClick = (event: MouseEvent) => {\n const target = event.target as HTMLElement;\n if (target.dataset.stzhDialogClose) {\n this.hide();\n } else {\n const closest = target.closest(\"[data-stzh-dialog-close]\");\n\n if (closest) {\n this.hide();\n }\n }\n }\n\n private handleCloseButtonClick = () => {\n this.hide();\n }\n\n private init = () => {\n const actions = this.element.querySelector('stzh-actions[slot=\"actions\"]');\n\n if (actions) {\n setPropsIfNull(actions, {\n variant: \"dialog\"\n } as HTMLStzhActionsElement)\n }\n }\n\n private getSiblings() {\n if (!this.parentElement) {\n return [];\n }\n\n return Array.from(this.parentElement.children).filter(\n (child) => child !== this.element\n );\n }\n\n private disableSiblings() {\n this.getSiblings().forEach((sibling) => {\n sibling.setAttribute(\"aria-hidden\", \"true\");\n });\n }\n\n private enableSiblings() {\n this.getSiblings().forEach((sibling) => {\n sibling.removeAttribute(\"aria-hidden\");\n });\n }\n\n private dialogShown() {\n activeDialog = this;\n document.body.classList.add(CLASS_BODY_OPEN);\n this.disableSiblings();\n\n if (this.trap) {\n this.trap.activate();\n }\n }\n\n private dialogHidden() {\n document.body.classList.remove(CLASS_BODY_OPEN);\n this.enableSiblings();\n\n if (this.trap) {\n this.trap.deactivate();\n }\n\n activeDialog = null;\n }\n\n async componentWillLoad() {\n this.id = `stzh-dialog-${dialogCounter}`;\n dialogCounter++;\n\n if (!this.localization) {\n this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, \"dialog\");\n }\n }\n\n componentDidRender() {\n this.open ? this.dialogShown() : this.dialogHidden();\n }\n\n componentDidUpdate() {\n this.trap.updateContainerElements(this.element);\n }\n\n componentDidLoad() {\n this.trap = createFocusTrap(this.element, {\n fallbackFocus: this.dialogElement,\n ...createBaseFocusTrapOptions()\n });\n\n if (this.open) {\n this.dialogShown();\n }\n }\n\n connectedCallback() {\n if (!this.stay && this.element.parentElement !== document.body) {\n document.body.appendChild(this.element);\n }\n\n this.parentElement = this.element.parentElement;\n\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.dialogHidden();\n\n if (this.observer) {\n this.observer.disconnect();\n }\n }\n\n render() {\n return (\n <Host>\n <div\n class={{\n \"stzh-dialog\": true,\n \"stzh-dialog--is-open\": this.open,\n \"stzh-dialog--has-heading\": !!this.heading,\n \"stzh-dialog--has-close-hidden\": this.hideClose,\n [`stzh-dialog--size-${this.size}`]: !!this.size,\n }}\n >\n <div class=\"stzh-dialog__backdrop\"></div>\n <div class=\"stzh-dialog__content\">\n <div\n class=\"stzh-dialog__dialog\"\n ref={(el) => (this.dialogElement = el as HTMLDivElement)}\n tabindex=\"-1\"\n role={this.a11yRole}\n aria-label={this.a11yLabel || null}\n aria-labelledby={this.heading ? `${this.id}-heading` : null}\n aria-hidden={this.open ? \"false\" : \"true\"}\n onClick={this.handleDialogClick}\n >\n {this.heading &&\n <stzh-heading\n id={`${this.id}-heading`}\n class=\"stzh-dialog__heading\"\n level=\"2\"\n >\n {this.heading}\n </stzh-heading>\n }\n\n <div class=\"stzh-dialog__dialog-content\">\n <slot></slot>\n </div>\n\n <div class=\"stzh-dialog__actions\">\n <slot name=\"actions\"></slot>\n </div>\n\n {!this.hideClose &&\n <stzh-button\n class=\"stzh-dialog__close-button\"\n variant=\"tertiary\"\n size=\"small\"\n icon=\"close\"\n iconOnly={true}\n onClick={this.handleCloseButtonClick}\n a11yLabel={this.localization.close}\n analyticsId={this.closeAnalyticsId || this.localization.close}\n ></stzh-button>\n }\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n\n"],"version":3}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"stzh-toastbar.entry.js","mappings":"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","names":["Cookie"],"sources":["src/components/stzh-toastbar/stzh-toastbar.scss?tag=stzh-toastbar&encapsulation=shadow","src/components/stzh-toastbar/stzh-toastbar.tsx"],"sourcesContent":[":host {\n @include spaceCurve('bottom', 'regular');\n z-index: $zIndexOverlay;\n position: fixed;\n pointer-events: none;\n left: $containerMargin;\n right: $containerMargin;\n bottom: calc(\n var(--stzh-pagetitle-disturber-stuck-height, 0px)\n + var(--stzh-sticky-cta-stuck-bottom-height, 0px)\n );\n\n @include mq($from: small) {\n left: $containerMarginSmall;\n right: auto;\n max-width: 429px;\n }\n\n @include mq($from: medium) {\n left: $containerMarginMedium;\n max-width: 440px;\n }\n\n @include mq($from: large) {\n left: $containerMarginLarge;\n max-width: 485px;\n }\n\n @include mq($from: ultra) {\n left: calc((100vw - #{$containerMaxWidth} - var(--stzh-scrollbar-width, 0px)) / 2);\n max-width: 554px;\n }\n\n ::slotted(*:not([hidden]):not([slot])) {\n margin-bottom: space('small');\n }\n}\n\n.stzh-toastbar {\n display: flex;\n flex-direction: column;\n justify-content: flex-end;\n\n @include mq($from: small) {\n align-items: flex-start;\n }\n}\n","import {\n Component,\n Host,\n h,\n Element,\n Prop,\n Method,\n Watch,\n} from \"@stencil/core\";\n\nimport {\n StzhToastbarInitialToast,\n StzhToastType,\n} from \"../../index\";\n\nimport Cookie from \"js-cookie\";\n\nconst KEY_PREFIX_CLOSED = \"stzh-components-toastbar-closed\";\n\n/**\n * @slot - Slot for stzh-toast elements\n */\n@Component({\n tag: \"stzh-toastbar\",\n styleUrl: \"stzh-toastbar.scss\",\n shadow: true\n})\nexport class StzhToastbar {\n /**\n * Time after toasts are hidden (in seconds).\n * Toasts with type `error` will stay, until the user closes them manually.\n */\n @Prop() hideAfter: number = 30;\n\n /**\n * Maximum of toasts allowed to be shown.\n * If more are created, oldest will be hidden, even if timeout not ended yet or toast type is `error`.\n */\n @Prop() max: number = 5;\n\n /**\n * Initial toasts.\n *\n * Array of objects that at least includes `label` and optionally `type`, `link` (object with `href` and `label`) `cookie` and `cookieExpires`:\n * `[{\"label\": \"Lorem ipsum\", \"link\": { \"label\": \"More info\", \"href\": \"https://example.com\" }, \"cookie\": \"cookie-banner\", \"cookieExpires\": 365 }]`\n *\n * If `cookie` exists in an object, it will check for that cookie name first (prefixed with `stzh-components-toastbar-closed-`) and only show if cookie doesn't exist.\n * `cookieExpires` sets the cookie lifetime (default 365 days, set 0 for session cookie).\n */\n @Prop() initialToasts: StzhToastbarInitialToast[] | string = [];\n private _initialToasts: StzhToastbarInitialToast[] = [];\n\n @Element() element: HTMLStzhToastbarElement;\n\n /** Create new toast. */\n @Method()\n async toast(\n label: string,\n { type, link }: { type?: StzhToastType, link?: HTMLStzhButtonElement } = { type: \"info\" }\n ): Promise<HTMLStzhToastElement> {\n const toast = document.createElement(\"stzh-toast\");\n toast.hidden = true;\n toast.label = label;\n toast.role = \"alert\";\n toast.type = type || \"info\";\n toast.initialOpenAnimation = true;\n\n if (link) {\n link.slot = \"link\";\n link.size = \"small\";\n toast.appendChild(link);\n }\n\n this.element.appendChild(toast);\n\n return toast;\n }\n\n @Watch(\"initialToasts\")\n initialToastsWatcher(newValue: any[] | string) {\n if (typeof newValue === \"string\") {\n this._initialToasts = JSON.parse(newValue);\n } else {\n this._initialToasts = newValue;\n }\n }\n\n private toastAppended(toast: HTMLStzhToastElement) {\n if (toast.getAttribute('data-stzh-toastbar-managed')) {\n return;\n }\n\n toast.setAttribute('data-stzh-toastbar-managed', '');\n\n toast.addEventListener(\"stzhClosed\", () => {\n toast.remove();\n });\n\n if (toast.type !== \"error\") {\n let timeoutStarted = new Date().getTime();\n let restTime = this.hideAfter * 1000;\n let currentTimeout = window.setTimeout(() => {\n toast.hide();\n }, restTime);\n\n toast.addEventListener(\"pointerenter\", () => {\n if (currentTimeout) {\n window.clearTimeout(currentTimeout);\n const timePassed = new Date().getTime() - timeoutStarted;\n restTime = restTime - timePassed;\n }\n });\n\n toast.addEventListener(\"pointerleave\", () => {\n timeoutStarted = new Date().getTime();\n currentTimeout = window.setTimeout(() => {\n toast.hide();\n }, restTime);\n });\n }\n }\n\n private toastsAppended() {\n const host = (this.element.getRootNode() as ShadowRoot)?.host || this.element;\n Array.from(host.children).forEach((toast: HTMLStzhToastElement) => {\n this.toastAppended(toast);\n });\n }\n\n private hideOverflowingItems() {\n const host = (this.element.getRootNode() as ShadowRoot)?.host || this.element;\n const childCount = host.children.length;\n\n Array.from(host.children)\n .splice(0, childCount - this.max)\n .forEach((toast: HTMLStzhToastElement) => {\n toast.hide();\n });\n }\n\n private handleSlotchange = () => {\n this.toastsAppended();\n this.hideOverflowingItems();\n }\n\n componentWillLoad() {\n this.initialToastsWatcher(this.initialToasts);\n }\n\n componentDidLoad() {\n this._initialToasts.forEach(async (data) => {\n if (data.cookie) {\n const alreadyClosedBefore = Cookie.get(`${KEY_PREFIX_CLOSED}-${data.cookie}`);\n\n if (alreadyClosedBefore) {\n return;\n }\n }\n\n let link = data.link;\n\n if (!(link instanceof HTMLElement)) {\n const generatedLink = document.createElement(\"stzh-button\");\n generatedLink.slot = \"link\";\n generatedLink.size = \"small\";\n\n Object.assign(generatedLink, data.link);\n link = generatedLink;\n }\n\n const toast = await this.toast(data.label, {\n type: data.type,\n link: link as HTMLStzhButtonElement\n })\n\n if (data.cookie) {\n let cookieExpires = 365;\n\n if (data.cookieExpires === 0) {\n cookieExpires = null;\n } else if (data.cookieExpires) {\n cookieExpires = data.cookieExpires;\n }\n\n toast.addEventListener(\"stzhClosed\", () => {\n Cookie.set(`${KEY_PREFIX_CLOSED}-${data.cookie}`, '1', {\n expires: cookieExpires\n });\n });\n }\n })\n }\n\n render() {\n const classes = {\n \"stzh-toastbar\": true,\n };\n\n return (\n <Host>\n <div class={classes}>\n <slot onSlotchange={this.handleSlotchange}></slot>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
function tc(translation, count) {
|
|
2
|
-
if (!translation) {
|
|
3
|
-
return "";
|
|
4
|
-
}
|
|
5
|
-
const parts = translation.split('|');
|
|
6
|
-
let part = parts[0].trim();
|
|
7
|
-
if (parts.length === 3 && count === 1) {
|
|
8
|
-
part = parts[1].trim();
|
|
9
|
-
}
|
|
10
|
-
else if (parts.length === 3 && (count > 1 || count === null)) {
|
|
11
|
-
part = parts[2].trim();
|
|
12
|
-
}
|
|
13
|
-
if (parts.length === 2 && count !== 1) {
|
|
14
|
-
part = parts[1].trim();
|
|
15
|
-
}
|
|
16
|
-
return part.replace(/\{n\}/ig, (count === null || count === void 0 ? void 0 : count.toString()) || '');
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
export { tc as t };
|
|
20
|
-
|
|
21
|
-
//# sourceMappingURL=translation-utils-ffb7823c.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"translation-utils-ffb7823c.js","mappings":"SAqEgB,EAAE,CAAC,WAAmB,EAAE,KAAa;EACnD,IAAI,CAAC,WAAW,EAAE;IAChB,OAAO,EAAE,CAAC;GACX;EAED,MAAM,KAAK,GAAG,WAAW,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;EACrC,IAAI,IAAI,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC;EAE3B,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,IAAI,KAAK,KAAK,CAAC,EAAE;IACrC,IAAI,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC;GACxB;OAAM,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,KAAK,KAAK,GAAG,CAAC,IAAI,KAAK,KAAK,IAAI,CAAC,EAAE;IAC9D,IAAI,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC;GACxB;EAED,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,IAAI,KAAK,KAAK,CAAC,EAAE;IACrC,IAAI,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC;GACxB;EAED,OAAO,IAAI,CAAC,OAAO,CAAC,SAAS,EAAE,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,QAAQ,EAAE,KAAI,EAAE,CAAC,CAAC;AAC1D;;;;","names":[],"sources":["src/utils/translation-utils.ts"],"sourcesContent":["import {\n StzhDateFormat,\n StzhDateParse\n} from \"./date-adapter\";\n\nexport type StzhLocaleFormats = {\n datetime?: {\n format: string | StzhDateFormat,\n parse: string | StzhDateParse\n },\n datetimeLong?: {\n format: string | StzhDateFormat,\n parse: string | StzhDateParse\n },\n datetimeInput?: {\n format: string | StzhDateFormat,\n parse: string | StzhDateParse\n },\n date?: {\n format: string | StzhDateFormat,\n parse: string | StzhDateParse\n },\n dateLong?: {\n format: string | StzhDateFormat,\n parse: string | StzhDateParse\n },\n dateInput?: {\n format: string | StzhDateFormat,\n parse: string | StzhDateParse\n },\n time?: {\n format: string | StzhDateFormat,\n parse: string | StzhDateParse\n },\n timeInput?: {\n format: string | StzhDateFormat,\n parse: string | StzhDateParse\n },\n}\n\ntype MonthsNames = [string, string, string, string, string, string, string, string, string, string, string, string]\ntype DayNames = [string, string, string, string, string, string, string]\n\nexport type StzhLocaleGlobals = {\n dateRange: string,\n timeRange: string,\n externalLinkLabel: string\n downloadLinkLabel: string\n requiredFieldMarker: string\n requiredFieldText: string\n optionalFieldMarker: string\n optionalFieldText: string\n invalidFieldText: string\n clearButtonLabel: string\n moreInfoButtonLabel: string\n dayNames: DayNames\n dayNamesShort: DayNames\n monthNames: MonthsNames\n monthNamesShort: MonthsNames\n}\n\nexport type StzhLocaleComponent = {\n $locale: \"de\" | \"en\",\n $formats: StzhLocaleFormats,\n $formatsIso: StzhLocaleFormats,\n $formatsLegacy: StzhLocaleFormats,\n $globals: StzhLocaleGlobals\n}\n\nexport function tc(translation: string, count: number): string {\n if (!translation) {\n return \"\";\n }\n\n const parts = translation.split('|');\n let part = parts[0].trim();\n\n if (parts.length === 3 && count === 1) {\n part = parts[1].trim();\n } else if (parts.length === 3 && (count > 1 || count === null)) {\n part = parts[2].trim();\n }\n\n if (parts.length === 2 && count !== 1) {\n part = parts[1].trim();\n }\n\n return part.replace(/\\{n\\}/ig, count?.toString() || '');\n}\n"],"version":3}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as t,c as s,h as i,a as e,g as n}from"./p-c7bfac7a.js";import{t as a}from"./p-41529de9.js";import{p as h,a as p}from"./p-23d404e1.js";import{h as o}from"./p-d789f265.js";import"./p-9b063923.js";const r=".sc-stzh-appointments-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-appointments-h{display:none}.sc-stzh-appointments-h::-moz-selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-appointments-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-appointments-h *.sc-stzh-appointments,.sc-stzh-appointments-h *.sc-stzh-appointments::before,.sc-stzh-appointments-h *.sc-stzh-appointments::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-appointments-h .has-focus.sc-stzh-appointments{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-appointments-h .stzh-fylingfocus-focused.sc-stzh-appointments{outline-style:none !important}.sc-stzh-appointments-h .stzh-fylingfocus-focused.sc-stzh-appointments::-moz-focus-inner{border:0 !important}.sc-stzh-appointments-h{--background-color:var(--stzh-color-secondary10)}.stzh-appointments__heading.sc-stzh-appointments:not(:empty){padding-bottom:var(--stzh-space-xsmall);margin-bottom:var(--stzh-space-xsmall)}@media screen and (min-width: 900px){.stzh-appointments__heading.sc-stzh-appointments:not(:empty){padding-bottom:var(--stzh-space-small)}}@media screen and (min-width: 1260px){.stzh-appointments__heading.sc-stzh-appointments:not(:empty){padding-bottom:var(--stzh-space-medium)}}@media screen and (min-width: 600px){.stzh-appointments__heading.sc-stzh-appointments:not(:empty){margin-bottom:var(--stzh-space-small)}}@media screen and (min-width: 900px){.stzh-appointments__heading.sc-stzh-appointments:not(:empty){margin-bottom:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){.stzh-appointments__heading.sc-stzh-appointments:not(:empty){margin-bottom:var(--stzh-space-xlarge)}}.stzh-appointments__wrapper.sc-stzh-appointments{padding-top:var(--stzh-space-medium);padding-bottom:var(--stzh-space-medium);display:flex;flex-direction:column;padding-left:var(--stzh-space-large);padding-right:var(--stzh-space-large);background-color:var(--background-color)}@media screen and (min-width: 600px){.stzh-appointments__wrapper.sc-stzh-appointments{padding-top:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-appointments__wrapper.sc-stzh-appointments{padding-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-appointments__wrapper.sc-stzh-appointments{padding-top:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){.stzh-appointments__wrapper.sc-stzh-appointments{padding-bottom:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-appointments__wrapper.sc-stzh-appointments{padding-bottom:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-appointments__wrapper.sc-stzh-appointments{padding-bottom:var(--stzh-space-xxlarge)}}@media screen and (min-width: 900px){.stzh-appointments__wrapper.sc-stzh-appointments{flex-direction:row}}.stzh-appointments__calendar-wrapper.sc-stzh-appointments{display:flex;flex-direction:column}@media screen and (min-width: 900px){.stzh-appointments__calendar-wrapper.sc-stzh-appointments{margin-right:var(--stzh-space-xxlarge)}}.stzh-appointments__appointments-wrapper.sc-stzh-appointments{flex-grow:1;display:flex;flex-direction:column}.stzh-appointments__calendar-title-wrapper.sc-stzh-appointments,.stzh-appointments__appointments-title-wrapper.sc-stzh-appointments{margin-bottom:var(--stzh-space-small);display:flex;align-items:center;justify-content:space-between}@media screen and (min-width: 900px){.stzh-appointments__calendar-title-wrapper.sc-stzh-appointments,.stzh-appointments__appointments-title-wrapper.sc-stzh-appointments{margin-bottom:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){.stzh-appointments__calendar-title-wrapper.sc-stzh-appointments,.stzh-appointments__appointments-title-wrapper.sc-stzh-appointments{margin-bottom:var(--stzh-space-large)}}.stzh-appointments__calendar-title.sc-stzh-appointments,.stzh-appointments__appointments-title.sc-stzh-appointments{font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:var(--stzh-font-style-heavy);font-size:var(--stzh-font-centi-font-size);line-height:var(--stzh-font-centi-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing);color:var(--stzh-color-primary70);display:flex;align-items:center}.stzh-appointments__calendar-icon.sc-stzh-appointments,.stzh-appointments__appointments-icon.sc-stzh-appointments{--size:var(--stzh-icon-size-large);margin-right:var(--stzh-space-xsmall)}.stzh-appointments__calendar-content.sc-stzh-appointments,.stzh-appointments__calendar-content-medium.sc-stzh-appointments{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)}@media screen and (min-width: 900px){.stzh-appointments__calendar-content.sc-stzh-appointments{display:none}}.stzh-appointments__calendar-content-medium.sc-stzh-appointments{display:none;background-color:var(--stzh-color-white);padding-bottom:var(--stzh-space-medium)}@media screen and (min-width: 900px){.stzh-appointments__calendar-content-medium.sc-stzh-appointments{display:block}}.stzh-appointments__appointments-content.sc-stzh-appointments{flex-grow:1}.stzh-appointments__appointments-radiogroup.sc-stzh-appointments{margin-top:var(--stzh-space-xsmall);margin-bottom:var(--stzh-space-xsmall)}.stzh-appointments__more-link.sc-stzh-appointments{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)}.stzh-appointments--has-calendar.sc-stzh-appointments .stzh-appointments__appointments-wrapper.sc-stzh-appointments{margin-top:var(--stzh-space-large)}@media screen and (min-width: 900px){.stzh-appointments--has-calendar.sc-stzh-appointments .stzh-appointments__appointments-wrapper.sc-stzh-appointments{margin-top:0}}";const m=class{constructor(i){t(this,i);this.stzhChange=s(this,"stzhChange",7);this.showMoreLink=false;this.moreItemsLeft=0;this.showCalendar=false;this.showSort=false;this.showSortStart=false;this.showSortPlace=false;this.showAppointmentsTitle=false;this.allAppointsmentOnSameDay=true;this.sortOptions=[];this.isDateDisabled=t=>{const s=!!this._appointments.find((s=>s.start.getFullYear()===t.getFullYear()&&s.start.getMonth()===t.getMonth()&&s.start.getDate()===t.getDate()));return!s};this.onNextActiveDateClick=async()=>{if(this.nextDate){this.currentDate=this.nextDate;const t=await this.datepickerElement.getPopover();if(t){t.hide()}}};this.onMoreClick=()=>{this.showItems=this.stepItems+this.showItems;const t=this.inputElement.querySelector("stzh-radio");t.focus()};this.onDropdownChange=async t=>{const s=t.target;const i=await s.getValue();if(i){this.sortBy=i}};this.onDatepickerChange=t=>{if(t.detail.component!=="stzh-datepicker"||!t.detail.valueAsDate){return}this.currentDate=t.detail.valueAsDate;this.showItems=this._initialShowItems};this.onRadioChange=t=>{this.value=t.detail.value;this.stzhChange.emit({component:"stzh-appointments",value:this.value})};this.localization=undefined;this.disableSort=false;this.sortBy="start";this.appointments=[];this.currentDate=undefined;this.value="";this.name="appointment";this.showItems=5;this.stepItems=5;this.calendarTitle="";this.appointmentsTitle="";this.dateAdapter=undefined}dateAdapterWatcher(t){if(!t){this.dateAdapter=window.stzhComponents.utils.createFormatParseAdapter(this.localization.$formats,this.localization.$globals)}}currentDateWatcher(t){if(!t){this._currentDate=this.dateByValue||this.earliestDate;if(!this.dateByValue){this.setValueToFirstAppointmentOfCurrentDate()}}else if(typeof t==="string"){this._currentDate=h(t);this.setValueToFirstAppointmentOfCurrentDate()}else{this._currentDate=t;const s=this.getCurrentDateAppointments().map((t=>t.value));if(!s.includes(this.value)){this.setValueToFirstAppointmentOfCurrentDate()}}}sortByWatcher(){this.setValueToFirstAppointmentOfCurrentDate()}valueWatcher(){this.updateDateByValue();this.currentDateWatcher(this.currentDate)}appointmentsWatcher(t){if(typeof t==="string"){this._appointments=JSON.parse(t)}else{this._appointments=t}this._appointments=this._appointments.map((t=>Object.assign(Object.assign({},t),{start:new Date(t.start),end:new Date(t.end)})));if(this._appointments.length>0){this._appointments.sort(((t,s)=>t["start"]>s["start"]?1:-1));this.earliestDate=this._appointments[0].start;this.latestDate=this._appointments[this._appointments.length-1].start;this.updateDateByValue()}if(this._appointments.length>1){const t=this._appointments[0].start;this.allAppointsmentOnSameDay=this._appointments.map((t=>t.start)).every((s=>`${s.getFullYear()}-${s.getMonth()}-${s.getDate()}`===`${t.getFullYear()}-${t.getMonth()}-${t.getDate()}`))}this.showCalendar=!this.allAppointsmentOnSameDay;this.showAppointmentsTitle=this._appointments.length>1;this.currentDateWatcher(this.currentDate)}updateDateByValue(){this.dateByValue=this.value&&this._appointments.find((t=>t.value===this.value)).start}getCurrentDateAppointments(){let t=0;const s=this._appointments.filter(((s,i)=>{const e=s.start.getFullYear()===this._currentDate.getFullYear()&&s.start.getMonth()===this._currentDate.getMonth()&&s.start.getDate()===this._currentDate.getDate();if(e){t=i}return e}));if(this._appointments[t+1]){this.nextDate=this._appointments[t+1].start}else{this.nextDate=null}s.sort(((t,s)=>t[this.sortBy]>s[this.sortBy]?1:-1));return s}setValueToFirstAppointmentOfCurrentDate(){const t=this.getCurrentDateAppointments().filter((t=>!t.disabled));if(t.length>0){this.value=t[0].value;this.stzhChange.emit({component:"stzh-appointments",value:this.value})}}async componentWillLoad(){this._initialShowItems=this.showItems;this.appointmentsWatcher(this.appointments);if(!this.localization){this.localization=await window.stzhComponents.utils.fetchTranslations(this.element,"appointments")}this.dateAdapterWatcher(this.dateAdapter)}componentWillRender(){const t=this.getCurrentDateAppointments();this.appointmentsShown=t.slice(0,this.showItems);this.showMoreLink=this.showItems<t.length;this.moreItemsLeft=t.length-this.showItems;this.showSortStart=!this.disableSort&&t.map((t=>this.dateAdapter.format(t.start,"time"))).filter(((t,s,i)=>i.indexOf(t)==s)).length>1;this.showSortPlace=!this.disableSort&&t.map((t=>t.place)).filter(((t,s,i)=>i.indexOf(t)==s)).length>1;this.sortOptions=[];if(this.showSortStart){this.sortOptions.push({text:this.localization.sortByTime,value:"start"})}if(this.showSortPlace){this.sortOptions.push({text:this.localization.sortByPlace,value:"place"})}this.showSort=!this.disableSort&&this.appointmentsShown.length>1;this._sortBy=this.showSortStart&&!this.showSortPlace&&"start"||!this.showSortStart&&this.showSortPlace&&"place"||this.sortBy}componentDidRender(){if(this.datepickerElement){this.datepickerElement.setDate(this._currentDate)}if(this.datepickerElementMedium){this.datepickerElementMedium.setDate(this._currentDate)}}render(){const t=o(this.element,"heading");const s={"stzh-appointments":true,"stzh-appointments--has-calendar":this.showCalendar,"stzh-appointments--has-appointments-title":this.showAppointmentsTitle,"stzh-appointments--has-sort":this.showSort};return i(e,{"has-heading":t},i("div",{class:s},i("div",{class:"stzh-appointments__heading"},i("slot",{name:"heading"})),i("div",{class:"stzh-appointments__wrapper"},this.showCalendar&&i("div",{class:"stzh-appointments__calendar-wrapper"},i("div",{class:"stzh-appointments__calendar-title-wrapper"},i("div",{class:"stzh-appointments__calendar-title"},i("stzh-icon",{class:"stzh-appointments__calendar-icon",name:"calendar"}),i("span",{class:"stzh-appointments__calendar-title-text"},this.calendarTitle||this.localization.calendarTitle))),i("div",{class:"stzh-appointments__calendar-content"},i("stzh-datepicker",{"hide-optional":true,ref:t=>this.datepickerElement=t,onStzhChange:this.onDatepickerChange,label:this.localization.datepickerLabel,calendarIsDateDisabled:this.isDateDisabled,calendarMin:p(this.earliestDate),calendarMax:p(this.latestDate)},i("stzh-link",{slot:"action",size:"inherit",disabled:!this.nextDate,onClick:this.onNextActiveDateClick},this.localization.nextDayWithAppointments))),i("div",{class:"stzh-appointments__calendar-content-medium"},i("stzh-datepicker",{"hide-optional":true,ref:t=>this.datepickerElementMedium=t,onStzhChange:this.onDatepickerChange,inline:true,calendarIsDateDisabled:this.isDateDisabled,calendarMin:p(this.earliestDate),calendarMax:p(this.latestDate)},this.nextDate&&i("stzh-link",{slot:"action",size:"inherit",onClick:this.onNextActiveDateClick},this.localization.nextDayWithAppointments)))),i("div",{class:"stzh-appointments__appointments-wrapper"},this.showAppointmentsTitle&&i("div",{class:"stzh-appointments__appointments-title-wrapper"},i("div",{class:"stzh-appointments__appointments-title"},i("stzh-icon",{class:"stzh-appointments__appointments-icon",name:"clock"}),i("span",{class:"stzh-appointments__appointments-title-text"},this.appointmentsTitle||this.localization.appointmentsTitle)),this.showSort&&i("div",{class:"stzh-appointments__sort"},i("stzh-dropdown",{"hide-optional":true,inline:true,"no-search":true,class:"stzh-appointments__sort-dropdown",variant:"plain",size:"small",sizeMedium:"tiny",items:[this._sortBy],options:this.sortOptions,onStzhChange:this.onDropdownChange}))),i("div",{class:"stzh-appointments__appointments-content"},i("stzh-radiogroup",{class:"stzh-appointments__appointments-radiogroup",ref:t=>this.inputElement=t,legend:this.localization.inputLegend,"hide-legend":true,name:this.name,value:this.value,preventUpdateProperties:["disabled"]},this.appointmentsShown.map((t=>i("stzh-radio",{onStzhChange:this.onRadioChange,value:t.value,disabled:typeof t.disabled!=="undefined"?t.disabled:false},i("stzh-text",{font:"heavy",size:"centi"},!this.showCalendar&&i("span",null,this.dateAdapter.format(t.start,"dateLong"),", "),this.dateAdapter.formatSpan(t.start,t.end,"time")),i("stzh-text",{size:"milli"},t.caption))))),this.showMoreLink&&i("stzh-link",{class:"stzh-appointments__more-link",size:"inherit",onClick:this.onMoreClick},a(this.localization.moreTextItems,this.moreItemsLeft>this.stepItems?this.stepItems:this.moreItemsLeft)))))))}get element(){return n(this)}static get watchers(){return{dateAdapter:["dateAdapterWatcher"],currentDate:["currentDateWatcher"],sortBy:["sortByWatcher"],value:["valueWatcher"],appointments:["appointmentsWatcher"]}}};m.style=r;export{m as stzh_appointments};
|
|
2
|
-
//# sourceMappingURL=p-24feb79f.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["stzhAppointmentsCss","StzhAppointments","this","showMoreLink","moreItemsLeft","showCalendar","showSort","showSortStart","showSortPlace","showAppointmentsTitle","allAppointsmentOnSameDay","sortOptions","isDateDisabled","date","dateHasAppointment","_appointments","find","appointment","start","getFullYear","getMonth","getDate","onNextActiveDateClick","async","nextDate","currentDate","popover","datepickerElement","getPopover","hide","onMoreClick","showItems","stepItems","radio","inputElement","querySelector","focus","onDropdownChange","event","target","sortBy","getValue","onDatepickerChange","detail","component","valueAsDate","_initialShowItems","onRadioChange","value","stzhChange","emit","dateAdapterWatcher","newValue","dateAdapter","window","stzhComponents","utils","createFormatParseAdapter","localization","$formats","$globals","currentDateWatcher","_currentDate","dateByValue","earliestDate","setValueToFirstAppointmentOfCurrentDate","parseISODate","appointmentsForNewDate","getCurrentDateAppointments","map","appt","includes","sortByWatcher","valueWatcher","updateDateByValue","appointmentsWatcher","JSON","parse","Object","assign","Date","end","length","sort","a","b","latestDate","firstDate","every","indexOfLastCurrentDayDate","appointmentsCurrentDate","filter","index","dateIsInCurrentDay","appointments","disabled","componentWillLoad","fetchTranslations","element","componentWillRender","appointmentsShown","slice","disableSort","format","item","pos","self","indexOf","place","push","text","sortByTime","sortByPlace","_sortBy","componentDidRender","setDate","datepickerElementMedium","render","headingUsed","hasSlot","classes","h","Host","class","name","calendarTitle","ref","el","onStzhChange","label","datepickerLabel","calendarIsDateDisabled","calendarMin","printISODate","calendarMax","slot","size","onClick","nextDayWithAppointments","inline","appointmentsTitle","variant","sizeMedium","items","options","legend","inputLegend","preventUpdateProperties","font","formatSpan","caption","tc","moreTextItems"],"sources":["src/components/stzh-appointments/stzh-appointments.scss?tag=stzh-appointments&encapsulation=scoped","src/components/stzh-appointments/stzh-appointments.tsx"],"sourcesContent":[":host {\n --background-color: #{$colorSecondary10};\n}\n\n.stzh-appointments {\n &__heading {\n &:not(:empty) {\n @include spaceCurve('padding-bottom', 'tiny');\n margin-bottom: space('xsmall');\n\n @include mq($from: small) {\n margin-bottom: space('small');\n }\n\n @include mq($from: medium) {\n margin-bottom: space('medium');\n }\n\n @include mq($from: large) {\n margin-bottom: space('xlarge');\n }\n }\n }\n\n // &__actions {\n // &:not(:empty) {\n // @include spaceCurve('margin-top', 'medium');\n // }\n // }\n\n &__wrapper {\n @include spaceCurve('padding-top', 'regular');\n @include spaceCurve('padding-bottom', 'regular');\n display: flex;\n flex-direction: column;\n padding-left: space('large');\n padding-right: space('large');\n background-color: var(--background-color);\n\n @include mq($from: medium) {\n flex-direction: row;\n }\n }\n\n &__calendar-wrapper {\n display: flex;\n flex-direction: column;\n\n @include mq($from: medium) {\n margin-right: space('xxlarge');\n }\n }\n\n &__appointments-wrapper {\n flex-grow: 1;\n display: flex;\n flex-direction: column;\n }\n\n &__calendar-title-wrapper,\n &__appointments-title-wrapper {\n @include spaceCurve('margin-bottom', 'small');\n display: flex;\n align-items: center;\n justify-content: space-between;\n }\n\n &__calendar-title,\n &__appointments-title {\n @include font('heavy');\n @include fontSize('centi');\n color: $colorPrimary70;\n display: flex;\n align-items: center;\n }\n\n &__calendar-icon,\n &__appointments-icon {\n --size: #{iconSize('large')};\n margin-right: space('xsmall');\n }\n\n &__calendar-content,\n &__calendar-content-medium {\n @include fontSize('milli');\n }\n\n &__calendar-content {\n @include mq($from: medium) {\n display: none;\n }\n }\n\n &__calendar-content-medium {\n display: none;\n background-color: $colorWhite;\n padding-bottom: space('medium');\n\n @include mq($from: medium) {\n display: block;\n }\n }\n\n &__appointments-content {\n flex-grow: 1;\n }\n\n &__appointments-radiogroup {\n margin-top: space('xsmall');\n margin-bottom: space('xsmall');\n }\n\n &__more-link {\n @include fontSize('milli');\n margin-top: space('medium');\n }\n\n &--has-calendar &__appointments-wrapper {\n margin-top: space('large');\n\n @include mq($from: medium) {\n margin-top: 0;\n }\n }\n}\n","import {\n Component,\n Host,\n Element,\n Prop,\n h,\n Watch,\n Event,\n EventEmitter\n} from \"@stencil/core\";\n\nimport {\n StzhAppointmentsChangeEvent,\n StzhRadioChangeEvent,\n StzhDatepickerChangeEvent,\n StzhDropdownChangeEvent,\n} from \"../../index\";\n\nimport { tc } from \"../../utils/translation-utils\";\n\nimport { printISODate, parseISODate } from \"../../utils/date-utils\";\nimport { StzhLocaleAdapter } from \"../../utils/date-adapter\";\n\nimport { StzhAppointmentsLocalizedText } from \"./stzh-appointments.localization\"\nimport { hasSlot } from \"../../utils/utils\";\n\n/**\n * @slot - Slot for any content\n */\n@Component({\n tag: \"stzh-appointments\",\n styleUrl: \"stzh-appointments.scss\",\n scoped: true\n})\nexport class StzhAppointments {\n /** Translation strings */\n @Prop() localization: StzhAppointmentsLocalizedText;\n\n /** Hides the sort dropdown when true */\n @Prop() disableSort = false;\n\n /** Sort by */\n @Prop({ mutable: true }) sortBy: \"start\" | \"place\" = \"start\";\n private _sortBy: \"start\" | \"place\";\n\n /** Initial selected values */\n @Prop() appointments: any[] | string = [];\n private _appointments: any[];\n private appointmentsShown: any[];\n\n /** Current selected date (if undefined, earliest appointment date in list is taken or current selected one by value) */\n @Prop({ mutable: true }) currentDate: Date | string;\n private _currentDate: Date;\n\n /* Selected appointment by value */\n @Prop({ mutable: true }) value: string = \"\";\n\n /* Name of radiogroup form element */\n @Prop({ reflect: true }) name: string = \"appointment\";\n\n /** Nr of items shown */\n @Prop({ mutable: true }) showItems: number = 5;\n private _initialShowItems: number;\n\n /** Nr of items shown when more link is clicked */\n @Prop() stepItems: number = 5;\n\n /** Overwrite default calendar title */\n @Prop() calendarTitle = \"\";\n\n /** Overwrite default appointments title */\n @Prop() appointmentsTitle = \"\";\n\n /**\n * Date adapter, for custom parsing/formatting.\n * Must be an object with a `parse` function which accepts a `string` and returns a `Date`,\n * and a `format` function which accepts a `Date` and returns a `string`.\n */\n @Prop() dateAdapter: StzhLocaleAdapter;\n\n @Element() element: HTMLStzhAppointmentsElement;\n\n /** Appointments change event */\n @Event() stzhChange: EventEmitter<StzhAppointmentsChangeEvent>;\n\n @Watch(\"dateAdapter\")\n dateAdapterWatcher(newValue: StzhLocaleAdapter) {\n if (!newValue) {\n this.dateAdapter = window.stzhComponents.utils.createFormatParseAdapter(\n this.localization.$formats,\n this.localization.$globals\n );\n }\n }\n\n @Watch(\"currentDate\")\n currentDateWatcher(newValue: Date | string) {\n if (!newValue) {\n this._currentDate = this.dateByValue || this.earliestDate;\n\n if (!this.dateByValue) {\n this.setValueToFirstAppointmentOfCurrentDate();\n }\n } else if (typeof newValue === \"string\") {\n this._currentDate = parseISODate(newValue);\n this.setValueToFirstAppointmentOfCurrentDate();\n } else {\n this._currentDate = newValue;\n // Check if value already corresponds to a valid appointment on the new date\n const appointmentsForNewDate = this.getCurrentDateAppointments().map(appt => appt.value);\n if (!appointmentsForNewDate.includes(this.value)) {\n this.setValueToFirstAppointmentOfCurrentDate();\n }\n }\n }\n\n @Watch(\"sortBy\")\n sortByWatcher() {\n this.setValueToFirstAppointmentOfCurrentDate();\n }\n\n @Watch(\"value\")\n valueWatcher() {\n this.updateDateByValue();\n // update current date if user has not choosen one\n this.currentDateWatcher(this.currentDate);\n }\n\n @Watch(\"appointments\")\n appointmentsWatcher(newValue: any[] | string) {\n if (typeof newValue === \"string\") {\n this._appointments = JSON.parse(newValue);\n } else {\n this._appointments = newValue;\n }\n\n // convert start and end field to date\n this._appointments = this._appointments.map(appointment => ({\n ...appointment,\n start: new Date(appointment.start),\n end: new Date(appointment.end),\n }))\n\n if (this._appointments.length > 0) {\n // sort with start field and find earliest and latest date\n this._appointments.sort((a, b) => a['start'] > b['start'] ? 1 : -1);\n this.earliestDate = this._appointments[0].start;\n this.latestDate = this._appointments[this._appointments.length - 1].start;\n this.updateDateByValue();\n }\n\n // determine whether all appointments are from the same day\n if (this._appointments.length > 1) {\n const firstDate = this._appointments[0].start;\n this.allAppointsmentOnSameDay = this._appointments\n .map(appointment => appointment.start)\n .every(date => `${date.getFullYear()}-${date.getMonth()}-${date.getDate()}`\n === `${firstDate.getFullYear()}-${firstDate.getMonth()}-${firstDate.getDate()}`);\n }\n\n // update flags\n this.showCalendar = !this.allAppointsmentOnSameDay;\n this.showAppointmentsTitle = this._appointments.length > 1;\n\n // update current date if user has not choosen one\n this.currentDateWatcher(this.currentDate);\n }\n\n private dateByValue: Date;\n private earliestDate: Date;\n private latestDate: Date;\n private nextDate: Date;\n\n private showMoreLink: boolean = false;\n private moreItemsLeft: number = 0;\n private showCalendar: boolean = false;\n private showSort: boolean = false;\n private showSortStart: boolean = false;\n private showSortPlace: boolean = false;\n private showAppointmentsTitle: boolean = false;\n private allAppointsmentOnSameDay: boolean = true;\n private sortOptions = [];\n\n private inputElement: HTMLStzhRadiogroupElement;\n private datepickerElement: HTMLStzhDatepickerElement;\n private datepickerElementMedium: HTMLStzhDatepickerElement;\n\n private updateDateByValue() {\n this.dateByValue = this.value\n && this._appointments\n .find(appointment => appointment.value === this.value)\n .start;\n }\n\n private getCurrentDateAppointments() {\n let indexOfLastCurrentDayDate = 0;\n\n // filter to current date appointments that can be shown\n const appointmentsCurrentDate = this._appointments\n .filter((appointment, index) => {\n const dateIsInCurrentDay = appointment.start.getFullYear() === this._currentDate.getFullYear()\n && appointment.start.getMonth() === this._currentDate.getMonth()\n && appointment.start.getDate() === this._currentDate.getDate();\n\n if (dateIsInCurrentDay) {\n indexOfLastCurrentDayDate = index;\n }\n\n return dateIsInCurrentDay;\n });\n\n // find next day with dates or set to null\n if (this._appointments[indexOfLastCurrentDayDate + 1]) {\n this.nextDate = this._appointments[indexOfLastCurrentDayDate + 1].start;\n } else {\n this.nextDate = null;\n }\n\n // sort\n appointmentsCurrentDate.sort((a, b) => a[this.sortBy] > b[this.sortBy] ? 1 : -1);\n return appointmentsCurrentDate;\n }\n\n private setValueToFirstAppointmentOfCurrentDate() {\n // choose the first available appointment from current date\n const appointments = this.getCurrentDateAppointments()\n .filter(appointment => !appointment.disabled)\n\n if (appointments.length > 0) {\n this.value = appointments[0].value;\n this.stzhChange.emit({\n component: \"stzh-appointments\",\n value: this.value\n });\n }\n }\n\n private isDateDisabled = (date: Date) => {\n const dateHasAppointment: boolean = !!this._appointments.find(appointment => {\n return appointment.start.getFullYear() === date.getFullYear()\n && appointment.start.getMonth() === date.getMonth()\n && appointment.start.getDate() === date.getDate();\n });\n\n return !dateHasAppointment;\n }\n\n private onNextActiveDateClick = async () => {\n if (this.nextDate) {\n this.currentDate = this.nextDate;\n\n const popover = await this.datepickerElement.getPopover();\n\n if (popover) {\n popover.hide();\n }\n }\n }\n\n private onMoreClick = () => {\n this.showItems = this.stepItems + this.showItems;\n\n // return focus to radiogroup\n const radio = this.inputElement.querySelector('stzh-radio');\n radio.focus();\n }\n\n private onDropdownChange = async (event: CustomEvent<StzhDropdownChangeEvent>) => {\n const target: HTMLStzhDropdownElement = event.target as HTMLStzhDropdownElement;\n\n const sortBy = await target.getValue() as \"start\" | \"place\" | \"\";\n\n if (sortBy) {\n this.sortBy = sortBy;\n }\n }\n\n private onDatepickerChange = (event: CustomEvent<StzhDatepickerChangeEvent>) => {\n if (event.detail.component !== 'stzh-datepicker' || !event.detail.valueAsDate) {\n return;\n }\n\n this.currentDate = event.detail.valueAsDate;\n // reset number of items that should be shown\n this.showItems = this._initialShowItems;\n }\n\n private onRadioChange = (event: CustomEvent<StzhRadioChangeEvent>) => {\n this.value = event.detail.value;\n this.stzhChange.emit({\n component: \"stzh-appointments\",\n value: this.value\n });\n }\n\n async componentWillLoad() {\n this._initialShowItems = this.showItems;\n this.appointmentsWatcher(this.appointments);\n\n if (!this.localization) {\n this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, \"appointments\");\n }\n\n this.dateAdapterWatcher(this.dateAdapter);\n }\n\n componentWillRender() {\n const appointments = this.getCurrentDateAppointments();\n\n // slice to max that should be visible\n this.appointmentsShown = appointments.slice(0, this.showItems);\n\n // set flags\n this.showMoreLink = this.showItems < appointments.length;\n this.moreItemsLeft = appointments.length - this.showItems;\n\n // don't show time sort when only one time in the current day\n this.showSortStart = !this.disableSort && appointments\n .map(appointment => {\n return this.dateAdapter.format(appointment.start, \"time\");\n }).filter((item, pos, self) => {\n return self.indexOf(item) == pos;\n }).length > 1;\n\n // don't show place sort when only one place in the current day\n this.showSortPlace = !this.disableSort && appointments\n .map(appointment => {\n return appointment.place;\n }).filter((item, pos, self) => {\n return self.indexOf(item) == pos;\n }).length > 1;\n\n this.sortOptions = [];\n\n if (this.showSortStart) {\n this.sortOptions.push({\n text: this.localization.sortByTime,\n value: \"start\"\n });\n }\n\n if (this.showSortPlace) {\n this.sortOptions.push({\n text: this.localization.sortByPlace,\n value: \"place\"\n });\n }\n\n this.showSort = !this.disableSort && this.appointmentsShown.length > 1;\n\n // determine sort (force alternative sorting if it makes sense)\n this._sortBy =\n (this.showSortStart && !this.showSortPlace && \"start\")\n || (!this.showSortStart && this.showSortPlace && \"place\")\n || this.sortBy;\n }\n\n componentDidRender() {\n // set datepickers values to current date\n if (this.datepickerElement) {\n this.datepickerElement.setDate(this._currentDate);\n }\n\n if (this.datepickerElementMedium) {\n this.datepickerElementMedium.setDate(this._currentDate);\n }\n }\n\n render() {\n const headingUsed: boolean = hasSlot(this.element, \"heading\");\n\n const classes = {\n \"stzh-appointments\": true,\n \"stzh-appointments--has-calendar\": this.showCalendar,\n \"stzh-appointments--has-appointments-title\": this.showAppointmentsTitle,\n \"stzh-appointments--has-sort\": this.showSort\n };\n\n return (\n <Host has-heading={headingUsed}>\n <div class={classes}>\n <div class=\"stzh-appointments__heading\">\n <slot name=\"heading\"></slot>\n </div>\n\n <div class=\"stzh-appointments__wrapper\">\n {this.showCalendar &&\n <div class=\"stzh-appointments__calendar-wrapper\">\n <div class=\"stzh-appointments__calendar-title-wrapper\">\n <div class=\"stzh-appointments__calendar-title\">\n <stzh-icon class=\"stzh-appointments__calendar-icon\" name=\"calendar\"></stzh-icon>\n <span class=\"stzh-appointments__calendar-title-text\">\n {this.calendarTitle || this.localization.calendarTitle}\n </span>\n </div>\n </div>\n <div class=\"stzh-appointments__calendar-content\">\n <stzh-datepicker\n hide-optional\n ref={(el) => (this.datepickerElement = el as HTMLStzhDatepickerElement)}\n onStzhChange={this.onDatepickerChange}\n label={this.localization.datepickerLabel}\n calendarIsDateDisabled={this.isDateDisabled}\n calendarMin={printISODate(this.earliestDate)}\n calendarMax={printISODate(this.latestDate)}\n >\n <stzh-link\n slot=\"action\"\n size=\"inherit\"\n disabled={!this.nextDate}\n onClick={this.onNextActiveDateClick}\n >\n {this.localization.nextDayWithAppointments}\n </stzh-link>\n </stzh-datepicker>\n </div>\n <div class=\"stzh-appointments__calendar-content-medium\">\n <stzh-datepicker\n hide-optional\n ref={(el) => (this.datepickerElementMedium = el as HTMLStzhDatepickerElement)}\n onStzhChange={this.onDatepickerChange}\n inline\n calendarIsDateDisabled={this.isDateDisabled}\n calendarMin={printISODate(this.earliestDate)}\n calendarMax={printISODate(this.latestDate)}\n >\n {this.nextDate &&\n <stzh-link\n slot=\"action\"\n size=\"inherit\"\n onClick={this.onNextActiveDateClick}\n >\n {this.localization.nextDayWithAppointments}\n </stzh-link>\n }\n </stzh-datepicker>\n </div>\n </div>\n }\n <div class=\"stzh-appointments__appointments-wrapper\">\n {this.showAppointmentsTitle &&\n <div class=\"stzh-appointments__appointments-title-wrapper\">\n <div class=\"stzh-appointments__appointments-title\">\n <stzh-icon class=\"stzh-appointments__appointments-icon\" name=\"clock\"></stzh-icon>\n <span class=\"stzh-appointments__appointments-title-text\">\n {this.appointmentsTitle || this.localization.appointmentsTitle}\n </span>\n </div>\n {this.showSort &&\n <div class=\"stzh-appointments__sort\">\n <stzh-dropdown\n hide-optional\n inline\n no-search\n class=\"stzh-appointments__sort-dropdown\"\n variant=\"plain\"\n size=\"small\"\n sizeMedium={\"tiny\"}\n items={[this._sortBy]}\n options={this.sortOptions}\n onStzhChange={this.onDropdownChange}\n ></stzh-dropdown>\n </div>\n }\n </div>\n }\n\n <div class=\"stzh-appointments__appointments-content\">\n <stzh-radiogroup\n class=\"stzh-appointments__appointments-radiogroup\"\n ref={(el) => this.inputElement = el as HTMLStzhRadiogroupElement}\n legend={this.localization.inputLegend}\n hide-legend\n name={this.name}\n value={this.value}\n preventUpdateProperties={[\"disabled\"]}\n >\n {this.appointmentsShown.map((appointment) =>\n <stzh-radio\n onStzhChange={this.onRadioChange}\n value={appointment.value}\n disabled={typeof appointment.disabled !== \"undefined\" ? appointment.disabled : false}\n >\n <stzh-text font=\"heavy\" size=\"centi\">\n {!this.showCalendar && <span>{this.dateAdapter.format(appointment.start, \"dateLong\")}, </span>}\n {this.dateAdapter.formatSpan(appointment.start, appointment.end, \"time\")}\n </stzh-text>\n <stzh-text size=\"milli\">{appointment.caption}</stzh-text>\n </stzh-radio>\n )}\n </stzh-radiogroup>\n\n {this.showMoreLink &&\n <stzh-link\n class=\"stzh-appointments__more-link\"\n size=\"inherit\"\n onClick={this.onMoreClick}\n >\n {tc(this.localization.moreTextItems,\n this.moreItemsLeft > this.stepItems\n ? this.stepItems\n : this.moreItemsLeft)}\n </stzh-link>\n }\n </div>\n </div>\n </div>\n\n {/* <div class=\"stzh-appointments__actions\">\n <slot name=\"actions\"></slot>\n </div> */}\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as i,c as t,h as s,a,g as d}from"./p-c7bfac7a.js";import{s as e}from"./p-d789f265.js";import{c as o}from"./p-3d5f9ac0.js";import{c as h}from"./p-ed63ed76.js";import"./p-9b063923.js";const n=".sc-stzh-dialog-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-dialog-h{display:none}.sc-stzh-dialog-h::-moz-selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-dialog-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-dialog-h *.sc-stzh-dialog,.sc-stzh-dialog-h *.sc-stzh-dialog::before,.sc-stzh-dialog-h *.sc-stzh-dialog::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-dialog-h .has-focus.sc-stzh-dialog{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-dialog-h .stzh-fylingfocus-focused.sc-stzh-dialog{outline-style:none !important}.sc-stzh-dialog-h .stzh-fylingfocus-focused.sc-stzh-dialog::-moz-focus-inner{border:0 !important}.sc-stzh-dialog-h{--padding-top:var(--stzh-space-xxlarge);--padding-bottom:var(--stzh-space-xxlarge);--padding-left:var(--stzh-space-xlarge);--padding-right:var(--stzh-space-xlarge);--width:100%;--backdrop-opacity:var(--stzh-dialog-backdrop-opacity);--backdrop-background-color:var(--stzh-dialog-backdrop-background-color)}@media screen and (min-width: 900px){.sc-stzh-dialog-h{--padding-top:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){.sc-stzh-dialog-h{--padding-top:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 900px){.sc-stzh-dialog-h{--padding-bottom:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){.sc-stzh-dialog-h{--padding-bottom:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 900px){.sc-stzh-dialog-h{--padding-left:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){.sc-stzh-dialog-h{--padding-left:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 900px){.sc-stzh-dialog-h{--padding-right:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){.sc-stzh-dialog-h{--padding-right:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 600px){.sc-stzh-dialog-h{--width:33.5rem}}@media screen and (min-width: 900px){.sc-stzh-dialog-h{--width:38.125rem}}@media screen and (min-width: 1260px){.sc-stzh-dialog-h{--width:54.125rem}}@media screen and (min-width: 1600px){.sc-stzh-dialog-h{--width:55.5rem}}@media screen and (min-width: 600px){[size=small].sc-stzh-dialog-h{--width:24.6875rem}}@media screen and (min-width: 900px){[size=small].sc-stzh-dialog-h{--width:28.75rem}}@media screen and (min-width: 1260px){[size=small].sc-stzh-dialog-h{--width:32rem}}.stzh-dialog.sc-stzh-dialog{z-index:var(--stzh-z-index-dialog);display:none;position:fixed;top:0;left:0;width:100%;height:100%;flex-direction:column;align-items:stretch;justify-content:stretch}.stzh-dialog__content.sc-stzh-dialog{z-index:2;position:relative;display:flex;flex-direction:column;align-items:center;flex-grow:1;overflow:auto}.stzh-dialog__dialog.sc-stzh-dialog{position:relative;display:flex;flex-direction:column;margin:auto;border:none;background-color:var(--stzh-color-white);width:var(--width);max-width:100%;box-shadow:var(--stzh-box-shadow-overlay);height:100vh;max-height:100vh;overflow:hidden;outline:none}@media screen and (min-width: 600px){.stzh-dialog__dialog.sc-stzh-dialog{height:auto}}.stzh-dialog__backdrop.sc-stzh-dialog{z-index:1;position:absolute;top:0px;left:0px;width:100%;height:100%;overflow-x:hidden;overflow-y:auto;text-align:center;background-color:var(--backdrop-background-color);opacity:var(--backdrop-opacity)}.stzh-dialog__heading.sc-stzh-dialog{padding-bottom:var(--stzh-space-medium);padding-top:var(--padding-top);padding-left:var(--padding-left);padding-right:var(--padding-right)}@media screen and (min-width: 600px){.stzh-dialog__heading.sc-stzh-dialog{padding-bottom:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-dialog__heading.sc-stzh-dialog{padding-bottom:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-dialog__heading.sc-stzh-dialog{padding-bottom:var(--stzh-space-xxlarge)}}.stzh-dialog__dialog-content.sc-stzh-dialog{padding-left:var(--padding-left);padding-right:var(--padding-right);padding-top:var(--stzh-space-xlarge);padding-bottom:var(--stzh-space-xlarge);overflow:auto;flex-grow:1}@media screen and (min-width: 900px){.stzh-dialog__dialog-content.sc-stzh-dialog{padding-top:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){.stzh-dialog__dialog-content.sc-stzh-dialog{padding-top:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 900px){.stzh-dialog__dialog-content.sc-stzh-dialog{padding-bottom:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){.stzh-dialog__dialog-content.sc-stzh-dialog{padding-bottom:var(--stzh-space-xxxlarge)}}.stzh-dialog__actions.sc-stzh-dialog:not(:empty){padding-top:var(--stzh-space-medium);padding-bottom:var(--padding-bottom);padding-left:var(--padding-left);padding-right:var(--padding-right)}.stzh-dialog__close-button.sc-stzh-dialog{position:absolute;top:var(--stzh-space-xsmall);right:var(--stzh-space-xsmall)}@media screen and (min-width: 900px){.stzh-dialog__close-button.sc-stzh-dialog{top:var(--stzh-space-large);right:var(--stzh-space-large)}}.stzh-dialog--is-open.sc-stzh-dialog{display:flex}";const l="stzh-dialog-open";let r=null;let c=0;const g=class{constructor(s){i(this,s);this.stzhOpen=t(this,"stzhOpen",7);this.stzhClose=t(this,"stzhClose",7);this.handleDialogClick=i=>{const t=i.target;if(t.dataset.stzhDialogClose){this.hide()}else{const i=t.closest("[data-stzh-dialog-close]");if(i){this.hide()}}};this.handleCloseButtonClick=()=>{this.hide()};this.init=()=>{const i=this.element.querySelector('stzh-actions[slot="actions"]');if(i){e(i,{variant:"dialog"})}};this.localization=undefined;this.closeOnEscapeKey=false;this.closeOnBackdropClick=false;this.open=false;this.stay=true;this.size="default";this.hideClose=false;this.heading="";this.a11yRole="alertdialog";this.a11yLabel="";this.closeAnalyticsId=undefined}handleOutsideClick(i){if(!this.open||!this.closeOnBackdropClick){return}const t=i.target!==this.dialogElement&&this.dialogElement.contains(i.target)===false;if(t){this.hide()}}handleKeydown(i){if(i.key==="Escape"&&r===this&&this.closeOnEscapeKey){this.hide()}}handleOpenTriggerClick(i){const t=i.target;if(t.dataset.stzhDialogTrigger===this.element.id){this.show()}else{const i=t.closest("[data-stzh-dialog-trigger]");if(i&&i.dataset.stzhDialogTrigger===this.element.id){this.show()}}}async show(){this.open=true;this.stzhOpen.emit({component:"stzh-dialog"})}async hide(){this.open=false;this.stzhClose.emit({component:"stzh-dialog"})}getSiblings(){if(!this.parentElement){return[]}return Array.from(this.parentElement.children).filter((i=>i!==this.element))}disableSiblings(){this.getSiblings().forEach((i=>{i.setAttribute("aria-hidden","true")}))}enableSiblings(){this.getSiblings().forEach((i=>{i.removeAttribute("aria-hidden")}))}dialogShown(){r=this;document.body.classList.add(l);this.disableSiblings();if(this.trap){this.trap.activate()}}dialogHidden(){document.body.classList.remove(l);this.enableSiblings();if(this.trap){this.trap.deactivate()}r=null}async componentWillLoad(){this.id=`stzh-dialog-${c}`;c++;if(!this.localization){this.localization=await window.stzhComponents.utils.fetchTranslations(this.element,"dialog")}}componentDidRender(){this.open?this.dialogShown():this.dialogHidden()}componentDidUpdate(){this.trap.updateContainerElements(this.element)}componentDidLoad(){this.trap=h(this.element,Object.assign({fallbackFocus:this.dialogElement},o()));if(this.open){this.dialogShown()}}connectedCallback(){if(!this.stay&&this.element.parentElement!==document.body){document.body.appendChild(this.element)}this.parentElement=this.element.parentElement;this.init();this.observer=new MutationObserver(this.init);this.observer.observe(this.element,{childList:true,subtree:true})}disconnectedCallback(){this.dialogHidden();if(this.observer){this.observer.disconnect()}}render(){return s(a,null,s("div",{class:{"stzh-dialog":true,"stzh-dialog--is-open":this.open,"stzh-dialog--has-heading":!!this.heading,"stzh-dialog--has-close-hidden":this.hideClose,[`stzh-dialog--size-${this.size}`]:!!this.size}},s("div",{class:"stzh-dialog__backdrop"}),s("div",{class:"stzh-dialog__content"},s("div",{class:"stzh-dialog__dialog",ref:i=>this.dialogElement=i,tabindex:"-1",role:this.a11yRole,"aria-label":this.a11yLabel||null,"aria-labelledby":this.heading?`${this.id}-heading`:null,"aria-hidden":this.open?"false":"true",onClick:this.handleDialogClick},this.heading&&s("stzh-heading",{id:`${this.id}-heading`,class:"stzh-dialog__heading",level:"2"},this.heading),s("div",{class:"stzh-dialog__dialog-content"},s("slot",null)),s("div",{class:"stzh-dialog__actions"},s("slot",{name:"actions"})),!this.hideClose&&s("stzh-button",{class:"stzh-dialog__close-button",variant:"tertiary",size:"small",icon:"close",iconOnly:true,onClick:this.handleCloseButtonClick,a11yLabel:this.localization.close,analyticsId:this.closeAnalyticsId||this.localization.close})))))}get element(){return d(this)}};g.style=n;export{g as stzh_dialog};
|
|
2
|
-
//# sourceMappingURL=p-287f518f.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["stzhDialogCss","CLASS_BODY_OPEN","activeDialog","dialogCounter","StzhDialog","this","handleDialogClick","event","target","dataset","stzhDialogClose","hide","closest","handleCloseButtonClick","init","actions","element","querySelector","setPropsIfNull","variant","handleOutsideClick","open","closeOnBackdropClick","isClickOutside","dialogElement","contains","handleKeydown","key","closeOnEscapeKey","handleOpenTriggerClick","stzhDialogTrigger","id","show","stzhOpen","emit","component","stzhClose","getSiblings","parentElement","Array","from","children","filter","child","disableSiblings","forEach","sibling","setAttribute","enableSiblings","removeAttribute","dialogShown","document","body","classList","add","trap","activate","dialogHidden","remove","deactivate","componentWillLoad","localization","window","stzhComponents","utils","fetchTranslations","componentDidRender","componentDidUpdate","updateContainerElements","componentDidLoad","createFocusTrap","Object","assign","fallbackFocus","createBaseFocusTrapOptions","connectedCallback","stay","appendChild","observer","MutationObserver","observe","childList","subtree","disconnectedCallback","disconnect","render","h","Host","class","heading","hideClose","size","ref","el","tabindex","role","a11yRole","a11yLabel","onClick","level","name","icon","iconOnly","close","analyticsId","closeAnalyticsId"],"sources":["src/components/stzh-dialog/stzh-dialog.scss?tag=stzh-dialog&encapsulation=scoped","src/components/stzh-dialog/stzh-dialog.tsx"],"sourcesContent":["/**\n * @prop --width: Width of dialog\n * @prop --padding-top: Padding top of dialog\n * @prop --padding-bottom: Padding bottom of dialog\n * @prop --padding-left: Padding left of dialog\n * @prop --padding-right: Padding right of dialog\n * @prop --backdrop-opacity: Opacity of dialog backdrop\n * @prop --backdrop-background-color: Opacity of dialog background color\n *\n * @prop --stzh-dialog-backdrop-opacity: **Global**: Opacity of backdrops\n * @prop --stzh-dialog-backdrop-background-color: **Global**: Background color of backdrops\n */\n\n:host {\n @include spaceCurve('--padding-top', 'large');\n @include spaceCurve('--padding-bottom', 'large');\n @include spaceCurve('--padding-left', 'medium');\n @include spaceCurve('--padding-right', 'medium');\n --width: 100%;\n --backdrop-opacity: #{$dialogBackdropOpacity};\n --backdrop-background-color: #{$dialogBackdropBackgroundColor};\n\n @include mq($from: small) {\n --width: 536px;\n }\n\n @include mq($from: medium) {\n --width: 610px; // 786 before\n }\n\n @include mq($from: large) {\n --width: 866px; // 832 before\n }\n\n @include mq($from: ultra) {\n --width: 888px;\n }\n\n &[size=\"small\"] {\n @include mq($from: small) {\n --width: 395px;\n }\n\n @include mq($from: medium) {\n --width: 460px;\n }\n\n @include mq($from: large) {\n --width: 512px;\n }\n }\n}\n\n.stzh-dialog {\n z-index: $zIndexDialog;\n display: none;\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n flex-direction: column;\n align-items: stretch;\n justify-content: stretch;\n\n &__content {\n z-index: 2;\n position: relative;\n display: flex;\n flex-direction: column;\n align-items: center;\n flex-grow: 1;\n overflow: auto;\n }\n\n &__dialog {\n position: relative;\n display: flex;\n flex-direction: column;\n margin: auto;\n border: none;\n background-color: $colorWhite;\n width: var(--width);\n max-width: 100%;\n box-shadow: $boxShadowOverlay;\n height: 100vh;\n max-height: 100vh;\n // overflow: visible;\n overflow: hidden;\n outline: none;\n\n @include mq($from: small) {\n height: auto;\n }\n }\n\n &__backdrop {\n z-index: 1;\n position: absolute;\n top: 0px;\n left: 0px;\n width: 100%;\n height: 100%;\n overflow-x: hidden;\n overflow-y: auto;\n text-align: center;\n background-color: var(--backdrop-background-color);\n opacity: var(--backdrop-opacity);\n }\n\n &__heading {\n @include spaceCurve('padding-bottom', 'regular');\n padding-top: var(--padding-top);\n padding-left: var(--padding-left);\n padding-right: var(--padding-right);\n }\n\n &__dialog-content {\n padding-left: var(--padding-left);\n padding-right: var(--padding-right);\n @include spaceCurve('padding-top', 'medium');\n @include spaceCurve('padding-bottom', 'medium');\n overflow: auto;\n flex-grow: 1;\n }\n\n &__actions {\n &:not(:empty) {\n padding-top: space('medium');\n padding-bottom: var(--padding-bottom);\n padding-left: var(--padding-left);\n padding-right: var(--padding-right);\n }\n }\n\n &__close-button {\n position: absolute;\n top: space('xsmall');\n right: space('xsmall');\n\n @include mq($from: medium) {\n top: space('large');\n right: space('large');\n }\n }\n\n &--is-open {\n display: flex;\n }\n}\n","import {\n Host,\n Component,\n Element,\n Method,\n Listen,\n Prop,\n Event,\n EventEmitter,\n h,\n} from \"@stencil/core\";\n\nimport {\n StzhDialogOpenEvent,\n StzhDialogCloseEvent\n} from \"../../index\";\n\nimport { setPropsIfNull } from \"../../utils/utils\";\nimport { createBaseFocusTrapOptions } from \"../../utils/overlay-utils\";\n\nimport { StzhDialogLocalizedText } from \"./stzh-dialog.localization\"\n\nimport { createFocusTrap, FocusTrap } from 'focus-trap';\n\nconst CLASS_BODY_OPEN = \"stzh-dialog-open\";\n\nlet activeDialog: StzhDialog = null;\nlet dialogCounter = 0;\n\n/**\n * @slot actions - Slot for actions element\n * @slot - Slot for any content inside the dialog\n */\n@Component({\n tag: \"stzh-dialog\",\n styleUrl: \"stzh-dialog.scss\",\n scoped: true\n})\nexport class StzhDialog {\n /** Translation strings */\n @Prop() localization: StzhDialogLocalizedText;\n\n /** Close dialog when pressing ESC */\n @Prop() closeOnEscapeKey: boolean = false;\n\n /** Close dialog when clicking outside of it */\n @Prop() closeOnBackdropClick: boolean = false;\n\n /** Open status */\n @Prop({ mutable: true }) open: boolean = false;\n\n /** Stay in original position (true) or move to body (false) */\n @Prop() stay: boolean = true;\n\n /** Size */\n @Prop({ reflect: true }) size: \"default\" | \"small\" = \"default\";\n\n /** Whether to hide close button */\n @Prop() hideClose: boolean = false;\n\n /** Heading text */\n @Prop() heading: string = \"\";\n\n /** Accessibility role */\n @Prop({ attribute: \"a11y-role\" }) a11yRole: \"dialog\" | \"alertdialog\" = \"alertdialog\";\n\n /** Accessible label for dialog (use if no heading is used) */\n @Prop({ attribute: \"a11y-label\" }) a11yLabel: string = \"\";\n\n /**\n * For Adobe Analytics.\n * Will be rendered as value of `s-object-id` attribute to the close button element.\n * Default value will be taken from translations.\n */\n @Prop() closeAnalyticsId: string;\n\n /** Dialog open event */\n @Event() stzhOpen: EventEmitter<StzhDialogOpenEvent>;\n\n /** Dialog close event */\n @Event() stzhClose: EventEmitter<StzhDialogCloseEvent>;\n\n @Element() element: HTMLStzhDialogElement;\n\n @Listen(\"click\", { target: \"document\", capture: true })\n handleOutsideClick(event: MouseEvent) {\n if (!this.open || !this.closeOnBackdropClick) {\n return\n }\n\n const isClickOutside = event.target !== this.dialogElement\n && this.dialogElement.contains(event.target as HTMLElement) === false\n\n if (isClickOutside) {\n this.hide()\n }\n }\n\n @Listen(\"keydown\", { target: \"document\" })\n handleKeydown(event: KeyboardEvent) {\n if (\n event.key === \"Escape\"\n && activeDialog === this\n && this.closeOnEscapeKey\n ) {\n this.hide();\n }\n }\n\n @Listen(\"click\", { target: \"document\" })\n handleOpenTriggerClick(event: MouseEvent) {\n const target = event.target as HTMLElement;\n\n if (target.dataset.stzhDialogTrigger === this.element.id) {\n this.show();\n } else {\n const closest = target.closest(\"[data-stzh-dialog-trigger]\") as HTMLElement;\n\n if (closest && closest.dataset.stzhDialogTrigger === this.element.id) {\n this.show();\n }\n }\n }\n\n @Method()\n async show() {\n this.open = true;\n this.stzhOpen.emit({\n component: \"stzh-dialog\"\n });\n }\n\n @Method()\n async hide() {\n this.open = false;\n this.stzhClose.emit({\n component: \"stzh-dialog\"\n });\n }\n\n private observer: MutationObserver;\n private id: string;\n private trap: FocusTrap;\n private parentElement: HTMLElement;\n private dialogElement: HTMLDivElement;\n\n private handleDialogClick = (event: MouseEvent) => {\n const target = event.target as HTMLElement;\n if (target.dataset.stzhDialogClose) {\n this.hide();\n } else {\n const closest = target.closest(\"[data-stzh-dialog-close]\");\n\n if (closest) {\n this.hide();\n }\n }\n }\n\n private handleCloseButtonClick = () => {\n this.hide();\n }\n\n private init = () => {\n const actions = this.element.querySelector('stzh-actions[slot=\"actions\"]');\n\n if (actions) {\n setPropsIfNull(actions, {\n variant: \"dialog\"\n } as HTMLStzhActionsElement)\n }\n }\n\n private getSiblings() {\n if (!this.parentElement) {\n return [];\n }\n\n return Array.from(this.parentElement.children).filter(\n (child) => child !== this.element\n );\n }\n\n private disableSiblings() {\n this.getSiblings().forEach((sibling) => {\n sibling.setAttribute(\"aria-hidden\", \"true\");\n });\n }\n\n private enableSiblings() {\n this.getSiblings().forEach((sibling) => {\n sibling.removeAttribute(\"aria-hidden\");\n });\n }\n\n private dialogShown() {\n activeDialog = this;\n document.body.classList.add(CLASS_BODY_OPEN);\n this.disableSiblings();\n\n if (this.trap) {\n this.trap.activate();\n }\n }\n\n private dialogHidden() {\n document.body.classList.remove(CLASS_BODY_OPEN);\n this.enableSiblings();\n\n if (this.trap) {\n this.trap.deactivate();\n }\n\n activeDialog = null;\n }\n\n async componentWillLoad() {\n this.id = `stzh-dialog-${dialogCounter}`;\n dialogCounter++;\n\n if (!this.localization) {\n this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, \"dialog\");\n }\n }\n\n componentDidRender() {\n this.open ? this.dialogShown() : this.dialogHidden();\n }\n\n componentDidUpdate() {\n this.trap.updateContainerElements(this.element);\n }\n\n componentDidLoad() {\n this.trap = createFocusTrap(this.element, {\n fallbackFocus: this.dialogElement,\n ...createBaseFocusTrapOptions()\n });\n\n if (this.open) {\n this.dialogShown();\n }\n }\n\n connectedCallback() {\n if (!this.stay && this.element.parentElement !== document.body) {\n document.body.appendChild(this.element);\n }\n\n this.parentElement = this.element.parentElement;\n\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.dialogHidden();\n\n if (this.observer) {\n this.observer.disconnect();\n }\n }\n\n render() {\n return (\n <Host>\n <div\n class={{\n \"stzh-dialog\": true,\n \"stzh-dialog--is-open\": this.open,\n \"stzh-dialog--has-heading\": !!this.heading,\n \"stzh-dialog--has-close-hidden\": this.hideClose,\n [`stzh-dialog--size-${this.size}`]: !!this.size,\n }}\n >\n <div class=\"stzh-dialog__backdrop\"></div>\n <div class=\"stzh-dialog__content\">\n <div\n class=\"stzh-dialog__dialog\"\n ref={(el) => (this.dialogElement = el as HTMLDivElement)}\n tabindex=\"-1\"\n role={this.a11yRole}\n aria-label={this.a11yLabel || null}\n aria-labelledby={this.heading ? `${this.id}-heading` : null}\n aria-hidden={this.open ? \"false\" : \"true\"}\n onClick={this.handleDialogClick}\n >\n {this.heading &&\n <stzh-heading\n id={`${this.id}-heading`}\n class=\"stzh-dialog__heading\"\n level=\"2\"\n >\n {this.heading}\n </stzh-heading>\n }\n\n <div class=\"stzh-dialog__dialog-content\">\n <slot></slot>\n </div>\n\n <div class=\"stzh-dialog__actions\">\n <slot name=\"actions\"></slot>\n </div>\n\n {!this.hideClose &&\n <stzh-button\n class=\"stzh-dialog__close-button\"\n variant=\"tertiary\"\n size=\"small\"\n icon=\"close\"\n iconOnly={true}\n onClick={this.handleCloseButtonClick}\n a11yLabel={this.localization.close}\n analyticsId={this.closeAnalyticsId || this.localization.close}\n ></stzh-button>\n }\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n\n"],"mappings":"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"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
function i(i,n){if(!i){return""}const t=i.split("|");let e=t[0].trim();if(t.length===3&&n===1){e=t[1].trim()}else if(t.length===3&&(n>1||n===null)){e=t[2].trim()}if(t.length===2&&n!==1){e=t[1].trim()}return e.replace(/\{n\}/gi,(n===null||n===void 0?void 0:n.toString())||"")}export{i as t};
|
|
2
|
-
//# sourceMappingURL=p-41529de9.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["tc","translation","count","parts","split","part","trim","length","replace","toString"],"sources":["src/utils/translation-utils.ts"],"sourcesContent":["import {\n StzhDateFormat,\n StzhDateParse\n} from \"./date-adapter\";\n\nexport type StzhLocaleFormats = {\n datetime?: {\n format: string | StzhDateFormat,\n parse: string | StzhDateParse\n },\n datetimeLong?: {\n format: string | StzhDateFormat,\n parse: string | StzhDateParse\n },\n datetimeInput?: {\n format: string | StzhDateFormat,\n parse: string | StzhDateParse\n },\n date?: {\n format: string | StzhDateFormat,\n parse: string | StzhDateParse\n },\n dateLong?: {\n format: string | StzhDateFormat,\n parse: string | StzhDateParse\n },\n dateInput?: {\n format: string | StzhDateFormat,\n parse: string | StzhDateParse\n },\n time?: {\n format: string | StzhDateFormat,\n parse: string | StzhDateParse\n },\n timeInput?: {\n format: string | StzhDateFormat,\n parse: string | StzhDateParse\n },\n}\n\ntype MonthsNames = [string, string, string, string, string, string, string, string, string, string, string, string]\ntype DayNames = [string, string, string, string, string, string, string]\n\nexport type StzhLocaleGlobals = {\n dateRange: string,\n timeRange: string,\n externalLinkLabel: string\n downloadLinkLabel: string\n requiredFieldMarker: string\n requiredFieldText: string\n optionalFieldMarker: string\n optionalFieldText: string\n invalidFieldText: string\n clearButtonLabel: string\n moreInfoButtonLabel: string\n dayNames: DayNames\n dayNamesShort: DayNames\n monthNames: MonthsNames\n monthNamesShort: MonthsNames\n}\n\nexport type StzhLocaleComponent = {\n $locale: \"de\" | \"en\",\n $formats: StzhLocaleFormats,\n $formatsIso: StzhLocaleFormats,\n $formatsLegacy: StzhLocaleFormats,\n $globals: StzhLocaleGlobals\n}\n\nexport function tc(translation: string, count: number): string {\n if (!translation) {\n return \"\";\n }\n\n const parts = translation.split('|');\n let part = parts[0].trim();\n\n if (parts.length === 3 && count === 1) {\n part = parts[1].trim();\n } else if (parts.length === 3 && (count > 1 || count === null)) {\n part = parts[2].trim();\n }\n\n if (parts.length === 2 && count !== 1) {\n part = parts[1].trim();\n }\n\n return part.replace(/\\{n\\}/ig, count?.toString() || '');\n}\n"],"mappings":"SAqEgBA,EAAGC,EAAqBC,GACtC,IAAKD,EAAa,CAChB,MAAO,E,CAGT,MAAME,EAAQF,EAAYG,MAAM,KAChC,IAAIC,EAAOF,EAAM,GAAGG,OAEpB,GAAIH,EAAMI,SAAW,GAAKL,IAAU,EAAG,CACrCG,EAAOF,EAAM,GAAGG,M,MACX,GAAIH,EAAMI,SAAW,IAAML,EAAQ,GAAKA,IAAU,MAAO,CAC9DG,EAAOF,EAAM,GAAGG,M,CAGlB,GAAIH,EAAMI,SAAW,GAAKL,IAAU,EAAG,CACrCG,EAAOF,EAAM,GAAGG,M,CAGlB,OAAOD,EAAKG,QAAQ,WAAWN,IAAK,MAALA,SAAK,SAALA,EAAOO,aAAc,GACtD,Q"}
|