@public-ui/components 1.3.3-rc.2 → 1.4.0-rc.0

package/dist/kolibri/kol-textarea.entry.js.map

@@ -1 +1 @@
-{"version":3,"names":["TextareaController","InputController","constructor","component","name","host","super","this","afterSyncCharCounter","_value","length","state","_currentLength","validateHasCounter","value","watchBoolean","hooks","afterPatch","validateMaxLength","watchNumber","min","validatePlaceholder","watchString","validateReadOnly","validateResize","watchValidator","Set","validateRequired","validateRows","validateValue","setFormAssociatedValue","componentWillLoad","_hasCounter","_maxLength","_placeholder","_readOnly","_resize","_required","_rows","defaultStyleCss","increaseTextareaHeight","el","style","overflow","currentRows","rows","rowHeight","clientHeight","nextRows","Math","round","scrollHeight","KolTextarea","render","ariaDiscribedBy","getRenderStates","h","Host","_alert","_disabled","_error","_hideLabel","_hint","_id","_touched","slot","Object","assign","ref","catchRef","part","title","accessKey","_accessKey","join","undefined","autoCapitalize","autoCorrect","disabled","id","maxlength","_name","readOnly","required","placeholder","spellcheck","controller","onFacade","onKeyUp","onChange","resize","Fragment","translate","role","hostRef","propergateFocus","event","HTMLTextAreaElement","setState","_adjustHeight","validateAccessKey","validateAdjustHeight","validateAlert","validateDisabled","validateError","validateHideLabel","validateHint","validateId","validateName","validateOn","validateTabIndex","validateTouched"],"sources":["./src/components/textarea/controller.ts","./src/components/style.sass?tag=kol-textarea&mode=default&encapsulation=shadow","./src/components/textarea/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { watchBoolean, watchNumber, watchString, watchValidator } from '../../utils/prop.validators';\nimport { InputController } from '../@deprecated/input/controller';\nimport { CSSResize, Props, Watches } from './types';\n\nexport class TextareaController extends InputController implements Watches {\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\tprivate afterSyncCharCounter = () => {\n\t\tif (typeof this.component._value === 'string' && this.component._value.length > 0) {\n\t\t\tthis.component.state._currentLength = this.component._value.length;\n\t\t}\n\t};\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateHasCounter(value?: boolean): void {\n\t\twatchBoolean(this.component, '_hasCounter', value, {\n\t\t\thooks: {\n\t\t\t\tafterPatch: this.afterSyncCharCounter,\n\t\t\t},\n\t\t});\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateMaxLength(value?: number): void {\n\t\twatchNumber(this.component, '_maxLength', value, {\n\t\t\thooks: {\n\t\t\t\tafterPatch: this.afterSyncCharCounter,\n\t\t\t},\n\t\t\tmin: 0,\n\t\t});\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validatePlaceholder(value?: string): void {\n\t\twatchString(this.component, '_placeholder', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateReadOnly(value?: boolean): void {\n\t\twatchBoolean(this.component, '_readOnly', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateResize(value?: CSSResize): void {\n\t\twatchValidator(\n\t\t\tthis.component,\n\t\t\t'_resize',\n\t\t\t(value) => typeof value === 'string' && (value === 'both' || value === 'horizontal' || value === 'none' || value === 'vertical'),\n\t\t\tnew Set('String {both, horizontal, vertical, none}'),\n\t\t\tvalue\n\t\t);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateRequired(value?: boolean): void {\n\t\twatchBoolean(this.component, '_required', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateRows(value?: number): void {\n\t\twatchNumber(this.component, '_rows', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateValue(value?: string): void {\n\t\twatchString(this.component, '_value', value, {\n\t\t\thooks: {\n\t\t\t\tafterPatch: this.afterSyncCharCounter,\n\t\t\t},\n\t\t});\n\t\tthis.setFormAssociatedValue(this.component._value as string);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tsuper.componentWillLoad();\n\t\tthis.validateHasCounter(this.component._hasCounter);\n\t\tthis.validateMaxLength(this.component._maxLength);\n\t\tthis.validatePlaceholder(this.component._placeholder);\n\t\tthis.validateReadOnly(this.component._readOnly);\n\t\tthis.validateResize(this.component._resize);\n\t\tthis.validateRequired(this.component._required);\n\t\tthis.validateRows(this.component._rows);\n\t\tthis.validateValue(this.component._value);\n\t}\n}\n","@windicss\n\n*\n\tbox-sizing: border-box\n\tfont-size: inherit\n\thyphens: auto\n\tletter-spacing: inherit\n\tword-break: break-word\n\tword-spacing: inherit\n\nkol-heading-wc\n\tfont-weight: 700\n\nkol-icon\n\tcolor: inherit\n\nkol-span-wc\n\tdisplay: grid\n\tplace-items: center\n\twidth: 100%\n\n\t> span\n\t\tdisplay: flex\n\t\tgap: 0.25rem\n\t\tplace-items: center\n\na,\nbutton\n\tcursor: pointer\n\n\t&.icon-only\n\n\t\t> kol-span-wc\n\n\t\t\t> span\n\n\t\t\t\t> span\n\t\t\t\t\tdisplay: none\n\na\n\tdisplay: inline-flex\n\tplace-items: baseline\n\nbutton\n\tborder-width: 0\n","import { Component, Element, Fragment, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\nimport { translate } from '../../i18n';\n\nimport { InputTypeOnDefault } from '../../types/input/types';\nimport { setState } from '../../utils/prop.validators';\nimport { propergateFocus } from '../../utils/reuse';\nimport { getRenderStates } from '../input/controller';\nimport { TextareaController } from './controller';\nimport { ComponentApi, CSSResize, States } from './types';\n\n/**\n * https://stackoverflow.com/questions/17772260/textarea-auto-height\n */\nconst increaseTextareaHeight = (el: HTMLTextAreaElement): number => {\n\tel.style.overflow = 'hidden'; // verhindert, dass ein Scrollbalken kurz angezeigt wird\n\tconst currentRows = el.rows;\n\tconst rowHeight = el.clientHeight / currentRows;\n\tel.rows = 1;\n\tconst nextRows = Math.round(el.scrollHeight / rowHeight);\n\tel.rows = currentRows;\n\treturn nextRows;\n};\n\n@Component({\n\ttag: 'kol-textarea',\n\tstyleUrls: {\n\t\tdefault: '../style.sass',\n\t},\n\tshadow: true,\n})\nexport class KolTextarea implements ComponentApi {\n\t@Element() private readonly host?: HTMLKolTextareaElement;\n\tprivate ref?: HTMLTextAreaElement;\n\n\tprivate readonly catchRef = (ref?: HTMLTextAreaElement) => {\n\t\tthis.ref = ref;\n\t\tpropergateFocus(this.host, this.ref);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { ariaDiscribedBy } = getRenderStates(this.state);\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<kol-input\n\t\t\t\t\t_alert={this.state._alert}\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_id={this.state._id}\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_touched={this.state._touched}\n\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<div slot=\"input\">\n\t\t\t\t\t\t<textarea\n\t\t\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t\t\tpart=\"textarea\"\n\t\t\t\t\t\t\ttitle=\"\"\n\t\t\t\t\t\t\taccessKey={this.state._accessKey}\n\t\t\t\t\t\t\taria-describedby={ariaDiscribedBy.length > 0 ? ariaDiscribedBy.join(' ') : undefined}\n\t\t\t\t\t\t\taria-labelledby={`${this.state._id}-label`}\n\t\t\t\t\t\t\tautoCapitalize=\"off\"\n\t\t\t\t\t\t\t// aria-hidden=\"true\" // Wieso ist das hier?\n\t\t\t\t\t\t\tautoCorrect=\"off\"\n\t\t\t\t\t\t\tdisabled={this.state._disabled}\n\t\t\t\t\t\t\tid={this.state._id}\n\t\t\t\t\t\t\tmaxlength={this.state._maxLength}\n\t\t\t\t\t\t\tname={this.state._name}\n\t\t\t\t\t\t\treadOnly={this.state._readOnly}\n\t\t\t\t\t\t\trequired={this.state._required}\n\t\t\t\t\t\t\trows={this.state._rows}\n\t\t\t\t\t\t\tplaceholder={this.state._placeholder}\n\t\t\t\t\t\t\tspellcheck=\"false\"\n\t\t\t\t\t\t\t{...this.controller.onFacade}\n\t\t\t\t\t\t\tonKeyUp={this.onChange}\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tresize: this.state._resize,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tvalue={this.state._value}\n\t\t\t\t\t\t></textarea>\n\t\t\t\t\t\t{/**\n\t\t\t\t\t\t * https://webstandardssherpa.com/reviews/improving-the-tweet-box/\n\t\t\t\t\t\t * https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-live\n\t\t\t\t\t\t */}\n\t\t\t\t\t\t{this.state._hasCounter && (\n\t\t\t\t\t\t\t<span aria-atomic=\"true\" aria-live=\"polite\">\n\t\t\t\t\t\t\t\t{this.state._currentLength}\n\t\t\t\t\t\t\t\t{this.state._maxLength && (\n\t\t\t\t\t\t\t\t\t<Fragment>\n\t\t\t\t\t\t\t\t\t\t<span aria-label={translate('kol-of')} role=\"img\">\n\t\t\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{this.state._maxLength}\n\t\t\t\t\t\t\t\t\t</Fragment>\n\t\t\t\t\t\t\t\t)}{' '}\n\t\t\t\t\t\t\t\t<span>{translate('kol-characters')}</span>\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</kol-input>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate readonly controller: TextareaController;\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 * Passt die Höhe des Eingabefeldes automatisch an den Füllstand an.\n\t */\n\t@Prop({ reflect: true }) public _adjustHeight?: boolean = false;\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 am unteren Rand des Eingabefeldes die Anzahl der Zeichen angezeigt werden soll.\n\t */\n\t@Prop({ reflect: true }) public _hasCounter?: boolean;\n\n\t/**\n\t * Gibt an, ob das Eingabefeld aktiviert oder deaktiviert ist.\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 * Gibt an, ob das Eingabefeld kein sichtbares Label haben soll.\n\t */\n\t@Prop({ reflect: true }) public _hideLabel?: boolean;\n\n\t/**\n\t * Gibt den Text für eine 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 an, wie viele Zeichen man maximal eingeben kann.\n\t */\n\t@Prop() public _maxLength?: number;\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 * Gibt an, ob das Eingabefeld nur lesend ist.\n\t */\n\t@Prop({ reflect: true }) public _readOnly?: boolean;\n\n\t/**\n\t * Gibt an, ob die Größe des Eingabefeldes geändert werden kann. (https://developer.mozilla.org/de/docs/Web/CSS/resize)\n\t */\n\t@Prop() public _resize?: CSSResize = 'vertical';\n\n\t/**\n\t * Gibt an, ob das Eingabefeld ein Pflichtfeld ist.\n\t */\n\t@Prop({ reflect: true }) public _required?: boolean;\n\n\t/**\n\t * Gibt die Anzahl der anzuzeigenden Zeilen des Eingabefeldes an.\n\t */\n\t@Prop({ mutable: true, reflect: false }) public _rows?: 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 den Wert des Eingabefeldes an.\n\t */\n\t@Prop() public _value?: string;\n\n\t/**\n\t * @see: components/abbr/component.tsx (@State)\n\t */\n\t@State() public state: States = {\n\t\t_adjustHeight: false,\n\t\t_currentLength: 0,\n\t\t_id: '⚠',\n\n\t\t_resize: 'vertical',\n\t};\n\n\tpublic constructor() {\n\t\tthis.controller = new TextareaController(this, 'textarea', this.host);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_adjustHeight')\n\tpublic validateAdjustHeight(value?: boolean): void {\n\t\tthis.controller.validateAdjustHeight(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\tthis.controller.validateAlert(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_error')\n\tpublic validateError(value?: string): void {\n\t\tthis.controller.validateError(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hasCounter')\n\tpublic validateHasCounter(value?: boolean): void {\n\t\tthis.controller.validateHasCounter(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_maxLength')\n\tpublic validateMaxLength(value?: number): void {\n\t\tthis.controller.validateMaxLength(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_placeholder')\n\tpublic validatePlaceholder(value?: string): void {\n\t\tthis.controller.validatePlaceholder(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_readOnly')\n\tpublic validateReadOnly(value?: boolean): void {\n\t\tthis.controller.validateReadOnly(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_resize')\n\tpublic validateResize(value?: CSSResize): void {\n\t\tthis.controller.validateResize(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_required')\n\tpublic validateRequired(value?: boolean): void {\n\t\tthis.controller.validateRequired(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_rows')\n\tpublic validateRows(value?: number): void {\n\t\tthis.controller.validateRows(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tthis.controller.validateTabIndex(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\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 */\n\t@Watch('_value')\n\tpublic validateValue(value?: string): void {\n\t\tthis.controller.validateValue(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tthis._alert = this._alert === true;\n\t\tthis._touched = this._touched === true;\n\t\tthis.controller.componentWillLoad();\n\t\tthis.validateAdjustHeight(this._adjustHeight);\n\t}\n\n\tprivate readonly onChange = (event: Event) => {\n\t\tif (this.ref instanceof HTMLTextAreaElement) {\n\t\t\tsetState(this, '_currentLength', this.ref.value.length);\n\t\t\tif (this.state._adjustHeight) {\n\t\t\t\tthis._rows = increaseTextareaHeight(this.ref);\n\t\t\t}\n\t\t}\n\t\tif (typeof this.controller.onFacade.onChange === 'function') {\n\t\t\tthis.controller.onFacade.onChange(event);\n\t\t}\n\t};\n}\n"],"mappings":"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"}
+{"version":3,"names":["TextareaController","InputController","constructor","component","name","host","super","this","afterSyncCharCounter","_value","length","state","_currentLength","validateHasCounter","value","watchBoolean","hooks","afterPatch","validateMaxLength","watchNumber","min","validatePlaceholder","watchString","validateReadOnly","validateResize","watchValidator","Set","validateRequired","validateRows","validateValue","setFormAssociatedValue","componentWillLoad","_hasCounter","_maxLength","_placeholder","_readOnly","_resize","_required","_rows","defaultStyleCss","increaseTextareaHeight","el","style","overflow","currentRows","rows","rowHeight","clientHeight","nextRows","Math","round","scrollHeight","KolTextarea","render","ariaDiscribedBy","getRenderStates","h","Host","_alert","_disabled","_error","_hideLabel","_hint","_id","_touched","slot","Object","assign","ref","catchRef","part","title","accessKey","_accessKey","join","undefined","autoCapitalize","autoCorrect","disabled","id","maxlength","_name","readOnly","required","placeholder","spellcheck","controller","onFacade","onKeyUp","onChange","resize","Fragment","translate","role","hostRef","propergateFocus","event","HTMLTextAreaElement","setState","_adjustHeight","validateAccessKey","validateAdjustHeight","validateAlert","validateDisabled","validateError","validateHideLabel","validateHint","validateId","validateName","validateOn","validateTabIndex","validateTouched"],"sources":["./src/components/textarea/controller.ts","./src/components/style.sass?tag=kol-textarea&mode=default&encapsulation=shadow","./src/components/textarea/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { watchBoolean, watchNumber, watchString, watchValidator } from '../../utils/prop.validators';\nimport { InputController } from '../@deprecated/input/controller';\nimport { CSSResize, Props, Watches } from './types';\n\nexport class TextareaController extends InputController implements Watches {\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\tprivate afterSyncCharCounter = () => {\n\t\tif (typeof this.component._value === 'string' && this.component._value.length > 0) {\n\t\t\tthis.component.state._currentLength = this.component._value.length;\n\t\t}\n\t};\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateHasCounter(value?: boolean): void {\n\t\twatchBoolean(this.component, '_hasCounter', value, {\n\t\t\thooks: {\n\t\t\t\tafterPatch: this.afterSyncCharCounter,\n\t\t\t},\n\t\t});\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateMaxLength(value?: number): void {\n\t\twatchNumber(this.component, '_maxLength', value, {\n\t\t\thooks: {\n\t\t\t\tafterPatch: this.afterSyncCharCounter,\n\t\t\t},\n\t\t\tmin: 0,\n\t\t});\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validatePlaceholder(value?: string): void {\n\t\twatchString(this.component, '_placeholder', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateReadOnly(value?: boolean): void {\n\t\twatchBoolean(this.component, '_readOnly', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateResize(value?: CSSResize): void {\n\t\twatchValidator(\n\t\t\tthis.component,\n\t\t\t'_resize',\n\t\t\t(value) => typeof value === 'string' && (value === 'both' || value === 'horizontal' || value === 'none' || value === 'vertical'),\n\t\t\tnew Set('String {both, horizontal, vertical, none}'),\n\t\t\tvalue\n\t\t);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateRequired(value?: boolean): void {\n\t\twatchBoolean(this.component, '_required', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateRows(value?: number): void {\n\t\twatchNumber(this.component, '_rows', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\tpublic validateValue(value?: string): void {\n\t\twatchString(this.component, '_value', value, {\n\t\t\thooks: {\n\t\t\t\tafterPatch: this.afterSyncCharCounter,\n\t\t\t},\n\t\t});\n\t\tthis.setFormAssociatedValue(this.component._value as string);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tsuper.componentWillLoad();\n\t\tthis.validateHasCounter(this.component._hasCounter);\n\t\tthis.validateMaxLength(this.component._maxLength);\n\t\tthis.validatePlaceholder(this.component._placeholder);\n\t\tthis.validateReadOnly(this.component._readOnly);\n\t\tthis.validateResize(this.component._resize);\n\t\tthis.validateRequired(this.component._required);\n\t\tthis.validateRows(this.component._rows);\n\t\tthis.validateValue(this.component._value);\n\t}\n}\n","@windicss\n\n*\n\tbox-sizing: border-box\n\tfont-size: inherit\n\thyphens: auto\n\tletter-spacing: inherit\n\tword-break: break-word\n\tword-spacing: inherit\n\nkol-heading-wc\n\tfont-weight: 700\n\nkol-icon\n\tcolor: inherit\n\nkol-span-wc\n\tdisplay: grid\n\tplace-items: center\n\twidth: 100%\n\n\t> span\n\t\tdisplay: flex\n\t\tgap: 0.25rem\n\t\tplace-items: center\n\na,\nbutton\n\tcursor: pointer\n\n\t&.icon-only\n\n\t\t> kol-span-wc\n\n\t\t\t> span\n\n\t\t\t\t> span\n\t\t\t\t\tdisplay: none\n\na\n\tdisplay: inline-flex\n\tplace-items: baseline\n\nbutton\n\tborder-width: 0\n","import { Component, Element, Fragment, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\nimport { translate } from '../../i18n';\n\nimport { InputTypeOnDefault } from '../../types/input/types';\nimport { setState } from '../../utils/prop.validators';\nimport { propergateFocus } from '../../utils/reuse';\nimport { getRenderStates } from '../input/controller';\nimport { TextareaController } from './controller';\nimport { ComponentApi, CSSResize, States } from './types';\n\n/**\n * https://stackoverflow.com/questions/17772260/textarea-auto-height\n */\nconst increaseTextareaHeight = (el: HTMLTextAreaElement): number => {\n\tel.style.overflow = 'hidden'; // verhindert, dass ein Scrollbalken kurz angezeigt wird\n\tconst currentRows = el.rows;\n\tconst rowHeight = el.clientHeight / currentRows;\n\tel.rows = 1;\n\tconst nextRows = Math.round(el.scrollHeight / rowHeight);\n\tel.rows = currentRows;\n\treturn nextRows;\n};\n\n@Component({\n\ttag: 'kol-textarea',\n\tstyleUrls: {\n\t\tdefault: '../style.sass',\n\t},\n\tshadow: true,\n})\nexport class KolTextarea implements ComponentApi {\n\t@Element() private readonly host?: HTMLKolTextareaElement;\n\tprivate ref?: HTMLTextAreaElement;\n\n\tprivate readonly catchRef = (ref?: HTMLTextAreaElement) => {\n\t\tthis.ref = ref;\n\t\tpropergateFocus(this.host, this.ref);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { ariaDiscribedBy } = getRenderStates(this.state);\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<kol-input\n\t\t\t\t\t_alert={this.state._alert}\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_id={this.state._id}\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_touched={this.state._touched}\n\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<div slot=\"input\">\n\t\t\t\t\t\t<textarea\n\t\t\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t\t\tpart=\"textarea\"\n\t\t\t\t\t\t\ttitle=\"\"\n\t\t\t\t\t\t\taccessKey={this.state._accessKey}\n\t\t\t\t\t\t\taria-describedby={ariaDiscribedBy.length > 0 ? ariaDiscribedBy.join(' ') : undefined}\n\t\t\t\t\t\t\taria-labelledby={`${this.state._id}-label`}\n\t\t\t\t\t\t\tautoCapitalize=\"off\"\n\t\t\t\t\t\t\t// aria-hidden=\"true\" // Wieso ist das hier?\n\t\t\t\t\t\t\tautoCorrect=\"off\"\n\t\t\t\t\t\t\tdisabled={this.state._disabled}\n\t\t\t\t\t\t\tid={this.state._id}\n\t\t\t\t\t\t\tmaxlength={this.state._maxLength}\n\t\t\t\t\t\t\tname={this.state._name}\n\t\t\t\t\t\t\treadOnly={this.state._readOnly}\n\t\t\t\t\t\t\trequired={this.state._required}\n\t\t\t\t\t\t\trows={this.state._rows}\n\t\t\t\t\t\t\tplaceholder={this.state._placeholder}\n\t\t\t\t\t\t\tspellcheck=\"false\"\n\t\t\t\t\t\t\t{...this.controller.onFacade}\n\t\t\t\t\t\t\tonKeyUp={this.onChange}\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tresize: this.state._resize,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tvalue={this.state._value}\n\t\t\t\t\t\t></textarea>\n\t\t\t\t\t\t{/**\n\t\t\t\t\t\t * https://webstandardssherpa.com/reviews/improving-the-tweet-box/\n\t\t\t\t\t\t * https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-live\n\t\t\t\t\t\t */}\n\t\t\t\t\t\t{this.state._hasCounter && (\n\t\t\t\t\t\t\t<span aria-atomic=\"true\" aria-live=\"polite\">\n\t\t\t\t\t\t\t\t{this.state._currentLength}\n\t\t\t\t\t\t\t\t{this.state._maxLength && (\n\t\t\t\t\t\t\t\t\t<Fragment>\n\t\t\t\t\t\t\t\t\t\t<span aria-label={translate('kol-of')} role=\"img\">\n\t\t\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{this.state._maxLength}\n\t\t\t\t\t\t\t\t\t</Fragment>\n\t\t\t\t\t\t\t\t)}{' '}\n\t\t\t\t\t\t\t\t<span>{translate('kol-characters')}</span>\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</kol-input>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate readonly controller: TextareaController;\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 * Passt die Höhe des Eingabefeldes automatisch an den Füllstand an.\n\t */\n\t@Prop({ reflect: true }) public _adjustHeight?: boolean = false;\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 am unteren Rand des Eingabefeldes die Anzahl der Zeichen angezeigt werden soll.\n\t */\n\t@Prop({ reflect: true }) public _hasCounter?: boolean;\n\n\t/**\n\t * Gibt an, ob das Eingabefeld aktiviert oder deaktiviert ist.\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 * Gibt an, ob das Eingabefeld kein sichtbares Label haben soll.\n\t */\n\t@Prop({ reflect: true }) public _hideLabel?: boolean;\n\n\t/**\n\t * Gibt den Text für eine 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 an, wie viele Zeichen man maximal eingeben kann.\n\t */\n\t@Prop() public _maxLength?: number;\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 * Gibt an, ob das Eingabefeld nur lesend ist.\n\t */\n\t@Prop({ reflect: true }) public _readOnly?: boolean;\n\n\t/**\n\t * Gibt an, ob die Größe des Eingabefeldes geändert werden kann. (https://developer.mozilla.org/de/docs/Web/CSS/resize)\n\t */\n\t@Prop() public _resize?: CSSResize = 'vertical';\n\n\t/**\n\t * Gibt an, ob das Eingabefeld ein Pflichtfeld ist.\n\t */\n\t@Prop({ reflect: true }) public _required?: boolean;\n\n\t/**\n\t * Gibt die Anzahl der anzuzeigenden Zeilen des Eingabefeldes an.\n\t */\n\t@Prop({ mutable: true, reflect: false }) public _rows?: 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 den Wert des Eingabefeldes an.\n\t */\n\t@Prop() public _value?: string;\n\n\t/**\n\t * @see: components/abbr/component.tsx (@State)\n\t */\n\t@State() public state: States = {\n\t\t_adjustHeight: false,\n\t\t_currentLength: 0,\n\t\t_id: '⚠',\n\n\t\t_resize: 'vertical',\n\t};\n\n\tpublic constructor() {\n\t\tthis.controller = new TextareaController(this, 'textarea', this.host);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_adjustHeight')\n\tpublic validateAdjustHeight(value?: boolean): void {\n\t\tthis.controller.validateAdjustHeight(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\tthis.controller.validateAlert(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_error')\n\tpublic validateError(value?: string): void {\n\t\tthis.controller.validateError(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hasCounter')\n\tpublic validateHasCounter(value?: boolean): void {\n\t\tthis.controller.validateHasCounter(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_maxLength')\n\tpublic validateMaxLength(value?: number): void {\n\t\tthis.controller.validateMaxLength(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_placeholder')\n\tpublic validatePlaceholder(value?: string): void {\n\t\tthis.controller.validatePlaceholder(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_readOnly')\n\tpublic validateReadOnly(value?: boolean): void {\n\t\tthis.controller.validateReadOnly(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_resize')\n\tpublic validateResize(value?: CSSResize): void {\n\t\tthis.controller.validateResize(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_required')\n\tpublic validateRequired(value?: boolean): void {\n\t\tthis.controller.validateRequired(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_rows')\n\tpublic validateRows(value?: number): void {\n\t\tthis.controller.validateRows(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tthis.controller.validateTabIndex(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\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 */\n\t@Watch('_value')\n\tpublic validateValue(value?: string): void {\n\t\tthis.controller.validateValue(value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tthis._alert = this._alert === true;\n\t\tthis._touched = this._touched === true;\n\t\tthis.controller.componentWillLoad();\n\t\tthis.validateAdjustHeight(this._adjustHeight);\n\t}\n\n\tprivate readonly onChange = (event: Event) => {\n\t\tif (this.ref instanceof HTMLTextAreaElement) {\n\t\t\tsetState(this, '_currentLength', this.ref.value.length);\n\t\t\tif (this.state._adjustHeight) {\n\t\t\t\tthis._rows = increaseTextareaHeight(this.ref);\n\t\t\t}\n\t\t}\n\t\tif (typeof this.controller.onFacade.onChange === 'function') {\n\t\t\tthis.controller.onFacade.onChange(event);\n\t\t}\n\t};\n}\n"],"mappings":"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"}

package/dist/kolibri/kol-toast.entry.js

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{r as t,h as i,H as s}from"./index-0dce65d2.js";import{b as e,w as a,s as o,d as n,a as h}from"./prop.validators-59bc26b2.js";import{w as l}from"./validation-51e063b4.js";import{f as r}from"./a11y.tipps-ff5a1a99.js";import"./index-b76497e7.js";import"./index.m-86dc8c44.js";import"./dev.utils-daaf2f39.js";const d="@windicss; *{box-sizing:border-box;font-size:inherit;hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}kol-heading-wc{font-weight:700}kol-icon{color:inherit}kol-span-wc{display:grid;place-items:center;width:100%}kol-span-wc>span{display:flex;gap:0.25rem;place-items:center}a,button{cursor:pointer}a.icon-only>kol-span-wc>span>span,button.icon-only>kol-span-wc>span>span{display:none}a{display:inline-flex;place-items:baseline}button{border-width:0}",c=class{constructor(e){t(this,e),this.handleShowAndDuration=()=>{!0===this.state._show&&"number"==typeof this.state._showDuration&&this.state._showDuration>=0&&(clearTimeout(this.durationTimeout),this.durationTimeout=setTimeout((()=>{clearTimeout(this.durationTimeout),this.close()}),this.state._showDuration))},this.close=()=>{var t;this._show=!1,this.state=Object.assign(Object.assign({},this.state),{_show:!1}),void 0!==(null===(t=this._on)||void 0===t?void 0:t.onClose)&&this._on.onClose(new Event("Close"))},this.on={onClose:this.close},this._alert=!0,this._hasCloser=!1,this._heading="",this._level=1,this._on=void 0,this._show=!0,this._showDuration=1e4,this._type="default",this.state={_alert:!0,_level:1,_show:!0}}validateAlert(t){e(this,"_alert",t)}validateHasCloser(t){e(this,"_hasCloser",t)}validateHeading(t){a(this,"_heading",t)}validateLevel(t){l(this,t)}validateOn(t){if("object"==typeof t&&null!==t){r("[KolToast] Prüfen, wie man auch einen EventCallback einzeln ändern kann.");const e={};"function"!=typeof t.onClose&&!0!==t.onClose||(e.onClose=t.onClose),o(this,"_on",e)}}validateShow(t){e(this,"_show",t,{hooks:{afterPatch:this.handleShowAndDuration}})}validateShowDuration(t){n(this,"_showDuration",t,{hooks:{afterPatch:this.handleShowAndDuration}})}validateType(t){h(this,"_type",(t=>"string"==typeof t&&("default"===t||"error"===t||"info"===t||"success"===t||"warning"===t)),new Set("String {success, info, warning, error}"),t)}componentWillLoad(){this.validateAlert(this._alert),this.validateHasCloser(this._hasCloser),this.validateHeading(this._heading),this.validateLevel(this._level),this.validateOn(this._on),this.validateShow(this._show),this.validateShowDuration(this._showDuration),this.validateType(this._type)}render(){return i(s,null,this.state._show&&i("div",null,i("kol-alert",{_alert:this.state._alert,_heading:this.state._heading,_level:this.state._level,_hasCloser:this.state._hasCloser,_type:this.state._type,_variant:"card",_on:this.on},i("slot",null))))}static get watchers(){return{_alert:["validateAlert"],_hasCloser:["validateHasCloser"],_heading:["validateHeading"],_level:["validateLevel"],_on:["validateOn"],_show:["validateShow"],_showDuration:["validateShowDuration"],_type:["validateType"]}}};c.style={default:d};export{c as kol_toast};
+import{r as t,h as i,H as e}from"./index-0dce65d2.js";import{b as s,w as a,s as o,d as n,a as h}from"./prop.validators-0ce5851c.js";import{w as l}from"./validation-470a9e9e.js";import{f as r}from"./a11y.tipps-ff5a1a99.js";import"./index-2eac13ad.js";import"./index.m-86dc8c44.js";import"./dev.utils-daaf2f39.js";const d="@windicss; *{box-sizing:border-box;font-size:inherit;hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}kol-heading-wc{font-weight:700}kol-icon{color:inherit}kol-span-wc{display:grid;place-items:center;width:100%}kol-span-wc>span{display:flex;gap:0.25rem;place-items:center}a,button{cursor:pointer}a.icon-only>kol-span-wc>span>span,button.icon-only>kol-span-wc>span>span{display:none}a{display:inline-flex;place-items:baseline}button{border-width:0}",c=class{constructor(e){t(this,e),this.handleShowAndDuration=()=>{!0===this.state._show&&"number"==typeof this.state._showDuration&&this.state._showDuration>=0&&(clearTimeout(this.durationTimeout),this.durationTimeout=setTimeout((()=>{clearTimeout(this.durationTimeout),this.close()}),this.state._showDuration))},this.close=()=>{var t;this._show=!1,this.state=Object.assign(Object.assign({},this.state),{_show:!1}),void 0!==(null===(t=this._on)||void 0===t?void 0:t.onClose)&&this._on.onClose(new Event("Close"))},this.on={onClose:this.close},this._alert=!0,this._hasCloser=!1,this._heading="",this._level=1,this._on=void 0,this._show=!0,this._showDuration=1e4,this._type="default",this.state={_alert:!0,_level:1,_show:!0}}validateAlert(t){s(this,"_alert",t)}validateHasCloser(t){s(this,"_hasCloser",t)}validateHeading(t){a(this,"_heading",t)}validateLevel(t){l(this,t)}validateOn(t){if("object"==typeof t&&null!==t){r("[KolToast] Prüfen, wie man auch einen EventCallback einzeln ändern kann.");const e={};"function"!=typeof t.onClose&&!0!==t.onClose||(e.onClose=t.onClose),o(this,"_on",e)}}validateShow(t){s(this,"_show",t,{hooks:{afterPatch:this.handleShowAndDuration}})}validateShowDuration(t){n(this,"_showDuration",t,{hooks:{afterPatch:this.handleShowAndDuration}})}validateType(t){h(this,"_type",(t=>"string"==typeof t&&("default"===t||"error"===t||"info"===t||"success"===t||"warning"===t)),new Set("String {success, info, warning, error}"),t)}componentWillLoad(){this.validateAlert(this._alert),this.validateHasCloser(this._hasCloser),this.validateHeading(this._heading),this.validateLevel(this._level),this.validateOn(this._on),this.validateShow(this._show),this.validateShowDuration(this._showDuration),this.validateType(this._type)}render(){return i(e,null,this.state._show&&i("div",null,i("kol-alert",{_alert:this.state._alert,_heading:this.state._heading,_level:this.state._level,_hasCloser:this.state._hasCloser,_type:this.state._type,_variant:"card",_on:this.on},i("slot",null))))}static get watchers(){return{_alert:["validateAlert"],_hasCloser:["validateHasCloser"],_heading:["validateHeading"],_level:["validateLevel"],_on:["validateOn"],_show:["validateShow"],_showDuration:["validateShowDuration"],_type:["validateType"]}}};c.style={default:d};export{c as kol_toast};

package/dist/kolibri/kol-tooltip.entry.js

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{r as t,h as n,H as o}from"./index-0dce65d2.js";import{w as e}from"./button-link-19f5259b.js";import{g as i,n as s}from"./dev.utils-daaf2f39.js";import{w as r}from"./prop.validators-59bc26b2.js";import{s as c}from"./reuse-2f7da8fc.js";import"./index-b76497e7.js";import"./index.m-86dc8c44.js";import"./a11y.tipps-ff5a1a99.js";import"./validator-2e4f8df6.js";function a(t){return t.split("-")[1]}function l(t){return"y"===t?"height":"width"}function f(t){return t.split("-")[0]}function u(t){return["top","bottom"].includes(f(t))?"x":"y"}function h(t,e,i){let{reference:n,floating:o}=t;const r=n.x+n.width/2-o.width/2,s=n.y+n.height/2-o.height/2,c=u(e),d=l(c),h=n[d]/2-o[d]/2,p="x"===c;let m;switch(f(e)){case"top":m={x:r,y:n.y-o.height};break;case"bottom":m={x:r,y:n.y+n.height};break;case"right":m={x:n.x+n.width,y:s};break;case"left":m={x:n.x-o.width,y:s};break;default:m={x:n.x,y:n.y}}switch(a(e)){case"start":m[c]-=h*(i&&p?-1:1);break;case"end":m[c]+=h*(i&&p?-1:1)}return m}const d=async(t,e,i)=>{const{placement:n="bottom",strategy:o="absolute",middleware:r=[],platform:s}=i,l=r.filter(Boolean),a=await(null==s.isRTL?void 0:s.isRTL(e));let c=await s.getElementRects({reference:t,floating:e,strategy:o}),{x:f,y:u}=h(c,n,a),d=n,p={},m=0;for(let i=0;i<l.length;i++){const{name:r,fn:g}=l[i],{x:y,y:v,data:x,reset:b}=await g({x:f,y:u,initialPlacement:n,placement:d,strategy:o,middlewareData:p,rects:c,platform:s,elements:{reference:t,floating:e}});f=null!=y?y:f,u=null!=v?v:u,p={...p,[r]:{...p[r],...x}},b&&m<=50&&(m++,"object"==typeof b&&(b.placement&&(d=b.placement),b.rects&&(c=!0===b.rects?await s.getElementRects({reference:t,floating:e,strategy:o}):b.rects),({x:f,y:u}=h(c,d,a))),i=-1)}return{x:f,y:u,placement:d,strategy:o,middlewareData:p}};function m(t){return{top:0,right:0,bottom:0,left:0,...t}}function p(t){return"number"!=typeof t?m(t):{top:t,right:t,bottom:t,left:t}}function y(t){return{...t,top:t.y,left:t.x,right:t.x+t.width,bottom:t.y+t.height}}async function x(t,e){var i;void 0===e&&(e={});const{x:n,y:o,platform:r,rects:s,elements:l,strategy:a}=t,{boundary:c="clippingAncestors",rootBoundary:f="viewport",elementContext:u="floating",altBoundary:d=!1,padding:h=0}=e,m=p(h),g=l[d?"floating"===u?"reference":"floating":u],v=y(await r.getClippingRect({element:null==(i=await(null==r.isElement?void 0:r.isElement(g)))||i?g:g.contextElement||await(null==r.getDocumentElement?void 0:r.getDocumentElement(l.floating)),boundary:c,rootBoundary:f,strategy:a})),x="floating"===u?{...s.floating,x:n,y:o}:s.reference,b=await(null==r.getOffsetParent?void 0:r.getOffsetParent(l.floating)),w=await(null==r.isElement?void 0:r.isElement(b))&&await(null==r.getScale?void 0:r.getScale(b))||{x:1,y:1},E=y(r.convertOffsetParentRelativeRectToViewportRelativeRect?await r.convertOffsetParentRelativeRectToViewportRelativeRect({rect:x,offsetParent:b,strategy:a}):x);return{top:(v.top-E.top+m.top)/w.y,bottom:(E.bottom-v.bottom+m.bottom)/w.y,left:(v.left-E.left+m.left)/w.x,right:(E.right-v.right+m.right)/w.x}}const g=Math.min,b=Math.max;function v(t,e,i){return b(t,g(e,i))}const w=t=>({name:"arrow",options:t,async fn(e){const{element:i,padding:n=0}=t||{},{x:o,y:r,placement:s,rects:c,platform:f}=e;if(null==i)return{};const d=p(n),h={x:o,y:r},m=u(s),g=l(m),y=await f.getDimensions(i),x="y"===m?"top":"left",b="y"===m?"bottom":"right",w=c.reference[g]+c.reference[m]-h[m]-c.floating[g],E=h[m]-c.reference[m],T=await(null==f.getOffsetParent?void 0:f.getOffsetParent(i));let L=T?"y"===m?T.clientHeight||0:T.clientWidth||0:0;0===L&&(L=c.floating[g]);const R=w/2-E/2,A=d[x],O=L-y[g]-d[b],C=L/2-y[g]/2+R,k=v(A,C,O),S=null!=a(s)&&C!=k&&c.reference[g]/2-(C<A?d[x]:d[b])-y[g]/2<0;return{[m]:h[m]-(S?C<A?A-C:O-C:0),data:{[m]:k,centerOffset:C-k}}}}),k={left:"right",right:"left",bottom:"top",top:"bottom"};function A(t){return t.replace(/left|right|bottom|top/g,(t=>k[t]))}function j(t,e,i){void 0===i&&(i=!1);const n=a(t),o=u(t),r=l(o);let s="x"===o?n===(i?"end":"start")?"right":"left":"start"===n?"bottom":"top";return e.reference[r]>e.floating[r]&&(s=A(s)),{main:s,cross:A(s)}}const _={start:"end",end:"start"};function R(t){return t.replace(/start|end/g,(t=>_[t]))}function T(t){const e=A(t);return[R(t),e,R(e)]}function L(t,e,i){const n=["left","right"],o=["right","left"],r=["top","bottom"],s=["bottom","top"];switch(t){case"top":case"bottom":return i?e?o:n:e?n:o;case"left":case"right":return e?r:s;default:return[]}}function O(t,e,i,n){const o=a(t);let r=L(f(t),"start"===i,n);return o&&(r=r.map((t=>t+"-"+o)),e&&(r=r.concat(r.map(R)))),r}const P=function(t){return void 0===t&&(t={}),{name:"flip",options:t,async fn(e){var i;const{placement:n,middlewareData:o,rects:r,initialPlacement:s,platform:l,elements:a}=e,{mainAxis:c=!0,crossAxis:u=!0,fallbackPlacements:d,fallbackStrategy:h="bestFit",fallbackAxisSideDirection:p="none",flipAlignment:m=!0,...g}=t,y=f(n),v=f(s)===s,b=await(null==l.isRTL?void 0:l.isRTL(a.floating)),w=d||(v||!m?[A(s)]:T(s));d||"none"===p||w.push(...O(s,m,p,b));const E=[s,...w],L=await x(e,g),R=[];let C=(null==(i=o.flip)?void 0:i.overflows)||[];if(c&&R.push(L[y]),u){const{main:t,cross:e}=j(n,r,b);R.push(L[t],L[e])}if(C=[...C,{placement:n,overflows:R}],!R.every((t=>t<=0))){var k,S;const t=((null==(k=o.flip)?void 0:k.index)||0)+1,e=E[t];if(e)return{data:{index:t,overflows:C},reset:{placement:e}};let i=null==(S=C.find((t=>t.overflows[0]<=0)))?void 0:S.placement;if(!i)switch(h){case"bestFit":{var F;const t=null==(F=C.map((t=>[t.placement,t.overflows.filter((t=>t>0)).reduce(((t,e)=>t+e),0)])).sort(((t,e)=>t[1]-e[1]))[0])?void 0:F[0];t&&(i=t);break}case"initialPlacement":i=s}if(n!==i)return{reset:{placement:i}}}return{}}}};async function $(t,e){const{placement:i,platform:n,elements:o}=t,r=await(null==n.isRTL?void 0:n.isRTL(o.floating)),s=f(i),l=a(i),c="x"===u(i),d=["left","top"].includes(s)?-1:1,h=r&&c?-1:1,p="function"==typeof e?e(t):e;let{mainAxis:m,crossAxis:g,alignmentAxis:y}="number"==typeof p?{mainAxis:p,crossAxis:0,alignmentAxis:null}:{mainAxis:0,crossAxis:0,alignmentAxis:null,...p};return l&&"number"==typeof y&&(g="end"===l?-1*y:y),c?{x:g*h,y:m*d}:{x:m*d,y:g*h}}const D=function(t){return void 0===t&&(t=0),{name:"offset",options:t,async fn(e){const{x:i,y:n}=e,o=await $(e,t);return{x:i+o.x,y:n+o.y,data:o}}}};function C(t){return"x"===t?"y":"x"}const F=function(t){return void 0===t&&(t={}),{name:"shift",options:t,async fn(e){const{x:i,y:n,placement:o}=e,{mainAxis:r=!0,crossAxis:s=!1,limiter:l={fn:t=>{let{x:e,y:i}=t;return{x:e,y:i}}},...a}=t,c={x:i,y:n},d=await x(e,a),h=u(f(o)),p=C(h);let m=c[h],g=c[p];if(r){const t="y"===h?"bottom":"right";m=v(m+d["y"===h?"top":"left"],m,m-d[t])}if(s){const t="y"===p?"bottom":"right";g=v(g+d["y"===p?"top":"left"],g,g-d[t])}const y=l.fn({...e,[h]:m,[p]:g});return{...y,data:{x:y.x-i,y:y.y-n}}}}};function M(t){var e;return(null==(e=t.ownerDocument)?void 0:e.defaultView)||window}function S(t){return M(t).getComputedStyle(t)}function B(t){return H(t)?(t.nodeName||"").toLowerCase():""}let z;function E(){if(z)return z;const t=navigator.userAgentData;return t&&Array.isArray(t.brands)?(z=t.brands.map((t=>t.brand+"/"+t.version)).join(" "),z):navigator.userAgent}function I(t){return t instanceof M(t).HTMLElement}function N(t){return t instanceof M(t).Element}function H(t){return t instanceof M(t).Node}function V(t){if("undefined"==typeof ShadowRoot)return!1;return t instanceof M(t).ShadowRoot||t instanceof ShadowRoot}function W(t){const{overflow:e,overflowX:i,overflowY:n,display:o}=S(t);return/auto|scroll|overlay|hidden|clip/.test(e+n+i)&&!["inline","contents"].includes(o)}function X(t){return["table","td","th"].includes(B(t))}function Y(t){const e=/firefox/i.test(E()),i=S(t),n=i.backdropFilter||i.WebkitBackdropFilter;return"none"!==i.transform||"none"!==i.perspective||!!n&&"none"!==n||e&&"filter"===i.willChange||e&&!!i.filter&&"none"!==i.filter||["transform","perspective"].some((t=>i.willChange.includes(t)))||["paint","layout","strict","content"].some((t=>{const e=i.contain;return null!=e&&e.includes(t)}))}function q(){return!/^((?!chrome|android).)*safari/i.test(E())}function G(t){return["html","body","#document"].includes(B(t))}const J=Math.min,K=Math.max,Q=Math.round;function U(t){const e=S(t);let i=parseFloat(e.width),n=parseFloat(e.height);const o=t.offsetWidth,r=t.offsetHeight,s=Q(i)!==o||Q(n)!==r;return s&&(i=o,n=r),{width:i,height:n,fallback:s}}function Z(t){return N(t)?t:t.contextElement}const tt={x:1,y:1};function nt(t){const e=Z(t);if(!I(e))return tt;const i=e.getBoundingClientRect(),{width:n,height:o,fallback:r}=U(e);let s=(r?Q(i.width):i.width)/n,l=(r?Q(i.height):i.height)/o;return s&&Number.isFinite(s)||(s=1),l&&Number.isFinite(l)||(l=1),{x:s,y:l}}function ot(t,e,i,n){var o,r;void 0===e&&(e=!1),void 0===i&&(i=!1);const s=t.getBoundingClientRect(),l=Z(t);let a=tt;e&&(n?N(n)&&(a=nt(n)):a=nt(t));const c=l?M(l):window,f=!q()&&i;let u=(s.left+(f&&(null==(o=c.visualViewport)?void 0:o.offsetLeft)||0))/a.x,d=(s.top+(f&&(null==(r=c.visualViewport)?void 0:r.offsetTop)||0))/a.y,h=s.width/a.x,p=s.height/a.y;if(l){const t=M(l),e=n&&N(n)?M(n):n;let i=t.frameElement;for(;i&&n&&e!==t;){const t=nt(i),e=i.getBoundingClientRect(),n=getComputedStyle(i);e.x+=(i.clientLeft+parseFloat(n.paddingLeft))*t.x,e.y+=(i.clientTop+parseFloat(n.paddingTop))*t.y,u*=t.x,d*=t.y,h*=t.x,p*=t.y,u+=e.x,d+=e.y,i=M(i).frameElement}}return{width:h,height:p,top:d,right:u+h,bottom:d+p,left:u,x:u,y:d}}function et(t){return((H(t)?t.ownerDocument:t.document)||window.document).documentElement}function it(t){return N(t)?{scrollLeft:t.scrollLeft,scrollTop:t.scrollTop}:{scrollLeft:t.pageXOffset,scrollTop:t.pageYOffset}}function st(t){return ot(et(t)).left+it(t).scrollLeft}function rt(t,e,i){const n=I(e),o=et(e),r=ot(t,!0,"fixed"===i,e);let s={scrollLeft:0,scrollTop:0};const l={x:0,y:0};if(n||!n&&"fixed"!==i)if(("body"!==B(e)||W(o))&&(s=it(e)),I(e)){const t=ot(e,!0);l.x=t.x+e.clientLeft,l.y=t.y+e.clientTop}else o&&(l.x=st(o));return{x:r.left+s.scrollLeft-l.x,y:r.top+s.scrollTop-l.y,width:r.width,height:r.height}}function ct(t){if("html"===B(t))return t;const e=t.assignedSlot||t.parentNode||(V(t)?t.host:null)||et(t);return V(e)?e.host:e}function at(t){return I(t)&&"fixed"!==S(t).position?t.offsetParent:null}function lt(t){let e=ct(t);for(;I(e)&&!G(e);){if(Y(e))return e;e=ct(e)}return null}function ft(t){const e=M(t);let i=at(t);for(;i&&X(i)&&"static"===S(i).position;)i=at(i);return i&&("html"===B(i)||"body"===B(i)&&"static"===S(i).position&&!Y(i))?e:i||lt(t)||e}function ut(t){return U(t)}function ht(t){let{rect:e,offsetParent:i,strategy:n}=t;const o=I(i),r=et(i);if(i===r)return e;let s={scrollLeft:0,scrollTop:0},l={x:1,y:1};const a={x:0,y:0};if((o||!o&&"fixed"!==n)&&(("body"!==B(i)||W(r))&&(s=it(i)),I(i))){const t=ot(i);l=nt(i),a.x=t.x+i.clientLeft,a.y=t.y+i.clientTop}return{width:e.width*l.x,height:e.height*l.y,x:e.x*l.x-s.scrollLeft*l.x+a.x,y:e.y*l.y-s.scrollTop*l.y+a.y}}function dt(t,e){const i=M(t),n=et(t),o=i.visualViewport;let r=n.clientWidth,s=n.clientHeight,l=0,a=0;if(o){r=o.width,s=o.height;const t=q();(t||!t&&"fixed"===e)&&(l=o.offsetLeft,a=o.offsetTop)}return{width:r,height:s,x:l,y:a}}function mt(t){var e;const i=et(t),n=it(t),o=null==(e=t.ownerDocument)?void 0:e.body,r=K(i.scrollWidth,i.clientWidth,o?o.scrollWidth:0,o?o.clientWidth:0),s=K(i.scrollHeight,i.clientHeight,o?o.scrollHeight:0,o?o.clientHeight:0);let l=-n.scrollLeft+st(t);const a=-n.scrollTop;return"rtl"===S(o||i).direction&&(l+=K(i.clientWidth,o?o.clientWidth:0)-r),{width:r,height:s,x:l,y:a}}function pt(t){const e=ct(t);return G(e)?t.ownerDocument.body:I(e)&&W(e)?e:pt(e)}function yt(t,e){var i;void 0===e&&(e=[]);const n=pt(t),o=n===(null==(i=t.ownerDocument)?void 0:i.body),r=M(n);return o?e.concat(r,r.visualViewport||[],W(n)?n:[]):e.concat(n,yt(n))}function xt(t,e){const i=ot(t,!0,"fixed"===e),n=i.top+t.clientTop,o=i.left+t.clientLeft,r=I(t)?nt(t):{x:1,y:1},s=t.clientWidth*r.x,l=t.clientHeight*r.y,a=o*r.x,c=n*r.y;return{top:c,left:a,right:a+s,bottom:c+l,x:a,y:c,width:s,height:l}}function gt(t,e,i){return"viewport"===e?y(dt(t,i)):N(e)?xt(e,i):y(mt(et(t)))}function bt(t,e){const i=e.get(t);if(i)return i;let n=yt(t).filter((t=>N(t)&&"body"!==B(t))),o=null;const r="fixed"===S(t).position;let s=r?ct(t):t;for(;N(s)&&!G(s);){const t=S(s),e=Y(s);(r?!e&&!o:!e&&"static"===t.position&&!!o&&["absolute","fixed"].includes(o.position))?n=n.filter((t=>t!==s)):o=t,s=ct(s)}return e.set(t,n),n}function vt(t){let{element:e,boundary:i,rootBoundary:n,strategy:o}=t;const r=[..."clippingAncestors"===i?bt(e,this._c):[].concat(i),n],s=r[0],l=r.reduce(((t,i)=>{const n=gt(e,i,o);return t.top=K(n.top,t.top),t.right=J(n.right,t.right),t.bottom=J(n.bottom,t.bottom),t.left=K(n.left,t.left),t}),gt(e,s,o));return{width:l.right-l.left,height:l.bottom-l.top,x:l.left,y:l.top}}const wt={getClippingRect:vt,convertOffsetParentRelativeRectToViewportRelativeRect:ht,isElement:N,getDimensions:ut,getOffsetParent:ft,getDocumentElement:et,getScale:nt,async getElementRects(t){let{reference:e,floating:i,strategy:n}=t;const o=this.getOffsetParent||ft,r=this.getDimensions;return{reference:rt(e,await o(i),n),floating:{x:0,y:0,...await r(i)}}},getClientRects:t=>Array.from(t.getClientRects()),isRTL:t=>"rtl"===S(t).direction},kt=(t,e,i)=>{const n=new Map,o={platform:wt,...i},r={...o.platform,_c:n};return d(t,e,{...o,platform:r})},At=":host #floating{display:none;position:absolute;animation-name:fadeInOpacity;animation-iteration-count:1;animation-timing-function:ease-in;animation-duration:0.5s;box-sizing:border-box;box-shadow:0 0 0.15rem rgba(255, 255, 255, 0.8)}:host #arrow{position:absolute;width:10px;height:10px;background:#333;transform:rotate(45deg);z-index:999}:host kol-badge{font-size:1rem;max-width:300px;z-index:1000;position:relative}@keyframes fadeInOpacity{0%{opacity:0}100%{opacity:1}}",jt=class{constructor(e){t(this,e),this.alignTooltip=()=>{var t;if(this.previousSibling){const e=this.previousSibling;if(this.tooltipElement){const i=this.tooltipElement,n=this.arrowElement,o=[D(null!==(t=null==n?void 0:n.offsetHeight)&&void 0!==t?t:10),P(),F()];n&&o.push(w({element:n})),kt(e,i,{placement:this.state._align,middleware:o}).then((({x:t,y:e,middlewareData:o,placement:r})=>{var s,l;Object.assign(i.style,{left:`${t}px`,top:`${e}px`}),n&&((null===(s=o.arrow)||void 0===s?void 0:s.x)?Object.assign(n.style,{left:`${o.arrow.x}px`,top:"bottom"===r?-n.offsetHeight/2+"px":"",bottom:"top"===r?-n.offsetHeight/2+"px":""}):(null===(l=o.arrow)||void 0===l?void 0:l.y)&&Object.assign(n.style,{left:"right"===r?-n.offsetWidth/2+"px":"",right:"left"===r?-n.offsetWidth/2+"px":"",top:`${o.arrow.y}px`}))}))}}},this.showTooltip=()=>{this.tooltipElement&&(this.tooltipElement.style.setProperty("display","block"),i().body.addEventListener("keyup",this.hideTooltipByEscape),this.alignTooltip(),this.tooltipElement.style.setProperty("visibility","visible"),document.addEventListener("scroll",this.alignTooltip))},this.hideTooltip=()=>{this.tooltipElement&&(this.tooltipElement.style.setProperty("display","none"),this.tooltipElement.style.setProperty("visibility","hidden"),document.removeEventListener("scroll",this.alignTooltip))},this.hideTooltipByEscape=t=>{"Escape"===t.key&&(i().body.removeEventListener("keyup",this.hideTooltipByEscape),this.hideTooltip())},this.addListeners=t=>{t.addEventListener("mouseover",this.incrementOverFocusCount),t.addEventListener("focus",this.incrementOverFocusCount),t.addEventListener("mouseout",this.decrementOverFocusCount),t.addEventListener("blur",this.decrementOverFocusCount)},this.removeListeners=t=>{t.removeEventListener("mouseover",this.incrementOverFocusCount),t.removeEventListener("focus",this.incrementOverFocusCount),t.removeEventListener("mouseout",this.decrementOverFocusCount),t.removeEventListener("blur",this.decrementOverFocusCount)},this.resyncListeners=t=>{this.removeListeners(t),this.addListeners(t)},this.catchHostElement=t=>{t&&(this.previousSibling=t.previousElementSibling,this.previousSibling&&this.resyncListeners(this.previousSibling))},this.catchTooltipElement=t=>{this.tooltipElement=t,this.tooltipElement&&this.resyncListeners(this.tooltipElement)},this.catchArrowElement=t=>{this.arrowElement=t},this.overFocusCount=0,this.incrementOverFocusCount=()=>{this.overFocusCount++,this.showOrHideTooltip()},this.decrementOverFocusCount=()=>{this.overFocusCount--,this.showOrHideTooltip()},this.showOrHideTooltip=()=>{clearTimeout(this.overFocusTimeout),this.overFocusTimeout=setTimeout((()=>{clearTimeout(this.overFocusTimeout),this.overFocusCount>0?this.showTooltip():this.hideTooltip()}),250)},this._align="top",this._id=void 0,this._label=void 0,this.state={_align:"top",_id:s(),_label:""}}render(){return c((()=>{this.alignTooltip(),c(this.alignTooltip,750)}),250),n(o,{ref:this.catchHostElement},""!==this.state._label&&n("div",{id:"floating",ref:this.catchTooltipElement},n("div",{id:"arrow",ref:this.catchArrowElement}),n("kol-badge",{id:this.state._id,_color:{backgroundColor:"#333",color:"#ddd"},_label:this.state._label})))}validateAlign(t){e(this,"_align",t)}validateId(t){r(this,"_id",t)}validateLabel(t){r(this,"_label",t)}componentWillLoad(){this.validateAlign(this._align),this.validateId(this._id),this.validateLabel(this._label)}disconnectedCallback(){this.previousSibling&&this.removeListeners(this.previousSibling),this.tooltipElement&&this.removeListeners(this.tooltipElement)}static get watchers(){return{_align:["validateAlign"],_id:["validateId"],_label:["validateLabel"]}}};jt.style={default:At};export{jt as kol_tooltip};
+import{r as t,h as n,H as o}from"./index-0dce65d2.js";import{w as e}from"./button-link-d9d215b8.js";import{g as i,n as s}from"./dev.utils-daaf2f39.js";import{w as r}from"./prop.validators-0ce5851c.js";import{s as c}from"./reuse-2f7da8fc.js";import"./index-2eac13ad.js";import"./index.m-86dc8c44.js";import"./a11y.tipps-ff5a1a99.js";import"./validator-2e4f8df6.js";function a(t){return t.split("-")[1]}function l(t){return"y"===t?"height":"width"}function f(t){return t.split("-")[0]}function u(t){return["top","bottom"].includes(f(t))?"x":"y"}function d(t,e,i){let{reference:n,floating:o}=t;const r=n.x+n.width/2-o.width/2,s=n.y+n.height/2-o.height/2,c=u(e),d=l(c),h=n[d]/2-o[d]/2,p="x"===c;let m;switch(f(e)){case"top":m={x:r,y:n.y-o.height};break;case"bottom":m={x:r,y:n.y+n.height};break;case"right":m={x:n.x+n.width,y:s};break;case"left":m={x:n.x-o.width,y:s};break;default:m={x:n.x,y:n.y}}switch(a(e)){case"start":m[c]-=h*(i&&p?-1:1);break;case"end":m[c]+=h*(i&&p?-1:1)}return m}const h=async(t,e,i)=>{const{placement:n="bottom",strategy:o="absolute",middleware:r=[],platform:s}=i,l=r.filter(Boolean),a=await(null==s.isRTL?void 0:s.isRTL(e));let c=await s.getElementRects({reference:t,floating:e,strategy:o}),{x:f,y:u}=d(c,n,a),h=n,p={},m=0;for(let i=0;i<l.length;i++){const{name:r,fn:g}=l[i],{x:y,y:v,data:x,reset:w}=await g({x:f,y:u,initialPlacement:n,placement:h,strategy:o,middlewareData:p,rects:c,platform:s,elements:{reference:t,floating:e}});f=null!=y?y:f,u=null!=v?v:u,p={...p,[r]:{...p[r],...x}},w&&m<=50&&(m++,"object"==typeof w&&(w.placement&&(h=w.placement),w.rects&&(c=!0===w.rects?await s.getElementRects({reference:t,floating:e,strategy:o}):w.rects),({x:f,y:u}=d(c,h,a))),i=-1)}return{x:f,y:u,placement:h,strategy:o,middlewareData:p}};function m(t){return{top:0,right:0,bottom:0,left:0,...t}}function p(t){return"number"!=typeof t?m(t):{top:t,right:t,bottom:t,left:t}}function y(t){return{...t,top:t.y,left:t.x,right:t.x+t.width,bottom:t.y+t.height}}async function x(t,e){var i;void 0===e&&(e={});const{x:n,y:o,platform:r,rects:s,elements:l,strategy:a}=t,{boundary:c="clippingAncestors",rootBoundary:f="viewport",elementContext:u="floating",altBoundary:d=!1,padding:h=0}=e,m=p(h),g=l[d?"floating"===u?"reference":"floating":u],v=y(await r.getClippingRect({element:null==(i=await(null==r.isElement?void 0:r.isElement(g)))||i?g:g.contextElement||await(null==r.getDocumentElement?void 0:r.getDocumentElement(l.floating)),boundary:c,rootBoundary:f,strategy:a})),x="floating"===u?{...s.floating,x:n,y:o}:s.reference,w=await(null==r.getOffsetParent?void 0:r.getOffsetParent(l.floating)),b=await(null==r.isElement?void 0:r.isElement(w))&&await(null==r.getScale?void 0:r.getScale(w))||{x:1,y:1},E=y(r.convertOffsetParentRelativeRectToViewportRelativeRect?await r.convertOffsetParentRelativeRectToViewportRelativeRect({rect:x,offsetParent:w,strategy:a}):x);return{top:(v.top-E.top+m.top)/b.y,bottom:(E.bottom-v.bottom+m.bottom)/b.y,left:(v.left-E.left+m.left)/b.x,right:(E.right-v.right+m.right)/b.x}}const g=Math.min,b=Math.max;function v(t,e,i){return b(t,g(e,i))}const w=t=>({name:"arrow",options:t,async fn(e){const{element:i,padding:n=0}=t||{},{x:o,y:r,placement:s,rects:c,platform:f}=e;if(null==i)return{};const d=p(n),h={x:o,y:r},m=u(s),g=l(m),y=await f.getDimensions(i),x="y"===m?"top":"left",w="y"===m?"bottom":"right",b=c.reference[g]+c.reference[m]-h[m]-c.floating[g],E=h[m]-c.reference[m],T=await(null==f.getOffsetParent?void 0:f.getOffsetParent(i));let L=T?"y"===m?T.clientHeight||0:T.clientWidth||0:0;0===L&&(L=c.floating[g]);const R=b/2-E/2,A=d[x],C=L-y[g]-d[w],O=L/2-y[g]/2+R,k=v(A,O,C),S=null!=a(s)&&O!=k&&c.reference[g]/2-(O<A?d[x]:d[w])-y[g]/2<0;return{[m]:h[m]-(S?O<A?A-O:C-O:0),data:{[m]:k,centerOffset:O-k}}}}),k={left:"right",right:"left",bottom:"top",top:"bottom"};function A(t){return t.replace(/left|right|bottom|top/g,(t=>k[t]))}function j(t,e,i){void 0===i&&(i=!1);const n=a(t),o=u(t),r=l(o);let s="x"===o?n===(i?"end":"start")?"right":"left":"start"===n?"bottom":"top";return e.reference[r]>e.floating[r]&&(s=A(s)),{main:s,cross:A(s)}}const _={start:"end",end:"start"};function R(t){return t.replace(/start|end/g,(t=>_[t]))}function T(t){const e=A(t);return[R(t),e,R(e)]}function L(t,e,i){const n=["left","right"],o=["right","left"],r=["top","bottom"],s=["bottom","top"];switch(t){case"top":case"bottom":return i?e?o:n:e?n:o;case"left":case"right":return e?r:s;default:return[]}}function O(t,e,i,n){const o=a(t);let r=L(f(t),"start"===i,n);return o&&(r=r.map((t=>t+"-"+o)),e&&(r=r.concat(r.map(R)))),r}const P=function(t){return void 0===t&&(t={}),{name:"flip",options:t,async fn(e){var i;const{placement:n,middlewareData:o,rects:r,initialPlacement:s,platform:l,elements:a}=e,{mainAxis:c=!0,crossAxis:u=!0,fallbackPlacements:d,fallbackStrategy:h="bestFit",fallbackAxisSideDirection:p="none",flipAlignment:m=!0,...g}=t,y=f(n),v=f(s)===s,w=await(null==l.isRTL?void 0:l.isRTL(a.floating)),b=d||(v||!m?[A(s)]:T(s));d||"none"===p||b.push(...O(s,m,p,w));const E=[s,...b],L=await x(e,g),R=[];let C=(null==(i=o.flip)?void 0:i.overflows)||[];if(c&&R.push(L[y]),u){const{main:t,cross:e}=j(n,r,w);R.push(L[t],L[e])}if(C=[...C,{placement:n,overflows:R}],!R.every((t=>t<=0))){var k,S;const t=((null==(k=o.flip)?void 0:k.index)||0)+1,e=E[t];if(e)return{data:{index:t,overflows:C},reset:{placement:e}};let i=null==(S=C.filter((t=>t.overflows[0]<=0)).sort(((t,e)=>t.overflows[1]-e.overflows[1]))[0])?void 0:S.placement;if(!i)switch(h){case"bestFit":{var F;const t=null==(F=C.map((t=>[t.placement,t.overflows.filter((t=>t>0)).reduce(((t,e)=>t+e),0)])).sort(((t,e)=>t[1]-e[1]))[0])?void 0:F[0];t&&(i=t);break}case"initialPlacement":i=s}if(n!==i)return{reset:{placement:i}}}return{}}}};async function $(t,e){const{placement:i,platform:n,elements:o}=t,r=await(null==n.isRTL?void 0:n.isRTL(o.floating)),s=f(i),l=a(i),c="x"===u(i),d=["left","top"].includes(s)?-1:1,h=r&&c?-1:1,p="function"==typeof e?e(t):e;let{mainAxis:m,crossAxis:g,alignmentAxis:y}="number"==typeof p?{mainAxis:p,crossAxis:0,alignmentAxis:null}:{mainAxis:0,crossAxis:0,alignmentAxis:null,...p};return l&&"number"==typeof y&&(g="end"===l?-1*y:y),c?{x:g*h,y:m*d}:{x:m*d,y:g*h}}const D=function(t){return void 0===t&&(t=0),{name:"offset",options:t,async fn(e){const{x:i,y:n}=e,o=await $(e,t);return{x:i+o.x,y:n+o.y,data:o}}}};function C(t){return"x"===t?"y":"x"}const F=function(t){return void 0===t&&(t={}),{name:"shift",options:t,async fn(e){const{x:i,y:n,placement:o}=e,{mainAxis:r=!0,crossAxis:s=!1,limiter:l={fn:t=>{let{x:e,y:i}=t;return{x:e,y:i}}},...a}=t,c={x:i,y:n},d=await x(e,a),h=u(f(o)),p=C(h);let m=c[h],g=c[p];if(r){const t="y"===h?"bottom":"right";m=v(m+d["y"===h?"top":"left"],m,m-d[t])}if(s){const t="y"===p?"bottom":"right";g=v(g+d["y"===p?"top":"left"],g,g-d[t])}const y=l.fn({...e,[h]:m,[p]:g});return{...y,data:{x:y.x-i,y:y.y-n}}}}};function M(t){var e;return(null==(e=t.ownerDocument)?void 0:e.defaultView)||window}function S(t){return M(t).getComputedStyle(t)}const B=Math.min,z=Math.max,E=Math.round;function I(t){const e=S(t);let i=parseFloat(e.width),n=parseFloat(e.height);const o=t.offsetWidth,r=t.offsetHeight,s=E(i)!==o||E(n)!==r;return s&&(i=o,n=r),{width:i,height:n,fallback:s}}function N(t){return Y(t)?(t.nodeName||"").toLowerCase():""}let H;function V(){if(H)return H;const t=navigator.userAgentData;return t&&Array.isArray(t.brands)?(H=t.brands.map((t=>t.brand+"/"+t.version)).join(" "),H):navigator.userAgent}function W(t){return t instanceof M(t).HTMLElement}function X(t){return t instanceof M(t).Element}function Y(t){return t instanceof M(t).Node}function q(t){if("undefined"==typeof ShadowRoot)return!1;return t instanceof M(t).ShadowRoot||t instanceof ShadowRoot}function G(t){const{overflow:e,overflowX:i,overflowY:n,display:o}=S(t);return/auto|scroll|overlay|hidden|clip/.test(e+n+i)&&!["inline","contents"].includes(o)}function J(t){return["table","td","th"].includes(N(t))}function K(t){const e=/firefox/i.test(V()),i=S(t),n=i.backdropFilter||i.WebkitBackdropFilter;return"none"!==i.transform||"none"!==i.perspective||!!n&&"none"!==n||e&&"filter"===i.willChange||e&&!!i.filter&&"none"!==i.filter||["transform","perspective"].some((t=>i.willChange.includes(t)))||["paint","layout","strict","content"].some((t=>{const e=i.contain;return null!=e&&e.includes(t)}))}function Q(){return!/^((?!chrome|android).)*safari/i.test(V())}function U(t){return["html","body","#document"].includes(N(t))}function Z(t){return X(t)?t:t.contextElement}const tt={x:1,y:1};function nt(t){const e=Z(t);if(!W(e))return tt;const i=e.getBoundingClientRect(),{width:n,height:o,fallback:r}=I(e);let s=(r?E(i.width):i.width)/n,l=(r?E(i.height):i.height)/o;return s&&Number.isFinite(s)||(s=1),l&&Number.isFinite(l)||(l=1),{x:s,y:l}}function ot(t,e,i,n){var o,r;void 0===e&&(e=!1),void 0===i&&(i=!1);const s=t.getBoundingClientRect(),l=Z(t);let a=tt;e&&(n?X(n)&&(a=nt(n)):a=nt(t));const c=l?M(l):window,f=!Q()&&i;let u=(s.left+(f&&(null==(o=c.visualViewport)?void 0:o.offsetLeft)||0))/a.x,d=(s.top+(f&&(null==(r=c.visualViewport)?void 0:r.offsetTop)||0))/a.y,h=s.width/a.x,p=s.height/a.y;if(l){const t=M(l),e=n&&X(n)?M(n):n;let i=t.frameElement;for(;i&&n&&e!==t;){const t=nt(i),e=i.getBoundingClientRect(),n=getComputedStyle(i);e.x+=(i.clientLeft+parseFloat(n.paddingLeft))*t.x,e.y+=(i.clientTop+parseFloat(n.paddingTop))*t.y,u*=t.x,d*=t.y,h*=t.x,p*=t.y,u+=e.x,d+=e.y,i=M(i).frameElement}}return{width:h,height:p,top:d,right:u+h,bottom:d+p,left:u,x:u,y:d}}function et(t){return((Y(t)?t.ownerDocument:t.document)||window.document).documentElement}function it(t){return X(t)?{scrollLeft:t.scrollLeft,scrollTop:t.scrollTop}:{scrollLeft:t.pageXOffset,scrollTop:t.pageYOffset}}function st(t){let{rect:e,offsetParent:i,strategy:n}=t;const o=W(i),r=et(i);if(i===r)return e;let s={scrollLeft:0,scrollTop:0},l={x:1,y:1};const a={x:0,y:0};if((o||!o&&"fixed"!==n)&&(("body"!==N(i)||G(r))&&(s=it(i)),W(i))){const t=ot(i);l=nt(i),a.x=t.x+i.clientLeft,a.y=t.y+i.clientTop}return{width:e.width*l.x,height:e.height*l.y,x:e.x*l.x-s.scrollLeft*l.x+a.x,y:e.y*l.y-s.scrollTop*l.y+a.y}}function rt(t){return ot(et(t)).left+it(t).scrollLeft}function ct(t){const e=et(t),i=it(t),n=t.ownerDocument.body,o=z(e.scrollWidth,e.clientWidth,n.scrollWidth,n.clientWidth),r=z(e.scrollHeight,e.clientHeight,n.scrollHeight,n.clientHeight);let s=-i.scrollLeft+rt(t);const l=-i.scrollTop;return"rtl"===S(n).direction&&(s+=z(e.clientWidth,n.clientWidth)-o),{width:o,height:r,x:s,y:l}}function at(t){if("html"===N(t))return t;const e=t.assignedSlot||t.parentNode||q(t)&&t.host||et(t);return q(e)?e.host:e}function lt(t){const e=at(t);return U(e)?e.ownerDocument.body:W(e)&&G(e)?e:lt(e)}function ft(t,e){var i;void 0===e&&(e=[]);const n=lt(t),o=n===(null==(i=t.ownerDocument)?void 0:i.body),r=M(n);return o?e.concat(r,r.visualViewport||[],G(n)?n:[]):e.concat(n,ft(n))}function ut(t,e){const i=M(t),n=et(t),o=i.visualViewport;let r=n.clientWidth,s=n.clientHeight,l=0,a=0;if(o){r=o.width,s=o.height;const t=Q();(t||!t&&"fixed"===e)&&(l=o.offsetLeft,a=o.offsetTop)}return{width:r,height:s,x:l,y:a}}function dt(t,e){const i=ot(t,!0,"fixed"===e),n=i.top+t.clientTop,o=i.left+t.clientLeft,r=W(t)?nt(t):{x:1,y:1};return{width:t.clientWidth*r.x,height:t.clientHeight*r.y,x:o*r.x,y:n*r.y}}function ht(t,e,i){return"viewport"===e?y(ut(t,i)):X(e)?y(dt(e,i)):y(ct(et(t)))}function mt(t,e){const i=e.get(t);if(i)return i;let n=ft(t).filter((t=>X(t)&&"body"!==N(t))),o=null;const r="fixed"===S(t).position;let s=r?at(t):t;for(;X(s)&&!U(s);){const t=S(s),e=K(s);(r?!e&&!o:!e&&"static"===t.position&&!!o&&["absolute","fixed"].includes(o.position))?n=n.filter((t=>t!==s)):o=t,s=at(s)}return e.set(t,n),n}function pt(t){let{element:e,boundary:i,rootBoundary:n,strategy:o}=t;const r=[..."clippingAncestors"===i?mt(e,this._c):[].concat(i),n],s=r[0],l=r.reduce(((t,i)=>{const n=ht(e,i,o);return t.top=z(n.top,t.top),t.right=B(n.right,t.right),t.bottom=B(n.bottom,t.bottom),t.left=z(n.left,t.left),t}),ht(e,s,o));return{width:l.right-l.left,height:l.bottom-l.top,x:l.left,y:l.top}}function yt(t){return W(t)?I(t):t.getBoundingClientRect()}function xt(t){return W(t)&&"fixed"!==S(t).position?t.offsetParent:null}function gt(t){let e=at(t);for(;W(e)&&!U(e);){if(K(e))return e;e=at(e)}return null}function bt(t){const e=M(t);let i=xt(t);for(;i&&J(i)&&"static"===S(i).position;)i=xt(i);return i&&("html"===N(i)||"body"===N(i)&&"static"===S(i).position&&!K(i))?e:i||gt(t)||e}function vt(t,e,i){const n=W(e),o=et(e),r=ot(t,!0,"fixed"===i,e);let s={scrollLeft:0,scrollTop:0};const l={x:0,y:0};if(n||!n&&"fixed"!==i)if(("body"!==N(e)||G(o))&&(s=it(e)),W(e)){const t=ot(e,!0);l.x=t.x+e.clientLeft,l.y=t.y+e.clientTop}else o&&(l.x=rt(o));return{x:r.left+s.scrollLeft-l.x,y:r.top+s.scrollTop-l.y,width:r.width,height:r.height}}const wt={getClippingRect:pt,convertOffsetParentRelativeRectToViewportRelativeRect:st,isElement:X,getDimensions:yt,getOffsetParent:bt,getDocumentElement:et,getScale:nt,async getElementRects(t){let{reference:e,floating:i,strategy:n}=t;const o=this.getOffsetParent||bt,r=this.getDimensions;return{reference:vt(e,await o(i),n),floating:{x:0,y:0,...await r(i)}}},getClientRects:t=>Array.from(t.getClientRects()),isRTL:t=>"rtl"===S(t).direction},kt=(t,e,i)=>{const n=new Map,o={platform:wt,...i},r={...o.platform,_c:n};return h(t,e,{...o,platform:r})},At=":host #floating{display:none;position:absolute;animation-name:fadeInOpacity;animation-iteration-count:1;animation-timing-function:ease-in;animation-duration:0.5s;box-sizing:border-box;box-shadow:0 0 0.15rem rgba(255, 255, 255, 0.8)}:host #arrow{position:absolute;width:10px;height:10px;background:#333;transform:rotate(45deg);z-index:999}:host kol-badge{font-size:1rem;max-width:300px;z-index:1000;position:relative}@keyframes fadeInOpacity{0%{opacity:0}100%{opacity:1}}",jt=class{constructor(e){t(this,e),this.alignTooltip=()=>{var t;if(this.previousSibling){const e=this.previousSibling;if(this.tooltipElement){const i=this.tooltipElement,n=this.arrowElement,o=[D(null!==(t=null==n?void 0:n.offsetHeight)&&void 0!==t?t:10),P(),F()];n&&o.push(w({element:n})),kt(e,i,{placement:this.state._align,middleware:o}).then((({x:t,y:e,middlewareData:o,placement:r})=>{var s,l;Object.assign(i.style,{left:`${t}px`,top:`${e}px`}),n&&((null===(s=o.arrow)||void 0===s?void 0:s.x)?Object.assign(n.style,{left:`${o.arrow.x}px`,top:"bottom"===r?-n.offsetHeight/2+"px":"",bottom:"top"===r?-n.offsetHeight/2+"px":""}):(null===(l=o.arrow)||void 0===l?void 0:l.y)&&Object.assign(n.style,{left:"right"===r?-n.offsetWidth/2+"px":"",right:"left"===r?-n.offsetWidth/2+"px":"",top:`${o.arrow.y}px`}))}))}}},this.showTooltip=()=>{this.tooltipElement&&(this.tooltipElement.style.setProperty("display","block"),i().body.addEventListener("keyup",this.hideTooltipByEscape),this.alignTooltip(),this.tooltipElement.style.setProperty("visibility","visible"),document.addEventListener("scroll",this.alignTooltip))},this.hideTooltip=()=>{this.tooltipElement&&(this.tooltipElement.style.setProperty("display","none"),this.tooltipElement.style.setProperty("visibility","hidden"),document.removeEventListener("scroll",this.alignTooltip))},this.hideTooltipByEscape=t=>{"Escape"===t.key&&(i().body.removeEventListener("keyup",this.hideTooltipByEscape),this.hideTooltip())},this.addListeners=t=>{t.addEventListener("mouseover",this.incrementOverFocusCount),t.addEventListener("focus",this.incrementOverFocusCount),t.addEventListener("mouseout",this.decrementOverFocusCount),t.addEventListener("blur",this.decrementOverFocusCount)},this.removeListeners=t=>{t.removeEventListener("mouseover",this.incrementOverFocusCount),t.removeEventListener("focus",this.incrementOverFocusCount),t.removeEventListener("mouseout",this.decrementOverFocusCount),t.removeEventListener("blur",this.decrementOverFocusCount)},this.resyncListeners=t=>{this.removeListeners(t),this.addListeners(t)},this.catchHostElement=t=>{t&&(this.previousSibling=t.previousElementSibling,this.previousSibling&&this.resyncListeners(this.previousSibling))},this.catchTooltipElement=t=>{this.tooltipElement=t,this.tooltipElement&&this.resyncListeners(this.tooltipElement)},this.catchArrowElement=t=>{this.arrowElement=t},this.overFocusCount=0,this.incrementOverFocusCount=()=>{this.overFocusCount++,this.showOrHideTooltip()},this.decrementOverFocusCount=()=>{this.overFocusCount--,this.showOrHideTooltip()},this.showOrHideTooltip=()=>{clearTimeout(this.overFocusTimeout),this.overFocusTimeout=setTimeout((()=>{clearTimeout(this.overFocusTimeout),this.overFocusCount>0?this.showTooltip():this.hideTooltip()}),250)},this._align="top",this._id=void 0,this._label=void 0,this.state={_align:"top",_id:s(),_label:""}}render(){return c((()=>{this.alignTooltip(),c(this.alignTooltip,750)}),250),n(o,{ref:this.catchHostElement},""!==this.state._label&&n("div",{id:"floating",ref:this.catchTooltipElement},n("div",{id:"arrow",ref:this.catchArrowElement}),n("kol-badge",{id:this.state._id,_color:{backgroundColor:"#333",color:"#ddd"},_label:this.state._label})))}validateAlign(t){e(this,"_align",t)}validateId(t){r(this,"_id",t)}validateLabel(t){r(this,"_label",t)}componentWillLoad(){this.validateAlign(this._align),this.validateId(this._id),this.validateLabel(this._label)}disconnectedCallback(){this.previousSibling&&this.removeListeners(this.previousSibling),this.tooltipElement&&this.removeListeners(this.tooltipElement)}static get watchers(){return{_align:["validateAlign"],_id:["validateId"],_label:["validateLabel"]}}};jt.style={default:At};export{jt as kol_tooltip};