npm - @siemens/ix - Versions diffs - 0.0.0-pr-1724-20250228145306 → 0.0.0-pr-1724-20250305102750 - Mend

@siemens/ix 0.0.0-pr-1724-20250228145306 → 0.0.0-pr-1724-20250305102750

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.

Files changed (117) hide show

package/dist/cjs/ix-checkbox.cjs.entry.js CHANGED Viewed

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-66ad733a.js');
-const validation = require('./validation-190c7a84.js');
+const validation = require('./validation-f917b33d.js');
 const makeRef = require('./make-ref-499e1e41.js');
 const a11y = require('./a11y-ae470f01.js');

package/dist/cjs/ix-custom-field.cjs.entry.js CHANGED Viewed

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-66ad733a.js');
-const validation = require('./validation-190c7a84.js');
+const validation = require('./validation-f917b33d.js');
 const customFieldCss = ":host{display:block;width:-moz-fit-content;width:fit-content;height:-moz-fit-content;height:fit-content}";
 const IxCustomFieldStyle0 = customFieldCss;

package/dist/cjs/ix-date-input.cjs.entry.js CHANGED Viewed

@@ -6,8 +6,8 @@ const index = require('./index-66ad733a.js');
 const index$1 = require('./index-b44a6617.js');
 const luxon = require('./luxon-702fbf4c.js');
 const dropdownController = require('./dropdown-controller-aef51729.js');
-const input_util = require('./input.util-94fe9055.js');
-const validation = require('./validation-190c7a84.js');
+const input_util = require('./input.util-622a9947.js');
+const validation = require('./validation-f917b33d.js');
 const makeRef = require('./make-ref-499e1e41.js');
 require('./a11y-ae470f01.js');
 require('./mutation-observer-babb20a5.js');

package/dist/cjs/ix-drawer.cjs.entry.js CHANGED Viewed

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-66ad733a.js');
 const anime_es = require('./anime.es-e2814360.js');
-const drawerCss = ":host{top:0;right:0;box-shadow:var(--theme-box-shadow-level-3);display:block;position:absolute;justify-content:flex-start;align-items:center;opacity:0;max-height:100vh;min-height:1.5rem;background-color:var(--theme-color-1);border-radius:0.25rem;transition:all var(--theme-medium-time) ease-out}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .drawer-container{z-index:100}:host .header{display:flex;position:relative;align-items:center;justify-content:flex-end;padding:0.5rem;width:100%;order:1}:host .header .header-content{flex-grow:1;margin-right:1rem}:host .content{position:relative;flex:1;order:2;height:100%;width:100%;overflow-y:auto}:host(.display-none){display:none}";
+const drawerCss = ":host{top:0;right:0;box-shadow:var(--theme-box-shadow-level-3);display:block;position:absolute;justify-content:flex-start;align-items:center;opacity:0;max-height:100vh;min-height:1.5rem;background-color:var(--theme-color-1);border-radius:0.25rem}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .drawer-container{z-index:100}:host .header{display:flex;position:relative;align-items:center;justify-content:flex-end;padding:0.5rem;width:100%;order:1}:host .header .header-content{flex-grow:1;margin-right:1rem}:host .content{position:relative;flex:1;order:2;height:100%;width:100%;overflow-y:auto}:host(.display-none){display:none}";
 const IxDrawerStyle0 = drawerCss;
 const Drawer = class {

package/dist/cjs/ix-drawer.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ix-drawer.entry.cjs.js","mappings":"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","names":["anime","h","Host"],"sources":["src/components/drawer/drawer.scss?tag=ix-drawer&encapsulation=shadow","src/components/drawer/drawer.tsx"],"sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n@import 'mixins/shadow-dom/component';\n@import 'mixins/shadows';\n@import 'common-variables';\n\n:host {\n @include ix-component;\n\n top: 0;\n right: 0;\n @include box-shadow(3);\n\n display: block;\n position: absolute;\n justify-content: flex-start;\n align-items: center;\n opacity: 0;\n\n max-height: 100vh;\n min-height: $large-space;\n background-color: var(--theme-color-1);\n border-radius: $default-border-radius;\n\n transition: all var(--theme-medium-time) ease-out;\n\n .drawer-container {\n z-index: 100;\n }\n\n .header {\n display: flex;\n position: relative;\n align-items: center;\n justify-content: flex-end;\n padding: 0.5rem;\n width: 100%;\n order: 1;\n\n .header-content {\n flex-grow: 1;\n margin-right: $default-space;\n }\n }\n\n .content {\n position: relative;\n flex: 1;\n order: 2;\n height: 100%;\n width: 100%;\n overflow-y: auto;\n }\n}\n\n:host(.display-none) {\n display: none;\n}\n","/\n * SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n Component,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport anime from 'animejs';\n\n@Component({\n tag: 'ix-drawer',\n styleUrl: 'drawer.scss',\n shadow: true,\n})\nexport class Drawer {\n /\n Show or hide the drawer\n /\n @Prop({ mutable: true }) show = false;\n\n /\n Fired in case of an outside click during drawer showed state\n /\n @Prop() closeOnClickOutside = true;\n\n /\n Render the drawer with maximum height\n /\n @Prop() fullHeight = false;\n\n /\n Min width interpreted as REM\n /\n @Prop() minWidth = 16;\n\n /\n Max width interpreted as REM\n /\n @Prop() maxWidth = 28;\n\n /\n Width interpreted as REM if not set to 'auto'\n /\n @Prop() width: number \| 'auto' = this.minWidth;\n\n /\n Fire event after drawer is open\n /\n @Event() open!: EventEmitter;\n\n /\n Fire event after drawer is close\n /\n @Event() drawerClose!: EventEmitter;\n\n toggle = false;\n\n private static duration = 300;\n private callback = this.clickedOutside.bind(this);\n private divElement?: HTMLElement;\n\n @State() showContent = true;\n\n @Watch('show')\n onShowChanged(newValue: boolean, oldValue?: boolean) {\n if (newValue === oldValue) {\n return;\n }\n\n this.toggleDrawer(newValue);\n }\n\n /\n Toggle or define show state of drawer\n * @param show Overwrite toggle state with boolean\n */\n @Method()\n async toggleDrawer(show?: boolean): Promise<void> {\n show = show ?? !this.show;\n\n if (show) {\n const { defaultPrevented } = this.open.emit();\n\n if (defaultPrevented) {\n return;\n }\n\n this.show = true;\n if (!this.toggle && this.divElement) {\n this.slideInRight(this.divElement);\n setTimeout(() => {\n window.addEventListener('mousedown', this.callback);\n }, Drawer.duration);\n }\n } else {\n const { defaultPrevented } = this.drawerClose.emit();\n\n if (defaultPrevented) {\n return;\n }\n\n this.show = false;\n\n if (this.toggle && this.divElement) {\n this.slideOutRight(this.divElement);\n }\n\n window.removeEventListener('mousedown', this.callback);\n }\n\n this.toggle = this.show;\n\n return Promise.resolve();\n }\n\n private onCloseClicked() {\n this.toggleDrawer(false);\n }\n\n private clickedOutside(evt: any) {\n if (!this.closeOnClickOutside) {\n return;\n }\n\n const target = evt.target;\n const closestElement = target.closest('#div-container');\n const btn = target.closest('#drawer-btn');\n\n if (\n evt.target.type !== 'button' &&\n closestElement !== this.divElement &&\n target !== btn\n ) {\n this.show = false;\n }\n }\n\n private getConstrainedWidth(width: number) {\n return Math.min(Math.max(width, this.minWidth), this.maxWidth);\n }\n\n private slideOutRight(el: HTMLElement) {\n const initialWidth = `${this.getConstrainedWidth(\n this.width === 'auto' ? this.minWidth : this.width\n )}rem`;\n\n anime({\n targets: el,\n duration: Drawer.duration,\n width: [initialWidth, 0],\n opacity: [1, 0],\n easing: 'easeInSine',\n complete: () => {\n el.classList.add('display-none');\n },\n });\n }\n\n private slideInRight(el: HTMLElement) {\n const targetWidth = `${this.getConstrainedWidth(\n this.width === 'auto' ? this.minWidth : this.width\n )}rem`;\n\n anime({\n targets: el,\n duration: Drawer.duration,\n width: [0, targetWidth],\n opacity: [0, 1],\n easing: 'easeOutSine',\n begin: () => {\n el.classList.remove('display-none');\n },\n complete: () => {\n this.showContent = true;\n },\n });\n }\n\n componentDidLoad() {\n this.toggleDrawer(this.show);\n }\n\n render() {\n return (\n <Host\n class={{\n 'drawer-container': true,\n 'display-none': true,\n }}\n style={{\n width: '0',\n 'max-width': `${this.maxWidth}rem`,\n height: this.fullHeight ? '100%' : 'auto',\n overflow: 'hidden',\n }}\n ref={(el) => (this.divElement = el as HTMLElement)}\n data-testid=\"container\"\n id=\"div-container\"\n >\n <div\n style={{\n width:\n this.width === 'auto'\n ? 'auto'\n : `${this.getConstrainedWidth(this.width)}rem`,\n }}\n >\n <div class=\"header\">\n <div class=\"header-content\">\n <slot name=\"header\"></slot>\n </div>\n <ix-icon-button\n class=\"close-button\"\n style={{\n display: this.showContent ? 'block' : 'none',\n }}\n icon={'close'}\n size=\"24\"\n ghost\n onClick={() => this.onCloseClicked()}\n data-testid=\"close-button\"\n ></ix-icon-button>\n </div>\n <div\n class=\"content\"\n style={{\n display: this.showContent ? 'block' : 'none',\n }}\n >\n <slot></slot>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ix-drawer.entry.cjs.js","mappings":"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","names":["anime","h","Host"],"sources":["src/components/drawer/drawer.scss?tag=ix-drawer&encapsulation=shadow","src/components/drawer/drawer.tsx"],"sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n@import 'mixins/shadow-dom/component';\n@import 'mixins/shadows';\n@import 'common-variables';\n\n:host {\n @include ix-component;\n\n top: 0;\n right: 0;\n @include box-shadow(3);\n\n display: block;\n position: absolute;\n justify-content: flex-start;\n align-items: center;\n opacity: 0;\n\n max-height: 100vh;\n min-height: $large-space;\n background-color: var(--theme-color-1);\n border-radius: $default-border-radius;\n\n .drawer-container {\n z-index: 100;\n }\n\n .header {\n display: flex;\n position: relative;\n align-items: center;\n justify-content: flex-end;\n padding: 0.5rem;\n width: 100%;\n order: 1;\n\n .header-content {\n flex-grow: 1;\n margin-right: $default-space;\n }\n }\n\n .content {\n position: relative;\n flex: 1;\n order: 2;\n height: 100%;\n width: 100%;\n overflow-y: auto;\n }\n}\n\n:host(.display-none) {\n display: none;\n}\n","/\n * SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n Component,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport anime from 'animejs';\n\n@Component({\n tag: 'ix-drawer',\n styleUrl: 'drawer.scss',\n shadow: true,\n})\nexport class Drawer {\n /\n Show or hide the drawer\n /\n @Prop({ mutable: true }) show = false;\n\n /\n Fired in case of an outside click during drawer showed state\n /\n @Prop() closeOnClickOutside = true;\n\n /\n Render the drawer with maximum height\n /\n @Prop() fullHeight = false;\n\n /\n Min width interpreted as REM\n /\n @Prop() minWidth = 16;\n\n /\n Max width interpreted as REM\n /\n @Prop() maxWidth = 28;\n\n /\n Width interpreted as REM if not set to 'auto'\n /\n @Prop() width: number \| 'auto' = this.minWidth;\n\n /\n Fire event after drawer is open\n /\n @Event() open!: EventEmitter;\n\n /\n Fire event after drawer is close\n /\n @Event() drawerClose!: EventEmitter;\n\n toggle = false;\n\n private static duration = 300;\n private callback = this.clickedOutside.bind(this);\n private divElement?: HTMLElement;\n\n @State() showContent = true;\n\n @Watch('show')\n onShowChanged(newValue: boolean, oldValue?: boolean) {\n if (newValue === oldValue) {\n return;\n }\n\n this.toggleDrawer(newValue);\n }\n\n /\n Toggle or define show state of drawer\n * @param show Overwrite toggle state with boolean\n */\n @Method()\n async toggleDrawer(show?: boolean): Promise<void> {\n show = show ?? !this.show;\n\n if (show) {\n const { defaultPrevented } = this.open.emit();\n\n if (defaultPrevented) {\n return;\n }\n\n this.show = true;\n if (!this.toggle && this.divElement) {\n this.slideInRight(this.divElement);\n setTimeout(() => {\n window.addEventListener('mousedown', this.callback);\n }, Drawer.duration);\n }\n } else {\n const { defaultPrevented } = this.drawerClose.emit();\n\n if (defaultPrevented) {\n return;\n }\n\n this.show = false;\n\n if (this.toggle && this.divElement) {\n this.slideOutRight(this.divElement);\n }\n\n window.removeEventListener('mousedown', this.callback);\n }\n\n this.toggle = this.show;\n\n return Promise.resolve();\n }\n\n private onCloseClicked() {\n this.toggleDrawer(false);\n }\n\n private clickedOutside(evt: any) {\n if (!this.closeOnClickOutside) {\n return;\n }\n\n const target = evt.target;\n const closestElement = target.closest('#div-container');\n const btn = target.closest('#drawer-btn');\n\n if (\n evt.target.type !== 'button' &&\n closestElement !== this.divElement &&\n target !== btn\n ) {\n this.show = false;\n }\n }\n\n private getConstrainedWidth(width: number) {\n return Math.min(Math.max(width, this.minWidth), this.maxWidth);\n }\n\n private slideOutRight(el: HTMLElement) {\n const initialWidth = `${this.getConstrainedWidth(\n this.width === 'auto' ? this.minWidth : this.width\n )}rem`;\n\n anime({\n targets: el,\n duration: Drawer.duration,\n width: [initialWidth, 0],\n opacity: [1, 0],\n easing: 'easeInSine',\n complete: () => {\n el.classList.add('display-none');\n },\n });\n }\n\n private slideInRight(el: HTMLElement) {\n const targetWidth = `${this.getConstrainedWidth(\n this.width === 'auto' ? this.minWidth : this.width\n )}rem`;\n\n anime({\n targets: el,\n duration: Drawer.duration,\n width: [0, targetWidth],\n opacity: [0, 1],\n easing: 'easeOutSine',\n begin: () => {\n el.classList.remove('display-none');\n },\n complete: () => {\n this.showContent = true;\n },\n });\n }\n\n componentDidLoad() {\n this.toggleDrawer(this.show);\n }\n\n render() {\n return (\n <Host\n class={{\n 'drawer-container': true,\n 'display-none': true,\n }}\n style={{\n width: '0',\n 'max-width': `${this.maxWidth}rem`,\n height: this.fullHeight ? '100%' : 'auto',\n overflow: 'hidden',\n }}\n ref={(el) => (this.divElement = el as HTMLElement)}\n data-testid=\"container\"\n id=\"div-container\"\n >\n <div\n style={{\n width:\n this.width === 'auto'\n ? 'auto'\n : `${this.getConstrainedWidth(this.width)}rem`,\n }}\n >\n <div class=\"header\">\n <div class=\"header-content\">\n <slot name=\"header\"></slot>\n </div>\n <ix-icon-button\n class=\"close-button\"\n style={{\n display: this.showContent ? 'block' : 'none',\n }}\n icon={'close'}\n size=\"24\"\n ghost\n onClick={() => this.onCloseClicked()}\n data-testid=\"close-button\"\n ></ix-icon-button>\n </div>\n <div\n class=\"content\"\n style={{\n display: this.showContent ? 'block' : 'none',\n }}\n >\n <slot></slot>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/ix-field-label_2.cjs.entry.js CHANGED Viewed

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-66ad733a.js');
 const a11y = require('./a11y-ae470f01.js');
 const makeRef = require('./make-ref-499e1e41.js');
-const validation = require('./validation-190c7a84.js');
+const validation = require('./validation-f917b33d.js');
 const helperTextUtil = require('./helper-text-util-ad0196c0.js');
 require('./index-b44a6617.js');

package/dist/cjs/ix-helper-text.cjs.entry.js CHANGED Viewed

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-66ad733a.js');
-const validation = require('./validation-190c7a84.js');
+const validation = require('./validation-f917b33d.js');
 const helperTextUtil = require('./helper-text-util-ad0196c0.js');
 require('./index-b44a6617.js');

package/dist/cjs/ix-input.cjs.entry.js CHANGED Viewed

@@ -4,9 +4,9 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-66ad733a.js');
 const index$1 = require('./index-b44a6617.js');
-const validation = require('./validation-190c7a84.js');
+const validation = require('./validation-f917b33d.js');
 const makeRef = require('./make-ref-499e1e41.js');
-const input_util = require('./input.util-94fe9055.js');
+const input_util = require('./input.util-622a9947.js');
 require('./a11y-ae470f01.js');
 require('./mutation-observer-babb20a5.js');
 require('./rwd.util-ee53cbd1.js');

package/dist/cjs/ix-number-input.cjs.entry.js CHANGED Viewed

@@ -4,9 +4,9 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-66ad733a.js');
 const index$1 = require('./index-b44a6617.js');
-const validation = require('./validation-190c7a84.js');
+const validation = require('./validation-f917b33d.js');
 const makeRef = require('./make-ref-499e1e41.js');
-const input_util = require('./input.util-94fe9055.js');
+const input_util = require('./input.util-622a9947.js');
 require('./a11y-ae470f01.js');
 require('./mutation-observer-babb20a5.js');
 require('./rwd.util-ee53cbd1.js');

package/dist/cjs/ix-radio-group.cjs.entry.js CHANGED Viewed

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-66ad733a.js');
-const validation = require('./validation-190c7a84.js');
+const validation = require('./validation-f917b33d.js');
 const radioGroupCss = ":host{display:inline-block;position:relative}:host .checkbox-container{display:flex;flex-direction:column;gap:1rem;margin:0.375rem 0;flex-wrap:wrap}:host .checkbox-container.row-layout{flex-direction:row}";
 const IxRadioGroupStyle0 = radioGroupCss;

package/dist/cjs/ix-select.cjs.entry.js CHANGED Viewed

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-66ad733a.js');
 const a11y = require('./a11y-ae470f01.js');
 const focus = require('./focus-935fb067.js');
-const validation = require('./validation-190c7a84.js');
+const validation = require('./validation-f917b33d.js');
 const listener = require('./listener-5db5521a.js');
 const makeRef = require('./make-ref-499e1e41.js');
 const mutationObserver = require('./mutation-observer-babb20a5.js');

package/dist/cjs/ix-textarea.cjs.entry.js CHANGED Viewed

@@ -3,9 +3,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-66ad733a.js');
-const validation = require('./validation-190c7a84.js');
+const validation = require('./validation-f917b33d.js');
 const makeRef = require('./make-ref-499e1e41.js');
-const input_util = require('./input.util-94fe9055.js');
+const input_util = require('./input.util-622a9947.js');
 require('./a11y-ae470f01.js');
 require('./mutation-observer-babb20a5.js');
 require('./rwd.util-ee53cbd1.js');

package/dist/cjs/{validation-190c7a84.js → validation-f917b33d.js} RENAMED Viewed

@@ -105,6 +105,7 @@ function HookValidationLifecycle(options) {
             if (host && checkIfRequiredFunction) {
                 host.removeEventListener('valueChange', checkIfRequiredFunction);
                 host.removeEventListener('ixBlur', checkIfRequiredFunction);
+                checkIfRequiredFunction = null;
             }
             return disconnectedCallback === null || disconnectedCallback === void 0 ? void 0 : disconnectedCallback.call(this);
         };
@@ -116,4 +117,4 @@ exports.checkFieldClasses = checkFieldClasses;
 exports.createClassMutationObserver = createClassMutationObserver;
 exports.shouldSuppressInternalValidation = shouldSuppressInternalValidation;
-//# sourceMappingURL=validation-190c7a84.js.map
+//# sourceMappingURL=validation-f917b33d.js.map

package/dist/cjs/validation-f917b33d.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"validation-f917b33d.js","mappings":"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","names":["getElement"],"sources":["src/components/utils/input/validation.ts"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\nimport { getElement } from '@stencil/core';\nimport { HTMLIxFormComponentElement, IxFormComponent } from '.';\nimport { IxComponent } from '../internal';\n\nexport type ClassMutationObserver = {\n destroy: () => void;\n};\n\nexport async function isTouched<T>(host: IxFormComponent<T>) {\n if (typeof host.isTouched === 'function') {\n return host.isTouched();\n }\n}\n\nexport async function shouldSuppressInternalValidation<T>(\n host: IxFormComponent<T>\n) {\n if (\n host.getAssociatedFormElement &&\n typeof host.getAssociatedFormElement === 'function'\n ) {\n const form = await host.getAssociatedFormElement();\n\n if (!form) {\n return false;\n }\n\n return form.noValidate;\n }\n\n return false;\n}\n\nexport function createClassMutationObserver(\n element: HTMLElement,\n callback: () => void,\n options?: {\n includeChildren?: boolean;\n }\n): ClassMutationObserver {\n const observer = new MutationObserver(callback);\n observer.observe(element, {\n subtree: options?.includeChildren,\n childList: options?.includeChildren,\n attributes: true,\n attributeFilter: ['class'],\n });\n\n return {\n destroy() {\n observer.disconnect();\n },\n };\n}\n\nexport type ValidationResultProperty =\n | 'isInvalid'\n | 'isInvalidByRequired'\n | 'isValid'\n | 'isInfo'\n | 'isWarning';\nexport type ValidationResults = Record<ValidationResultProperty, boolean>;\n\nfunction containsClass(\n hostElement: HTMLIxFormComponentElement<unknown>,\n className: string,\n includeChildren: boolean\n) {\n return (\n hostElement.classList.contains(`${className}`) ||\n (includeChildren ? !!hostElement.querySelector(`.${className}`) : false)\n );\n}\n\nexport function checkFieldClasses(\n hostElement: HTMLIxFormComponentElement<unknown>,\n includeChildren = false\n): ValidationResults {\n return {\n isInvalid: containsClass(hostElement, 'ix-invalid', includeChildren),\n isInvalidByRequired: containsClass(\n hostElement,\n 'ix-invalid--required',\n includeChildren\n ),\n isValid: containsClass(hostElement, 'ix-valid', includeChildren),\n isInfo: containsClass(hostElement, 'ix-info', includeChildren),\n isWarning: containsClass(hostElement, 'ix-warning', includeChildren),\n };\n}\n\nexport function HookValidationLifecycle(options?: {\n includeChildren?: boolean;\n}) {\n return (proto: IxComponent, methodName: string) => {\n let checkIfRequiredFunction: (() => Promise<void>) | null;\n let classMutationObserver: ClassMutationObserver | null;\n const { componentWillLoad, disconnectedCallback, connectedCallback } =\n proto;\n\n proto.connectedCallback = function () {\n const host = getElement(\n this\n ) as unknown as HTMLIxFormComponentElement<unknown>;\n\n checkIfRequiredFunction = async () => {\n const skipValidation = await shouldSuppressInternalValidation(host);\n if (skipValidation) {\n return;\n }\n\n if (host.hasValidValue && typeof host.hasValidValue === 'function') {\n const hasValue = await host.hasValidValue();\n const touched = await isTouched(host);\n if (host.required) {\n host.classList.toggle('ix-invalid--required', !hasValue && touched);\n } else {\n host.classList.remove('ix-invalid--required');\n }\n }\n\n if (\n host.getValidityState &&\n typeof host.getValidityState === 'function'\n ) {\n const validityState = await host.getValidityState();\n\n host.classList.toggle(\n `ix-invalid--validity-patternMismatch`,\n validityState.patternMismatch\n );\n }\n };\n\n host.addEventListener('valueChange', checkIfRequiredFunction);\n host.addEventListener('ixBlur', checkIfRequiredFunction);\n setTimeout(checkIfRequiredFunction);\n return connectedCallback?.call(this);\n };\n\n proto.componentWillLoad = function () {\n const host = getElement(\n this\n ) as unknown as HTMLIxFormComponentElement<unknown>;\n classMutationObserver = createClassMutationObserver(\n host,\n () => {\n const result = checkFieldClasses(host, options?.includeChildren);\n proto[methodName].call(this, result);\n },\n options\n );\n const result = checkFieldClasses(host, options?.includeChildren);\n proto[methodName].call(this, result);\n return componentWillLoad?.call(this);\n };\n\n proto.disconnectedCallback = function () {\n const host = getElement(this);\n\n if (host && classMutationObserver) {\n classMutationObserver.destroy();\n classMutationObserver = null;\n }\n\n if (host && checkIfRequiredFunction) {\n host.removeEventListener('valueChange', checkIfRequiredFunction);\n host.removeEventListener('ixBlur', checkIfRequiredFunction);\n checkIfRequiredFunction = null;\n }\n\n return disconnectedCallback?.call(this);\n };\n };\n}\n"],"version":3}

package/dist/collection/components/application-header/application-header.js CHANGED Viewed

@@ -82,7 +82,6 @@ export class ApplicationHeader {
     }
     async attachSiemensLogoIfLoaded() {
         var _a;
-        await window.customElements.whenDefined('ix-siemens-logo');
         const logoElement = document.createElement('ix-siemens-logo');
         if (!this.isLogoSlotted()) {
             (_a = this.hostElement
@@ -138,12 +137,12 @@ export class ApplicationHeader {
         const showApplicationSwitch = ((_a = this.applicationLayoutContext) === null || _a === void 0 ? void 0 : _a.appSwitchConfig) &&
             this.breakpoint !== 'sm' &&
             this.suppressResponsive === false;
-        return (h(Host, { key: '76dff918e8dc599560271809e8cd5db5fdf90c15', class: {
+        return (h(Host, { key: '99c3340b760fe51621bfdd8390f8a78781d8ec2f', class: {
                 [`breakpoint-${this.breakpoint}`]: true,
-            }, slot: "application-header" }, (this.showMenu || showMenuByApplicationFrame) && (h("ix-menu-expand-icon", { key: '5e53c3df48d5eefaed2ddf00abab2b22d7966e47', onClick: () => this.onMenuClick(), expanded: this.menuExpanded })), showApplicationSwitch && (h("ix-icon-button", { key: 'd1f5b59071a39cea07e451e53d68e7e0dc8dc7ae', onClick: () => this.showAppSwitch(), icon: "apps", ghost: true, class: "app-switch" })), h("div", { key: '879c8d1037e0b86b7664ede60ba994d97033a4d8', class: { logo: true } }, h("slot", { key: 'f03c1be22bbda6834b7ab8beb234585f79b1b206', name: "logo" })), h("ix-typography", { key: '6b09e917dd66d0031d9cb2eb10400d880fca1a39', format: "body-lg", class: "name" }, this.name), h("div", { key: '108d13c64aa6db52f7c4e3d313820890998b100c', class: "content" }, this.breakpoint === 'sm' ? (h(Fragment, null, h("ix-icon-button", { class: {
+            }, slot: "application-header" }, (this.showMenu || showMenuByApplicationFrame) && (h("ix-menu-expand-icon", { key: '8c8e4c9ea5e5ffdedca71b413ab5ae272ec4cb2e', onClick: () => this.onMenuClick(), expanded: this.menuExpanded })), showApplicationSwitch && (h("ix-icon-button", { key: '1aaa76f6966e05ab9167c3d76129056323d95254', onClick: () => this.showAppSwitch(), icon: "apps", ghost: true, class: "app-switch" })), h("div", { key: '906798cca10aa839cc921c61c68dab394ab93b0e', class: { logo: true } }, h("slot", { key: 'b768d941698bf4a1e769d232dfeffdbf73d67cff', name: "logo" })), h("ix-typography", { key: 'b3a4aa2965702f9fc7c55ff28e6faf14fd7dedc5', format: "body-lg", class: "name" }, this.name), h("div", { key: '2db8a72304dba6df3bab501855f991241baecf19', class: "content" }, this.breakpoint === 'sm' ? (h(Fragment, null, h("ix-icon-button", { class: {
                 ['context-menu']: true,
                 ['context-menu-visible']: this.hasSlottedElements,
-            }, "data-context-menu": true, icon: "more-menu", ghost: true }), h("ix-dropdown", { "data-overflow-dropdown": true, class: "dropdown", discoverAllSubmenus: true, trigger: this.resolveContextMenuButton() }, h("div", { class: "dropdown-content", onClick: (e) => this.onContentBgClick(e) }, h("slot", { onSlotchange: () => this.updateIsSlottedContent() }))))) : (h("slot", { onSlotchange: () => this.updateIsSlottedContent() })), h("slot", { key: '0771683871b49c6c76816df10b64a0baa2cf60c9', name: "ix-application-header-avatar" }))));
+            }, "data-context-menu": true, icon: "more-menu", ghost: true }), h("ix-dropdown", { "data-overflow-dropdown": true, class: "dropdown", discoverAllSubmenus: true, trigger: this.resolveContextMenuButton() }, h("div", { class: "dropdown-content", onClick: (e) => this.onContentBgClick(e) }, h("slot", { onSlotchange: () => this.updateIsSlottedContent() }))))) : (h("slot", { onSlotchange: () => this.updateIsSlottedContent() })), h("slot", { key: 'f34d3cd4b5bb06bdeb4e4473adc677b8811a2101', name: "ix-application-header-avatar" }))));
     }
     static get is() { return "ix-application-header"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/application-header/application-header.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"application-header.js","sourceRoot":"","sources":["../../../src/components/application-header/application-header.tsx"],"names":[],"mappings":"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","sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n Fragment,\n h,\n Host,\n Prop,\n readTask,\n State,\n Watch,\n} from '@stencil/core';\nimport { showAppSwitch } from '../utils/app-switch';\nimport { applicationLayoutService } from '../utils/application-layout';\nimport {\n ApplicationLayoutContext,\n AppSwitchConfiguration,\n} from '../utils/application-layout/context';\nimport { Breakpoint } from '../utils/breakpoints';\nimport { ContextType, useContextConsumer } from '../utils/context';\nimport { menuController } from '../utils/menu-service/menu-service';\nimport { hasSlottedElements } from '../utils/shadow-dom';\nimport { Disposable } from '../utils/typed-event';\n\n/\n @slot logo - Location of the logo\n /\n@Component({\n tag: 'ix-application-header',\n styleUrl: 'application-header.scss',\n shadow: true,\n})\nexport class ApplicationHeader {\n @Element() hostElement!: HTMLIxApplicationHeaderElement;\n\n /\n Application name\n /\n @Prop() name?: string;\n\n /\n Controls the visibility of the menu toggle button based on the context of the application header.\n \n When the application header is utilized outside the application frame, the menu toggle button is displayed.\n * Conversely, if the header is within the application frame, this property is ineffective.\n \n @since 2.5.0\n /\n @Prop({ mutable: true }) showMenu?: boolean = false;\n\n /\n Event emitted when the menu toggle button is clicked\n \n @since 2.5.0\n /\n @Event() menuToggle!: EventEmitter<boolean>;\n\n /\n Event emitted when the app switch button is clicked\n \n @since 3.0.0\n */\n @Event() openAppSwitch!: EventEmitter<void>;\n\n @State() breakpoint: Breakpoint = 'lg';\n @State() menuExpanded = false;\n @State() suppressResponsive = false;\n\n @State() hasSlottedElements = false;\n\n private menuDisposable?: Disposable;\n private modeDisposable?: Disposable;\n private callbackUpdateAppSwitchModal?: (\n config: AppSwitchConfiguration\n ) => void;\n\n @State() applicationLayoutContext?: ContextType<\n typeof ApplicationLayoutContext\n >;\n\n get contentBackground() {\n return this.hostElement.shadowRoot!.querySelector('.dropdown-content');\n }\n\n componentWillLoad() {\n useContextConsumer(\n this.hostElement,\n ApplicationLayoutContext,\n (ctx) => {\n if (ctx?.host === 'map-navigation') {\n this.suppressResponsive = true;\n this.breakpoint = 'md';\n return;\n }\n\n this.breakpoint = applicationLayoutService.breakpoint;\n this.applicationLayoutContext = ctx;\n\n this.tryUpdateAppSwitch();\n },\n true\n );\n\n this.menuDisposable = menuController.expandChange.on((show) => {\n this.menuExpanded = show;\n });\n\n this.modeDisposable = applicationLayoutService.onChange.on((mode) => {\n if (this.suppressResponsive) {\n return;\n }\n\n this.breakpoint = mode;\n });\n\n this.updateIsSlottedContent();\n }\n\n componentDidLoad() {\n this.attachSiemensLogoIfLoaded();\n }\n\n disconnectedCallback() {\n this.menuDisposable?.dispose();\n this.modeDisposable?.dispose();\n }\n\n @Watch('applicationLayoutContext')\n watchApplicationLayoutContext() {\n if (this.applicationLayoutContext) {\n this.showMenu = false;\n }\n }\n @Watch('suppressResponsive')\n watchSuppressResponsive() {\n this.breakpoint = 'md';\n }\n\n private isLogoSlotted() {\n const slotElement = this.hostElement.shadowRoot!.querySelector(\n 'slot[name=\"logo\"]'\n ) as HTMLSlotElement;\n const nodes = slotElement.assignedNodes({\n flatten: true,\n });\n\n return nodes.length !== 0;\n }\n\n private async attachSiemensLogoIfLoaded() {\n await window.customElements.whenDefined('ix-siemens-logo');\n const logoElement = document.createElement('ix-siemens-logo');\n if (!this.isLogoSlotted()) {\n this.hostElement\n .shadowRoot!.querySelector('.logo')\n ?.appendChild(logoElement);\n }\n }\n\n private async onMenuClick() {\n if (this.applicationLayoutContext) {\n menuController.toggle();\n } else {\n this.menuExpanded = !this.menuExpanded;\n }\n\n this.menuToggle.emit(this.menuExpanded);\n }\n\n private resolveContextMenuButton() {\n return new Promise<HTMLElement>((resolve) =>\n readTask(() =>\n resolve(\n this.hostElement.shadowRoot!.querySelector(\n '[data-context-menu]'\n ) as HTMLElement\n )\n )\n );\n }\n\n private tryUpdateAppSwitch() {\n if (\n !this.callbackUpdateAppSwitchModal \|\|\n !this.applicationLayoutContext?.appSwitchConfig\n ) {\n return;\n }\n\n this.callbackUpdateAppSwitchModal(\n this.applicationLayoutContext?.appSwitchConfig\n );\n }\n\n private async showAppSwitch() {\n const { defaultPrevented } = this.openAppSwitch.emit();\n\n if (defaultPrevented) {\n return;\n }\n\n if (!this.applicationLayoutContext?.appSwitchConfig) {\n return;\n }\n\n this.callbackUpdateAppSwitchModal = await showAppSwitch(\n this.applicationLayoutContext?.appSwitchConfig\n );\n }\n\n private updateIsSlottedContent() {\n const slotElement =\n this.hostElement.shadowRoot!.querySelector('.content slot');\n\n this.hasSlottedElements = hasSlottedElements(slotElement);\n }\n\n private onContentBgClick(e: MouseEvent) {\n if (e.target === this.contentBackground) {\n e.preventDefault();\n }\n }\n\n render() {\n const hasApplicationContextAvailable = !!this.applicationLayoutContext;\n\n const showMenuByApplicationFrame =\n this.breakpoint === 'sm' &&\n this.suppressResponsive === false &&\n hasApplicationContextAvailable;\n\n const showApplicationSwitch =\n this.applicationLayoutContext?.appSwitchConfig &&\n this.breakpoint !== 'sm' &&\n this.suppressResponsive === false;\n\n return (\n <Host\n class={{\n [`breakpoint-${this.breakpoint}`]: true,\n }}\n slot=\"application-header\"\n >\n {(this.showMenu \|\| showMenuByApplicationFrame) && (\n <ix-menu-expand-icon\n onClick={() => this.onMenuClick()}\n expanded={this.menuExpanded}\n ></ix-menu-expand-icon>\n )}\n {showApplicationSwitch && (\n <ix-icon-button\n onClick={() => this.showAppSwitch()}\n icon=\"apps\"\n ghost\n class=\"app-switch\"\n ></ix-icon-button>\n )}\n <div class={{ logo: true }}>\n <slot name=\"logo\"></slot>\n </div>\n <ix-typography format=\"body-lg\" class=\"name\">\n {this.name}\n </ix-typography>\n <div class=\"content\">\n {this.breakpoint === 'sm' ? (\n <Fragment>\n <ix-icon-button\n class={{\n ['context-menu']: true,\n ['context-menu-visible']: this.hasSlottedElements,\n }}\n data-context-menu\n icon=\"more-menu\"\n ghost\n ></ix-icon-button>\n <ix-dropdown\n data-overflow-dropdown\n class=\"dropdown\"\n discoverAllSubmenus\n trigger={this.resolveContextMenuButton()}\n >\n <div\n class=\"dropdown-content\"\n onClick={(e) => this.onContentBgClick(e)}\n >\n <slot\n onSlotchange={() => this.updateIsSlottedContent()}\n ></slot>\n </div>\n </ix-dropdown>\n </Fragment>\n ) : (\n <slot onSlotchange={() => this.updateIsSlottedContent()}></slot>\n )}\n <slot name=\"ix-application-header-avatar\"></slot>\n </div>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"application-header.js","sourceRoot":"","sources":["../../../src/components/application-header/application-header.tsx"],"names":[],"mappings":"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","sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n Fragment,\n h,\n Host,\n Prop,\n readTask,\n State,\n Watch,\n} from '@stencil/core';\nimport { showAppSwitch } from '../utils/app-switch';\nimport { applicationLayoutService } from '../utils/application-layout';\nimport {\n ApplicationLayoutContext,\n AppSwitchConfiguration,\n} from '../utils/application-layout/context';\nimport { Breakpoint } from '../utils/breakpoints';\nimport { ContextType, useContextConsumer } from '../utils/context';\nimport { menuController } from '../utils/menu-service/menu-service';\nimport { hasSlottedElements } from '../utils/shadow-dom';\nimport { Disposable } from '../utils/typed-event';\n\n/\n @slot logo - Location of the logo\n /\n@Component({\n tag: 'ix-application-header',\n styleUrl: 'application-header.scss',\n shadow: true,\n})\nexport class ApplicationHeader {\n @Element() hostElement!: HTMLIxApplicationHeaderElement;\n\n /\n Application name\n /\n @Prop() name?: string;\n\n /\n Controls the visibility of the menu toggle button based on the context of the application header.\n \n When the application header is utilized outside the application frame, the menu toggle button is displayed.\n * Conversely, if the header is within the application frame, this property is ineffective.\n \n @since 2.5.0\n /\n @Prop({ mutable: true }) showMenu?: boolean = false;\n\n /\n Event emitted when the menu toggle button is clicked\n \n @since 2.5.0\n /\n @Event() menuToggle!: EventEmitter<boolean>;\n\n /\n Event emitted when the app switch button is clicked\n \n @since 3.0.0\n */\n @Event() openAppSwitch!: EventEmitter<void>;\n\n @State() breakpoint: Breakpoint = 'lg';\n @State() menuExpanded = false;\n @State() suppressResponsive = false;\n\n @State() hasSlottedElements = false;\n\n private menuDisposable?: Disposable;\n private modeDisposable?: Disposable;\n private callbackUpdateAppSwitchModal?: (\n config: AppSwitchConfiguration\n ) => void;\n\n @State() applicationLayoutContext?: ContextType<\n typeof ApplicationLayoutContext\n >;\n\n get contentBackground() {\n return this.hostElement.shadowRoot!.querySelector('.dropdown-content');\n }\n\n componentWillLoad() {\n useContextConsumer(\n this.hostElement,\n ApplicationLayoutContext,\n (ctx) => {\n if (ctx?.host === 'map-navigation') {\n this.suppressResponsive = true;\n this.breakpoint = 'md';\n return;\n }\n\n this.breakpoint = applicationLayoutService.breakpoint;\n this.applicationLayoutContext = ctx;\n\n this.tryUpdateAppSwitch();\n },\n true\n );\n\n this.menuDisposable = menuController.expandChange.on((show) => {\n this.menuExpanded = show;\n });\n\n this.modeDisposable = applicationLayoutService.onChange.on((mode) => {\n if (this.suppressResponsive) {\n return;\n }\n\n this.breakpoint = mode;\n });\n\n this.updateIsSlottedContent();\n }\n\n componentDidLoad() {\n this.attachSiemensLogoIfLoaded();\n }\n\n disconnectedCallback() {\n this.menuDisposable?.dispose();\n this.modeDisposable?.dispose();\n }\n\n @Watch('applicationLayoutContext')\n watchApplicationLayoutContext() {\n if (this.applicationLayoutContext) {\n this.showMenu = false;\n }\n }\n @Watch('suppressResponsive')\n watchSuppressResponsive() {\n this.breakpoint = 'md';\n }\n\n private isLogoSlotted() {\n const slotElement = this.hostElement.shadowRoot!.querySelector(\n 'slot[name=\"logo\"]'\n ) as HTMLSlotElement;\n const nodes = slotElement.assignedNodes({\n flatten: true,\n });\n\n return nodes.length !== 0;\n }\n\n private async attachSiemensLogoIfLoaded() {\n const logoElement = document.createElement('ix-siemens-logo');\n if (!this.isLogoSlotted()) {\n this.hostElement\n .shadowRoot!.querySelector('.logo')\n ?.appendChild(logoElement);\n }\n }\n\n private async onMenuClick() {\n if (this.applicationLayoutContext) {\n menuController.toggle();\n } else {\n this.menuExpanded = !this.menuExpanded;\n }\n\n this.menuToggle.emit(this.menuExpanded);\n }\n\n private resolveContextMenuButton() {\n return new Promise<HTMLElement>((resolve) =>\n readTask(() =>\n resolve(\n this.hostElement.shadowRoot!.querySelector(\n '[data-context-menu]'\n ) as HTMLElement\n )\n )\n );\n }\n\n private tryUpdateAppSwitch() {\n if (\n !this.callbackUpdateAppSwitchModal \|\|\n !this.applicationLayoutContext?.appSwitchConfig\n ) {\n return;\n }\n\n this.callbackUpdateAppSwitchModal(\n this.applicationLayoutContext?.appSwitchConfig\n );\n }\n\n private async showAppSwitch() {\n const { defaultPrevented } = this.openAppSwitch.emit();\n\n if (defaultPrevented) {\n return;\n }\n\n if (!this.applicationLayoutContext?.appSwitchConfig) {\n return;\n }\n\n this.callbackUpdateAppSwitchModal = await showAppSwitch(\n this.applicationLayoutContext?.appSwitchConfig\n );\n }\n\n private updateIsSlottedContent() {\n const slotElement =\n this.hostElement.shadowRoot!.querySelector('.content slot');\n\n this.hasSlottedElements = hasSlottedElements(slotElement);\n }\n\n private onContentBgClick(e: MouseEvent) {\n if (e.target === this.contentBackground) {\n e.preventDefault();\n }\n }\n\n render() {\n const hasApplicationContextAvailable = !!this.applicationLayoutContext;\n\n const showMenuByApplicationFrame =\n this.breakpoint === 'sm' &&\n this.suppressResponsive === false &&\n hasApplicationContextAvailable;\n\n const showApplicationSwitch =\n this.applicationLayoutContext?.appSwitchConfig &&\n this.breakpoint !== 'sm' &&\n this.suppressResponsive === false;\n\n return (\n <Host\n class={{\n [`breakpoint-${this.breakpoint}`]: true,\n }}\n slot=\"application-header\"\n >\n {(this.showMenu \|\| showMenuByApplicationFrame) && (\n <ix-menu-expand-icon\n onClick={() => this.onMenuClick()}\n expanded={this.menuExpanded}\n ></ix-menu-expand-icon>\n )}\n {showApplicationSwitch && (\n <ix-icon-button\n onClick={() => this.showAppSwitch()}\n icon=\"apps\"\n ghost\n class=\"app-switch\"\n ></ix-icon-button>\n )}\n <div class={{ logo: true }}>\n <slot name=\"logo\"></slot>\n </div>\n <ix-typography format=\"body-lg\" class=\"name\">\n {this.name}\n </ix-typography>\n <div class=\"content\">\n {this.breakpoint === 'sm' ? (\n <Fragment>\n <ix-icon-button\n class={{\n ['context-menu']: true,\n ['context-menu-visible']: this.hasSlottedElements,\n }}\n data-context-menu\n icon=\"more-menu\"\n ghost\n ></ix-icon-button>\n <ix-dropdown\n data-overflow-dropdown\n class=\"dropdown\"\n discoverAllSubmenus\n trigger={this.resolveContextMenuButton()}\n >\n <div\n class=\"dropdown-content\"\n onClick={(e) => this.onContentBgClick(e)}\n >\n <slot\n onSlotchange={() => this.updateIsSlottedContent()}\n ></slot>\n </div>\n </ix-dropdown>\n </Fragment>\n ) : (\n <slot onSlotchange={() => this.updateIsSlottedContent()}></slot>\n )}\n <slot name=\"ix-application-header-avatar\"></slot>\n </div>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/drawer/drawer.css CHANGED Viewed

@@ -59,7 +59,6 @@
   min-height: 1.5rem;
   background-color: var(--theme-color-1);
   border-radius: 0.25rem;
-  transition: all var(--theme-medium-time) ease-out;
 }
 :host *,
 :host *::after,

package/dist/collection/components/utils/input/validation.js CHANGED Viewed

@@ -102,6 +102,7 @@ export function HookValidationLifecycle(options) {
             if (host && checkIfRequiredFunction) {
                 host.removeEventListener('valueChange', checkIfRequiredFunction);
                 host.removeEventListener('ixBlur', checkIfRequiredFunction);
+                checkIfRequiredFunction = null;
             }
             return disconnectedCallback === null || disconnectedCallback === void 0 ? void 0 : disconnectedCallback.call(this);
         };

package/dist/collection/components/utils/input/validation.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"validation.js","sourceRoot":"","sources":["../../../../src/components/utils/input/validation.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAQ3C,MAAM,CAAC,KAAK,UAAU,SAAS,CAAI,IAAwB;IACzD,IAAI,OAAO,IAAI,CAAC,SAAS,KAAK,UAAU,EAAE,CAAC;QACzC,OAAO,IAAI,CAAC,SAAS,EAAE,CAAC;IAC1B,CAAC;AACH,CAAC;AAED,MAAM,CAAC,KAAK,UAAU,gCAAgC,CACpD,IAAwB;IAExB,IACE,IAAI,CAAC,wBAAwB;QAC7B,OAAO,IAAI,CAAC,wBAAwB,KAAK,UAAU,EACnD,CAAC;QACD,MAAM,IAAI,GAAG,MAAM,IAAI,CAAC,wBAAwB,EAAE,CAAC;QAEnD,IAAI,CAAC,IAAI,EAAE,CAAC;YACV,OAAO,KAAK,CAAC;QACf,CAAC;QAED,OAAO,IAAI,CAAC,UAAU,CAAC;IACzB,CAAC;IAED,OAAO,KAAK,CAAC;AACf,CAAC;AAED,MAAM,UAAU,2BAA2B,CACzC,OAAoB,EACpB,QAAoB,EACpB,OAEC;IAED,MAAM,QAAQ,GAAG,IAAI,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IAChD,QAAQ,CAAC,OAAO,CAAC,OAAO,EAAE;QACxB,OAAO,EAAE,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,eAAe;QACjC,SAAS,EAAE,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,eAAe;QACnC,UAAU,EAAE,IAAI;QAChB,eAAe,EAAE,CAAC,OAAO,CAAC;KAC3B,CAAC,CAAC;IAEH,OAAO;QACL,OAAO;YACL,QAAQ,CAAC,UAAU,EAAE,CAAC;QACxB,CAAC;KACF,CAAC;AACJ,CAAC;AAUD,SAAS,aAAa,CACpB,WAAgD,EAChD,SAAiB,EACjB,eAAwB;IAExB,OAAO,CACL,WAAW,CAAC,SAAS,CAAC,QAAQ,CAAC,GAAG,SAAS,EAAE,CAAC;QAC9C,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,aAAa,CAAC,IAAI,SAAS,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CACzE,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,iBAAiB,CAC/B,WAAgD,EAChD,eAAe,GAAG,KAAK;IAEvB,OAAO;QACL,SAAS,EAAE,aAAa,CAAC,WAAW,EAAE,YAAY,EAAE,eAAe,CAAC;QACpE,mBAAmB,EAAE,aAAa,CAChC,WAAW,EACX,sBAAsB,EACtB,eAAe,CAChB;QACD,OAAO,EAAE,aAAa,CAAC,WAAW,EAAE,UAAU,EAAE,eAAe,CAAC;QAChE,MAAM,EAAE,aAAa,CAAC,WAAW,EAAE,SAAS,EAAE,eAAe,CAAC;QAC9D,SAAS,EAAE,aAAa,CAAC,WAAW,EAAE,YAAY,EAAE,eAAe,CAAC;KACrE,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,uBAAuB,CAAC,OAEvC;IACC,OAAO,CAAC,KAAkB,EAAE,UAAkB,EAAE,EAAE;QAChD,IAAI,~~uBAA4C~~,CAAC;~~QACjD~~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~~YAC9D~~,CAAC;YAED,OAAO,oBAAoB,aAApB,oBAAoB,uBAApB,oBAAoB,CAAE,IAAI,CAAC,IAAI,CAAC,CAAC;QAC1C,CAAC,CAAC;IACJ,CAAC,CAAC;AACJ,CAAC","sourcesContent":["/\n SPDX-FileCopyrightText: 2024 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\nimport { getElement } from '@stencil/core';\nimport { HTMLIxFormComponentElement, IxFormComponent } from '.';\nimport { IxComponent } from '../internal';\n\nexport type ClassMutationObserver = {\n destroy: () => void;\n};\n\nexport async function isTouched<T>(host: IxFormComponent<T>) {\n if (typeof host.isTouched === 'function') {\n return host.isTouched();\n }\n}\n\nexport async function shouldSuppressInternalValidation<T>(\n host: IxFormComponent<T>\n) {\n if (\n host.getAssociatedFormElement &&\n typeof host.getAssociatedFormElement === 'function'\n ) {\n const form = await host.getAssociatedFormElement();\n\n if (!form) {\n return false;\n }\n\n return form.noValidate;\n }\n\n return false;\n}\n\nexport function createClassMutationObserver(\n element: HTMLElement,\n callback: () => void,\n options?: {\n includeChildren?: boolean;\n }\n): ClassMutationObserver {\n const observer = new MutationObserver(callback);\n observer.observe(element, {\n subtree: options?.includeChildren,\n childList: options?.includeChildren,\n attributes: true,\n attributeFilter: ['class'],\n });\n\n return {\n destroy() {\n observer.disconnect();\n },\n };\n}\n\nexport type ValidationResultProperty =\n \| 'isInvalid'\n \| 'isInvalidByRequired'\n \| 'isValid'\n \| 'isInfo'\n \| 'isWarning';\nexport type ValidationResults = Record<ValidationResultProperty, boolean>;\n\nfunction containsClass(\n hostElement: HTMLIxFormComponentElement<unknown>,\n className: string,\n includeChildren: boolean\n) {\n return (\n hostElement.classList.contains(`${className}`) \|\|\n (includeChildren ? !!hostElement.querySelector(`.${className}`) : false)\n );\n}\n\nexport function checkFieldClasses(\n hostElement: HTMLIxFormComponentElement<unknown>,\n includeChildren = false\n): ValidationResults {\n return {\n isInvalid: containsClass(hostElement, 'ix-invalid', includeChildren),\n isInvalidByRequired: containsClass(\n hostElement,\n 'ix-invalid--required',\n includeChildren\n ),\n isValid: containsClass(hostElement, 'ix-valid', includeChildren),\n isInfo: containsClass(hostElement, 'ix-info', includeChildren),\n isWarning: containsClass(hostElement, 'ix-warning', includeChildren),\n };\n}\n\nexport function HookValidationLifecycle(options?: {\n includeChildren?: boolean;\n}) {\n return (proto: IxComponent, methodName: string) => {\n let checkIfRequiredFunction: () => Promise<void~~>;\~~n let classMutationObserver: ClassMutationObserver \| null;\n const { componentWillLoad, disconnectedCallback, connectedCallback } =\n proto;\n\n proto.connectedCallback = function () {\n const host = getElement(\n this\n ) as unknown as HTMLIxFormComponentElement<unknown>;\n\n checkIfRequiredFunction = async () => {\n const skipValidation = await shouldSuppressInternalValidation(host);\n if (skipValidation) {\n return;\n }\n\n if (host.hasValidValue && typeof host.hasValidValue === 'function') {\n const hasValue = await host.hasValidValue();\n const touched = await isTouched(host);\n if (host.required) {\n host.classList.toggle('ix-invalid--required', !hasValue && touched);\n } else {\n host.classList.remove('ix-invalid--required');\n }\n }\n\n if (\n host.getValidityState &&\n typeof host.getValidityState === 'function'\n ) {\n const validityState = await host.getValidityState();\n\n host.classList.toggle(\n `ix-invalid--validity-patternMismatch`,\n validityState.patternMismatch\n );\n }\n };\n\n host.addEventListener('valueChange', checkIfRequiredFunction);\n host.addEventListener('ixBlur', checkIfRequiredFunction);\n setTimeout(checkIfRequiredFunction);\n return connectedCallback?.call(this);\n };\n\n proto.componentWillLoad = function () {\n const host = getElement(\n this\n ) as unknown as HTMLIxFormComponentElement<unknown>;\n classMutationObserver = createClassMutationObserver(\n host,\n () => {\n const result = checkFieldClasses(host, options?.includeChildren);\n proto[methodName].call(this, result);\n },\n options\n );\n const result = checkFieldClasses(host, options?.includeChildren);\n proto[methodName].call(this, result);\n return componentWillLoad?.call(this);\n };\n\n proto.disconnectedCallback = function () {\n const host = getElement(this);\n\n if (host && classMutationObserver) {\n classMutationObserver.destroy();\n classMutationObserver = null;\n }\n\n if (host && checkIfRequiredFunction) {\n host.removeEventListener('valueChange', checkIfRequiredFunction);\n host.removeEventListener('ixBlur', checkIfRequiredFunction);\n }\n\n return disconnectedCallback?.call(this);\n };\n };\n}\n"]}
1	+ {"version":3,"file":"validation.js","sourceRoot":"","sources":["../../../../src/components/utils/input/validation.ts"],"names":[],"mappings":"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","sourcesContent":["/\n SPDX-FileCopyrightText: 2024 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\nimport { getElement } from '@stencil/core';\nimport { HTMLIxFormComponentElement, IxFormComponent } from '.';\nimport { IxComponent } from '../internal';\n\nexport type ClassMutationObserver = {\n destroy: () => void;\n};\n\nexport async function isTouched<T>(host: IxFormComponent<T>) {\n if (typeof host.isTouched === 'function') {\n return host.isTouched();\n }\n}\n\nexport async function shouldSuppressInternalValidation<T>(\n host: IxFormComponent<T>\n) {\n if (\n host.getAssociatedFormElement &&\n typeof host.getAssociatedFormElement === 'function'\n ) {\n const form = await host.getAssociatedFormElement();\n\n if (!form) {\n return false;\n }\n\n return form.noValidate;\n }\n\n return false;\n}\n\nexport function createClassMutationObserver(\n element: HTMLElement,\n callback: () => void,\n options?: {\n includeChildren?: boolean;\n }\n): ClassMutationObserver {\n const observer = new MutationObserver(callback);\n observer.observe(element, {\n subtree: options?.includeChildren,\n childList: options?.includeChildren,\n attributes: true,\n attributeFilter: ['class'],\n });\n\n return {\n destroy() {\n observer.disconnect();\n },\n };\n}\n\nexport type ValidationResultProperty =\n \| 'isInvalid'\n \| 'isInvalidByRequired'\n \| 'isValid'\n \| 'isInfo'\n \| 'isWarning';\nexport type ValidationResults = Record<ValidationResultProperty, boolean>;\n\nfunction containsClass(\n hostElement: HTMLIxFormComponentElement<unknown>,\n className: string,\n includeChildren: boolean\n) {\n return (\n hostElement.classList.contains(`${className}`) \|\|\n (includeChildren ? !!hostElement.querySelector(`.${className}`) : false)\n );\n}\n\nexport function checkFieldClasses(\n hostElement: HTMLIxFormComponentElement<unknown>,\n includeChildren = false\n): ValidationResults {\n return {\n isInvalid: containsClass(hostElement, 'ix-invalid', includeChildren),\n isInvalidByRequired: containsClass(\n hostElement,\n 'ix-invalid--required',\n includeChildren\n ),\n isValid: containsClass(hostElement, 'ix-valid', includeChildren),\n isInfo: containsClass(hostElement, 'ix-info', includeChildren),\n isWarning: containsClass(hostElement, 'ix-warning', includeChildren),\n };\n}\n\nexport function HookValidationLifecycle(options?: {\n includeChildren?: boolean;\n}) {\n return (proto: IxComponent, methodName: string) => {\n let checkIfRequiredFunction: (() => Promise<void>) \| null;\n let classMutationObserver: ClassMutationObserver \| null;\n const { componentWillLoad, disconnectedCallback, connectedCallback } =\n proto;\n\n proto.connectedCallback = function () {\n const host = getElement(\n this\n ) as unknown as HTMLIxFormComponentElement<unknown>;\n\n checkIfRequiredFunction = async () => {\n const skipValidation = await shouldSuppressInternalValidation(host);\n if (skipValidation) {\n return;\n }\n\n if (host.hasValidValue && typeof host.hasValidValue === 'function') {\n const hasValue = await host.hasValidValue();\n const touched = await isTouched(host);\n if (host.required) {\n host.classList.toggle('ix-invalid--required', !hasValue && touched);\n } else {\n host.classList.remove('ix-invalid--required');\n }\n }\n\n if (\n host.getValidityState &&\n typeof host.getValidityState === 'function'\n ) {\n const validityState = await host.getValidityState();\n\n host.classList.toggle(\n `ix-invalid--validity-patternMismatch`,\n validityState.patternMismatch\n );\n }\n };\n\n host.addEventListener('valueChange', checkIfRequiredFunction);\n host.addEventListener('ixBlur', checkIfRequiredFunction);\n setTimeout(checkIfRequiredFunction);\n return connectedCallback?.call(this);\n };\n\n proto.componentWillLoad = function () {\n const host = getElement(\n this\n ) as unknown as HTMLIxFormComponentElement<unknown>;\n classMutationObserver = createClassMutationObserver(\n host,\n () => {\n const result = checkFieldClasses(host, options?.includeChildren);\n proto[methodName].call(this, result);\n },\n options\n );\n const result = checkFieldClasses(host, options?.includeChildren);\n proto[methodName].call(this, result);\n return componentWillLoad?.call(this);\n };\n\n proto.disconnectedCallback = function () {\n const host = getElement(this);\n\n if (host && classMutationObserver) {\n classMutationObserver.destroy();\n classMutationObserver = null;\n }\n\n if (host && checkIfRequiredFunction) {\n host.removeEventListener('valueChange', checkIfRequiredFunction);\n host.removeEventListener('ixBlur', checkIfRequiredFunction);\n checkIfRequiredFunction = null;\n }\n\n return disconnectedCallback?.call(this);\n };\n };\n}\n"]}

package/dist/esm/{input.util-0475b865.js → input.util-0c139612.js} RENAMED Viewed

@@ -1,6 +1,6 @@
 import { h } from './index-3d8cca34.js';
 import { a as a11yBoolean } from './a11y-b10c12e0.js';
-import { s as shouldSuppressInternalValidation } from './validation-8c30a49b.js';
+import { s as shouldSuppressInternalValidation } from './validation-0bc90f82.js';
 import { c as createMutationObserver } from './mutation-observer-db8757e6.js';
 import { a as convertToRemString } from './rwd.util-d8e00a88.js';
 import { a as anime } from './anime.es-a5520566.js';
@@ -199,4 +199,4 @@ function observeElementUntilVisible(hostElement, updateCallback) {
 export { InputElement as I, SlotEnd as S, TextareaElement as T, addDisposableChangesAndVisibilityObservers as a, adjustPaddingForStartAndEnd as b, SlotStart as c, checkAllowedKeys as d, checkInternalValidity as e, getAriaAttributesForInput as g, mapValidationResult as m, onInputBlur as o };
-//# sourceMappingURL=input.util-0475b865.js.map
+//# sourceMappingURL=input.util-0c139612.js.map

package/dist/esm/{input.util-0475b865.js.map → input.util-0c139612.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"input.util-0475b865.js","mappings":"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","names":[],"sources":["src/components/input/input.fc.tsx","src/components/input/input.animation.ts","src/components/input/input.util.ts"],"sourcesContent":["/\n SPDX-FileCopyrightText: 2024 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\nimport { h, FunctionalComponent } from '@stencil/core';\nimport { MakeRef } from '../utils/make-ref';\nimport { A11yAttributes } from '../utils/a11y';\n\nexport function TextareaElement(props: {\n resizeBehavior: 'both' \| 'horizontal' \| 'vertical' \| 'none';\n textareaHeight?: string;\n textareaWidth?: string;\n textareaRows?: number;\n textareaCols?: number;\n disabled: boolean;\n readonly: boolean;\n maxLength?: number;\n minLength?: number;\n isInvalid: boolean;\n required: boolean;\n value: string;\n placeholder?: string;\n textAreaRef: (el: HTMLTextAreaElement \| undefined) => void;\n valueChange: (value: string) => void;\n updateFormInternalValue: (value: string) => void;\n onBlur: () => void;\n ariaAttributes?: A11yAttributes;\n}) {\n return (\n <textarea\n readOnly={props.readonly}\n disabled={props.disabled}\n maxLength={props.maxLength}\n minLength={props.minLength}\n cols={props.textareaCols}\n rows={props.textareaRows}\n ref={props.textAreaRef}\n class={{\n 'is-invalid': props.isInvalid,\n }}\n required={props.required}\n value={props.value}\n placeholder={props.placeholder}\n onInput={(inputEvent) => {\n const target = inputEvent.target as HTMLInputElement;\n props.updateFormInternalValue(target.value);\n props.valueChange(target.value);\n }}\n onBlur={() => props.onBlur()}\n style={{\n resize: props.resizeBehavior,\n height: props.textareaHeight,\n width: props.textareaWidth,\n }}\n {...props.ariaAttributes}\n ></textarea>\n );\n}\n\nexport function InputElement(props: {\n id: string;\n disabled: boolean;\n readonly: boolean;\n maxLength?: string \| number;\n minLength?: string \| number;\n max?: string \| number;\n min?: string \| number;\n pattern?: string;\n type: string;\n isInvalid: boolean;\n required: boolean;\n value: string \| number;\n placeholder?: string;\n inputRef: (el: HTMLInputElement \| undefined) => void;\n onKeyPress: (event: KeyboardEvent) => void;\n valueChange: (value: string) => void;\n updateFormInternalValue: (value: string) => void;\n onBlur: () => void;\n ariaAttributes?: A11yAttributes;\n}) {\n return (\n <input\n id={props.id}\n autoComplete=\"off\"\n readOnly={props.readonly}\n disabled={props.disabled}\n min={props.min}\n max={props.max}\n maxLength={props.maxLength ? Number(props.maxLength) : undefined}\n minLength={props.maxLength ? Number(props.minLength) : undefined}\n ref={props.inputRef}\n pattern={props.pattern}\n type={props.type}\n class={{\n 'is-invalid': props.isInvalid,\n }}\n required={props.required}\n value={props.value}\n placeholder={props.placeholder}\n onKeyPress={(event) => props.onKeyPress(event)}\n onInput={(inputEvent) => {\n const target = inputEvent.target as HTMLInputElement;\n props.updateFormInternalValue(target.value);\n props.valueChange(target.value);\n }}\n onBlur={() => props.onBlur()}\n {...props.ariaAttributes}\n ></input>\n );\n}\n\nexport const SlotEnd: FunctionalComponent<{\n slotEndRef: MakeRef<HTMLDivElement>;\n onSlotChange?: (e: Event) => void;\n}> = (props, children) => {\n return (\n <div class=\"end-container\" ref={props.slotEndRef}>\n <slot name=\"end\" onSlotchange={props.onSlotChange}></slot>\n {children}\n </div>\n );\n};\n\nexport const SlotStart: FunctionalComponent<{\n slotStartRef: MakeRef<HTMLDivElement>;\n onSlotChange?: (e: Event) => void;\n}> = (props) => {\n return (\n <div class=\"start-container\" ref={props.slotStartRef}>\n <slot name=\"start\" onSlotchange={props.onSlotChange}></slot>\n </div>\n );\n};\n","/\n * SPDX-FileCopyrightText: 2024 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\nimport anime from 'animejs';\n\nexport function shakeInput(input: HTMLInputElement) {\n const xMax = 5;\n anime({\n targets: input,\n duration: 200,\n easing: 'easeInOutSine',\n loop: 2,\n translateX: [\n {\n value: xMax -1,\n },\n {\n value: xMax,\n },\n {\n value: xMax / -2,\n },\n {\n value: xMax / 2,\n },\n {\n value: 0,\n },\n ],\n });\n}\n","/\n SPDX-FileCopyrightText: 2024 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { A11yAttributes, a11yBoolean } from '../utils/a11y';\nimport {\n IxFormComponent,\n IxInputFieldComponent,\n ValidationResults,\n shouldSuppressInternalValidation,\n} from '../utils/input';\nimport { createMutationObserver } from '../utils/mutation-observer';\nimport { convertToRemString } from '../utils/rwd.util';\nimport { generateUUID } from '../utils/uuid';\nimport { shakeInput } from './input.animation';\n\nexport function createIdIfNotExists(\n element: IxFormComponent,\n idPrefix: string = 'input'\n) {\n return element.hasAttribute('id')\n ? element.getAttribute('id')\n : `${idPrefix}-${generateUUID()}`;\n}\n\nexport function mapValidationResult<T>(\n ref: IxInputFieldComponent<T>,\n result: ValidationResults\n) {\n ref.isInvalid = result.isInvalid \|\| result.isInvalidByRequired;\n ref.isValid = result.isValid;\n ref.isInfo = result.isInfo;\n ref.isWarning = result.isWarning;\n}\n\nexport function checkAllowedKeys<T>(\n comp: IxInputFieldComponent<T>,\n event: KeyboardEvent\n) {\n if (comp.allowedCharactersPattern) {\n const regex = new RegExp(comp.allowedCharactersPattern);\n if (!regex.test(event.key)) {\n event.preventDefault();\n shakeInput(comp.inputRef.current);\n }\n }\n}\n\nexport async function checkInternalValidity<T>(\n comp: IxFormComponent<T>,\n input: HTMLInputElement \| HTMLTextAreaElement\n) {\n const validityState = input.validity;\n\n const eventResult = comp.validityStateChange.emit(validityState);\n\n if (eventResult.defaultPrevented) {\n return;\n }\n\n if (!comp.value) {\n return;\n }\n\n const skipValidation = await shouldSuppressInternalValidation(comp);\n if (skipValidation) {\n return;\n }\n\n const { valid } = validityState;\n comp.hostElement.classList.toggle('ix-invalid--validity-invalid', !valid);\n}\n\nexport function onInputBlur<T>(\n comp: IxFormComponent<T>,\n input?: HTMLInputElement \| HTMLTextAreaElement \| null\n) {\n comp.ixBlur.emit();\n\n if (!input) {\n throw new Error('Input element is not available');\n }\n\n input.setAttribute('data-ix-touched', 'true');\n checkInternalValidity(comp, input);\n}\n\nexport function applyPaddingEnd(\n inputElement: HTMLElement \| null,\n width: number,\n options: {\n slotEnd: boolean;\n additionalPaddingRight?: string;\n }\n) {\n if (!inputElement) {\n return;\n }\n\n const remInPixels = 16;\n const padding = convertToRemString(width + remInPixels / 2);\n\n if (options.slotEnd) {\n inputElement.style.paddingRight = `calc(${padding} + ${\n options.additionalPaddingRight ?? '0rem'\n })`;\n } else {\n inputElement.style.paddingLeft = padding;\n }\n}\n\nexport function adjustPaddingForStartAndEnd(\n startElement: HTMLElement \| null,\n endElement: HTMLElement \| null,\n inputElement: HTMLElement \| null\n) {\n requestAnimationFrame(() => {\n requestAnimationFrame(() => {\n if (startElement) {\n const startBoundingRect = startElement.getBoundingClientRect();\n if (startBoundingRect) {\n applyPaddingEnd(inputElement, startBoundingRect.width, {\n slotEnd: false,\n });\n }\n }\n\n if (endElement) {\n const endBoundingRect = endElement.getBoundingClientRect();\n if (endBoundingRect) {\n applyPaddingEnd(inputElement, endBoundingRect.width, {\n slotEnd: true,\n });\n }\n }\n });\n });\n}\n\nexport function getAriaAttributesForInput(\n component: IxInputFieldComponent\n): A11yAttributes {\n const inputAria: A11yAttributes = {\n 'aria-invalid': `${a11yBoolean(component.isInvalid)}`,\n 'aria-required': `${a11yBoolean(component.required)}`,\n };\n\n if (component.isInvalid && component.invalidText) {\n inputAria['aria-errormessage'] = component.invalidText;\n }\n return inputAria;\n}\n\nexport type DisposableChangesAndVisibilityObservers = () => void;\n\nexport const addDisposableChangesAndVisibilityObservers = (\n element: HTMLElement,\n callback: () => void\n): DisposableChangesAndVisibilityObservers => {\n const intersectionObserver = observeElementUntilVisible(element, callback);\n const mutationObserver = createMutationObserver(callback);\n\n mutationObserver.observe(element, {\n subtree: true,\n attributes: true,\n });\n\n return () => {\n intersectionObserver.disconnect();\n mutationObserver.disconnect();\n };\n};\n\nfunction observeElementUntilVisible(\n hostElement: HTMLElement,\n updateCallback: () => void\n): IntersectionObserver {\n const intersectionObserver = new IntersectionObserver((entries) => {\n entries.forEach((entry) => {\n if (entry.isIntersecting) {\n updateCallback();\n }\n });\n });\n\n intersectionObserver.observe(hostElement);\n return intersectionObserver;\n}\n"],"version":3}
1	+ {"file":"input.util-0c139612.js","mappings":"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","names":[],"sources":["src/components/input/input.fc.tsx","src/components/input/input.animation.ts","src/components/input/input.util.ts"],"sourcesContent":["/\n SPDX-FileCopyrightText: 2024 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\nimport { h, FunctionalComponent } from '@stencil/core';\nimport { MakeRef } from '../utils/make-ref';\nimport { A11yAttributes } from '../utils/a11y';\n\nexport function TextareaElement(props: {\n resizeBehavior: 'both' \| 'horizontal' \| 'vertical' \| 'none';\n textareaHeight?: string;\n textareaWidth?: string;\n textareaRows?: number;\n textareaCols?: number;\n disabled: boolean;\n readonly: boolean;\n maxLength?: number;\n minLength?: number;\n isInvalid: boolean;\n required: boolean;\n value: string;\n placeholder?: string;\n textAreaRef: (el: HTMLTextAreaElement \| undefined) => void;\n valueChange: (value: string) => void;\n updateFormInternalValue: (value: string) => void;\n onBlur: () => void;\n ariaAttributes?: A11yAttributes;\n}) {\n return (\n <textarea\n readOnly={props.readonly}\n disabled={props.disabled}\n maxLength={props.maxLength}\n minLength={props.minLength}\n cols={props.textareaCols}\n rows={props.textareaRows}\n ref={props.textAreaRef}\n class={{\n 'is-invalid': props.isInvalid,\n }}\n required={props.required}\n value={props.value}\n placeholder={props.placeholder}\n onInput={(inputEvent) => {\n const target = inputEvent.target as HTMLInputElement;\n props.updateFormInternalValue(target.value);\n props.valueChange(target.value);\n }}\n onBlur={() => props.onBlur()}\n style={{\n resize: props.resizeBehavior,\n height: props.textareaHeight,\n width: props.textareaWidth,\n }}\n {...props.ariaAttributes}\n ></textarea>\n );\n}\n\nexport function InputElement(props: {\n id: string;\n disabled: boolean;\n readonly: boolean;\n maxLength?: string \| number;\n minLength?: string \| number;\n max?: string \| number;\n min?: string \| number;\n pattern?: string;\n type: string;\n isInvalid: boolean;\n required: boolean;\n value: string \| number;\n placeholder?: string;\n inputRef: (el: HTMLInputElement \| undefined) => void;\n onKeyPress: (event: KeyboardEvent) => void;\n valueChange: (value: string) => void;\n updateFormInternalValue: (value: string) => void;\n onBlur: () => void;\n ariaAttributes?: A11yAttributes;\n}) {\n return (\n <input\n id={props.id}\n autoComplete=\"off\"\n readOnly={props.readonly}\n disabled={props.disabled}\n min={props.min}\n max={props.max}\n maxLength={props.maxLength ? Number(props.maxLength) : undefined}\n minLength={props.maxLength ? Number(props.minLength) : undefined}\n ref={props.inputRef}\n pattern={props.pattern}\n type={props.type}\n class={{\n 'is-invalid': props.isInvalid,\n }}\n required={props.required}\n value={props.value}\n placeholder={props.placeholder}\n onKeyPress={(event) => props.onKeyPress(event)}\n onInput={(inputEvent) => {\n const target = inputEvent.target as HTMLInputElement;\n props.updateFormInternalValue(target.value);\n props.valueChange(target.value);\n }}\n onBlur={() => props.onBlur()}\n {...props.ariaAttributes}\n ></input>\n );\n}\n\nexport const SlotEnd: FunctionalComponent<{\n slotEndRef: MakeRef<HTMLDivElement>;\n onSlotChange?: (e: Event) => void;\n}> = (props, children) => {\n return (\n <div class=\"end-container\" ref={props.slotEndRef}>\n <slot name=\"end\" onSlotchange={props.onSlotChange}></slot>\n {children}\n </div>\n );\n};\n\nexport const SlotStart: FunctionalComponent<{\n slotStartRef: MakeRef<HTMLDivElement>;\n onSlotChange?: (e: Event) => void;\n}> = (props) => {\n return (\n <div class=\"start-container\" ref={props.slotStartRef}>\n <slot name=\"start\" onSlotchange={props.onSlotChange}></slot>\n </div>\n );\n};\n","/\n * SPDX-FileCopyrightText: 2024 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\nimport anime from 'animejs';\n\nexport function shakeInput(input: HTMLInputElement) {\n const xMax = 5;\n anime({\n targets: input,\n duration: 200,\n easing: 'easeInOutSine',\n loop: 2,\n translateX: [\n {\n value: xMax -1,\n },\n {\n value: xMax,\n },\n {\n value: xMax / -2,\n },\n {\n value: xMax / 2,\n },\n {\n value: 0,\n },\n ],\n });\n}\n","/\n SPDX-FileCopyrightText: 2024 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { A11yAttributes, a11yBoolean } from '../utils/a11y';\nimport {\n IxFormComponent,\n IxInputFieldComponent,\n ValidationResults,\n shouldSuppressInternalValidation,\n} from '../utils/input';\nimport { createMutationObserver } from '../utils/mutation-observer';\nimport { convertToRemString } from '../utils/rwd.util';\nimport { generateUUID } from '../utils/uuid';\nimport { shakeInput } from './input.animation';\n\nexport function createIdIfNotExists(\n element: IxFormComponent,\n idPrefix: string = 'input'\n) {\n return element.hasAttribute('id')\n ? element.getAttribute('id')\n : `${idPrefix}-${generateUUID()}`;\n}\n\nexport function mapValidationResult<T>(\n ref: IxInputFieldComponent<T>,\n result: ValidationResults\n) {\n ref.isInvalid = result.isInvalid \|\| result.isInvalidByRequired;\n ref.isValid = result.isValid;\n ref.isInfo = result.isInfo;\n ref.isWarning = result.isWarning;\n}\n\nexport function checkAllowedKeys<T>(\n comp: IxInputFieldComponent<T>,\n event: KeyboardEvent\n) {\n if (comp.allowedCharactersPattern) {\n const regex = new RegExp(comp.allowedCharactersPattern);\n if (!regex.test(event.key)) {\n event.preventDefault();\n shakeInput(comp.inputRef.current);\n }\n }\n}\n\nexport async function checkInternalValidity<T>(\n comp: IxFormComponent<T>,\n input: HTMLInputElement \| HTMLTextAreaElement\n) {\n const validityState = input.validity;\n\n const eventResult = comp.validityStateChange.emit(validityState);\n\n if (eventResult.defaultPrevented) {\n return;\n }\n\n if (!comp.value) {\n return;\n }\n\n const skipValidation = await shouldSuppressInternalValidation(comp);\n if (skipValidation) {\n return;\n }\n\n const { valid } = validityState;\n comp.hostElement.classList.toggle('ix-invalid--validity-invalid', !valid);\n}\n\nexport function onInputBlur<T>(\n comp: IxFormComponent<T>,\n input?: HTMLInputElement \| HTMLTextAreaElement \| null\n) {\n comp.ixBlur.emit();\n\n if (!input) {\n throw new Error('Input element is not available');\n }\n\n input.setAttribute('data-ix-touched', 'true');\n checkInternalValidity(comp, input);\n}\n\nexport function applyPaddingEnd(\n inputElement: HTMLElement \| null,\n width: number,\n options: {\n slotEnd: boolean;\n additionalPaddingRight?: string;\n }\n) {\n if (!inputElement) {\n return;\n }\n\n const remInPixels = 16;\n const padding = convertToRemString(width + remInPixels / 2);\n\n if (options.slotEnd) {\n inputElement.style.paddingRight = `calc(${padding} + ${\n options.additionalPaddingRight ?? '0rem'\n })`;\n } else {\n inputElement.style.paddingLeft = padding;\n }\n}\n\nexport function adjustPaddingForStartAndEnd(\n startElement: HTMLElement \| null,\n endElement: HTMLElement \| null,\n inputElement: HTMLElement \| null\n) {\n requestAnimationFrame(() => {\n requestAnimationFrame(() => {\n if (startElement) {\n const startBoundingRect = startElement.getBoundingClientRect();\n if (startBoundingRect) {\n applyPaddingEnd(inputElement, startBoundingRect.width, {\n slotEnd: false,\n });\n }\n }\n\n if (endElement) {\n const endBoundingRect = endElement.getBoundingClientRect();\n if (endBoundingRect) {\n applyPaddingEnd(inputElement, endBoundingRect.width, {\n slotEnd: true,\n });\n }\n }\n });\n });\n}\n\nexport function getAriaAttributesForInput(\n component: IxInputFieldComponent\n): A11yAttributes {\n const inputAria: A11yAttributes = {\n 'aria-invalid': `${a11yBoolean(component.isInvalid)}`,\n 'aria-required': `${a11yBoolean(component.required)}`,\n };\n\n if (component.isInvalid && component.invalidText) {\n inputAria['aria-errormessage'] = component.invalidText;\n }\n return inputAria;\n}\n\nexport type DisposableChangesAndVisibilityObservers = () => void;\n\nexport const addDisposableChangesAndVisibilityObservers = (\n element: HTMLElement,\n callback: () => void\n): DisposableChangesAndVisibilityObservers => {\n const intersectionObserver = observeElementUntilVisible(element, callback);\n const mutationObserver = createMutationObserver(callback);\n\n mutationObserver.observe(element, {\n subtree: true,\n attributes: true,\n });\n\n return () => {\n intersectionObserver.disconnect();\n mutationObserver.disconnect();\n };\n};\n\nfunction observeElementUntilVisible(\n hostElement: HTMLElement,\n updateCallback: () => void\n): IntersectionObserver {\n const intersectionObserver = new IntersectionObserver((entries) => {\n entries.forEach((entry) => {\n if (entry.isIntersecting) {\n updateCallback();\n }\n });\n });\n\n intersectionObserver.observe(hostElement);\n return intersectionObserver;\n}\n"],"version":3}

package/dist/esm/ix-application-header.entry.js CHANGED Viewed

@@ -81,7 +81,6 @@ const ApplicationHeader = class {
     }
     async attachSiemensLogoIfLoaded() {
         var _a;
-        await window.customElements.whenDefined('ix-siemens-logo');
         const logoElement = document.createElement('ix-siemens-logo');
         if (!this.isLogoSlotted()) {
             (_a = this.hostElement
@@ -137,12 +136,12 @@ const ApplicationHeader = class {
         const showApplicationSwitch = ((_a = this.applicationLayoutContext) === null || _a === void 0 ? void 0 : _a.appSwitchConfig) &&
             this.breakpoint !== 'sm' &&
             this.suppressResponsive === false;
-        return (h(Host, { key: '76dff918e8dc599560271809e8cd5db5fdf90c15', class: {
+        return (h(Host, { key: '99c3340b760fe51621bfdd8390f8a78781d8ec2f', class: {
                 [`breakpoint-${this.breakpoint}`]: true,
-            }, slot: "application-header" }, (this.showMenu || showMenuByApplicationFrame) && (h("ix-menu-expand-icon", { key: '5e53c3df48d5eefaed2ddf00abab2b22d7966e47', onClick: () => this.onMenuClick(), expanded: this.menuExpanded })), showApplicationSwitch && (h("ix-icon-button", { key: 'd1f5b59071a39cea07e451e53d68e7e0dc8dc7ae', onClick: () => this.showAppSwitch(), icon: "apps", ghost: true, class: "app-switch" })), h("div", { key: '879c8d1037e0b86b7664ede60ba994d97033a4d8', class: { logo: true } }, h("slot", { key: 'f03c1be22bbda6834b7ab8beb234585f79b1b206', name: "logo" })), h("ix-typography", { key: '6b09e917dd66d0031d9cb2eb10400d880fca1a39', format: "body-lg", class: "name" }, this.name), h("div", { key: '108d13c64aa6db52f7c4e3d313820890998b100c', class: "content" }, this.breakpoint === 'sm' ? (h(Fragment, null, h("ix-icon-button", { class: {
+            }, slot: "application-header" }, (this.showMenu || showMenuByApplicationFrame) && (h("ix-menu-expand-icon", { key: '8c8e4c9ea5e5ffdedca71b413ab5ae272ec4cb2e', onClick: () => this.onMenuClick(), expanded: this.menuExpanded })), showApplicationSwitch && (h("ix-icon-button", { key: '1aaa76f6966e05ab9167c3d76129056323d95254', onClick: () => this.showAppSwitch(), icon: "apps", ghost: true, class: "app-switch" })), h("div", { key: '906798cca10aa839cc921c61c68dab394ab93b0e', class: { logo: true } }, h("slot", { key: 'b768d941698bf4a1e769d232dfeffdbf73d67cff', name: "logo" })), h("ix-typography", { key: 'b3a4aa2965702f9fc7c55ff28e6faf14fd7dedc5', format: "body-lg", class: "name" }, this.name), h("div", { key: '2db8a72304dba6df3bab501855f991241baecf19', class: "content" }, this.breakpoint === 'sm' ? (h(Fragment, null, h("ix-icon-button", { class: {
                 ['context-menu']: true,
                 ['context-menu-visible']: this.hasSlottedElements,
-            }, "data-context-menu": true, icon: "more-menu", ghost: true }), h("ix-dropdown", { "data-overflow-dropdown": true, class: "dropdown", discoverAllSubmenus: true, trigger: this.resolveContextMenuButton() }, h("div", { class: "dropdown-content", onClick: (e) => this.onContentBgClick(e) }, h("slot", { onSlotchange: () => this.updateIsSlottedContent() }))))) : (h("slot", { onSlotchange: () => this.updateIsSlottedContent() })), h("slot", { key: '0771683871b49c6c76816df10b64a0baa2cf60c9', name: "ix-application-header-avatar" }))));
+            }, "data-context-menu": true, icon: "more-menu", ghost: true }), h("ix-dropdown", { "data-overflow-dropdown": true, class: "dropdown", discoverAllSubmenus: true, trigger: this.resolveContextMenuButton() }, h("div", { class: "dropdown-content", onClick: (e) => this.onContentBgClick(e) }, h("slot", { onSlotchange: () => this.updateIsSlottedContent() }))))) : (h("slot", { onSlotchange: () => this.updateIsSlottedContent() })), h("slot", { key: 'f34d3cd4b5bb06bdeb4e4473adc677b8811a2101', name: "ix-application-header-avatar" }))));
     }
     get hostElement() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/ix-application-header.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ix-application-header.entry.js","mappings":"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","names":[],"sources":["src/components/application-header/application-header.scss?tag=ix-application-header&encapsulation=shadow","src/components/application-header/application-header.tsx"],"sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n@import 'mixins/shadow-dom/component';\n@import 'mixins/break-points';\n\n:host {\n @include ix-component;\n\n display: flex;\n align-items: flex-end;\n flex-wrap: nowrap;\n position: relative;\n width: 100%;\n height: calc(2.75rem + var(--ix-safe-area-inset-top, 0rem));\n min-height: calc(2.75rem + var(--ix-safe-area-inset-top, 0rem));\n padding-top: 0;\n padding-right: calc(1rem + var(--ix-safe-area-inset-right, 0rem));\n padding-bottom: 0.3rem;\n padding-left: calc(0.625rem + var(--ix-safe-area-inset-left, 0rem));\n\n color: var(--theme-app-header--color);\n background-color: var(--theme-app-header--background);\n\n border-bottom: var(--theme-app-header--border-width) solid\n var(--theme-app-header--border-color);\n\n z-index: var(--theme-z-index-fixed);\n\n .app-switch {\n margin-right: 1rem;\n }\n\n .name {\n overflow: hidden;\n overflow-wrap: anywhere;\n text-overflow: ellipsis;\n text-wrap: nowrap;\n max-width: 50%;\n margin-left: 1.5rem;\n margin-right: 2.5rem;\n margin-bottom: 0.25rem;\n color: var(--theme-app-header--color);\n }\n\n .logo {\n display: inline-flex;\n align-items: center;\n position: relative;\n height: 32px;\n overflow: hidden;\n line-height: 0rem;\n color: var(--theme-app-header-logo--color);\n margin-left: 0.375rem;\n }\n\n .content {\n display: flex;\n position: relative;\n flex-direction: row;\n margin-left: auto;\n margin-right: 0px;\n }\n\n .dropdown {\n overflow: visible;\n }\n\n .dropdown-content {\n padding: 1rem;\n }\n\n .context-menu {\n display: none;\n }\n\n .context-menu.context-menu-visible {\n display: block;\n }\n\n @include media-breakpoint-match('sm') {\n .logo {\n display: none;\n }\n }\n\n ::slotted(ix-avatar) {\n margin-left: 1rem;\n }\n}\n\n:host(.breakpoint-sm) {\n .logo {\n margin-left: 0.5rem;\n }\n}\n","/\n * SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n Fragment,\n h,\n Host,\n Prop,\n readTask,\n State,\n Watch,\n} from '@stencil/core';\nimport { showAppSwitch } from '../utils/app-switch';\nimport { applicationLayoutService } from '../utils/application-layout';\nimport {\n ApplicationLayoutContext,\n AppSwitchConfiguration,\n} from '../utils/application-layout/context';\nimport { Breakpoint } from '../utils/breakpoints';\nimport { ContextType, useContextConsumer } from '../utils/context';\nimport { menuController } from '../utils/menu-service/menu-service';\nimport { hasSlottedElements } from '../utils/shadow-dom';\nimport { Disposable } from '../utils/typed-event';\n\n/\n @slot logo - Location of the logo\n /\n@Component({\n tag: 'ix-application-header',\n styleUrl: 'application-header.scss',\n shadow: true,\n})\nexport class ApplicationHeader {\n @Element() hostElement!: HTMLIxApplicationHeaderElement;\n\n /\n Application name\n /\n @Prop() name?: string;\n\n /\n Controls the visibility of the menu toggle button based on the context of the application header.\n \n When the application header is utilized outside the application frame, the menu toggle button is displayed.\n * Conversely, if the header is within the application frame, this property is ineffective.\n \n @since 2.5.0\n /\n @Prop({ mutable: true }) showMenu?: boolean = false;\n\n /\n Event emitted when the menu toggle button is clicked\n \n @since 2.5.0\n /\n @Event() menuToggle!: EventEmitter<boolean>;\n\n /\n Event emitted when the app switch button is clicked\n \n @since 3.0.0\n */\n @Event() openAppSwitch!: EventEmitter<void>;\n\n @State() breakpoint: Breakpoint = 'lg';\n @State() menuExpanded = false;\n @State() suppressResponsive = false;\n\n @State() hasSlottedElements = false;\n\n private menuDisposable?: Disposable;\n private modeDisposable?: Disposable;\n private callbackUpdateAppSwitchModal?: (\n config: AppSwitchConfiguration\n ) => void;\n\n @State() applicationLayoutContext?: ContextType<\n typeof ApplicationLayoutContext\n >;\n\n get contentBackground() {\n return this.hostElement.shadowRoot!.querySelector('.dropdown-content');\n }\n\n componentWillLoad() {\n useContextConsumer(\n this.hostElement,\n ApplicationLayoutContext,\n (ctx) => {\n if (ctx?.host === 'map-navigation') {\n this.suppressResponsive = true;\n this.breakpoint = 'md';\n return;\n }\n\n this.breakpoint = applicationLayoutService.breakpoint;\n this.applicationLayoutContext = ctx;\n\n this.tryUpdateAppSwitch();\n },\n true\n );\n\n this.menuDisposable = menuController.expandChange.on((show) => {\n this.menuExpanded = show;\n });\n\n this.modeDisposable = applicationLayoutService.onChange.on((mode) => {\n if (this.suppressResponsive) {\n return;\n }\n\n this.breakpoint = mode;\n });\n\n this.updateIsSlottedContent();\n }\n\n componentDidLoad() {\n this.attachSiemensLogoIfLoaded();\n }\n\n disconnectedCallback() {\n this.menuDisposable?.dispose();\n this.modeDisposable?.dispose();\n }\n\n @Watch('applicationLayoutContext')\n watchApplicationLayoutContext() {\n if (this.applicationLayoutContext) {\n this.showMenu = false;\n }\n }\n @Watch('suppressResponsive')\n watchSuppressResponsive() {\n this.breakpoint = 'md';\n }\n\n private isLogoSlotted() {\n const slotElement = this.hostElement.shadowRoot!.querySelector(\n 'slot[name=\"logo\"]'\n ) as HTMLSlotElement;\n const nodes = slotElement.assignedNodes({\n flatten: true,\n });\n\n return nodes.length !== 0;\n }\n\n private async attachSiemensLogoIfLoaded() {\n await window.customElements.whenDefined('ix-siemens-logo');\n const logoElement = document.createElement('ix-siemens-logo');\n if (!this.isLogoSlotted()) {\n this.hostElement\n .shadowRoot!.querySelector('.logo')\n ?.appendChild(logoElement);\n }\n }\n\n private async onMenuClick() {\n if (this.applicationLayoutContext) {\n menuController.toggle();\n } else {\n this.menuExpanded = !this.menuExpanded;\n }\n\n this.menuToggle.emit(this.menuExpanded);\n }\n\n private resolveContextMenuButton() {\n return new Promise<HTMLElement>((resolve) =>\n readTask(() =>\n resolve(\n this.hostElement.shadowRoot!.querySelector(\n '[data-context-menu]'\n ) as HTMLElement\n )\n )\n );\n }\n\n private tryUpdateAppSwitch() {\n if (\n !this.callbackUpdateAppSwitchModal \|\|\n !this.applicationLayoutContext?.appSwitchConfig\n ) {\n return;\n }\n\n this.callbackUpdateAppSwitchModal(\n this.applicationLayoutContext?.appSwitchConfig\n );\n }\n\n private async showAppSwitch() {\n const { defaultPrevented } = this.openAppSwitch.emit();\n\n if (defaultPrevented) {\n return;\n }\n\n if (!this.applicationLayoutContext?.appSwitchConfig) {\n return;\n }\n\n this.callbackUpdateAppSwitchModal = await showAppSwitch(\n this.applicationLayoutContext?.appSwitchConfig\n );\n }\n\n private updateIsSlottedContent() {\n const slotElement =\n this.hostElement.shadowRoot!.querySelector('.content slot');\n\n this.hasSlottedElements = hasSlottedElements(slotElement);\n }\n\n private onContentBgClick(e: MouseEvent) {\n if (e.target === this.contentBackground) {\n e.preventDefault();\n }\n }\n\n render() {\n const hasApplicationContextAvailable = !!this.applicationLayoutContext;\n\n const showMenuByApplicationFrame =\n this.breakpoint === 'sm' &&\n this.suppressResponsive === false &&\n hasApplicationContextAvailable;\n\n const showApplicationSwitch =\n this.applicationLayoutContext?.appSwitchConfig &&\n this.breakpoint !== 'sm' &&\n this.suppressResponsive === false;\n\n return (\n <Host\n class={{\n [`breakpoint-${this.breakpoint}`]: true,\n }}\n slot=\"application-header\"\n >\n {(this.showMenu \|\| showMenuByApplicationFrame) && (\n <ix-menu-expand-icon\n onClick={() => this.onMenuClick()}\n expanded={this.menuExpanded}\n ></ix-menu-expand-icon>\n )}\n {showApplicationSwitch && (\n <ix-icon-button\n onClick={() => this.showAppSwitch()}\n icon=\"apps\"\n ghost\n class=\"app-switch\"\n ></ix-icon-button>\n )}\n <div class={{ logo: true }}>\n <slot name=\"logo\"></slot>\n </div>\n <ix-typography format=\"body-lg\" class=\"name\">\n {this.name}\n </ix-typography>\n <div class=\"content\">\n {this.breakpoint === 'sm' ? (\n <Fragment>\n <ix-icon-button\n class={{\n ['context-menu']: true,\n ['context-menu-visible']: this.hasSlottedElements,\n }}\n data-context-menu\n icon=\"more-menu\"\n ghost\n ></ix-icon-button>\n <ix-dropdown\n data-overflow-dropdown\n class=\"dropdown\"\n discoverAllSubmenus\n trigger={this.resolveContextMenuButton()}\n >\n <div\n class=\"dropdown-content\"\n onClick={(e) => this.onContentBgClick(e)}\n >\n <slot\n onSlotchange={() => this.updateIsSlottedContent()}\n ></slot>\n </div>\n </ix-dropdown>\n </Fragment>\n ) : (\n <slot onSlotchange={() => this.updateIsSlottedContent()}></slot>\n )}\n <slot name=\"ix-application-header-avatar\"></slot>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ix-application-header.entry.js","mappings":"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","names":[],"sources":["src/components/application-header/application-header.scss?tag=ix-application-header&encapsulation=shadow","src/components/application-header/application-header.tsx"],"sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n@import 'mixins/shadow-dom/component';\n@import 'mixins/break-points';\n\n:host {\n @include ix-component;\n\n display: flex;\n align-items: flex-end;\n flex-wrap: nowrap;\n position: relative;\n width: 100%;\n height: calc(2.75rem + var(--ix-safe-area-inset-top, 0rem));\n min-height: calc(2.75rem + var(--ix-safe-area-inset-top, 0rem));\n padding-top: 0;\n padding-right: calc(1rem + var(--ix-safe-area-inset-right, 0rem));\n padding-bottom: 0.3rem;\n padding-left: calc(0.625rem + var(--ix-safe-area-inset-left, 0rem));\n\n color: var(--theme-app-header--color);\n background-color: var(--theme-app-header--background);\n\n border-bottom: var(--theme-app-header--border-width) solid\n var(--theme-app-header--border-color);\n\n z-index: var(--theme-z-index-fixed);\n\n .app-switch {\n margin-right: 1rem;\n }\n\n .name {\n overflow: hidden;\n overflow-wrap: anywhere;\n text-overflow: ellipsis;\n text-wrap: nowrap;\n max-width: 50%;\n margin-left: 1.5rem;\n margin-right: 2.5rem;\n margin-bottom: 0.25rem;\n color: var(--theme-app-header--color);\n }\n\n .logo {\n display: inline-flex;\n align-items: center;\n position: relative;\n height: 32px;\n overflow: hidden;\n line-height: 0rem;\n color: var(--theme-app-header-logo--color);\n margin-left: 0.375rem;\n }\n\n .content {\n display: flex;\n position: relative;\n flex-direction: row;\n margin-left: auto;\n margin-right: 0px;\n }\n\n .dropdown {\n overflow: visible;\n }\n\n .dropdown-content {\n padding: 1rem;\n }\n\n .context-menu {\n display: none;\n }\n\n .context-menu.context-menu-visible {\n display: block;\n }\n\n @include media-breakpoint-match('sm') {\n .logo {\n display: none;\n }\n }\n\n ::slotted(ix-avatar) {\n margin-left: 1rem;\n }\n}\n\n:host(.breakpoint-sm) {\n .logo {\n margin-left: 0.5rem;\n }\n}\n","/\n * SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n Fragment,\n h,\n Host,\n Prop,\n readTask,\n State,\n Watch,\n} from '@stencil/core';\nimport { showAppSwitch } from '../utils/app-switch';\nimport { applicationLayoutService } from '../utils/application-layout';\nimport {\n ApplicationLayoutContext,\n AppSwitchConfiguration,\n} from '../utils/application-layout/context';\nimport { Breakpoint } from '../utils/breakpoints';\nimport { ContextType, useContextConsumer } from '../utils/context';\nimport { menuController } from '../utils/menu-service/menu-service';\nimport { hasSlottedElements } from '../utils/shadow-dom';\nimport { Disposable } from '../utils/typed-event';\n\n/\n @slot logo - Location of the logo\n /\n@Component({\n tag: 'ix-application-header',\n styleUrl: 'application-header.scss',\n shadow: true,\n})\nexport class ApplicationHeader {\n @Element() hostElement!: HTMLIxApplicationHeaderElement;\n\n /\n Application name\n /\n @Prop() name?: string;\n\n /\n Controls the visibility of the menu toggle button based on the context of the application header.\n \n When the application header is utilized outside the application frame, the menu toggle button is displayed.\n * Conversely, if the header is within the application frame, this property is ineffective.\n \n @since 2.5.0\n /\n @Prop({ mutable: true }) showMenu?: boolean = false;\n\n /\n Event emitted when the menu toggle button is clicked\n \n @since 2.5.0\n /\n @Event() menuToggle!: EventEmitter<boolean>;\n\n /\n Event emitted when the app switch button is clicked\n \n @since 3.0.0\n */\n @Event() openAppSwitch!: EventEmitter<void>;\n\n @State() breakpoint: Breakpoint = 'lg';\n @State() menuExpanded = false;\n @State() suppressResponsive = false;\n\n @State() hasSlottedElements = false;\n\n private menuDisposable?: Disposable;\n private modeDisposable?: Disposable;\n private callbackUpdateAppSwitchModal?: (\n config: AppSwitchConfiguration\n ) => void;\n\n @State() applicationLayoutContext?: ContextType<\n typeof ApplicationLayoutContext\n >;\n\n get contentBackground() {\n return this.hostElement.shadowRoot!.querySelector('.dropdown-content');\n }\n\n componentWillLoad() {\n useContextConsumer(\n this.hostElement,\n ApplicationLayoutContext,\n (ctx) => {\n if (ctx?.host === 'map-navigation') {\n this.suppressResponsive = true;\n this.breakpoint = 'md';\n return;\n }\n\n this.breakpoint = applicationLayoutService.breakpoint;\n this.applicationLayoutContext = ctx;\n\n this.tryUpdateAppSwitch();\n },\n true\n );\n\n this.menuDisposable = menuController.expandChange.on((show) => {\n this.menuExpanded = show;\n });\n\n this.modeDisposable = applicationLayoutService.onChange.on((mode) => {\n if (this.suppressResponsive) {\n return;\n }\n\n this.breakpoint = mode;\n });\n\n this.updateIsSlottedContent();\n }\n\n componentDidLoad() {\n this.attachSiemensLogoIfLoaded();\n }\n\n disconnectedCallback() {\n this.menuDisposable?.dispose();\n this.modeDisposable?.dispose();\n }\n\n @Watch('applicationLayoutContext')\n watchApplicationLayoutContext() {\n if (this.applicationLayoutContext) {\n this.showMenu = false;\n }\n }\n @Watch('suppressResponsive')\n watchSuppressResponsive() {\n this.breakpoint = 'md';\n }\n\n private isLogoSlotted() {\n const slotElement = this.hostElement.shadowRoot!.querySelector(\n 'slot[name=\"logo\"]'\n ) as HTMLSlotElement;\n const nodes = slotElement.assignedNodes({\n flatten: true,\n });\n\n return nodes.length !== 0;\n }\n\n private async attachSiemensLogoIfLoaded() {\n const logoElement = document.createElement('ix-siemens-logo');\n if (!this.isLogoSlotted()) {\n this.hostElement\n .shadowRoot!.querySelector('.logo')\n ?.appendChild(logoElement);\n }\n }\n\n private async onMenuClick() {\n if (this.applicationLayoutContext) {\n menuController.toggle();\n } else {\n this.menuExpanded = !this.menuExpanded;\n }\n\n this.menuToggle.emit(this.menuExpanded);\n }\n\n private resolveContextMenuButton() {\n return new Promise<HTMLElement>((resolve) =>\n readTask(() =>\n resolve(\n this.hostElement.shadowRoot!.querySelector(\n '[data-context-menu]'\n ) as HTMLElement\n )\n )\n );\n }\n\n private tryUpdateAppSwitch() {\n if (\n !this.callbackUpdateAppSwitchModal \|\|\n !this.applicationLayoutContext?.appSwitchConfig\n ) {\n return;\n }\n\n this.callbackUpdateAppSwitchModal(\n this.applicationLayoutContext?.appSwitchConfig\n );\n }\n\n private async showAppSwitch() {\n const { defaultPrevented } = this.openAppSwitch.emit();\n\n if (defaultPrevented) {\n return;\n }\n\n if (!this.applicationLayoutContext?.appSwitchConfig) {\n return;\n }\n\n this.callbackUpdateAppSwitchModal = await showAppSwitch(\n this.applicationLayoutContext?.appSwitchConfig\n );\n }\n\n private updateIsSlottedContent() {\n const slotElement =\n this.hostElement.shadowRoot!.querySelector('.content slot');\n\n this.hasSlottedElements = hasSlottedElements(slotElement);\n }\n\n private onContentBgClick(e: MouseEvent) {\n if (e.target === this.contentBackground) {\n e.preventDefault();\n }\n }\n\n render() {\n const hasApplicationContextAvailable = !!this.applicationLayoutContext;\n\n const showMenuByApplicationFrame =\n this.breakpoint === 'sm' &&\n this.suppressResponsive === false &&\n hasApplicationContextAvailable;\n\n const showApplicationSwitch =\n this.applicationLayoutContext?.appSwitchConfig &&\n this.breakpoint !== 'sm' &&\n this.suppressResponsive === false;\n\n return (\n <Host\n class={{\n [`breakpoint-${this.breakpoint}`]: true,\n }}\n slot=\"application-header\"\n >\n {(this.showMenu \|\| showMenuByApplicationFrame) && (\n <ix-menu-expand-icon\n onClick={() => this.onMenuClick()}\n expanded={this.menuExpanded}\n ></ix-menu-expand-icon>\n )}\n {showApplicationSwitch && (\n <ix-icon-button\n onClick={() => this.showAppSwitch()}\n icon=\"apps\"\n ghost\n class=\"app-switch\"\n ></ix-icon-button>\n )}\n <div class={{ logo: true }}>\n <slot name=\"logo\"></slot>\n </div>\n <ix-typography format=\"body-lg\" class=\"name\">\n {this.name}\n </ix-typography>\n <div class=\"content\">\n {this.breakpoint === 'sm' ? (\n <Fragment>\n <ix-icon-button\n class={{\n ['context-menu']: true,\n ['context-menu-visible']: this.hasSlottedElements,\n }}\n data-context-menu\n icon=\"more-menu\"\n ghost\n ></ix-icon-button>\n <ix-dropdown\n data-overflow-dropdown\n class=\"dropdown\"\n discoverAllSubmenus\n trigger={this.resolveContextMenuButton()}\n >\n <div\n class=\"dropdown-content\"\n onClick={(e) => this.onContentBgClick(e)}\n >\n <slot\n onSlotchange={() => this.updateIsSlottedContent()}\n ></slot>\n </div>\n </ix-dropdown>\n </Fragment>\n ) : (\n <slot onSlotchange={() => this.updateIsSlottedContent()}></slot>\n )}\n <slot name=\"ix-application-header-avatar\"></slot>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}