npm - @siemens/ix - Versions diffs - 3.0.0-alpha.4 → 3.0.0 - Mend

@siemens/ix 3.0.0-alpha.4 → 3.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1093) hide show

package/components/ix-modal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ix-modal.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/utils/waitForElement.ts","src/components/modal/modal.scss?tag=ix-modal&encapsulation=shadow","src/components/modal/modal.tsx"],"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 /\n\nexport function waitForElement<R extends HTMLElement>(\n selector: string,\n doc: any,\n timeout = 3000\n): Promise<R> {\n return new Promise<R>((resolve, reject) => {\n const startTime = Date.now();\n\n const checkIfElementExist = () => {\n const dialog = doc.querySelector(selector) satisfies R;\n\n if (dialog) {\n resolve(dialog);\n } else {\n if (Date.now() - startTime < timeout) {\n setTimeout(checkIfElementExist);\n } else {\n reject();\n }\n }\n };\n\n checkIfElementExist();\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\n::backdrop {\n --ix-dialog-backdrop: var(--theme-color-lightbox, #0000008c);\n}\n\n:focus-visible {\n outline: none !important;\n}\n\n:host {\n display: none;\n\n dialog {\n --ix-dialog-padding: 1rem;\n\n margin: 0;\n padding: var(--ix-dialog-padding);\n padding-top: calc(var(--ix-dialog-padding) + var(--ix-safe-area-inset-top));\n padding-bottom: calc(\n var(--ix-dialog-padding) + var(--ix-safe-area-inset-bottom)\n );\n left: 50%;\n }\n\n dialog::backdrop {\n backdrop-filter: blur(2.7182817459106445px);\n }\n\n .modal {\n display: flex;\n flex-direction: column;\n position: relative;\n border: none;\n border-radius: var(--theme-default-border-radius);\n background: var(--theme-modal--background);\n box-shadow: var(--theme-shadow-4);\n color: var(--theme-color-std-text);\n overflow: visible;\n max-height: 80vh;\n pointer-events: all;\n }\n\n .modal-size-360 {\n width: 22.5rem;\n }\n\n .modal-size-480 {\n width: 30rem;\n }\n\n .modal-size-600 {\n width: 37.5rem;\n }\n\n .modal-size-720 {\n width: 45rem;\n }\n\n .modal-size-840 {\n width: 52.5rem;\n }\n\n .modal-size-full-width {\n width: 95%;\n }\n\n .modal-size-full-screen {\n border-radius: 0;\n left: 0 !important;\n top: 0 !important;\n transform: none !important;\n box-shadow: none;\n\n --ix-dialog-full-screen-height: calc(\n var(--ix-safe-area-inset-top) + var(--ix-safe-area-inset-bottom)\n );\n\n width: calc(100% - var(--ix-dialog-padding) 2);\n min-width: calc(100% - var(--ix-dialog-padding) * 2);\n max-width: calc(100% - var(--ix-dialog-padding) * 2);\n\n min-height: calc(\n 100% - (var(--ix-dialog-padding) * 2) -\n var(--ix-dialog-full-screen-height)\n );\n max-height: calc(\n 100% - (var(--ix-dialog-padding) * 2) -\n var(--ix-dialog-full-screen-height)\n );\n }\n\n dialog.modal-size-full-screen::backdrop {\n background: var(--theme-modal--background);\n }\n\n .dialog-backdrop {\n display: block;\n position: fixed;\n width: 100vw;\n height: 100vh;\n top: 0;\n left: 0;\n\n pointer-events: none;\n }\n\n ::slotted(ix-modal-footer) {\n margin-top: auto;\n }\n}\n\n:host(.visible) {\n display: block;\n}\n\n:host(.align-center) {\n dialog {\n margin: 0;\n left: 50%;\n top: 50%;\n }\n}\n\n:host(.no-backdrop) {\n dialog::backdrop {\n background-color: transparent !important;\n backdrop-filter: none !important;\n }\n}\n\n:host(.with-icon) {\n ::slotted(ix-modal-footer),\n ::slotted(ix-modal-content) {\n margin-left: 3rem;\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 {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n State,\n} from '@stencil/core';\nimport anime from 'animejs';\nimport { A11yAttributes, a11yBoolean, a11yHostAttributes } from '../utils/a11y';\nimport Animation from '../utils/animation';\nimport { OnListener } from '../utils/listener';\nimport { waitForElement } from '../utils/waitForElement';\n\nexport type IxModalFixedSize = '360' \| '480' \| '600' \| '720' \| '840';\nexport type IxModalDynamicSize = 'full-width' \| 'full-screen';\nexport type IxModalSize = IxModalFixedSize \| IxModalDynamicSize;\n\n@Component({\n tag: 'ix-modal',\n styleUrl: 'modal.scss',\n shadow: true,\n})\nexport class Modal {\n private ariaAttributes: A11yAttributes = {};\n\n @Element() hostElement!: HTMLIxModalElement;\n\n /\n Modal size\n \n @since 2.0.0\n /\n @Prop() size: IxModalSize = '360';\n\n /\n Should the modal be animated\n /\n @Prop() animation = true;\n\n /\n Show a backdrop behind the modal dialog\n /\n @Prop() backdrop = true;\n\n /\n Dismiss modal on backdrop click\n \n @since 2.0.0\n /\n @Prop() closeOnBackdropClick = false;\n\n /\n Is called before the modal is dismissed.\n \n - Return `true` to proceed in dismissing the modal\n * - Return `false` to abort in dismissing the modal\n /\n @Prop() beforeDismiss?: (reason?: any) => boolean \| Promise<boolean>;\n\n /\n Centered modal\n /\n @Prop() centered = false;\n\n /\n If set to true the modal can be closed by pressing the Escape key\n /\n @Prop() closeOnEscape = true;\n\n /\n Dialog close\n /\n @Event() dialogClose!: EventEmitter;\n\n /\n Dialog cancel\n /\n @Event() dialogDismiss!: EventEmitter;\n\n @State() modalVisible = false;\n\n @OnListener<Modal>('keydown', (self) => !self.closeOnEscape)\n onKey(e: KeyboardEvent) {\n if (e.key === 'Escape') {\n e.preventDefault();\n }\n }\n\n get dialog() {\n return this.hostElement.shadowRoot!.querySelector('dialog');\n }\n\n private slideInModal() {\n const duration = this.animation ? Animation.mediumTime : 0;\n\n let transformY = this.centered ? '-50%' : 40;\n\n anime({\n targets: this.dialog,\n duration,\n opacity: [0, 1],\n translateY: [0, transformY],\n translateX: ['-50%', '-50%'],\n easing: 'easeOutSine',\n });\n }\n\n private slideOutModal(completeCallback: Function) {\n const duration = this.animation ? Animation.mediumTime : 0;\n\n let transformY = this.centered ? '-50%' : 40;\n\n anime({\n targets: this.dialog,\n duration,\n opacity: [1, 0],\n translateY: [transformY, 0],\n translateX: ['-50%', '-50%'],\n easing: 'easeInSine',\n complete: () => {\n if (completeCallback) {\n completeCallback();\n }\n },\n });\n }\n\n private onModalClick(event: MouseEvent) {\n if (event.target !== this.dialog) {\n return;\n }\n\n const rect = this.dialog!.getBoundingClientRect();\n const isClickOutside =\n rect.top <= event.clientY &&\n event.clientY <= rect.top + rect.height &&\n rect.left <= event.clientX &&\n event.clientX <= rect.left + rect.width;\n\n if (!isClickOutside && this.closeOnBackdropClick) {\n this.dismissModal();\n }\n }\n\n /\n Show the dialog\n /\n @Method()\n async showModal() {\n try {\n const dialog = await waitForElement<HTMLDialogElement>(\n 'dialog',\n this.hostElement.shadowRoot\n );\n this.modalVisible = true;\n dialog.showModal();\n } catch (e) {\n console.error('HTMLDialogElement not existing');\n }\n }\n\n /\n Dismiss the dialog\n /\n @Method()\n async dismissModal<T = any>(reason?: T) {\n if (!this.modalVisible) {\n return;\n }\n\n let allowDismiss = true;\n\n if (this.beforeDismiss !== undefined) {\n allowDismiss = await this.beforeDismiss(reason);\n }\n if (!allowDismiss) {\n return;\n }\n\n this.slideOutModal(() => {\n this.modalVisible = false;\n this.dialog!.close(\n JSON.stringify(\n {\n type: 'dismiss',\n reason,\n },\n null,\n 2\n )\n );\n\n this.dialogDismiss.emit(reason);\n });\n }\n\n /\n Close the dialog\n */\n @Method()\n async closeModal<T = any>(reason: T) {\n if (!this.modalVisible) {\n return;\n }\n\n this.slideOutModal(() => {\n this.modalVisible = false;\n this.dialog!.close(\n JSON.stringify(\n {\n type: 'close',\n reason,\n },\n null,\n 2\n )\n );\n\n this.dialogClose.emit(reason);\n });\n }\n\n componentDidLoad() {\n this.slideInModal();\n }\n\n componentWillLoad() {\n this.ariaAttributes = a11yHostAttributes(this.hostElement);\n }\n\n render() {\n return (\n <Host\n class={{\n visible: this.modalVisible,\n 'no-backdrop': this.backdrop === false,\n 'align-center': this.centered,\n }}\n >\n <div class=\"dialog-backdrop\">\n <dialog\n aria-modal={a11yBoolean(true)}\n aria-describedby={this.ariaAttributes['aria-describedby']}\n aria-labelledby={this.ariaAttributes['aria-labelledby']}\n class={{\n modal: true,\n [`modal-size-${this.size}`]: true,\n }}\n onClose={() => this.dismissModal()}\n onClick={(event) => this.onModalClick(event)}\n onCancel={(e) => {\n e.preventDefault();\n this.dismissModal();\n }}\n >\n <slot></slot>\n </dialog>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ix-modal.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/utils/waitForElement.ts","src/components/modal/modal.scss?tag=ix-modal&encapsulation=shadow","src/components/modal/modal.tsx"],"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 /\n\nexport function waitForElement<R extends HTMLElement>(\n selector: string,\n doc: any,\n timeout = 3000\n): Promise<R> {\n return new Promise<R>((resolve, reject) => {\n const startTime = Date.now();\n\n const checkIfElementExist = () => {\n const dialog = doc.querySelector(selector) satisfies R;\n\n if (dialog) {\n resolve(dialog);\n } else {\n if (Date.now() - startTime < timeout) {\n setTimeout(checkIfElementExist);\n } else {\n reject();\n }\n }\n };\n\n checkIfElementExist();\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\n::backdrop {\n --ix-dialog-backdrop: var(--theme-color-lightbox, #0000008c);\n}\n\n:focus-visible {\n outline: none !important;\n}\n\n:host {\n display: none;\n\n dialog {\n --ix-dialog-padding: 1rem;\n\n margin: 0;\n padding: var(--ix-dialog-padding);\n padding-top: calc(var(--ix-dialog-padding) + var(--ix-safe-area-inset-top));\n padding-bottom: calc(\n var(--ix-dialog-padding) + var(--ix-safe-area-inset-bottom)\n );\n left: 50%;\n }\n\n dialog::backdrop {\n backdrop-filter: blur(2.7182817459106445px);\n }\n\n .modal {\n display: flex;\n flex-direction: column;\n position: relative;\n border: none;\n border-radius: var(--theme-default-border-radius);\n background: var(--theme-modal--background);\n box-shadow: var(--theme-shadow-4);\n color: var(--theme-color-std-text);\n overflow: visible;\n max-height: 80vh;\n pointer-events: all;\n }\n\n .modal-size-360 {\n width: 22.5rem;\n }\n\n .modal-size-480 {\n width: 30rem;\n }\n\n .modal-size-600 {\n width: 37.5rem;\n }\n\n .modal-size-720 {\n width: 45rem;\n }\n\n .modal-size-840 {\n width: 52.5rem;\n }\n\n .modal-size-full-width {\n width: 95%;\n }\n\n .modal-size-full-screen {\n border-radius: 0;\n left: 0 !important;\n top: 0 !important;\n transform: none !important;\n box-shadow: none;\n\n --ix-dialog-full-screen-height: calc(\n var(--ix-safe-area-inset-top) + var(--ix-safe-area-inset-bottom)\n );\n\n width: calc(100% - var(--ix-dialog-padding) 2);\n min-width: calc(100% - var(--ix-dialog-padding) * 2);\n max-width: calc(100% - var(--ix-dialog-padding) * 2);\n\n min-height: calc(\n 100% - (var(--ix-dialog-padding) * 2) -\n var(--ix-dialog-full-screen-height)\n );\n max-height: calc(\n 100% - (var(--ix-dialog-padding) * 2) -\n var(--ix-dialog-full-screen-height)\n );\n }\n\n dialog.modal-size-full-screen::backdrop {\n background: var(--theme-modal--background);\n }\n\n .dialog-backdrop {\n display: block;\n position: fixed;\n width: 100vw;\n height: 100vh;\n top: 0;\n left: 0;\n\n pointer-events: none;\n }\n\n ::slotted(ix-modal-footer) {\n margin-top: auto;\n }\n}\n\n:host(.visible) {\n display: block;\n}\n\n:host(.align-center) {\n dialog {\n margin: 0;\n left: 50%;\n top: 50%;\n }\n}\n\n:host(.no-backdrop) {\n dialog::backdrop {\n background-color: transparent !important;\n backdrop-filter: none !important;\n }\n}\n\n:host(.with-icon) {\n ::slotted(ix-modal-footer),\n ::slotted(ix-modal-content) {\n margin-left: 3rem;\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 {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n State,\n} from '@stencil/core';\nimport anime from 'animejs';\nimport { A11yAttributes, a11yBoolean, a11yHostAttributes } from '../utils/a11y';\nimport Animation from '../utils/animation';\nimport { OnListener } from '../utils/listener';\nimport { waitForElement } from '../utils/waitForElement';\n\nexport type IxModalFixedSize = '360' \| '480' \| '600' \| '720' \| '840';\nexport type IxModalDynamicSize = 'full-width' \| 'full-screen';\nexport type IxModalSize = IxModalFixedSize \| IxModalDynamicSize;\n\n@Component({\n tag: 'ix-modal',\n styleUrl: 'modal.scss',\n shadow: true,\n})\nexport class Modal {\n private ariaAttributes: A11yAttributes = {};\n\n @Element() hostElement!: HTMLIxModalElement;\n\n /\n Modal size\n /\n @Prop() size: IxModalSize = '360';\n\n /\n Should the modal be animated\n /\n @Prop() animation = true;\n\n /\n Show a backdrop behind the modal dialog\n /\n @Prop() backdrop = true;\n\n /\n Dismiss modal on backdrop click\n /\n @Prop() closeOnBackdropClick = false;\n\n /\n Is called before the modal is dismissed.\n \n - Return `true` to proceed in dismissing the modal\n * - Return `false` to abort in dismissing the modal\n /\n @Prop() beforeDismiss?: (reason?: any) => boolean \| Promise<boolean>;\n\n /\n Centered modal\n /\n @Prop() centered = false;\n\n /\n If set to true the modal can be closed by pressing the Escape key\n /\n @Prop() closeOnEscape = true;\n\n /\n Dialog close\n /\n @Event() dialogClose!: EventEmitter;\n\n /\n Dialog cancel\n /\n @Event() dialogDismiss!: EventEmitter;\n\n @State() modalVisible = false;\n\n @OnListener<Modal>('keydown', (self) => !self.closeOnEscape)\n onKey(e: KeyboardEvent) {\n if (e.key === 'Escape') {\n e.preventDefault();\n }\n }\n\n get dialog() {\n return this.hostElement.shadowRoot!.querySelector('dialog');\n }\n\n private slideInModal() {\n const duration = this.animation ? Animation.mediumTime : 0;\n\n let transformY = this.centered ? '-50%' : 40;\n\n anime({\n targets: this.dialog,\n duration,\n opacity: [0, 1],\n translateY: [0, transformY],\n translateX: ['-50%', '-50%'],\n easing: 'easeOutSine',\n });\n }\n\n private slideOutModal(completeCallback: Function) {\n const duration = this.animation ? Animation.mediumTime : 0;\n\n let transformY = this.centered ? '-50%' : 40;\n\n anime({\n targets: this.dialog,\n duration,\n opacity: [1, 0],\n translateY: [transformY, 0],\n translateX: ['-50%', '-50%'],\n easing: 'easeInSine',\n complete: () => {\n if (completeCallback) {\n completeCallback();\n }\n },\n });\n }\n\n private onModalClick(event: MouseEvent) {\n if (event.target !== this.dialog) {\n return;\n }\n\n const rect = this.dialog!.getBoundingClientRect();\n const isClickOutside =\n rect.top <= event.clientY &&\n event.clientY <= rect.top + rect.height &&\n rect.left <= event.clientX &&\n event.clientX <= rect.left + rect.width;\n\n if (!isClickOutside && this.closeOnBackdropClick) {\n this.dismissModal();\n }\n }\n\n /\n Show the dialog\n /\n @Method()\n async showModal() {\n try {\n const dialog = await waitForElement<HTMLDialogElement>(\n 'dialog',\n this.hostElement.shadowRoot\n );\n this.modalVisible = true;\n dialog.showModal();\n } catch (e) {\n console.error('HTMLDialogElement not existing');\n }\n }\n\n /\n Dismiss the dialog\n /\n @Method()\n async dismissModal<T = any>(reason?: T) {\n if (!this.modalVisible) {\n return;\n }\n\n let allowDismiss = true;\n\n if (this.beforeDismiss !== undefined) {\n allowDismiss = await this.beforeDismiss(reason);\n }\n if (!allowDismiss) {\n return;\n }\n\n this.slideOutModal(() => {\n this.modalVisible = false;\n this.dialog!.close(\n JSON.stringify(\n {\n type: 'dismiss',\n reason,\n },\n null,\n 2\n )\n );\n\n this.dialogDismiss.emit(reason);\n });\n }\n\n /\n Close the dialog\n */\n @Method()\n async closeModal<T = any>(reason: T) {\n if (!this.modalVisible) {\n return;\n }\n\n this.slideOutModal(() => {\n this.modalVisible = false;\n this.dialog!.close(\n JSON.stringify(\n {\n type: 'close',\n reason,\n },\n null,\n 2\n )\n );\n\n this.dialogClose.emit(reason);\n });\n }\n\n componentDidLoad() {\n this.slideInModal();\n }\n\n componentWillLoad() {\n this.ariaAttributes = a11yHostAttributes(this.hostElement);\n }\n\n render() {\n return (\n <Host\n class={{\n visible: this.modalVisible,\n 'no-backdrop': this.backdrop === false,\n 'align-center': this.centered,\n }}\n >\n <div class=\"dialog-backdrop\">\n <dialog\n aria-modal={a11yBoolean(true)}\n aria-describedby={this.ariaAttributes['aria-describedby']}\n aria-labelledby={this.ariaAttributes['aria-labelledby']}\n class={{\n modal: true,\n [`modal-size-${this.size}`]: true,\n }}\n onClose={() => this.dismissModal()}\n onClick={(event) => this.onModalClick(event)}\n onCancel={(e) => {\n e.preventDefault();\n this.dismissModal();\n }}\n >\n <slot></slot>\n </dialog>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/components/ix-number-input.js CHANGED Viewed

@@ -1,14 +1,14 @@
 import { p as proxyCustomElement, H, e as createEvent, h, d as Host } from './p-BA1wZ05L.js';
 import { L as iconMinus, M as iconPlus } from './p-Dn_WjwtW.js';
-import { H as HookValidationLifecycle } from './p-DGeWaNlt.js';
+import { H as HookValidationLifecycle } from './p-aw_FhcJ5.js';
 import { m as makeRef } from './p-bcj7UEIC.js';
-import { m as mapValidationResult, a as addDisposableChangesAndVisibilityObservers, b as adjustPaddingForStartAndEnd, c as SlotStart, I as InputElement, d as checkAllowedKeys, o as onInputBlur, S as SlotEnd, e as checkInternalValidity } from './p-C8vn2GFY.js';
-import { d as defineCustomElement$7 } from './p-BuK5WByk.js';
-import { d as defineCustomElement$6 } from './p-B-zHEqXz.js';
-import { d as defineCustomElement$5 } from './p-D_wwWxx8.js';
+import { m as mapValidationResult, a as addDisposableChangesAndVisibilityObservers, b as adjustPaddingForStartAndEnd, c as SlotStart, I as InputElement, d as checkAllowedKeys, o as onInputBlur, S as SlotEnd, e as checkInternalValidity } from './p-BRCAzgk8.js';
+import { d as defineCustomElement$7 } from './p-B9XDeCpV.js';
+import { d as defineCustomElement$6 } from './p-Cyxle5Ec.js';
+import { d as defineCustomElement$5 } from './p-d7CnwTHv.js';
 import { d as defineCustomElement$4 } from './p-Dlmgmbod.js';
-import { d as defineCustomElement$3 } from './p-CB1ADCkU.js';
-import { d as defineCustomElement$2 } from './p-Dfzl82x1.js';
+import { d as defineCustomElement$3 } from './p-B_C2-EkQ.js';
+import { d as defineCustomElement$2 } from './p-B19EzNYi.js';
 const numberInputCss = "input{font-feature-settings:\"clig\" off, \"liga\" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-md);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;min-height:2rem;width:auto;padding:0.25rem 0.5rem;background-color:var(--theme-input--background);color:var(--theme-input--color);-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;text-overflow:ellipsis;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color);border-radius:var(--theme-input--border-radius);box-shadow:var(--theme-input--box-shadow)}input[type=number]{text-align:right}input[type=number]::-webkit-inner-spin-button{margin-right:-2px;margin-left:2px;display:none}input:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}input:-webkit-autofill,input:autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}input::-moz-placeholder{color:var(--theme-input-hint--color)}input::placeholder{color:var(--theme-input-hint--color)}input.hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only),input:hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only){border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}input.hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only),input:hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only){border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}input.focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only),input:focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only){outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}input.focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only),input:focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only){outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}input:-moz-read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}input.read-only,input:read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}input.read-only::-moz-placeholder,input:read-only::-moz-placeholder{color:transparent}input:-moz-read-only::placeholder{color:transparent}input.read-only::placeholder,input:read-only::placeholder{color:transparent}input:disabled,input.disabled{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;color:var(--theme-input--color--disabled);border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--disabled)}input:disabled::-moz-placeholder,input.disabled::-moz-placeholder{color:transparent}input:disabled::placeholder,input.disabled::placeholder{color:transparent}textarea{font-feature-settings:\"clig\" off, \"liga\" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-md);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;min-height:2rem;width:auto;padding:0.25rem 0.5rem;background-color:var(--theme-input--background);color:var(--theme-input--color);-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;text-overflow:ellipsis;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color);border-radius:var(--theme-input--border-radius);box-shadow:var(--theme-input--box-shadow)}textarea[type=number]{text-align:right}textarea[type=number]::-webkit-inner-spin-button{margin-right:-2px;margin-left:2px;display:none}textarea:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}textarea:-webkit-autofill,textarea:autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}textarea::-moz-placeholder{color:var(--theme-input-hint--color)}textarea::placeholder{color:var(--theme-input-hint--color)}textarea.hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only),textarea:hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only){border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}textarea.hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only),textarea:hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only){border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}textarea.focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only),textarea:focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only){outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}textarea.focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only),textarea:focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only){outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}textarea:-moz-read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}textarea.read-only,textarea:read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}textarea.read-only::-moz-placeholder,textarea:read-only::-moz-placeholder{color:transparent}textarea:-moz-read-only::placeholder{color:transparent}textarea.read-only::placeholder,textarea:read-only::placeholder{color:transparent}textarea:disabled,textarea.disabled{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;color:var(--theme-input--color--disabled);border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--disabled)}textarea:disabled::-moz-placeholder,textarea.disabled::-moz-placeholder{color:transparent}textarea:disabled::placeholder,textarea.disabled::placeholder{color:transparent}textarea{min-height:2rem;height:3.25rem;padding:calc(0.375rem - var(--theme-input--border-thickness)) calc(0.5rem - var(--theme-input--border-thickness))}textarea.ix-info:not(.disabled):not(:disabled):not([disabled]),input.ix-info:not(.disabled):not(:disabled):not([disabled]){border-color:var(--theme-input--border-color--info)}textarea.ix-info:not(.disabled):not(:disabled):not([disabled]):hover,input.ix-info:not(.disabled):not(:disabled):not([disabled]):hover{border-color:var(--theme-input--border-color--info--hover) !important}textarea.ix-info:not(.disabled):not(:disabled):not([disabled]):active,input.ix-info:not(.disabled):not(:disabled):not([disabled]):active{border-color:var(--theme-input--border-color--info--active) !important}textarea.ix-warning:not(.disabled):not(:disabled):not([disabled]),input.ix-warning:not(.disabled):not(:disabled):not([disabled]){border-color:var(--theme-input--border-color--warning--active) !important}textarea.ix-warning:not(.disabled):not(:disabled):not([disabled]):hover,input.ix-warning:not(.disabled):not(:disabled):not([disabled]):hover{border-color:var(--theme-input--border-color--warning--active) !important}textarea.ix-warning:not(.disabled):not(:disabled):not([disabled]):active,input.ix-warning:not(.disabled):not(:disabled):not([disabled]):active{border-color:var(--theme-input--border-color--warning--active) !important}textarea[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]),input[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]){background-color:var(--theme-input--background--invalid);border-color:var(--theme-input--border-color--invalid) !important}textarea[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):hover,input[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):hover{border-color:var(--theme-input--border-color--invalid--hover) !important}textarea[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):active,input[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):active{border-color:var(--theme-input--border-color--invalid--active) !important}:host{display:inline-block;position:relative;width:auto}: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 .input-wrapper{display:flex;position:relative;align-items:center;width:100%;height:100%}:host input{width:100%;height:100%}:host .start-container,:host .end-container{display:flex;position:absolute;align-items:center;justify-content:center;z-index:1}:host .start-container{left:0}:host .end-container{right:0}:host .start-container ::slotted(*){margin-left:0.5rem}:host .start-container ::slotted(ix-icon.size-24),:host .start-container ::slotted(ix-icon-button.btn-icon-16){margin-left:0.25rem}:host .start-container ::slotted(ix-icon-button.btn-icon-32){margin-left:0}:host .end-container ::slotted(*){margin-right:0.5rem}:host .end-container ::slotted(ix-icon.size-24),:host .end-container ::slotted(ix-icon-button.btn-icon-16){margin-right:0.25rem}:host .end-container ::slotted(ix-icon-button.btn-icon-32){margin-right:0}:host .bottom-text{margin-top:0.25rem;margin-bottom:0.25rem}:host(.disabled){pointer-events:none}:host(.disabled) input,:host(.disabled) textarea{pointer-events:none}:host(.ix-info:not(.disabled):not(:disabled):not([disabled])) input{border-color:var(--theme-input--border-color--info)}:host(.ix-info:not(.disabled):not(:disabled):not([disabled])) input:hover{border-color:var(--theme-input--border-color--info--hover) !important}:host(.ix-info:not(.disabled):not(:disabled):not([disabled])) input:active{border-color:var(--theme-input--border-color--info--active) !important}:host(.ix-warning:not(.disabled):not(:disabled):not([disabled])) input{border-color:var(--theme-input--border-color--warning--active) !important}:host(.ix-warning:not(.disabled):not(:disabled):not([disabled])) input:hover{border-color:var(--theme-input--border-color--warning--active) !important}:host(.ix-warning:not(.disabled):not(:disabled):not([disabled])) input:active{border-color:var(--theme-input--border-color--warning--active) !important}:host([class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled])) input,:host(.ix-invalid--required:not(.disabled):not(:disabled):not([disabled])) input{background-color:var(--theme-input--background--invalid);border-color:var(--theme-input--border-color--invalid) !important}:host([class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled])) input:hover,:host(.ix-invalid--required:not(.disabled):not(:disabled):not([disabled])) input:hover{border-color:var(--theme-input--border-color--invalid--hover) !important}:host([class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled])) input:active,:host(.ix-invalid--required:not(.disabled):not(:disabled):not([disabled])) input:active{border-color:var(--theme-input--border-color--invalid--active) !important}:host .input-wrapper.show-stepper-buttons input[type=number]{min-width:6rem}:host .number-stepper-container{display:flex;position:relative;flex-direction:row;flex-wrap:nowrap;margin-right:0.25rem}:host .number-stepper-container.container-hidden{display:none}";
@@ -93,8 +93,12 @@ const NumberInput = /*@__PURE__*/ proxyCustomElement(class NumberInput extends H
         return this.formInternals.form;
     }
     /** @internal */
-    hasValidValue() {
-        return Promise.resolve(!!this.value);
+    async hasValidValue() {
+        const nativeInput = await this.getNativeInputElement();
+        if (nativeInput.value === '') {
+            return Promise.resolve(false);
+        }
+        return Promise.resolve(this.value !== null && this.value !== undefined && !isNaN(this.value));
     }
     /**
      * Returns the native input element used under the hood
@@ -117,19 +121,19 @@ const NumberInput = /*@__PURE__*/ proxyCustomElement(class NumberInput extends H
     }
     render() {
         const showStepperButtons = this.showStepperButtons && (this.disabled || this.readonly) === false;
-        return (h(Host, { key: 'd4634b3d7387e9403d4096dad8b64cdf86ddc0b2', class: {
+        return (h(Host, { key: 'ef8acf686290210f136f6915caaf93519742a5c6', class: {
                 disabled: this.disabled,
                 readonly: this.readonly,
-            } }, h("ix-field-wrapper", { key: 'ca8e3d7619f510b33ceca78b34babae22c8a5c2d', id: this.numberInputId, required: this.required, label: this.label, helperText: this.helperText, invalidText: this.invalidText, infoText: this.infoText, warningText: this.warningText, validText: this.validText, showTextAsTooltip: this.showTextAsTooltip, isInvalid: this.isInvalid, isValid: this.isValid, isInfo: this.isInfo, isWarning: this.isWarning, controlRef: this.inputRef }, h("div", { key: '601c1efa7d76fccf3b0531ba5838dff6ac9ef988', class: {
+            } }, h("ix-field-wrapper", { key: 'fb332a250f3b89cd9ba913ce0d73ae769e1f7d11', id: this.numberInputId, required: this.required, label: this.label, helperText: this.helperText, invalidText: this.invalidText, infoText: this.infoText, warningText: this.warningText, validText: this.validText, showTextAsTooltip: this.showTextAsTooltip, isInvalid: this.isInvalid, isValid: this.isValid, isInfo: this.isInfo, isWarning: this.isWarning, controlRef: this.inputRef }, h("div", { key: 'f75e95a23010f6227413ef8f3e845f881526feb2', class: {
                 'input-wrapper': true,
                 'show-stepper-buttons': !!this.showStepperButtons,
-            } }, h(SlotStart, { key: '6227a18e452b881a6f0105371903db926de6be97', slotStartRef: this.slotStartRef, onSlotChange: () => this.updatePaddings() }), h(InputElement, { key: 'b1cf7b50b9081d242886b5c8e8fd17ec18af632e', id: this.numberInputId, readonly: this.readonly, disabled: this.disabled, min: this.min, max: this.max, pattern: this.pattern, type: 'number', isInvalid: this.isInvalid, required: this.required, value: this.value, placeholder: this.placeholder, inputRef: this.inputRef, onKeyPress: (event) => checkAllowedKeys(this, event), valueChange: (value) => this.valueChange.emit(Number(value)), updateFormInternalValue: (value) => this.updateFormInternalValue(Number(value)), onBlur: () => {
+            } }, h(SlotStart, { key: '35361c9e391c2b2fcf47115ede6f7e66cfff7e3a', slotStartRef: this.slotStartRef, onSlotChange: () => this.updatePaddings() }), h(InputElement, { key: '2c9255c6d904488f2969723bada4d5ce4164b44f', id: this.numberInputId, readonly: this.readonly, disabled: this.disabled, step: this.step, min: this.min, max: this.max, pattern: this.pattern, type: 'number', isInvalid: this.isInvalid, required: this.required, value: this.value, placeholder: this.placeholder, inputRef: this.inputRef, onKeyPress: (event) => checkAllowedKeys(this, event), valueChange: (value) => this.valueChange.emit(Number(value)), updateFormInternalValue: (value) => this.updateFormInternalValue(Number(value)), onBlur: () => {
                 onInputBlur(this, this.inputRef.current);
                 this.touched = true;
-            } }), h(SlotEnd, { key: 'ac36b5e13529d3289ead6bfe3a0df8a8a01968d3', slotEndRef: this.slotEndRef, onSlotChange: () => this.updatePaddings() }, h("div", { key: '2945f7bb4991960113e0b546fafb350840118fd0', class: {
+            } }), h(SlotEnd, { key: '5574b0ab18e81036f16c89c4b1bd84f1ae636385', slotEndRef: this.slotEndRef, onSlotChange: () => this.updatePaddings() }, h("div", { key: '8e78f12da4ea4130333542bf49f238b02a7d808e', class: {
                 'number-stepper-container': true,
                 'container-hidden': !showStepperButtons,
-            } }, h("ix-icon-button", { key: '87d23accd5a945e28ce9e327eaee2a3eaccd42a7', ghost: true, icon: iconMinus, size: "16", class: "number-stepper-button step-minus", onClick: () => {
+            } }, h("ix-icon-button", { key: 'd44b7b3032860d9590bc22ef582fc4b8406a7ac0', ghost: true, icon: iconMinus, size: "16", class: "number-stepper-button step-minus", "aria-label": "decrement number", onClick: () => {
                 if (!this.inputRef.current) {
                     return;
                 }
@@ -137,7 +141,7 @@ const NumberInput = /*@__PURE__*/ proxyCustomElement(class NumberInput extends H
                 checkInternalValidity(this, this.inputRef.current);
                 this.updateFormInternalValue(Number(this.inputRef.current.value));
                 this.valueChange.emit(this.value);
-            } }), h("ix-icon-button", { key: '8f1a862f4ef4a87593fb24cf1d1d993c85f3855e', ghost: true, icon: iconPlus, size: "16", class: "number-stepper-button step-plus", onClick: () => {
+            } }), h("ix-icon-button", { key: 'f862e0c47f85486018eace274092f8eab9ff029d', ghost: true, icon: iconPlus, size: "16", class: "number-stepper-button step-plus", "aria-label": "increment number", onClick: () => {
                 if (!this.inputRef.current) {
                     return;
                 }
@@ -169,6 +173,7 @@ const NumberInput = /*@__PURE__*/ proxyCustomElement(class NumberInput extends H
         "max": [8],
         "allowedCharactersPattern": [1, "allowed-characters-pattern"],
         "showStepperButtons": [4, "show-stepper-buttons"],
+        "step": [8],
         "isInvalid": [32],
         "isValid": [32],
         "isInfo": [32],

package/components/ix-number-input.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ix-number-input.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/input/number-input.scss?tag=ix-number-input&encapsulation=shadow","src/components/input/number-input.tsx"],"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 /\n@import './input.mixins.scss';\n\n@include input-field;\n\n:host {\n .input-wrapper.show-stepper-buttons {\n input[type='number'] {\n min-width: 6rem;\n }\n }\n\n .number-stepper-container {\n display: flex;\n position: relative;\n flex-direction: row;\n flex-wrap: nowrap;\n margin-right: 0.25rem;\n\n &.container-hidden {\n display: none;\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 { iconMinus, iconPlus } from '@siemens/ix-icons/icons';\nimport {\n AttachInternals,\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n State,\n} from '@stencil/core';\nimport {\n HookValidationLifecycle,\n IxInputFieldComponent,\n ValidationResults,\n} from '../utils/input';\nimport { makeRef } from '../utils/make-ref';\nimport { InputElement, SlotEnd, SlotStart } from './input.fc';\nimport {\n addDisposableChangesAndVisibilityObservers,\n adjustPaddingForStartAndEnd,\n checkAllowedKeys,\n checkInternalValidity,\n DisposableChangesAndVisibilityObservers,\n mapValidationResult,\n onInputBlur,\n} from './input.util';\n\nlet numberInputIds = 0;\n\n/\n @since 2.6.0\n * @form-ready 2.6.0\n * @slot start - Element will be displayed at the start of the input\n * @slot end - Element will be displayed at the end of the input\n /\n@Component({\n tag: 'ix-number-input',\n styleUrl: 'number-input.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class NumberInput implements IxInputFieldComponent<number> {\n @Element() hostElement!: HTMLIxNumberInputElement;\n @AttachInternals() formInternals!: ElementInternals;\n\n /\n name of the input element\n /\n @Prop({ reflect: true }) name?: string;\n\n /\n placeholder of the input element\n /\n @Prop({ reflect: true }) placeholder?: string;\n\n /\n The value of the input field\n /\n @Prop({ reflect: true, mutable: true }) value: number = 0;\n\n /\n Indicates if the field is required\n /\n @Prop({ reflect: true }) required: boolean = false;\n\n /\n Disables the input field\n /\n @Prop() disabled: boolean = false;\n\n /\n Indicates if the field is read-only\n /\n @Prop() readonly: boolean = false;\n\n /\n The helper text for the input field\n /\n @Prop() helperText?: string;\n\n /\n The info text for the input field\n /\n @Prop() infoText?: string;\n\n /\n Indicates if the text should be shown as a tooltip\n /\n @Prop() showTextAsTooltip?: boolean;\n\n /\n The valid text for the input field\n /\n @Prop() validText?: string;\n\n /\n The warning text for the input field\n /\n @Prop() warningText?: string;\n\n /\n The label for the input field\n /\n @Prop({ reflect: true }) label?: string;\n\n /\n The error text for the input field\n /\n @Prop() invalidText?: string;\n\n /\n The pattern for the input field\n /\n @Prop() pattern?: string;\n\n /\n The minimum value for the input field\n /\n @Prop() min?: string \| number;\n\n /\n The maximum value for the input field\n /\n @Prop() max?: string \| number;\n\n /\n The allowed characters pattern for the input field\n /\n @Prop() allowedCharactersPattern?: string;\n\n /\n Indicates if the stepper buttons should be shown\n /\n @Prop() showStepperButtons?: boolean;\n\n /\n Event emitted when the value of the input field changes\n /\n @Event() valueChange!: EventEmitter<number>;\n\n /\n Event emitted when the validity state of the input field changes\n /\n @Event() validityStateChange!: EventEmitter<ValidityState>;\n\n /\n Event emitted when the input field loses focus\n /\n @Event() ixBlur!: EventEmitter<void>;\n\n @State() isInvalid = false;\n @State() isValid = false;\n @State() isInfo = false;\n @State() isWarning = false;\n @State() isInvalidByRequired = false;\n\n private readonly inputRef = makeRef<HTMLInputElement>();\n private readonly slotEndRef = makeRef<HTMLDivElement>();\n private readonly slotStartRef = makeRef<HTMLDivElement>();\n private readonly numberInputId = `number-input-${numberInputIds++}`;\n private touched = false;\n\n private disposableChangesAndVisibilityObservers?: DisposableChangesAndVisibilityObservers;\n\n @HookValidationLifecycle()\n updateClassMappings(result: ValidationResults) {\n mapValidationResult(this, result);\n }\n\n componentWillLoad() {\n this.updateFormInternalValue(this.value);\n }\n\n connectedCallback() {\n this.disposableChangesAndVisibilityObservers =\n addDisposableChangesAndVisibilityObservers(\n this.hostElement,\n this.updatePaddings.bind(this)\n );\n }\n\n disconnectedCallback() {\n this.disposableChangesAndVisibilityObservers?.();\n }\n\n private updatePaddings() {\n adjustPaddingForStartAndEnd(\n this.slotStartRef.current,\n this.slotEndRef.current,\n this.inputRef.current\n );\n }\n\n updateFormInternalValue(value: number) {\n this.formInternals.setFormValue(value.toString());\n this.value = value;\n }\n\n /* @internal /\n @Method()\n async getAssociatedFormElement(): Promise<HTMLFormElement \| null> {\n return this.formInternals.form;\n }\n\n /* @internal /\n @Method()\n hasValidValue(): Promise<boolean> {\n return Promise.resolve(!!this.value);\n }\n\n /\n Returns the native input element used under the hood\n /\n @Method()\n getNativeInputElement(): Promise<HTMLInputElement> {\n return this.inputRef.waitForCurrent();\n }\n\n /\n Focuses the input field\n /\n @Method()\n async focusInput(): Promise<void> {\n return (await this.getNativeInputElement()).focus();\n }\n\n /\n Returns true if the input field has been touched\n * @internal\n */\n @Method()\n isTouched(): Promise<boolean> {\n return Promise.resolve(this.touched);\n }\n\n render() {\n const showStepperButtons =\n this.showStepperButtons && (this.disabled \|\| this.readonly) === false;\n\n return (\n <Host\n class={{\n disabled: this.disabled,\n readonly: this.readonly,\n }}\n >\n <ix-field-wrapper\n id={this.numberInputId}\n required={this.required}\n label={this.label}\n helperText={this.helperText}\n invalidText={this.invalidText}\n infoText={this.infoText}\n warningText={this.warningText}\n validText={this.validText}\n showTextAsTooltip={this.showTextAsTooltip}\n isInvalid={this.isInvalid}\n isValid={this.isValid}\n isInfo={this.isInfo}\n isWarning={this.isWarning}\n controlRef={this.inputRef}\n >\n <div\n class={{\n 'input-wrapper': true,\n 'show-stepper-buttons': !!this.showStepperButtons,\n }}\n >\n <SlotStart\n slotStartRef={this.slotStartRef}\n onSlotChange={() => this.updatePaddings()}\n ></SlotStart>\n\n <InputElement\n id={this.numberInputId}\n readonly={this.readonly}\n disabled={this.disabled}\n min={this.min}\n max={this.max}\n pattern={this.pattern}\n type={'number'}\n isInvalid={this.isInvalid}\n required={this.required}\n value={this.value}\n placeholder={this.placeholder}\n inputRef={this.inputRef}\n onKeyPress={(event) => checkAllowedKeys(this, event)}\n valueChange={(value) => this.valueChange.emit(Number(value))}\n updateFormInternalValue={(value) =>\n this.updateFormInternalValue(Number(value))\n }\n onBlur={() => {\n onInputBlur(this, this.inputRef.current);\n this.touched = true;\n }}\n ></InputElement>\n <SlotEnd\n slotEndRef={this.slotEndRef}\n onSlotChange={() => this.updatePaddings()}\n >\n <div\n class={{\n 'number-stepper-container': true,\n 'container-hidden': !showStepperButtons,\n }}\n >\n <ix-icon-button\n ghost\n icon={iconMinus}\n size=\"16\"\n class=\"number-stepper-button step-minus\"\n onClick={() => {\n if (!this.inputRef.current) {\n return;\n }\n this.inputRef.current.stepDown();\n checkInternalValidity(this, this.inputRef.current);\n this.updateFormInternalValue(\n Number(this.inputRef.current.value)\n );\n this.valueChange.emit(this.value);\n }}\n ></ix-icon-button>\n <ix-icon-button\n ghost\n icon={iconPlus}\n size=\"16\"\n class=\"number-stepper-button step-plus\"\n onClick={() => {\n if (!this.inputRef.current) {\n return;\n }\n this.inputRef.current.stepUp();\n checkInternalValidity(this, this.inputRef.current);\n this.updateFormInternalValue(\n Number(this.inputRef.current.value)\n );\n this.valueChange.emit(this.value);\n }}\n ></ix-icon-button>\n </div>\n </SlotEnd>\n </div>\n </ix-field-wrapper>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ix-number-input.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/input/number-input.scss?tag=ix-number-input&encapsulation=shadow","src/components/input/number-input.tsx"],"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 /\n@import './input.mixins.scss';\n\n@include input-field;\n\n:host {\n .input-wrapper.show-stepper-buttons {\n input[type='number'] {\n min-width: 6rem;\n }\n }\n\n .number-stepper-container {\n display: flex;\n position: relative;\n flex-direction: row;\n flex-wrap: nowrap;\n margin-right: 0.25rem;\n\n &.container-hidden {\n display: none;\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 { iconMinus, iconPlus } from '@siemens/ix-icons/icons';\nimport {\n AttachInternals,\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n State,\n} from '@stencil/core';\nimport {\n HookValidationLifecycle,\n IxInputFieldComponent,\n ValidationResults,\n} from '../utils/input';\nimport { makeRef } from '../utils/make-ref';\nimport { InputElement, SlotEnd, SlotStart } from './input.fc';\nimport {\n addDisposableChangesAndVisibilityObservers,\n adjustPaddingForStartAndEnd,\n checkAllowedKeys,\n checkInternalValidity,\n DisposableChangesAndVisibilityObservers,\n mapValidationResult,\n onInputBlur,\n} from './input.util';\n\nlet numberInputIds = 0;\n\n/\n @form-ready\n * @slot start - Element will be displayed at the start of the input\n * @slot end - Element will be displayed at the end of the input\n /\n@Component({\n tag: 'ix-number-input',\n styleUrl: 'number-input.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class NumberInput implements IxInputFieldComponent<number> {\n @Element() hostElement!: HTMLIxNumberInputElement;\n @AttachInternals() formInternals!: ElementInternals;\n\n /\n name of the input element\n /\n @Prop({ reflect: true }) name?: string;\n\n /\n placeholder of the input element\n /\n @Prop({ reflect: true }) placeholder?: string;\n\n /\n The value of the input field\n /\n @Prop({ reflect: true, mutable: true }) value: number = 0;\n\n /\n Indicates if the field is required\n /\n @Prop({ reflect: true }) required: boolean = false;\n\n /\n Disables the input field\n /\n @Prop() disabled: boolean = false;\n\n /\n Indicates if the field is read-only\n /\n @Prop() readonly: boolean = false;\n\n /\n The helper text for the input field\n /\n @Prop() helperText?: string;\n\n /\n The info text for the input field\n /\n @Prop() infoText?: string;\n\n /\n Indicates if the text should be shown as a tooltip\n /\n @Prop() showTextAsTooltip?: boolean;\n\n /\n The valid text for the input field\n /\n @Prop() validText?: string;\n\n /\n The warning text for the input field\n /\n @Prop() warningText?: string;\n\n /\n The label for the input field\n /\n @Prop({ reflect: true }) label?: string;\n\n /\n The error text for the input field\n /\n @Prop() invalidText?: string;\n\n /\n The pattern for the input field\n /\n @Prop() pattern?: string;\n\n /\n The minimum value for the input field\n /\n @Prop() min?: string \| number;\n\n /\n The maximum value for the input field\n /\n @Prop() max?: string \| number;\n\n /\n The allowed characters pattern for the input field\n /\n @Prop() allowedCharactersPattern?: string;\n\n /\n Indicates if the stepper buttons should be shown\n /\n @Prop() showStepperButtons?: boolean;\n\n /\n Step value to increment or decrement the input value\n \n @since 3.0.0\n /\n @Prop() step?: string \| number;\n\n /\n Event emitted when the value of the input field changes\n /\n @Event() valueChange!: EventEmitter<number>;\n\n /\n Event emitted when the validity state of the input field changes\n /\n @Event() validityStateChange!: EventEmitter<ValidityState>;\n\n /\n Event emitted when the input field loses focus\n /\n @Event() ixBlur!: EventEmitter<void>;\n\n @State() isInvalid = false;\n @State() isValid = false;\n @State() isInfo = false;\n @State() isWarning = false;\n @State() isInvalidByRequired = false;\n\n private readonly inputRef = makeRef<HTMLInputElement>();\n private readonly slotEndRef = makeRef<HTMLDivElement>();\n private readonly slotStartRef = makeRef<HTMLDivElement>();\n private readonly numberInputId = `number-input-${numberInputIds++}`;\n private touched = false;\n\n private disposableChangesAndVisibilityObservers?: DisposableChangesAndVisibilityObservers;\n\n @HookValidationLifecycle()\n updateClassMappings(result: ValidationResults) {\n mapValidationResult(this, result);\n }\n\n componentWillLoad() {\n this.updateFormInternalValue(this.value);\n }\n\n connectedCallback() {\n this.disposableChangesAndVisibilityObservers =\n addDisposableChangesAndVisibilityObservers(\n this.hostElement,\n this.updatePaddings.bind(this)\n );\n }\n\n disconnectedCallback() {\n this.disposableChangesAndVisibilityObservers?.();\n }\n\n private updatePaddings() {\n adjustPaddingForStartAndEnd(\n this.slotStartRef.current,\n this.slotEndRef.current,\n this.inputRef.current\n );\n }\n\n updateFormInternalValue(value: number) {\n this.formInternals.setFormValue(value.toString());\n this.value = value;\n }\n\n /* @internal /\n @Method()\n async getAssociatedFormElement(): Promise<HTMLFormElement \| null> {\n return this.formInternals.form;\n }\n\n /* @internal /\n @Method()\n async hasValidValue(): Promise<boolean> {\n const nativeInput = await this.getNativeInputElement();\n if (nativeInput.value === '') {\n return Promise.resolve(false);\n }\n\n return Promise.resolve(\n this.value !== null && this.value !== undefined && !isNaN(this.value)\n );\n }\n\n /\n Returns the native input element used under the hood\n /\n @Method()\n getNativeInputElement(): Promise<HTMLInputElement> {\n return this.inputRef.waitForCurrent();\n }\n\n /\n Focuses the input field\n /\n @Method()\n async focusInput(): Promise<void> {\n return (await this.getNativeInputElement()).focus();\n }\n\n /\n Returns true if the input field has been touched\n * @internal\n */\n @Method()\n isTouched(): Promise<boolean> {\n return Promise.resolve(this.touched);\n }\n\n render() {\n const showStepperButtons =\n this.showStepperButtons && (this.disabled \|\| this.readonly) === false;\n\n return (\n <Host\n class={{\n disabled: this.disabled,\n readonly: this.readonly,\n }}\n >\n <ix-field-wrapper\n id={this.numberInputId}\n required={this.required}\n label={this.label}\n helperText={this.helperText}\n invalidText={this.invalidText}\n infoText={this.infoText}\n warningText={this.warningText}\n validText={this.validText}\n showTextAsTooltip={this.showTextAsTooltip}\n isInvalid={this.isInvalid}\n isValid={this.isValid}\n isInfo={this.isInfo}\n isWarning={this.isWarning}\n controlRef={this.inputRef}\n >\n <div\n class={{\n 'input-wrapper': true,\n 'show-stepper-buttons': !!this.showStepperButtons,\n }}\n >\n <SlotStart\n slotStartRef={this.slotStartRef}\n onSlotChange={() => this.updatePaddings()}\n ></SlotStart>\n\n <InputElement\n id={this.numberInputId}\n readonly={this.readonly}\n disabled={this.disabled}\n step={this.step}\n min={this.min}\n max={this.max}\n pattern={this.pattern}\n type={'number'}\n isInvalid={this.isInvalid}\n required={this.required}\n value={this.value}\n placeholder={this.placeholder}\n inputRef={this.inputRef}\n onKeyPress={(event) => checkAllowedKeys(this, event)}\n valueChange={(value) => this.valueChange.emit(Number(value))}\n updateFormInternalValue={(value) =>\n this.updateFormInternalValue(Number(value))\n }\n onBlur={() => {\n onInputBlur(this, this.inputRef.current);\n this.touched = true;\n }}\n ></InputElement>\n <SlotEnd\n slotEndRef={this.slotEndRef}\n onSlotChange={() => this.updatePaddings()}\n >\n <div\n class={{\n 'number-stepper-container': true,\n 'container-hidden': !showStepperButtons,\n }}\n >\n <ix-icon-button\n ghost\n icon={iconMinus}\n size=\"16\"\n class=\"number-stepper-button step-minus\"\n aria-label=\"decrement number\"\n onClick={() => {\n if (!this.inputRef.current) {\n return;\n }\n this.inputRef.current.stepDown();\n checkInternalValidity(this, this.inputRef.current);\n this.updateFormInternalValue(\n Number(this.inputRef.current.value)\n );\n this.valueChange.emit(this.value);\n }}\n ></ix-icon-button>\n <ix-icon-button\n ghost\n icon={iconPlus}\n size=\"16\"\n class=\"number-stepper-button step-plus\"\n aria-label=\"increment number\"\n onClick={() => {\n if (!this.inputRef.current) {\n return;\n }\n this.inputRef.current.stepUp();\n checkInternalValidity(this, this.inputRef.current);\n this.updateFormInternalValue(\n Number(this.inputRef.current.value)\n );\n this.valueChange.emit(this.value);\n }}\n ></ix-icon-button>\n </div>\n </SlotEnd>\n </div>\n </ix-field-wrapper>\n </Host>\n );\n }\n}\n"],"version":3}

package/components/ix-pagination.js CHANGED Viewed

@@ -2,17 +2,17 @@ import { p as proxyCustomElement, H, e as createEvent, h, d as Host } from './p-
 import { B as BaseButton } from './p-CEyDHqBY.js';
 import { a as a11yBoolean } from './p-Bb7pDeaQ.js';
 import { b as iconChevronRightSmall, l as iconChevronLeftSmall } from './p-Dn_WjwtW.js';
-import { d as defineCustomElement$c } from './p-Dy35mbzK.js';
+import { d as defineCustomElement$c } from './p-uhiF1LKf.js';
 import { d as defineCustomElement$b } from './p-BtKUjD8M.js';
-import { d as defineCustomElement$a } from './p-BuK5WByk.js';
-import { d as defineCustomElement$9 } from './p-B-zHEqXz.js';
-import { d as defineCustomElement$8 } from './p-DIzxAERt.js';
-import { d as defineCustomElement$7 } from './p-D_wwWxx8.js';
-import { d as defineCustomElement$6 } from './p-BwyqOnwc.js';
+import { d as defineCustomElement$a } from './p-B9XDeCpV.js';
+import { d as defineCustomElement$9 } from './p-Cyxle5Ec.js';
+import { d as defineCustomElement$8 } from './p-Bcmjgmqd.js';
+import { d as defineCustomElement$7 } from './p-d7CnwTHv.js';
+import { d as defineCustomElement$6 } from './p-CxztL6IE.js';
 import { d as defineCustomElement$5 } from './p-uv1SlmiP.js';
 import { d as defineCustomElement$4 } from './p-Dlmgmbod.js';
-import { d as defineCustomElement$3 } from './p-CB1ADCkU.js';
-import { d as defineCustomElement$2 } from './p-Dfzl82x1.js';
+import { d as defineCustomElement$3 } from './p-B_C2-EkQ.js';
+import { d as defineCustomElement$2 } from './p-B19EzNYi.js';
 const paginationCss = ".ix-form-control,.ix-form-control-plaintext{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text);color:var(--theme-input--color);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--theme-input--border-radius);height:2rem;min-height:2rem;min-width:2rem;background-color:var(--theme-input--background);border:solid 1px var(--theme-input--border-color);box-shadow:var(--theme-input--box-shadow);padding-inline-start:0.5rem;padding-inline-end:0.5rem}.ix-form-control::-moz-placeholder,.ix-form-control-plaintext::-moz-placeholder{color:var(--theme-input-hint--color)}.ix-form-control::placeholder,.ix-form-control-plaintext::placeholder{color:var(--theme-input-hint--color)}.ix-form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled),.ix-form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled){cursor:pointer}.ix-form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled),.ix-form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled){cursor:pointer}.ix-form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover,.ix-form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover{background-color:var(--theme-input--background--hover);border-color:var(--theme-input--border-color--hover);cursor:auto}.ix-form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover,.ix-form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover{background-color:var(--theme-input--background--hover);border-color:var(--theme-input--border-color--hover);cursor:auto}.ix-form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible,.ix-form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible{background-color:var(--theme-input--background--focus);border-color:var(--theme-input--border-color--focus);outline-offset:var(--theme-input--focus--outline-offset);box-shadow:var(--theme-input--box-shadow);outline:1px solid var(--theme-color-focus-bdr)}.ix-form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible,.ix-form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible{background-color:var(--theme-input--background--focus);border-color:var(--theme-input--border-color--focus);outline-offset:var(--theme-input--focus--outline-offset);box-shadow:var(--theme-input--box-shadow);outline:1px solid var(--theme-color-focus-bdr)}.ix-form-control:focus-visible{color:var(--theme-input--color)}.ix-form-control[type=number]{text-align:right}.ix-form-control[type=number]::-webkit-inner-spin-button{margin-right:-2px;margin-left:2px;display:none}.ix-form-control.readonly,.ix-form-control[readonly]{background:transparent !important;border-block-start:none !important;border-inline-start:none !important;border-inline-end:none !important;border-radius:0rem}.ix-form-control:-moz-read-only{box-shadow:none !important;outline:none !important;border-color:var(--theme-input--border-color);cursor:default !important}.ix-form-control:read-only,.ix-form-control[readonly],.ix-form-control[readOnly],.ix-form-control.readonly{box-shadow:none !important;outline:none !important;border-color:var(--theme-input--border-color);cursor:default !important}.ix-form-control:read-only::-moz-placeholder,.ix-form-control[readonly]::-moz-placeholder,.ix-form-control[readOnly]::-moz-placeholder,.ix-form-control.readonly::-moz-placeholder{color:transparent}.ix-form-control:-moz-read-only::placeholder{color:transparent}.ix-form-control:read-only::placeholder,.ix-form-control[readonly]::placeholder,.ix-form-control[readOnly]::placeholder,.ix-form-control.readonly::placeholder{color:transparent}.ix-form-control:disabled,.ix-form-control.disabled{background:transparent !important;border-block-start:none !important;border-inline-start:none !important;border-inline-end:none !important;border-radius:0rem;color:var(--theme-color-weak-text);border-color:var(--theme-input--border-color-bottom--disabled)}.ix-form-control:disabled::-moz-placeholder,.ix-form-control.disabled::-moz-placeholder{color:transparent}.ix-form-control:disabled::placeholder,.ix-form-control.disabled::placeholder{color:transparent}.ix-form-control-plaintext{outline:0}.form-group{position:relative}.input-wrapper{display:flex;position:relative;align-items:center;flex-wrap:nowrap}.input-wrapper>.glyph{display:block;position:absolute;margin-inline-start:0.312rem;color:var(--theme-color-std-text)}.input-wrapper>input{padding-inline-start:2.2rem}select.ix-form-control{padding:0 0.312rem}textarea.ix-form-control{padding:0.375rem 0.5rem}input.ix-form-control.disabled,input.ix-form-control:disabled{color:var(--theme-input--color--disabled)}input.ix-form-control:-moz-read-only{cursor:default}input.ix-form-control:read-only,input.ix-form-control.readonly{cursor:default}:host{display:inline-block;height:2rem;vertical-align:middle;cursor:pointer;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.429em;color:var(--theme-color-std-text)}: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 button{all:unset;box-sizing:border-box;display:inline-flex;flex-direction:row;flex-wrap:nowrap;overflow:hidden;align-items:center;justify-content:center;width:100%;height:100%;padding:0 0.5rem}:host ix-spinner{margin-right:0.25rem}:host ix-icon{margin-right:0.25rem}:host .content{display:inline-block;position:relative;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .content-start{width:100%}:host .icon{pointer-events:none}:host(.disabled){cursor:default}*,*::after,*::before{box-sizing:border-box}::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){*{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}::-webkit-scrollbar{width:0.5rem;height:0.5rem}::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}::-webkit-scrollbar-corner{display:none}:host .btn-danger{border-radius:var(--theme-btn--border-radius)}:host .btn-danger,:host .btn-danger.focus,:host .btn-danger:focus-visible{background-color:var(--theme-btn-danger--background);color:var(--theme-btn-danger--color);--ix-button-color:var(--theme-btn-danger--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-danger--border-color);border-style:solid}:host .btn-danger:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-danger.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-danger.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-danger.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-danger.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-danger.selected:not(.disabled):not(:disabled):active,:host .btn-danger.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-danger:not(.disabled):not(:disabled){cursor:pointer}:host .btn-danger:not(.disabled):not(:disabled):hover{border-color:var(--theme-btn-danger--border-color--hover);background-color:var(--theme-btn-danger--background--hover);color:var(--theme-btn-danger--color--hover)}:host .btn-danger:not(.disabled):not(:disabled){cursor:pointer}:host .btn-danger:not(.disabled):not(:disabled):active,:host .btn-danger:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-danger--border-color--active);background-color:var(--theme-btn-danger--background--active);color:var(--theme-btn-danger--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-danger.disabled,:host(.disabled) .btn-danger:disabled{pointer-events:none;border-color:var(--theme-btn-danger--border-color--disabled);background-color:var(--theme-btn-danger--background--disabled);color:var(--theme-btn-danger--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-danger--color--disabled)}:host .btn-outline-danger{border-radius:var(--theme-btn--border-radius)}:host .btn-outline-danger,:host .btn-outline-danger.focus,:host .btn-outline-danger:focus-visible{background-color:var(--theme-btn-outline-danger--background);color:var(--theme-btn-outline-danger--color);--ix-button-color:var(--theme-btn-outline-danger--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-outline-danger--border-color);border-style:solid}:host .btn-outline-danger:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-outline-danger.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-outline-danger.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-danger.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-outline-danger.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-danger.selected:not(.disabled):not(:disabled):active,:host .btn-outline-danger.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-outline-danger:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-danger:not(.disabled):not(:disabled):hover{border-color:var(--theme-btn-outline-danger--border-color--hover);background-color:var(--theme-btn-outline-danger--background--hover);color:var(--theme-btn-outline-danger--color--hover)}:host .btn-outline-danger:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-danger:not(.disabled):not(:disabled):active,:host .btn-outline-danger:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-outline-danger--border-color--active);background-color:var(--theme-btn-outline-danger--background--active);color:var(--theme-btn-outline-danger--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-outline-danger.disabled,:host(.disabled) .btn-outline-danger:disabled{pointer-events:none;border-color:var(--theme-btn-outline-danger--border-color--disabled);background-color:var(--theme-btn-outline-danger--background--disabled);color:var(--theme-btn-outline-danger--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-outline-danger--color--disabled)}:host .btn-invisible-danger{border-radius:var(--theme-btn--border-radius)}:host .btn-invisible-danger,:host .btn-invisible-danger.focus,:host .btn-invisible-danger:focus-visible{background-color:var(--theme-btn-invisible-danger--background);color:var(--theme-btn-invisible-danger--color);--ix-button-color:var(--theme-btn-invisible-danger--color);border-color:transparent}:host .btn-invisible-danger:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-invisible-danger.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-invisible-danger.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-danger.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-invisible-danger.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-danger.selected:not(.disabled):not(:disabled):active,:host .btn-invisible-danger.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-invisible-danger:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-danger:not(.disabled):not(:disabled):hover{background-color:var(--theme-btn-invisible-danger--background--hover);color:var(--theme-btn-invisible-danger--color--hover)}:host .btn-invisible-danger:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-danger:not(.disabled):not(:disabled):active,:host .btn-invisible-danger:not(.disabled):not(:disabled).active{background-color:var(--theme-btn-invisible-danger--background--active);color:var(--theme-btn-invisible-danger--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-invisible-danger.disabled,:host(.disabled) .btn-invisible-danger:disabled{pointer-events:none;background-color:var(--theme-btn-invisible-danger--background--disabled);color:var(--theme-btn-invisible-danger--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-invisible-danger--color--disabled)}:host .btn-primary{border-radius:var(--theme-btn--border-radius)}:host .btn-primary,:host .btn-primary.focus,:host .btn-primary:focus-visible{background-color:var(--theme-btn-primary--background);color:var(--theme-btn-primary--color);--ix-button-color:var(--theme-btn-primary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-primary--border-color);border-style:solid}:host .btn-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-primary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-primary.selected:not(.disabled):not(:disabled):active,:host .btn-primary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-primary:not(.disabled):not(:disabled):hover{border-color:var(--theme-btn-primary--border-color--hover);background-color:var(--theme-btn-primary--background--hover);color:var(--theme-btn-primary--color--hover)}:host .btn-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-primary:not(.disabled):not(:disabled):active,:host .btn-primary:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-primary--border-color--active);background-color:var(--theme-btn-primary--background--active);color:var(--theme-btn-primary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-primary.disabled,:host(.disabled) .btn-primary:disabled{pointer-events:none;border-color:var(--theme-btn-primary--border-color--disabled);background-color:var(--theme-btn-primary--background--disabled);color:var(--theme-btn-primary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-primary--color--disabled)}:host .btn-outline-primary{border-radius:var(--theme-btn--border-radius)}:host .btn-outline-primary,:host .btn-outline-primary.focus,:host .btn-outline-primary:focus-visible{background-color:var(--theme-btn-outline-primary--background);color:var(--theme-btn-outline-primary--color);--ix-button-color:var(--theme-btn-outline-primary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-outline-primary--border-color);border-style:solid}:host .btn-outline-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-outline-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-outline-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-primary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-outline-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-primary.selected:not(.disabled):not(:disabled):active,:host .btn-outline-primary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-outline-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-primary:not(.disabled):not(:disabled):hover{border-color:var(--theme-btn-outline-primary--border-color--hover);background-color:var(--theme-btn-outline-primary--background--hover);color:var(--theme-btn-outline-primary--color--hover)}:host .btn-outline-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-primary:not(.disabled):not(:disabled):active,:host .btn-outline-primary:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-outline-primary--border-color--active);background-color:var(--theme-btn-outline-primary--background--active);color:var(--theme-btn-outline-primary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-outline-primary.disabled,:host(.disabled) .btn-outline-primary:disabled{pointer-events:none;border-color:var(--theme-btn-outline-primary--border-color--disabled);background-color:var(--theme-btn-outline-primary--background--disabled);color:var(--theme-btn-outline-primary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-outline-primary--color--disabled)}:host .btn-invisible-primary{border-radius:var(--theme-btn--border-radius)}:host .btn-invisible-primary,:host .btn-invisible-primary.focus,:host .btn-invisible-primary:focus-visible{background-color:var(--theme-btn-invisible-primary--background);color:var(--theme-btn-invisible-primary--color);--ix-button-color:var(--theme-btn-invisible-primary--color);border-color:transparent}:host .btn-invisible-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-invisible-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-invisible-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-primary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-invisible-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-primary.selected:not(.disabled):not(:disabled):active,:host .btn-invisible-primary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-invisible-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-primary:not(.disabled):not(:disabled):hover{background-color:var(--theme-btn-invisible-primary--background--hover);color:var(--theme-btn-invisible-primary--color--hover)}:host .btn-invisible-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-primary:not(.disabled):not(:disabled):active,:host .btn-invisible-primary:not(.disabled):not(:disabled).active{background-color:var(--theme-btn-invisible-primary--background--active);color:var(--theme-btn-invisible-primary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-invisible-primary.disabled,:host(.disabled) .btn-invisible-primary:disabled{pointer-events:none;background-color:var(--theme-btn-invisible-primary--background--disabled);color:var(--theme-btn-invisible-primary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-invisible-primary--color--disabled)}:host .btn-secondary{border-radius:var(--theme-btn--border-radius)}:host .btn-secondary,:host .btn-secondary.focus,:host .btn-secondary:focus-visible{background-color:var(--theme-btn-secondary--background);color:var(--theme-btn-secondary--color);--ix-button-color:var(--theme-btn-secondary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-secondary--border-color);border-style:solid}:host .btn-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-secondary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-secondary.selected:not(.disabled):not(:disabled):active,:host .btn-secondary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-secondary:not(.disabled):not(:disabled):hover{border-color:var(--theme-btn-secondary--border-color--hover);background-color:var(--theme-btn-secondary--background--hover);color:var(--theme-btn-secondary--color--hover)}:host .btn-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-secondary:not(.disabled):not(:disabled):active,:host .btn-secondary:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-secondary--border-color--active);background-color:var(--theme-btn-secondary--background--active);color:var(--theme-btn-secondary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-secondary.disabled,:host(.disabled) .btn-secondary:disabled{pointer-events:none;border-color:var(--theme-btn-secondary--border-color--disabled);background-color:var(--theme-btn-secondary--background--disabled);color:var(--theme-btn-secondary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-secondary--color--disabled)}:host .btn-outline-secondary{border-radius:var(--theme-btn--border-radius)}:host .btn-outline-secondary,:host .btn-outline-secondary.focus,:host .btn-outline-secondary:focus-visible{background-color:var(--theme-btn-outline-secondary--background);color:var(--theme-btn-outline-secondary--color);--ix-button-color:var(--theme-btn-outline-secondary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-outline-secondary--border-color);border-style:solid}:host .btn-outline-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-outline-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-outline-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-secondary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-outline-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-secondary.selected:not(.disabled):not(:disabled):active,:host .btn-outline-secondary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-outline-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-secondary:not(.disabled):not(:disabled):hover{border-color:var(--theme-btn-outline-secondary--border-color--hover);background-color:var(--theme-btn-outline-secondary--background--hover);color:var(--theme-btn-outline-secondary--color--hover)}:host .btn-outline-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-secondary:not(.disabled):not(:disabled):active,:host .btn-outline-secondary:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-outline-secondary--border-color--active);background-color:var(--theme-btn-outline-secondary--background--active);color:var(--theme-btn-outline-secondary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-outline-secondary.disabled,:host(.disabled) .btn-outline-secondary:disabled{pointer-events:none;border-color:var(--theme-btn-outline-secondary--border-color--disabled);background-color:var(--theme-btn-outline-secondary--background--disabled);color:var(--theme-btn-outline-secondary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-outline-secondary--color--disabled)}:host .btn-invisible-secondary{border-radius:var(--theme-btn--border-radius)}:host .btn-invisible-secondary,:host .btn-invisible-secondary.focus,:host .btn-invisible-secondary:focus-visible{background-color:var(--theme-btn-invisible-secondary--background);color:var(--theme-btn-invisible-secondary--color);--ix-button-color:var(--theme-btn-invisible-secondary--color);border-color:transparent}:host .btn-invisible-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-invisible-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled):active,:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-invisible-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-secondary:not(.disabled):not(:disabled):hover{background-color:var(--theme-btn-invisible-secondary--background--hover);color:var(--theme-btn-invisible-secondary--color--hover)}:host .btn-invisible-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-secondary:not(.disabled):not(:disabled):active,:host .btn-invisible-secondary:not(.disabled):not(:disabled).active{background-color:var(--theme-btn-invisible-secondary--background--active);color:var(--theme-btn-invisible-secondary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-invisible-secondary.disabled,:host(.disabled) .btn-invisible-secondary:disabled{pointer-events:none;background-color:var(--theme-btn-invisible-secondary--background--disabled);color:var(--theme-btn-invisible-secondary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-invisible-secondary--color--disabled)}:host{display:inline-flex;justify-content:center;align-items:center}:host button{width:100%;height:100%;overflow:hidden;padding:0}:host button.btn-oval{border-radius:6.25rem}:host ix-icon{color:var(--ix-icon-button-color, currentColor);margin:0}:host ix-spinner{margin:0}:host(.btn-icon-12){height:1rem;width:1rem;min-width:1rem;min-height:1rem}:host(.btn-icon-16){height:1.5rem;width:1.5rem;min-width:1.5rem;min-height:1.5rem}:host(.btn-icon-32){height:2rem;width:2rem;min-width:2rem;min-height:2rem}:host{}: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,:host .advanced-pagination,:host .item-count{display:inline-flex;align-items:center}:host .basic-pagination{padding:0 0.125rem}:host .advanced-pagination{padding:0 0.75rem}:host .page-selection{width:4.125rem;text-align:center;margin:0 0.5rem;-moz-appearance:textfield;-webkit-appearance:textfield}:host .page-buttons{white-space:nowrap}:host .total-count{white-space:nowrap}:host .item-count{flex-grow:1;justify-content:flex-end;margin-inline-start:1.5rem}:host .item-count ix-select{width:4.5rem;margin-inline-start:1.5rem}:host button{width:auto;min-width:2rem;height:2rem;padding:0 0.5rem}:host button+button{margin-inline-start:0.125rem}";
@@ -160,13 +160,13 @@ const Pagination = /*@__PURE__*/ proxyCustomElement(class Pagination extends H {
         return h("span", { class: "page-buttons" }, pageButtons);
     }
     render() {
-        return (h(Host, { key: '496bf848a39c020780a071e470b4f4bed1798282' }, h("ix-icon-button", { key: '31c7be256d5f08d99053330c2cdab6448877f84c', disabled: !this.count || this.selectedPage === 0, ghost: true, icon: iconChevronLeftSmall, onClick: () => this.decrease() }), this.advanced ? (h("div", { class: "advanced-pagination" }, h("ix-typography", { format: "body" }, this.i18nPage), h("input", { class: "ix-form-control page-selection", type: "number", min: "1", max: this.count, value: this.selectedPage + 1, onChange: (event) => {
+        return (h(Host, { key: 'ab4b74aee5de4a24fe29c8f2d1794e8aba8296e3' }, h("ix-icon-button", { key: '63ffdbc380a049faa31a03b1219fc3a08886daeb', disabled: !this.count || this.selectedPage === 0, ghost: true, icon: iconChevronLeftSmall, onClick: () => this.decrease() }), this.advanced ? (h("div", { class: "advanced-pagination" }, h("ix-typography", { format: "body" }, this.i18nPage), h("input", { class: "ix-form-control page-selection", type: "number", min: "1", max: this.count, value: this.selectedPage + 1, onChange: (event) => {
                 const eventTarget = event.target;
                 if (eventTarget) {
                     const index = Number.parseInt(eventTarget.value);
                     this.selectPage(index - 1);
                 }
-            } }), h("span", { class: "total-count" }, h("ix-typography", { format: "body" }, this.i18nOf, " ", this.count)))) : (h("span", { class: "basic-pagination" }, this.renderPageButtons(), " ")), h("ix-icon-button", { key: '5c276d3ad4933665283d2f3c941daccb9b91cafb', disabled: !this.count || this.selectedPage === this.count - 1, ghost: true, icon: iconChevronRightSmall, onClick: () => this.increase() }), this.advanced && this.showItemCount ? (h("span", { class: "item-count" }, h("ix-typography", { format: "body" }, this.i18nItems), h("ix-select", { hideListHeader: true, i18nPlaceholder: "", i18nSelectListHeader: "", value: `${this.itemCount}`, onValueChange: (e) => {
+            } }), h("span", { class: "total-count" }, h("ix-typography", { format: "body" }, this.i18nOf, " ", this.count)))) : (h("span", { class: "basic-pagination" }, this.renderPageButtons(), " ")), h("ix-icon-button", { key: 'ded752d23bc14a681a7eb607b85f5f5779c5e08a', disabled: !this.count || this.selectedPage === this.count - 1, ghost: true, icon: iconChevronRightSmall, onClick: () => this.increase() }), this.advanced && this.showItemCount ? (h("span", { class: "item-count" }, h("ix-typography", { format: "body" }, this.i18nItems), h("ix-select", { hideListHeader: true, i18nPlaceholder: "", i18nSelectListHeader: "", value: `${this.itemCount}`, onValueChange: (e) => {
                 const count = Number.parseInt(Array.isArray(e.detail) ? e.detail[0] : e.detail);
                 this.itemCountChanged.emit(count);
             } }, h("ix-select-item", { label: "10", value: "10" }), h("ix-select-item", { label: "15", value: "15" }), h("ix-select-item", { label: "20", value: "20" }), h("ix-select-item", { label: "40", value: "40" }), h("ix-select-item", { label: "100", value: "100" })))) : ('')));

package/components/ix-pagination.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ix-pagination.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/pagination/pagination.scss?tag=ix-pagination&encapsulation=shadow","src/components/pagination/pagination.tsx"],"sourcesContent":["/\n SPDX-FileCopyrightText: 2022 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\n@import 'common-variables';\n@import 'legacy/components/forms';\n@import '../icon-button/icon-button';\n@import 'mixins/shadow-dom/component';\n\n:host {\n @include ix-component;\n\n &,\n .advanced-pagination,\n .item-count {\n display: inline-flex;\n align-items: center;\n }\n\n .basic-pagination {\n padding: 0 0.125rem;\n }\n\n .advanced-pagination {\n padding: 0 $medium-space;\n }\n\n .page-selection {\n width: 4.125rem;\n text-align: center;\n margin: 0 $small-space;\n -moz-appearance: textfield;\n -webkit-appearance: textfield;\n }\n\n .page-buttons {\n white-space: nowrap;\n }\n\n .total-count {\n white-space: nowrap;\n }\n\n .item-count {\n flex-grow: 1;\n justify-content: flex-end;\n margin-inline-start: $large-space;\n\n ix-select {\n width: 4.5rem;\n margin-inline-start: $large-space;\n }\n }\n\n button {\n width: auto;\n min-width: 2rem;\n height: 2rem;\n padding: 0 0.5rem;\n }\n\n button + button {\n margin-inline-start: 0.125rem;\n }\n}\n","/\n * SPDX-FileCopyrightText: 2022 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 h,\n Host,\n Prop,\n} from '@stencil/core';\nimport { BaseButton, BaseButtonProps } from '../button/base-button';\nimport { a11yBoolean } from '../utils/a11y';\nimport {\n iconChevronLeftSmall,\n iconChevronRightSmall,\n} from '@siemens/ix-icons/icons';\n\n/\n @since 1.5.0\n /\n@Component({\n tag: 'ix-pagination',\n styleUrl: 'pagination.scss',\n shadow: true,\n})\nexport class Pagination {\n private readonly baseButtonConfig: BaseButtonProps = {\n variant: 'secondary',\n outline: false,\n ghost: true,\n iconOnly: true,\n iconOval: false,\n disabled: false,\n icon: '',\n loading: false,\n selected: false,\n type: 'button',\n };\n\n private readonly maxCountPages = 7;\n\n @Element() hostElement!: HTMLIxPaginationElement;\n\n /\n Advanced mode\n /\n @Prop() advanced = false;\n\n /\n Number of items shown at once.\n * Can only be changed in advaced mode.\n /\n @Prop() itemCount = 15;\n\n /\n Show item count in advanced mode\n /\n @Prop() showItemCount = true;\n\n /\n Total number of pages\n /\n @Prop() count: number = 0;\n\n /\n Zero based index of currently selected page\n /\n @Prop({ mutable: true }) selectedPage = 0;\n\n /\n i18n\n /\n @Prop() i18nPage = 'Page';\n\n /\n i18n\n /\n @Prop() i18nOf = 'of';\n\n /\n /\n i18n\n /\n @Prop() i18nItems = 'Items';\n\n /\n Page selection event\n /\n @Event() pageSelected!: EventEmitter<number>;\n\n /\n Item count change event\n /\n @Event() itemCountChanged!: EventEmitter<number>;\n\n private selectPage(index: number) {\n const oldIndex = this.selectedPage;\n\n if (index < 0) {\n this.selectedPage = 0;\n } else if (index > this.count - 1) {\n this.selectedPage = this.count - 1;\n } else {\n this.selectedPage = index;\n }\n\n const { defaultPrevented } = this.pageSelected.emit(this.selectedPage);\n\n if (defaultPrevented) {\n this.selectedPage = oldIndex;\n }\n }\n\n private increase() {\n if (this.selectedPage === this.count - 1) {\n return;\n }\n\n this.selectPage(this.selectedPage + 1);\n }\n\n private decrease() {\n if (this.selectedPage === 0) {\n return;\n }\n\n this.selectPage(this.selectedPage - 1);\n }\n\n private getPageButton(index: number) {\n const baseButtonProps: BaseButtonProps = {\n ...this.baseButtonConfig,\n onClick: () => this.selectPage(index),\n selected: this.selectedPage === index,\n ariaAttributes: {\n 'aria-pressed': a11yBoolean(this.selectedPage === index),\n },\n };\n\n return <BaseButton {...baseButtonProps}>{index + 1}</BaseButton>;\n }\n\n private renderPageButtons() {\n const pagesBeforeOverflow = Math.floor(this.maxCountPages / 2);\n const hasOverflow = this.count > this.maxCountPages;\n const hasOverflowStart =\n hasOverflow && this.selectedPage > pagesBeforeOverflow;\n const hasOverflowEnd =\n hasOverflow && this.selectedPage < this.count - pagesBeforeOverflow - 1;\n const pageButtons = [];\n\n let start = 0;\n let end = Math.min(this.count, this.maxCountPages);\n let pageCount = Math.floor((this.maxCountPages - 4) / 2);\n\n if (hasOverflowStart) {\n const baseButtonProps = {\n ...this.baseButtonConfig,\n onClick: () => {\n if (hasOverflowEnd) {\n this.selectPage(this.selectedPage - Math.max(0, 2 pageCount + 1));\n } else {\n this.selectPage(this.count - this.maxCountPages);\n }\n },\n };\n pageButtons.push(this.getPageButton(0));\n pageButtons.push(<BaseButton {...baseButtonProps}>...</BaseButton>);\n\n if (hasOverflowEnd) {\n start = this.count - this.maxCountPages + 2;\n } else {\n start = this.count - this.maxCountPages + 2;\n end = this.count;\n }\n }\n\n if (hasOverflowEnd) {\n if (hasOverflowStart) {\n start = this.selectedPage - pageCount;\n end = this.selectedPage + pageCount + 1;\n } else {\n end = this.maxCountPages - 2;\n }\n }\n\n for (let i = start; i < end; i++) {\n pageButtons.push(this.getPageButton(i));\n }\n\n if (hasOverflowEnd) {\n const baseButtonProps = {\n ...this.baseButtonConfig,\n onClick: () => {\n if (hasOverflowStart) {\n this.selectPage(this.selectedPage + Math.max(0, 2 * pageCount + 1));\n } else {\n this.selectPage(this.maxCountPages - 1);\n }\n },\n };\n pageButtons.push(<BaseButton {...baseButtonProps}>...</BaseButton>);\n pageButtons.push(this.getPageButton(this.count - 1));\n }\n\n return <span class=\"page-buttons\">{pageButtons}</span>;\n }\n\n render() {\n return (\n <Host>\n <ix-icon-button\n disabled={!this.count \|\| this.selectedPage === 0}\n ghost\n icon={iconChevronLeftSmall}\n onClick={() => this.decrease()}\n ></ix-icon-button>\n\n {this.advanced ? (\n <div class=\"advanced-pagination\">\n <ix-typography format=\"body\">{this.i18nPage}</ix-typography>\n <input\n class=\"ix-form-control page-selection\"\n type=\"number\"\n min=\"1\"\n max={this.count}\n value={this.selectedPage + 1}\n onChange={(event: Event) => {\n const eventTarget = event.target as HTMLInputElement;\n if (eventTarget) {\n const index = Number.parseInt(eventTarget.value);\n this.selectPage(index - 1);\n }\n }}\n />\n <span class=\"total-count\">\n <ix-typography format=\"body\">\n {this.i18nOf} {this.count}\n </ix-typography>\n </span>\n </div>\n ) : (\n <span class=\"basic-pagination\">{this.renderPageButtons()} </span>\n )}\n\n <ix-icon-button\n disabled={!this.count \|\| this.selectedPage === this.count - 1}\n ghost\n icon={iconChevronRightSmall}\n onClick={() => this.increase()}\n ></ix-icon-button>\n\n {this.advanced && this.showItemCount ? (\n <span class=\"item-count\">\n <ix-typography format=\"body\">{this.i18nItems}</ix-typography>\n <ix-select\n hideListHeader\n i18nPlaceholder=\"\"\n i18nSelectListHeader=\"\"\n value={`${this.itemCount}`}\n onValueChange={(e) => {\n const count = Number.parseInt(\n Array.isArray(e.detail) ? e.detail[0] : e.detail\n );\n\n this.itemCountChanged.emit(count);\n }}\n >\n <ix-select-item label=\"10\" value=\"10\"></ix-select-item>\n <ix-select-item label=\"15\" value=\"15\"></ix-select-item>\n <ix-select-item label=\"20\" value=\"20\"></ix-select-item>\n <ix-select-item label=\"40\" value=\"40\"></ix-select-item>\n <ix-select-item label=\"100\" value=\"100\"></ix-select-item>\n </ix-select>\n </span>\n ) : (\n ''\n )}\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ix-pagination.js","mappings":";;;;;;;;;;;;;;;;AAAA,MAAM,aAAa,GAAG,8r7BAA8r7B;;MC8Bvs7B,UAAU,iBAAAA,kBAAA,CAAA,MAAA,UAAA,SAAAC,CAAA,CAAA;AALvB,IAAA,WAAA,GAAA;;;;;;QAMmB,IAAA,CAAA,gBAAgB,GAAoB;AACnD,YAAA,OAAO,EAAE,WAAW;AACpB,YAAA,OAAO,EAAE,KAAK;AACd,YAAA,KAAK,EAAE,IAAI;AACX,YAAA,QAAQ,EAAE,IAAI;AACd,YAAA,QAAQ,EAAE,KAAK;AACf,YAAA,QAAQ,EAAE,KAAK;AACf,YAAA,IAAI,EAAE,EAAE;AACR,YAAA,OAAO,EAAE,KAAK;AACd,YAAA,QAAQ,EAAE,KAAK;AACf,YAAA,IAAI,EAAE,QAAQ;SACf;AAEgB,QAAA,IAAa,CAAA,aAAA,GAAG,CAAC;AAIlC;;AAEG;AACK,QAAA,IAAQ,CAAA,QAAA,GAAG,KAAK;AAExB;;;AAGG;AACK,QAAA,IAAS,CAAA,SAAA,GAAG,EAAE;AAEtB;;AAEG;AACK,QAAA,IAAa,CAAA,aAAA,GAAG,IAAI;AAE5B;;AAEG;AACK,QAAA,IAAK,CAAA,KAAA,GAAW,CAAC;AAEzB;;AAEG;AACsB,QAAA,IAAY,CAAA,YAAA,GAAG,CAAC;AAEzC;;AAEG;AACK,QAAA,IAAQ,CAAA,QAAA,GAAG,MAAM;AAEzB;;AAEG;AACK,QAAA,IAAM,CAAA,MAAA,GAAG,IAAI;AAErB;;;AAGG;AACK,QAAA,IAAS,CAAA,SAAA,GAAG,OAAO;AAsM5B;AA1LS,IAAA,UAAU,CAAC,KAAa,EAAA;AAC9B,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,YAAY;AAElC,QAAA,IAAI,KAAK,GAAG,CAAC,EAAE;AACb,YAAA,IAAI,CAAC,YAAY,GAAG,CAAC;;aAChB,IAAI,KAAK,GAAG,IAAI,CAAC,KAAK,GAAG,CAAC,EAAE;YACjC,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,KAAK,GAAG,CAAC;;aAC7B;AACL,YAAA,IAAI,CAAC,YAAY,GAAG,KAAK;;AAG3B,QAAA,MAAM,EAAE,gBAAgB,EAAE,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC;QAEtE,IAAI,gBAAgB,EAAE;AACpB,YAAA,IAAI,CAAC,YAAY,GAAG,QAAQ;;;IAIxB,QAAQ,GAAA;QACd,IAAI,IAAI,CAAC,YAAY,KAAK,IAAI,CAAC,KAAK,GAAG,CAAC,EAAE;YACxC;;QAGF,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC;;IAGhC,QAAQ,GAAA;AACd,QAAA,IAAI,IAAI,CAAC,YAAY,KAAK,CAAC,EAAE;YAC3B;;QAGF,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC;;AAGhC,IAAA,aAAa,CAAC,KAAa,EAAA;AACjC,QAAA,MAAM,eAAe,GAChB,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAA,IAAI,CAAC,gBAAgB,CACxB,EAAA,EAAA,OAAO,EAAE,MAAM,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,EACrC,QAAQ,EAAE,IAAI,CAAC,YAAY,KAAK,KAAK,EACrC,cAAc,EAAE;gBACd,cAAc,EAAE,WAAW,CAAC,IAAI,CAAC,YAAY,KAAK,KAAK,CAAC;AACzD,aAAA,EAAA,CACF;AAED,QAAA,OAAO,CAAA,CAAC,UAAU,EAAK,MAAA,CAAA,MAAA,CAAA,EAAA,EAAA,eAAe,GAAG,KAAK,GAAG,CAAC,CAAc;;IAG1D,iBAAiB,GAAA;AACvB,QAAA,MAAM,mBAAmB,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,aAAa,GAAG,CAAC,CAAC;QAC9D,MAAM,WAAW,GAAG,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,aAAa;QACnD,MAAM,gBAAgB,GACpB,WAAW,IAAI,IAAI,CAAC,YAAY,GAAG,mBAAmB;AACxD,QAAA,MAAM,cAAc,GAClB,WAAW,IAAI,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,KAAK,GAAG,mBAAmB,GAAG,CAAC;QACzE,MAAM,WAAW,GAAG,EAAE;QAEtB,IAAI,KAAK,GAAG,CAAC;AACb,QAAA,IAAI,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,aAAa,CAAC;AAClD,QAAA,IAAI,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,aAAa,GAAG,CAAC,IAAI,CAAC,CAAC;QAExD,IAAI,gBAAgB,EAAE;YACpB,MAAM,eAAe,mCAChB,IAAI,CAAC,gBAAgB,CACxB,EAAA,EAAA,OAAO,EAAE,MAAK;oBACZ,IAAI,cAAc,EAAE;wBAClB,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,GAAG,SAAS,GAAG,CAAC,CAAC,CAAC;;yBAC9D;wBACL,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,aAAa,CAAC;;iBAEnD,GACF;YACD,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;AACvC,YAAA,WAAW,CAAC,IAAI,CAAC,CAAA,CAAC,UAAU,EAAK,MAAA,CAAA,MAAA,CAAA,EAAA,EAAA,eAAe,CAAkB,EAAA,KAAA,CAAA,CAAC;YAEnE,IAAI,cAAc,EAAE;gBAClB,KAAK,GAAG,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,aAAa,GAAG,CAAC;;iBACtC;gBACL,KAAK,GAAG,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,aAAa,GAAG,CAAC;AAC3C,gBAAA,GAAG,GAAG,IAAI,CAAC,KAAK;;;QAIpB,IAAI,cAAc,EAAE;YAClB,IAAI,gBAAgB,EAAE;AACpB,gBAAA,KAAK,GAAG,IAAI,CAAC,YAAY,GAAG,SAAS;gBACrC,GAAG,GAAG,IAAI,CAAC,YAAY,GAAG,SAAS,GAAG,CAAC;;iBAClC;AACL,gBAAA,GAAG,GAAG,IAAI,CAAC,aAAa,GAAG,CAAC;;;AAIhC,QAAA,KAAK,IAAI,CAAC,GAAG,KAAK,EAAE,CAAC,GAAG,GAAG,EAAE,CAAC,EAAE,EAAE;YAChC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;;QAGzC,IAAI,cAAc,EAAE;YAClB,MAAM,eAAe,mCAChB,IAAI,CAAC,gBAAgB,CACxB,EAAA,EAAA,OAAO,EAAE,MAAK;oBACZ,IAAI,gBAAgB,EAAE;wBACpB,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,GAAG,SAAS,GAAG,CAAC,CAAC,CAAC;;yBAC9D;wBACL,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,aAAa,GAAG,CAAC,CAAC;;iBAE1C,GACF;AACD,YAAA,WAAW,CAAC,IAAI,CAAC,CAAA,CAAC,UAAU,EAAK,MAAA,CAAA,MAAA,CAAA,EAAA,EAAA,eAAe,CAAkB,EAAA,KAAA,CAAA,CAAC;AACnE,YAAA,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC;;AAGtD,QAAA,OAAO,YAAM,KAAK,EAAC,cAAc,EAAE,EAAA,WAAW,CAAQ;;IAGxD,MAAM,GAAA;QACJ,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,gBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,QAAQ,EAAE,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,YAAY,KAAK,CAAC,EAChD,KAAK,EACL,IAAA,EAAA,IAAI,EAAE,oBAAoB,EAC1B,OAAO,EAAE,MAAM,IAAI,CAAC,QAAQ,EAAE,EACd,CAAA,EAEjB,IAAI,CAAC,QAAQ,IACZ,CAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,qBAAqB,EAAA,EAC9B,CAAA,CAAA,eAAA,EAAA,EAAe,MAAM,EAAC,MAAM,IAAE,IAAI,CAAC,QAAQ,CAAiB,EAC5D,CAAA,CAAA,OAAA,EAAA,EACE,KAAK,EAAC,gCAAgC,EACtC,IAAI,EAAC,QAAQ,EACb,GAAG,EAAC,GAAG,EACP,GAAG,EAAE,IAAI,CAAC,KAAK,EACf,KAAK,EAAE,IAAI,CAAC,YAAY,GAAG,CAAC,EAC5B,QAAQ,EAAE,CAAC,KAAY,KAAI;AACzB,gBAAA,MAAM,WAAW,GAAG,KAAK,CAAC,MAA0B;gBACpD,IAAI,WAAW,EAAE;oBACf,MAAM,KAAK,GAAG,MAAM,CAAC,QAAQ,CAAC,WAAW,CAAC,KAAK,CAAC;AAChD,oBAAA,IAAI,CAAC,UAAU,CAAC,KAAK,GAAG,CAAC,CAAC;;AAE9B,aAAC,EACD,CAAA,EACF,CAAM,CAAA,MAAA,EAAA,EAAA,KAAK,EAAC,aAAa,EAAA,EACvB,CAAe,CAAA,eAAA,EAAA,EAAA,MAAM,EAAC,MAAM,EAAA,EACzB,IAAI,CAAC,MAAM,OAAG,IAAI,CAAC,KAAK,CACX,CACX,CACH,KAEN,CAAM,CAAA,MAAA,EAAA,EAAA,KAAK,EAAC,kBAAkB,EAAA,EAAE,IAAI,CAAC,iBAAiB,EAAE,MAAS,CAClE,EAED,CAAA,CAAA,gBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,QAAQ,EAAE,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,YAAY,KAAK,IAAI,CAAC,KAAK,GAAG,CAAC,EAC7D,KAAK,EACL,IAAA,EAAA,IAAI,EAAE,qBAAqB,EAC3B,OAAO,EAAE,MAAM,IAAI,CAAC,QAAQ,EAAE,EACd,CAAA,EAEjB,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,aAAa,IAClC,CAAM,CAAA,MAAA,EAAA,EAAA,KAAK,EAAC,YAAY,EAAA,EACtB,CAAA,CAAA,eAAA,EAAA,EAAe,MAAM,EAAC,MAAM,IAAE,IAAI,CAAC,SAAS,CAAiB,EAC7D,CACE,CAAA,WAAA,EAAA,EAAA,cAAc,QACd,eAAe,EAAC,EAAE,EAClB,oBAAoB,EAAC,EAAE,EACvB,KAAK,EAAE,CAAG,EAAA,IAAI,CAAC,SAAS,EAAE,EAC1B,aAAa,EAAE,CAAC,CAAC,KAAI;AACnB,gBAAA,MAAM,KAAK,GAAG,MAAM,CAAC,QAAQ,CAC3B,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,MAAM,CACjD;AAED,gBAAA,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,KAAK,CAAC;AACnC,aAAC,EAAA,EAED,CAAA,CAAA,gBAAA,EAAA,EAAgB,KAAK,EAAC,IAAI,EAAC,KAAK,EAAC,IAAI,EAAkB,CAAA,EACvD,CAAA,CAAA,gBAAA,EAAA,EAAgB,KAAK,EAAC,IAAI,EAAC,KAAK,EAAC,IAAI,EAAkB,CAAA,EACvD,CAAA,CAAA,gBAAA,EAAA,EAAgB,KAAK,EAAC,IAAI,EAAC,KAAK,EAAC,IAAI,EAAkB,CAAA,EACvD,CAAA,CAAA,gBAAA,EAAA,EAAgB,KAAK,EAAC,IAAI,EAAC,KAAK,EAAC,IAAI,EAAkB,CAAA,EACvD,CAAA,CAAA,gBAAA,EAAA,EAAgB,KAAK,EAAC,KAAK,EAAC,KAAK,EAAC,KAAK,EAAkB,CAAA,CAC/C,CACP,KAEP,EAAE,CACH,CACI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/pagination/pagination.scss?tag=ix-pagination&encapsulation=shadow","src/components/pagination/pagination.tsx"],"sourcesContent":["/\n SPDX-FileCopyrightText: 2022 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\n@import 'common-variables';\n@import 'legacy/components/forms';\n@import '../icon-button/icon-button';\n@import 'mixins/shadow-dom/component';\n\n:host {\n @include ix-component;\n\n &,\n .advanced-pagination,\n .item-count {\n display: inline-flex;\n align-items: center;\n }\n\n .basic-pagination {\n padding: 0 0.125rem;\n }\n\n .advanced-pagination {\n padding: 0 $medium-space;\n }\n\n .page-selection {\n width: 4.125rem;\n text-align: center;\n margin: 0 $small-space;\n -moz-appearance: textfield;\n -webkit-appearance: textfield;\n }\n\n .page-buttons {\n white-space: nowrap;\n }\n\n .total-count {\n white-space: nowrap;\n }\n\n .item-count {\n flex-grow: 1;\n justify-content: flex-end;\n margin-inline-start: $large-space;\n\n ix-select {\n width: 4.5rem;\n margin-inline-start: $large-space;\n }\n }\n\n button {\n width: auto;\n min-width: 2rem;\n height: 2rem;\n padding: 0 0.5rem;\n }\n\n button + button {\n margin-inline-start: 0.125rem;\n }\n}\n","/\n * SPDX-FileCopyrightText: 2022 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 h,\n Host,\n Prop,\n} from '@stencil/core';\nimport { BaseButton, BaseButtonProps } from '../button/base-button';\nimport { a11yBoolean } from '../utils/a11y';\nimport {\n iconChevronLeftSmall,\n iconChevronRightSmall,\n} from '@siemens/ix-icons/icons';\n\n@Component({\n tag: 'ix-pagination',\n styleUrl: 'pagination.scss',\n shadow: true,\n})\nexport class Pagination {\n private readonly baseButtonConfig: BaseButtonProps = {\n variant: 'secondary',\n outline: false,\n ghost: true,\n iconOnly: true,\n iconOval: false,\n disabled: false,\n icon: '',\n loading: false,\n selected: false,\n type: 'button',\n };\n\n private readonly maxCountPages = 7;\n\n @Element() hostElement!: HTMLIxPaginationElement;\n\n /\n Advanced mode\n /\n @Prop() advanced = false;\n\n /\n Number of items shown at once.\n * Can only be changed in advaced mode.\n /\n @Prop() itemCount = 15;\n\n /\n Show item count in advanced mode\n /\n @Prop() showItemCount = true;\n\n /\n Total number of pages\n /\n @Prop() count: number = 0;\n\n /\n Zero based index of currently selected page\n /\n @Prop({ mutable: true }) selectedPage = 0;\n\n /\n i18n\n /\n @Prop() i18nPage = 'Page';\n\n /\n i18n\n /\n @Prop() i18nOf = 'of';\n\n /\n /\n i18n\n /\n @Prop() i18nItems = 'Items';\n\n /\n Page selection event\n /\n @Event() pageSelected!: EventEmitter<number>;\n\n /\n Item count change event\n /\n @Event() itemCountChanged!: EventEmitter<number>;\n\n private selectPage(index: number) {\n const oldIndex = this.selectedPage;\n\n if (index < 0) {\n this.selectedPage = 0;\n } else if (index > this.count - 1) {\n this.selectedPage = this.count - 1;\n } else {\n this.selectedPage = index;\n }\n\n const { defaultPrevented } = this.pageSelected.emit(this.selectedPage);\n\n if (defaultPrevented) {\n this.selectedPage = oldIndex;\n }\n }\n\n private increase() {\n if (this.selectedPage === this.count - 1) {\n return;\n }\n\n this.selectPage(this.selectedPage + 1);\n }\n\n private decrease() {\n if (this.selectedPage === 0) {\n return;\n }\n\n this.selectPage(this.selectedPage - 1);\n }\n\n private getPageButton(index: number) {\n const baseButtonProps: BaseButtonProps = {\n ...this.baseButtonConfig,\n onClick: () => this.selectPage(index),\n selected: this.selectedPage === index,\n ariaAttributes: {\n 'aria-pressed': a11yBoolean(this.selectedPage === index),\n },\n };\n\n return <BaseButton {...baseButtonProps}>{index + 1}</BaseButton>;\n }\n\n private renderPageButtons() {\n const pagesBeforeOverflow = Math.floor(this.maxCountPages / 2);\n const hasOverflow = this.count > this.maxCountPages;\n const hasOverflowStart =\n hasOverflow && this.selectedPage > pagesBeforeOverflow;\n const hasOverflowEnd =\n hasOverflow && this.selectedPage < this.count - pagesBeforeOverflow - 1;\n const pageButtons = [];\n\n let start = 0;\n let end = Math.min(this.count, this.maxCountPages);\n let pageCount = Math.floor((this.maxCountPages - 4) / 2);\n\n if (hasOverflowStart) {\n const baseButtonProps = {\n ...this.baseButtonConfig,\n onClick: () => {\n if (hasOverflowEnd) {\n this.selectPage(this.selectedPage - Math.max(0, 2 pageCount + 1));\n } else {\n this.selectPage(this.count - this.maxCountPages);\n }\n },\n };\n pageButtons.push(this.getPageButton(0));\n pageButtons.push(<BaseButton {...baseButtonProps}>...</BaseButton>);\n\n if (hasOverflowEnd) {\n start = this.count - this.maxCountPages + 2;\n } else {\n start = this.count - this.maxCountPages + 2;\n end = this.count;\n }\n }\n\n if (hasOverflowEnd) {\n if (hasOverflowStart) {\n start = this.selectedPage - pageCount;\n end = this.selectedPage + pageCount + 1;\n } else {\n end = this.maxCountPages - 2;\n }\n }\n\n for (let i = start; i < end; i++) {\n pageButtons.push(this.getPageButton(i));\n }\n\n if (hasOverflowEnd) {\n const baseButtonProps = {\n ...this.baseButtonConfig,\n onClick: () => {\n if (hasOverflowStart) {\n this.selectPage(this.selectedPage + Math.max(0, 2 * pageCount + 1));\n } else {\n this.selectPage(this.maxCountPages - 1);\n }\n },\n };\n pageButtons.push(<BaseButton {...baseButtonProps}>...</BaseButton>);\n pageButtons.push(this.getPageButton(this.count - 1));\n }\n\n return <span class=\"page-buttons\">{pageButtons}</span>;\n }\n\n render() {\n return (\n <Host>\n <ix-icon-button\n disabled={!this.count \|\| this.selectedPage === 0}\n ghost\n icon={iconChevronLeftSmall}\n onClick={() => this.decrease()}\n ></ix-icon-button>\n\n {this.advanced ? (\n <div class=\"advanced-pagination\">\n <ix-typography format=\"body\">{this.i18nPage}</ix-typography>\n <input\n class=\"ix-form-control page-selection\"\n type=\"number\"\n min=\"1\"\n max={this.count}\n value={this.selectedPage + 1}\n onChange={(event: Event) => {\n const eventTarget = event.target as HTMLInputElement;\n if (eventTarget) {\n const index = Number.parseInt(eventTarget.value);\n this.selectPage(index - 1);\n }\n }}\n />\n <span class=\"total-count\">\n <ix-typography format=\"body\">\n {this.i18nOf} {this.count}\n </ix-typography>\n </span>\n </div>\n ) : (\n <span class=\"basic-pagination\">{this.renderPageButtons()} </span>\n )}\n\n <ix-icon-button\n disabled={!this.count \|\| this.selectedPage === this.count - 1}\n ghost\n icon={iconChevronRightSmall}\n onClick={() => this.increase()}\n ></ix-icon-button>\n\n {this.advanced && this.showItemCount ? (\n <span class=\"item-count\">\n <ix-typography format=\"body\">{this.i18nItems}</ix-typography>\n <ix-select\n hideListHeader\n i18nPlaceholder=\"\"\n i18nSelectListHeader=\"\"\n value={`${this.itemCount}`}\n onValueChange={(e) => {\n const count = Number.parseInt(\n Array.isArray(e.detail) ? e.detail[0] : e.detail\n );\n\n this.itemCountChanged.emit(count);\n }}\n >\n <ix-select-item label=\"10\" value=\"10\"></ix-select-item>\n <ix-select-item label=\"15\" value=\"15\"></ix-select-item>\n <ix-select-item label=\"20\" value=\"20\"></ix-select-item>\n <ix-select-item label=\"40\" value=\"40\"></ix-select-item>\n <ix-select-item label=\"100\" value=\"100\"></ix-select-item>\n </ix-select>\n </span>\n ) : (\n ''\n )}\n </Host>\n );\n }\n}\n"],"version":3}

package/components/ix-pane-layout.js CHANGED Viewed

@@ -236,7 +236,7 @@ const Panes = /*@__PURE__*/ proxyCustomElement(class Panes extends H {
         return pane ? pane.floating : false;
     }
     render() {
-        return (h(Host, { key: '42424752e70401984bd2a5d42b22128f956ab320' }, !this.isMobile ? (this.layout == 'full-vertical' ? (h("div", { class: "side-panes-wrapper" }, h("div", { class: {
+        return (h(Host, { key: 'ffc6ae7ffe03045aacc0ac08ea5edde835e2de78' }, !this.isMobile ? (this.layout == 'full-vertical' ? (h("div", { class: "side-panes-wrapper" }, h("div", { class: {
                 row: true,
                 'padding-left': this.hasPadding('left'),
                 'padding-right': this.hasPadding('right'),