@siemens/ix 0.0.0-pr-2214-20251017134939 → 0.0.0-pr-2198-20251023082407
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/ix-menu-about.js +2 -2
- package/components/ix-menu-settings.js +1 -1
- package/components/ix-tab-item.js +1 -1
- package/components/ix-textarea.js +56 -3
- package/components/ix-textarea.js.map +1 -1
- package/components/p-BkCOZyt9.js.map +1 -1
- package/components/{p-C_x_G0ux.js → p-BrKwrb_Z.js} +3 -3
- package/components/{p-C_x_G0ux.js.map → p-BrKwrb_Z.js.map} +1 -1
- package/components/{p-4zrYEasX.js → p-COHP8TmU.js} +3 -3
- package/components/p-COHP8TmU.js.map +1 -0
- package/dist/cjs/input.util-B2BCXE7G.js.map +1 -1
- package/dist/cjs/ix-tab-item.ix-tabs.entry.cjs.js.map +1 -1
- package/dist/cjs/ix-tab-item_2.cjs.entry.js +1 -1
- package/dist/cjs/ix-textarea.cjs.entry.js +52 -3
- package/dist/cjs/ix-textarea.entry.cjs.js.map +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/siemens-ix.cjs.js +1 -1
- package/dist/collection/components/input/input.fc.js.map +1 -1
- package/dist/collection/components/input/textarea.js +59 -3
- package/dist/collection/components/input/textarea.js.map +1 -1
- package/dist/collection/components/tab-item/tab-item.css +1 -1
- package/dist/esm/input.util-6IjJg2ik.js.map +1 -1
- package/dist/esm/ix-tab-item.ix-tabs.entry.js.map +1 -1
- package/dist/esm/ix-tab-item_2.entry.js +1 -1
- package/dist/esm/ix-textarea.entry.js +52 -3
- package/dist/esm/ix-textarea.entry.js.map +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/siemens-ix.js +1 -1
- package/dist/siemens-ix/ix-tab-item.ix-tabs.entry.esm.js.map +1 -1
- package/dist/siemens-ix/ix-textarea.entry.esm.js.map +1 -1
- package/dist/siemens-ix/{p-cd11dfa8.entry.js → p-20b5fc48.entry.js} +2 -2
- package/dist/siemens-ix/p-20b5fc48.entry.js.map +1 -0
- package/dist/siemens-ix/p-f55c3bed.entry.js +2 -0
- package/dist/siemens-ix/{p-a25ebeb2.entry.js.map → p-f55c3bed.entry.js.map} +1 -1
- package/dist/siemens-ix/p-q1WCgUmY.js.map +1 -1
- package/dist/siemens-ix/siemens-ix.esm.js +1 -1
- package/dist/types/components/input/input.fc.d.ts +1 -1
- package/dist/types/components/input/textarea.d.ts +9 -0
- package/hydrate/index.js +53 -4
- package/hydrate/index.mjs +53 -4
- package/package.json +1 -1
- package/components/p-4zrYEasX.js.map +0 -1
- package/dist/siemens-ix/p-a25ebeb2.entry.js +0 -2
- package/dist/siemens-ix/p-cd11dfa8.entry.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ix-tab-item.ix-tabs.entry.esm.js","sources":["src/components/tab-item/tab-item.scss?tag=ix-tab-item&encapsulation=shadow","src/components/tab-item/tab-item.tsx","src/components/utils/requestAnimationFrame.ts","src/components/tabs/tabs.scss?tag=ix-tabs&encapsulation=shadow","src/components/tabs/tabs.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@use './common-variables' as vars;\n@use 'mixins/text-truncation';\n@use 'mixins/hover';\n@use 'mixins/shadow-dom/component';\n\n:host {\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 10px vars.$large-space;\n line-height: 20px;\n font-size: 14px;\n font-weight: bold;\n background-color: var(--theme-tab--background);\n color: var(--theme-tab--color);\n\n @include component.ix-component;\n\n &::after {\n content: '';\n position: absolute;\n background-color: var(--theme-tab-indicator--background);\n width: 100%;\n height: var(--theme-tab-indicator--height);\n left: 0;\n }\n\n .text {\n @include text-truncation.ellipsis;\n\n span,\n span::before {\n pointer-events: none;\n }\n\n vertical-align: middle;\n }\n\n .circle {\n display: flex;\n justify-content: center;\n align-items: center;\n height: 3rem;\n width: 3rem;\n background-color: var(--theme-animated-tab-indicator--background);\n border-radius: 50%;\n border: 2px solid var(--theme-animated-tab-circle--border-color);\n color: var(--theme-an…icon--color);\n cursor: pointer;\n\n &.selected:not(.disabled) {\n background-color: var(--theme-animated-tab-circle--background--selected);\n color: var(--theme-animated-tab-icon--color--selected);\n border-color: var(--theme-animated-tab-circle--border-color--selected);\n\n &:hover {\n background-color: var(\n --theme-animated-tab-circle--background--selected\n );\n }\n }\n\n &:hover {\n background-color: var(--theme-animated-tab-circle--background--hover);\n }\n\n &:active {\n background-color: var(--theme-animated-tab-circle--background--active);\n }\n\n &:active {\n background-color: var(--theme-animated-tab-circle--background--active);\n }\n\n &.disabled {\n background-color: var(--theme-animated-tab-circle--background--disabled);\n border-color: var(--theme-animated-tab-circle--border-color--disabled);\n }\n }\n\n .counter {\n position: absolute;\n z-index: 1;\n height: 16px;\n width: auto;\n background-color: var(--theme-color-1);\n border: 1px solid var(--theme-tab-pill--border-color);\n border-radius: 100px;\n bottom: 6px;\n display: flex;\n justify-content: center;\n align-items: center;\n padding-left: vars.$tiny-space;\n padding-right: vars.$tiny-space;\n font-size: 12px;\n line-height: 14px;\n color: var(--theme-pill-outline--color);\n cursor: pointer;\n\n &.selected {\n border-color: var(--theme-tab-pill--border-color--selected);\n }\n\n &.disabled {\n border-color: var(--theme-tab-pill--border-color--disabled);\n }\n }\n\n .hidden {\n display: none;\n }\n}\n\n:host(.circle) {\n height: 72px;\n}\n\n:host(.top) {\n &::after {\n top: 0;\n }\n}\n\n:host(.bottom) {\n &::after {\n bottom: 0;\n }\n}\n\n:host(.stretched) {\n flex-basis: 100%;\n width: 100%;\n @include text-truncation.ellipsis;\n}\n\n:host(:hover:not(.circle)) {\n background-color: var(--theme-tab--background--hover);\n color: var(--theme-tab-color-hover);\n cursor: pointer;\n\n &::after {\n background-color: var(--theme-tab-indicator--background--hover);\n }\n}\n\n:host(:active:not(.circle)) {\n background-color: var(--theme-tab--background--active);\n color: var(--theme-tab-color--active);\n\n &::after {\n background-color: var(--theme-tab-indicator--background--active);\n }\n}\n\n:host(:focus-visible) {\n outline: 0px solid var(--focus--border-color);\n\n .circle {\n outline: 1px solid var(--focus--border-color);\n }\n}\n\n:host(:focus-visible:not(.circle)) {\n outline: 1px solid var(--focus--border-color);\n}\n\n:host(.disabled) {\n pointer-events: none;\n color: var(--theme-tab--color--disabled);\n background-color: var(--theme-tab--background--disabled);\n\n &::after {\n background-color: var(--theme-tab-indicator--background--disabled);\n }\n}\n\n:host(.selected:not(.disabled)) {\n background-color: var(--theme-tab--background--selected);\n color: var(--theme-tab--color--selected);\n\n &::after {\n background-color: var(--theme-tab-indicator--background--selected);\n }\n}\n\n:host(.icon) {\n padding: vars.$large-space vars.$small-space;\n}\n\n:host(.small-tab) {\n height: 32px;\n padding: vars.$default-space;\n}\n\n:host(.small-tab.icon) {\n padding: vars.$default-space vars.$tiny-space;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\nimport type { TabClickDetail } from './tab-item.types';\n\n@Component({\n tag: 'ix-tab-item',\n styleUrl: 'tab-item.scss',\n shadow: true,\n})\nexport class TabItem {\n /**\n * Set selected tab\n */\n @Prop() selected = false;\n\n /**\n * Set disabled tab\n */\n @Prop() disabled = false;\n\n /**\n * Set small size tab\n */\n @Prop() small = false;\n\n /**\n * Set icon only tab\n */\n @Prop() icon = false;\n\n /**\n * Set rounded tab\n */\n @Prop() rounded = false;\n\n /**\n * Set counter value\n */\n @Prop() counter?: number;\n\n /**\n * Set layout width style\n */\n @Prop() layout: 'auto' | 'stretched' = 'auto';\n\n /**\n * Set selected placement\n */\n @Prop() placement: 'bottom' | 'top' = 'bottom';\n\n /**\n * Emitted when the tab is clicked.\n */\n @Event() tabClick!: EventEmitter<TabClickDetail>;\n\n private tabItemClasses(props: {\n selected: boolean;\n disabled: boolean;\n small: boolean;\n icon: boolean;\n circle: boolean;\n layout: 'auto' | 'stretched';\n placement: 'bottom' | 'top';\n }) {\n return {\n selected: props.selected,\n disabled: props.disabled,\n 'small-tab': props.small,\n icon: props.small,\n stretched: props.layout === 'stretched',\n bottom: props.placement === 'bottom',\n top: props.placement === 'top',\n circle: props.circle,\n };\n }\n\n render() {\n return (\n <Host\n class={this.tabItemClasses({\n selected: this.selected,\n disabled: this.disabled,\n small: this.small,\n icon: this.icon,\n layout: this.layout,\n placement: this.placement,\n circle: this.rounded,\n })}\n tabIndex={0}\n onClick={(event: MouseEvent) => {\n if (event.defaultPrevented) return;\n\n const clientEvent = this.tabClick.emit({\n nativeEvent: event,\n });\n\n if (clientEvent.defaultPrevented) {\n event.stopPropagation();\n }\n }}\n >\n <div\n class={{\n circle: this.rounded,\n text: !this.rounded,\n selected: this.selected,\n disabled: this.disabled,\n }}\n >\n <slot></slot>\n </div>\n <div\n class={{\n counter: true,\n selected: this.selected,\n hidden: !(this.rounded && this.counter !== undefined),\n disabled: this.disabled,\n }}\n >\n {this.counter}\n </div>\n </Host>\n );\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\ndeclare const __zone_symbol__requestAnimationFrame: any;\n\n/**\n * Prevents angular from change detection when requesting an animation frame\n *\n * Credits goes to:\n * https://github.com/ionic-team/ionic-framework/blob/main/core/src/utils/helpers.ts\n */\nexport const requestAnimationFrameNoNgZone = (\n callback: (...args: any[]) => void\n) => {\n if (typeof __zone_symbol__requestAnimationFrame === 'function') {\n return __zone_symbol__requestAnimationFrame(callback);\n }\n if (typeof requestAnimationFrame === 'function') {\n return requestAnimationFrame(callback);\n }\n return setTimeout(callback);\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@use 'mixins/text-truncation';\n@use 'mixins/shadow-dom/component';\n\n:host {\n width: auto;\n display: flex;\n align-items: center;\n position: relative;\n\n @include component.ix-component;\n\n .tab-items {\n overflow: hidden;\n scroll-behavior: smooth;\n width: 100%;\n\n .items-content {\n display: flex;\n align-items: center;\n }\n }\n\n .arrow {\n // unset button styles first\n all: unset;\n\n position: absolute;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 32px;\n height: 32px;\n top: 0;\n bottom: 0;\n left: 0;\n margin: auto 0;\n border-radius: 4px;\n color: var(--theme-btn-tertiary--color);\n background-color: var(--theme-btn-tertiary--background);\n z-index: 2;\n\n &:hover {\n color: var(--theme-btn-tertiary--color--hover);\n background-color: var(--theme-btn-tertiary--background--hover);\n }\n\n &:active {\n color: var(--theme-btn-tertiary--color--active);\n background-color: var(--theme-btn-tertiary--background--active);\n }\n\n &.right {\n left: auto;\n right: 0;\n }\n }\n\n .overflow-shadow {\n display: block;\n position: relative;\n height: 100%;\n width: 100%;\n pointer-events: all;\n\n &.shadow-left {\n mask-image: linear-gradient(90deg, transparent 0px, black 45px);\n }\n\n &.shadow-right {\n mask-image: linear-gradient(\n 90deg,\n black calc(100% - 45px),\n transparent 100%\n );\n }\n\n &.shadow-both {\n mask-image: linear-gradient(\n 90deg,\n transparent 0px,\n black 45px,\n black calc(100% - 45px),\n transparent 100%\n );\n }\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { requestAnimationFrameNoNgZone } from '../utils/requestAnimationFrame';\nimport {\n iconChevronLeftSmall,\n iconChevronRightSmall,\n} from '@siemens/ix-icons/icons';\n\n@Component({\n tag: 'ix-tabs',\n styleUrl: 'tabs.scss',\n shadow: true,\n})\nexport class Tabs {\n @Element() hostElement!: HTMLIxTabsElement;\n\n /**\n * Set tab items to small size\n */\n @Prop() small = false;\n\n /**\n * Set rounded tabs\n */\n @Prop() rounded = false;\n\n /**\n * Set default selected tab by index\n */\n @Prop({ mutable: true }) selected = 0;\n\n /**\n * Set layout width style\n */\n @Prop() layout: 'auto' | 'stretched' = 'auto';\n\n /**\n * Set placement style\n */\n @Prop() placement: 'bottom' | 'top' = 'bottom';\n\n /**\n * ARIA label for the chevron left icon button\n *\n * @since 3.2.0\n */\n @Prop() ariaLabelChevronLeftIconButton?: string;\n\n /**\n * ARIA label for the chevron right icon button\n *\n * @since 3.2.0\n */\n @Prop() ariaLabelChevronRightIconButton?: string;\n\n /**\n * `selected` property changed\n */\n @Event() selectedChange!: EventEmitter<number>;\n\n @State() totalItems = 0;\n @State() currentScrollAmount = 0;\n @State() scrollAmount = 100;\n @State() scrollActionAmount = 0;\n @State() showArrowPrevious = false;\n @State() showArrowNext = false;\n\n private windowStartSize = window.innerWidth;\n private resizeObserver?: ResizeObserver;\n\n private clickAction: {\n timeout: NodeJS.Timeout | null;\n isClick: boolean;\n } = {\n timeout: null,\n isClick: true,\n };\n\n @Listen('resize', { target: 'window' })\n onWindowResize() {\n this.totalItems = 0;\n this.totalItems = this.getTabs().length;\n\n if (this.windowStartSize === 0)\n return (this.windowStartSize = window.innerWidth);\n this.move(this.windowStartSize - window.innerWidth);\n this.windowStartSize = window.innerWidth;\n }\n\n private getTabs() {\n return Array.from(this.hostElement.querySelectorAll('ix-tab-item'));\n }\n\n private getTab(tabIndex: number) {\n return this.getTabs()[tabIndex];\n }\n\n private getTabsWrapper() {\n return this.hostElement.shadowRoot?.querySelector('.items-content');\n }\n\n private initResizeObserver() {\n const parentElement = this.hostElement.parentElement;\n if (!parentElement) return;\n this.resizeObserver = new ResizeObserver(() => {\n this.renderArrows();\n });\n this.resizeObserver.observe(parentElement);\n }\n\n private showArrows() {\n try {\n const tabWrapper = this.getTabsWrapper();\n return (\n tabWrapper &&\n tabWrapper.scrollWidth >\n Math.ceil(tabWrapper.getBoundingClientRect().width) &&\n this.layout === 'auto'\n );\n } catch (error) {\n return false;\n }\n }\n\n private showPreviousArrow() {\n try {\n return this.showArrows() === true && this.scrollActionAmount < 0;\n } catch (error) {\n return false;\n }\n }\n\n private showNextArrow() {\n try {\n const tabWrapper = this.getTabsWrapper();\n\n if (!tabWrapper) {\n return false;\n }\n\n const tabWrapperRect = tabWrapper.getBoundingClientRect();\n\n return (\n this.showArrows() === true &&\n this.scrollActionAmount >\n (tabWrapper.scrollWidth - tabWrapperRect.width) * -1\n );\n } catch (error) {\n return false;\n }\n }\n\n private move(amount: number, click = false) {\n const tabsWrapper = this.getTabsWrapper();\n\n if (!tabsWrapper) {\n return;\n }\n\n const tabsWrapperVisibleWidth = tabsWrapper.getBoundingClientRect().width;\n const maxScrollWidth =\n -this.currentScrollAmount +\n tabsWrapperVisibleWidth -\n tabsWrapper.scrollWidth;\n\n amount = amount < maxScrollWidth ? maxScrollWidth : amount;\n amount += this.currentScrollAmount;\n amount = Math.min(amount, 0);\n\n const styles = [\n `transform: translateX(${amount}px);`,\n click ? 'transition: all ease-in-out 400ms;' : '',\n ].join('');\n\n tabsWrapper.setAttribute('style', styles);\n\n if (click) this.currentScrollAmount = this.scrollActionAmount = amount;\n else this.scrollActionAmount = amount;\n }\n\n @Watch('selected')\n onSelectedChange(newValue: number) {\n if (!this.showArrows()) return;\n\n const tabRect = this.getTab(newValue).getBoundingClientRect();\n const wrapperWidth = this.getTabsWrapper()?.clientWidth;\n const arrowWidth = 32;\n\n if (tabRect.left < arrowWidth) {\n this.move(-tabRect.left + arrowWidth, true);\n } else if (wrapperWidth && tabRect.right > wrapperWidth - arrowWidth) {\n this.move(wrapperWidth - tabRect.right - arrowWidth, true);\n }\n }\n\n private setSelected(index: number) {\n this.selected = index;\n }\n\n private clickTab(index: number) {\n if (!this.clickAction.isClick || this.dragStop()) {\n return;\n }\n\n const { defaultPrevented } = this.selectedChange.emit(index);\n if (defaultPrevented) {\n return;\n }\n\n this.setSelected(index);\n }\n\n private dragStart(element: HTMLIxTabItemElement, event: MouseEvent) {\n if (!this.showArrows()) return;\n if (event.button > 0) return;\n\n this.clickAction.timeout =\n this.clickAction.timeout === null\n ? setTimeout(() => (this.clickAction.isClick = false), 300)\n : null;\n\n const tabPositionX = parseFloat(window.getComputedStyle(element).left);\n const mousedownPositionX = event.clientX;\n const move = (event: MouseEvent) =>\n this.dragMove(event, tabPositionX, mousedownPositionX);\n const windowClick = () => {\n window.removeEventListener('mousemove', move, false);\n window.removeEventListener('click', windowClick, false);\n this.dragStop();\n };\n window.addEventListener('click', windowClick);\n window.addEventListener('mousemove', move, false);\n }\n\n private dragMove(event: MouseEvent, tabX: number, mousedownX: number) {\n this.move(event.clientX + tabX - mousedownX);\n }\n\n private dragStop() {\n if (this.clickAction.timeout) {\n clearTimeout(this.clickAction.timeout);\n this.clickAction.timeout = null;\n }\n\n if (this.clickAction.isClick) return false;\n\n this.currentScrollAmount = this.scrollActionAmount;\n this.clickAction.isClick = true;\n\n return true;\n }\n\n componentWillLoad() {\n const tabs = this.getTabs();\n\n tabs.map((element, index) => {\n if (this.small) element.setAttribute('small', 'true');\n\n if (this.rounded) element.setAttribute('rounded', 'true');\n\n element.setAttribute('layout', this.layout);\n element.setAttribute(\n 'selected',\n index === this.selected ? 'true' : 'false'\n );\n\n element.setAttribute('placement', this.placement);\n });\n\n this.initResizeObserver();\n }\n\n componentDidRender() {\n const tabs = this.getTabs();\n this.totalItems = tabs.length;\n\n tabs.map((element, index) => {\n element.setAttribute(\n 'selected',\n index === this.selected ? 'true' : 'false'\n );\n });\n }\n\n componentWillRender() {\n this.renderArrows();\n }\n\n private renderArrows() {\n requestAnimationFrameNoNgZone(() => {\n this.showArrowNext = this.showNextArrow();\n this.showArrowPrevious = this.showPreviousArrow();\n });\n }\n\n componentDidLoad() {\n const tabs = this.getTabs();\n tabs.forEach((element) => {\n element.addEventListener('mousedown', (event) =>\n this.dragStart(element, event)\n );\n });\n }\n\n disconnectedCallback() {\n this.resizeObserver?.disconnect();\n }\n\n @Listen('tabClick')\n onTabClick(event: CustomEvent) {\n if (event.defaultPrevented) {\n return;\n }\n\n const target = event.target;\n const tabs = this.getTabs();\n\n tabs.forEach((tab, index) => {\n if (!tab.disabled && tab === target) {\n this.clickTab(index);\n }\n });\n }\n\n render() {\n return (\n <Host>\n {this.showArrowPrevious && (\n <button\n class=\"arrow\"\n onClick={() => this.move(this.scrollAmount, true)}\n aria-label={this.ariaLabelChevronLeftIconButton}\n >\n <ix-icon name={iconChevronLeftSmall}></ix-icon>\n </button>\n )}\n <div\n class={{\n 'tab-items': true,\n 'overflow-shadow': true,\n 'shadow-left': this.showArrowPrevious,\n 'shadow-right': this.showArrowNext,\n 'shadow-both': this.showArrowNext && this.showArrowPrevious,\n }}\n >\n <div class=\"items-content\">\n <slot></slot>\n </div>\n </div>\n {this.showArrowNext && (\n <button\n class=\"arrow right\"\n onClick={() => this.move(-this.scrollAmount, true)}\n aria-label={this.ariaLabelChevronRightIconButton}\n >\n <ix-icon name={iconChevronRightSmall}></ix-icon>\n </button>\n )}\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ix-tab-item.ix-tabs.entry.esm.js","sources":["src/components/tab-item/tab-item.scss?tag=ix-tab-item&encapsulation=shadow","src/components/tab-item/tab-item.tsx","src/components/utils/requestAnimationFrame.ts","src/components/tabs/tabs.scss?tag=ix-tabs&encapsulation=shadow","src/components/tabs/tabs.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@use './common-variables' as vars;\n@use 'mixins/text-truncation';\n@use 'mixins/hover';\n@use 'mixins/shadow-dom/component';\n\n:host {\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 10px vars.$large-space;\n line-height: 20px;\n font-size: 14px;\n font-weight: bold;\n background-color: var(--theme-tab--background);\n color: var(--theme-tab--color);\n\n @include component.ix-component;\n\n &::after {\n content: '';\n position: absolute;\n background-color: var(--theme-tab-indicator--background);\n width: 100%;\n height: var(--theme-tab-indicator--height);\n left: 0;\n }\n\n .text {\n @include text-truncation.ellipsis;\n\n span,\n span::before {\n pointer-events: none;\n }\n\n vertical-align: middle;\n }\n\n .circle {\n display: flex;\n justify-content: center;\n align-items: center;\n height: 3rem;\n width: 3rem;\n background-color: var(--theme-animated-tab-indicator--background);\n border-radius: 50%;\n border: 2px solid var(--theme-animated-tab-circle--border-color);\n color: var(--theme-an…icon--color);\n cursor: pointer;\n\n &.selected:not(.disabled) {\n background-color: var(--theme-animated-tab-circle--background--selected);\n color: var(--theme-animated-tab-icon--color--selected);\n border-color: var(--theme-animated-tab-circle--border-color--selected);\n\n &:hover {\n background-color: var(\n --theme-animated-tab-circle--background--selected\n );\n }\n }\n\n &:hover {\n background-color: var(--theme-animated-tab-circle--background--hover);\n }\n\n &:active {\n background-color: var(--theme-animated-tab-circle--background--active);\n }\n\n &:active {\n background-color: var(--theme-animated-tab-circle--background--active);\n }\n\n &.disabled {\n background-color: var(--theme-animated-tab-circle--background--disabled);\n border-color: var(--theme-animated-tab-circle--border-color--disabled);\n }\n }\n\n .counter {\n position: absolute;\n z-index: 1;\n height: 16px;\n width: auto;\n background-color: var(--theme-pill-outline--background);\n border: 1px solid var(--theme-tab-pill--border-color);\n border-radius: 100px;\n bottom: 6px;\n display: flex;\n justify-content: center;\n align-items: center;\n padding-left: vars.$tiny-space;\n padding-right: vars.$tiny-space;\n font-size: 12px;\n line-height: 14px;\n color: var(--theme-pill-outline--color);\n cursor: pointer;\n\n &.selected {\n border-color: var(--theme-tab-pill--border-color--selected);\n }\n\n &.disabled {\n border-color: var(--theme-tab-pill--border-color--disabled);\n }\n }\n\n .hidden {\n display: none;\n }\n}\n\n:host(.circle) {\n height: 72px;\n}\n\n:host(.top) {\n &::after {\n top: 0;\n }\n}\n\n:host(.bottom) {\n &::after {\n bottom: 0;\n }\n}\n\n:host(.stretched) {\n flex-basis: 100%;\n width: 100%;\n @include text-truncation.ellipsis;\n}\n\n:host(:hover:not(.circle)) {\n background-color: var(--theme-tab--background--hover);\n color: var(--theme-tab-color-hover);\n cursor: pointer;\n\n &::after {\n background-color: var(--theme-tab-indicator--background--hover);\n }\n}\n\n:host(:active:not(.circle)) {\n background-color: var(--theme-tab--background--active);\n color: var(--theme-tab-color--active);\n\n &::after {\n background-color: var(--theme-tab-indicator--background--active);\n }\n}\n\n:host(:focus-visible) {\n outline: 0px solid var(--focus--border-color);\n\n .circle {\n outline: 1px solid var(--focus--border-color);\n }\n}\n\n:host(:focus-visible:not(.circle)) {\n outline: 1px solid var(--focus--border-color);\n}\n\n:host(.disabled) {\n pointer-events: none;\n color: var(--theme-tab--color--disabled);\n background-color: var(--theme-tab--background--disabled);\n\n &::after {\n background-color: var(--theme-tab-indicator--background--disabled);\n }\n}\n\n:host(.selected:not(.disabled)) {\n background-color: var(--theme-tab--background--selected);\n color: var(--theme-tab--color--selected);\n\n &::after {\n background-color: var(--theme-tab-indicator--background--selected);\n }\n}\n\n:host(.icon) {\n padding: vars.$large-space vars.$small-space;\n}\n\n:host(.small-tab) {\n height: 32px;\n padding: vars.$default-space;\n}\n\n:host(.small-tab.icon) {\n padding: vars.$default-space vars.$tiny-space;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\nimport type { TabClickDetail } from './tab-item.types';\n\n@Component({\n tag: 'ix-tab-item',\n styleUrl: 'tab-item.scss',\n shadow: true,\n})\nexport class TabItem {\n /**\n * Set selected tab\n */\n @Prop() selected = false;\n\n /**\n * Set disabled tab\n */\n @Prop() disabled = false;\n\n /**\n * Set small size tab\n */\n @Prop() small = false;\n\n /**\n * Set icon only tab\n */\n @Prop() icon = false;\n\n /**\n * Set rounded tab\n */\n @Prop() rounded = false;\n\n /**\n * Set counter value\n */\n @Prop() counter?: number;\n\n /**\n * Set layout width style\n */\n @Prop() layout: 'auto' | 'stretched' = 'auto';\n\n /**\n * Set selected placement\n */\n @Prop() placement: 'bottom' | 'top' = 'bottom';\n\n /**\n * Emitted when the tab is clicked.\n */\n @Event() tabClick!: EventEmitter<TabClickDetail>;\n\n private tabItemClasses(props: {\n selected: boolean;\n disabled: boolean;\n small: boolean;\n icon: boolean;\n circle: boolean;\n layout: 'auto' | 'stretched';\n placement: 'bottom' | 'top';\n }) {\n return {\n selected: props.selected,\n disabled: props.disabled,\n 'small-tab': props.small,\n icon: props.small,\n stretched: props.layout === 'stretched',\n bottom: props.placement === 'bottom',\n top: props.placement === 'top',\n circle: props.circle,\n };\n }\n\n render() {\n return (\n <Host\n class={this.tabItemClasses({\n selected: this.selected,\n disabled: this.disabled,\n small: this.small,\n icon: this.icon,\n layout: this.layout,\n placement: this.placement,\n circle: this.rounded,\n })}\n tabIndex={0}\n onClick={(event: MouseEvent) => {\n if (event.defaultPrevented) return;\n\n const clientEvent = this.tabClick.emit({\n nativeEvent: event,\n });\n\n if (clientEvent.defaultPrevented) {\n event.stopPropagation();\n }\n }}\n >\n <div\n class={{\n circle: this.rounded,\n text: !this.rounded,\n selected: this.selected,\n disabled: this.disabled,\n }}\n >\n <slot></slot>\n </div>\n <div\n class={{\n counter: true,\n selected: this.selected,\n hidden: !(this.rounded && this.counter !== undefined),\n disabled: this.disabled,\n }}\n >\n {this.counter}\n </div>\n </Host>\n );\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\ndeclare const __zone_symbol__requestAnimationFrame: any;\n\n/**\n * Prevents angular from change detection when requesting an animation frame\n *\n * Credits goes to:\n * https://github.com/ionic-team/ionic-framework/blob/main/core/src/utils/helpers.ts\n */\nexport const requestAnimationFrameNoNgZone = (\n callback: (...args: any[]) => void\n) => {\n if (typeof __zone_symbol__requestAnimationFrame === 'function') {\n return __zone_symbol__requestAnimationFrame(callback);\n }\n if (typeof requestAnimationFrame === 'function') {\n return requestAnimationFrame(callback);\n }\n return setTimeout(callback);\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@use 'mixins/text-truncation';\n@use 'mixins/shadow-dom/component';\n\n:host {\n width: auto;\n display: flex;\n align-items: center;\n position: relative;\n\n @include component.ix-component;\n\n .tab-items {\n overflow: hidden;\n scroll-behavior: smooth;\n width: 100%;\n\n .items-content {\n display: flex;\n align-items: center;\n }\n }\n\n .arrow {\n // unset button styles first\n all: unset;\n\n position: absolute;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 32px;\n height: 32px;\n top: 0;\n bottom: 0;\n left: 0;\n margin: auto 0;\n border-radius: 4px;\n color: var(--theme-btn-tertiary--color);\n background-color: var(--theme-btn-tertiary--background);\n z-index: 2;\n\n &:hover {\n color: var(--theme-btn-tertiary--color--hover);\n background-color: var(--theme-btn-tertiary--background--hover);\n }\n\n &:active {\n color: var(--theme-btn-tertiary--color--active);\n background-color: var(--theme-btn-tertiary--background--active);\n }\n\n &.right {\n left: auto;\n right: 0;\n }\n }\n\n .overflow-shadow {\n display: block;\n position: relative;\n height: 100%;\n width: 100%;\n pointer-events: all;\n\n &.shadow-left {\n mask-image: linear-gradient(90deg, transparent 0px, black 45px);\n }\n\n &.shadow-right {\n mask-image: linear-gradient(\n 90deg,\n black calc(100% - 45px),\n transparent 100%\n );\n }\n\n &.shadow-both {\n mask-image: linear-gradient(\n 90deg,\n transparent 0px,\n black 45px,\n black calc(100% - 45px),\n transparent 100%\n );\n }\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { requestAnimationFrameNoNgZone } from '../utils/requestAnimationFrame';\nimport {\n iconChevronLeftSmall,\n iconChevronRightSmall,\n} from '@siemens/ix-icons/icons';\n\n@Component({\n tag: 'ix-tabs',\n styleUrl: 'tabs.scss',\n shadow: true,\n})\nexport class Tabs {\n @Element() hostElement!: HTMLIxTabsElement;\n\n /**\n * Set tab items to small size\n */\n @Prop() small = false;\n\n /**\n * Set rounded tabs\n */\n @Prop() rounded = false;\n\n /**\n * Set default selected tab by index\n */\n @Prop({ mutable: true }) selected = 0;\n\n /**\n * Set layout width style\n */\n @Prop() layout: 'auto' | 'stretched' = 'auto';\n\n /**\n * Set placement style\n */\n @Prop() placement: 'bottom' | 'top' = 'bottom';\n\n /**\n * ARIA label for the chevron left icon button\n *\n * @since 3.2.0\n */\n @Prop() ariaLabelChevronLeftIconButton?: string;\n\n /**\n * ARIA label for the chevron right icon button\n *\n * @since 3.2.0\n */\n @Prop() ariaLabelChevronRightIconButton?: string;\n\n /**\n * `selected` property changed\n */\n @Event() selectedChange!: EventEmitter<number>;\n\n @State() totalItems = 0;\n @State() currentScrollAmount = 0;\n @State() scrollAmount = 100;\n @State() scrollActionAmount = 0;\n @State() showArrowPrevious = false;\n @State() showArrowNext = false;\n\n private windowStartSize = window.innerWidth;\n private resizeObserver?: ResizeObserver;\n\n private clickAction: {\n timeout: NodeJS.Timeout | null;\n isClick: boolean;\n } = {\n timeout: null,\n isClick: true,\n };\n\n @Listen('resize', { target: 'window' })\n onWindowResize() {\n this.totalItems = 0;\n this.totalItems = this.getTabs().length;\n\n if (this.windowStartSize === 0)\n return (this.windowStartSize = window.innerWidth);\n this.move(this.windowStartSize - window.innerWidth);\n this.windowStartSize = window.innerWidth;\n }\n\n private getTabs() {\n return Array.from(this.hostElement.querySelectorAll('ix-tab-item'));\n }\n\n private getTab(tabIndex: number) {\n return this.getTabs()[tabIndex];\n }\n\n private getTabsWrapper() {\n return this.hostElement.shadowRoot?.querySelector('.items-content');\n }\n\n private initResizeObserver() {\n const parentElement = this.hostElement.parentElement;\n if (!parentElement) return;\n this.resizeObserver = new ResizeObserver(() => {\n this.renderArrows();\n });\n this.resizeObserver.observe(parentElement);\n }\n\n private showArrows() {\n try {\n const tabWrapper = this.getTabsWrapper();\n return (\n tabWrapper &&\n tabWrapper.scrollWidth >\n Math.ceil(tabWrapper.getBoundingClientRect().width) &&\n this.layout === 'auto'\n );\n } catch (error) {\n return false;\n }\n }\n\n private showPreviousArrow() {\n try {\n return this.showArrows() === true && this.scrollActionAmount < 0;\n } catch (error) {\n return false;\n }\n }\n\n private showNextArrow() {\n try {\n const tabWrapper = this.getTabsWrapper();\n\n if (!tabWrapper) {\n return false;\n }\n\n const tabWrapperRect = tabWrapper.getBoundingClientRect();\n\n return (\n this.showArrows() === true &&\n this.scrollActionAmount >\n (tabWrapper.scrollWidth - tabWrapperRect.width) * -1\n );\n } catch (error) {\n return false;\n }\n }\n\n private move(amount: number, click = false) {\n const tabsWrapper = this.getTabsWrapper();\n\n if (!tabsWrapper) {\n return;\n }\n\n const tabsWrapperVisibleWidth = tabsWrapper.getBoundingClientRect().width;\n const maxScrollWidth =\n -this.currentScrollAmount +\n tabsWrapperVisibleWidth -\n tabsWrapper.scrollWidth;\n\n amount = amount < maxScrollWidth ? maxScrollWidth : amount;\n amount += this.currentScrollAmount;\n amount = Math.min(amount, 0);\n\n const styles = [\n `transform: translateX(${amount}px);`,\n click ? 'transition: all ease-in-out 400ms;' : '',\n ].join('');\n\n tabsWrapper.setAttribute('style', styles);\n\n if (click) this.currentScrollAmount = this.scrollActionAmount = amount;\n else this.scrollActionAmount = amount;\n }\n\n @Watch('selected')\n onSelectedChange(newValue: number) {\n if (!this.showArrows()) return;\n\n const tabRect = this.getTab(newValue).getBoundingClientRect();\n const wrapperWidth = this.getTabsWrapper()?.clientWidth;\n const arrowWidth = 32;\n\n if (tabRect.left < arrowWidth) {\n this.move(-tabRect.left + arrowWidth, true);\n } else if (wrapperWidth && tabRect.right > wrapperWidth - arrowWidth) {\n this.move(wrapperWidth - tabRect.right - arrowWidth, true);\n }\n }\n\n private setSelected(index: number) {\n this.selected = index;\n }\n\n private clickTab(index: number) {\n if (!this.clickAction.isClick || this.dragStop()) {\n return;\n }\n\n const { defaultPrevented } = this.selectedChange.emit(index);\n if (defaultPrevented) {\n return;\n }\n\n this.setSelected(index);\n }\n\n private dragStart(element: HTMLIxTabItemElement, event: MouseEvent) {\n if (!this.showArrows()) return;\n if (event.button > 0) return;\n\n this.clickAction.timeout =\n this.clickAction.timeout === null\n ? setTimeout(() => (this.clickAction.isClick = false), 300)\n : null;\n\n const tabPositionX = parseFloat(window.getComputedStyle(element).left);\n const mousedownPositionX = event.clientX;\n const move = (event: MouseEvent) =>\n this.dragMove(event, tabPositionX, mousedownPositionX);\n const windowClick = () => {\n window.removeEventListener('mousemove', move, false);\n window.removeEventListener('click', windowClick, false);\n this.dragStop();\n };\n window.addEventListener('click', windowClick);\n window.addEventListener('mousemove', move, false);\n }\n\n private dragMove(event: MouseEvent, tabX: number, mousedownX: number) {\n this.move(event.clientX + tabX - mousedownX);\n }\n\n private dragStop() {\n if (this.clickAction.timeout) {\n clearTimeout(this.clickAction.timeout);\n this.clickAction.timeout = null;\n }\n\n if (this.clickAction.isClick) return false;\n\n this.currentScrollAmount = this.scrollActionAmount;\n this.clickAction.isClick = true;\n\n return true;\n }\n\n componentWillLoad() {\n const tabs = this.getTabs();\n\n tabs.map((element, index) => {\n if (this.small) element.setAttribute('small', 'true');\n\n if (this.rounded) element.setAttribute('rounded', 'true');\n\n element.setAttribute('layout', this.layout);\n element.setAttribute(\n 'selected',\n index === this.selected ? 'true' : 'false'\n );\n\n element.setAttribute('placement', this.placement);\n });\n\n this.initResizeObserver();\n }\n\n componentDidRender() {\n const tabs = this.getTabs();\n this.totalItems = tabs.length;\n\n tabs.map((element, index) => {\n element.setAttribute(\n 'selected',\n index === this.selected ? 'true' : 'false'\n );\n });\n }\n\n componentWillRender() {\n this.renderArrows();\n }\n\n private renderArrows() {\n requestAnimationFrameNoNgZone(() => {\n this.showArrowNext = this.showNextArrow();\n this.showArrowPrevious = this.showPreviousArrow();\n });\n }\n\n componentDidLoad() {\n const tabs = this.getTabs();\n tabs.forEach((element) => {\n element.addEventListener('mousedown', (event) =>\n this.dragStart(element, event)\n );\n });\n }\n\n disconnectedCallback() {\n this.resizeObserver?.disconnect();\n }\n\n @Listen('tabClick')\n onTabClick(event: CustomEvent) {\n if (event.defaultPrevented) {\n return;\n }\n\n const target = event.target;\n const tabs = this.getTabs();\n\n tabs.forEach((tab, index) => {\n if (!tab.disabled && tab === target) {\n this.clickTab(index);\n }\n });\n }\n\n render() {\n return (\n <Host>\n {this.showArrowPrevious && (\n <button\n class=\"arrow\"\n onClick={() => this.move(this.scrollAmount, true)}\n aria-label={this.ariaLabelChevronLeftIconButton}\n >\n <ix-icon name={iconChevronLeftSmall}></ix-icon>\n </button>\n )}\n <div\n class={{\n 'tab-items': true,\n 'overflow-shadow': true,\n 'shadow-left': this.showArrowPrevious,\n 'shadow-right': this.showArrowNext,\n 'shadow-both': this.showArrowNext && this.showArrowPrevious,\n }}\n >\n <div class=\"items-content\">\n <slot></slot>\n </div>\n </div>\n {this.showArrowNext && (\n <button\n class=\"arrow right\"\n onClick={() => this.move(-this.scrollAmount, true)}\n aria-label={this.ariaLabelChevronRightIconButton}\n >\n <ix-icon name={iconChevronRightSmall}></ix-icon>\n </button>\n )}\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ix-textarea.entry.esm.js","sources":["src/components/input/textarea.scss?tag=ix-textarea&encapsulation=shadow","src/components/input/textarea.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@use './input.mixins.scss';\n@use 'mixins/validation/form-component';\n\n@include input.input-field;\n\n@include form-component.host-valid;\n\n@include form-component.host-info {\n textarea {\n border-color: var(--theme-input--border-color--info);\n }\n\n textarea:hover {\n border-color: var(--theme-input--border-color--info--hover) !important;\n }\n\n textarea:active {\n border-color: var(--theme-input--border-color--info--active) !important;\n }\n}\n\n@include form-component.host-warning {\n textarea {\n background-color: var(--theme-input--background--warning);\n border-color: var(--theme-input--border-color--warning--active) !important;\n }\n\n textarea:hover {\n background-color: var(--theme-input--background--warning--hover);\n border-color: var(--theme-input--border-color--warning--hover) !important;\n }\n\n textarea:active {\n border-color: var(--theme-input--border-color--warning--active) !important;\n }\n}\n\n@include form-component.host-invalid {\n textarea {\n background-color: var(--theme-input--background--invalid);\n border-color: var(--theme-input--border-color--invalid) !important;\n }\n\n textarea:hover {\n background-color: var(--theme-input--background--invalid--hover);\n border-color: var(--theme-input--border-color--invalid--hover) !important;\n }\n\n textarea:active {\n border-color: var(--theme-input--border-color--invalid--active) !important;\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 {\n AttachInternals,\n Component,\n Element,\n Event,\n EventEmitter,\n Host,\n Method,\n Prop,\n State,\n h,\n} from '@stencil/core';\nimport {\n HookValidationLifecycle,\n IxInputFieldComponent,\n ValidationResults,\n} from '../utils/input';\nimport { makeRef } from '../utils/make-ref';\nimport { TextareaElement } from './input.fc';\nimport { mapValidationResult, onInputBlur } from './input.util';\nimport type { TextareaResizeBehavior } from './textarea.types';\n\n/**\n * @form-ready\n */\n@Component({\n tag: 'ix-textarea',\n styleUrl: 'textarea.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class Textarea implements IxInputFieldComponent<string> {\n @Element() hostElement!: HTMLIxTextareaElement;\n @AttachInternals() formInternals!: ElementInternals;\n\n /**\n * The name of the textarea field.\n */\n @Prop({ reflect: true }) name?: string;\n\n /**\n * The placeholder text for the textarea field.\n */\n @Prop({ reflect: true }) placeholder?: string;\n\n /**\n * The value of the textarea field.\n */\n @Prop({ reflect: true, mutable: true }) value: string = '';\n\n /**\n * Determines if the textarea field is required.\n */\n @Prop({ reflect: true }) required: boolean = false;\n\n /**\n * Determines if the textarea field is disabled.\n */\n @Prop() disabled: boolean = false;\n\n /**\n * Determines if the textarea field is readonly.\n */\n @Prop() readonly: boolean = false;\n\n /**\n * The helper text for the textarea field.\n */\n @Prop() helperText?: string;\n\n /**\n * The info text for the textarea field.\n */\n @Prop() infoText?: string;\n\n /**\n * Determines if the text should be displayed as a tooltip.\n */\n @Prop() showTextAsTooltip?: boolean;\n\n /**\n * The valid text for the textarea field.\n */\n @Prop() validText?: string;\n\n /**\n * The warning text for the textarea field.\n */\n @Prop() warningText?: string;\n\n /**\n * The label for the textarea field.\n */\n @Prop({ reflect: true }) label?: string;\n\n /**\n * The error text for the textarea field.\n */\n @Prop() invalidText?: string;\n\n /**\n * The height of the textarea field (e.g. \"52px\").\n */\n @Prop() textareaHeight?: string;\n\n /**\n * The width of the textarea field (e.g. \"200px\").\n */\n @Prop() textareaWidth?: string;\n\n /**\n * The height of the textarea specified by number of rows.\n */\n @Prop() textareaRows?: number;\n\n /**\n * The width of the textarea specified by number of characters.\n */\n @Prop() textareaCols?: number;\n\n /**\n * Determines the resize behavior of the textarea field.\n * Resizing can be enabled in one direction, both directions or completely disabled.\n */\n @Prop() resizeBehavior: TextareaResizeBehavior = 'both';\n\n /**\n * The maximum length of the textarea field.\n */\n @Prop() maxLength?: number;\n\n /**\n * The minimum length of the textarea field.\n */\n @Prop() minLength?: number;\n\n /**\n * Event emitted when the value of the textarea field changes.\n */\n @Event() valueChange!: EventEmitter<string>;\n\n /**\n * Event emitted when the validity state of the textarea field changes.\n */\n @Event() validityStateChange!: EventEmitter<ValidityState>;\n\n /**\n * Event emitted when the textarea 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 textAreaRef = makeRef<HTMLTextAreaElement>();\n private touched = false;\n\n @HookValidationLifecycle()\n updateClassMappings(result: ValidationResults) {\n mapValidationResult(this, result);\n }\n\n componentWillLoad() {\n this.updateFormInternalValue(this.value);\n }\n\n updateFormInternalValue(value: string) {\n this.formInternals.setFormValue(value);\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 * Get the native textarea element.\n */\n @Method()\n getNativeInputElement(): Promise<HTMLTextAreaElement> {\n return this.textAreaRef.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 * Check if the textarea field has been touched.\n * @internal\n * */\n @Method()\n isTouched(): Promise<boolean> {\n return Promise.resolve(this.touched);\n }\n\n render() {\n return (\n <Host\n class={{\n disabled: this.disabled,\n readonly: this.readonly,\n }}\n >\n <ix-field-wrapper\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.textAreaRef}\n >\n {!!this.maxLength && this.maxLength > 0 && (\n <ix-typography\n class=\"bottom-text\"\n slot=\"bottom-right\"\n textColor=\"soft\"\n >\n {(this.value ?? '').length}/{this.maxLength}\n </ix-typography>\n )}\n <div class=\"input-wrapper\">\n <TextareaElement\n minLength={this.minLength}\n maxLength={this.maxLength}\n textareaCols={this.textareaCols}\n textareaRows={this.textareaRows}\n textareaHeight={this.textareaHeight}\n textareaWidth={this.textareaWidth}\n resizeBehavior={this.resizeBehavior}\n readonly={this.readonly}\n disabled={this.disabled}\n isInvalid={this.isInvalid}\n required={this.required}\n value={this.value}\n placeholder={this.placeholder}\n textAreaRef={this.textAreaRef}\n valueChange={(value) => this.valueChange.emit(value)}\n updateFormInternalValue={(value) =>\n this.updateFormInternalValue(value)\n }\n onBlur={() => {\n onInputBlur(this, this.textAreaRef.current);\n this.touched = true;\n }}\n ></TextareaElement>\n </div>\n </ix-field-wrapper>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ix-textarea.entry.esm.js","sources":["src/components/input/textarea.scss?tag=ix-textarea&encapsulation=shadow","src/components/input/textarea.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@use './input.mixins.scss';\n@use 'mixins/validation/form-component';\n\n@include input.input-field;\n\n@include form-component.host-valid;\n\n@include form-component.host-info {\n textarea {\n border-color: var(--theme-input--border-color--info);\n }\n\n textarea:hover {\n border-color: var(--theme-input--border-color--info--hover) !important;\n }\n\n textarea:active {\n border-color: var(--theme-input--border-color--info--active) !important;\n }\n}\n\n@include form-component.host-warning {\n textarea {\n background-color: var(--theme-input--background--warning);\n border-color: var(--theme-input--border-color--warning--active) !important;\n }\n\n textarea:hover {\n background-color: var(--theme-input--background--warning--hover);\n border-color: var(--theme-input--border-color--warning--hover) !important;\n }\n\n textarea:active {\n border-color: var(--theme-input--border-color--warning--active) !important;\n }\n}\n\n@include form-component.host-invalid {\n textarea {\n background-color: var(--theme-input--background--invalid);\n border-color: var(--theme-input--border-color--invalid) !important;\n }\n\n textarea:hover {\n background-color: var(--theme-input--background--invalid--hover);\n border-color: var(--theme-input--border-color--invalid--hover) !important;\n }\n\n textarea:active {\n border-color: var(--theme-input--border-color--invalid--active) !important;\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 {\n AttachInternals,\n Component,\n Element,\n Event,\n EventEmitter,\n Host,\n Method,\n Prop,\n State,\n Watch,\n h,\n} from '@stencil/core';\nimport {\n HookValidationLifecycle,\n IxInputFieldComponent,\n ValidationResults,\n} from '../utils/input';\nimport { makeRef } from '../utils/make-ref';\nimport { TextareaElement } from './input.fc';\nimport { mapValidationResult, onInputBlur } from './input.util';\nimport type { TextareaResizeBehavior } from './textarea.types';\n\n/**\n * @form-ready\n */\n@Component({\n tag: 'ix-textarea',\n styleUrl: 'textarea.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class Textarea implements IxInputFieldComponent<string> {\n @Element() hostElement!: HTMLIxTextareaElement;\n @AttachInternals() formInternals!: ElementInternals;\n\n /**\n * The name of the textarea field.\n */\n @Prop({ reflect: true }) name?: string;\n\n /**\n * The placeholder text for the textarea field.\n */\n @Prop({ reflect: true }) placeholder?: string;\n\n /**\n * The value of the textarea field.\n */\n @Prop({ reflect: true, mutable: true }) value: string = '';\n\n /**\n * Determines if the textarea field is required.\n */\n @Prop({ reflect: true }) required: boolean = false;\n\n /**\n * Determines if the textarea field is disabled.\n */\n @Prop() disabled: boolean = false;\n\n /**\n * Determines if the textarea field is readonly.\n */\n @Prop() readonly: boolean = false;\n\n /**\n * The helper text for the textarea field.\n */\n @Prop() helperText?: string;\n\n /**\n * The info text for the textarea field.\n */\n @Prop() infoText?: string;\n\n /**\n * Determines if the text should be displayed as a tooltip.\n */\n @Prop() showTextAsTooltip?: boolean;\n\n /**\n * The valid text for the textarea field.\n */\n @Prop() validText?: string;\n\n /**\n * The warning text for the textarea field.\n */\n @Prop() warningText?: string;\n\n /**\n * The label for the textarea field.\n */\n @Prop({ reflect: true }) label?: string;\n\n /**\n * The error text for the textarea field.\n */\n @Prop() invalidText?: string;\n\n /**\n * The height of the textarea field (e.g. \"52px\").\n */\n @Prop() textareaHeight?: string;\n\n /**\n * The width of the textarea field (e.g. \"200px\").\n */\n @Prop() textareaWidth?: string;\n\n /**\n * The height of the textarea specified by number of rows.\n */\n @Prop() textareaRows?: number;\n\n /**\n * The width of the textarea specified by number of characters.\n */\n @Prop() textareaCols?: number;\n\n /**\n * Determines the resize behavior of the textarea field.\n * Resizing can be enabled in one direction, both directions or completely disabled.\n */\n @Prop() resizeBehavior: TextareaResizeBehavior = 'both';\n\n /**\n * The maximum length of the textarea field.\n */\n @Prop() maxLength?: number;\n\n /**\n * The minimum length of the textarea field.\n */\n @Prop() minLength?: number;\n\n /**\n * Event emitted when the value of the textarea field changes.\n */\n @Event() valueChange!: EventEmitter<string>;\n\n /**\n * Event emitted when the validity state of the textarea field changes.\n */\n @Event() validityStateChange!: EventEmitter<ValidityState>;\n\n /**\n * Event emitted when the textarea 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 textAreaRef = makeRef<HTMLTextAreaElement>(() => {\n this.initResizeObserver();\n });\n private touched = false;\n private resizeObserver?: ResizeObserver;\n private isManuallyResized = false;\n private manualHeight?: string;\n private manualWidth?: string;\n private isProgrammaticResize = false;\n\n @HookValidationLifecycle()\n updateClassMappings(result: ValidationResults) {\n mapValidationResult(this, result);\n }\n\n @Watch('textareaHeight')\n @Watch('textareaWidth')\n onDimensionPropsChange() {\n this.isManuallyResized = false;\n this.manualHeight = undefined;\n this.manualWidth = undefined;\n this.isProgrammaticResize = true;\n }\n\n @Watch('resizeBehavior')\n onResizeBehaviorChange() {\n this.initResizeObserver();\n }\n\n componentWillLoad() {\n this.updateFormInternalValue(this.value);\n }\n\n disconnectedCallback() {\n this.resizeObserver?.disconnect();\n }\n\n private initResizeObserver() {\n this.resizeObserver?.disconnect();\n\n const textarea = this.textAreaRef.current;\n if (!textarea) return;\n\n if (this.resizeBehavior === 'none') return;\n\n let isInitialResize = true;\n\n this.resizeObserver = new ResizeObserver(() => {\n const textarea = this.textAreaRef.current;\n if (!textarea) return;\n\n if (isInitialResize) {\n isInitialResize = false;\n return;\n }\n\n if (this.isProgrammaticResize) {\n this.isProgrammaticResize = false;\n return;\n }\n\n this.isManuallyResized = true;\n this.manualHeight = textarea.style.height;\n this.manualWidth = textarea.style.width;\n });\n\n this.resizeObserver.observe(textarea);\n }\n\n updateFormInternalValue(value: string) {\n this.formInternals.setFormValue(value);\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 * Get the native textarea element.\n */\n @Method()\n getNativeInputElement(): Promise<HTMLTextAreaElement> {\n return this.textAreaRef.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 * Check if the textarea field has been touched.\n * @internal\n * */\n @Method()\n isTouched(): Promise<boolean> {\n return Promise.resolve(this.touched);\n }\n\n render() {\n return (\n <Host\n class={{\n disabled: this.disabled,\n readonly: this.readonly,\n }}\n >\n <ix-field-wrapper\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.textAreaRef}\n >\n {!!this.maxLength && this.maxLength > 0 && (\n <ix-typography\n class=\"bottom-text\"\n slot=\"bottom-right\"\n textColor=\"soft\"\n >\n {(this.value ?? '').length}/{this.maxLength}\n </ix-typography>\n )}\n <div class=\"input-wrapper\">\n <TextareaElement\n minLength={this.minLength}\n maxLength={this.maxLength}\n textareaCols={this.textareaCols}\n textareaRows={this.textareaRows}\n textareaHeight={\n this.isManuallyResized ? this.manualHeight : this.textareaHeight\n }\n textareaWidth={\n this.isManuallyResized ? this.manualWidth : this.textareaWidth\n }\n resizeBehavior={this.resizeBehavior}\n readonly={this.readonly}\n disabled={this.disabled}\n isInvalid={this.isInvalid}\n required={this.required}\n value={this.value}\n placeholder={this.placeholder}\n textAreaRef={this.textAreaRef}\n valueChange={(value) => this.valueChange.emit(value)}\n updateFormInternalValue={(value) =>\n this.updateFormInternalValue(value)\n }\n onBlur={() => {\n onInputBlur(this, this.textAreaRef.current);\n this.touched = true;\n }}\n ></TextareaElement>\n </div>\n </ix-field-wrapper>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as e,c as o,h as t,H as r,g as a}from"./p-DGODjp4O.js";import{H as i}from"./p-BlIjqRam.js";import{m as n}from"./p-bcj7UEIC.js";import{m as d,T as l,o as s}from"./p-q1WCgUmY.js";import"./p-Bb7pDeaQ.js";import"./p-CX81WQtk.js";import"./p-pXYAoEyc.js";import"./p-DhE1t8Qh.js";import"./p-C5MWUgDN.js";const b='input{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);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}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{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);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}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]){background-color:var(--theme-input--background--warning);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{background-color:var(--theme-input--background--warning--hover);border-color:var(--theme-input--border-color--warning--hover) !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{background-color:var(--theme-input--background--invalid--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{}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host{}: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{}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host{}: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{background-color:var(--theme-input--background--warning);border-color:var(--theme-input--border-color--warning--active) !important}:host(.ix-warning:not(.disabled):not(:disabled):not([disabled])) input:hover{background-color:var(--theme-input--background--warning--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{background-color:var(--theme-input--background--invalid--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(.ix-info:not(.disabled):not(:disabled):not([disabled])) textarea{border-color:var(--theme-input--border-color--info)}:host(.ix-info:not(.disabled):not(:disabled):not([disabled])) textarea:hover{border-color:var(--theme-input--border-color--info--hover) !important}:host(.ix-info:not(.disabled):not(:disabled):not([disabled])) textarea:active{border-color:var(--theme-input--border-color--info--active) !important}:host(.ix-warning:not(.disabled):not(:disabled):not([disabled])) textarea{background-color:var(--theme-input--background--warning);border-color:var(--theme-input--border-color--warning--active) !important}:host(.ix-warning:not(.disabled):not(:disabled):not([disabled])) textarea:hover{background-color:var(--theme-input--background--warning--hover);border-color:var(--theme-input--border-color--warning--hover) !important}:host(.ix-warning:not(.disabled):not(:disabled):not([disabled])) textarea:active{border-color:var(--theme-input--border-color--warning--active) !important}:host([class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled])) textarea,:host(.ix-invalid--required:not(.disabled):not(:disabled):not([disabled])) textarea{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])) textarea:hover,:host(.ix-invalid--required:not(.disabled):not(:disabled):not([disabled])) textarea:hover{background-color:var(--theme-input--background--invalid--hover);border-color:var(--theme-input--border-color--invalid--hover) !important}:host([class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled])) textarea:active,:host(.ix-invalid--required:not(.disabled):not(:disabled):not([disabled])) textarea:active{border-color:var(--theme-input--border-color--invalid--active) !important}';var h=undefined&&undefined.__decorate||function(e,o,t,r){var a=arguments.length,i=a<3?o:r===null?r=Object.getOwnPropertyDescriptor(o,t):r,n;if(typeof Reflect==="object"&&typeof Reflect.decorate==="function")i=Reflect.decorate(e,o,t,r);else for(var d=e.length-1;d>=0;d--)if(n=e[d])i=(a<3?n(i):a>3?n(o,t,i):n(o,t))||i;return a>3&&i&&Object.defineProperty(o,t,i),i};const c=class{constructor(t){e(this,t);this.valueChange=o(this,"valueChange",7);this.validityStateChange=o(this,"validityStateChange",7);this.ixBlur=o(this,"ixBlur",7);if(t.$hostElement$["s-ei"]){this.formInternals=t.$hostElement$["s-ei"]}else{this.formInternals=t.$hostElement$.attachInternals();t.$hostElement$["s-ei"]=this.formInternals}this.value="";this.required=false;this.disabled=false;this.readonly=false;this.resizeBehavior="both";this.isInvalid=false;this.isValid=false;this.isInfo=false;this.isWarning=false;this.isInvalidByRequired=false;this.textAreaRef=n();this.touched=false}updateClassMappings(e){d(this,e)}componentWillLoad(){this.updateFormInternalValue(this.value)}updateFormInternalValue(e){this.formInternals.setFormValue(e);this.value=e}async getAssociatedFormElement(){return this.formInternals.form}hasValidValue(){return Promise.resolve(!!this.value)}getNativeInputElement(){return this.textAreaRef.waitForCurrent()}async focusInput(){return(await this.getNativeInputElement()).focus()}isTouched(){return Promise.resolve(this.touched)}render(){var e;return t(r,{key:"2bd17a0b362db1a3b47a40a335e9dad0aacf60b2",class:{disabled:this.disabled,readonly:this.readonly}},t("ix-field-wrapper",{key:"63f6f38a83f3ac585be94fcbae2f0a1f07a3594a",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.textAreaRef},!!this.maxLength&&this.maxLength>0&&t("ix-typography",{key:"edec746b0b0f15b01a42f827d8ed77d5b2ff3fbb",class:"bottom-text",slot:"bottom-right",textColor:"soft"},((e=this.value)!==null&&e!==void 0?e:"").length,"/",this.maxLength),t("div",{key:"bd53188011be0df0567500f6f4f85757210a5df3",class:"input-wrapper"},t(l,{key:"2b38f2d805863b6f85630f2192a6c1dcd5238e5a",minLength:this.minLength,maxLength:this.maxLength,textareaCols:this.textareaCols,textareaRows:this.textareaRows,textareaHeight:this.textareaHeight,textareaWidth:this.textareaWidth,resizeBehavior:this.resizeBehavior,readonly:this.readonly,disabled:this.disabled,isInvalid:this.isInvalid,required:this.required,value:this.value,placeholder:this.placeholder,textAreaRef:this.textAreaRef,valueChange:e=>this.valueChange.emit(e),updateFormInternalValue:e=>this.updateFormInternalValue(e),onBlur:()=>{s(this,this.textAreaRef.current);this.touched=true}}))))}static get formAssociated(){return true}get hostElement(){return a(this)}};h([i()],c.prototype,"updateClassMappings",null);c.style=b;export{c as ix_textarea};
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as e,c as o,h as t,H as r,g as a}from"./p-DGODjp4O.js";import{H as i}from"./p-BlIjqRam.js";import{m as n}from"./p-bcj7UEIC.js";import{m as d,T as l,o as s}from"./p-q1WCgUmY.js";import"./p-Bb7pDeaQ.js";import"./p-CX81WQtk.js";import"./p-pXYAoEyc.js";import"./p-DhE1t8Qh.js";import"./p-C5MWUgDN.js";const b='input{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);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}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{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);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}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]){background-color:var(--theme-input--background--warning);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{background-color:var(--theme-input--background--warning--hover);border-color:var(--theme-input--border-color--warning--hover) !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{background-color:var(--theme-input--background--invalid--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{}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host{}: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{}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host{}: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{background-color:var(--theme-input--background--warning);border-color:var(--theme-input--border-color--warning--active) !important}:host(.ix-warning:not(.disabled):not(:disabled):not([disabled])) input:hover{background-color:var(--theme-input--background--warning--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{background-color:var(--theme-input--background--invalid--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(.ix-info:not(.disabled):not(:disabled):not([disabled])) textarea{border-color:var(--theme-input--border-color--info)}:host(.ix-info:not(.disabled):not(:disabled):not([disabled])) textarea:hover{border-color:var(--theme-input--border-color--info--hover) !important}:host(.ix-info:not(.disabled):not(:disabled):not([disabled])) textarea:active{border-color:var(--theme-input--border-color--info--active) !important}:host(.ix-warning:not(.disabled):not(:disabled):not([disabled])) textarea{background-color:var(--theme-input--background--warning);border-color:var(--theme-input--border-color--warning--active) !important}:host(.ix-warning:not(.disabled):not(:disabled):not([disabled])) textarea:hover{background-color:var(--theme-input--background--warning--hover);border-color:var(--theme-input--border-color--warning--hover) !important}:host(.ix-warning:not(.disabled):not(:disabled):not([disabled])) textarea:active{border-color:var(--theme-input--border-color--warning--active) !important}:host([class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled])) textarea,:host(.ix-invalid--required:not(.disabled):not(:disabled):not([disabled])) textarea{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])) textarea:hover,:host(.ix-invalid--required:not(.disabled):not(:disabled):not([disabled])) textarea:hover{background-color:var(--theme-input--background--invalid--hover);border-color:var(--theme-input--border-color--invalid--hover) !important}:host([class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled])) textarea:active,:host(.ix-invalid--required:not(.disabled):not(:disabled):not([disabled])) textarea:active{border-color:var(--theme-input--border-color--invalid--active) !important}';var h=undefined&&undefined.__decorate||function(e,o,t,r){var a=arguments.length,i=a<3?o:r===null?r=Object.getOwnPropertyDescriptor(o,t):r,n;if(typeof Reflect==="object"&&typeof Reflect.decorate==="function")i=Reflect.decorate(e,o,t,r);else for(var d=e.length-1;d>=0;d--)if(n=e[d])i=(a<3?n(i):a>3?n(o,t,i):n(o,t))||i;return a>3&&i&&Object.defineProperty(o,t,i),i};const c=class{constructor(t){e(this,t);this.valueChange=o(this,"valueChange",7);this.validityStateChange=o(this,"validityStateChange",7);this.ixBlur=o(this,"ixBlur",7);if(t.$hostElement$["s-ei"]){this.formInternals=t.$hostElement$["s-ei"]}else{this.formInternals=t.$hostElement$.attachInternals();t.$hostElement$["s-ei"]=this.formInternals}this.value="";this.required=false;this.disabled=false;this.readonly=false;this.resizeBehavior="both";this.isInvalid=false;this.isValid=false;this.isInfo=false;this.isWarning=false;this.isInvalidByRequired=false;this.textAreaRef=n((()=>{this.initResizeObserver()}));this.touched=false;this.isManuallyResized=false;this.isProgrammaticResize=false}updateClassMappings(e){d(this,e)}onDimensionPropsChange(){this.isManuallyResized=false;this.manualHeight=undefined;this.manualWidth=undefined;this.isProgrammaticResize=true}onResizeBehaviorChange(){this.initResizeObserver()}componentWillLoad(){this.updateFormInternalValue(this.value)}disconnectedCallback(){var e;(e=this.resizeObserver)===null||e===void 0?void 0:e.disconnect()}initResizeObserver(){var e;(e=this.resizeObserver)===null||e===void 0?void 0:e.disconnect();const o=this.textAreaRef.current;if(!o)return;if(this.resizeBehavior==="none")return;let t=true;this.resizeObserver=new ResizeObserver((()=>{const e=this.textAreaRef.current;if(!e)return;if(t){t=false;return}if(this.isProgrammaticResize){this.isProgrammaticResize=false;return}this.isManuallyResized=true;this.manualHeight=e.style.height;this.manualWidth=e.style.width}));this.resizeObserver.observe(o)}updateFormInternalValue(e){this.formInternals.setFormValue(e);this.value=e}async getAssociatedFormElement(){return this.formInternals.form}hasValidValue(){return Promise.resolve(!!this.value)}getNativeInputElement(){return this.textAreaRef.waitForCurrent()}async focusInput(){return(await this.getNativeInputElement()).focus()}isTouched(){return Promise.resolve(this.touched)}render(){var e;return t(r,{key:"03eb959f2c582fb1dddef9c4af3775ff27d4c391",class:{disabled:this.disabled,readonly:this.readonly}},t("ix-field-wrapper",{key:"66ec862af71b352b89418708782d0a73bd54e49f",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.textAreaRef},!!this.maxLength&&this.maxLength>0&&t("ix-typography",{key:"c75441f683c072a52d5d51481bc87e7ea00c42ff",class:"bottom-text",slot:"bottom-right",textColor:"soft"},((e=this.value)!==null&&e!==void 0?e:"").length,"/",this.maxLength),t("div",{key:"c49e36dd468cc9e4b83887891316436359b750b6",class:"input-wrapper"},t(l,{key:"9c051f207d06a4943540ed2c4f6d8b8be8ab1358",minLength:this.minLength,maxLength:this.maxLength,textareaCols:this.textareaCols,textareaRows:this.textareaRows,textareaHeight:this.isManuallyResized?this.manualHeight:this.textareaHeight,textareaWidth:this.isManuallyResized?this.manualWidth:this.textareaWidth,resizeBehavior:this.resizeBehavior,readonly:this.readonly,disabled:this.disabled,isInvalid:this.isInvalid,required:this.required,value:this.value,placeholder:this.placeholder,textAreaRef:this.textAreaRef,valueChange:e=>this.valueChange.emit(e),updateFormInternalValue:e=>this.updateFormInternalValue(e),onBlur:()=>{s(this,this.textAreaRef.current);this.touched=true}}))))}static get formAssociated(){return true}get hostElement(){return a(this)}static get watchers(){return{textareaHeight:["onDimensionPropsChange"],textareaWidth:["onDimensionPropsChange"],resizeBehavior:["onResizeBehaviorChange"]}}};h([i()],c.prototype,"updateClassMappings",null);c.style=b;export{c as ix_textarea};
|
|
2
|
+
//# sourceMappingURL=p-20b5fc48.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["registerInstance","createEvent","h","Host","getElement","HookValidationLifecycle","makeRef","mapValidationResult","TextareaElement","onInputBlur","textareaCss","__decorate","undefined","decorators","target","key","desc","c","arguments","length","r","Object","getOwnPropertyDescriptor","d","Reflect","decorate","i","defineProperty","Textarea","constructor","hostRef","this","valueChange","validityStateChange","ixBlur","$hostElement$","formInternals","attachInternals","value","required","disabled","readonly","resizeBehavior","isInvalid","isValid","isInfo","isWarning","isInvalidByRequired","textAreaRef","initResizeObserver","touched","isManuallyResized","isProgrammaticResize","updateClassMappings","result","onDimensionPropsChange","manualHeight","manualWidth","onResizeBehaviorChange","componentWillLoad","updateFormInternalValue","disconnectedCallback","_a","resizeObserver","disconnect","textarea","current","isInitialResize","ResizeObserver","style","height","width","observe","setFormValue","getAssociatedFormElement","form","hasValidValue","Promise","resolve","getNativeInputElement","waitForCurrent","focusInput","focus","isTouched","render","class","label","helperText","invalidText","infoText","warningText","validText","showTextAsTooltip","controlRef","maxLength","slot","textColor","minLength","textareaCols","textareaRows","textareaHeight","textareaWidth","placeholder","emit","onBlur","formAssociated","hostElement","watchers","prototype"],"sources":["0"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as t,c as e,h as r,H as o,g as a}from"./p-DGODjp4O.js";import{v as s,D as i}from"./p-Cz75KU1f.js";const c='@charset "UTF-8";:host{position:relative;display:flex;align-items:center;justify-content:center;padding:10px 1.5rem;line-height:20px;font-size:14px;font-weight:bold;background-color:var(--theme-tab--background);color:var(--theme-tab--color)}: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{}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host{}: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{}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host{}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host::after{content:"";position:absolute;background-color:var(--theme-tab-indicator--background);width:100%;height:var(--theme-tab-indicator--height);left:0}:host .text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .text span,:host .text span::before{pointer-events:none}:host .text{vertical-align:middle}:host .circle{display:flex;justify-content:center;align-items:center;height:3rem;width:3rem;background-color:var(--theme-animated-tab-indicator--background);border-radius:50%;border:2px solid var(--theme-animated-tab-circle--border-color);color:var(--theme-an…icon--color);cursor:pointer}:host .circle.selected:not(.disabled){background-color:var(--theme-animated-tab-circle--background--selected);color:var(--theme-animated-tab-icon--color--selected);border-color:var(--theme-animated-tab-circle--border-color--selected)}:host .circle.selected:not(.disabled):hover{background-color:var(--theme-animated-tab-circle--background--selected)}:host .circle:hover{background-color:var(--theme-animated-tab-circle--background--hover)}:host .circle:active{background-color:var(--theme-animated-tab-circle--background--active)}:host .circle:active{background-color:var(--theme-animated-tab-circle--background--active)}:host .circle.disabled{background-color:var(--theme-animated-tab-circle--background--disabled);border-color:var(--theme-animated-tab-circle--border-color--disabled)}:host .counter{position:absolute;z-index:1;height:16px;width:auto;background-color:var(--theme-pill-outline--background);border:1px solid var(--theme-tab-pill--border-color);border-radius:100px;bottom:6px;display:flex;justify-content:center;align-items:center;padding-left:0.25rem;padding-right:0.25rem;font-size:12px;line-height:14px;color:var(--theme-pill-outline--color);cursor:pointer}:host .counter.selected{border-color:var(--theme-tab-pill--border-color--selected)}:host .counter.disabled{border-color:var(--theme-tab-pill--border-color--disabled)}:host .hidden{display:none}:host(.circle){height:72px}:host(.top)::after{top:0}:host(.bottom)::after{bottom:0}:host(.stretched){flex-basis:100%;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host(:hover:not(.circle)){background-color:var(--theme-tab--background--hover);color:var(--theme-tab-color-hover);cursor:pointer}:host(:hover:not(.circle))::after{background-color:var(--theme-tab-indicator--background--hover)}:host(:active:not(.circle)){background-color:var(--theme-tab--background--active);color:var(--theme-tab-color--active)}:host(:active:not(.circle))::after{background-color:var(--theme-tab-indicator--background--active)}:host(:focus-visible){outline:0px solid var(--focus--border-color)}:host(:focus-visible) .circle{outline:1px solid var(--focus--border-color)}:host(:focus-visible:not(.circle)){outline:1px solid var(--focus--border-color)}:host(.disabled){pointer-events:none;color:var(--theme-tab--color--disabled);background-color:var(--theme-tab--background--disabled)}:host(.disabled)::after{background-color:var(--theme-tab-indicator--background--disabled)}:host(.selected:not(.disabled)){background-color:var(--theme-tab--background--selected);color:var(--theme-tab--color--selected)}:host(.selected:not(.disabled))::after{background-color:var(--theme-tab-indicator--background--selected)}:host(.icon){padding:1.5rem 0.5rem}:host(.small-tab){height:32px;padding:1rem}:host(.small-tab.icon){padding:1rem 0.25rem}';const l=class{constructor(r){t(this,r);this.tabClick=e(this,"tabClick",7);this.selected=false;this.disabled=false;this.small=false;this.icon=false;this.rounded=false;this.layout="auto";this.placement="bottom"}tabItemClasses(t){return{selected:t.selected,disabled:t.disabled,"small-tab":t.small,icon:t.small,stretched:t.layout==="stretched",bottom:t.placement==="bottom",top:t.placement==="top",circle:t.circle}}render(){return r(o,{key:"fbc797818155b68364410a11c5fe0a001e1e6acc",class:this.tabItemClasses({selected:this.selected,disabled:this.disabled,small:this.small,icon:this.icon,layout:this.layout,placement:this.placement,circle:this.rounded}),tabIndex:0,onClick:t=>{if(t.defaultPrevented)return;const e=this.tabClick.emit({nativeEvent:t});if(e.defaultPrevented){t.stopPropagation()}}},r("div",{key:"98a4a06c0ceb6ef377de6d57ad42054e212fbe37",class:{circle:this.rounded,text:!this.rounded,selected:this.selected,disabled:this.disabled}},r("slot",{key:"d10de085d72f9559891dfd87f9b91f73832c5b46"})),r("div",{key:"6a2c177981af05692249dd17741667a7986ac286",class:{counter:true,selected:this.selected,hidden:!(this.rounded&&this.counter!==undefined),disabled:this.disabled}},this.counter))}};l.style=c;const n=t=>{if(typeof __zone_symbol__requestAnimationFrame==="function"){return __zone_symbol__requestAnimationFrame(t)}if(typeof requestAnimationFrame==="function"){return requestAnimationFrame(t)}return setTimeout(t)};const h=":host{width:auto;display:flex;align-items:center;position:relative}: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{}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host{}: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{}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host{}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .tab-items{overflow:hidden;scroll-behavior:smooth;width:100%}:host .tab-items .items-content{display:flex;align-items:center}:host .arrow{all:unset;position:absolute;display:flex;align-items:center;justify-content:center;width:32px;height:32px;top:0;bottom:0;left:0;margin:auto 0;border-radius:4px;color:var(--theme-btn-tertiary--color);background-color:var(--theme-btn-tertiary--background);z-index:2}:host .arrow:hover{color:var(--theme-btn-tertiary--color--hover);background-color:var(--theme-btn-tertiary--background--hover)}:host .arrow:active{color:var(--theme-btn-tertiary--color--active);background-color:var(--theme-btn-tertiary--background--active)}:host .arrow.right{left:auto;right:0}:host .overflow-shadow{display:block;position:relative;height:100%;width:100%;pointer-events:all}:host .overflow-shadow.shadow-left{-webkit-mask-image:linear-gradient(90deg, transparent 0px, black 45px);mask-image:linear-gradient(90deg, transparent 0px, black 45px)}:host .overflow-shadow.shadow-right{-webkit-mask-image:linear-gradient(90deg, black calc(100% - 45px), transparent 100%);mask-image:linear-gradient(90deg, black calc(100% - 45px), transparent 100%)}:host .overflow-shadow.shadow-both{-webkit-mask-image:linear-gradient(90deg, transparent 0px, black 45px, black calc(100% - 45px), transparent 100%);mask-image:linear-gradient(90deg, transparent 0px, black 45px, black calc(100% - 45px), transparent 100%)}";const d=class{constructor(r){t(this,r);this.selectedChange=e(this,"selectedChange",7);this.small=false;this.rounded=false;this.selected=0;this.layout="auto";this.placement="bottom";this.totalItems=0;this.currentScrollAmount=0;this.scrollAmount=100;this.scrollActionAmount=0;this.showArrowPrevious=false;this.showArrowNext=false;this.windowStartSize=window.innerWidth;this.clickAction={timeout:null,isClick:true}}onWindowResize(){this.totalItems=0;this.totalItems=this.getTabs().length;if(this.windowStartSize===0)return this.windowStartSize=window.innerWidth;this.move(this.windowStartSize-window.innerWidth);this.windowStartSize=window.innerWidth}getTabs(){return Array.from(this.hostElement.querySelectorAll("ix-tab-item"))}getTab(t){return this.getTabs()[t]}getTabsWrapper(){var t;return(t=this.hostElement.shadowRoot)===null||t===void 0?void 0:t.querySelector(".items-content")}initResizeObserver(){const t=this.hostElement.parentElement;if(!t)return;this.resizeObserver=new ResizeObserver((()=>{this.renderArrows()}));this.resizeObserver.observe(t)}showArrows(){try{const t=this.getTabsWrapper();return t&&t.scrollWidth>Math.ceil(t.getBoundingClientRect().width)&&this.layout==="auto"}catch(t){return false}}showPreviousArrow(){try{return this.showArrows()===true&&this.scrollActionAmount<0}catch(t){return false}}showNextArrow(){try{const t=this.getTabsWrapper();if(!t){return false}const e=t.getBoundingClientRect();return this.showArrows()===true&&this.scrollActionAmount>(t.scrollWidth-e.width)*-1}catch(t){return false}}move(t,e=false){const r=this.getTabsWrapper();if(!r){return}const o=r.getBoundingClientRect().width;const a=-this.currentScrollAmount+o-r.scrollWidth;t=t<a?a:t;t+=this.currentScrollAmount;t=Math.min(t,0);const s=[`transform: translateX(${t}px);`,e?"transition: all ease-in-out 400ms;":""].join("");r.setAttribute("style",s);if(e)this.currentScrollAmount=this.scrollActionAmount=t;else this.scrollActionAmount=t}onSelectedChange(t){var e;if(!this.showArrows())return;const r=this.getTab(t).getBoundingClientRect();const o=(e=this.getTabsWrapper())===null||e===void 0?void 0:e.clientWidth;const a=32;if(r.left<a){this.move(-r.left+a,true)}else if(o&&r.right>o-a){this.move(o-r.right-a,true)}}setSelected(t){this.selected=t}clickTab(t){if(!this.clickAction.isClick||this.dragStop()){return}const{defaultPrevented:e}=this.selectedChange.emit(t);if(e){return}this.setSelected(t)}dragStart(t,e){if(!this.showArrows())return;if(e.button>0)return;this.clickAction.timeout=this.clickAction.timeout===null?setTimeout((()=>this.clickAction.isClick=false),300):null;const r=parseFloat(window.getComputedStyle(t).left);const o=e.clientX;const a=t=>this.dragMove(t,r,o);const s=()=>{window.removeEventListener("mousemove",a,false);window.removeEventListener("click",s,false);this.dragStop()};window.addEventListener("click",s);window.addEventListener("mousemove",a,false)}dragMove(t,e,r){this.move(t.clientX+e-r)}dragStop(){if(this.clickAction.timeout){clearTimeout(this.clickAction.timeout);this.clickAction.timeout=null}if(this.clickAction.isClick)return false;this.currentScrollAmount=this.scrollActionAmount;this.clickAction.isClick=true;return true}componentWillLoad(){const t=this.getTabs();t.map(((t,e)=>{if(this.small)t.setAttribute("small","true");if(this.rounded)t.setAttribute("rounded","true");t.setAttribute("layout",this.layout);t.setAttribute("selected",e===this.selected?"true":"false");t.setAttribute("placement",this.placement)}));this.initResizeObserver()}componentDidRender(){const t=this.getTabs();this.totalItems=t.length;t.map(((t,e)=>{t.setAttribute("selected",e===this.selected?"true":"false")}))}componentWillRender(){this.renderArrows()}renderArrows(){n((()=>{this.showArrowNext=this.showNextArrow();this.showArrowPrevious=this.showPreviousArrow()}))}componentDidLoad(){const t=this.getTabs();t.forEach((t=>{t.addEventListener("mousedown",(e=>this.dragStart(t,e)))}))}disconnectedCallback(){var t;(t=this.resizeObserver)===null||t===void 0?void 0:t.disconnect()}onTabClick(t){if(t.defaultPrevented){return}const e=t.target;const r=this.getTabs();r.forEach(((t,r)=>{if(!t.disabled&&t===e){this.clickTab(r)}}))}render(){return r(o,{key:"294d6eeab98bd88c83883202998e84542a4a0a7f"},this.showArrowPrevious&&r("button",{key:"13364839e49d3b69e11fbe13bb4d01d5ff36ec65",class:"arrow",onClick:()=>this.move(this.scrollAmount,true),"aria-label":this.ariaLabelChevronLeftIconButton},r("ix-icon",{key:"e3bb3d3ec0652668623d141a72f7f0e476610462",name:i})),r("div",{key:"8f816e05deec80a1d823412551d1ba8e321e33ca",class:{"tab-items":true,"overflow-shadow":true,"shadow-left":this.showArrowPrevious,"shadow-right":this.showArrowNext,"shadow-both":this.showArrowNext&&this.showArrowPrevious}},r("div",{key:"0a36bc2b2d01a5b230ecb7f328c9499ecf8abe62",class:"items-content"},r("slot",{key:"4a91177c0ef4f293ba77e74d237c578846b62f95"}))),this.showArrowNext&&r("button",{key:"37ecc7f36ae5496c981bfc59a0f727ccecb38a5d",class:"arrow right",onClick:()=>this.move(-this.scrollAmount,true),"aria-label":this.ariaLabelChevronRightIconButton},r("ix-icon",{key:"aeecd541a82721742b91051b8289a189e9b3e88d",name:s})))}get hostElement(){return a(this)}static get watchers(){return{selected:["onSelectedChange"]}}};d.style=h;export{l as ix_tab_item,d as ix_tabs};
|
|
2
|
+
//# sourceMappingURL=p-f55c3bed.entry.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["registerInstance","createEvent","h","Host","getElement","iconChevronRightSmall","iconChevronLeftSmall","tabItemCss","TabItem","constructor","hostRef","this","tabClick","selected","disabled","small","icon","rounded","layout","placement","tabItemClasses","props","stretched","bottom","top","circle","render","key","class","tabIndex","onClick","event","defaultPrevented","clientEvent","emit","nativeEvent","stopPropagation","text","counter","hidden","undefined","style","requestAnimationFrameNoNgZone","callback","__zone_symbol__requestAnimationFrame","requestAnimationFrame","setTimeout","tabsCss","Tabs","selectedChange","totalItems","currentScrollAmount","scrollAmount","scrollActionAmount","showArrowPrevious","showArrowNext","windowStartSize","window","innerWidth","clickAction","timeout","isClick","onWindowResize","getTabs","length","move","Array","from","hostElement","querySelectorAll","getTab","getTabsWrapper","_a","shadowRoot","querySelector","initResizeObserver","parentElement","resizeObserver","ResizeObserver","renderArrows","observe","showArrows","tabWrapper","scrollWidth","Math","ceil","getBoundingClientRect","width","error","showPreviousArrow","showNextArrow","tabWrapperRect","amount","click","tabsWrapper","tabsWrapperVisibleWidth","maxScrollWidth","min","styles","join","setAttribute","onSelectedChange","newValue","tabRect","wrapperWidth","clientWidth","arrowWidth","left","right","setSelected","index","clickTab","dragStop","dragStart","element","button","tabPositionX","parseFloat","getComputedStyle","mousedownPositionX","clientX","dragMove","windowClick","removeEventListener","addEventListener","tabX","mousedownX","clearTimeout","componentWillLoad","tabs","map","componentDidRender","componentWillRender","componentDidLoad","forEach","disconnectedCallback","disconnect","onTabClick","target","tab","ariaLabelChevronLeftIconButton","name","ariaLabelChevronRightIconButton","watchers"],"sources":["0"],"mappings":"YAAcA,OAAuBC,OAAaC,OAAQC,OAAWC,MAAkB,8BACzEC,OAA4BC,MAA4B,kBAEtE,MAAMC,EAAa,
|
|
1
|
+
{"version":3,"names":["registerInstance","createEvent","h","Host","getElement","iconChevronRightSmall","iconChevronLeftSmall","tabItemCss","TabItem","constructor","hostRef","this","tabClick","selected","disabled","small","icon","rounded","layout","placement","tabItemClasses","props","stretched","bottom","top","circle","render","key","class","tabIndex","onClick","event","defaultPrevented","clientEvent","emit","nativeEvent","stopPropagation","text","counter","hidden","undefined","style","requestAnimationFrameNoNgZone","callback","__zone_symbol__requestAnimationFrame","requestAnimationFrame","setTimeout","tabsCss","Tabs","selectedChange","totalItems","currentScrollAmount","scrollAmount","scrollActionAmount","showArrowPrevious","showArrowNext","windowStartSize","window","innerWidth","clickAction","timeout","isClick","onWindowResize","getTabs","length","move","Array","from","hostElement","querySelectorAll","getTab","getTabsWrapper","_a","shadowRoot","querySelector","initResizeObserver","parentElement","resizeObserver","ResizeObserver","renderArrows","observe","showArrows","tabWrapper","scrollWidth","Math","ceil","getBoundingClientRect","width","error","showPreviousArrow","showNextArrow","tabWrapperRect","amount","click","tabsWrapper","tabsWrapperVisibleWidth","maxScrollWidth","min","styles","join","setAttribute","onSelectedChange","newValue","tabRect","wrapperWidth","clientWidth","arrowWidth","left","right","setSelected","index","clickTab","dragStop","dragStart","element","button","tabPositionX","parseFloat","getComputedStyle","mousedownPositionX","clientX","dragMove","windowClick","removeEventListener","addEventListener","tabX","mousedownX","clearTimeout","componentWillLoad","tabs","map","componentDidRender","componentWillRender","componentDidLoad","forEach","disconnectedCallback","disconnect","onTabClick","target","tab","ariaLabelChevronLeftIconButton","name","ariaLabelChevronRightIconButton","watchers"],"sources":["0"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"p-q1WCgUmY.js","sources":["src/components/input/input.fc.tsx","src/components/input/input.animation.ts","src/components/input/input.util.ts"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\nimport { h, FunctionalComponent } from '@stencil/core';\nimport { MakeRef } from '../utils/make-ref';\nimport { A11yAttributes } from '../utils/a11y';\n\nexport function TextareaElement(\n props: Readonly<{\n resizeBehavior: 'both' | 'horizontal' | 'vertical' | 'none';\n textareaHeight?: string;\n textareaWidth?: string;\n textareaRows?: number;\n textareaCols?: number;\n disabled: boolean;\n readonly: boolean;\n maxLength?: number;\n minLength?: number;\n isInvalid: boolean;\n required: boolean;\n value: string;\n placeholder?: string;\n textAreaRef: (el: HTMLTextAreaElement | undefined) => void;\n valueChange: (value: string) => void;\n updateFormInternalValue: (value: string) => void;\n onBlur: () => void;\n ariaAttributes?: A11yAttributes;\n }>\n) {\n return (\n <textarea\n readOnly={props.readonly}\n disabled={props.disabled}\n maxLength={props.maxLength}\n minLength={props.minLength}\n cols={props.textareaCols}\n rows={props.textareaRows}\n ref={props.textAreaRef}\n class={{\n 'is-invalid': props.isInvalid,\n }}\n required={props.required}\n value={props.value}\n placeholder={props.placeholder}\n onInput={(inputEvent) => {\n const target = inputEvent.target as HTMLInputElement;\n props.updateFormInternalValue(target.value);\n props.valueChange(target.value);\n }}\n onBlur={() => props.onBlur()}\n style={{\n resize: props.resizeBehavior,\n height: props.textareaHeight,\n width: props.textareaWidth,\n }}\n {...props.ariaAttributes}\n ></textarea>\n );\n}\n\nexport function InputElement(\n props: Readonly<{\n id: string;\n disabled: boolean;\n readonly: boolean;\n maxLength?: string | number;\n minLength?: string | number;\n max?: string | number;\n min?: string | number;\n step?: string | number;\n pattern?: string;\n type: string;\n isInvalid: boolean;\n required: boolean;\n value: string | number;\n placeholder?: string;\n inputRef: (el: HTMLInputElement | undefined) => void;\n onKeyPress: (event: KeyboardEvent) => void;\n valueChange: (value: string) => void;\n updateFormInternalValue: (value: string) => void;\n onBlur: () => void;\n ariaAttributes?: A11yAttributes;\n }>\n) {\n return (\n <input\n id={props.id}\n autoComplete=\"off\"\n readOnly={props.readonly}\n disabled={props.disabled}\n step={props.step}\n min={props.min}\n max={props.max}\n maxLength={props.maxLength ? Number(props.maxLength) : undefined}\n minLength={props.minLength ? Number(props.minLength) : undefined}\n ref={props.inputRef}\n pattern={props.pattern}\n type={props.type}\n class={{\n 'is-invalid': props.isInvalid,\n }}\n required={props.required}\n value={props.value}\n placeholder={props.placeholder}\n onKeyPress={(event) => props.onKeyPress(event)}\n onInput={(inputEvent) => {\n const target = inputEvent.target as HTMLInputElement;\n props.updateFormInternalValue(target.value);\n props.valueChange(target.value);\n }}\n onBlur={() => props.onBlur()}\n {...props.ariaAttributes}\n ></input>\n );\n}\n\nexport const SlotEnd: FunctionalComponent<{\n slotEndRef: MakeRef<HTMLDivElement>;\n onSlotChange?: (e: Event) => void;\n}> = (props, children) => {\n return (\n <div class=\"end-container\" ref={props.slotEndRef}>\n <slot name=\"end\" onSlotchange={props.onSlotChange}></slot>\n {children}\n </div>\n );\n};\n\nexport const SlotStart: FunctionalComponent<{\n slotStartRef: MakeRef<HTMLDivElement>;\n onSlotChange?: (e: Event) => void;\n}> = (props) => {\n return (\n <div class=\"start-container\" ref={props.slotStartRef}>\n <slot name=\"start\" onSlotchange={props.onSlotChange}></slot>\n </div>\n );\n};\n","/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\nimport { animate } from 'animejs';\nimport Animation from '../utils/animation';\n\nexport function shakeInput(input: HTMLInputElement) {\n const xMax = 5;\n animate(input, {\n duration: Animation.defaultTime,\n easing: 'easeInOutSine',\n loop: 2,\n translateX: [\n {\n value: xMax * -1,\n },\n {\n value: xMax,\n },\n {\n value: xMax / -2,\n },\n {\n value: xMax / 2,\n },\n {\n value: 0,\n },\n ],\n });\n}\n","/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { A11yAttributes, a11yBoolean } from '../utils/a11y';\nimport {\n IxFormComponent,\n IxInputFieldComponent,\n ValidationResults,\n shouldSuppressInternalValidation,\n} from '../utils/input';\nimport { createMutationObserver } from '../utils/mutation-observer';\nimport { convertToRemString } from '../utils/rwd.util';\nimport { generateUUID } from '../utils/uuid';\nimport { shakeInput } from './input.animation';\n\nexport function createIdIfNotExists(\n element: IxFormComponent,\n idPrefix: string = 'input'\n) {\n return element.hasAttribute('id')\n ? element.getAttribute('id')\n : `${idPrefix}-${generateUUID()}`;\n}\n\nexport function mapValidationResult<T>(\n ref: IxInputFieldComponent<T>,\n result: ValidationResults\n) {\n ref.isInvalid = result.isInvalid || result.isInvalidByRequired;\n ref.isValid = result.isValid;\n ref.isInfo = result.isInfo;\n ref.isWarning = result.isWarning;\n}\n\nexport function checkAllowedKeys<T>(\n comp: IxInputFieldComponent<T>,\n event: KeyboardEvent\n) {\n if (comp.allowedCharactersPattern) {\n const regex = new RegExp(comp.allowedCharactersPattern);\n if (!regex.test(event.key)) {\n event.preventDefault();\n shakeInput(comp.inputRef.current);\n }\n }\n}\n\nexport async function checkInternalValidity<T>(\n comp: IxFormComponent<T>,\n input: HTMLInputElement | HTMLTextAreaElement\n) {\n const validityState = input.validity;\n\n const eventResult = comp.validityStateChange.emit(validityState);\n\n if (eventResult.defaultPrevented) {\n return;\n }\n\n if (comp.value === null || comp.value === undefined) {\n return;\n }\n\n const skipValidation = await shouldSuppressInternalValidation(comp);\n if (skipValidation) {\n return;\n }\n\n const { valid } = validityState;\n comp.hostElement.classList.toggle('ix-invalid--validity-invalid', !valid);\n}\n\nexport function onInputBlur<T>(\n comp: IxFormComponent<T>,\n input?: HTMLInputElement | HTMLTextAreaElement | null\n) {\n comp.ixBlur.emit();\n\n if (!input) {\n throw new Error('Input element is not available');\n }\n\n input.setAttribute('data-ix-touched', 'true');\n checkInternalValidity(comp, input);\n}\n\nexport function applyPaddingEnd(\n inputElement: HTMLElement | null,\n width: number,\n options: {\n slotEnd: boolean;\n additionalPaddingRight?: string;\n }\n) {\n if (!inputElement) {\n return;\n }\n\n const remInPixels = 16;\n const padding = convertToRemString(width + remInPixels / 2);\n\n if (options.slotEnd) {\n inputElement.style.paddingRight = `calc(${padding} + ${\n options.additionalPaddingRight ?? '0rem'\n })`;\n } else {\n inputElement.style.paddingLeft = padding;\n }\n}\n\nexport function adjustPaddingForStartAndEnd(\n startElement: HTMLElement | null,\n endElement: HTMLElement | null,\n inputElement: HTMLElement | null\n) {\n requestAnimationFrame(() => {\n requestAnimationFrame(() => {\n if (startElement) {\n const startBoundingRect = startElement.getBoundingClientRect();\n if (startBoundingRect) {\n applyPaddingEnd(inputElement, startBoundingRect.width, {\n slotEnd: false,\n });\n }\n }\n\n if (endElement) {\n const endBoundingRect = endElement.getBoundingClientRect();\n if (endBoundingRect) {\n applyPaddingEnd(inputElement, endBoundingRect.width, {\n slotEnd: true,\n });\n }\n }\n });\n });\n}\n\nexport function getAriaAttributesForInput(\n component: IxInputFieldComponent\n): A11yAttributes {\n const inputAria: A11yAttributes = {\n 'aria-invalid': `${a11yBoolean(component.isInvalid)}`,\n 'aria-required': `${a11yBoolean(component.required)}`,\n };\n\n if (component.isInvalid && component.invalidText) {\n inputAria['aria-errormessage'] = component.invalidText;\n }\n return inputAria;\n}\n\nexport type DisposableChangesAndVisibilityObservers = () => void;\n\nexport const addDisposableChangesAndVisibilityObservers = (\n element: HTMLElement,\n callback: () => void\n): DisposableChangesAndVisibilityObservers => {\n const intersectionObserver = observeElementUntilVisible(element, callback);\n const mutationObserver = createMutationObserver(callback);\n\n mutationObserver.observe(element, {\n subtree: true,\n attributes: true,\n });\n\n return () => {\n intersectionObserver.disconnect();\n mutationObserver.disconnect();\n };\n};\n\nfunction observeElementUntilVisible(\n hostElement: HTMLElement,\n updateCallback: () => void\n): IntersectionObserver {\n const intersectionObserver = new IntersectionObserver((entries) => {\n entries.forEach((entry) => {\n if (entry.isIntersecting) {\n updateCallback();\n }\n });\n });\n\n intersectionObserver.observe(hostElement);\n return intersectionObserver;\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"p-q1WCgUmY.js","sources":["src/components/input/input.fc.tsx","src/components/input/input.animation.ts","src/components/input/input.util.ts"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\nimport { FunctionalComponent, h } from '@stencil/core';\nimport { A11yAttributes } from '../utils/a11y';\nimport { MakeRef } from '../utils/make-ref';\n\nexport function TextareaElement(\n props: Readonly<{\n resizeBehavior: 'both' | 'horizontal' | 'vertical' | 'none';\n textareaHeight?: string;\n textareaWidth?: string;\n textareaRows?: number;\n textareaCols?: number;\n disabled: boolean;\n readonly: boolean;\n maxLength?: number;\n minLength?: number;\n isInvalid: boolean;\n required: boolean;\n value: string;\n placeholder?: string;\n textAreaRef: (el: HTMLTextAreaElement | undefined) => void;\n valueChange: (value: string) => void;\n updateFormInternalValue: (value: string) => void;\n onBlur: () => void;\n ariaAttributes?: A11yAttributes;\n }>\n) {\n return (\n <textarea\n readOnly={props.readonly}\n disabled={props.disabled}\n maxLength={props.maxLength}\n minLength={props.minLength}\n cols={props.textareaCols}\n rows={props.textareaRows}\n ref={props.textAreaRef}\n class={{\n 'is-invalid': props.isInvalid,\n }}\n required={props.required}\n value={props.value}\n placeholder={props.placeholder}\n onInput={(inputEvent) => {\n const target = inputEvent.target as HTMLInputElement;\n props.updateFormInternalValue(target.value);\n props.valueChange(target.value);\n }}\n onBlur={() => props.onBlur()}\n style={{\n resize: props.resizeBehavior,\n height: props.textareaHeight,\n width: props.textareaWidth,\n }}\n {...props.ariaAttributes}\n ></textarea>\n );\n}\n\nexport function InputElement(\n props: Readonly<{\n id: string;\n disabled: boolean;\n readonly: boolean;\n maxLength?: string | number;\n minLength?: string | number;\n max?: string | number;\n min?: string | number;\n step?: string | number;\n pattern?: string;\n type: string;\n isInvalid: boolean;\n required: boolean;\n value: string | number;\n placeholder?: string;\n inputRef: (el: HTMLInputElement | undefined) => void;\n onKeyPress: (event: KeyboardEvent) => void;\n valueChange: (value: string) => void;\n updateFormInternalValue: (value: string) => void;\n onBlur: () => void;\n ariaAttributes?: A11yAttributes;\n }>\n) {\n return (\n <input\n id={props.id}\n autoComplete=\"off\"\n readOnly={props.readonly}\n disabled={props.disabled}\n step={props.step}\n min={props.min}\n max={props.max}\n maxLength={props.maxLength ? Number(props.maxLength) : undefined}\n minLength={props.minLength ? Number(props.minLength) : undefined}\n ref={props.inputRef}\n pattern={props.pattern}\n type={props.type}\n class={{\n 'is-invalid': props.isInvalid,\n }}\n required={props.required}\n value={props.value}\n placeholder={props.placeholder}\n onKeyPress={(event) => props.onKeyPress(event)}\n onInput={(inputEvent) => {\n const target = inputEvent.target as HTMLInputElement;\n props.updateFormInternalValue(target.value);\n props.valueChange(target.value);\n }}\n onBlur={() => props.onBlur()}\n {...props.ariaAttributes}\n ></input>\n );\n}\n\nexport const SlotEnd: FunctionalComponent<{\n slotEndRef: MakeRef<HTMLDivElement>;\n onSlotChange?: (e: Event) => void;\n}> = (props, children) => {\n return (\n <div class=\"end-container\" ref={props.slotEndRef}>\n <slot name=\"end\" onSlotchange={props.onSlotChange}></slot>\n {children}\n </div>\n );\n};\n\nexport const SlotStart: FunctionalComponent<{\n slotStartRef: MakeRef<HTMLDivElement>;\n onSlotChange?: (e: Event) => void;\n}> = (props) => {\n return (\n <div class=\"start-container\" ref={props.slotStartRef}>\n <slot name=\"start\" onSlotchange={props.onSlotChange}></slot>\n </div>\n );\n};\n","/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\nimport { animate } from 'animejs';\nimport Animation from '../utils/animation';\n\nexport function shakeInput(input: HTMLInputElement) {\n const xMax = 5;\n animate(input, {\n duration: Animation.defaultTime,\n easing: 'easeInOutSine',\n loop: 2,\n translateX: [\n {\n value: xMax * -1,\n },\n {\n value: xMax,\n },\n {\n value: xMax / -2,\n },\n {\n value: xMax / 2,\n },\n {\n value: 0,\n },\n ],\n });\n}\n","/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { A11yAttributes, a11yBoolean } from '../utils/a11y';\nimport {\n IxFormComponent,\n IxInputFieldComponent,\n ValidationResults,\n shouldSuppressInternalValidation,\n} from '../utils/input';\nimport { createMutationObserver } from '../utils/mutation-observer';\nimport { convertToRemString } from '../utils/rwd.util';\nimport { generateUUID } from '../utils/uuid';\nimport { shakeInput } from './input.animation';\n\nexport function createIdIfNotExists(\n element: IxFormComponent,\n idPrefix: string = 'input'\n) {\n return element.hasAttribute('id')\n ? element.getAttribute('id')\n : `${idPrefix}-${generateUUID()}`;\n}\n\nexport function mapValidationResult<T>(\n ref: IxInputFieldComponent<T>,\n result: ValidationResults\n) {\n ref.isInvalid = result.isInvalid || result.isInvalidByRequired;\n ref.isValid = result.isValid;\n ref.isInfo = result.isInfo;\n ref.isWarning = result.isWarning;\n}\n\nexport function checkAllowedKeys<T>(\n comp: IxInputFieldComponent<T>,\n event: KeyboardEvent\n) {\n if (comp.allowedCharactersPattern) {\n const regex = new RegExp(comp.allowedCharactersPattern);\n if (!regex.test(event.key)) {\n event.preventDefault();\n shakeInput(comp.inputRef.current);\n }\n }\n}\n\nexport async function checkInternalValidity<T>(\n comp: IxFormComponent<T>,\n input: HTMLInputElement | HTMLTextAreaElement\n) {\n const validityState = input.validity;\n\n const eventResult = comp.validityStateChange.emit(validityState);\n\n if (eventResult.defaultPrevented) {\n return;\n }\n\n if (comp.value === null || comp.value === undefined) {\n return;\n }\n\n const skipValidation = await shouldSuppressInternalValidation(comp);\n if (skipValidation) {\n return;\n }\n\n const { valid } = validityState;\n comp.hostElement.classList.toggle('ix-invalid--validity-invalid', !valid);\n}\n\nexport function onInputBlur<T>(\n comp: IxFormComponent<T>,\n input?: HTMLInputElement | HTMLTextAreaElement | null\n) {\n comp.ixBlur.emit();\n\n if (!input) {\n throw new Error('Input element is not available');\n }\n\n input.setAttribute('data-ix-touched', 'true');\n checkInternalValidity(comp, input);\n}\n\nexport function applyPaddingEnd(\n inputElement: HTMLElement | null,\n width: number,\n options: {\n slotEnd: boolean;\n additionalPaddingRight?: string;\n }\n) {\n if (!inputElement) {\n return;\n }\n\n const remInPixels = 16;\n const padding = convertToRemString(width + remInPixels / 2);\n\n if (options.slotEnd) {\n inputElement.style.paddingRight = `calc(${padding} + ${\n options.additionalPaddingRight ?? '0rem'\n })`;\n } else {\n inputElement.style.paddingLeft = padding;\n }\n}\n\nexport function adjustPaddingForStartAndEnd(\n startElement: HTMLElement | null,\n endElement: HTMLElement | null,\n inputElement: HTMLElement | null\n) {\n requestAnimationFrame(() => {\n requestAnimationFrame(() => {\n if (startElement) {\n const startBoundingRect = startElement.getBoundingClientRect();\n if (startBoundingRect) {\n applyPaddingEnd(inputElement, startBoundingRect.width, {\n slotEnd: false,\n });\n }\n }\n\n if (endElement) {\n const endBoundingRect = endElement.getBoundingClientRect();\n if (endBoundingRect) {\n applyPaddingEnd(inputElement, endBoundingRect.width, {\n slotEnd: true,\n });\n }\n }\n });\n });\n}\n\nexport function getAriaAttributesForInput(\n component: IxInputFieldComponent\n): A11yAttributes {\n const inputAria: A11yAttributes = {\n 'aria-invalid': `${a11yBoolean(component.isInvalid)}`,\n 'aria-required': `${a11yBoolean(component.required)}`,\n };\n\n if (component.isInvalid && component.invalidText) {\n inputAria['aria-errormessage'] = component.invalidText;\n }\n return inputAria;\n}\n\nexport type DisposableChangesAndVisibilityObservers = () => void;\n\nexport const addDisposableChangesAndVisibilityObservers = (\n element: HTMLElement,\n callback: () => void\n): DisposableChangesAndVisibilityObservers => {\n const intersectionObserver = observeElementUntilVisible(element, callback);\n const mutationObserver = createMutationObserver(callback);\n\n mutationObserver.observe(element, {\n subtree: true,\n attributes: true,\n });\n\n return () => {\n intersectionObserver.disconnect();\n mutationObserver.disconnect();\n };\n};\n\nfunction observeElementUntilVisible(\n hostElement: HTMLElement,\n updateCallback: () => void\n): IntersectionObserver {\n const intersectionObserver = new IntersectionObserver((entries) => {\n entries.forEach((entry) => {\n if (entry.isIntersecting) {\n updateCallback();\n }\n });\n });\n\n intersectionObserver.observe(hostElement);\n return intersectionObserver;\n}\n"],"names":[],"mappings":"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"}
|