@public-ui/components 1.5.0 → 1.5.1

package/dist/components/component.js.map

@@ -1 +1 @@
-{"file":"component.js","mappings":"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","names":[],"sources":["./src/types/button-link.ts","./src/components/tooltip/style.css?tag=kol-tooltip&mode=default","./src/components/tooltip/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { Events } from '../enums/events';\nimport { watchValidator } from '../utils/prop.validators';\nimport { EventCallback, EventValueOrEventCallback } from './callbacks';\nimport { Stringified } from './common';\nimport { KoliBriAllIcon, KoliBriIconProp } from './icon';\nimport { Alignment, PropAriaCurrent, PropAriaExpanded, PropAriaSelected, PropDisabled, PropDownload, PropLabel, PropStealth } from './props';\n\nexport type AlternativButtonLinkRole = 'button' | 'link' | 'tab';\n\n/**\n * https://twitter.com/housecor/status/1541037184622403584?t=HoUiOAZEcXFeuDl-VWAEZg\n * https://mui.com/material-ui/react-link/#accessibility\n * https://mui.com/material-ui/react-button/#text-button\n */\ntype RequiredButtonAndLinkProps = PropLabel;\ntype OptionalButtonAndLinkProps = {\n\tariaControls: string;\n\tariaLabel: string;\n\ticon: Stringified<KoliBriIconProp>;\n\t/**\n\t * @deprecated\n\t */\n\ticonAlign: Alignment;\n\ticonOnly: boolean;\n\trole: AlternativButtonLinkRole;\n\ttabIndex: number;\n\ttooltipAlign: Alignment;\n} & PropAriaCurrent &\n\tPropAriaExpanded &\n\tPropAriaSelected &\n\tPropDisabled;\n\ntype RequiredButtonAndLinkStates = {\n\ticon: KoliBriAllIcon;\n\tlabel: string;\n};\ntype OptionalButtonAndLinkStates = {\n\tariaLabel: string;\n\tariaControls: string;\n\t/**\n\t * @deprecated\n\t */\n\ticonAlign: Alignment;\n\ticonOnly: boolean;\n\trole: AlternativButtonLinkRole;\n\ttabIndex: number;\n\ttooltipAlign: Alignment;\n} & PropAriaCurrent &\n\tPropAriaExpanded &\n\tPropAriaSelected &\n\tPropDisabled;\n\n/**\n * Button\n */\nexport type KoliBriButtonType = 'button' | 'reset' | 'submit';\nexport type KoliBriButtonVariant = 'primary' | 'secondary' | 'normal' | 'danger' | 'ghost' | 'custom';\n\nexport type KoliBriButtonCallbacks<T> = {\n\t[Events.onClick]?: EventValueOrEventCallback<MouseEvent, T>;\n\t[Events.onMouseDown]?: EventCallback<MouseEvent>;\n};\n\nexport type KoliBriButtonVariantPropState = {\n\tvariant: KoliBriButtonVariant;\n};\nexport type KoliBriButtonCustomClassPropState = {\n\tcustomClass: string;\n};\n\n/**\n * API ButtonLink\n */\nexport type RequiredButtonLinkProps = RequiredButtonAndLinkProps;\nexport type OptionalButtonLinkProps = OptionalButtonAndLinkProps & {\n\t/**\n\t * @deprecated Zweck?!\n\t */\n\taccessKey: string;\n\tdisabled: boolean;\n\tid: string;\n\ton: KoliBriButtonCallbacks<unknown>;\n\ttype: KoliBriButtonType;\n\tvalue: Stringified<unknown>;\n};\n// type ButtonLinkProps = Generic.Element.Members<RequiredButtonProps, OptionalButtonProps>;\n\ntype RequiredButtonLinkStates = RequiredButtonAndLinkStates &\n\tKoliBriButtonVariantPropState & {\n\t\ttype: KoliBriButtonType;\n\t};\ntype OptionalButtonLinkStates = OptionalButtonAndLinkStates &\n\tKoliBriButtonCustomClassPropState & {\n\t\t/**\n\t\t * @deprecated Zweck?!\n\t\t */\n\t\taccessKey: string;\n\t\tdisabled: boolean;\n\t\tid: string;\n\t\ton: KoliBriButtonCallbacks<unknown>;\n\t\tvalue: unknown;\n\t};\n// type ButtonLinkStates = Generic.Element.Members<RequiredButtonStates, OptionalButtonStates>;\n\n/**\n * API Button\n */\nexport type RequiredButtonProps = RequiredButtonLinkProps;\nexport type OptionalButtonProps = OptionalButtonLinkProps & KoliBriButtonVariantPropState & KoliBriButtonCustomClassPropState;\nexport type ButtonProps = Generic.Element.Members<RequiredButtonProps, OptionalButtonProps>;\n\nexport type RequiredButtonStates = RequiredButtonLinkStates & KoliBriButtonVariantPropState;\nexport type OptionalButtonStates = OptionalButtonLinkStates & KoliBriButtonCustomClassPropState;\nexport type ButtonStates = Generic.Element.Members<RequiredButtonStates, OptionalButtonStates>;\n\n/* LINK */\n\n/**\n * @deprecated Link should not use the on-click event. Use a button instead.\n */\nexport type LinkOnCallbacks = {\n\t[Events.onClick]?: EventValueOrEventCallback<Event, string>;\n};\n\n// https://www.w3schools.com/tags/att_a_target.asp\nexport type LinkTarget = '_blank' | '_parent' | '_self' | '_top' | string;\n\nexport type LinkUseCase = 'text' | 'image' | 'nav';\n\n/**\n * API Link\n */\nexport type RequiredLinkProps = RequiredButtonAndLinkProps & {\n\thref: string;\n};\nexport type OptionalLinkProps = OptionalButtonAndLinkProps & {\n\t/**\n\t * @deprecated A link could never be disabled. Use a button instead.\n\t */\n\tdisabled: boolean;\n\t/**\n\t * @deprecated We use the on-click event only on buttons styled as link.\n\t */\n\ton: LinkOnCallbacks;\n\t/**\n\t * @deprecated Das Styling sollte stets über CSS erfolgen.\n\t */\n\tselector: string;\n\t/**\n\t * @deprecated Das Styling sollte stets über CSS erfolgen.\n\t */\n\ttarget: LinkTarget;\n\ttargetDescription: string;\n\t/**\n\t * @deprecated Das Styling sollte stets über CSS erfolgen.\n\t */\n\tuseCase: LinkUseCase;\n} & PropDownload &\n\tPropStealth;\nexport type LinkProps = Generic.Element.Members<RequiredLinkProps, OptionalLinkProps>;\n\nexport type RequiredLinkStates = RequiredButtonAndLinkStates & {\n\thref: string;\n};\nexport type OptionalLinkStates = OptionalButtonAndLinkStates & {\n\tariaSelected: boolean;\n\t/**\n\t * @deprecated We use the on-click event only on buttons styled as link.\n\t */\n\ton: LinkOnCallbacks;\n\t/**\n\t * @deprecated Das Styling sollte stets über CSS erfolgen.\n\t */\n\tselector: string;\n\t/**\n\t * @deprecated Das Styling sollte stets über CSS erfolgen.\n\t */\n\ttarget: LinkTarget;\n\ttargetDescription: string;\n\t/**\n\t * @deprecated Das Styling sollte stets über CSS erfolgen.\n\t */\n\tuseCase: LinkUseCase;\n} & PropAriaSelected &\n\tPropDownload &\n\tPropStealth;\nexport type LinkStates = Generic.Element.Members<RequiredLinkStates, OptionalLinkStates>;\n\n/**\n * API LinkButton\n */\nexport type RequiredLinkButtonProps = RequiredLinkProps;\nexport type OptionalLinkButtonProps = OptionalLinkProps & KoliBriButtonVariantPropState & KoliBriButtonCustomClassPropState;\n// type LinkButtonProps = Generic.Element.Members<RequiredLinkButtonProps, OptionalLinkButtonProps>;\n\n// type RequiredLinkButtonStates = KoliBriButtonVariantPropState;\n// type OptionalLinkButtonStates = KoliBriButtonCustomClassPropState;\n// type LinkButtonStates = Generic.Element.Members<RequiredLinkButtonStates, OptionalLinkButtonStates>;\n\nexport const watchTooltipAlignment = (component: Generic.Element.Component, propName: string, value?: Alignment): void => {\n\twatchValidator(\n\t\tcomponent,\n\t\tpropName,\n\t\t(value) => value === 'top' || value === 'right' || value === 'bottom' || value === 'left',\n\t\tnew Set(['Alignment {top, right, buttom, left}']),\n\t\tvalue,\n\t\t{\n\t\t\tdefaultValue: 'top',\n\t\t}\n\t);\n};\n","@import url(../style.css);\nkol-tooltip #floating {\n\tanimation-duration: 0.5s;\n\tanimation-iteration-count: 1;\n\tanimation-name: fadeInOpacity;\n\tanimation-timing-function: ease-in;\n\tbox-sizing: border-box;\n\tdisplay: none;\n\tposition: absolute;\n\tvisibility: hidden;\n}\nkol-tooltip #arrow {\n\theight: 10px;\n\tposition: absolute;\n\ttransform: rotate(45deg);\n\twidth: 10px;\n\tz-index: 999;\n}\nkol-tooltip .area {\n\tbackground-color: #fff;\n\tcolor: #000;\n}\nkol-tooltip kol-span-wc {\n\tposition: relative;\n\tz-index: 1000;\n}\n@keyframes fadeInOpacity {\n\t0% {\n\t\topacity: 0;\n\t}\n\t100% {\n\t\topacity: 1;\n\t}\n}\n","import { arrow, computePosition, flip, offset, shift } from '@floating-ui/dom';\nimport { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { watchTooltipAlignment } from '../../types/button-link';\nimport { Alignment } from '../../types/props';\nimport { getDocument, nonce } from '../../utils/dev.utils';\nimport { watchString } from '../../utils/prop.validators';\nimport { processEnv } from '../../utils/reuse';\n\ntype RequiredProps = {\n\tid: string;\n\tlabel: string;\n};\ntype OptionalProps = {\n\talign: Alignment;\n};\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = RequiredProps & OptionalProps;\ntype OptionalStates = unknown;\nexport type States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n@Component({\n\ttag: 'kol-tooltip',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: false,\n})\nexport class KolTooltip implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\tprivate previousSibling?: HTMLElement | null;\n\tprivate tooltipElement?: HTMLDivElement;\n\tprivate arrowElement?: HTMLDivElement;\n\n\tprivate alignTooltip = (cb?: () => void): void => {\n\t\tif (processEnv !== 'test' && this.previousSibling /* SSR instanceof HTMLElement */ && this.tooltipElement /* SSR instanceof HTMLElement */) {\n\t\t\tconst target = this.previousSibling;\n\t\t\tconst tooltipEl = this.tooltipElement;\n\t\t\tconst arrowEl = this.arrowElement;\n\n\t\t\tconst middleware = [offset(arrowEl?.offsetHeight ?? 10), flip(), shift()];\n\t\t\tif (arrowEl) {\n\t\t\t\tmiddleware.push(arrow({ element: arrowEl }));\n\t\t\t}\n\n\t\t\tvoid computePosition(target, tooltipEl, {\n\t\t\t\tplacement: this.state._align,\n\t\t\t\tmiddleware: middleware,\n\t\t\t}).then(({ x, y, middlewareData, placement }) => {\n\t\t\t\tconst oldPos = {\n\t\t\t\t\tleft: tooltipEl.style.left,\n\t\t\t\t\ttop: tooltipEl.style.top,\n\t\t\t\t};\n\t\t\t\tObject.assign(tooltipEl.style, {\n\t\t\t\t\tleft: `${x}px`,\n\t\t\t\t\ttop: `${y}px`,\n\t\t\t\t});\n\n\t\t\t\tif (arrowEl) {\n\t\t\t\t\tif (middlewareData.arrow?.x) {\n\t\t\t\t\t\tObject.assign(arrowEl.style, {\n\t\t\t\t\t\t\tleft: `${middlewareData.arrow.x}px`,\n\t\t\t\t\t\t\ttop: placement === 'bottom' ? `${-arrowEl.offsetHeight / 2}px` : '',\n\t\t\t\t\t\t\tbottom: placement === 'top' ? `${-arrowEl.offsetHeight / 2}px` : '',\n\t\t\t\t\t\t});\n\t\t\t\t\t} else if (middlewareData.arrow?.y) {\n\t\t\t\t\t\tObject.assign(arrowEl.style, {\n\t\t\t\t\t\t\tleft: placement === 'right' ? `${-arrowEl.offsetWidth / 2}px` : '',\n\t\t\t\t\t\t\tright: placement === 'left' ? `${-arrowEl.offsetWidth / 2}px` : '',\n\t\t\t\t\t\t\ttop: `${middlewareData.arrow.y}px`,\n\t\t\t\t\t\t});\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\tif (oldPos.left !== tooltipEl.style.left || oldPos.top !== tooltipEl.style.top) {\n\t\t\t\t\tthis.alignTooltip(cb);\n\t\t\t\t} else if (typeof cb === 'function') {\n\t\t\t\t\tcb();\n\t\t\t\t}\n\t\t\t});\n\t\t}\n\t};\n\n\tprivate showTooltip = (): void => {\n\t\tif (this.tooltipElement /* SSR instanceof HTMLElement */) {\n\t\t\tthis.tooltipElement.style.setProperty('display', 'block');\n\t\t\tgetDocument().body.addEventListener('keyup', this.hideTooltipByEscape);\n\t\t\tthis.alignTooltip(() => {\n\t\t\t\tif (this.tooltipElement /* SSR instanceof HTMLElement */) {\n\t\t\t\t\tthis.tooltipElement.style.setProperty('visibility', 'visible');\n\t\t\t\t\tdocument.addEventListener('scroll', this.showTooltip);\n\t\t\t\t}\n\t\t\t});\n\t\t}\n\t};\n\n\tprivate hideTooltip = (): void => {\n\t\tif (this.tooltipElement /* SSR instanceof HTMLElement */) {\n\t\t\tthis.tooltipElement.style.setProperty('display', 'none');\n\t\t\tthis.tooltipElement.style.setProperty('visibility', 'hidden');\n\t\t\tdocument.removeEventListener('scroll', this.showTooltip);\n\t\t}\n\t};\n\n\tprivate hideTooltipByEscape = (event: KeyboardEvent): void => {\n\t\tif (event.key === 'Escape') {\n\t\t\tgetDocument().body.removeEventListener('keyup', this.hideTooltipByEscape);\n\t\t\tthis.hideTooltip();\n\t\t}\n\t};\n\n\tprivate addListeners = (el: Element): void => {\n\t\tel.addEventListener('mouseover', this.incrementOverFocusCount);\n\t\tel.addEventListener('focus', this.incrementOverFocusCount);\n\t\tel.addEventListener('mouseout', this.decrementOverFocusCount);\n\t\tel.addEventListener('blur', this.decrementOverFocusCount);\n\t};\n\n\tprivate removeListeners = (el: Element): void => {\n\t\tel.removeEventListener('mouseover', this.incrementOverFocusCount);\n\t\tel.removeEventListener('focus', this.incrementOverFocusCount);\n\t\tel.removeEventListener('mouseout', this.decrementOverFocusCount);\n\t\tel.removeEventListener('blur', this.decrementOverFocusCount);\n\t};\n\n\tprivate resyncListeners = (el: Element): void => {\n\t\tthis.removeListeners(el);\n\t\tthis.addListeners(el);\n\t};\n\n\tprivate catchHostElement = (el: HTMLElement | null): void => {\n\t\tif (el /* SSR instanceof HTMLElement */) {\n\t\t\tthis.previousSibling = el.previousElementSibling as HTMLElement | null;\n\t\t\tif (this.previousSibling /* SSR instanceof HTMLElement */) {\n\t\t\t\tthis.resyncListeners(this.previousSibling);\n\t\t\t}\n\t\t}\n\t};\n\n\tprivate catchTooltipElement = (el?: HTMLDivElement): void => {\n\t\tthis.tooltipElement = el;\n\t\tif (this.tooltipElement /* SSR instanceof HTMLElement */) {\n\t\t\tthis.resyncListeners(this.tooltipElement);\n\t\t}\n\t};\n\tprivate catchArrowElement = (element?: HTMLDivElement): void => {\n\t\tthis.arrowElement = element;\n\t};\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host ref={this.catchHostElement}>\n\t\t\t\t{this.state._label !== '' && (\n\t\t\t\t\t<div id=\"floating\" ref={this.catchTooltipElement}>\n\t\t\t\t\t\t<div class=\"area\" id=\"arrow\" ref={this.catchArrowElement} />\n\t\t\t\t\t\t<kol-span-wc class=\"area\" id={this.state._id} _label={this.state._label}></kol-span-wc>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Setzt die Ausrichtung des Tooltips in Relation zum Elternelement.\n\t */\n\t@Prop() public _align?: Alignment = 'top';\n\n\t/**\n\t * Gibt die ID an, wenn z.B. Aria-Labelledby (Link) verwendet wird.\n\t */\n\t@Prop() public _id!: string;\n\n\t/**\n\t * Setzt den Text in dem Tooltip beim Fokussieren oder Maus-drüberfahren angezeigt wird.\n\t */\n\t@Prop() public _label!: string;\n\n\t@State() public state: States = {\n\t\t_align: 'top',\n\t\t_id: nonce(),\n\t\t_label: '…', // ⚠ required\n\t};\n\n\t@Watch('_align')\n\tpublic validateAlign(value?: Alignment): void {\n\t\twatchTooltipAlignment(this, '_align', value);\n\t}\n\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\twatchString(this, '_id', value);\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: string): void {\n\t\twatchString(this, '_label', value);\n\t}\n\n\tprivate overFocusCount = 0;\n\tprivate overFocusTimeout?: ReturnType<typeof setTimeout>;\n\n\tprivate incrementOverFocusCount = (): void => {\n\t\tthis.overFocusCount++;\n\t\tthis.showOrHideTooltip();\n\t};\n\n\tprivate decrementOverFocusCount = (): void => {\n\t\tthis.overFocusCount--;\n\t\tthis.showOrHideTooltip();\n\t};\n\n\tprivate showOrHideTooltip = (): void => {\n\t\tclearTimeout(this.overFocusTimeout);\n\t\tthis.overFocusTimeout = setTimeout(() => {\n\t\t\tclearTimeout(this.overFocusTimeout);\n\t\t\tif (this.overFocusCount > 0) {\n\t\t\t\tthis.showTooltip();\n\t\t\t} else {\n\t\t\t\tthis.hideTooltip();\n\t\t\t}\n\t\t}, 250);\n\t};\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAlign(this._align);\n\t\tthis.validateId(this._id);\n\t\tthis.validateLabel(this._label);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentDidLoad)\n\t */\n\tpublic disconnectedCallback(): void {\n\t\tif (this.previousSibling /* SSR instanceof HTMLElement */) {\n\t\t\tthis.removeListeners(this.previousSibling);\n\t\t}\n\t\tif (this.tooltipElement /* SSR instanceof HTMLElement */) {\n\t\t\tthis.removeListeners(this.tooltipElement);\n\t\t}\n\t}\n}\n"],"version":3}
+{"file":"component.js","mappings":"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","names":[],"sources":["./src/types/button-link.ts","./src/utils/overlay.ts","./src/components/tooltip/style.css?tag=kol-tooltip","./src/components/tooltip/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { Events } from '../enums/events';\nimport { watchValidator } from '../utils/prop.validators';\nimport { EventCallback, EventValueOrEventCallback } from './callbacks';\nimport { Stringified } from './common';\nimport { KoliBriAllIcon, KoliBriIconProp } from './icon';\nimport { Alignment, PropAriaCurrent, PropAriaExpanded, PropAriaSelected, PropDisabled, PropDownload, PropLabel, PropStealth } from './props';\n\nexport type AlternativButtonLinkRole = 'button' | 'link' | 'tab';\n\n/**\n * https://twitter.com/housecor/status/1541037184622403584?t=HoUiOAZEcXFeuDl-VWAEZg\n * https://mui.com/material-ui/react-link/#accessibility\n * https://mui.com/material-ui/react-button/#text-button\n */\ntype RequiredButtonAndLinkProps = PropLabel;\ntype OptionalButtonAndLinkProps = {\n\tariaControls: string;\n\tariaLabel: string;\n\ticon: Stringified<KoliBriIconProp>;\n\t/**\n\t * @deprecated\n\t */\n\ticonAlign: Alignment;\n\ticonOnly: boolean;\n\trole: AlternativButtonLinkRole;\n\ttabIndex: number;\n\ttooltipAlign: Alignment;\n} & PropAriaCurrent &\n\tPropAriaExpanded &\n\tPropAriaSelected &\n\tPropDisabled;\n\ntype RequiredButtonAndLinkStates = {\n\ticon: KoliBriAllIcon;\n\tlabel: string;\n};\ntype OptionalButtonAndLinkStates = {\n\tariaLabel: string;\n\tariaControls: string;\n\t/**\n\t * @deprecated\n\t */\n\ticonAlign: Alignment;\n\ticonOnly: boolean;\n\trole: AlternativButtonLinkRole;\n\ttabIndex: number;\n\ttooltipAlign: Alignment;\n} & PropAriaCurrent &\n\tPropAriaExpanded &\n\tPropAriaSelected &\n\tPropDisabled;\n\n/**\n * Button\n */\nexport type KoliBriButtonType = 'button' | 'reset' | 'submit';\nexport type KoliBriButtonVariant = 'primary' | 'secondary' | 'normal' | 'danger' | 'ghost' | 'custom';\n\nexport type KoliBriButtonCallbacks<T> = {\n\t[Events.onClick]?: EventValueOrEventCallback<MouseEvent, T>;\n\t[Events.onMouseDown]?: EventCallback<MouseEvent>;\n};\n\nexport type KoliBriButtonVariantPropState = {\n\tvariant: KoliBriButtonVariant;\n};\nexport type KoliBriButtonCustomClassPropState = {\n\tcustomClass: string;\n};\n\n/**\n * API ButtonLink\n */\nexport type RequiredButtonLinkProps = RequiredButtonAndLinkProps;\nexport type OptionalButtonLinkProps = OptionalButtonAndLinkProps & {\n\t/**\n\t * @deprecated Zweck?!\n\t */\n\taccessKey: string;\n\tdisabled: boolean;\n\tid: string;\n\ton: KoliBriButtonCallbacks<unknown>;\n\ttype: KoliBriButtonType;\n\tvalue: Stringified<unknown>;\n};\n// type ButtonLinkProps = Generic.Element.Members<RequiredButtonProps, OptionalButtonProps>;\n\ntype RequiredButtonLinkStates = RequiredButtonAndLinkStates &\n\tKoliBriButtonVariantPropState & {\n\t\ttype: KoliBriButtonType;\n\t};\ntype OptionalButtonLinkStates = OptionalButtonAndLinkStates &\n\tKoliBriButtonCustomClassPropState & {\n\t\t/**\n\t\t * @deprecated Zweck?!\n\t\t */\n\t\taccessKey: string;\n\t\tdisabled: boolean;\n\t\tid: string;\n\t\ton: KoliBriButtonCallbacks<unknown>;\n\t\tvalue: unknown;\n\t};\n// type ButtonLinkStates = Generic.Element.Members<RequiredButtonStates, OptionalButtonStates>;\n\n/**\n * API Button\n */\nexport type RequiredButtonProps = RequiredButtonLinkProps;\nexport type OptionalButtonProps = OptionalButtonLinkProps & KoliBriButtonVariantPropState & KoliBriButtonCustomClassPropState;\nexport type ButtonProps = Generic.Element.Members<RequiredButtonProps, OptionalButtonProps>;\n\nexport type RequiredButtonStates = RequiredButtonLinkStates & KoliBriButtonVariantPropState;\nexport type OptionalButtonStates = OptionalButtonLinkStates & KoliBriButtonCustomClassPropState;\nexport type ButtonStates = Generic.Element.Members<RequiredButtonStates, OptionalButtonStates>;\n\n/* LINK */\n\n/**\n * @deprecated Link should not use the on-click event. Use a button instead.\n */\nexport type LinkOnCallbacks = {\n\t[Events.onClick]?: EventValueOrEventCallback<Event, string>;\n};\n\n// https://www.w3schools.com/tags/att_a_target.asp\nexport type LinkTarget = '_blank' | '_parent' | '_self' | '_top' | string;\n\nexport type LinkUseCase = 'text' | 'image' | 'nav';\n\n/**\n * API Link\n */\nexport type RequiredLinkProps = RequiredButtonAndLinkProps & {\n\thref: string;\n};\nexport type OptionalLinkProps = OptionalButtonAndLinkProps & {\n\t/**\n\t * @deprecated A link could never be disabled. Use a button instead.\n\t */\n\tdisabled: boolean;\n\t/**\n\t * @deprecated We use the on-click event only on buttons styled as link.\n\t */\n\ton: LinkOnCallbacks;\n\t/**\n\t * @deprecated Das Styling sollte stets über CSS erfolgen.\n\t */\n\tselector: string;\n\t/**\n\t * @deprecated Das Styling sollte stets über CSS erfolgen.\n\t */\n\ttarget: LinkTarget;\n\ttargetDescription: string;\n\t/**\n\t * @deprecated Das Styling sollte stets über CSS erfolgen.\n\t */\n\tuseCase: LinkUseCase;\n} & PropDownload &\n\tPropStealth;\nexport type LinkProps = Generic.Element.Members<RequiredLinkProps, OptionalLinkProps>;\n\nexport type RequiredLinkStates = RequiredButtonAndLinkStates & {\n\thref: string;\n};\nexport type OptionalLinkStates = OptionalButtonAndLinkStates & {\n\tariaSelected: boolean;\n\t/**\n\t * @deprecated We use the on-click event only on buttons styled as link.\n\t */\n\ton: LinkOnCallbacks;\n\t/**\n\t * @deprecated Das Styling sollte stets über CSS erfolgen.\n\t */\n\tselector: string;\n\t/**\n\t * @deprecated Das Styling sollte stets über CSS erfolgen.\n\t */\n\ttarget: LinkTarget;\n\ttargetDescription: string;\n\t/**\n\t * @deprecated Das Styling sollte stets über CSS erfolgen.\n\t */\n\tuseCase: LinkUseCase;\n} & PropAriaSelected &\n\tPropDownload &\n\tPropStealth;\nexport type LinkStates = Generic.Element.Members<RequiredLinkStates, OptionalLinkStates>;\n\n/**\n * API LinkButton\n */\nexport type RequiredLinkButtonProps = RequiredLinkProps;\nexport type OptionalLinkButtonProps = OptionalLinkProps & KoliBriButtonVariantPropState & KoliBriButtonCustomClassPropState;\n// type LinkButtonProps = Generic.Element.Members<RequiredLinkButtonProps, OptionalLinkButtonProps>;\n\n// type RequiredLinkButtonStates = KoliBriButtonVariantPropState;\n// type OptionalLinkButtonStates = KoliBriButtonCustomClassPropState;\n// type LinkButtonStates = Generic.Element.Members<RequiredLinkButtonStates, OptionalLinkButtonStates>;\n\nexport const watchTooltipAlignment = (component: Generic.Element.Component, propName: string, value?: Alignment): void => {\n\twatchValidator(\n\t\tcomponent,\n\t\tpropName,\n\t\t(value) => value === 'top' || value === 'right' || value === 'bottom' || value === 'left',\n\t\tnew Set(['Alignment {top, right, buttom, left}']),\n\t\tvalue,\n\t\t{\n\t\t\tdefaultValue: 'top',\n\t\t}\n\t);\n};\n","/**\n * This file contains the functions used to manage the visible overlays.\n */\n\n/**\n * This set contains all the visible overlays.\n */\nconst VISIBLE_OVERLAYS: Set<HTMLElement> = new Set();\n\n/**\n * This function is used to add an overlay to the visible overlay list.\n * All overlays in the list will have a z-index of 999, except the last\n * one, which will have a z-index of 1000.\n *\n * @param overlay Get the overlay element reference\n */\nexport function showOverlay(overlay: HTMLElement): void {\n\tVISIBLE_OVERLAYS.forEach((visibleOverlay) => {\n\t\tvisibleOverlay.style.setProperty('z-index', '999');\n\t});\n\tVISIBLE_OVERLAYS.add(overlay);\n\toverlay.style.setProperty('z-index', '1000');\n}\n\n/**\n * This function is used to remove an overlay from the visible overlay list.\n * All overlays in the list will have a z-index of 999, except the last\n * one, which will have a z-index of 1000.\n *\n * @param overlay Get the overlay element reference\n */\nexport function hideOverlay(overlay: HTMLElement): void {\n\tVISIBLE_OVERLAYS.delete(overlay);\n\tif (VISIBLE_OVERLAYS.size > 0) {\n\t\tconst last = Array.from(VISIBLE_OVERLAYS).pop();\n\t\tif (last) {\n\t\t\tlast.style.setProperty('z-index', '1000');\n\t\t}\n\t}\n}\n","@import url(../style.css);\nkol-tooltip #floating {\n\tanimation-duration: 0.5s;\n\tanimation-iteration-count: 1;\n\tanimation-name: fadeInOpacity;\n\tanimation-timing-function: ease-in;\n\tbox-sizing: border-box;\n\tdisplay: none;\n\tposition: absolute;\n\tvisibility: hidden;\n}\nkol-tooltip #arrow {\n\theight: 10px;\n\tposition: absolute;\n\ttransform: rotate(45deg);\n\twidth: 10px;\n\tz-index: 999;\n}\nkol-tooltip .area {\n\tbackground-color: #fff;\n\tcolor: #000;\n}\nkol-tooltip kol-span-wc {\n\tposition: relative;\n\tz-index: 1000;\n}\n@keyframes fadeInOpacity {\n\t0% {\n\t\topacity: 0;\n\t}\n\t100% {\n\t\topacity: 1;\n\t}\n}\n","import { arrow, computePosition, flip, offset, shift } from '@floating-ui/dom';\nimport { Component, Host, JSX, Prop, State, Watch, h } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { watchTooltipAlignment } from '../../types/button-link';\nimport { Alignment } from '../../types/props';\nimport { getDocument, nonce } from '../../utils/dev.utils';\nimport { hideOverlay, showOverlay } from '../../utils/overlay';\nimport { watchString } from '../../utils/prop.validators';\nimport { processEnv } from '../../utils/reuse';\n\ntype RequiredProps = {\n\tid: string;\n\tlabel: string;\n};\ntype OptionalProps = {\n\talign: Alignment;\n};\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = RequiredProps & OptionalProps;\ntype OptionalStates = unknown;\nexport type States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n@Component({\n\ttag: 'kol-tooltip',\n\tstyleUrl: './style.css',\n\tshadow: false,\n})\nexport class KolTooltip implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\tprivate previousSibling?: HTMLElement | null;\n\tprivate tooltipElement?: HTMLDivElement;\n\tprivate arrowElement?: HTMLDivElement;\n\n\tprivate alignTooltip = (cb?: () => void): void => {\n\t\tif (processEnv !== 'test' && this.previousSibling /* SSR instanceof HTMLElement */ && this.tooltipElement /* SSR instanceof HTMLElement */) {\n\t\t\tconst target = this.previousSibling;\n\t\t\tconst tooltipEl = this.tooltipElement;\n\t\t\tconst arrowEl = this.arrowElement;\n\n\t\t\tconst middleware = [offset(arrowEl?.offsetHeight ?? 10), flip(), shift()];\n\t\t\tif (arrowEl) {\n\t\t\t\tmiddleware.push(arrow({ element: arrowEl }));\n\t\t\t}\n\n\t\t\tvoid computePosition(target, tooltipEl, {\n\t\t\t\tplacement: this.state._align,\n\t\t\t\tmiddleware: middleware,\n\t\t\t}).then(({ x, y, middlewareData, placement }) => {\n\t\t\t\tconst oldPos = {\n\t\t\t\t\tleft: tooltipEl.style.left,\n\t\t\t\t\ttop: tooltipEl.style.top,\n\t\t\t\t};\n\t\t\t\tObject.assign(tooltipEl.style, {\n\t\t\t\t\tleft: `${x}px`,\n\t\t\t\t\ttop: `${y}px`,\n\t\t\t\t});\n\n\t\t\t\tif (arrowEl) {\n\t\t\t\t\tif (middlewareData.arrow?.x) {\n\t\t\t\t\t\tObject.assign(arrowEl.style, {\n\t\t\t\t\t\t\tleft: `${middlewareData.arrow.x}px`,\n\t\t\t\t\t\t\ttop: placement === 'bottom' ? `${-arrowEl.offsetHeight / 2}px` : '',\n\t\t\t\t\t\t\tbottom: placement === 'top' ? `${-arrowEl.offsetHeight / 2}px` : '',\n\t\t\t\t\t\t});\n\t\t\t\t\t} else if (middlewareData.arrow?.y) {\n\t\t\t\t\t\tObject.assign(arrowEl.style, {\n\t\t\t\t\t\t\tleft: placement === 'right' ? `${-arrowEl.offsetWidth / 2}px` : '',\n\t\t\t\t\t\t\tright: placement === 'left' ? `${-arrowEl.offsetWidth / 2}px` : '',\n\t\t\t\t\t\t\ttop: `${middlewareData.arrow.y}px`,\n\t\t\t\t\t\t});\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\tif (oldPos.left !== tooltipEl.style.left || oldPos.top !== tooltipEl.style.top) {\n\t\t\t\t\tthis.alignTooltip(cb);\n\t\t\t\t} else if (typeof cb === 'function') {\n\t\t\t\t\tcb();\n\t\t\t\t}\n\t\t\t});\n\t\t}\n\t};\n\n\tprivate showTooltip = (): void => {\n\t\tif (this.tooltipElement /* SSR instanceof HTMLElement */) {\n\t\t\tshowOverlay(this.tooltipElement);\n\t\t\tthis.tooltipElement.style.setProperty('display', 'block');\n\t\t\tgetDocument().body.addEventListener('keyup', this.hideTooltipByEscape);\n\t\t\tthis.alignTooltip(() => {\n\t\t\t\tif (this.tooltipElement /* SSR instanceof HTMLElement */) {\n\t\t\t\t\tthis.tooltipElement.style.setProperty('visibility', 'visible');\n\t\t\t\t\tdocument.addEventListener('scroll', this.showTooltip);\n\t\t\t\t}\n\t\t\t});\n\t\t}\n\t};\n\n\tprivate hideTooltip = (): void => {\n\t\tif (this.tooltipElement /* SSR instanceof HTMLElement */) {\n\t\t\thideOverlay(this.tooltipElement);\n\t\t\tthis.tooltipElement.style.setProperty('display', 'none');\n\t\t\tthis.tooltipElement.style.setProperty('visibility', 'hidden');\n\t\t\tdocument.removeEventListener('scroll', this.showTooltip);\n\t\t}\n\t};\n\n\tprivate hideTooltipByEscape = (event: KeyboardEvent): void => {\n\t\tif (event.key === 'Escape') {\n\t\t\tgetDocument().body.removeEventListener('keyup', this.hideTooltipByEscape);\n\t\t\tthis.hideTooltip();\n\t\t}\n\t};\n\n\tprivate addListeners = (el: Element): void => {\n\t\tel.addEventListener('mouseover', this.incrementOverFocusCount);\n\t\tel.addEventListener('focus', this.incrementOverFocusCount);\n\t\tel.addEventListener('mouseout', this.decrementOverFocusCount);\n\t\tel.addEventListener('blur', this.decrementOverFocusCount);\n\t};\n\n\tprivate removeListeners = (el: Element): void => {\n\t\tel.removeEventListener('mouseover', this.incrementOverFocusCount);\n\t\tel.removeEventListener('focus', this.incrementOverFocusCount);\n\t\tel.removeEventListener('mouseout', this.decrementOverFocusCount);\n\t\tel.removeEventListener('blur', this.decrementOverFocusCount);\n\t};\n\n\tprivate resyncListeners = (el: Element): void => {\n\t\tthis.removeListeners(el);\n\t\tthis.addListeners(el);\n\t};\n\n\tprivate catchHostElement = (el: HTMLElement | null): void => {\n\t\tif (el /* SSR instanceof HTMLElement */) {\n\t\t\tthis.previousSibling = el.previousElementSibling as HTMLElement | null;\n\t\t\tif (this.previousSibling /* SSR instanceof HTMLElement */) {\n\t\t\t\tthis.resyncListeners(this.previousSibling);\n\t\t\t}\n\t\t}\n\t};\n\n\tprivate catchTooltipElement = (el?: HTMLDivElement): void => {\n\t\tthis.tooltipElement = el;\n\t\tif (this.tooltipElement /* SSR instanceof HTMLElement */) {\n\t\t\tthis.resyncListeners(this.tooltipElement);\n\t\t}\n\t};\n\tprivate catchArrowElement = (element?: HTMLDivElement): void => {\n\t\tthis.arrowElement = element;\n\t};\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host ref={this.catchHostElement}>\n\t\t\t\t{this.state._label !== '' && (\n\t\t\t\t\t<div id=\"floating\" ref={this.catchTooltipElement}>\n\t\t\t\t\t\t<div class=\"area\" id=\"arrow\" ref={this.catchArrowElement} />\n\t\t\t\t\t\t<kol-span-wc class=\"area\" id={this.state._id} _label={this.state._label}></kol-span-wc>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Setzt die Ausrichtung des Tooltips in Relation zum Elternelement.\n\t */\n\t@Prop() public _align?: Alignment = 'top';\n\n\t/**\n\t * Gibt die ID an, wenn z.B. Aria-Labelledby (Link) verwendet wird.\n\t */\n\t@Prop() public _id!: string;\n\n\t/**\n\t * Setzt den Text in dem Tooltip beim Fokussieren oder Maus-drüberfahren angezeigt wird.\n\t */\n\t@Prop() public _label!: string;\n\n\t@State() public state: States = {\n\t\t_align: 'top',\n\t\t_id: nonce(),\n\t\t_label: '…', // ⚠ required\n\t};\n\n\t@Watch('_align')\n\tpublic validateAlign(value?: Alignment): void {\n\t\twatchTooltipAlignment(this, '_align', value);\n\t}\n\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\twatchString(this, '_id', value);\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: string): void {\n\t\twatchString(this, '_label', value);\n\t}\n\n\tprivate overFocusCount = 0;\n\tprivate overFocusTimeout?: ReturnType<typeof setTimeout>;\n\n\tprivate incrementOverFocusCount = (): void => {\n\t\tthis.overFocusCount++;\n\t\tthis.showOrHideTooltip();\n\t};\n\n\tprivate decrementOverFocusCount = (): void => {\n\t\tthis.overFocusCount--;\n\t\tthis.showOrHideTooltip();\n\t};\n\n\tprivate showOrHideTooltip = (): void => {\n\t\tclearTimeout(this.overFocusTimeout);\n\t\tthis.overFocusTimeout = setTimeout(() => {\n\t\t\tclearTimeout(this.overFocusTimeout);\n\t\t\tif (this.overFocusCount > 0) {\n\t\t\t\tthis.showTooltip();\n\t\t\t} else {\n\t\t\t\tthis.hideTooltip();\n\t\t\t}\n\t\t}, 250);\n\t};\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAlign(this._align);\n\t\tthis.validateId(this._id);\n\t\tthis.validateLabel(this._label);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentDidLoad)\n\t */\n\tpublic disconnectedCallback(): void {\n\t\tif (this.previousSibling /* SSR instanceof HTMLElement */) {\n\t\t\tthis.removeListeners(this.previousSibling);\n\t\t}\n\t\tif (this.tooltipElement /* SSR instanceof HTMLElement */) {\n\t\t\tthis.removeListeners(this.tooltipElement);\n\t\t}\n\t}\n}\n"],"version":3}

package/dist/components/component10.js.map

@@ -1 +1 @@
-{"file":"component10.js","mappings":";;;;;AAAA,MAAM,eAAe,GAAG,6uBAA6uB;;MCmBxvB,eAAe;;;;;iBACK,EAAE;;EAE3B,MAAM;IACZ,QACC,EAAC,IAAI,QACJ,eACC,eAAQ,CACH,CACA,EACN;GACF;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/indented-text/style.css?tag=kol-indented-text&mode=default&encapsulation=shadow","./src/components/indented-text/component.tsx"],"sourcesContent":["@import url(../style.css);\n@import url(../host-display-block.css);\n:host > div {\n\tborder-left-style: solid;\n\tpadding-left: 0.5em;\n}\n","import { Component, h, Host, JSX, State } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\n\ntype RequiredProps = unknown;\ntype OptionalProps = unknown;\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = RequiredProps;\ntype OptionalStates = OptionalProps;\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n@Component({\n\ttag: 'kol-indented-text',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolIndentedText implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\t@State() public state: States = {};\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<div>\n\t\t\t\t\t<slot />\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"version":3}
+{"file":"component10.js","mappings":";;;;;AAAA,MAAM,eAAe,GAAG,6uBAA6uB;;MCsBxvB,eAAe;;;;;iBACK,EAAE;;EAE3B,MAAM;IACZ,QACC,EAAC,IAAI,QACJ,eAEC,eAAQ,CACH,CACA,EACN;GACF;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/indented-text/style.css?tag=kol-indented-text&mode=default&encapsulation=shadow","./src/components/indented-text/component.tsx"],"sourcesContent":["@import url(../style.css);\n@import url(../host-display-block.css);\n:host > div {\n\tborder-left-style: solid;\n\tpadding-left: 0.5em;\n}\n","import { Component, h, Host, JSX, State } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\n\ntype RequiredProps = unknown;\ntype OptionalProps = unknown;\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = RequiredProps;\ntype OptionalStates = OptionalProps;\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n/**\n * @slot default Der Text.\n */\n@Component({\n\ttag: 'kol-indented-text',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolIndentedText implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\t@State() public state: States = {};\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<div>\n\t\t\t\t\t{/* TODO: Für was wird dieses div benötigt? */}\n\t\t\t\t\t<slot />\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"version":3}

package/dist/components/component12.js

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";import{a as watchValidator,F as watchJsonArrayString,w as watchString,l as watchBoolean,B as watchNumber,v as propagateFocus,n as nonce}from"./prop.validators.js";import{p as propagateSubmitEventToForm,d as defineCustomElement$6}from"./component5.js";import{g as getRenderStates}from"./controller.js";import{I as InputIconController}from"./controller-icon.js";import{d as defineCustomElement$8}from"./shadow.js";import{d as defineCustomElement$7}from"./component6.js";import{d as defineCustomElement$5}from"./component4.js";import{d as defineCustomElement$4}from"./component2.js";import{d as defineCustomElement$3}from"./component11.js";import{d as defineCustomElement$2}from"./component3.js";import{d as defineCustomElement$1}from"./component.js";class InputNumberController extends InputIconController{constructor(t,e,a){super(t,e,a),this.numberOrIsoDateRegex=/^\d+$|(^\d{4}-([0]\d|1[0-2])-([0-2]\d|3[01])([T ][0-2]\d:[0-5]\d:[0-5]\d(?:\.\d+)?([+-][0-2]\d:[0-5]\d|Z)?)?$)|(^[0-2]\d:[0-5]\d(:[0-5]\d)?$)/,this.parseToString=t=>"string"==typeof t?t:"number"==typeof t?`${t}`:"object"==typeof t&&t instanceof Date?t.toISOString():"",this.validateIso8601=(t,e,a)=>{const i=parseFloat(e),o=i==e;return watchValidator(this.component,t,(t=>void 0===t||""===t||o&&"number"==typeof i||this.numberOrIsoDateRegex.test(t)),new Set(["number","Date","string{ISO-8601}"]),this.parseToString(e),{hooks:{afterPatch:t=>{"string"==typeof t&&a&&a(t)}}})},this.component=t}validateAutoComplete(t){watchValidator(this.component,"_autoComplete",(t=>"string"==typeof t&&("on"===t||"off"===t)),new Set(["on | off"]),t)}validateList(t){watchJsonArrayString(this.component,"_list",(t=>"string"==typeof t),t)}onChange(t){super.onChange(t),!!t.target.value!=!!this.component._value&&(this.component._value=t.target.value)}validateMax(t){this.validateIso8601("_max",t)}validateMin(t){this.validateIso8601("_min",t)}validatePlaceholder(t){watchString(this.component,"_placeholder",t)}validateReadOnly(t){watchBoolean(this.component,"_readOnly",t)}validateRequired(t){watchBoolean(this.component,"_required",t)}validateStep(t){watchNumber(this.component,"_step",t)}validateType(t){watchValidator(this.component,"_type",(t=>"string"==typeof t&&("date"===t||"datetime-local"===t||"month"===t||"number"===t||"time"===t||"week"===t)),new Set(["String {date, datetime-local, month, number, time, week}"]),t)}validateValue(t){this.validateValueEx(t)}validateValueEx(t,e){this.validateIso8601("_value",t,e)}componentWillLoad(){super.componentWillLoad(),this.validateAutoComplete(this.component._autoComplete),this.validateMax(this.component._max),this.validateMin(this.component._min),this.validateList(this.component._list),this.validateReadOnly(this.component._readOnly),this.validateRequired(this.component._required),this.validateStep(this.component._step),this.validateType(this.component._type),this.validateValue(this.component._value)}}const defaultStyleCss=":host{--a11y-min-size:44px}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.required label>span::after,.required legend>span::after{content:'*'}:host{display:block}input,textarea{cursor:text}input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],input[type='range'],label,option,select{cursor:pointer}input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],select:not([multiple]),select[multiple] option,textarea{font-size:1rem}input[type='file']{padding:calc((var(--a11y-min-size) - 1rem) / 10) 0.5em}select[multiple] option{padding:calc((var(--a11y-min-size) - 1rem) / 2) 0.5em}kol-input.disabled :is(button,input,label,option,select,textarea){cursor:not-allowed;opacity:0.5}kol-input{display:grid}kol-input [slot='input']{flex-grow:1}input:not([type='checkbox'],[type='radio']),select:not([multiple]){height:2.75em}input:focus,option:focus,select:focus,textarea:focus{outline:0}.input{display:flex;align-items:center}.input>kol-icon{display:grid;height:var(--a11y-min-size);place-items:center}div.input{cursor:text}",KolInputNumber=proxyCustomElement(class extends HTMLElement{render(){const{ariaDescribedBy:t}=getRenderStates(this.state),e=Array.isArray(this.state._list)&&this.state._list.length>0;return h(Host,{class:{"has-value":this.state._hasValue}},h("kol-input",{class:{[this.state._type]:!0},_disabled:this.state._disabled,_error:this.state._error,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icon:this.state._icon,_id:this.state._id,_list:this.state._list,_readOnly:this.state._readOnly,_required:this.state._required,_smartButton:this.state._smartButton,_touched:this.state._touched}," ",h("span",{slot:"label"},h("slot",null)),h("input",Object.assign({ref:this.catchRef,title:"",accessKey:this.state._accessKey,"aria-describedby":t.length>0?t.join(" "):void 0,"aria-labelledby":`${this.state._id}-label`,autoCapitalize:"off",autoComplete:this.state._autoComplete,autoCorrect:"off",disabled:this.state._disabled,id:this.state._id,list:e?`${this.state._id}-list`:void 0,max:this.state._max,min:this.state._min,name:this.state._name,readOnly:this.state._readOnly,required:this.state._required,placeholder:this.state._placeholder,slot:"input",step:this.state._step,spellcheck:"false",type:this.state._type,value:this.state._value},this.controller.onFacade,{onKeyUp:this.onKeyUp}))))}constructor(){super(),this.__registerHost(),this.__attachShadow(),this.catchRef=t=>{this.ref=t,propagateFocus(this.host,this.ref)},this.onKeyUp=t=>{"Enter"===t.code?propagateSubmitEventToForm({form:this.host,ref:this.ref}):this.controller.onFacade.onChange(t)},this._accessKey=void 0,this._alert=!0,this._autoComplete=void 0,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._list=void 0,this._max=void 0,this._min=void 0,this._name=void 0,this._on=void 0,this._placeholder=void 0,this._readOnly=void 0,this._required=void 0,this._smartButton=void 0,this._step=void 0,this._tabIndex=void 0,this._touched=!1,this._type="number",this._value=void 0,this.state={_autoComplete:"off",_id:nonce(),_hasValue:!1,_list:[],_type:"number"},this.controller=new InputNumberController(this,"number",this.host)}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAlert(t){this.controller.validateAlert(t)}validateAutoComplete(t){this.controller.validateAutoComplete(t)}validateDisabled(t){this.controller.validateDisabled(t)}validateError(t){this.controller.validateError(t)}validateHideLabel(t){this.controller.validateHideLabel(t)}validateHint(t){this.controller.validateHint(t)}validateIcon(t){this.controller.validateIcon(t)}validateId(t){this.controller.validateId(t)}validateList(t){this.controller.validateList(t)}validateMax(t){this.controller.validateMax(t)}validateMin(t){this.controller.validateMin(t)}validateName(t){this.controller.validateName(t)}validateOn(t){this.controller.validateOn(t)}validatePlaceholder(t){this.controller.validatePlaceholder(t)}validateReadOnly(t){this.controller.validateReadOnly(t)}validateRequired(t){this.controller.validateRequired(t)}validateSmartButton(t){this.controller.validateSmartButton(t)}validateStep(t){this.controller.validateStep(t)}validateTabIndex(t){this.controller.validateTabIndex(t)}validateTouched(t){this.controller.validateTouched(t)}validateType(t){this.controller.validateType(t)}validateValue(t){this.controller.validateValueEx(t,(t=>{""===t&&this.ref&&(this.ref.value="")}))}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.controller.componentWillLoad(),this.state._hasValue=!!this.state._value,this.controller.addValueChangeListener((t=>this.state._hasValue=!!t))}get host(){return this}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_list:["validateList"],_max:["validateMax"],_min:["validateMin"],_name:["validateName"],_on:["validateOn"],_placeholder:["validatePlaceholder"],_readOnly:["validateReadOnly"],_required:["validateRequired"],_smartButton:["validateSmartButton"],_step:["validateStep"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_type:["validateType"],_value:["validateValue"]}}static get style(){return{default:defaultStyleCss}}},[33,"kol-input-number",{_accessKey:[1,"_access-key"],_alert:[1540],_autoComplete:[1,"_auto-complete"],_disabled:[516],_error:[1],_hideLabel:[516,"_hide-label"],_hint:[1],_icon:[1],_id:[1],_list:[1],_max:[8],_min:[8],_name:[1],_on:[16],_placeholder:[1],_readOnly:[516,"_read-only"],_required:[516],_smartButton:[16],_step:[2],_tabIndex:[2,"_tab-index"],_touched:[1540],_type:[1],_value:[1032],state:[32]}]);function defineCustomElement(){if("undefined"==typeof customElements)return;["kol-input-number","kol-alert","kol-alert-wc","kol-button-wc","kol-heading-wc","kol-icon","kol-input","kol-span-wc","kol-tooltip"].forEach((t=>{switch(t){case"kol-input-number":customElements.get(t)||customElements.define(t,KolInputNumber);break;case"kol-alert":customElements.get(t)||defineCustomElement$8();break;case"kol-alert-wc":customElements.get(t)||defineCustomElement$7();break;case"kol-button-wc":customElements.get(t)||defineCustomElement$6();break;case"kol-heading-wc":customElements.get(t)||defineCustomElement$5();break;case"kol-icon":customElements.get(t)||defineCustomElement$4();break;case"kol-input":customElements.get(t)||defineCustomElement$3();break;case"kol-span-wc":customElements.get(t)||defineCustomElement$2();break;case"kol-tooltip":customElements.get(t)||defineCustomElement$1()}}))}export{KolInputNumber as K,defineCustomElement as d};
+import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";import{a as watchValidator,F as watchJsonArrayString,w as watchString,l as watchBoolean,B as watchNumber,v as propagateFocus,n as nonce}from"./prop.validators.js";import{p as propagateSubmitEventToForm,d as defineCustomElement$6}from"./component5.js";import{g as getRenderStates}from"./controller.js";import{I as InputIconController}from"./controller-icon.js";import{d as defineCustomElement$8}from"./shadow.js";import{d as defineCustomElement$7}from"./component6.js";import{d as defineCustomElement$5}from"./component4.js";import{d as defineCustomElement$4}from"./component2.js";import{d as defineCustomElement$3}from"./component11.js";import{d as defineCustomElement$2}from"./component3.js";import{d as defineCustomElement$1}from"./component.js";class InputNumberController extends InputIconController{constructor(t,e,a){super(t,e,a),this.numberOrIsoDateRegex=/^\d+$|(^\d{4}-([0]\d|1[0-2])-([0-2]\d|3[01])([T ][0-2]\d:[0-5]\d:[0-5]\d(?:\.\d+)?([+-][0-2]\d:[0-5]\d|Z)?)?$)|(^[0-2]\d:[0-5]\d(:[0-5]\d)?$)/,this.parseToString=t=>"string"==typeof t?t:"number"==typeof t?`${t}`:"object"==typeof t&&t instanceof Date?t.toISOString():"",this.validateIso8601=(t,e,a)=>{const i=parseFloat(e),o=i==e;return watchValidator(this.component,t,(t=>void 0===t||""===t||o&&"number"==typeof i||this.numberOrIsoDateRegex.test(t)),new Set(["number","Date","string{ISO-8601}"]),this.parseToString(e),{hooks:{afterPatch:t=>{"string"==typeof t&&a&&a(t)}}})},this.component=t}validateAutoComplete(t){watchValidator(this.component,"_autoComplete",(t=>"string"==typeof t&&("on"===t||"off"===t)),new Set(["on | off"]),t)}validateList(t){watchJsonArrayString(this.component,"_list",(t=>"string"==typeof t),t)}onChange(t){super.onChange(t),!!t.target.value!=!!this.component._value&&(this.component._value=t.target.value)}validateMax(t){this.validateIso8601("_max",t)}validateMin(t){this.validateIso8601("_min",t)}validatePlaceholder(t){watchString(this.component,"_placeholder",t)}validateReadOnly(t){watchBoolean(this.component,"_readOnly",t)}validateRequired(t){watchBoolean(this.component,"_required",t)}validateStep(t){watchNumber(this.component,"_step",t)}validateType(t){watchValidator(this.component,"_type",(t=>"string"==typeof t&&("date"===t||"datetime-local"===t||"month"===t||"number"===t||"time"===t||"week"===t)),new Set(["String {date, datetime-local, month, number, time, week}"]),t)}validateValue(t){this.validateValueEx(t)}validateValueEx(t,e){this.validateIso8601("_value",t,e)}componentWillLoad(){super.componentWillLoad(),this.validateAutoComplete(this.component._autoComplete),this.validateMax(this.component._max),this.validateMin(this.component._min),this.validateList(this.component._list),this.validateReadOnly(this.component._readOnly),this.validateRequired(this.component._required),this.validateStep(this.component._step),this.validateType(this.component._type),this.validateValue(this.component._value)}}const defaultStyleCss=":host{--a11y-min-size:44px}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.required label>span::after,.required legend>span::after{content:'*'}:host{display:block}input,textarea{cursor:text}input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],input[type='range'],label,option,select{cursor:pointer}input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],select:not([multiple]),select[multiple] option,textarea{font-size:1rem;width:100%}input[type='file']{padding:calc((var(--a11y-min-size) - 1rem) / 10) 0.5em}select[multiple] option{padding:calc((var(--a11y-min-size) - 1rem) / 2) 0.5em}kol-input.disabled :is(button,input,label,option,select,textarea){cursor:not-allowed;opacity:0.5}kol-input{display:grid}kol-input [slot='input']{flex-grow:1}input:not([type='checkbox'],[type='radio']),select:not([multiple]){height:2.75em}input:focus,option:focus,select:focus,textarea:focus{outline:0}.input{display:flex;align-items:center}.input>kol-icon{display:grid;height:var(--a11y-min-size);place-items:center}",KolInputNumber=proxyCustomElement(class extends HTMLElement{render(){const{ariaDescribedBy:t}=getRenderStates(this.state),e=Array.isArray(this.state._list)&&this.state._list.length>0;return h(Host,{class:{"has-value":this.state._hasValue}},h("kol-input",{class:{[this.state._type]:!0},_disabled:this.state._disabled,_error:this.state._error,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icon:this.state._icon,_id:this.state._id,_list:this.state._list,_readOnly:this.state._readOnly,_required:this.state._required,_smartButton:this.state._smartButton,_touched:this.state._touched}," ",h("span",{slot:"label"},h("slot",null)),h("input",Object.assign({ref:this.catchRef,title:"",accessKey:this.state._accessKey,"aria-describedby":t.length>0?t.join(" "):void 0,"aria-labelledby":`${this.state._id}-label`,autoCapitalize:"off",autoComplete:this.state._autoComplete,autoCorrect:"off",disabled:this.state._disabled,id:this.state._id,list:e?`${this.state._id}-list`:void 0,max:this.state._max,min:this.state._min,name:this.state._name,readOnly:this.state._readOnly,required:this.state._required,placeholder:this.state._placeholder,slot:"input",step:this.state._step,spellcheck:"false",type:this.state._type,value:this.state._value},this.controller.onFacade,{onKeyUp:this.onKeyUp}))))}constructor(){super(),this.__registerHost(),this.__attachShadow(),this.catchRef=t=>{this.ref=t,propagateFocus(this.host,this.ref)},this.onKeyUp=t=>{"Enter"===t.code?propagateSubmitEventToForm({form:this.host,ref:this.ref}):this.controller.onFacade.onChange(t)},this._accessKey=void 0,this._alert=!0,this._autoComplete=void 0,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._list=void 0,this._max=void 0,this._min=void 0,this._name=void 0,this._on=void 0,this._placeholder=void 0,this._readOnly=void 0,this._required=void 0,this._smartButton=void 0,this._step=void 0,this._tabIndex=void 0,this._touched=!1,this._type="number",this._value=void 0,this.state={_autoComplete:"off",_id:nonce(),_hasValue:!1,_list:[],_type:"number"},this.controller=new InputNumberController(this,"number",this.host)}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAlert(t){this.controller.validateAlert(t)}validateAutoComplete(t){this.controller.validateAutoComplete(t)}validateDisabled(t){this.controller.validateDisabled(t)}validateError(t){this.controller.validateError(t)}validateHideLabel(t){this.controller.validateHideLabel(t)}validateHint(t){this.controller.validateHint(t)}validateIcon(t){this.controller.validateIcon(t)}validateId(t){this.controller.validateId(t)}validateList(t){this.controller.validateList(t)}validateMax(t){this.controller.validateMax(t)}validateMin(t){this.controller.validateMin(t)}validateName(t){this.controller.validateName(t)}validateOn(t){this.controller.validateOn(t)}validatePlaceholder(t){this.controller.validatePlaceholder(t)}validateReadOnly(t){this.controller.validateReadOnly(t)}validateRequired(t){this.controller.validateRequired(t)}validateSmartButton(t){this.controller.validateSmartButton(t)}validateStep(t){this.controller.validateStep(t)}validateTabIndex(t){this.controller.validateTabIndex(t)}validateTouched(t){this.controller.validateTouched(t)}validateType(t){this.controller.validateType(t)}validateValue(t){this.controller.validateValueEx(t,(t=>{""===t&&this.ref&&(this.ref.value="")}))}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.controller.componentWillLoad(),this.state._hasValue=!!this.state._value,this.controller.addValueChangeListener((t=>this.state._hasValue=!!t))}get host(){return this}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_list:["validateList"],_max:["validateMax"],_min:["validateMin"],_name:["validateName"],_on:["validateOn"],_placeholder:["validatePlaceholder"],_readOnly:["validateReadOnly"],_required:["validateRequired"],_smartButton:["validateSmartButton"],_step:["validateStep"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_type:["validateType"],_value:["validateValue"]}}static get style(){return{default:defaultStyleCss}}},[33,"kol-input-number",{_accessKey:[1,"_access-key"],_alert:[1540],_autoComplete:[1,"_auto-complete"],_disabled:[516],_error:[1],_hideLabel:[516,"_hide-label"],_hint:[1],_icon:[1],_id:[1],_list:[1],_max:[8],_min:[8],_name:[1],_on:[16],_placeholder:[1],_readOnly:[516,"_read-only"],_required:[516],_smartButton:[16],_step:[2],_tabIndex:[2,"_tab-index"],_touched:[1540],_type:[1],_value:[1032],state:[32]}]);function defineCustomElement(){if("undefined"==typeof customElements)return;["kol-input-number","kol-alert","kol-alert-wc","kol-button-wc","kol-heading-wc","kol-icon","kol-input","kol-span-wc","kol-tooltip"].forEach((t=>{switch(t){case"kol-input-number":customElements.get(t)||customElements.define(t,KolInputNumber);break;case"kol-alert":customElements.get(t)||defineCustomElement$8();break;case"kol-alert-wc":customElements.get(t)||defineCustomElement$7();break;case"kol-button-wc":customElements.get(t)||defineCustomElement$6();break;case"kol-heading-wc":customElements.get(t)||defineCustomElement$5();break;case"kol-icon":customElements.get(t)||defineCustomElement$4();break;case"kol-input":customElements.get(t)||defineCustomElement$3();break;case"kol-span-wc":customElements.get(t)||defineCustomElement$2();break;case"kol-tooltip":customElements.get(t)||defineCustomElement$1()}}))}export{KolInputNumber as K,defineCustomElement as d};

package/dist/components/component12.js.map

@@ -1 +1 @@
-{"file":"component12.js","mappings":"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","names":[],"sources":["./src/components/input-number/controller.ts","./src/components/input-number/style.css?tag=kol-input-number&mode=default&encapsulation=shadow","./src/components/input-number/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { Stringified } from '../../types/common';\nimport { InputNumberType } from '../../types/input/control/number';\nimport { Iso8601 } from '../../types/input/iso8601';\nimport { InputTypeOnOff } from '../../types/input/types';\nimport { watchBoolean, watchJsonArrayString, watchNumber, watchString, watchValidator } from '../../utils/prop.validators';\nimport { InputIconController } from '../@deprecated/input/controller-icon';\nimport { Props, Watches } from './types';\n\nexport class InputNumberController extends InputIconController implements Watches {\n\t/**\n\t * Regex to check whether a string is a number or a date in ISO-8601 format.\n\t * Test the regex here: https://regex101.com/r/ddGR4V/1\n\t */\n\tprivate readonly numberOrIsoDateRegex =\n\t\t/^\\d+$|(^\\d{4}-([0]\\d|1[0-2])-([0-2]\\d|3[01])([T ][0-2]\\d:[0-5]\\d:[0-5]\\d(?:\\.\\d+)?([+-][0-2]\\d:[0-5]\\d|Z)?)?$)|(^[0-2]\\d:[0-5]\\d(:[0-5]\\d)?$)/;\n\n\tprotected readonly component: Generic.Element.Component & Props;\n\n\tpublic constructor(component: Generic.Element.Component & Props, name: string, host?: HTMLElement) {\n\t\tsuper(component, name, host);\n\t\tthis.component = component;\n\t}\n\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\twatchValidator(\n\t\t\tthis.component,\n\t\t\t'_autoComplete',\n\t\t\t(value): boolean => typeof value === 'string' && (value === 'on' || value === 'off'),\n\t\t\tnew Set(['on | off']),\n\t\t\tvalue\n\t\t);\n\t}\n\n\tpublic validateList(value?: Stringified<string[]>): void {\n\t\twatchJsonArrayString(this.component, '_list', (item: string) => typeof item === 'string', value);\n\t}\n\n\tprivate readonly parseToString = (value?: number | Date | string | null) => {\n\t\tif (typeof value === 'string') {\n\t\t\treturn value;\n\t\t}\n\t\tif (typeof value === 'number') {\n\t\t\treturn `${value}`;\n\t\t}\n\t\tif (typeof value === 'object' && value instanceof Date) {\n\t\t\treturn value.toISOString();\n\t\t}\n\t\treturn '';\n\t};\n\n\tprivate readonly validateIso8601 = (propName: string, value?: number | Iso8601 | null, afterPatch?: (v: string) => void) => {\n\t\tconst parsedValue = parseFloat(value as string);\n\t\tconst valueMatched = parsedValue == value;\n\t\treturn watchValidator(\n\t\t\tthis.component,\n\t\t\tpropName,\n\t\t\t(value): boolean => value === undefined || value === '' || (valueMatched && typeof parsedValue === 'number') || this.numberOrIsoDateRegex.test(value),\n\t\t\tnew Set(['number', 'Date', 'string{ISO-8601}']),\n\t\t\tthis.parseToString(value),\n\t\t\t{\n\t\t\t\thooks: {\n\t\t\t\t\tafterPatch: (value) => {\n\t\t\t\t\t\tif (typeof value === 'string' && afterPatch) {\n\t\t\t\t\t\t\tafterPatch(value);\n\t\t\t\t\t\t}\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t}\n\t\t);\n\t};\n\n\tprotected onChange(event: Event): void {\n\t\tsuper.onChange(event);\n\n\t\t// set the value here when the value is switched between blank and set (or vice versa) to enable value resets via setting null as value.\n\t\tif (!!(event.target as HTMLInputElement).value !== !!this.component._value) {\n\t\t\tthis.component._value = (event.target as HTMLInputElement).value as number | Iso8601;\n\t\t}\n\t}\n\n\tpublic validateMax(value?: number | Iso8601): void {\n\t\tthis.validateIso8601('_max', value);\n\t}\n\n\tpublic validateMin(value?: number | Iso8601): void {\n\t\tthis.validateIso8601('_min', value);\n\t}\n\n\tpublic validatePlaceholder(value?: string): void {\n\t\twatchString(this.component, '_placeholder', value);\n\t}\n\n\tpublic validateReadOnly(value?: boolean): void {\n\t\twatchBoolean(this.component, '_readOnly', value);\n\t}\n\n\tpublic validateRequired(value?: boolean): void {\n\t\twatchBoolean(this.component, '_required', value);\n\t}\n\n\tpublic validateStep(value?: number): void {\n\t\twatchNumber(this.component, '_step', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t * @deprecated\n\t */\n\tpublic validateType(value?: InputNumberType): void {\n\t\twatchValidator(\n\t\t\tthis.component,\n\t\t\t'_type',\n\t\t\t(value): boolean =>\n\t\t\t\ttypeof value === 'string' &&\n\t\t\t\t(value === 'date' || value === 'datetime-local' || value === 'month' || value === 'number' || value === 'time' || value === 'week'),\n\t\t\tnew Set(['String {date, datetime-local, month, number, time, week}']),\n\t\t\tvalue\n\t\t);\n\t}\n\n\tpublic validateValue(value?: number | Iso8601 | null): void {\n\t\tthis.validateValueEx(value);\n\t}\n\n\t/**\n\t * Overload of validate value. Extends by an after patch callback function.\n\t */\n\tpublic validateValueEx(value?: number | Iso8601 | null, afterPatch?: (v: string) => void): void {\n\t\tthis.validateIso8601('_value', value, afterPatch);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tsuper.componentWillLoad();\n\t\tthis.validateAutoComplete(this.component._autoComplete);\n\t\tthis.validateMax(this.component._max);\n\t\tthis.validateMin(this.component._min);\n\t\tthis.validateList(this.component._list);\n\t\tthis.validateReadOnly(this.component._readOnly);\n\t\tthis.validateRequired(this.component._required);\n\t\tthis.validateStep(this.component._step);\n\t\tthis.validateType(this.component._type);\n\t\tthis.validateValue(this.component._value);\n\t}\n}\n","@import url(../input-line.css);\ndiv.input {\n\tcursor: text;\n}\n","import { Component, Element, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\nimport { ButtonProps } from '../../types/button-link';\nimport { Stringified } from '../../types/common';\nimport { InputNumberType } from '../../types/input/control/number';\nimport { Iso8601 } from '../../types/input/iso8601';\nimport { InputTypeOnDefault, InputTypeOnOff } from '../../types/input/types';\nimport { propagateFocus } from '../../utils/reuse';\nimport { propagateSubmitEventToForm } from '../form/controller';\nimport { KoliBriHorizontalIcon } from '../../types/icon';\nimport { getRenderStates } from '../input/controller';\nimport { InputNumberController } from './controller';\nimport { ComponentApi, States } from './types';\nimport { nonce } from '../../utils/dev.utils';\n\n@Component({\n\ttag: 'kol-input-number',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolInputNumber implements ComponentApi {\n\t@Element() private readonly host?: HTMLKolInputNumberElement;\n\tprivate ref?: HTMLInputElement;\n\n\tprivate readonly catchRef = (ref?: HTMLInputElement) => {\n\t\tthis.ref = ref;\n\t\tpropagateFocus(this.host, this.ref);\n\t};\n\n\tprivate readonly onKeyUp = (event: KeyboardEvent) => {\n\t\tif (event.code === 'Enter') {\n\t\t\tpropagateSubmitEventToForm({\n\t\t\t\tform: this.host,\n\t\t\t\tref: this.ref,\n\t\t\t});\n\t\t} else {\n\t\t\tthis.controller.onFacade.onChange(event);\n\t\t}\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { ariaDescribedBy } = getRenderStates(this.state);\n\t\tconst hasList = Array.isArray(this.state._list) && this.state._list.length > 0;\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tclass={{\n\t\t\t\t\t'has-value': this.state._hasValue,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<kol-input\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t[this.state._type]: true,\n\t\t\t\t\t}}\n\t\t\t\t\t_disabled={this.state._disabled}\n\t\t\t\t\t_error={this.state._error}\n\t\t\t\t\t_hideLabel={this.state._hideLabel}\n\t\t\t\t\t_hint={this.state._hint}\n\t\t\t\t\t_icon={this.state._icon}\n\t\t\t\t\t_id={this.state._id}\n\t\t\t\t\t_list={this.state._list}\n\t\t\t\t\t_readOnly={this.state._readOnly}\n\t\t\t\t\t_required={this.state._required}\n\t\t\t\t\t_smartButton={this.state._smartButton}\n\t\t\t\t\t_touched={this.state._touched}\n\t\t\t\t>\n\t\t\t\t\t{' '}\n\t\t\t\t\t<span slot=\"label\">\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</span>\n\t\t\t\t\t<input\n\t\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t\ttitle=\"\"\n\t\t\t\t\t\taccessKey={this.state._accessKey}\n\t\t\t\t\t\taria-describedby={ariaDescribedBy.length > 0 ? ariaDescribedBy.join(' ') : undefined}\n\t\t\t\t\t\taria-labelledby={`${this.state._id}-label`}\n\t\t\t\t\t\tautoCapitalize=\"off\"\n\t\t\t\t\t\tautoComplete={this.state._autoComplete}\n\t\t\t\t\t\tautoCorrect=\"off\"\n\t\t\t\t\t\tdisabled={this.state._disabled}\n\t\t\t\t\t\tid={this.state._id}\n\t\t\t\t\t\tlist={hasList ? `${this.state._id}-list` : undefined}\n\t\t\t\t\t\tmax={this.state._max}\n\t\t\t\t\t\tmin={this.state._min}\n\t\t\t\t\t\tname={this.state._name}\n\t\t\t\t\t\treadOnly={this.state._readOnly}\n\t\t\t\t\t\trequired={this.state._required}\n\t\t\t\t\t\tplaceholder={this.state._placeholder}\n\t\t\t\t\t\tslot=\"input\"\n\t\t\t\t\t\tstep={this.state._step}\n\t\t\t\t\t\tspellcheck=\"false\"\n\t\t\t\t\t\ttype={this.state._type}\n\t\t\t\t\t\tvalue={this.state._value as string}\n\t\t\t\t\t\t{...this.controller.onFacade}\n\t\t\t\t\t\tonKeyUp={this.onKeyUp}\n\t\t\t\t\t/>\n\t\t\t\t</kol-input>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate readonly controller: InputNumberController;\n\n\t/**\n\t * Gibt an, mit welcher Tastenkombination man das Input auslösen oder fokussieren kann.\n\t */\n\t@Prop() public _accessKey?: string;\n\n\t/**\n\t * Gibt an, ob die Fehlermeldung vorgelesen werden soll, wenn es eine gibt.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _alert?: boolean = true;\n\n\t/**\n\t * Gibt an, ob das Eingabefeld autovervollständigt werden kann.\n\t */\n\t@Prop() public _autoComplete?: InputTypeOnOff;\n\n\t/**\n\t * Setzt das Feld in einen inaktiven Zustand, in dem es keine Interaktion erlaubt.\n\t */\n\t@Prop({ reflect: true }) public _disabled?: boolean;\n\n\t/**\n\t * Gibt den Text für eine Fehlermeldung an.\n\t */\n\t@Prop() public _error?: string;\n\n\t/**\n\t * Versteckt das sichtbare Label des Elements.\n\t */\n\t@Prop({ reflect: true }) public _hideLabel?: boolean;\n\n\t/**\n\t * Gibt den Hinweistext an.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * Ermöglicht das Anzeigen von Icons links und/oder rechts am Rand des Eingabefeldes.\n\t */\n\t@Prop() public _icon?: Stringified<KoliBriHorizontalIcon>;\n\n\t/**\n\t * Gibt die technische ID des Eingabefeldes an.\n\t */\n\t@Prop() public _id?: string;\n\n\t/**\n\t * Gibt die Liste der Vorschlagszahlen an.\n\t */\n\t@Prop() public _list?: Stringified<string[]>;\n\n\t/**\n\t * Gibt den größtmöglichen Zahlenwert an.\n\t */\n\t@Prop() public _max?: number | Iso8601;\n\n\t/**\n\t * Gibt den kleinstmöglichen Zahlenwert an.\n\t */\n\t@Prop() public _min?: number | Iso8601;\n\n\t/**\n\t * Gibt den technischen Namen des Eingabefeldes an.\n\t */\n\t@Prop() public _name?: string;\n\n\t/**\n\t * Gibt die EventCallback-Funktionen für das Input-Event an.\n\t */\n\t@Prop() public _on?: InputTypeOnDefault;\n\n\t/**\n\t * Gibt den Platzhalter des Eingabefeldes an, wenn es leer ist.\n\t */\n\t@Prop() public _placeholder?: string;\n\n\t/**\n\t * Setzt das Eingabefeld in den schreibgeschützten Modus.\n\t */\n\t@Prop({ reflect: true }) public _readOnly?: boolean;\n\n\t/**\n\t * Macht das Eingabeelement zu einem Pflichtfeld.\n\t */\n\t@Prop({ reflect: true }) public _required?: boolean;\n\n\t/**\n\t * Ermöglicht eine Schaltfläche ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (ohne label).\n\t */\n\t@Prop() public _smartButton?: ButtonProps;\n\n\t/**\n\t * Gibt die Schrittweite der Wertveränderung an\n\t */\n\t@Prop() public _step?: number;\n\n\t/**\n\t * Gibt an, welchen Tab-Index dieses Input hat.\n\t */\n\t@Prop() public _tabIndex?: number;\n\n\t/**\n\t * Gibt an, ob dieses Eingabefeld von Nutzer:innen einmal besucht/berührt wurde.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _touched?: boolean = false;\n\n\t/**\n\t * Gibt an, ob es ein DateTime-, Date-, Month-, Week-, Time-, DateTime-Local-, Number-Eingabefeld ist.\n\t *\n\t * @deprecated Das W3C hat die Date-Typen in eine eigene Gruppe zusammengefasst. Verwende hierfür die InputDate-Komponente.\n\t */\n\t@Prop() public _type?: InputNumberType = 'number';\n\n\t/**\n\t * Gibt den Wert des Eingabefeldes an.\n\t */\n\t@Prop({ mutable: true }) public _value?: number | Iso8601 | null;\n\n\t@State() public state: States = {\n\t\t_autoComplete: 'off',\n\t\t_id: nonce(), // ⚠ required\n\t\t_hasValue: false,\n\t\t_list: [],\n\t\t_type: 'number',\n\t};\n\n\tpublic constructor() {\n\t\tthis.controller = new InputNumberController(this, 'number', this.host);\n\t}\n\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\tthis.controller.validateAlert(value);\n\t}\n\n\t@Watch('_autoComplete')\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\tthis.controller.validateAutoComplete(value);\n\t}\n\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t@Watch('_error')\n\tpublic validateError(value?: string): void {\n\t\tthis.controller.validateError(value);\n\t}\n\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t@Watch('_icon')\n\tpublic validateIcon(value?: Stringified<KoliBriHorizontalIcon>): void {\n\t\tthis.controller.validateIcon(value);\n\t}\n\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t@Watch('_list')\n\tpublic validateList(value?: Stringified<string[]>): void {\n\t\tthis.controller.validateList(value);\n\t}\n\n\t@Watch('_max')\n\tpublic validateMax(value?: number | Iso8601): void {\n\t\tthis.controller.validateMax(value);\n\t}\n\n\t@Watch('_min')\n\tpublic validateMin(value?: number | Iso8601): void {\n\t\tthis.controller.validateMin(value);\n\t}\n\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t@Watch('_placeholder')\n\tpublic validatePlaceholder(value?: string): void {\n\t\tthis.controller.validatePlaceholder(value);\n\t}\n\n\t@Watch('_readOnly')\n\tpublic validateReadOnly(value?: boolean): void {\n\t\tthis.controller.validateReadOnly(value);\n\t}\n\n\t@Watch('_required')\n\tpublic validateRequired(value?: boolean): void {\n\t\tthis.controller.validateRequired(value);\n\t}\n\n\t@Watch('_smartButton')\n\tpublic validateSmartButton(value?: ButtonProps | string): void {\n\t\tthis.controller.validateSmartButton(value);\n\t}\n\n\t@Watch('_step')\n\tpublic validateStep(value?: number): void {\n\t\tthis.controller.validateStep(value);\n\t}\n\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tthis.controller.validateTabIndex(value);\n\t}\n\n\t@Watch('_touched')\n\tpublic validateTouched(value?: boolean): void {\n\t\tthis.controller.validateTouched(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t * @deprecated\n\t */\n\t@Watch('_type')\n\tpublic validateType(value?: InputNumberType): void {\n\t\tthis.controller.validateType(value);\n\t}\n\n\t@Watch('_value')\n\tpublic validateValue(value?: number | Iso8601 | null): void {\n\t\tthis.controller.validateValueEx(value, (v) => {\n\t\t\tif (v === '' && this.ref) {\n\t\t\t\tthis.ref.value = '';\n\t\t\t}\n\t\t});\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis._alert = this._alert === true;\n\t\tthis._touched = this._touched === true;\n\t\tthis.controller.componentWillLoad();\n\n\t\tthis.state._hasValue = !!this.state._value;\n\t\tthis.controller.addValueChangeListener((v) => (this.state._hasValue = !!v));\n\t}\n}\n"],"version":3}
+{"file":"component12.js","mappings":"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","names":[],"sources":["./src/components/input-number/controller.ts","./src/components/input-number/style.css?tag=kol-input-number&mode=default&encapsulation=shadow","./src/components/input-number/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { Stringified } from '../../types/common';\nimport { InputNumberType } from '../../types/input/control/number';\nimport { Iso8601 } from '../../types/input/iso8601';\nimport { InputTypeOnOff } from '../../types/input/types';\nimport { watchBoolean, watchJsonArrayString, watchNumber, watchString, watchValidator } from '../../utils/prop.validators';\nimport { InputIconController } from '../@deprecated/input/controller-icon';\nimport { Props, Watches } from './types';\n\nexport class InputNumberController extends InputIconController implements Watches {\n\t/**\n\t * Regex to check whether a string is a number or a date in ISO-8601 format.\n\t * Test the regex here: https://regex101.com/r/ddGR4V/1\n\t */\n\tprivate readonly numberOrIsoDateRegex =\n\t\t/^\\d+$|(^\\d{4}-([0]\\d|1[0-2])-([0-2]\\d|3[01])([T ][0-2]\\d:[0-5]\\d:[0-5]\\d(?:\\.\\d+)?([+-][0-2]\\d:[0-5]\\d|Z)?)?$)|(^[0-2]\\d:[0-5]\\d(:[0-5]\\d)?$)/;\n\n\tprotected readonly component: Generic.Element.Component & Props;\n\n\tpublic constructor(component: Generic.Element.Component & Props, name: string, host?: HTMLElement) {\n\t\tsuper(component, name, host);\n\t\tthis.component = component;\n\t}\n\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\twatchValidator(\n\t\t\tthis.component,\n\t\t\t'_autoComplete',\n\t\t\t(value): boolean => typeof value === 'string' && (value === 'on' || value === 'off'),\n\t\t\tnew Set(['on | off']),\n\t\t\tvalue\n\t\t);\n\t}\n\n\tpublic validateList(value?: Stringified<string[]>): void {\n\t\twatchJsonArrayString(this.component, '_list', (item: string) => typeof item === 'string', value);\n\t}\n\n\tprivate readonly parseToString = (value?: number | Date | string | null) => {\n\t\tif (typeof value === 'string') {\n\t\t\treturn value;\n\t\t}\n\t\tif (typeof value === 'number') {\n\t\t\treturn `${value}`;\n\t\t}\n\t\tif (typeof value === 'object' && value instanceof Date) {\n\t\t\treturn value.toISOString();\n\t\t}\n\t\treturn '';\n\t};\n\n\tprivate readonly validateIso8601 = (propName: string, value?: number | Iso8601 | null, afterPatch?: (v: string) => void) => {\n\t\tconst parsedValue = parseFloat(value as string);\n\t\tconst valueMatched = parsedValue == value;\n\t\treturn watchValidator(\n\t\t\tthis.component,\n\t\t\tpropName,\n\t\t\t(value): boolean => value === undefined || value === '' || (valueMatched && typeof parsedValue === 'number') || this.numberOrIsoDateRegex.test(value),\n\t\t\tnew Set(['number', 'Date', 'string{ISO-8601}']),\n\t\t\tthis.parseToString(value),\n\t\t\t{\n\t\t\t\thooks: {\n\t\t\t\t\tafterPatch: (value) => {\n\t\t\t\t\t\tif (typeof value === 'string' && afterPatch) {\n\t\t\t\t\t\t\tafterPatch(value);\n\t\t\t\t\t\t}\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t}\n\t\t);\n\t};\n\n\tprotected onChange(event: Event): void {\n\t\tsuper.onChange(event);\n\n\t\t// set the value here when the value is switched between blank and set (or vice versa) to enable value resets via setting null as value.\n\t\tif (!!(event.target as HTMLInputElement).value !== !!this.component._value) {\n\t\t\tthis.component._value = (event.target as HTMLInputElement).value as number | Iso8601;\n\t\t}\n\t}\n\n\tpublic validateMax(value?: number | Iso8601): void {\n\t\tthis.validateIso8601('_max', value);\n\t}\n\n\tpublic validateMin(value?: number | Iso8601): void {\n\t\tthis.validateIso8601('_min', value);\n\t}\n\n\tpublic validatePlaceholder(value?: string): void {\n\t\twatchString(this.component, '_placeholder', value);\n\t}\n\n\tpublic validateReadOnly(value?: boolean): void {\n\t\twatchBoolean(this.component, '_readOnly', value);\n\t}\n\n\tpublic validateRequired(value?: boolean): void {\n\t\twatchBoolean(this.component, '_required', value);\n\t}\n\n\tpublic validateStep(value?: number): void {\n\t\twatchNumber(this.component, '_step', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t * @deprecated\n\t */\n\tpublic validateType(value?: InputNumberType): void {\n\t\twatchValidator(\n\t\t\tthis.component,\n\t\t\t'_type',\n\t\t\t(value): boolean =>\n\t\t\t\ttypeof value === 'string' &&\n\t\t\t\t(value === 'date' || value === 'datetime-local' || value === 'month' || value === 'number' || value === 'time' || value === 'week'),\n\t\t\tnew Set(['String {date, datetime-local, month, number, time, week}']),\n\t\t\tvalue\n\t\t);\n\t}\n\n\tpublic validateValue(value?: number | Iso8601 | null): void {\n\t\tthis.validateValueEx(value);\n\t}\n\n\t/**\n\t * Overload of validate value. Extends by an after patch callback function.\n\t */\n\tpublic validateValueEx(value?: number | Iso8601 | null, afterPatch?: (v: string) => void): void {\n\t\tthis.validateIso8601('_value', value, afterPatch);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tsuper.componentWillLoad();\n\t\tthis.validateAutoComplete(this.component._autoComplete);\n\t\tthis.validateMax(this.component._max);\n\t\tthis.validateMin(this.component._min);\n\t\tthis.validateList(this.component._list);\n\t\tthis.validateReadOnly(this.component._readOnly);\n\t\tthis.validateRequired(this.component._required);\n\t\tthis.validateStep(this.component._step);\n\t\tthis.validateType(this.component._type);\n\t\tthis.validateValue(this.component._value);\n\t}\n}\n","@import url(../input-line.css);\n","import { Component, Element, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\nimport { ButtonProps } from '../../types/button-link';\nimport { Stringified } from '../../types/common';\nimport { InputNumberType } from '../../types/input/control/number';\nimport { Iso8601 } from '../../types/input/iso8601';\nimport { InputTypeOnDefault, InputTypeOnOff } from '../../types/input/types';\nimport { propagateFocus } from '../../utils/reuse';\nimport { propagateSubmitEventToForm } from '../form/controller';\nimport { KoliBriHorizontalIcon } from '../../types/icon';\nimport { getRenderStates } from '../input/controller';\nimport { InputNumberController } from './controller';\nimport { ComponentApi, States } from './types';\nimport { nonce } from '../../utils/dev.utils';\n\n/**\n * @slot default Die Beschriftung des Eingabefeldes.\n */\n@Component({\n\ttag: 'kol-input-number',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolInputNumber implements ComponentApi {\n\t@Element() private readonly host?: HTMLKolInputNumberElement;\n\tprivate ref?: HTMLInputElement;\n\n\tprivate readonly catchRef = (ref?: HTMLInputElement) => {\n\t\tthis.ref = ref;\n\t\tpropagateFocus(this.host, this.ref);\n\t};\n\n\tprivate readonly onKeyUp = (event: KeyboardEvent) => {\n\t\tif (event.code === 'Enter') {\n\t\t\tpropagateSubmitEventToForm({\n\t\t\t\tform: this.host,\n\t\t\t\tref: this.ref,\n\t\t\t});\n\t\t} else {\n\t\t\tthis.controller.onFacade.onChange(event);\n\t\t}\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { ariaDescribedBy } = getRenderStates(this.state);\n\t\tconst hasList = Array.isArray(this.state._list) && this.state._list.length > 0;\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tclass={{\n\t\t\t\t\t'has-value': this.state._hasValue,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<kol-input\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t[this.state._type]: true,\n\t\t\t\t\t}}\n\t\t\t\t\t_disabled={this.state._disabled}\n\t\t\t\t\t_error={this.state._error}\n\t\t\t\t\t_hideLabel={this.state._hideLabel}\n\t\t\t\t\t_hint={this.state._hint}\n\t\t\t\t\t_icon={this.state._icon}\n\t\t\t\t\t_id={this.state._id}\n\t\t\t\t\t_list={this.state._list}\n\t\t\t\t\t_readOnly={this.state._readOnly}\n\t\t\t\t\t_required={this.state._required}\n\t\t\t\t\t_smartButton={this.state._smartButton}\n\t\t\t\t\t_touched={this.state._touched}\n\t\t\t\t>\n\t\t\t\t\t{' '}\n\t\t\t\t\t<span slot=\"label\">\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</span>\n\t\t\t\t\t<input\n\t\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t\ttitle=\"\"\n\t\t\t\t\t\taccessKey={this.state._accessKey}\n\t\t\t\t\t\taria-describedby={ariaDescribedBy.length > 0 ? ariaDescribedBy.join(' ') : undefined}\n\t\t\t\t\t\taria-labelledby={`${this.state._id}-label`}\n\t\t\t\t\t\tautoCapitalize=\"off\"\n\t\t\t\t\t\tautoComplete={this.state._autoComplete}\n\t\t\t\t\t\tautoCorrect=\"off\"\n\t\t\t\t\t\tdisabled={this.state._disabled}\n\t\t\t\t\t\tid={this.state._id}\n\t\t\t\t\t\tlist={hasList ? `${this.state._id}-list` : undefined}\n\t\t\t\t\t\tmax={this.state._max}\n\t\t\t\t\t\tmin={this.state._min}\n\t\t\t\t\t\tname={this.state._name}\n\t\t\t\t\t\treadOnly={this.state._readOnly}\n\t\t\t\t\t\trequired={this.state._required}\n\t\t\t\t\t\tplaceholder={this.state._placeholder}\n\t\t\t\t\t\tslot=\"input\"\n\t\t\t\t\t\tstep={this.state._step}\n\t\t\t\t\t\tspellcheck=\"false\"\n\t\t\t\t\t\ttype={this.state._type}\n\t\t\t\t\t\tvalue={this.state._value as string}\n\t\t\t\t\t\t{...this.controller.onFacade}\n\t\t\t\t\t\tonKeyUp={this.onKeyUp}\n\t\t\t\t\t/>\n\t\t\t\t</kol-input>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate readonly controller: InputNumberController;\n\n\t/**\n\t * Gibt an, mit welcher Tastenkombination man das Input auslösen oder fokussieren kann.\n\t */\n\t@Prop() public _accessKey?: string;\n\n\t/**\n\t * Gibt an, ob die Fehlermeldung vorgelesen werden soll, wenn es eine gibt.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _alert?: boolean = true;\n\n\t/**\n\t * Gibt an, ob das Eingabefeld autovervollständigt werden kann.\n\t */\n\t@Prop() public _autoComplete?: InputTypeOnOff;\n\n\t/**\n\t * Setzt das Feld in einen inaktiven Zustand, in dem es keine Interaktion erlaubt.\n\t */\n\t@Prop({ reflect: true }) public _disabled?: boolean;\n\n\t/**\n\t * Gibt den Text für eine Fehlermeldung an.\n\t */\n\t@Prop() public _error?: string;\n\n\t/**\n\t * Versteckt das sichtbare Label des Elements.\n\t */\n\t@Prop({ reflect: true }) public _hideLabel?: boolean;\n\n\t/**\n\t * Gibt den Hinweistext an.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * Ermöglicht das Anzeigen von Icons links und/oder rechts am Rand des Eingabefeldes.\n\t */\n\t@Prop() public _icon?: Stringified<KoliBriHorizontalIcon>;\n\n\t/**\n\t * Gibt die technische ID des Eingabefeldes an.\n\t */\n\t@Prop() public _id?: string;\n\n\t/**\n\t * Gibt die Liste der Vorschlagszahlen an.\n\t */\n\t@Prop() public _list?: Stringified<string[]>;\n\n\t/**\n\t * Gibt den größtmöglichen Zahlenwert an.\n\t */\n\t@Prop() public _max?: number | Iso8601;\n\n\t/**\n\t * Gibt den kleinstmöglichen Zahlenwert an.\n\t */\n\t@Prop() public _min?: number | Iso8601;\n\n\t/**\n\t * Gibt den technischen Namen des Eingabefeldes an.\n\t */\n\t@Prop() public _name?: string;\n\n\t/**\n\t * Gibt die EventCallback-Funktionen für das Input-Event an.\n\t */\n\t@Prop() public _on?: InputTypeOnDefault;\n\n\t/**\n\t * Gibt den Platzhalter des Eingabefeldes an, wenn es leer ist.\n\t */\n\t@Prop() public _placeholder?: string;\n\n\t/**\n\t * Setzt das Eingabefeld in den schreibgeschützten Modus.\n\t */\n\t@Prop({ reflect: true }) public _readOnly?: boolean;\n\n\t/**\n\t * Macht das Eingabeelement zu einem Pflichtfeld.\n\t */\n\t@Prop({ reflect: true }) public _required?: boolean;\n\n\t/**\n\t * Ermöglicht eine Schaltfläche ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (ohne label).\n\t */\n\t@Prop() public _smartButton?: ButtonProps;\n\n\t/**\n\t * Gibt die Schrittweite der Wertveränderung an\n\t */\n\t@Prop() public _step?: number;\n\n\t/**\n\t * Gibt an, welchen Tab-Index dieses Input hat.\n\t */\n\t@Prop() public _tabIndex?: number;\n\n\t/**\n\t * Gibt an, ob dieses Eingabefeld von Nutzer:innen einmal besucht/berührt wurde.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _touched?: boolean = false;\n\n\t/**\n\t * Gibt an, ob es ein DateTime-, Date-, Month-, Week-, Time-, DateTime-Local-, Number-Eingabefeld ist.\n\t *\n\t * @deprecated Das W3C hat die Date-Typen in eine eigene Gruppe zusammengefasst. Verwende hierfür die InputDate-Komponente.\n\t */\n\t@Prop() public _type?: InputNumberType = 'number';\n\n\t/**\n\t * Gibt den Wert des Eingabefeldes an.\n\t */\n\t@Prop({ mutable: true }) public _value?: number | Iso8601 | null;\n\n\t@State() public state: States = {\n\t\t_autoComplete: 'off',\n\t\t_id: nonce(), // ⚠ required\n\t\t_hasValue: false,\n\t\t_list: [],\n\t\t_type: 'number',\n\t};\n\n\tpublic constructor() {\n\t\tthis.controller = new InputNumberController(this, 'number', this.host);\n\t}\n\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\tthis.controller.validateAlert(value);\n\t}\n\n\t@Watch('_autoComplete')\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\tthis.controller.validateAutoComplete(value);\n\t}\n\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t@Watch('_error')\n\tpublic validateError(value?: string): void {\n\t\tthis.controller.validateError(value);\n\t}\n\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t@Watch('_icon')\n\tpublic validateIcon(value?: Stringified<KoliBriHorizontalIcon>): void {\n\t\tthis.controller.validateIcon(value);\n\t}\n\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t@Watch('_list')\n\tpublic validateList(value?: Stringified<string[]>): void {\n\t\tthis.controller.validateList(value);\n\t}\n\n\t@Watch('_max')\n\tpublic validateMax(value?: number | Iso8601): void {\n\t\tthis.controller.validateMax(value);\n\t}\n\n\t@Watch('_min')\n\tpublic validateMin(value?: number | Iso8601): void {\n\t\tthis.controller.validateMin(value);\n\t}\n\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t@Watch('_placeholder')\n\tpublic validatePlaceholder(value?: string): void {\n\t\tthis.controller.validatePlaceholder(value);\n\t}\n\n\t@Watch('_readOnly')\n\tpublic validateReadOnly(value?: boolean): void {\n\t\tthis.controller.validateReadOnly(value);\n\t}\n\n\t@Watch('_required')\n\tpublic validateRequired(value?: boolean): void {\n\t\tthis.controller.validateRequired(value);\n\t}\n\n\t@Watch('_smartButton')\n\tpublic validateSmartButton(value?: ButtonProps | string): void {\n\t\tthis.controller.validateSmartButton(value);\n\t}\n\n\t@Watch('_step')\n\tpublic validateStep(value?: number): void {\n\t\tthis.controller.validateStep(value);\n\t}\n\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tthis.controller.validateTabIndex(value);\n\t}\n\n\t@Watch('_touched')\n\tpublic validateTouched(value?: boolean): void {\n\t\tthis.controller.validateTouched(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t * @deprecated\n\t */\n\t@Watch('_type')\n\tpublic validateType(value?: InputNumberType): void {\n\t\tthis.controller.validateType(value);\n\t}\n\n\t@Watch('_value')\n\tpublic validateValue(value?: number | Iso8601 | null): void {\n\t\tthis.controller.validateValueEx(value, (v) => {\n\t\t\tif (v === '' && this.ref) {\n\t\t\t\tthis.ref.value = '';\n\t\t\t}\n\t\t});\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis._alert = this._alert === true;\n\t\tthis._touched = this._touched === true;\n\t\tthis.controller.componentWillLoad();\n\n\t\tthis.state._hasValue = !!this.state._value;\n\t\tthis.controller.addValueChangeListener((v) => (this.state._hasValue = !!v));\n\t}\n}\n"],"version":3}

package/dist/components/component13.js

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";import{v as propagateFocus,n as nonce}from"./prop.validators.js";import{g as getRenderStates}from"./controller.js";import{a as InputRadioController}from"./controller2.js";import{d as defineCustomElement$8}from"./shadow.js";import{d as defineCustomElement$7}from"./component6.js";import{d as defineCustomElement$6}from"./component5.js";import{d as defineCustomElement$5}from"./component4.js";import{d as defineCustomElement$4}from"./component2.js";import{d as defineCustomElement$3}from"./component11.js";import{d as defineCustomElement$2}from"./component3.js";import{d as defineCustomElement$1}from"./component.js";const defaultStyleCss=":host{--a11y-min-size:44px}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.required label>span::after,.required legend>span::after{content:'*'}:host{display:block}input,textarea{cursor:text}input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],input[type='range'],label,option,select{cursor:pointer}input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],select:not([multiple]),select[multiple] option,textarea{font-size:1rem}input[type='file']{padding:calc((var(--a11y-min-size) - 1rem) / 10) 0.5em}select[multiple] option{padding:calc((var(--a11y-min-size) - 1rem) / 2) 0.5em}kol-input.disabled :is(button,input,label,option,select,textarea){cursor:not-allowed;opacity:0.5}:host{--border-width:2px;--input-size:1.5em}kol-input .icons{display:none}label{cursor:pointer}input{appearance:none;border-width:var(--border-width);border-style:solid;border-radius:100%;cursor:pointer;display:flex;height:var(--input-size);margin:0;min-height:var(--input-size);min-width:var(--input-size);padding:0;width:var(--input-size)}input:before{border-radius:100%;content:'';margin:auto;height:calc(var(--input-size) / 2);width:calc(var(--input-size) / 2)}input:checked:before{background-color:#000}fieldset{display:flex}fieldset.vertical{flex-direction:column}fieldset [slot='input']{align-items:center;display:flex}.required label>span::after{content:''}",KolInputRadio=proxyCustomElement(class extends HTMLElement{render(){const{ariaDescribedBy:e,hasError:t}=getRenderStates(this.state);return h(Host,null,h("fieldset",{class:{disabled:!0===this.state._disabled,error:!0===t,required:!0===this.state._required,[this.state._orientation]:!0}},h("legend",{class:"block w-full mb-1 leading-normal"},h("span",null,h("slot",null))),this.state._list.map(((t,i)=>{const a=`${this.state._id}-${i}`;return h("kol-input",{class:{radio:!0},key:a,_disabled:this.state._disabled||t.disabled,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_id:a,_renderNoLabel:!0,_required:this.state._required,_touched:this.state._touched},h("div",{slot:"input"},h("input",Object.assign({ref:this.state._value===t.value?this.catchRef:void 0,accessKey:this.state._accessKey,"aria-describedby":e.length>0?e.join(" "):void 0,"aria-labelledby":`${a}-label`,title:"",type:"radio",id:a,checked:this.state._value===t.value,name:this.state._name||this.state._id,disabled:this.state._disabled||t.disabled,required:this.state._required,tabIndex:this.state._tabIndex,value:`-${i}`},this.controller.onFacade,{onChange:this.onChange})),h("label",{htmlFor:`${a}`,id:`${a}-label`,style:{height:this.state._hideLabel&&!0!==this.state._required?"0":void 0,margin:this.state._hideLabel&&!0!==this.state._required?"0":void 0,padding:this.state._hideLabel&&!0!==this.state._required?"0":void 0,visibility:this.state._hideLabel&&!0!==this.state._required?"hidden":void 0}},h("span",null,h("span",null,t.label)))))})),t&&h("kol-alert",{id:"error",_alert:!0,_type:"error",_variant:"msg"},this.state._error)))}constructor(){super(),this.__registerHost(),this.__attachShadow(),this.catchRef=e=>{this.ref=e,propagateFocus(this.host,this.ref)},this.onChange=e=>{if(e.target instanceof HTMLInputElement){const t=this.controller.getOptionByKey(e.target.value);void 0!==t&&this.controller.setValue(e,t.value)}},this._accessKey=void 0,this._alert=!0,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._id=void 0,this._list=void 0,this._name=void 0,this._on=void 0,this._orientation="vertical",this._required=void 0,this._tabIndex=void 0,this._touched=!1,this._value=void 0,this.state={_id:nonce(),_list:[],_orientation:"vertical"},this.controller=new InputRadioController(this,"radio",this.host)}validateAccessKey(e){this.controller.validateAccessKey(e)}validateAlert(e){this.controller.validateAlert(e)}validateDisabled(e){this.controller.validateDisabled(e)}validateError(e){this.controller.validateError(e)}validateHideLabel(e){this.controller.validateHideLabel(e)}validateHint(e){this.controller.validateHint(e)}validateId(e){this.controller.validateId(e)}validateList(e){this.controller.validateList(e)}validateName(e){this.controller.validateName(e)}validateOn(e){this.controller.validateOn(e)}validateOrientation(e){this.controller.validateOrientation(e)}validateRequired(e){this.controller.validateRequired(e)}validateTabIndex(e){this.controller.validateTabIndex(e)}validateTouched(e){this.controller.validateTouched(e)}validateValue(e){this.controller.validateValue(e)}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.controller.componentWillLoad(this.onChange)}get host(){return this}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_id:["validateId"],_list:["validateList"],_name:["validateName"],_on:["validateOn"],_orientation:["validateOrientation"],_required:["validateRequired"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}static get style(){return{default:defaultStyleCss}}},[33,"kol-input-radio",{_accessKey:[1,"_access-key"],_alert:[1540],_disabled:[516],_error:[1],_hideLabel:[516,"_hide-label"],_hint:[1],_id:[1],_list:[1],_name:[1],_on:[16],_orientation:[1],_required:[516],_tabIndex:[2,"_tab-index"],_touched:[1540],_value:[8],state:[32]}]);function defineCustomElement(){if("undefined"==typeof customElements)return;["kol-input-radio","kol-alert","kol-alert-wc","kol-button-wc","kol-heading-wc","kol-icon","kol-input","kol-span-wc","kol-tooltip"].forEach((e=>{switch(e){case"kol-input-radio":customElements.get(e)||customElements.define(e,KolInputRadio);break;case"kol-alert":customElements.get(e)||defineCustomElement$8();break;case"kol-alert-wc":customElements.get(e)||defineCustomElement$7();break;case"kol-button-wc":customElements.get(e)||defineCustomElement$6();break;case"kol-heading-wc":customElements.get(e)||defineCustomElement$5();break;case"kol-icon":customElements.get(e)||defineCustomElement$4();break;case"kol-input":customElements.get(e)||defineCustomElement$3();break;case"kol-span-wc":customElements.get(e)||defineCustomElement$2();break;case"kol-tooltip":customElements.get(e)||defineCustomElement$1()}}))}export{KolInputRadio as K,defineCustomElement as d};
+import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";import{v as propagateFocus,n as nonce}from"./prop.validators.js";import{g as getRenderStates}from"./controller.js";import{a as InputRadioController}from"./controller2.js";import{d as defineCustomElement$8}from"./shadow.js";import{d as defineCustomElement$7}from"./component6.js";import{d as defineCustomElement$6}from"./component5.js";import{d as defineCustomElement$5}from"./component4.js";import{d as defineCustomElement$4}from"./component2.js";import{d as defineCustomElement$3}from"./component11.js";import{d as defineCustomElement$2}from"./component3.js";import{d as defineCustomElement$1}from"./component.js";const defaultStyleCss=":host{--a11y-min-size:44px}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.required label>span::after,.required legend>span::after{content:'*'}:host{display:block}input,textarea{cursor:text}input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],input[type='range'],label,option,select{cursor:pointer}input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],select:not([multiple]),select[multiple] option,textarea{font-size:1rem;width:100%}input[type='file']{padding:calc((var(--a11y-min-size) - 1rem) / 10) 0.5em}select[multiple] option{padding:calc((var(--a11y-min-size) - 1rem) / 2) 0.5em}kol-input.disabled :is(button,input,label,option,select,textarea){cursor:not-allowed;opacity:0.5}:host{--border-width:2px;--input-size:1.5em}kol-input .icons{display:none}label{cursor:pointer}input{appearance:none;border-width:var(--border-width);border-style:solid;border-radius:100%;cursor:pointer;display:flex;height:var(--input-size);margin:0;min-height:var(--input-size);min-width:var(--input-size);padding:0;width:var(--input-size)}input:before{border-radius:100%;content:'';margin:auto;height:calc(var(--input-size) / 2);width:calc(var(--input-size) / 2)}input:checked:before{background-color:#000}fieldset{display:flex}fieldset.vertical{flex-direction:column}fieldset [slot='input']{align-items:center;display:flex}.required label>span::after{content:''}",KolInputRadio=proxyCustomElement(class extends HTMLElement{render(){const{ariaDescribedBy:e,hasError:t}=getRenderStates(this.state);return h(Host,null,h("fieldset",{class:{disabled:!0===this.state._disabled,error:!0===t,required:!0===this.state._required,[this.state._orientation]:!0}},h("legend",{class:"block w-full mb-1 leading-normal"},h("span",null,h("slot",null))),this.state._list.map(((t,i)=>{const a=`${this.state._id}-${i}`;return h("kol-input",{class:{radio:!0},key:a,_disabled:this.state._disabled||t.disabled,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_id:a,_renderNoLabel:!0,_required:this.state._required,_touched:this.state._touched},h("div",{slot:"input"},h("input",Object.assign({ref:this.state._value===t.value?this.catchRef:void 0,accessKey:this.state._accessKey,"aria-describedby":e.length>0?e.join(" "):void 0,"aria-labelledby":`${a}-label`,title:"",type:"radio",id:a,checked:this.state._value===t.value,name:this.state._name||this.state._id,disabled:this.state._disabled||t.disabled,required:this.state._required,tabIndex:this.state._tabIndex,value:`-${i}`},this.controller.onFacade,{onChange:this.onChange})),h("label",{htmlFor:`${a}`,id:`${a}-label`,style:{height:this.state._hideLabel&&!0!==this.state._required?"0":void 0,margin:this.state._hideLabel&&!0!==this.state._required?"0":void 0,padding:this.state._hideLabel&&!0!==this.state._required?"0":void 0,visibility:this.state._hideLabel&&!0!==this.state._required?"hidden":void 0}},h("span",null,h("span",null,t.label)))))})),t&&h("kol-alert",{id:"error",_alert:!0,_type:"error",_variant:"msg"},this.state._error)))}constructor(){super(),this.__registerHost(),this.__attachShadow(),this.catchRef=e=>{this.ref=e,propagateFocus(this.host,this.ref)},this.onChange=e=>{if(e.target instanceof HTMLInputElement){const t=this.controller.getOptionByKey(e.target.value);void 0!==t&&this.controller.setValue(e,t.value)}},this._accessKey=void 0,this._alert=!0,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._id=void 0,this._list=void 0,this._name=void 0,this._on=void 0,this._orientation="vertical",this._required=void 0,this._tabIndex=void 0,this._touched=!1,this._value=void 0,this.state={_id:nonce(),_list:[],_orientation:"vertical"},this.controller=new InputRadioController(this,"radio",this.host)}validateAccessKey(e){this.controller.validateAccessKey(e)}validateAlert(e){this.controller.validateAlert(e)}validateDisabled(e){this.controller.validateDisabled(e)}validateError(e){this.controller.validateError(e)}validateHideLabel(e){this.controller.validateHideLabel(e)}validateHint(e){this.controller.validateHint(e)}validateId(e){this.controller.validateId(e)}validateList(e){this.controller.validateList(e)}validateName(e){this.controller.validateName(e)}validateOn(e){this.controller.validateOn(e)}validateOrientation(e){this.controller.validateOrientation(e)}validateRequired(e){this.controller.validateRequired(e)}validateTabIndex(e){this.controller.validateTabIndex(e)}validateTouched(e){this.controller.validateTouched(e)}validateValue(e){this.controller.validateValue(e)}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.controller.componentWillLoad(this.onChange)}get host(){return this}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_id:["validateId"],_list:["validateList"],_name:["validateName"],_on:["validateOn"],_orientation:["validateOrientation"],_required:["validateRequired"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}static get style(){return{default:defaultStyleCss}}},[33,"kol-input-radio",{_accessKey:[1,"_access-key"],_alert:[1540],_disabled:[516],_error:[1],_hideLabel:[516,"_hide-label"],_hint:[1],_id:[1],_list:[1],_name:[1],_on:[16],_orientation:[1],_required:[516],_tabIndex:[2,"_tab-index"],_touched:[1540],_value:[8],state:[32]}]);function defineCustomElement(){if("undefined"==typeof customElements)return;["kol-input-radio","kol-alert","kol-alert-wc","kol-button-wc","kol-heading-wc","kol-icon","kol-input","kol-span-wc","kol-tooltip"].forEach((e=>{switch(e){case"kol-input-radio":customElements.get(e)||customElements.define(e,KolInputRadio);break;case"kol-alert":customElements.get(e)||defineCustomElement$8();break;case"kol-alert-wc":customElements.get(e)||defineCustomElement$7();break;case"kol-button-wc":customElements.get(e)||defineCustomElement$6();break;case"kol-heading-wc":customElements.get(e)||defineCustomElement$5();break;case"kol-icon":customElements.get(e)||defineCustomElement$4();break;case"kol-input":customElements.get(e)||defineCustomElement$3();break;case"kol-span-wc":customElements.get(e)||defineCustomElement$2();break;case"kol-tooltip":customElements.get(e)||defineCustomElement$1()}}))}export{KolInputRadio as K,defineCustomElement as d};

package/dist/components/component13.js.map

@@ -1 +1 @@
-{"file":"component13.js","mappings":"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","names":[],"sources":["./src/components/input-radio/style.css?tag=kol-input-radio&mode=default&encapsulation=shadow","./src/components/input-radio/component.tsx"],"sourcesContent":["@import url(../input.css);\n:host {\n\t--border-width: 2px;\n\t--input-size: 1.5em;\n}\nkol-input .icons {\n\tdisplay: none;\n}\nlabel {\n\tcursor: pointer;\n}\ninput {\n\tappearance: none;\n\tborder-width: var(--border-width);\n\tborder-style: solid;\n\tborder-radius: 100%;\n\tcursor: pointer;\n\tdisplay: flex;\n\theight: var(--input-size);\n\tmargin: 0;\n\tmin-height: var(--input-size);\n\tmin-width: var(--input-size);\n\tpadding: 0;\n\twidth: var(--input-size);\n}\ninput:before {\n\tborder-radius: 100%;\n\tcontent: '';\n\tmargin: auto;\n\theight: calc(var(--input-size) / 2);\n\twidth: calc(var(--input-size) / 2);\n}\ninput:checked:before {\n\tbackground-color: #000;\n}\nfieldset {\n\tdisplay: flex;\n}\nfieldset.vertical {\n\tflex-direction: column;\n}\nfieldset [slot='input'] {\n\talign-items: center;\n\tdisplay: flex;\n}\n/* required star is on fieldset legend */\n.required label > span::after {\n\tcontent: '';\n}\n","import { Component, Element, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\nimport { Stringified } from '../../types/common';\n\nimport { InputTypeOnDefault, Option } from '../../types/input/types';\nimport { Orientation } from '../../types/orientation';\nimport { W3CInputValue } from '../../types/w3c';\nimport { propagateFocus } from '../../utils/reuse';\nimport { getRenderStates } from '../input/controller';\nimport { InputRadioController } from './controller';\nimport { ComponentApi, States } from './types';\nimport { nonce } from '../../utils/dev.utils';\n\n@Component({\n\ttag: 'kol-input-radio',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolInputRadio implements ComponentApi {\n\t@Element() private readonly host?: HTMLKolInputRadioElement;\n\tprivate ref?: HTMLInputElement;\n\n\tprivate readonly catchRef = (ref?: HTMLInputElement) => {\n\t\tthis.ref = ref;\n\t\tpropagateFocus(this.host, this.ref);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { ariaDescribedBy, hasError } = getRenderStates(this.state);\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<fieldset\n\t\t\t\t\tclass={{\n\t\t\t\t\t\tdisabled: this.state._disabled === true,\n\t\t\t\t\t\terror: hasError === true,\n\t\t\t\t\t\trequired: this.state._required === true,\n\t\t\t\t\t\t[this.state._orientation]: true,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<legend class=\"block w-full mb-1 leading-normal\">\n\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t<slot />\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</legend>\n\n\t\t\t\t\t{this.state._list.map((option, index) => {\n\t\t\t\t\t\t/**\n\t\t\t\t\t\t * Damit der Value einer Option ein beliebigen Typ haben kann\n\t\t\t\t\t\t * muss man auf HTML-Ebene den Value auf einen String-Wert\n\t\t\t\t\t\t * mappen. Das tun wir mittels der Map.\n\t\t\t\t\t\t */\n\t\t\t\t\t\tconst customId = `${this.state._id}-${index}`;\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<kol-input\n\t\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t\tradio: true,\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tkey={customId}\n\t\t\t\t\t\t\t\t_disabled={this.state._disabled || option.disabled}\n\t\t\t\t\t\t\t\t_hideLabel={this.state._hideLabel}\n\t\t\t\t\t\t\t\t_hint={this.state._hint}\n\t\t\t\t\t\t\t\t_id={customId}\n\t\t\t\t\t\t\t\t_renderNoLabel={true}\n\t\t\t\t\t\t\t\t_required={this.state._required}\n\t\t\t\t\t\t\t\t_touched={this.state._touched}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<div slot=\"input\">\n\t\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\t\tref={this.state._value === option.value ? this.catchRef : undefined}\n\t\t\t\t\t\t\t\t\t\taccessKey={this.state._accessKey} // by radio?!\n\t\t\t\t\t\t\t\t\t\taria-describedby={ariaDescribedBy.length > 0 ? ariaDescribedBy.join(' ') : undefined}\n\t\t\t\t\t\t\t\t\t\taria-labelledby={`${customId}-label`}\n\t\t\t\t\t\t\t\t\t\ttitle=\"\"\n\t\t\t\t\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\t\t\t\t\tid={customId}\n\t\t\t\t\t\t\t\t\t\tchecked={this.state._value === option.value}\n\t\t\t\t\t\t\t\t\t\tname={this.state._name || this.state._id}\n\t\t\t\t\t\t\t\t\t\tdisabled={this.state._disabled || option.disabled}\n\t\t\t\t\t\t\t\t\t\trequired={this.state._required}\n\t\t\t\t\t\t\t\t\t\ttabIndex={this.state._tabIndex}\n\t\t\t\t\t\t\t\t\t\tvalue={`-${index}`}\n\t\t\t\t\t\t\t\t\t\t{...this.controller.onFacade}\n\t\t\t\t\t\t\t\t\t\tonChange={this.onChange}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t<label\n\t\t\t\t\t\t\t\t\t\thtmlFor={`${customId}`}\n\t\t\t\t\t\t\t\t\t\tid={`${customId}-label`}\n\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\theight: this.state._hideLabel && this.state._required !== true ? '0' : undefined,\n\t\t\t\t\t\t\t\t\t\t\tmargin: this.state._hideLabel && this.state._required !== true ? '0' : undefined,\n\t\t\t\t\t\t\t\t\t\t\tpadding: this.state._hideLabel && this.state._required !== true ? '0' : undefined,\n\t\t\t\t\t\t\t\t\t\t\tvisibility: this.state._hideLabel && this.state._required !== true ? 'hidden' : undefined,\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t\t\t\t\t<span>{option.label}</span>\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t</label>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</kol-input>\n\t\t\t\t\t\t);\n\t\t\t\t\t})}\n\t\t\t\t\t{hasError && (\n\t\t\t\t\t\t<kol-alert id=\"error\" _alert={true} _type=\"error\" _variant=\"msg\">\n\t\t\t\t\t\t\t{this.state._error}\n\t\t\t\t\t\t</kol-alert>\n\t\t\t\t\t)}\n\t\t\t\t</fieldset>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate readonly controller: InputRadioController;\n\n\t/**\n\t * Gibt an, mit welcher Tastenkombination man das Input auslösen oder fokussieren kann.\n\t */\n\t@Prop() public _accessKey?: string;\n\n\t/**\n\t * Gibt an, ob die Fehlermeldung vorgelesen werden soll, wenn es eine gibt.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _alert?: boolean = true;\n\n\t/**\n\t * Setzt das Feld in einen inaktiven Zustand, in dem es keine Interaktion erlaubt.\n\t */\n\t@Prop({ reflect: true }) public _disabled?: boolean;\n\n\t/**\n\t * Gibt den Text für eine Fehlermeldung an.\n\t */\n\t@Prop() public _error?: string;\n\n\t/**\n\t * Versteckt das sichtbare Label des Elements.\n\t */\n\t@Prop({ reflect: true }) public _hideLabel?: boolean;\n\n\t/**\n\t * Gibt den Hinweistext an.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * Gibt die technische ID des Eingabefeldes an.\n\t */\n\t@Prop() public _id?: string;\n\n\t/**\n\t * Gibt die Liste der Optionen für das Eingabefeld an.\n\t */\n\t@Prop() public _list!: Stringified<Option<W3CInputValue>[]>;\n\n\t/**\n\t * Gibt den technischen Namen des Eingabefeldes an.\n\t */\n\t@Prop() public _name?: string;\n\n\t/**\n\t * Gibt die EventCallback-Funktionen für das Input-Event an.\n\t */\n\t@Prop() public _on?: InputTypeOnDefault;\n\n\t/**\n\t * Gibt die Ausrichtung der LinkList an.\n\t */\n\t@Prop() public _orientation?: Orientation = 'vertical';\n\n\t/**\n\t * Macht das Eingabeelement zu einem Pflichtfeld.\n\t */\n\t@Prop({ reflect: true }) public _required?: boolean;\n\n\t/**\n\t * Gibt an, welchen Tab-Index dieses Input hat.\n\t */\n\t@Prop() public _tabIndex?: number;\n\n\t/**\n\t * Gibt an, ob dieses Eingabefeld von Nutzer:innen einmal besucht/berührt wurde.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _touched?: boolean = false;\n\n\t/**\n\t * Gibt den Wert der Radio an. (Known Bug: https://github.com/ionic-team/stencil/issues/3902)\n\t */\n\t@Prop() public _value?: Stringified<W3CInputValue>;\n\n\t@State() public state: States = {\n\t\t_id: nonce(), // ⚠ required\n\t\t_list: [],\n\n\t\t_orientation: 'vertical',\n\t};\n\n\tpublic constructor() {\n\t\tthis.controller = new InputRadioController(this, 'radio', this.host);\n\t}\n\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\tthis.controller.validateAlert(value);\n\t}\n\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t@Watch('_error')\n\tpublic validateError(value?: string): void {\n\t\tthis.controller.validateError(value);\n\t}\n\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t@Watch('_list')\n\tpublic validateList(value?: Stringified<Option<W3CInputValue>[]>): void {\n\t\tthis.controller.validateList(value);\n\t}\n\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t@Watch('_orientation')\n\tpublic validateOrientation(value?: Orientation): void {\n\t\tthis.controller.validateOrientation(value);\n\t}\n\n\t@Watch('_required')\n\tpublic validateRequired(value?: boolean): void {\n\t\tthis.controller.validateRequired(value);\n\t}\n\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tthis.controller.validateTabIndex(value);\n\t}\n\n\t@Watch('_touched')\n\tpublic validateTouched(value?: boolean): void {\n\t\tthis.controller.validateTouched(value);\n\t}\n\n\t@Watch('_value')\n\tpublic validateValue(value?: Stringified<unknown>): void {\n\t\tthis.controller.validateValue(value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis._alert = this._alert === true;\n\t\tthis._touched = this._touched === true;\n\t\tthis.controller.componentWillLoad(this.onChange);\n\t}\n\n\tprivate onChange = (event: Event): void => {\n\t\tif (event.target instanceof HTMLInputElement) {\n\t\t\tconst option = this.controller.getOptionByKey(event.target.value);\n\t\t\tif (option !== undefined) {\n\t\t\t\tthis.controller.setValue(event, option.value as string); // TODO: fix type\n\t\t\t}\n\t\t}\n\t};\n}\n"],"version":3}
+{"file":"component13.js","mappings":"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","names":[],"sources":["./src/components/input-radio/style.css?tag=kol-input-radio&mode=default&encapsulation=shadow","./src/components/input-radio/component.tsx"],"sourcesContent":["@import url(../input.css);\n:host {\n\t--border-width: 2px;\n\t--input-size: 1.5em;\n}\nkol-input .icons {\n\tdisplay: none;\n}\nlabel {\n\tcursor: pointer;\n}\ninput {\n\tappearance: none;\n\tborder-width: var(--border-width);\n\tborder-style: solid;\n\tborder-radius: 100%;\n\tcursor: pointer;\n\tdisplay: flex;\n\theight: var(--input-size);\n\tmargin: 0;\n\tmin-height: var(--input-size);\n\tmin-width: var(--input-size);\n\tpadding: 0;\n\twidth: var(--input-size);\n}\ninput:before {\n\tborder-radius: 100%;\n\tcontent: '';\n\tmargin: auto;\n\theight: calc(var(--input-size) / 2);\n\twidth: calc(var(--input-size) / 2);\n}\ninput:checked:before {\n\tbackground-color: #000;\n}\nfieldset {\n\tdisplay: flex;\n}\nfieldset.vertical {\n\tflex-direction: column;\n}\nfieldset [slot='input'] {\n\talign-items: center;\n\tdisplay: flex;\n}\n/* required star is on fieldset legend */\n.required label > span::after {\n\tcontent: '';\n}\n","import { Component, Element, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\nimport { Stringified } from '../../types/common';\n\nimport { InputTypeOnDefault, Option } from '../../types/input/types';\nimport { Orientation } from '../../types/orientation';\nimport { W3CInputValue } from '../../types/w3c';\nimport { propagateFocus } from '../../utils/reuse';\nimport { getRenderStates } from '../input/controller';\nimport { InputRadioController } from './controller';\nimport { ComponentApi, States } from './types';\nimport { nonce } from '../../utils/dev.utils';\n\n/**\n * @slot default Die Legende/Überschrift der Radiobuttons.\n */\n@Component({\n\ttag: 'kol-input-radio',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolInputRadio implements ComponentApi {\n\t@Element() private readonly host?: HTMLKolInputRadioElement;\n\tprivate ref?: HTMLInputElement;\n\n\tprivate readonly catchRef = (ref?: HTMLInputElement) => {\n\t\tthis.ref = ref;\n\t\tpropagateFocus(this.host, this.ref);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { ariaDescribedBy, hasError } = getRenderStates(this.state);\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<fieldset\n\t\t\t\t\tclass={{\n\t\t\t\t\t\tdisabled: this.state._disabled === true,\n\t\t\t\t\t\terror: hasError === true,\n\t\t\t\t\t\trequired: this.state._required === true,\n\t\t\t\t\t\t[this.state._orientation]: true,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<legend class=\"block w-full mb-1 leading-normal\">\n\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t{/* TODO: Für was wird dieses span benötigt? */}\n\t\t\t\t\t\t\t<slot />\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</legend>\n\n\t\t\t\t\t{this.state._list.map((option, index) => {\n\t\t\t\t\t\t/**\n\t\t\t\t\t\t * Damit der Value einer Option ein beliebigen Typ haben kann\n\t\t\t\t\t\t * muss man auf HTML-Ebene den Value auf einen String-Wert\n\t\t\t\t\t\t * mappen. Das tun wir mittels der Map.\n\t\t\t\t\t\t */\n\t\t\t\t\t\tconst customId = `${this.state._id}-${index}`;\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<kol-input\n\t\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t\tradio: true,\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tkey={customId}\n\t\t\t\t\t\t\t\t_disabled={this.state._disabled || option.disabled}\n\t\t\t\t\t\t\t\t_hideLabel={this.state._hideLabel}\n\t\t\t\t\t\t\t\t_hint={this.state._hint}\n\t\t\t\t\t\t\t\t_id={customId}\n\t\t\t\t\t\t\t\t_renderNoLabel={true}\n\t\t\t\t\t\t\t\t_required={this.state._required}\n\t\t\t\t\t\t\t\t_touched={this.state._touched}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<div slot=\"input\">\n\t\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\t\tref={this.state._value === option.value ? this.catchRef : undefined}\n\t\t\t\t\t\t\t\t\t\taccessKey={this.state._accessKey} // by radio?!\n\t\t\t\t\t\t\t\t\t\taria-describedby={ariaDescribedBy.length > 0 ? ariaDescribedBy.join(' ') : undefined}\n\t\t\t\t\t\t\t\t\t\taria-labelledby={`${customId}-label`}\n\t\t\t\t\t\t\t\t\t\ttitle=\"\"\n\t\t\t\t\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\t\t\t\t\tid={customId}\n\t\t\t\t\t\t\t\t\t\tchecked={this.state._value === option.value}\n\t\t\t\t\t\t\t\t\t\tname={this.state._name || this.state._id}\n\t\t\t\t\t\t\t\t\t\tdisabled={this.state._disabled || option.disabled}\n\t\t\t\t\t\t\t\t\t\trequired={this.state._required}\n\t\t\t\t\t\t\t\t\t\ttabIndex={this.state._tabIndex}\n\t\t\t\t\t\t\t\t\t\tvalue={`-${index}`}\n\t\t\t\t\t\t\t\t\t\t{...this.controller.onFacade}\n\t\t\t\t\t\t\t\t\t\tonChange={this.onChange}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t<label\n\t\t\t\t\t\t\t\t\t\thtmlFor={`${customId}`}\n\t\t\t\t\t\t\t\t\t\tid={`${customId}-label`}\n\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\theight: this.state._hideLabel && this.state._required !== true ? '0' : undefined,\n\t\t\t\t\t\t\t\t\t\t\tmargin: this.state._hideLabel && this.state._required !== true ? '0' : undefined,\n\t\t\t\t\t\t\t\t\t\t\tpadding: this.state._hideLabel && this.state._required !== true ? '0' : undefined,\n\t\t\t\t\t\t\t\t\t\t\tvisibility: this.state._hideLabel && this.state._required !== true ? 'hidden' : undefined,\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t\t\t\t\t<span>{option.label}</span>\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t</label>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</kol-input>\n\t\t\t\t\t\t);\n\t\t\t\t\t})}\n\t\t\t\t\t{hasError && (\n\t\t\t\t\t\t<kol-alert id=\"error\" _alert={true} _type=\"error\" _variant=\"msg\">\n\t\t\t\t\t\t\t{this.state._error}\n\t\t\t\t\t\t</kol-alert>\n\t\t\t\t\t)}\n\t\t\t\t</fieldset>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate readonly controller: InputRadioController;\n\n\t/**\n\t * Gibt an, mit welcher Tastenkombination man das Input auslösen oder fokussieren kann.\n\t */\n\t@Prop() public _accessKey?: string;\n\n\t/**\n\t * Gibt an, ob die Fehlermeldung vorgelesen werden soll, wenn es eine gibt.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _alert?: boolean = true;\n\n\t/**\n\t * Setzt das Feld in einen inaktiven Zustand, in dem es keine Interaktion erlaubt.\n\t */\n\t@Prop({ reflect: true }) public _disabled?: boolean;\n\n\t/**\n\t * Gibt den Text für eine Fehlermeldung an.\n\t */\n\t@Prop() public _error?: string;\n\n\t/**\n\t * Versteckt das sichtbare Label des Elements.\n\t */\n\t@Prop({ reflect: true }) public _hideLabel?: boolean;\n\n\t/**\n\t * Gibt den Hinweistext an.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * Gibt die technische ID des Eingabefeldes an.\n\t */\n\t@Prop() public _id?: string;\n\n\t/**\n\t * Gibt die Liste der Optionen für das Eingabefeld an.\n\t */\n\t@Prop() public _list!: Stringified<Option<W3CInputValue>[]>;\n\n\t/**\n\t * Gibt den technischen Namen des Eingabefeldes an.\n\t */\n\t@Prop() public _name?: string;\n\n\t/**\n\t * Gibt die EventCallback-Funktionen für das Input-Event an.\n\t */\n\t@Prop() public _on?: InputTypeOnDefault;\n\n\t/**\n\t * Gibt die Ausrichtung der LinkList an.\n\t */\n\t@Prop() public _orientation?: Orientation = 'vertical';\n\n\t/**\n\t * Macht das Eingabeelement zu einem Pflichtfeld.\n\t */\n\t@Prop({ reflect: true }) public _required?: boolean;\n\n\t/**\n\t * Gibt an, welchen Tab-Index dieses Input hat.\n\t */\n\t@Prop() public _tabIndex?: number;\n\n\t/**\n\t * Gibt an, ob dieses Eingabefeld von Nutzer:innen einmal besucht/berührt wurde.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _touched?: boolean = false;\n\n\t/**\n\t * Gibt den Wert der Radio an. (Known Bug: https://github.com/ionic-team/stencil/issues/3902)\n\t */\n\t@Prop() public _value?: Stringified<W3CInputValue>;\n\n\t@State() public state: States = {\n\t\t_id: nonce(), // ⚠ required\n\t\t_list: [],\n\n\t\t_orientation: 'vertical',\n\t};\n\n\tpublic constructor() {\n\t\tthis.controller = new InputRadioController(this, 'radio', this.host);\n\t}\n\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\tthis.controller.validateAlert(value);\n\t}\n\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t@Watch('_error')\n\tpublic validateError(value?: string): void {\n\t\tthis.controller.validateError(value);\n\t}\n\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t@Watch('_list')\n\tpublic validateList(value?: Stringified<Option<W3CInputValue>[]>): void {\n\t\tthis.controller.validateList(value);\n\t}\n\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t@Watch('_orientation')\n\tpublic validateOrientation(value?: Orientation): void {\n\t\tthis.controller.validateOrientation(value);\n\t}\n\n\t@Watch('_required')\n\tpublic validateRequired(value?: boolean): void {\n\t\tthis.controller.validateRequired(value);\n\t}\n\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tthis.controller.validateTabIndex(value);\n\t}\n\n\t@Watch('_touched')\n\tpublic validateTouched(value?: boolean): void {\n\t\tthis.controller.validateTouched(value);\n\t}\n\n\t@Watch('_value')\n\tpublic validateValue(value?: Stringified<unknown>): void {\n\t\tthis.controller.validateValue(value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis._alert = this._alert === true;\n\t\tthis._touched = this._touched === true;\n\t\tthis.controller.componentWillLoad(this.onChange);\n\t}\n\n\tprivate onChange = (event: Event): void => {\n\t\tif (event.target instanceof HTMLInputElement) {\n\t\t\tconst option = this.controller.getOptionByKey(event.target.value);\n\t\t\tif (option !== undefined) {\n\t\t\t\tthis.controller.setValue(event, option.value as string); // TODO: fix type\n\t\t\t}\n\t\t}\n\t};\n}\n"],"version":3}

package/dist/components/component15.js

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";import{j as a11yHint,w as watchString,F as watchJsonArrayString,l as watchBoolean,B as watchNumber,M as STATE_CHANGE_EVENT,v as propagateFocus,n as nonce}from"./prop.validators.js";import{g as getRenderStates}from"./controller.js";import{I as InputIconController}from"./controller-icon.js";import{f as fillKeyOptionMap}from"./controller2.js";import{h as hasEnoughReadableChars,e as containsOnlyNumbers,d as defineCustomElement$2}from"./component3.js";import{d as defineCustomElement$8}from"./shadow.js";import{d as defineCustomElement$7}from"./component6.js";import{d as defineCustomElement$6}from"./component5.js";import{d as defineCustomElement$5}from"./component4.js";import{d as defineCustomElement$4}from"./component2.js";import{d as defineCustomElement$3}from"./component11.js";import{d as defineCustomElement$1}from"./component.js";const validateInputSelectList=e=>{if("object"==typeof e&&null!==e){if("string"==typeof e.label&&e.label.length>0)return e.disabled=!0===e.disabled,e.label=`${e.label}`.trim(),!1===hasEnoughReadableChars(e.label,3)&&!1===containsOnlyNumbers(e.label)&&a11yHint(`Ein abweichendes Aria-Label (${e.label}) ist nicht barrierefrei. Ein abweichendes Aria-Label sollte aus mindestens drei lesbaren Zeichen bestehen.`),!Array.isArray(e.options)||void 0===e.options.find((e=>!1===validateInputSelectList(e)));if("number"==typeof e.label)return!0}return!1};class SelectController extends InputIconController{constructor(e,t,i){super(e,t,i),this.keyOptionMap=new Map,this.getOptionByKey=e=>this.keyOptionMap.get(e),this.isValueInOptions=(e,t)=>void 0!==t.find((t=>"string"==typeof t.value?t.value===e:!!Array.isArray(t.options)&&this.isValueInOptions(e,t.options))),this.filterValuesInOptions=(e,t)=>e.filter((e=>void 0!==this.isValueInOptions(e,t))),this.beforePatchListValue=(e,t)=>{const i=t.has("_list")?t.get("_list"):this.component.state._list;if(Array.isArray(i)&&i.length>0){this.keyOptionMap.clear(),fillKeyOptionMap(this.keyOptionMap,i);const e=t.has("_value")?t.get("_value"):this.component.state._value,a=this.filterValuesInOptions(Array.isArray(e)&&e.length>0?e:[],i);!1===this.component._multiple&&0===a.length?(t.set("_value",[i[0].value]),this.onStateChange()):Array.isArray(e)&&a.length<e.length&&(t.set("_value",a),this.onStateChange())}},this.component=e}validateHeight(e){watchString(this.component,"_height",e)}validateList(e){watchJsonArrayString(this.component,"_list",validateInputSelectList,e,void 0,{hooks:{beforePatch:this.beforePatchListValue}})}validateMultiple(e){watchBoolean(this.component,"_multiple",e,{hooks:{beforePatch:this.beforePatchListValue}})}validateRequired(e){watchBoolean(this.component,"_required",e)}validateSize(e){watchNumber(this.component,"_size",e,{min:1})}validateValue(e){watchJsonArrayString(this.component,"_value",(()=>!0),e,void 0,{hooks:{beforePatch:this.beforePatchListValue}}),this.setFormAssociatedValue(this.component._value)}componentWillLoad(e){super.componentWillLoad(),this.onStateChange=()=>{if("function"==typeof e){const t=setTimeout((()=>{clearTimeout(t),e(STATE_CHANGE_EVENT)}))}},this.validateHeight(this.component._height),this.validateList(this.component._list),this.validateMultiple(this.component._multiple),this.validateRequired(this.component._required),this.validateSize(this.component._size),this.validateValue(this.component._value)}}const defaultStyleCss=":host{--a11y-min-size:44px}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.required label>span::after,.required legend>span::after{content:'*'}:host{display:block}input,textarea{cursor:text}input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],input[type='range'],label,option,select{cursor:pointer}input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],select:not([multiple]),select[multiple] option,textarea{font-size:1rem}input[type='file']{padding:calc((var(--a11y-min-size) - 1rem) / 10) 0.5em}select[multiple] option{padding:calc((var(--a11y-min-size) - 1rem) / 2) 0.5em}kol-input.disabled :is(button,input,label,option,select,textarea){cursor:not-allowed;opacity:0.5}kol-input{display:grid}kol-input [slot='input']{flex-grow:1}input:not([type='checkbox'],[type='radio']),select:not([multiple]){height:2.75em}input:focus,option:focus,select:focus,textarea:focus{outline:0}.input{display:flex;align-items:center}.input>kol-icon{display:grid;height:var(--a11y-min-size);place-items:center}",isSelected=(e,t)=>Array.isArray(e)&&e.includes(t),KolSelect=proxyCustomElement(class extends HTMLElement{renderOptgroup(e,t){var i;return h("optgroup",{disabled:!0===e.disabled,label:e.label},null===(i=e.options)||void 0===i?void 0:i.map(((e,i)=>{const a=`${t}-${i}`;return Array.isArray(e.options)?this.renderOptgroup(e,a):h("option",{disabled:!0===e.disabled,key:a,selected:isSelected(this.state._value,e.value),value:a},e.label)})))}render(){const{ariaDescribedBy:e}=getRenderStates(this.state);return h(Host,{class:{"has-value":this.state._hasValue}},h("kol-input",{class:{select:!0},_disabled:this.state._disabled,_error:this.state._error,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icon:this.state._icon,_id:this.state._id,_required:this.state._required,_touched:this.state._touched,onClick:()=>{var e;return null===(e=this.ref)||void 0===e?void 0:e.focus()}},h("span",{slot:"label"},h("slot",null)),h("select",Object.assign({ref:this.catchRef,title:"",accessKey:this.state._accessKey,"aria-describedby":e.length>0?e.join(" "):void 0,"aria-labelledby":`${this.state._id}-label`,autoCapitalize:"off",autoCorrect:"off",disabled:this.state._disabled,id:this.state._id,multiple:this.state._multiple,name:this.state._name,required:this.state._required,size:this.state._size,slot:"input",spellcheck:"false",style:{height:this.state._height}},{onClick:this.controller.onFacade.onClick,onBlur:this.controller.onFacade.onBlur,onFocus:this.controller.onFacade.onFocus},{onChange:this.onChange}),this.state._list.map(((e,t)=>{const i=`-${t}`;return Array.isArray(e.options)?this.renderOptgroup(e,i):h("option",{disabled:!0===e.disabled,key:i,selected:isSelected(this.state._value,e.value),value:i},e.label)})))))}constructor(){super(),this.__registerHost(),this.__attachShadow(),this.catchRef=e=>{this.ref=e,propagateFocus(this.host,this.ref)},this.onChange=e=>{var t,i;this._value=Array.from((null===(t=this.ref)||void 0===t?void 0:t.options)||[]).filter((e=>!0===e.selected)).map((e=>{var t;return null===(t=this.controller.getOptionByKey(e.value))||void 0===t?void 0:t.value})),this.controller.setFormAssociatedValue(this._value),"function"==typeof(null===(i=this.state._on)||void 0===i?void 0:i.onChange)&&this.state._on.onChange(e,this._value)},this._accessKey=void 0,this._alert=!0,this._disabled=void 0,this._error=void 0,this._height=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._list=void 0,this._multiple=!1,this._name=void 0,this._on=void 0,this._required=void 0,this._size=void 0,this._tabIndex=void 0,this._touched=!1,this._value=void 0,this.state={_hasValue:!1,_height:"",_id:nonce(),_list:[],_multiple:!1,_value:[]},this.controller=new SelectController(this,"textarea",this.host)}validateAccessKey(e){this.controller.validateAccessKey(e)}validateAlert(e){this.controller.validateAlert(e)}validateDisabled(e){this.controller.validateDisabled(e)}validateError(e){this.controller.validateError(e)}validateHeight(e){this.controller.validateHeight(e)}validateHideLabel(e){this.controller.validateHideLabel(e)}validateHint(e){this.controller.validateHint(e)}validateIcon(e){this.controller.validateIcon(e)}validateId(e){this.controller.validateId(e)}validateList(e){this.controller.validateList(e)}validateMultiple(e){this.controller.validateMultiple(e)}validateName(e){this.controller.validateName(e)}validateOn(e){this.controller.validateOn(e)}validateRequired(e){this.controller.validateRequired(e)}validateSize(e){this.controller.validateSize(e)}validateTabIndex(e){this.controller.validateTabIndex(e)}validateTouched(e){this.controller.validateTouched(e)}validateValue(e){this.controller.validateValue(e)}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.controller.componentWillLoad(this.onChange),this.state._hasValue=!!this.state._value,this.controller.addValueChangeListener((e=>this.state._hasValue=!!e))}get host(){return this}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_disabled:["validateDisabled"],_error:["validateError"],_height:["validateHeight"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_list:["validateList"],_multiple:["validateMultiple"],_name:["validateName"],_on:["validateOn"],_required:["validateRequired"],_size:["validateSize"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}static get style(){return{default:defaultStyleCss}}},[33,"kol-select",{_accessKey:[1,"_access-key"],_alert:[1540],_disabled:[516],_error:[1],_height:[1],_hideLabel:[516,"_hide-label"],_hint:[1],_icon:[1],_id:[1],_list:[1],_multiple:[516],_name:[1],_on:[16],_required:[516],_size:[2],_tabIndex:[2,"_tab-index"],_touched:[1540],_value:[1025],state:[32]}]);function defineCustomElement(){if("undefined"==typeof customElements)return;["kol-select","kol-alert","kol-alert-wc","kol-button-wc","kol-heading-wc","kol-icon","kol-input","kol-span-wc","kol-tooltip"].forEach((e=>{switch(e){case"kol-select":customElements.get(e)||customElements.define(e,KolSelect);break;case"kol-alert":customElements.get(e)||defineCustomElement$8();break;case"kol-alert-wc":customElements.get(e)||defineCustomElement$7();break;case"kol-button-wc":customElements.get(e)||defineCustomElement$6();break;case"kol-heading-wc":customElements.get(e)||defineCustomElement$5();break;case"kol-icon":customElements.get(e)||defineCustomElement$4();break;case"kol-input":customElements.get(e)||defineCustomElement$3();break;case"kol-span-wc":customElements.get(e)||defineCustomElement$2();break;case"kol-tooltip":customElements.get(e)||defineCustomElement$1()}}))}export{KolSelect as K,defineCustomElement as d};
+import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";import{j as a11yHint,w as watchString,F as watchJsonArrayString,l as watchBoolean,B as watchNumber,M as STATE_CHANGE_EVENT,v as propagateFocus,n as nonce}from"./prop.validators.js";import{g as getRenderStates}from"./controller.js";import{I as InputIconController}from"./controller-icon.js";import{f as fillKeyOptionMap}from"./controller2.js";import{h as hasEnoughReadableChars,e as containsOnlyNumbers,d as defineCustomElement$2}from"./component3.js";import{d as defineCustomElement$8}from"./shadow.js";import{d as defineCustomElement$7}from"./component6.js";import{d as defineCustomElement$6}from"./component5.js";import{d as defineCustomElement$5}from"./component4.js";import{d as defineCustomElement$4}from"./component2.js";import{d as defineCustomElement$3}from"./component11.js";import{d as defineCustomElement$1}from"./component.js";const validateInputSelectList=e=>{if("object"==typeof e&&null!==e){if("string"==typeof e.label&&e.label.length>0)return e.disabled=!0===e.disabled,e.label=`${e.label}`.trim(),!1===hasEnoughReadableChars(e.label,3)&&!1===containsOnlyNumbers(e.label)&&a11yHint(`Ein abweichendes Aria-Label (${e.label}) ist nicht barrierefrei. Ein abweichendes Aria-Label sollte aus mindestens drei lesbaren Zeichen bestehen.`),!Array.isArray(e.options)||void 0===e.options.find((e=>!1===validateInputSelectList(e)));if("number"==typeof e.label)return!0}return!1};class SelectController extends InputIconController{constructor(e,t,i){super(e,t,i),this.keyOptionMap=new Map,this.getOptionByKey=e=>this.keyOptionMap.get(e),this.isValueInOptions=(e,t)=>void 0!==t.find((t=>"string"==typeof t.value?t.value===e:!!Array.isArray(t.options)&&this.isValueInOptions(e,t.options))),this.filterValuesInOptions=(e,t)=>e.filter((e=>void 0!==this.isValueInOptions(e,t))),this.beforePatchListValue=(e,t)=>{const i=t.has("_list")?t.get("_list"):this.component.state._list;if(Array.isArray(i)&&i.length>0){this.keyOptionMap.clear(),fillKeyOptionMap(this.keyOptionMap,i);const e=t.has("_value")?t.get("_value"):this.component.state._value,a=this.filterValuesInOptions(Array.isArray(e)&&e.length>0?e:[],i);!1===this.component._multiple&&0===a.length?(t.set("_value",[i[0].value]),this.onStateChange()):Array.isArray(e)&&a.length<e.length&&(t.set("_value",a),this.onStateChange())}},this.component=e}validateHeight(e){watchString(this.component,"_height",e)}validateList(e){watchJsonArrayString(this.component,"_list",validateInputSelectList,e,void 0,{hooks:{beforePatch:this.beforePatchListValue}})}validateMultiple(e){watchBoolean(this.component,"_multiple",e,{hooks:{beforePatch:this.beforePatchListValue}})}validateRequired(e){watchBoolean(this.component,"_required",e)}validateSize(e){watchNumber(this.component,"_size",e,{min:1})}validateValue(e){watchJsonArrayString(this.component,"_value",(()=>!0),e,void 0,{hooks:{beforePatch:this.beforePatchListValue}}),this.setFormAssociatedValue(this.component._value)}componentWillLoad(e){super.componentWillLoad(),this.onStateChange=()=>{if("function"==typeof e){const t=setTimeout((()=>{clearTimeout(t),e(STATE_CHANGE_EVENT)}))}},this.validateHeight(this.component._height),this.validateList(this.component._list),this.validateMultiple(this.component._multiple),this.validateRequired(this.component._required),this.validateSize(this.component._size),this.validateValue(this.component._value)}}const defaultStyleCss=":host{--a11y-min-size:44px}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.required label>span::after,.required legend>span::after{content:'*'}:host{display:block}input,textarea{cursor:text}input[type='checkbox'],input[type='color'],input[type='file'],input[type='radio'],input[type='range'],label,option,select{cursor:pointer}input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],select:not([multiple]),select[multiple] option,textarea{font-size:1rem;width:100%}input[type='file']{padding:calc((var(--a11y-min-size) - 1rem) / 10) 0.5em}select[multiple] option{padding:calc((var(--a11y-min-size) - 1rem) / 2) 0.5em}kol-input.disabled :is(button,input,label,option,select,textarea){cursor:not-allowed;opacity:0.5}kol-input{display:grid}kol-input [slot='input']{flex-grow:1}input:not([type='checkbox'],[type='radio']),select:not([multiple]){height:2.75em}input:focus,option:focus,select:focus,textarea:focus{outline:0}.input{display:flex;align-items:center}.input>kol-icon{display:grid;height:var(--a11y-min-size);place-items:center}",isSelected=(e,t)=>Array.isArray(e)&&e.includes(t),KolSelect=proxyCustomElement(class extends HTMLElement{renderOptgroup(e,t){var i;return h("optgroup",{disabled:!0===e.disabled,label:e.label},null===(i=e.options)||void 0===i?void 0:i.map(((e,i)=>{const a=`${t}-${i}`;return Array.isArray(e.options)?this.renderOptgroup(e,a):h("option",{disabled:!0===e.disabled,key:a,selected:isSelected(this.state._value,e.value),value:a},e.label)})))}render(){const{ariaDescribedBy:e}=getRenderStates(this.state);return h(Host,{class:{"has-value":this.state._hasValue}},h("kol-input",{class:{select:!0},_disabled:this.state._disabled,_error:this.state._error,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icon:this.state._icon,_id:this.state._id,_required:this.state._required,_touched:this.state._touched,onClick:()=>{var e;return null===(e=this.ref)||void 0===e?void 0:e.focus()}},h("span",{slot:"label"},h("slot",null)),h("select",Object.assign({ref:this.catchRef,title:"",accessKey:this.state._accessKey,"aria-describedby":e.length>0?e.join(" "):void 0,"aria-labelledby":`${this.state._id}-label`,autoCapitalize:"off",autoCorrect:"off",disabled:this.state._disabled,id:this.state._id,multiple:this.state._multiple,name:this.state._name,required:this.state._required,size:this.state._size,slot:"input",spellcheck:"false",style:{height:this.state._height}},{onClick:this.controller.onFacade.onClick,onBlur:this.controller.onFacade.onBlur,onFocus:this.controller.onFacade.onFocus},{onChange:this.onChange}),this.state._list.map(((e,t)=>{const i=`-${t}`;return Array.isArray(e.options)?this.renderOptgroup(e,i):h("option",{disabled:!0===e.disabled,key:i,selected:isSelected(this.state._value,e.value),value:i},e.label)})))))}constructor(){super(),this.__registerHost(),this.__attachShadow(),this.catchRef=e=>{this.ref=e,propagateFocus(this.host,this.ref)},this.onChange=e=>{var t,i;this._value=Array.from((null===(t=this.ref)||void 0===t?void 0:t.options)||[]).filter((e=>!0===e.selected)).map((e=>{var t;return null===(t=this.controller.getOptionByKey(e.value))||void 0===t?void 0:t.value})),this.controller.setFormAssociatedValue(this._value),"function"==typeof(null===(i=this.state._on)||void 0===i?void 0:i.onChange)&&this.state._on.onChange(e,this._value)},this._accessKey=void 0,this._alert=!0,this._disabled=void 0,this._error=void 0,this._height=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._list=void 0,this._multiple=!1,this._name=void 0,this._on=void 0,this._required=void 0,this._size=void 0,this._tabIndex=void 0,this._touched=!1,this._value=void 0,this.state={_hasValue:!1,_height:"",_id:nonce(),_list:[],_multiple:!1,_value:[]},this.controller=new SelectController(this,"textarea",this.host)}validateAccessKey(e){this.controller.validateAccessKey(e)}validateAlert(e){this.controller.validateAlert(e)}validateDisabled(e){this.controller.validateDisabled(e)}validateError(e){this.controller.validateError(e)}validateHeight(e){this.controller.validateHeight(e)}validateHideLabel(e){this.controller.validateHideLabel(e)}validateHint(e){this.controller.validateHint(e)}validateIcon(e){this.controller.validateIcon(e)}validateId(e){this.controller.validateId(e)}validateList(e){this.controller.validateList(e)}validateMultiple(e){this.controller.validateMultiple(e)}validateName(e){this.controller.validateName(e)}validateOn(e){this.controller.validateOn(e)}validateRequired(e){this.controller.validateRequired(e)}validateSize(e){this.controller.validateSize(e)}validateTabIndex(e){this.controller.validateTabIndex(e)}validateTouched(e){this.controller.validateTouched(e)}validateValue(e){this.controller.validateValue(e)}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.controller.componentWillLoad(this.onChange),this.state._hasValue=!!this.state._value,this.controller.addValueChangeListener((e=>this.state._hasValue=!!e))}get host(){return this}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_disabled:["validateDisabled"],_error:["validateError"],_height:["validateHeight"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_list:["validateList"],_multiple:["validateMultiple"],_name:["validateName"],_on:["validateOn"],_required:["validateRequired"],_size:["validateSize"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}static get style(){return{default:defaultStyleCss}}},[33,"kol-select",{_accessKey:[1,"_access-key"],_alert:[1540],_disabled:[516],_error:[1],_height:[1],_hideLabel:[516,"_hide-label"],_hint:[1],_icon:[1],_id:[1],_list:[1],_multiple:[516],_name:[1],_on:[16],_required:[516],_size:[2],_tabIndex:[2,"_tab-index"],_touched:[1540],_value:[1025],state:[32]}]);function defineCustomElement(){if("undefined"==typeof customElements)return;["kol-select","kol-alert","kol-alert-wc","kol-button-wc","kol-heading-wc","kol-icon","kol-input","kol-span-wc","kol-tooltip"].forEach((e=>{switch(e){case"kol-select":customElements.get(e)||customElements.define(e,KolSelect);break;case"kol-alert":customElements.get(e)||defineCustomElement$8();break;case"kol-alert-wc":customElements.get(e)||defineCustomElement$7();break;case"kol-button-wc":customElements.get(e)||defineCustomElement$6();break;case"kol-heading-wc":customElements.get(e)||defineCustomElement$5();break;case"kol-icon":customElements.get(e)||defineCustomElement$4();break;case"kol-input":customElements.get(e)||defineCustomElement$3();break;case"kol-span-wc":customElements.get(e)||defineCustomElement$2();break;case"kol-tooltip":customElements.get(e)||defineCustomElement$1()}}))}export{KolSelect as K,defineCustomElement as d};