npm - @public-ui/components - Versions diffs - 1.6.0-rc.0 → 1.6.0-rc.2 - Mend

@public-ui/components 1.6.0-rc.0 → 1.6.0-rc.2

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

Files changed (598) hide show

package/dist/esm/kol-textarea.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"kol-textarea.entry.js","mappings":";;;;;;;;;;;;;;;AAeO,MAAM,oBAAoB,GAAG,CAAC,SAAoC,EAAE,KAAe;EACzF,YAAY,CAAC,SAAS,EAAE,eAAe,EAAE,KAAK,CAAC,CAAC;AACjD,CAAC;;ACFM,MAAM,kBAAkB,GAAG,CAAC,SAAoC,EAAE,KAAe;EACvF,YAAY,CAAC,SAAS,EAAE,aAAa,EAAE,KAAK,CAAC,CAAC;AAC/C,CAAC;;MCZY,kBAAmB,SAAQ,eAAe;EAGtD,YAAmB,SAA4C,EAAE,IAAY,EAAE,IAAkB;IAChG,KAAK,CAAC,SAAS,EAAE,IAAI,EAAE,IAAI,CAAC,CAAC;IAItB,yBAAoB,GAAG;MAC9B,IAAI,OAAO,IAAI,CAAC,SAAS,CAAC,MAAM,KAAK,QAAQ,IAAI,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC,EAAE;QAClF,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,cAAc,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,MAAM,CAAC;OACnE;KACD,CAAC;IAPD,IAAI,CAAC,SAAS,GAAG,SAAS,CAAC;GAC3B;EAQM,kBAAkB,CAAC,KAAe;IACxC,YAAY,CAAC,IAAI,CAAC,SAAS,EAAE,aAAa,EAAE,KAAK,EAAE;MAClD,KAAK,EAAE;QACN,UAAU,EAAE,IAAI,CAAC,oBAAoB;OACrC;KACD,CAAC,CAAC;GACH;EAEM,iBAAiB,CAAC,KAAc;IACtC,WAAW,CAAC,IAAI,CAAC,SAAS,EAAE,YAAY,EAAE,KAAK,EAAE;MAChD,KAAK,EAAE;QACN,UAAU,EAAE,IAAI,CAAC,oBAAoB;OACrC;MACD,GAAG,EAAE,CAAC;KACN,CAAC,CAAC;GACH;EAEM,mBAAmB,CAAC,KAAc;IACxC,WAAW,CAAC,IAAI,CAAC,SAAS,EAAE,cAAc,EAAE,KAAK,CAAC,CAAC;GACnD;EAEM,gBAAgB,CAAC,KAAe;IACtC,YAAY,CAAC,IAAI,CAAC,SAAS,EAAE,WAAW,EAAE,KAAK,CAAC,CAAC;GACjD;EAEM,cAAc,CAAC,KAAiB;IACtC,cAAc,CACb,IAAI,CAAC,SAAS,EACd,SAAS,EACT,CAAC,KAAK,KAAK,OAAO,KAAK,KAAK,QAAQ,KAAK,KAAK,KAAK,MAAM,IAAI,KAAK,KAAK,YAAY,IAAI,KAAK,KAAK,MAAM,IAAI,KAAK,KAAK,UAAU,CAAC,EAChI,IAAI,GAAG,CAAC,2CAA2C,CAAC,EACpD,KAAK,CACL,CAAC;GACF;EAEM,gBAAgB,CAAC,KAAe;IACtC,YAAY,CAAC,IAAI,CAAC,SAAS,EAAE,WAAW,EAAE,KAAK,CAAC,CAAC;GACjD;EAEM,YAAY,CAAC,KAAc;IACjC,WAAW,CAAC,IAAI,CAAC,SAAS,EAAE,OAAO,EAAE,KAAK,CAAC,CAAC;GAC5C;EAEM,aAAa,CAAC,KAAc;IAClC,WAAW,CAAC,IAAI,CAAC,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE;MAC5C,KAAK,EAAE;QACN,UAAU,EAAE,IAAI,CAAC,oBAAoB;OACrC;KACD,CAAC,CAAC;IACH,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,SAAS,CAAC,MAAgB,CAAC,CAAC;GAC7D;EAEM,iBAAiB;IACvB,KAAK,CAAC,iBAAiB,EAAE,CAAC;IAC1B,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACpD,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC;IAClD,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,CAAC;IACtD,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC;IAChD,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;IAC5C,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC;IAChD,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;IACxC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC;GAC1C;;;ACjFF,MAAM,eAAe,GAAG,01DAA01D;;ACel3D,MAAM,sBAAsB,GAAG,CAAC,EAAuB;EACtD,EAAE,CAAC,KAAK,CAAC,QAAQ,GAAG,QAAQ,CAAC;EAC7B,MAAM,WAAW,GAAG,EAAE,CAAC,IAAI,CAAC;EAC5B,MAAM,SAAS,GAAG,EAAE,CAAC,YAAY,GAAG,WAAW,CAAC;EAChD,EAAE,CAAC,IAAI,GAAG,CAAC,CAAC;EACZ,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,YAAY,GAAG,SAAS,CAAC,CAAC;EACzD,EAAE,CAAC,IAAI,GAAG,WAAW,CAAC;EACtB,OAAO,QAAQ,CAAC;AACjB,CAAC,CAAC;MAYW,WAAW;EAShB,MAAM;IACZ,MAAM,EAAE,eAAe,EAAE,GAAG,eAAe,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IACxD,MAAM,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,KAAK,EAAE,CAAC;IAChD,MAAM,eAAe,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,KAAK,GAAG,CAAC;IAClD,QACC,EAAC,IAAI,IACJ,KAAK,EAAE;QACN,WAAW,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS;OACjC,IAED,iBACC,KAAK,EAAC,UAAU,EAChB,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,EACzB,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,EAC/B,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,EACzB,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,EACjC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EACvB,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,GAAG,EACnB,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,EAC/B,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,EAC/B,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,EAC7B,OAAO,EAAE,gBAAM,OAAA,MAAA,IAAI,CAAC,GAAG,0CAAE,KAAK,EAAE,CAAA,EAAA,IAEhC,YAAM,IAAI,EAAC,OAAO,IAAE,cAAc,GAAG,YAAM,IAAI,EAAC,QAAQ,GAAQ,GAAG,eAAe,GAAG,eAAa,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAQ,EAC9H,WAAK,IAAI,EAAC,OAAO,IAChB,8BACC,GAAG,EAAE,IAAI,CAAC,QAAQ,EAClB,KAAK,EAAC,EAAE,EACR,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,sBACd,eAAe,CAAC,MAAM,GAAG,CAAC,GAAG,eAAe,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,SAAS,qBACnE,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,QAAQ,EAC1C,cAAc,EAAC,KAAK,EACpB,WAAW,EAAC,KAAK,EACjB,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,EAC9B,EAAE,EAAE,IAAI,CAAC,KAAK,CAAC,GAAG,EAClB,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,EAChC,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EACtB,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,EAC9B,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,EAC9B,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EACtB,WAAW,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,EACpC,UAAU,EAAC,OAAO,IACd,IAAI,CAAC,UAAU,CAAC,QAAQ,IAC5B,OAAO,EAAE,IAAI,CAAC,QAAQ,EACtB,KAAK,EAAE;QACN,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO;OAC1B,EACD,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,IACb,EACX,IAAI,CAAC,KAAK,CAAC,WAAW,KACtB,2BAAkB,MAAM,eAAW,QAAQ,IACzC,IAAI,CAAC,KAAK,CAAC,cAAc,EACzB,IAAI,CAAC,KAAK,CAAC,UAAU,KACrB,EAAC,QAAQ,QACR,0BAAkB,SAAS,CAAC,QAAQ,CAAC,EAAE,IAAI,EAAC,KAAK,QAE1C,EACN,IAAI,CAAC,KAAK,CAAC,UAAU,CACZ,CACX,EAAE,GAAG,EACN,gBAAO,SAAS,CAAC,gBAAgB,CAAC,CAAQ,CACpC,CACP,CACI,CACK,CACN,EACN;GACF;EA+HD;;IAvMiB,aAAQ,GAAG,CAAC,GAAyB;MACrD,IAAI,CAAC,GAAG,GAAG,GAAG,CAAC;MACf,cAAc,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC;KACpC,CAAC;IA2Te,aAAQ,GAAG,CAAC,KAAY;MACxC,IAAI,IAAI,CAAC,GAAG,YAAY,mBAAmB,EAAE;QAC5C,QAAQ,CAAC,IAAI,EAAE,gBAAgB,EAAE,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;QACxD,IAAI,IAAI,CAAC,KAAK,CAAC,aAAa,EAAE;UAC7B,IAAI,CAAC,KAAK,GAAG,sBAAsB,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;SAC9C;OACD;MACD,IAAI,OAAO,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,QAAQ,KAAK,UAAU,EAAE;QAC5D,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;OACzC;KACD,CAAC;;yBApPwD,KAAK;kBAKG,IAAI;;;;;iBAyBtC,EAAE;;;;;;;;mBAiDG,UAAU;;;;oBAoBqB,KAAK;;iBAOzC;MAC/B,aAAa,EAAE,KAAK;MACpB,cAAc,EAAE,CAAC;MACjB,SAAS,EAAE,KAAK;MAChB,GAAG,EAAE,KAAK,EAAE;MACZ,MAAM,EAAE,GAAG;MACX,OAAO,EAAE,UAAU;KACnB;IAGA,IAAI,CAAC,UAAU,GAAG,IAAI,kBAAkB,CAAC,IAAI,EAAE,UAAU,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC;GACtE;EAGM,iBAAiB,CAAC,KAAc;IACtC,IAAI,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,CAAC,CAAC;GACzC;EAGM,oBAAoB,CAAC,KAAe;IAC1C,oBAAoB,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;GAClC;EAGM,aAAa,CAAC,KAAe;IACnC,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;GACrC;EAGM,gBAAgB,CAAC,KAAe;IACtC,IAAI,CAAC,UAAU,CAAC,gBAAgB,CAAC,KAAK,CAAC,CAAC;GACxC;EAGM,aAAa,CAAC,KAAc;IAClC,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;GACrC;EAGM,kBAAkB,CAAC,KAAe;IACxC,kBAAkB,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;GAChC;EAGM,iBAAiB,CAAC,KAAe;IACvC,IAAI,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,CAAC,CAAC;GACzC;EAGM,YAAY,CAAC,KAAc;IACjC,IAAI,CAAC,UAAU,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC;GACpC;EAGM,UAAU,CAAC,KAAc;IAC/B,IAAI,CAAC,UAAU,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC;GAClC;EAGM,aAAa,CAAC,KAAc;IAClC,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;GACrC;EAGM,iBAAiB,CAAC,KAAc;IACtC,IAAI,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,CAAC,CAAC;GACzC;EAGM,YAAY,CAAC,KAAc;IACjC,IAAI,CAAC,UAAU,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC;GACpC;EAGM,UAAU,CAAC,KAA0B;IAC3C,IAAI,CAAC,UAAU,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC;GAClC;EAGM,mBAAmB,CAAC,KAAc;IACxC,IAAI,CAAC,UAAU,CAAC,mBAAmB,CAAC,KAAK,CAAC,CAAC;GAC3C;EAGM,gBAAgB,CAAC,KAAe;IACtC,IAAI,CAAC,UAAU,CAAC,gBAAgB,CAAC,KAAK,CAAC,CAAC;GACxC;EAGM,cAAc,CAAC,KAAiB;IACtC,IAAI,CAAC,UAAU,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;GACtC;EAGM,gBAAgB,CAAC,KAAe;IACtC,IAAI,CAAC,UAAU,CAAC,gBAAgB,CAAC,KAAK,CAAC,CAAC;GACxC;EAGM,YAAY,CAAC,KAAc;IACjC,IAAI,CAAC,UAAU,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC;GACpC;EAGM,gBAAgB,CAAC,KAAc;IACrC,IAAI,CAAC,UAAU,CAAC,gBAAgB,CAAC,KAAK,CAAC,CAAC;GACxC;EAGM,eAAe,CAAC,KAAe;IACrC,IAAI,CAAC,UAAU,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC;GACvC;EAGM,aAAa,CAAC,KAAc;IAClC,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;GACrC;EAEM,iBAAiB;IACvB,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM,KAAK,IAAI,CAAC;IACnC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,KAAK,IAAI,CAAC;IACvC,IAAI,CAAC,UAAU,CAAC,iBAAiB,EAAE,CAAC;IACpC,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;IAE9C,IAAI,CAAC,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC;IAC3C,IAAI,CAAC,UAAU,CAAC,sBAAsB,CAAC,CAAC,CAAC,MAAM,IAAI,CAAC,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;GAC5E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/types/props/adjust-height.ts","./src/types/props/has-counter.ts","./src/components/textarea/controller.ts","./src/components/textarea/style.css?tag=kol-textarea&mode=default&encapsulation=shadow","./src/components/textarea/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { watchBoolean } from '../../utils/prop.validators';\n\n/* types /\n/* de\n * Passt die Höhe des Eingabefeldes automatisch an den Füllstand an.\n /\n/* en\n * Adjusts the height of the element to its content.\n /\nexport type PropAdjustHeight = {\n\tadjustHeight: boolean;\n};\n\n/ validator /\nexport const validateAdjustHeight = (component: Generic.Element.Component, value?: boolean): void => {\n\twatchBoolean(component, '_adjustHeight', value);\n};\n","import { Generic } from '@a11y-ui/core';\nimport { watchBoolean } from '../../utils/prop.validators';\n\n/ types /\n/* de\n * Zeigt die Zeichenanzahlanzeige am unteren Rand des EIngabefeldes.\n /\n/* en\n * Shows the the character count on the lower border of the input.\n /\nexport type PropHasCounter = {\n\thasCounter: boolean;\n};\n\n/ validator /\nexport const validateHasCounter = (component: Generic.Element.Component, value?: boolean): void => {\n\twatchBoolean(component, '_hasCounter', value);\n};\n","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\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\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\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 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\tpublic validateRequired(value?: boolean): void {\n\t\twatchBoolean(this.component, '_required', value);\n\t}\n\n\tpublic validateRows(value?: number): void {\n\t\twatchNumber(this.component, '_rows', value);\n\t}\n\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\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","@import url(../input-line.css);\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 { validateAdjustHeight, validateHasCounter } from '../../types/props';\nimport { nonce } from '../../utils/dev.utils';\nimport { setState } from '../../utils/prop.validators';\nimport { propagateFocus } 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/\n @slot - Die Beschriftung des Eingabefeldes.\n /\n@Component({\n\ttag: 'kol-textarea',\n\tstyleUrls: {\n\t\tdefault: './style.css',\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\tpropagateFocus(this.host, this.ref);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { ariaDescribedBy } = getRenderStates(this.state);\n\t\tconst showExpertSlot = this.state._label === ''; // _label=\"\" or _label\n\t\tconst showDefaultSlot = this.state._label === '…'; // deprecated: default slot will be removed in v2.0.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=\"textarea\"\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\tonClick={() => this.ref?.focus()}\n\t\t\t\t>\n\t\t\t\t\t<span slot=\"label\">{showExpertSlot ? <slot name=\"expert\"></slot> : showDefaultSlot ? <slot></slot> : this.state._label}</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\ttitle=\"\"\n\t\t\t\t\t\t\taccessKey={this.state._accessKey}\n\t\t\t\t\t\t\taria-describedby={ariaDescribedBy.length > 0 ? ariaDescribedBy.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\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{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 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 Aktiviert den Zeichenanzahlzähler am unteren Rand des Eingabefeldes.\n\t /\n\t@Prop({ reflect: true }) public _hasCounter?: boolean;\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 Das Label dient der Beschriftung unterschiedlicher Elemente.\n\t * - Button -> label text\n\t * - Heading -> headline text\n\t * - Input, Select und Textarea -> label text\n\t * - Summary -> summary text\n\t * - Table -> caption text\n\t * - etc.\n\t \n\t Das Label ist häufig ein Pflichtattribut und kann leer gesetzt werden,\n\t * wenn man das Label mittels dem Expert-Slot überschreiben will.\n\t /\n\t@Prop() public _label!: string;\n\n\t/\n\t Setzt die maximale Zeichenanzahl.\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 Setzt das Eingabefeld in den schreibgeschützten Modus.\n\t /\n\t@Prop({ reflect: true }) public _readOnly?: boolean;\n\n\t/\n\t Gibt an, ob die Größe des Eingabefeldes von Nutzer:innen 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 Macht das Eingabeelement zu einem Pflichtfeld.\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@State() public state: States = {\n\t\t_adjustHeight: false,\n\t\t_currentLength: 0,\n\t\t_hasValue: false,\n\t\t_id: nonce(), // ⚠ required\n\t\t_label: '…', // ⚠ required\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@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t@Watch('_adjustHeight')\n\tpublic validateAdjustHeight(value?: boolean): void {\n\t\tvalidateAdjustHeight(this, 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('_hasCounter')\n\tpublic validateHasCounter(value?: boolean): void {\n\t\tvalidateHasCounter(this, 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('_label')\n\tpublic validateLabel(value?: string): void {\n\t\tthis.controller.validateLabel(value);\n\t}\n\n\t@Watch('_maxLength')\n\tpublic validateMaxLength(value?: number): void {\n\t\tthis.controller.validateMaxLength(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('_resize')\n\tpublic validateResize(value?: CSSResize): void {\n\t\tthis.controller.validateResize(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('_rows')\n\tpublic validateRows(value?: number): void {\n\t\tthis.controller.validateRows(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?: string): 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();\n\t\tthis.validateAdjustHeight(this._adjustHeight);\n\n\t\tthis.state._hasValue = !!this.state._value;\n\t\tthis.controller.addValueChangeListener((v) => (this.state._hasValue = !!v));\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"],"version":3}
1	+ {"file":"kol-textarea.entry.js","mappings":"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","names":[],"sources":["./src/types/props/adjust-height.ts","./src/types/props/has-counter.ts","./src/components/textarea/controller.ts","./src/components/textarea/style.css?tag=kol-textarea&mode=default&encapsulation=shadow","./src/components/textarea/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { watchBoolean } from '../../utils/prop.validators';\n\n/* types /\n/* de\n * Passt die Höhe des Eingabefeldes automatisch an den Füllstand an.\n /\n/* en\n * Adjusts the height of the element to its content.\n /\nexport type PropAdjustHeight = {\n\tadjustHeight: boolean;\n};\n\n/ validator /\nexport const validateAdjustHeight = (component: Generic.Element.Component, value?: boolean): void => {\n\twatchBoolean(component, '_adjustHeight', value);\n};\n","import { Generic } from '@a11y-ui/core';\nimport { watchBoolean } from '../../utils/prop.validators';\n\n/ types /\n/* de\n * Zeigt die Zeichenanzahlanzeige am unteren Rand des EIngabefeldes.\n /\n/* en\n * Shows the the character count on the lower border of the input.\n /\nexport type PropHasCounter = {\n\thasCounter: boolean;\n};\n\n/ validator /\nexport const validateHasCounter = (component: Generic.Element.Component, value?: boolean): void => {\n\twatchBoolean(component, '_hasCounter', value);\n};\n","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\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\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\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 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\tpublic validateRequired(value?: boolean): void {\n\t\twatchBoolean(this.component, '_required', value);\n\t}\n\n\tpublic validateRows(value?: number): void {\n\t\twatchNumber(this.component, '_rows', value);\n\t}\n\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\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","@import url(../input-line.css);\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 { validateAdjustHeight, validateHasCounter } from '../../types/props';\nimport { nonce } from '../../utils/dev.utils';\nimport { setState } from '../../utils/prop.validators';\nimport { propagateFocus } 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/\n @slot - Die Beschriftung des Eingabefeldes.\n /\n@Component({\n\ttag: 'kol-textarea',\n\tstyleUrls: {\n\t\tdefault: './style.css',\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\tpropagateFocus(this.host, this.ref);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { ariaDescribedBy } = getRenderStates(this.state);\n\t\tconst showExpertSlot = this.state._label === ''; // _label=\"\" or _label\n\t\tconst showDefaultSlot = this.state._label === '…'; // deprecated: default slot will be removed in v2.0.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=\"textarea\"\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\tonClick={() => this.ref?.focus()}\n\t\t\t\t>\n\t\t\t\t\t<span slot=\"label\">{showExpertSlot ? <slot name=\"expert\"></slot> : showDefaultSlot ? <slot></slot> : this.state._label}</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\ttitle=\"\"\n\t\t\t\t\t\t\taccessKey={this.state._accessKey}\n\t\t\t\t\t\t\taria-describedby={ariaDescribedBy.length > 0 ? ariaDescribedBy.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\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{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 interaktive Element der Komponente 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 der Screenreader die Meldung aktiv vorlesen soll.\n\t /\n\t@Prop({ mutable: true, reflect: true }) public _alert?: boolean = true;\n\n\t/\n\t Deaktiviert das interaktive Element in der Komponente und erlaubt keine Interaktion mehr damit.\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 Aktiviert den Zeichenanzahlzähler am unteren Rand des Eingabefeldes.\n\t /\n\t@Prop({ reflect: true }) public _hasCounter?: boolean;\n\n\t/\n\t Blendet die Beschriftung (Label) aus und zeigt sie stattdessen mittels eines Tooltips an.\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 interne ID des primären Elements in der Komponente an.\n\t /\n\t@Prop() public _id?: string;\n\n\t/\n\t Setzt die sichtbare oder semantische Beschriftung der Komponente (z.B. Aria-Label, Label, Headline, Caption, Summary usw.).\n\t /\n\t@Prop() public _label!: string;\n\n\t/\n\t Gibt an, wie viele Zeichen maximal eingegeben werden können.\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 Setzt das Eingabefeld in den schreibgeschützten Modus.\n\t /\n\t@Prop({ reflect: true }) public _readOnly?: boolean;\n\n\t/\n\t Gibt an, ob die Größe des Eingabefeldes von Nutzer:innen 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 Macht das Eingabeelement zu einem Pflichtfeld.\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 das primäre Element in der Komponente hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)\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@State() public state: States = {\n\t\t_adjustHeight: false,\n\t\t_currentLength: 0,\n\t\t_hasValue: false,\n\t\t_id: nonce(), // ⚠ required\n\t\t_label: '…', // ⚠ required\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@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t@Watch('_adjustHeight')\n\tpublic validateAdjustHeight(value?: boolean): void {\n\t\tvalidateAdjustHeight(this, 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('_hasCounter')\n\tpublic validateHasCounter(value?: boolean): void {\n\t\tvalidateHasCounter(this, 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('_label')\n\tpublic validateLabel(value?: string): void {\n\t\tthis.controller.validateLabel(value);\n\t}\n\n\t@Watch('_maxLength')\n\tpublic validateMaxLength(value?: number): void {\n\t\tthis.controller.validateMaxLength(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('_resize')\n\tpublic validateResize(value?: CSSResize): void {\n\t\tthis.controller.validateResize(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('_rows')\n\tpublic validateRows(value?: number): void {\n\t\tthis.controller.validateRows(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?: string): 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();\n\t\tthis.validateAdjustHeight(this._adjustHeight);\n\n\t\tthis.state._hasValue = !!this.state._value;\n\t\tthis.controller.addValueChangeListener((v) => (this.state._hasValue = !!v));\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"],"version":3}

package/dist/esm/kol-toast.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{r as registerInstance,h,H as Host}from"./index-34c3d6f8.js";import{b as watchBoolean,w as watchString,s as setState,e as watchNumber,a as watchValidator}from"./prop.validators-2c20cdf8.js";import{w as watchHeadingLevel}from"./validation-9c8695ca.js";import{f as featureHint}from"./a11y.tipps-2e27f8e6.js";import{v as validateShow}from"./show-5a4bfd71.js";import"./dev.utils-157f0499.js";import"./reuse-3a02afb9.js";import"./index-f4596895.js";const validateHasCloser=(t,e)=>{watchBoolean(t,"_hasCloser",e)},defaultStyleCss=":host{--a11y-min-size:44px;font-size:inherit}*{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}:host{display:block}:host>div{background-color:#fff;height:0;left:0;position:fixed;top:0;width:100%;z-index:200}:host>div>kol-alert{display:block;margin:auto;max-width:750px}:host>div>kol-button-wc{display:block;margin:auto;position:relative;top:0;width:1em}",KolToast=class{constructor(t){registerInstance(this,t),this.handleShowAndDuration=()=>{!0===this.state._show&&"number"==typeof this.state._showDuration&&this.state._showDuration>=0&&(clearTimeout(this.durationTimeout),this.durationTimeout=setTimeout((()=>{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){watchBoolean(this,"_alert",t)}validateHasCloser(t){validateHasCloser(this,t)}validateHeading(t){watchString(this,"_heading",t)}validateLevel(t){watchHeadingLevel(this,t)}validateOn(t){if("object"==typeof t&&null!==t){featureHint("[KolToast] Prüfen, wie man auch einen EventCallback einzeln ändern kann.");const e={};"function"!=typeof t.onClose&&!0!==t.onClose||(e.onClose=t.onClose),setState(this,"_on",e)}}validateShow(t){validateShow(this,t,{hooks:{afterPatch:this.handleShowAndDuration}})}validateShowDuration(t){watchNumber(this,"_showDuration",t,{hooks:{afterPatch:this.handleShowAndDuration}})}validateType(t){watchValidator(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 h(Host,null,this.state._show&&h("div",null,h("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},h("slot",null))))}static get watchers(){return{_alert:["validateAlert"],_hasCloser:["validateHasCloser"],_heading:["validateHeading"],_level:["validateLevel"],_on:["validateOn"],_show:["validateShow"],_showDuration:["validateShowDuration"],_type:["validateType"]}}};KolToast.style={default:defaultStyleCss};export{KolToast as kol_toast};
+import{r as registerInstance,h,H as Host}from"./index-34c3d6f8.js";import{b as watchBoolean,w as watchString,s as setState,e as watchNumber,a as watchValidator}from"./prop.validators-f81af56e.js";import{w as watchHeadingLevel}from"./validation-2cc1bb89.js";import{f as featureHint}from"./a11y.tipps-2e27f8e6.js";import{v as validateShow}from"./show-a9e2d4c4.js";import"./dev.utils-157f0499.js";import"./reuse-3a02afb9.js";import"./index-ff788b4b.js";const validateHasCloser=(t,e)=>{watchBoolean(t,"_hasCloser",e)},defaultStyleCss=":host{--a11y-min-size:44px;font-size:inherit}*{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}:host{display:block}:host>div{background-color:#fff;height:0;left:0;position:fixed;top:0;width:100%;z-index:200}:host>div>kol-alert{display:block;margin:auto;max-width:750px}:host>div>kol-button-wc{display:block;margin:auto;position:relative;top:0;width:1em}",KolToast=class{constructor(t){registerInstance(this,t),this.handleShowAndDuration=()=>{!0===this.state._show&&"number"==typeof this.state._showDuration&&this.state._showDuration>=0&&(clearTimeout(this.durationTimeout),this.durationTimeout=setTimeout((()=>{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){watchBoolean(this,"_alert",t)}validateHasCloser(t){validateHasCloser(this,t)}validateHeading(t){watchString(this,"_heading",t)}validateLevel(t){watchHeadingLevel(this,t)}validateOn(t){if("object"==typeof t&&null!==t){featureHint("[KolToast] Prüfen, wie man auch einen EventCallback einzeln ändern kann.");const e={};"function"!=typeof t.onClose&&!0!==t.onClose||(e.onClose=t.onClose),setState(this,"_on",e)}}validateShow(t){validateShow(this,t,{hooks:{afterPatch:this.handleShowAndDuration}})}validateShowDuration(t){watchNumber(this,"_showDuration",t,{hooks:{afterPatch:this.handleShowAndDuration}})}validateType(t){watchValidator(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 h(Host,null,this.state._show&&h("div",null,h("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},h("slot",null))))}static get watchers(){return{_alert:["validateAlert"],_hasCloser:["validateHasCloser"],_heading:["validateHeading"],_level:["validateLevel"],_on:["validateOn"],_show:["validateShow"],_showDuration:["validateShowDuration"],_type:["validateType"]}}};KolToast.style={default:defaultStyleCss};export{KolToast as kol_toast};

package/dist/esm/kol-toast.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"kol-toast.entry.js","mappings":"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","names":[],"sources":["./src/types/props/has-closer.ts","./src/components/toast/style.css?tag=kol-toast&mode=default&encapsulation=shadow","./src/components/toast/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { watchBoolean } from '../../utils/prop.validators';\n\n/* types /\n/* de\n * Markiert dieses Element als geöffnet, oder dass das verknüpfte Element (aria-controls/aria-owns) geöffnet ist.\n /\n/* en\n * Marks this element as open/expanded, or that the connected element (aria-controls/aria-owns) is open/expanded.\n /\nexport type PropHasCloser = {\n\thasCloser: boolean;\n};\n\n/ validator /\nexport const validateHasCloser = (component: Generic.Element.Component, value?: boolean): void => {\n\twatchBoolean(component, '_hasCloser', value);\n};\n","@import url(../style.css);\n@import url(../host-display-block.css);\n:host > div {\n\tbackground-color: #fff;\n\t/ needed for overlay situations /\n\theight: 0;\n\tleft: 0;\n\tposition: fixed;\n\ttop: 0;\n\twidth: 100%;\n\tz-index: 200;\n}\n:host > div > kol-alert {\n\tdisplay: block;\n\tmargin: auto;\n\tmax-width: 750px;\n}\n:host > div > kol-button-wc {\n\tdisplay: block;\n\tmargin: auto;\n\tposition: relative;\n\ttop: 0;\n\twidth: 1em;\n}\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { AlertType } from '../alert/types';\nimport { HeadingLevel } from '../../types/heading-level';\nimport { setState, watchBoolean, watchNumber, watchString, watchValidator } from '../../utils/prop.validators';\nimport { watchHeadingLevel } from '../heading/validation';\nimport { KoliBriToastEventCallbacks } from '../../types/toast';\nimport { featureHint } from '../../utils/a11y.tipps';\nimport { PropHasCloser, PropShow, validateHasCloser, validateShow } from '../../types/props';\n\ntype RequiredProps = unknown;\ntype OptionalProps = {\n\talert: boolean;\n\theading: string;\n\tlevel: HeadingLevel;\n\ton: KoliBriToastEventCallbacks;\n\tshowDuration: number;\n\ttype: AlertType;\n} & PropHasCloser &\n\tPropShow;\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 - Der Inhalt der Meldung.\n /\n@Component({\n\ttag: 'kol-toast',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolToast implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\t/\n\t Gibt an, ob der Screenreader die Meldung vorlesen soll.\n\t /\n\t@Prop({ reflect: true }) public _alert?: boolean = true;\n\n\t/\n\t Aktiviert das Schließen-Icon.\n\t /\n\t@Prop({ reflect: true }) public _hasCloser?: boolean = false;\n\n\t/\n\t Gibt den Titel der Meldung an.\n\t /\n\t@Prop() public _heading?: string = '';\n\n\t/\n\t Gibt an, welchen H-Level von 1 bis 6 die Überschrift hat.\n\t /\n\t@Prop() public _level?: HeadingLevel = 1;\n\n\t/\n\t Gibt die EventCallback-Function für das Schließen des Toasts an.\n\t /\n\t@Prop() public _on?: KoliBriToastEventCallbacks;\n\n\t/\n\t Gibt an, ob der Toast eingeblendet wird.\n\t /\n\t@Prop({ mutable: true, reflect: true }) public _show?: boolean = true;\n\n\t/\n\t Gibt an, wie viele Millisekunden der Toast eingeblendet werden soll.\n\t /\n\t@Prop() public _showDuration?: number = 10000;\n\n\t/\n\t Gibt an, ob es sich um eine Erfolgs-, Info-, Warnung- oder Fehlermeldung handelt.\n\t */\n\t@Prop() public _type?: AlertType = 'default';\n\n\t@State() public state: States = {\n\t\t_alert: true,\n\t\t_level: 1,\n\t\t_show: true,\n\t};\n\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\twatchBoolean(this, '_alert', value);\n\t}\n\n\t@Watch('_hasCloser')\n\tpublic validateHasCloser(value?: boolean): void {\n\t\tvalidateHasCloser(this, value);\n\t}\n\n\t@Watch('_heading')\n\tpublic validateHeading(value?: string): void {\n\t\twatchString(this, '_heading', value);\n\t}\n\n\t@Watch('_level')\n\tpublic validateLevel(value?: HeadingLevel): void {\n\t\twatchHeadingLevel(this, value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: KoliBriToastEventCallbacks): void {\n\t\tif (typeof value === 'object' && value !== null) {\n\t\t\tfeatureHint('[KolToast] Prüfen, wie man auch einen EventCallback einzeln ändern kann.');\n\t\t\tconst callbacks: KoliBriToastEventCallbacks = {};\n\t\t\tif (typeof value.onClose === 'function' \|\| value.onClose === true) {\n\t\t\t\tcallbacks.onClose = value.onClose;\n\t\t\t}\n\t\t\tsetState<KoliBriToastEventCallbacks>(this, '_on', callbacks);\n\t\t}\n\t}\n\n\t@Watch('_show')\n\tpublic validateShow(value?: boolean): void {\n\t\tvalidateShow(this, value, { hooks: { afterPatch: this.handleShowAndDuration } });\n\t}\n\n\t@Watch('_showDuration')\n\tpublic validateShowDuration(value?: number): void {\n\t\twatchNumber(this, '_showDuration', value, {\n\t\t\thooks: {\n\t\t\t\tafterPatch: this.handleShowAndDuration,\n\t\t\t},\n\t\t});\n\t}\n\n\t@Watch('_type')\n\tpublic validateType(value?: AlertType): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_type',\n\t\t\t(value) => typeof value === 'string' && (value === 'default' \|\| value === 'error' \|\| value === 'info' \|\| value === 'success' \|\| value === 'warning'),\n\t\t\tnew Set('String {success, info, warning, error}'),\n\t\t\tvalue\n\t\t);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAlert(this._alert);\n\t\tthis.validateHasCloser(this._hasCloser);\n\t\tthis.validateHeading(this._heading);\n\t\tthis.validateLevel(this._level);\n\t\tthis.validateOn(this._on);\n\t\tthis.validateShow(this._show);\n\t\tthis.validateShowDuration(this._showDuration);\n\t\tthis.validateType(this._type);\n\t}\n\n\tprivate durationTimeout?: NodeJS.Timer;\n\n\tprivate readonly handleShowAndDuration = () => {\n\t\tif (this.state._show === true && typeof this.state._showDuration === 'number' && this.state._showDuration >= 0) {\n\t\t\tclearTimeout(this.durationTimeout as NodeJS.Timer);\n\t\t\tthis.durationTimeout = setTimeout(() => {\n\t\t\t\tthis.close();\n\t\t\t}, this.state._showDuration);\n\t\t}\n\t};\n\n\tprivate readonly close = () => {\n\t\tthis._show = false;\n\t\tthis.state = {\n\t\t\t...this.state,\n\t\t\t_show: false,\n\t\t};\n\n\t\tif (this._on?.onClose !== undefined) {\n\t\t\tthis._on.onClose(new Event('Close'));\n\t\t}\n\t};\n\n\tprivate readonly on = {\n\t\tonClose: this.close,\n\t};\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t{this.state._show && (\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<kol-alert\n\t\t\t\t\t\t\t_alert={this.state._alert}\n\t\t\t\t\t\t\t_heading={this.state._heading}\n\t\t\t\t\t\t\t_level={this.state._level}\n\t\t\t\t\t\t\t_hasCloser={this.state._hasCloser}\n\t\t\t\t\t\t\t_type={this.state._type}\n\t\t\t\t\t\t\t_variant=\"card\"\n\t\t\t\t\t\t\t// tabindex=\"0\"\n\t\t\t\t\t\t\t_on={this.on}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<slot />\n\t\t\t\t\t\t</kol-alert>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"version":3}
1	+ {"file":"kol-toast.entry.js","mappings":"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","names":[],"sources":["./src/types/props/has-closer.ts","./src/components/toast/style.css?tag=kol-toast&mode=default&encapsulation=shadow","./src/components/toast/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { watchBoolean } from '../../utils/prop.validators';\n\n/* types /\n/* de\n * Markiert dieses Element als geöffnet, oder dass das verknüpfte Element (aria-controls/aria-owns) geöffnet ist.\n /\n/* en\n * Marks this element as open/expanded, or that the connected element (aria-controls/aria-owns) is open/expanded.\n /\nexport type PropHasCloser = {\n\thasCloser: boolean;\n};\n\n/ validator /\nexport const validateHasCloser = (component: Generic.Element.Component, value?: boolean): void => {\n\twatchBoolean(component, '_hasCloser', value);\n};\n","@import url(../style.css);\n@import url(../host-display-block.css);\n:host > div {\n\tbackground-color: #fff;\n\t/ needed for overlay situations /\n\theight: 0;\n\tleft: 0;\n\tposition: fixed;\n\ttop: 0;\n\twidth: 100%;\n\tz-index: 200;\n}\n:host > div > kol-alert {\n\tdisplay: block;\n\tmargin: auto;\n\tmax-width: 750px;\n}\n:host > div > kol-button-wc {\n\tdisplay: block;\n\tmargin: auto;\n\tposition: relative;\n\ttop: 0;\n\twidth: 1em;\n}\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { AlertType } from '../alert/types';\nimport { HeadingLevel } from '../../types/heading-level';\nimport { setState, watchBoolean, watchNumber, watchString, watchValidator } from '../../utils/prop.validators';\nimport { watchHeadingLevel } from '../heading/validation';\nimport { KoliBriToastEventCallbacks } from '../../types/toast';\nimport { featureHint } from '../../utils/a11y.tipps';\nimport { PropHasCloser, PropShow, validateHasCloser, validateShow } from '../../types/props';\n\ntype RequiredProps = unknown;\ntype OptionalProps = {\n\talert: boolean;\n\theading: string;\n\tlevel: HeadingLevel;\n\ton: KoliBriToastEventCallbacks;\n\tshowDuration: number;\n\ttype: AlertType;\n} & PropHasCloser &\n\tPropShow;\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 - Der Inhalt der Meldung.\n /\n@Component({\n\ttag: 'kol-toast',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolToast implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\t/\n\t Gibt an, ob der Screenreader die Meldung aktiv vorlesen soll.\n\t /\n\t@Prop({ reflect: true }) public _alert?: boolean = true;\n\n\t/\n\t Gibt an, ob die Komponente einen Schließen-Schalter hat.\n\t /\n\t@Prop({ reflect: true }) public _hasCloser?: boolean = false;\n\n\t/\n\t Gibt die Beschriftung der Komponente an.\n\t /\n\t@Prop() public _heading?: string = '';\n\n\t/\n\t Gibt an, welchen H-Level von 1 bis 6 die Überschrift hat. Oder bei 0, ob es keine Überschrift ist und als fett gedruckter Text angezeigt werden soll.\n\t /\n\t@Prop() public _level?: HeadingLevel = 1;\n\n\t/\n\t Gibt die EventCallback-Function für das Schließen des Toasts an.\n\t /\n\t@Prop() public _on?: KoliBriToastEventCallbacks;\n\n\t/\n\t Gibt an, ob die Komponente entweder ein- oder ausgeblendet ist.\n\t /\n\t@Prop({ mutable: true, reflect: true }) public _show?: boolean = true;\n\n\t/\n\t Gibt an, wie viele Millisekunden der Toast eingeblendet werden soll.\n\t /\n\t@Prop() public _showDuration?: number = 10000;\n\n\t/\n\t Setzt den Typ der Komponente oder des interaktiven Elements in der Komponente an.\n\t */\n\t@Prop() public _type?: AlertType = 'default';\n\n\t@State() public state: States = {\n\t\t_alert: true,\n\t\t_level: 1,\n\t\t_show: true,\n\t};\n\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\twatchBoolean(this, '_alert', value);\n\t}\n\n\t@Watch('_hasCloser')\n\tpublic validateHasCloser(value?: boolean): void {\n\t\tvalidateHasCloser(this, value);\n\t}\n\n\t@Watch('_heading')\n\tpublic validateHeading(value?: string): void {\n\t\twatchString(this, '_heading', value);\n\t}\n\n\t@Watch('_level')\n\tpublic validateLevel(value?: HeadingLevel): void {\n\t\twatchHeadingLevel(this, value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: KoliBriToastEventCallbacks): void {\n\t\tif (typeof value === 'object' && value !== null) {\n\t\t\tfeatureHint('[KolToast] Prüfen, wie man auch einen EventCallback einzeln ändern kann.');\n\t\t\tconst callbacks: KoliBriToastEventCallbacks = {};\n\t\t\tif (typeof value.onClose === 'function' \|\| value.onClose === true) {\n\t\t\t\tcallbacks.onClose = value.onClose;\n\t\t\t}\n\t\t\tsetState<KoliBriToastEventCallbacks>(this, '_on', callbacks);\n\t\t}\n\t}\n\n\t@Watch('_show')\n\tpublic validateShow(value?: boolean): void {\n\t\tvalidateShow(this, value, { hooks: { afterPatch: this.handleShowAndDuration } });\n\t}\n\n\t@Watch('_showDuration')\n\tpublic validateShowDuration(value?: number): void {\n\t\twatchNumber(this, '_showDuration', value, {\n\t\t\thooks: {\n\t\t\t\tafterPatch: this.handleShowAndDuration,\n\t\t\t},\n\t\t});\n\t}\n\n\t@Watch('_type')\n\tpublic validateType(value?: AlertType): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_type',\n\t\t\t(value) => typeof value === 'string' && (value === 'default' \|\| value === 'error' \|\| value === 'info' \|\| value === 'success' \|\| value === 'warning'),\n\t\t\tnew Set('String {success, info, warning, error}'),\n\t\t\tvalue\n\t\t);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAlert(this._alert);\n\t\tthis.validateHasCloser(this._hasCloser);\n\t\tthis.validateHeading(this._heading);\n\t\tthis.validateLevel(this._level);\n\t\tthis.validateOn(this._on);\n\t\tthis.validateShow(this._show);\n\t\tthis.validateShowDuration(this._showDuration);\n\t\tthis.validateType(this._type);\n\t}\n\n\tprivate durationTimeout?: NodeJS.Timer;\n\n\tprivate readonly handleShowAndDuration = () => {\n\t\tif (this.state._show === true && typeof this.state._showDuration === 'number' && this.state._showDuration >= 0) {\n\t\t\tclearTimeout(this.durationTimeout as NodeJS.Timer);\n\t\t\tthis.durationTimeout = setTimeout(() => {\n\t\t\t\tthis.close();\n\t\t\t}, this.state._showDuration);\n\t\t}\n\t};\n\n\tprivate readonly close = () => {\n\t\tthis._show = false;\n\t\tthis.state = {\n\t\t\t...this.state,\n\t\t\t_show: false,\n\t\t};\n\n\t\tif (this._on?.onClose !== undefined) {\n\t\t\tthis._on.onClose(new Event('Close'));\n\t\t}\n\t};\n\n\tprivate readonly on = {\n\t\tonClose: this.close,\n\t};\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t{this.state._show && (\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<kol-alert\n\t\t\t\t\t\t\t_alert={this.state._alert}\n\t\t\t\t\t\t\t_heading={this.state._heading}\n\t\t\t\t\t\t\t_level={this.state._level}\n\t\t\t\t\t\t\t_hasCloser={this.state._hasCloser}\n\t\t\t\t\t\t\t_type={this.state._type}\n\t\t\t\t\t\t\t_variant=\"card\"\n\t\t\t\t\t\t\t// tabindex=\"0\"\n\t\t\t\t\t\t\t_on={this.on}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<slot />\n\t\t\t\t\t\t</kol-alert>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"version":3}

package/dist/esm/kol-tooltip.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{r as registerInstance,h,H as Host}from"./index-34c3d6f8.js";import{c as computePosition,o as offset,f as flip,s as shift,a as arrow}from"./floating-ui.dom.esm-74010e65.js";import{w as watchTooltipAlignment}from"./button-link-abc9999d.js";import{g as getDocument,n as nonce}from"./dev.utils-157f0499.js";import{w as watchString}from"./prop.validators-2c20cdf8.js";import{p as processEnv}from"./reuse-3a02afb9.js";import"./a11y.tipps-2e27f8e6.js";import"./index-f4596895.js";const VISIBLE_OVERLAYS=new Set;function showOverlay(t){VISIBLE_OVERLAYS.forEach((t=>{t.style.setProperty("z-index","999")})),VISIBLE_OVERLAYS.add(t),t.style.setProperty("z-index","1000")}function hideOverlay(t){if(VISIBLE_OVERLAYS.delete(t),VISIBLE_OVERLAYS.size>0){const t=Array.from(VISIBLE_OVERLAYS).pop();t&&t.style.setProperty("z-index","1000")}}const styleCss=":host{--a11y-min-size:44px;font-size:inherit}*{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}kol-tooltip #floating{animation-duration:0.5s;animation-iteration-count:1;animation-name:fadeInOpacity;animation-timing-function:ease-in;box-sizing:border-box;display:none;position:absolute;visibility:hidden}kol-tooltip #arrow{height:10px;position:absolute;transform:rotate(45deg);width:10px;z-index:999}kol-tooltip .area{background-color:#fff;color:#000}kol-tooltip kol-span-wc{position:relative;z-index:1000}@keyframes fadeInOpacity{0%{opacity:0}100%{opacity:1}}",KolTooltip=class{constructor(t){registerInstance(this,t),this.alignTooltip=t=>{var e;if("test"!==processEnv&&this.previousSibling&&this.tooltipElement){const i=this.previousSibling,o=this.tooltipElement,s=this.arrowElement,n=[offset(null!==(e=null==s?void 0:s.offsetHeight)&&void 0!==e?e:10),flip(),shift()];s&&n.push(arrow({element:s})),computePosition(i,o,{placement:this.state._align,middleware:n}).then((({x:e,y:i,middlewareData:n,placement:l})=>{var r,a;const h=o.style.left,p=o.style.top;Object.assign(o.style,{left:`${e}px`,top:`${i}px`}),s&&((null===(r=n.arrow)||void 0===r?void 0:r.x)?Object.assign(s.style,{left:`${n.arrow.x}px`,top:"bottom"===l?-s.offsetHeight/2+"px":"",bottom:"top"===l?-s.offsetHeight/2+"px":""}):(null===(a=n.arrow)||void 0===a?void 0:a.y)&&Object.assign(s.style,{left:"right"===l?-s.offsetWidth/2+"px":"",right:"left"===l?-s.offsetWidth/2+"px":"",top:`${n.arrow.y}px`})),h!==o.style.left||p!==o.style.top?this.alignTooltip(t):"function"==typeof t&&t()}))}},this.showTooltip=()=>{this.tooltipElement&&(showOverlay(this.tooltipElement),this.tooltipElement.style.setProperty("display","block"),getDocument().body.addEventListener("keyup",this.hideTooltipByEscape),this.alignTooltip((()=>{this.tooltipElement&&(this.tooltipElement.style.setProperty("visibility","visible"),document.addEventListener("scroll",this.showTooltip))})))},this.hideTooltip=()=>{this.tooltipElement&&(hideOverlay(this.tooltipElement),this.tooltipElement.style.setProperty("display","none"),this.tooltipElement.style.setProperty("visibility","hidden"),document.removeEventListener("scroll",this.showTooltip))},this.hideTooltipByEscape=t=>{"Escape"===t.key&&(getDocument().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:nonce(),_label:"…"}}render(){return h(Host,{ref:this.catchHostElement},""!==this.state._label&&h("div",{id:"floating",ref:this.catchTooltipElement},h("div",{class:"area",id:"arrow",ref:this.catchArrowElement}),h("kol-span-wc",{class:"area",id:this.state._id,_label:this.state._label})))}validateAlign(t){watchTooltipAlignment(this,"_align",t)}validateId(t){watchString(this,"_id",t)}validateLabel(t){watchString(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"]}}};KolTooltip.style=styleCss;export{KolTooltip as kol_tooltip};
+import{r as registerInstance,h,H as Host}from"./index-34c3d6f8.js";import{c as computePosition,o as offset,f as flip,s as shift,a as arrow}from"./floating-ui.dom.esm-74010e65.js";import{w as watchTooltipAlignment}from"./button-link-283b2d32.js";import{g as getDocument,n as nonce}from"./dev.utils-157f0499.js";import{w as watchString}from"./prop.validators-f81af56e.js";import{p as processEnv}from"./reuse-3a02afb9.js";import"./a11y.tipps-2e27f8e6.js";import"./index-ff788b4b.js";const VISIBLE_OVERLAYS=new Set;function showOverlay(t){VISIBLE_OVERLAYS.forEach((t=>{t.style.setProperty("z-index","999")})),VISIBLE_OVERLAYS.add(t),t.style.setProperty("z-index","1000")}function hideOverlay(t){if(VISIBLE_OVERLAYS.delete(t),VISIBLE_OVERLAYS.size>0){const t=Array.from(VISIBLE_OVERLAYS).pop();t&&t.style.setProperty("z-index","1000")}}const styleCss=":host{--a11y-min-size:44px;font-size:inherit}*{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}kol-tooltip #floating{animation-duration:0.5s;animation-iteration-count:1;animation-name:fadeInOpacity;animation-timing-function:ease-in;box-sizing:border-box;display:none;position:absolute;visibility:hidden}kol-tooltip #arrow{height:10px;position:absolute;transform:rotate(45deg);width:10px;z-index:999}kol-tooltip .area{background-color:#fff;color:#000}kol-tooltip kol-span-wc{position:relative;z-index:1000}@keyframes fadeInOpacity{0%{opacity:0}100%{opacity:1}}",KolTooltip=class{constructor(t){registerInstance(this,t),this.alignTooltip=t=>{var e;if("test"!==processEnv&&this.previousSibling&&this.tooltipElement){const i=this.previousSibling,o=this.tooltipElement,s=this.arrowElement,n=[offset(null!==(e=null==s?void 0:s.offsetHeight)&&void 0!==e?e:10),flip(),shift()];s&&n.push(arrow({element:s})),computePosition(i,o,{placement:this.state._align,middleware:n}).then((({x:e,y:i,middlewareData:n,placement:l})=>{var r,a;const h=o.style.left,p=o.style.top;Object.assign(o.style,{left:`${e}px`,top:`${i}px`}),s&&((null===(r=n.arrow)||void 0===r?void 0:r.x)?Object.assign(s.style,{left:`${n.arrow.x}px`,top:"bottom"===l?-s.offsetHeight/2+"px":"",bottom:"top"===l?-s.offsetHeight/2+"px":""}):(null===(a=n.arrow)||void 0===a?void 0:a.y)&&Object.assign(s.style,{left:"right"===l?-s.offsetWidth/2+"px":"",right:"left"===l?-s.offsetWidth/2+"px":"",top:`${n.arrow.y}px`})),h!==o.style.left||p!==o.style.top?this.alignTooltip(t):"function"==typeof t&&t()}))}},this.showTooltip=()=>{this.tooltipElement&&(showOverlay(this.tooltipElement),this.tooltipElement.style.setProperty("display","block"),getDocument().body.addEventListener("keyup",this.hideTooltipByEscape),this.alignTooltip((()=>{this.tooltipElement&&(this.tooltipElement.style.setProperty("visibility","visible"),document.addEventListener("scroll",this.showTooltip))})))},this.hideTooltip=()=>{this.tooltipElement&&(hideOverlay(this.tooltipElement),this.tooltipElement.style.setProperty("display","none"),this.tooltipElement.style.setProperty("visibility","hidden"),document.removeEventListener("scroll",this.showTooltip))},this.hideTooltipByEscape=t=>{"Escape"===t.key&&(getDocument().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:nonce(),_label:"…"}}render(){return h(Host,{ref:this.catchHostElement},""!==this.state._label&&h("div",{id:"floating",ref:this.catchTooltipElement},h("div",{class:"area",id:"arrow",ref:this.catchArrowElement}),h("kol-span-wc",{class:"area",id:this.state._id,_label:this.state._label})))}validateAlign(t){watchTooltipAlignment(this,"_align",t)}validateId(t){watchString(this,"_id",t)}validateLabel(t){watchString(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"]}}};KolTooltip.style=styleCss;export{KolTooltip as kol_tooltip};

package/dist/esm/kol-tooltip.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"kol-tooltip.entry.js","mappings":";;;;;;;;;;;;AAOA,MAAM,gBAAgB,GAAqB,IAAI,GAAG,EAAE,CAAC;SASrC,WAAW,CAAC,OAAoB;EAC/C,gBAAgB,CAAC,OAAO,CAAC,CAAC,cAAc;IACvC,cAAc,CAAC,KAAK,CAAC,WAAW,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC;GACnD,CAAC,CAAC;EACH,gBAAgB,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;EAC9B,OAAO,CAAC,KAAK,CAAC,WAAW,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;AAC9C,CAAC;SASe,WAAW,CAAC,OAAoB;EAC/C,gBAAgB,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;EACjC,IAAI,gBAAgB,CAAC,IAAI,GAAG,CAAC,EAAE;IAC9B,MAAM,IAAI,GAAG,KAAK,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC,GAAG,EAAE,CAAC;IAChD,IAAI,IAAI,EAAE;MACT,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;KAC1C;GACD;AACF;;ACvCA,MAAM,QAAQ,GAAG,soCAAsoC;;MC6B1oC,UAAU;;;IAKd,iBAAY,GAAG,CAAC,EAAe;;MACtC,IAAI,UAAU,KAAK,MAAM,IAAI,IAAI,CAAC,eAAe,IAAqC,IAAI,CAAC,cAAc,EAAmC;QAC3I,MAAM,MAAM,GAAG,IAAI,CAAC,eAAe,CAAC;QACpC,MAAM,SAAS,GAAG,IAAI,CAAC,cAAc,CAAC;QACtC,MAAM,OAAO,GAAG,IAAI,CAAC,YAAY,CAAC;QAElC,MAAM,UAAU,GAAG,CAAC,MAAM,CAAC,MAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,YAAY,mCAAI,EAAE,CAAC,EAAE,IAAI,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC;QAC1E,IAAI,OAAO,EAAE;UACZ,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,CAAC,CAAC,CAAC;SAC7C;QAED,KAAK,eAAe,CAAC,MAAM,EAAE,SAAS,EAAE;UACvC,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM;UAC5B,UAAU,EAAE,UAAU;SACtB,CAAC,CAAC,IAAI,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,cAAc,EAAE,SAAS,EAAE;;UAC3C,MAAM,MAAM,GAAG;YACd,IAAI,EAAE,SAAS,CAAC,KAAK,CAAC,IAAI;YAC1B,GAAG,EAAE,SAAS,CAAC,KAAK,CAAC,GAAG;WACxB,CAAC;UACF,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,KAAK,EAAE;YAC9B,IAAI,EAAE,GAAG,CAAC,IAAI;YACd,GAAG,EAAE,GAAG,CAAC,IAAI;WACb,CAAC,CAAC;UAEH,IAAI,OAAO,EAAE;YACZ,IAAI,MAAA,cAAc,CAAC,KAAK,0CAAE,CAAC,EAAE;cAC5B,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,EAAE;gBAC5B,IAAI,EAAE,GAAG,cAAc,CAAC,KAAK,CAAC,CAAC,IAAI;gBACnC,GAAG,EAAE,SAAS,KAAK,QAAQ,GAAG,GAAG,CAAC,OAAO,CAAC,YAAY,GAAG,CAAC,IAAI,GAAG,EAAE;gBACnE,MAAM,EAAE,SAAS,KAAK,KAAK,GAAG,GAAG,CAAC,OAAO,CAAC,YAAY,GAAG,CAAC,IAAI,GAAG,EAAE;eACnE,CAAC,CAAC;aACH;iBAAM,IAAI,MAAA,cAAc,CAAC,KAAK,0CAAE,CAAC,EAAE;cACnC,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,EAAE;gBAC5B,IAAI,EAAE,SAAS,KAAK,OAAO,GAAG,GAAG,CAAC,OAAO,CAAC,WAAW,GAAG,CAAC,IAAI,GAAG,EAAE;gBAClE,KAAK,EAAE,SAAS,KAAK,MAAM,GAAG,GAAG,CAAC,OAAO,CAAC,WAAW,GAAG,CAAC,IAAI,GAAG,EAAE;gBAClE,GAAG,EAAE,GAAG,cAAc,CAAC,KAAK,CAAC,CAAC,IAAI;eAClC,CAAC,CAAC;aACH;WACD;UACD,IAAI,MAAM,CAAC,IAAI,KAAK,SAAS,CAAC,KAAK,CAAC,IAAI,IAAI,MAAM,CAAC,GAAG,KAAK,SAAS,CAAC,KAAK,CAAC,GAAG,EAAE;YAC/E,IAAI,CAAC,YAAY,CAAC,EAAE,CAAC,CAAC;WACtB;eAAM,IAAI,OAAO,EAAE,KAAK,UAAU,EAAE;YACpC,EAAE,EAAE,CAAC;WACL;SACD,CAAC,CAAC;OACH;KACD,CAAC;IAEM,gBAAW,GAAG;MACrB,IAAI,IAAI,CAAC,cAAc,EAAmC;QACzD,WAAW,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;QACjC,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,WAAW,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;QAC1D,WAAW,EAAE,CAAC,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,mBAAmB,CAAC,CAAC;QACvE,IAAI,CAAC,YAAY,CAAC;UACjB,IAAI,IAAI,CAAC,cAAc,EAAmC;YACzD,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,WAAW,CAAC,YAAY,EAAE,SAAS,CAAC,CAAC;YAC/D,QAAQ,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;WACtD;SACD,CAAC,CAAC;OACH;KACD,CAAC;IAEM,gBAAW,GAAG;MACrB,IAAI,IAAI,CAAC,cAAc,EAAmC;QACzD,WAAW,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;QACjC,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,WAAW,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;QACzD,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,WAAW,CAAC,YAAY,EAAE,QAAQ,CAAC,CAAC;QAC9D,QAAQ,CAAC,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;OACzD;KACD,CAAC;IAEM,wBAAmB,GAAG,CAAC,KAAoB;MAClD,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,EAAE;QAC3B,WAAW,EAAE,CAAC,IAAI,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,mBAAmB,CAAC,CAAC;QAC1E,IAAI,CAAC,WAAW,EAAE,CAAC;OACnB;KACD,CAAC;IAEM,iBAAY,GAAG,CAAC,EAAW;MAClC,EAAE,CAAC,gBAAgB,CAAC,WAAW,EAAE,IAAI,CAAC,uBAAuB,CAAC,CAAC;MAC/D,EAAE,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,uBAAuB,CAAC,CAAC;MAC3D,EAAE,CAAC,gBAAgB,CAAC,UAAU,EAAE,IAAI,CAAC,uBAAuB,CAAC,CAAC;MAC9D,EAAE,CAAC,gBAAgB,CAAC,MAAM,EAAE,IAAI,CAAC,uBAAuB,CAAC,CAAC;KAC1D,CAAC;IAEM,oBAAe,GAAG,CAAC,EAAW;MACrC,EAAE,CAAC,mBAAmB,CAAC,WAAW,EAAE,IAAI,CAAC,uBAAuB,CAAC,CAAC;MAClE,EAAE,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,uBAAuB,CAAC,CAAC;MAC9D,EAAE,CAAC,mBAAmB,CAAC,UAAU,EAAE,IAAI,CAAC,uBAAuB,CAAC,CAAC;MACjE,EAAE,CAAC,mBAAmB,CAAC,MAAM,EAAE,IAAI,CAAC,uBAAuB,CAAC,CAAC;KAC7D,CAAC;IAEM,oBAAe,GAAG,CAAC,EAAW;MACrC,IAAI,CAAC,eAAe,CAAC,EAAE,CAAC,CAAC;MACzB,IAAI,CAAC,YAAY,CAAC,EAAE,CAAC,CAAC;KACtB,CAAC;IAEM,qBAAgB,GAAG,CAAC,EAAsB;MACjD,IAAI,EAAE,EAAmC;QACxC,IAAI,CAAC,eAAe,GAAG,EAAE,CAAC,sBAA4C,CAAC;QACvE,IAAI,IAAI,CAAC,eAAe,EAAmC;UAC1D,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;SAC3C;OACD;KACD,CAAC;IAEM,wBAAmB,GAAG,CAAC,EAAmB;MACjD,IAAI,CAAC,cAAc,GAAG,EAAE,CAAC;MACzB,IAAI,IAAI,CAAC,cAAc,EAAmC;QACzD,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;OAC1C;KACD,CAAC;IACM,sBAAiB,GAAG,CAAC,OAAwB;MACpD,IAAI,CAAC,YAAY,GAAG,OAAO,CAAC;KAC5B,CAAC;IAmDM,mBAAc,GAAG,CAAC,CAAC;IAGnB,4BAAuB,GAAG;MACjC,IAAI,CAAC,cAAc,EAAE,CAAC;MACtB,IAAI,CAAC,iBAAiB,EAAE,CAAC;KACzB,CAAC;IAEM,4BAAuB,GAAG;MACjC,IAAI,CAAC,cAAc,EAAE,CAAC;MACtB,IAAI,CAAC,iBAAiB,EAAE,CAAC;KACzB,CAAC;IAEM,sBAAiB,GAAG;MAC3B,YAAY,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC;MACpC,IAAI,CAAC,gBAAgB,GAAG,UAAU,CAAC;QAClC,YAAY,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC;QACpC,IAAI,IAAI,CAAC,cAAc,GAAG,CAAC,EAAE;UAC5B,IAAI,CAAC,WAAW,EAAE,CAAC;SACnB;aAAM;UACN,IAAI,CAAC,WAAW,EAAE,CAAC;SACnB;OACD,EAAE,GAAG,CAAC,CAAC;KACR,CAAC;kBAxDkC,KAAK;;;iBAYT;MAC/B,MAAM,EAAE,KAAK;MACb,GAAG,EAAE,KAAK,EAAE;MACZ,MAAM,EAAE,GAAG;KACX;;EAhCM,MAAM;IACZ,QACC,EAAC,IAAI,IAAC,GAAG,EAAE,IAAI,CAAC,gBAAgB,IAC9B,IAAI,CAAC,KAAK,CAAC,MAAM,KAAK,EAAE,KACxB,WAAK,EAAE,EAAC,UAAU,EAAC,GAAG,EAAE,IAAI,CAAC,mBAAmB,IAC/C,WAAK,KAAK,EAAC,MAAM,EAAC,EAAE,EAAC,OAAO,EAAC,GAAG,EAAE,IAAI,CAAC,iBAAiB,GAAI,EAC5D,mBAAa,KAAK,EAAC,MAAM,EAAC,EAAE,EAAE,IAAI,CAAC,KAAK,CAAC,GAAG,EAAE,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,GAAgB,CAClF,CACN,CACK,EACN;GACF;EAwBM,aAAa,CAAC,KAAiB;IACrC,qBAAqB,CAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,CAAC,CAAC;GAC7C;EAGM,UAAU,CAAC,KAAc;IAC/B,WAAW,CAAC,IAAI,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC;GAChC;EAGM,aAAa,CAAC,KAAc;IAClC,WAAW,CAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,CAAC,CAAC;GACnC;EA2BM,iBAAiB;IACvB,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IAChC,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAC1B,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;GAChC;EAKM,oBAAoB;IAC1B,IAAI,IAAI,CAAC,eAAe,EAAmC;MAC1D,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;KAC3C;IACD,IAAI,IAAI,CAAC,cAAc,EAAmC;MACzD,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;KAC1C;GACD;;;;;;;;;;;","names":[],"sources":["./src/utils/overlay.ts","./src/components/tooltip/style.css?tag=kol-tooltip","./src/components/tooltip/component.tsx"],"sourcesContent":["/*\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}
1	+ {"file":"kol-tooltip.entry.js","mappings":";;;;;;;;;;;;AAOA,MAAM,gBAAgB,GAAqB,IAAI,GAAG,EAAE,CAAC;SASrC,WAAW,CAAC,OAAoB;EAC/C,gBAAgB,CAAC,OAAO,CAAC,CAAC,cAAc;IACvC,cAAc,CAAC,KAAK,CAAC,WAAW,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC;GACnD,CAAC,CAAC;EACH,gBAAgB,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;EAC9B,OAAO,CAAC,KAAK,CAAC,WAAW,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;AAC9C,CAAC;SASe,WAAW,CAAC,OAAoB;EAC/C,gBAAgB,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;EACjC,IAAI,gBAAgB,CAAC,IAAI,GAAG,CAAC,EAAE;IAC9B,MAAM,IAAI,GAAG,KAAK,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC,GAAG,EAAE,CAAC;IAChD,IAAI,IAAI,EAAE;MACT,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;KAC1C;GACD;AACF;;ACvCA,MAAM,QAAQ,GAAG,soCAAsoC;;MC6B1oC,UAAU;;;IAKd,iBAAY,GAAG,CAAC,EAAe;;MACtC,IAAI,UAAU,KAAK,MAAM,IAAI,IAAI,CAAC,eAAe,IAAqC,IAAI,CAAC,cAAc,EAAmC;QAC3I,MAAM,MAAM,GAAG,IAAI,CAAC,eAAe,CAAC;QACpC,MAAM,SAAS,GAAG,IAAI,CAAC,cAAc,CAAC;QACtC,MAAM,OAAO,GAAG,IAAI,CAAC,YAAY,CAAC;QAElC,MAAM,UAAU,GAAG,CAAC,MAAM,CAAC,MAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,YAAY,mCAAI,EAAE,CAAC,EAAE,IAAI,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC;QAC1E,IAAI,OAAO,EAAE;UACZ,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,CAAC,CAAC,CAAC;SAC7C;QAED,KAAK,eAAe,CAAC,MAAM,EAAE,SAAS,EAAE;UACvC,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM;UAC5B,UAAU,EAAE,UAAU;SACtB,CAAC,CAAC,IAAI,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,cAAc,EAAE,SAAS,EAAE;;UAC3C,MAAM,MAAM,GAAG;YACd,IAAI,EAAE,SAAS,CAAC,KAAK,CAAC,IAAI;YAC1B,GAAG,EAAE,SAAS,CAAC,KAAK,CAAC,GAAG;WACxB,CAAC;UACF,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,KAAK,EAAE;YAC9B,IAAI,EAAE,GAAG,CAAC,IAAI;YACd,GAAG,EAAE,GAAG,CAAC,IAAI;WACb,CAAC,CAAC;UAEH,IAAI,OAAO,EAAE;YACZ,IAAI,MAAA,cAAc,CAAC,KAAK,0CAAE,CAAC,EAAE;cAC5B,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,EAAE;gBAC5B,IAAI,EAAE,GAAG,cAAc,CAAC,KAAK,CAAC,CAAC,IAAI;gBACnC,GAAG,EAAE,SAAS,KAAK,QAAQ,GAAG,GAAG,CAAC,OAAO,CAAC,YAAY,GAAG,CAAC,IAAI,GAAG,EAAE;gBACnE,MAAM,EAAE,SAAS,KAAK,KAAK,GAAG,GAAG,CAAC,OAAO,CAAC,YAAY,GAAG,CAAC,IAAI,GAAG,EAAE;eACnE,CAAC,CAAC;aACH;iBAAM,IAAI,MAAA,cAAc,CAAC,KAAK,0CAAE,CAAC,EAAE;cACnC,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,EAAE;gBAC5B,IAAI,EAAE,SAAS,KAAK,OAAO,GAAG,GAAG,CAAC,OAAO,CAAC,WAAW,GAAG,CAAC,IAAI,GAAG,EAAE;gBAClE,KAAK,EAAE,SAAS,KAAK,MAAM,GAAG,GAAG,CAAC,OAAO,CAAC,WAAW,GAAG,CAAC,IAAI,GAAG,EAAE;gBAClE,GAAG,EAAE,GAAG,cAAc,CAAC,KAAK,CAAC,CAAC,IAAI;eAClC,CAAC,CAAC;aACH;WACD;UACD,IAAI,MAAM,CAAC,IAAI,KAAK,SAAS,CAAC,KAAK,CAAC,IAAI,IAAI,MAAM,CAAC,GAAG,KAAK,SAAS,CAAC,KAAK,CAAC,GAAG,EAAE;YAC/E,IAAI,CAAC,YAAY,CAAC,EAAE,CAAC,CAAC;WACtB;eAAM,IAAI,OAAO,EAAE,KAAK,UAAU,EAAE;YACpC,EAAE,EAAE,CAAC;WACL;SACD,CAAC,CAAC;OACH;KACD,CAAC;IAEM,gBAAW,GAAG;MACrB,IAAI,IAAI,CAAC,cAAc,EAAmC;QACzD,WAAW,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;QACjC,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,WAAW,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;QAC1D,WAAW,EAAE,CAAC,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,mBAAmB,CAAC,CAAC;QACvE,IAAI,CAAC,YAAY,CAAC;UACjB,IAAI,IAAI,CAAC,cAAc,EAAmC;YACzD,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,WAAW,CAAC,YAAY,EAAE,SAAS,CAAC,CAAC;YAC/D,QAAQ,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;WACtD;SACD,CAAC,CAAC;OACH;KACD,CAAC;IAEM,gBAAW,GAAG;MACrB,IAAI,IAAI,CAAC,cAAc,EAAmC;QACzD,WAAW,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;QACjC,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,WAAW,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;QACzD,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,WAAW,CAAC,YAAY,EAAE,QAAQ,CAAC,CAAC;QAC9D,QAAQ,CAAC,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;OACzD;KACD,CAAC;IAEM,wBAAmB,GAAG,CAAC,KAAoB;MAClD,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,EAAE;QAC3B,WAAW,EAAE,CAAC,IAAI,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,mBAAmB,CAAC,CAAC;QAC1E,IAAI,CAAC,WAAW,EAAE,CAAC;OACnB;KACD,CAAC;IAEM,iBAAY,GAAG,CAAC,EAAW;MAClC,EAAE,CAAC,gBAAgB,CAAC,WAAW,EAAE,IAAI,CAAC,uBAAuB,CAAC,CAAC;MAC/D,EAAE,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,uBAAuB,CAAC,CAAC;MAC3D,EAAE,CAAC,gBAAgB,CAAC,UAAU,EAAE,IAAI,CAAC,uBAAuB,CAAC,CAAC;MAC9D,EAAE,CAAC,gBAAgB,CAAC,MAAM,EAAE,IAAI,CAAC,uBAAuB,CAAC,CAAC;KAC1D,CAAC;IAEM,oBAAe,GAAG,CAAC,EAAW;MACrC,EAAE,CAAC,mBAAmB,CAAC,WAAW,EAAE,IAAI,CAAC,uBAAuB,CAAC,CAAC;MAClE,EAAE,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,uBAAuB,CAAC,CAAC;MAC9D,EAAE,CAAC,mBAAmB,CAAC,UAAU,EAAE,IAAI,CAAC,uBAAuB,CAAC,CAAC;MACjE,EAAE,CAAC,mBAAmB,CAAC,MAAM,EAAE,IAAI,CAAC,uBAAuB,CAAC,CAAC;KAC7D,CAAC;IAEM,oBAAe,GAAG,CAAC,EAAW;MACrC,IAAI,CAAC,eAAe,CAAC,EAAE,CAAC,CAAC;MACzB,IAAI,CAAC,YAAY,CAAC,EAAE,CAAC,CAAC;KACtB,CAAC;IAEM,qBAAgB,GAAG,CAAC,EAAsB;MACjD,IAAI,EAAE,EAAmC;QACxC,IAAI,CAAC,eAAe,GAAG,EAAE,CAAC,sBAA4C,CAAC;QACvE,IAAI,IAAI,CAAC,eAAe,EAAmC;UAC1D,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;SAC3C;OACD;KACD,CAAC;IAEM,wBAAmB,GAAG,CAAC,EAAmB;MACjD,IAAI,CAAC,cAAc,GAAG,EAAE,CAAC;MACzB,IAAI,IAAI,CAAC,cAAc,EAAmC;QACzD,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;OAC1C;KACD,CAAC;IACM,sBAAiB,GAAG,CAAC,OAAwB;MACpD,IAAI,CAAC,YAAY,GAAG,OAAO,CAAC;KAC5B,CAAC;IAmDM,mBAAc,GAAG,CAAC,CAAC;IAGnB,4BAAuB,GAAG;MACjC,IAAI,CAAC,cAAc,EAAE,CAAC;MACtB,IAAI,CAAC,iBAAiB,EAAE,CAAC;KACzB,CAAC;IAEM,4BAAuB,GAAG;MACjC,IAAI,CAAC,cAAc,EAAE,CAAC;MACtB,IAAI,CAAC,iBAAiB,EAAE,CAAC;KACzB,CAAC;IAEM,sBAAiB,GAAG;MAC3B,YAAY,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC;MACpC,IAAI,CAAC,gBAAgB,GAAG,UAAU,CAAC;QAClC,YAAY,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC;QACpC,IAAI,IAAI,CAAC,cAAc,GAAG,CAAC,EAAE;UAC5B,IAAI,CAAC,WAAW,EAAE,CAAC;SACnB;aAAM;UACN,IAAI,CAAC,WAAW,EAAE,CAAC;SACnB;OACD,EAAE,GAAG,CAAC,CAAC;KACR,CAAC;kBAxD8B,KAAK;;;iBAYL;MAC/B,MAAM,EAAE,KAAK;MACb,GAAG,EAAE,KAAK,EAAE;MACZ,MAAM,EAAE,GAAG;KACX;;EAhCM,MAAM;IACZ,QACC,EAAC,IAAI,IAAC,GAAG,EAAE,IAAI,CAAC,gBAAgB,IAC9B,IAAI,CAAC,KAAK,CAAC,MAAM,KAAK,EAAE,KACxB,WAAK,EAAE,EAAC,UAAU,EAAC,GAAG,EAAE,IAAI,CAAC,mBAAmB,IAC/C,WAAK,KAAK,EAAC,MAAM,EAAC,EAAE,EAAC,OAAO,EAAC,GAAG,EAAE,IAAI,CAAC,iBAAiB,GAAI,EAC5D,mBAAa,KAAK,EAAC,MAAM,EAAC,EAAE,EAAE,IAAI,CAAC,KAAK,CAAC,GAAG,EAAE,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,GAAgB,CAClF,CACN,CACK,EACN;GACF;EAwBM,aAAa,CAAC,KAAa;IACjC,qBAAqB,CAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,CAAC,CAAC;GAC7C;EAGM,UAAU,CAAC,KAAc;IAC/B,WAAW,CAAC,IAAI,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC;GAChC;EAGM,aAAa,CAAC,KAAc;IAClC,WAAW,CAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,CAAC,CAAC;GACnC;EA2BM,iBAAiB;IACvB,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IAChC,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAC1B,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;GAChC;EAKM,oBAAoB;IAC1B,IAAI,IAAI,CAAC,eAAe,EAAmC;MAC1D,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;KAC3C;IACD,IAAI,IAAI,CAAC,cAAc,EAAmC;MACzD,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;KAC1C;GACD;;;;;;;;;;;","names":[],"sources":["./src/utils/overlay.ts","./src/components/tooltip/style.css?tag=kol-tooltip","./src/components/tooltip/component.tsx"],"sourcesContent":["/*\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 { Align } 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: Align;\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?: Align = 'top';\n\n\t/\n\t Gibt die interne ID des primären Elements in der Komponente an.\n\t /\n\t@Prop() public _id!: string;\n\n\t/\n\t Setzt die sichtbare oder semantische Beschriftung der Komponente (z.B. Aria-Label, Label, Headline, Caption, Summary usw.).\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?: Align): 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/esm/kol-version.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{r as registerInstance,h}from"./index-34c3d6f8.js";import{w as watchString}from"./prop.validators-2c20cdf8.js";import"./a11y.tipps-2e27f8e6.js";import"./dev.utils-157f0499.js";import"./reuse-3a02afb9.js";import"./index-f4596895.js";var Farbspektrum;!function(e){e.Violett="#5f316e",e.Dunkelrot="#780f2d",e.Rot="#c0003c",e.Orange="#cd5038",e.Hellorange="#f7bb3d",e.Gelb="#f9e03a",e["Hellgrün"]="#c1ca31",e.Oliv="#597c39",e["Dunkelgrün"]="#005c45",e["Grün"]="#00854a",e["Türkis"]="#00818b",e.Hellblau="#80cdec",e.Blau="#0077b6",e.Petrol="#007194",e.Dunkelblau="#004b76",e.Dunkelgrau="#576164",e.Hellgrau="#bec5c9"}(Farbspektrum||(Farbspektrum={}));const defaultStyleCss=":host{--a11y-min-size:44px;font-size:inherit}*{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}",KolVersion=class{constructor(e){registerInstance(this,e),this._version=void 0,this.state={_version:"0.0.0-alpha.0"}}render(){return h("kol-badge",{_color:Farbspektrum.Hellgrau,_icon:"codicon codicon-versions",_label:`v${this.state._version}`})}validateVersion(e){watchString(this,"_version",e,{required:!0})}componentWillLoad(){this.validateVersion(this._version)}static get watchers(){return{_version:["validateVersion"]}}};KolVersion.style={default:defaultStyleCss};export{KolVersion as kol_version};
+import{r as registerInstance,h}from"./index-34c3d6f8.js";import{w as watchString}from"./prop.validators-f81af56e.js";import"./a11y.tipps-2e27f8e6.js";import"./dev.utils-157f0499.js";import"./reuse-3a02afb9.js";import"./index-ff788b4b.js";var Farbspektrum;!function(e){e.Violett="#5f316e",e.Dunkelrot="#780f2d",e.Rot="#c0003c",e.Orange="#cd5038",e.Hellorange="#f7bb3d",e.Gelb="#f9e03a",e["Hellgrün"]="#c1ca31",e.Oliv="#597c39",e["Dunkelgrün"]="#005c45",e["Grün"]="#00854a",e["Türkis"]="#00818b",e.Hellblau="#80cdec",e.Blau="#0077b6",e.Petrol="#007194",e.Dunkelblau="#004b76",e.Dunkelgrau="#576164",e.Hellgrau="#bec5c9"}(Farbspektrum||(Farbspektrum={}));const defaultStyleCss=":host{--a11y-min-size:44px;font-size:inherit}*{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}",KolVersion=class{constructor(e){registerInstance(this,e),this._version=void 0,this.state={_version:"0.0.0-alpha.0"}}render(){return h("kol-badge",{_color:Farbspektrum.Hellgrau,_icon:"codicon codicon-versions",_label:`v${this.state._version}`})}validateVersion(e){watchString(this,"_version",e,{required:!0})}componentWillLoad(){this.validateVersion(this._version)}static get watchers(){return{_version:["validateVersion"]}}};KolVersion.style={default:defaultStyleCss};export{KolVersion as kol_version};

package/dist/esm/kolibri.js CHANGED Viewed

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{p as promiseResolve,b as bootstrapLazy}from"./index-34c3d6f8.js";export{s as setNonce}from"./index-34c3d6f8.js";import{g as globalScripts}from"./app-globals-037e6656.js";import"./index-0962b5a1.js";import"./index-f4596895.js";import"./dev.utils-157f0499.js";import"./reuse-3a02afb9.js";const patchBrowser=()=>{const e=import.meta.url,a={};return""!==e&&(a.resourcesUrl=new URL(".",e).href),promiseResolve(a)};patchBrowser().then((e=>(globalScripts(),bootstrapLazy(JSON.parse('[["kol-table",[[33,"kol-table",{"_caption":[1],"_data":[1],"_headers":[1],"_minWidth":[1,"_min-width"],"_pagination":[8],"state":[32]}]]],["kol-input-adapter-leanup",[[1,"kol-input-adapter-leanup"]]],["kol-input-date",[[4,"kol-input-date",{"_accessKey":[1,"_access-key"],"_alert":[1540],"_autoComplete":[1,"_auto-complete"],"_disabled":[516],"_error":[1],"_hideLabel":[516,"_hide-label"],"_hint":[1],"_icon":[1],"_id":[1],"_label":[1],"_list":[1],"_max":[1],"_min":[1],"_name":[1],"_on":[16],"_readOnly":[516,"_read-only"],"_required":[516],"_smartButton":[16],"_step":[2],"_tabIndex":[2,"_tab-index"],"_touched":[1540],"_type":[1],"_value":[1025],"state":[32]}]]],["kol-input-radio-group",[[1,"kol-input-radio-group",{"_accessKey":[1,"_access-key"],"_alert":[516],"_disabled":[516],"_error":[1],"_hideLabel":[516,"_hide-label"],"_hint":[1],"_id":[1],"_label":[1],"_list":[1],"_name":[1],"_on":[16],"_orientation":[1],"_required":[516],"_tabIndex":[2,"_tab-index"],"_touched":[516],"_value":[8]}]]],["kol-input-checkbox",[[33,"kol-input-checkbox",{"_accessKey":[1,"_access-key"],"_alert":[1540],"_checked":[1540],"_disabled":[516],"_error":[1],"_hideLabel":[516,"_hide-label"],"_hint":[1],"_icon":[1],"_id":[1],"_indeterminate":[1540],"_label":[1],"_name":[1],"_on":[16],"_required":[516],"_tabIndex":[2,"_tab-index"],"_touched":[1540],"_type":[1],"_value":[1],"_variant":[1],"state":[32]}]]],["kol-input-color",[[33,"kol-input-color",{"_accessKey":[1,"_access-key"],"_alert":[1540],"_autoComplete":[1,"_auto-complete"],"_disabled":[516],"_error":[1],"_hideLabel":[516,"_hide-label"],"_hint":[1],"_icon":[1],"_id":[1],"_label":[1],"_list":[1],"_name":[1],"_on":[16],"_smartButton":[16],"_tabIndex":[2,"_tab-index"],"_touched":[1540],"_value":[1],"state":[32]}]]],["kol-input-email",[[33,"kol-input-email",{"_accessKey":[1,"_access-key"],"_alert":[1540],"_autoComplete":[1,"_auto-complete"],"_disabled":[516],"_error":[1],"_hideLabel":[516,"_hide-label"],"_hint":[1],"_icon":[1],"_id":[1],"_label":[1],"_list":[1],"_maxLength":[2,"_max-length"],"_multiple":[516],"_name":[1],"_on":[16],"_pattern":[1],"_placeholder":[1],"_readOnly":[516,"_read-only"],"_required":[516],"_size":[2],"_smartButton":[16],"_tabIndex":[2,"_tab-index"],"_touched":[1540],"_value":[1],"state":[32]}]]],["kol-input-file",[[33,"kol-input-file",{"_accept":[1],"_accessKey":[1,"_access-key"],"_alert":[1540],"_disabled":[516],"_error":[1],"_hideLabel":[516,"_hide-label"],"_hint":[1],"_icon":[1],"_id":[1],"_label":[1],"_multiple":[516],"_name":[1],"_on":[16],"_required":[516],"_smartButton":[16],"_tabIndex":[2,"_tab-index"],"_touched":[1540],"_value":[1],"state":[32]}]]],["kol-input-password",[[33,"kol-input-password",{"_accessKey":[1,"_access-key"],"_alert":[1540],"_autoComplete":[1,"_auto-complete"],"_disabled":[516],"_error":[1],"_hideLabel":[516,"_hide-label"],"_hint":[1],"_icon":[1],"_id":[1],"_label":[1],"_maxLength":[2,"_max-length"],"_name":[1],"_on":[16],"_pattern":[1],"_placeholder":[1],"_readOnly":[516,"_read-only"],"_required":[516],"_size":[2],"_smartButton":[16],"_tabIndex":[2,"_tab-index"],"_touched":[1540],"_value":[1],"state":[32]}]]],["kol-input-range",[[33,"kol-input-range",{"_accessKey":[1,"_access-key"],"_alert":[1540],"_autoComplete":[1,"_auto-complete"],"_disabled":[516],"_error":[1],"_hideLabel":[516,"_hide-label"],"_hint":[1],"_icon":[1],"_id":[1],"_label":[1],"_list":[1],"_max":[2],"_min":[2],"_name":[1],"_on":[16],"_step":[2],"_tabIndex":[2,"_tab-index"],"_touched":[1540],"_value":[2],"state":[32]}]]],["kol-input-text",[[33,"kol-input-text",{"_accessKey":[1,"_access-key"],"_alert":[1540],"_autoComplete":[1,"_auto-complete"],"_disabled":[516],"_error":[1],"_hideLabel":[516,"_hide-label"],"_hint":[1],"_icon":[1],"_id":[1],"_label":[1],"_list":[1],"_maxLength":[2,"_max-length"],"_name":[1],"_on":[16],"_pattern":[1],"_placeholder":[1],"_readOnly":[516,"_read-only"],"_required":[516],"_size":[2],"_smartButton":[16],"_tabIndex":[2,"_tab-index"],"_touched":[1540],"_type":[1],"_value":[1025],"state":[32]}]]],["kol-textarea",[[33,"kol-textarea",{"_accessKey":[1,"_access-key"],"_adjustHeight":[516,"_adjust-height"],"_alert":[1540],"_disabled":[516],"_error":[1],"_hasCounter":[516,"_has-counter"],"_hideLabel":[516,"_hide-label"],"_hint":[1],"_id":[1],"_label":[1],"_maxLength":[2,"_max-length"],"_name":[1],"_on":[16],"_placeholder":[1],"_readOnly":[516,"_read-only"],"_resize":[1],"_required":[516],"_rows":[1026],"_tabIndex":[2,"_tab-index"],"_touched":[1540],"_value":[1],"state":[32]}]]],["kol-toast",[[33,"kol-toast",{"_alert":[516],"_hasCloser":[516,"_has-closer"],"_heading":[1],"_level":[2],"_on":[16],"_show":[1540],"_showDuration":[2,"_show-duration"],"_type":[1],"state":[32]}]]],["kol-link-group",[[33,"kol-link-group",{"_ariaLabel":[1,"_aria-label"],"_listStyleType":[1,"_list-style-type"],"_heading":[1],"_level":[2],"_links":[1],"_ordered":[516],"_orientation":[1],"state":[32]}]]],["kol-nav",[[33,"kol-nav",{"_ariaCurrentValue":[8,"_aria-current-value"],"_ariaLabel":[1,"_aria-label"],"_collapsible":[516],"_compact":[516],"_hasCompactButton":[516,"_has-compact-button"],"_orientation":[1],"_links":[1],"_variant":[1],"state":[32]}]]],["kol-accordion",[[33,"kol-accordion",{"_heading":[1],"_level":[2],"_on":[16],"_open":[1540],"state":[32]}]]],["kol-breadcrumb",[[33,"kol-breadcrumb",{"_ariaLabel":[1,"_aria-label"],"_links":[1],"state":[32]}]]],["kol-quote",[[33,"kol-quote",{"_caption":[1],"_href":[1],"_quote":[1],"_variant":[1],"state":[32]}]]],["kol-skip-nav",[[33,"kol-skip-nav",{"_ariaLabel":[1,"_aria-label"],"_links":[1],"state":[32]}]]],["kol-tabs",[[33,"kol-tabs",{"_ariaLabel":[1,"_aria-label"],"_on":[16],"_selected":[1538],"_tabs":[1],"_tabsAlign":[1,"_tabs-align"],"state":[32]}]]],["kol-version",[[33,"kol-version",{"_version":[1],"state":[32]}]]],["kol-button-link",[[33,"kol-button-link",{"_accessKey":[1,"_access-key"],"_ariaControls":[1,"_aria-controls"],"_ariaCurrent":[8,"_aria-current"],"_ariaExpanded":[516,"_aria-expanded"],"_ariaLabel":[1025,"_aria-label"],"_ariaSelected":[516,"_aria-selected"],"_disabled":[516],"_icon":[1],"_iconOnly":[516,"_icon-only"],"_id":[1],"_label":[1],"_on":[16],"_role":[1],"_tabIndex":[2,"_tab-index"],"_tooltipAlign":[1,"_tooltip-align"],"_type":[1],"_value":[16]}]]],["kol-link-button",[[33,"kol-link-button",{"_ariaControls":[1,"_aria-controls"],"_ariaCurrent":[8,"_aria-current"],"_ariaExpanded":[516,"_aria-expanded"],"_ariaLabel":[1,"_aria-label"],"_ariaSelected":[516,"_aria-selected"],"_customClass":[1,"_custom-class"],"_disabled":[516],"_download":[8],"_href":[1],"_icon":[1],"_iconOnly":[516,"_icon-only"],"_label":[1],"_on":[16],"_role":[1],"_tabIndex":[2,"_tab-index"],"_target":[1],"_targetDescription":[1,"_target-description"],"_tooltipAlign":[1,"_tooltip-align"],"_variant":[1]}]]],["kol-split-button",[[33,"kol-split-button",{"_accessKey":[1,"_access-key"],"_ariaControls":[1,"_aria-controls"],"_ariaCurrent":[8,"_aria-current"],"_ariaExpanded":[516,"_aria-expanded"],"_ariaLabel":[1025,"_aria-label"],"_ariaSelected":[516,"_aria-selected"],"_customClass":[1,"_custom-class"],"_disabled":[516],"_hideLabel":[516,"_hide-label"],"_icon":[1],"_iconOnly":[516,"_icon-only"],"_label":[1025],"_on":[16],"_role":[1],"_showDropdown":[1540,"_show-dropdown"],"_tabIndex":[2,"_tab-index"],"_tooltipAlign":[1,"_tooltip-align"],"_type":[1],"_value":[16],"_variant":[1],"state":[32]}]]],["kol-abbr",[[33,"kol-abbr",{"_tooltipAlign":[1,"_tooltip-align"],"_title":[1],"state":[32]}]]],["kol-details",[[33,"kol-details",{"_open":[1540],"_summary":[1],"state":[32]}]]],["kol-span",[[33,"kol-span",{"_icon":[1],"_iconOnly":[516,"_icon-only"],"_label":[1]}]]],["kol-button-group",[[33,"kol-button-group"]]],["kol-card",[[33,"kol-card",{"_hasFooter":[516,"_has-footer"],"_heading":[1],"_headline":[1],"_level":[2],"state":[32]}]]],["kol-form",[[1,"kol-form",{"_on":[16],"_requiredText":[8,"_required-text"],"state":[32]}]]],["kol-heading",[[33,"kol-heading",{"_label":[1],"_level":[2],"_secondaryHeadline":[1,"_secondary-headline"]}]]],["kol-icon-font-awesome",[[0,"kol-icon-font-awesome",{"_ariaLabel":[1,"_aria-label"],"_icon":[1],"_prefix":[1],"_part":[1]}]]],["kol-image",[[33,"kol-image",{"_alt":[1],"_loading":[1],"_sizes":[1],"_src":[1],"_srcset":[1],"state":[32]}]]],["kol-icon",[[33,"kol-icon",{"_ariaLabel":[1,"_aria-label"],"_icon":[1],"_part":[1],"state":[32]}]]],["kol-icon-icofont",[[0,"kol-icon-icofont",{"_ariaLabel":[1,"_aria-label"],"_icon":[1],"_part":[1]}]]],["kol-kolibri",[[33,"kol-kolibri",{"_animate":[516],"_color":[1],"_labeled":[516],"state":[32]}]]],["kol-logo",[[33,"kol-logo",{"_abbr":[1],"_org":[1],"state":[32]}]]],["kol-modal",[[33,"kol-modal",{"_activeElement":[1040],"_ariaLabel":[1,"_aria-label"],"_on":[16],"_width":[1],"state":[32]}]]],["kol-popover",[[4,"kol-popover",{"_alignment":[1],"_show":[1540],"state":[32]}]]],["kol-progress",[[33,"kol-progress",{"_label":[1],"_max":[2],"_type":[1],"_unit":[1],"_value":[2],"_variant":[1],"state":[32]}]]],["kol-spin",[[33,"kol-spin",{"_show":[516],"_variant":[1],"state":[32]}]]],["kol-symbol",[[0,"kol-symbol",{"_ariaLabel":[1,"_aria-label"],"_symbol":[1],"state":[32]}]]],["kol-tooltip",[[0,"kol-tooltip",{"_align":[1],"_id":[1],"_label":[1],"state":[32]}]]],["kol-pagination",[[33,"kol-pagination",{"_boundaryCount":[2,"_boundary-count"],"_customClass":[1,"_custom-class"],"_hasButtons":[8,"_has-buttons"],"_page":[2],"_pageSize":[1026,"_page-size"],"_pageSizeOptions":[1,"_page-size-options"],"_on":[16],"_siblingCount":[2,"_sibling-count"],"_tooltipAlign":[1,"_tooltip-align"],"_total":[2],"_variant":[1],"state":[32]}]]],["kol-input-number",[[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],"_label":[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]}]]],["kol-input-radio",[[33,"kol-input-radio",{"_accessKey":[1,"_access-key"],"_alert":[1540],"_disabled":[516],"_error":[1],"_hideLabel":[516,"_hide-label"],"_hint":[1],"_id":[1],"_label":[1],"_list":[1],"_name":[1],"_on":[16],"_orientation":[1],"_required":[516],"_tabIndex":[2,"_tab-index"],"_touched":[1540],"_value":[8],"state":[32]}]]],["kol-badge",[[33,"kol-badge",{"_color":[1],"_icon":[1],"_iconOnly":[516,"_icon-only"],"_label":[1],"_smartButton":[1,"_smart-button"],"state":[32]}]]],["kol-select",[[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],"_label":[1],"_list":[1],"_multiple":[516],"_name":[1],"_on":[16],"_required":[516],"_size":[2],"_tabIndex":[2,"_tab-index"],"_touched":[1540],"_value":[1025],"state":[32]}]]],["kol-button-group-wc",[[4,"kol-button-group-wc",{"state":[32]}]]],["kol-indented-text",[[33,"kol-indented-text",{"state":[32]}]]],["kol-button-wc_3",[[4,"kol-heading-wc",{"_label":[1],"_level":[2],"_secondaryHeadline":[1,"_secondary-headline"],"state":[32]}],[4,"kol-button-wc",{"_accessKey":[1,"_access-key"],"_ariaControls":[1,"_aria-controls"],"_ariaCurrent":[8,"_aria-current"],"_ariaExpanded":[516,"_aria-expanded"],"_ariaLabel":[1025,"_aria-label"],"_ariaSelected":[516,"_aria-selected"],"_customClass":[1,"_custom-class"],"_disabled":[516],"_icon":[1],"_iconAlign":[1,"_icon-align"],"_iconOnly":[516,"_icon-only"],"_id":[1],"_label":[1025],"_on":[16],"_role":[1],"_tabIndex":[2,"_tab-index"],"_tooltipAlign":[1,"_tooltip-align"],"_type":[1],"_value":[16],"_variant":[1],"state":[32]}],[4,"kol-span-wc",{"_icon":[1],"_iconOnly":[516,"_icon-only"],"_label":[1],"state":[32]}]]],["kol-button",[[33,"kol-button",{"_accessKey":[1,"_access-key"],"_ariaControls":[1,"_aria-controls"],"_ariaCurrent":[8,"_aria-current"],"_ariaExpanded":[516,"_aria-expanded"],"_ariaLabel":[1,"_aria-label"],"_ariaSelected":[516,"_aria-selected"],"_customClass":[1,"_custom-class"],"_disabled":[516],"_icon":[1],"_iconAlign":[1,"_icon-align"],"_iconOnly":[516,"_icon-only"],"_id":[1],"_label":[1],"_on":[16],"_role":[1],"_tabIndex":[2,"_tab-index"],"_tooltipAlign":[1,"_tooltip-align"],"_type":[1],"_value":[16],"_variant":[1]}]]],["kol-link-wc",[[4,"kol-link-wc",{"_ariaControls":[1,"_aria-controls"],"_ariaCurrent":[8,"_aria-current"],"_ariaExpanded":[516,"_aria-expanded"],"_ariaLabel":[1,"_aria-label"],"_ariaSelected":[516,"_aria-selected"],"_disabled":[516],"_download":[8],"_href":[1],"_icon":[1],"_iconAlign":[1,"_icon-align"],"_iconOnly":[516,"_icon-only"],"_label":[1025],"_on":[16],"_role":[1],"_selector":[1],"_stealth":[516],"_tabIndex":[2,"_tab-index"],"_target":[1],"_targetDescription":[1,"_target-description"],"_tooltipAlign":[1,"_tooltip-align"],"_useCase":[1,"_use-case"],"state":[32]}]]],["kol-link",[[33,"kol-link",{"_ariaControls":[1,"_aria-controls"],"_ariaCurrent":[8,"_aria-current"],"_ariaExpanded":[516,"_aria-expanded"],"_ariaLabel":[1,"_aria-label"],"_ariaSelected":[516,"_aria-selected"],"_disabled":[516],"_download":[8],"_href":[1],"_icon":[1],"_iconAlign":[1,"_icon-align"],"_iconOnly":[516,"_icon-only"],"_label":[1],"_on":[16],"_role":[1],"_selector":[1],"_stealth":[516],"_tabIndex":[2,"_tab-index"],"_target":[1],"_targetDescription":[1,"_target-description"],"_tooltipAlign":[1,"_tooltip-align"],"_useCase":[1,"_use-case"]}]]],["kol-alert",[[33,"kol-alert",{"_alert":[516],"_hasCloser":[516,"_has-closer"],"_heading":[1],"_level":[2],"_on":[16],"_type":[1],"_variant":[1],"state":[32]}]]],["kol-alert-wc_2",[[4,"kol-input",{"_alert":[516],"_disabled":[516],"_error":[1],"_hideLabel":[516,"_hide-label"],"_hint":[1],"_icon":[16],"_id":[1],"_list":[1],"_readOnly":[516,"_read-only"],"_renderNoLabel":[516,"_render-no-label"],"_required":[516],"_smartButton":[16],"_touched":[516]}],[4,"kol-alert-wc",{"_alert":[516],"_hasCloser":[516,"_has-closer"],"_heading":[1],"_level":[2],"_on":[16],"_type":[1],"_variant":[1],"state":[32]}]]]]'),e))));
+import{p as promiseResolve,b as bootstrapLazy}from"./index-34c3d6f8.js";export{s as setNonce}from"./index-34c3d6f8.js";import{g as globalScripts}from"./app-globals-db727ab2.js";import"./index-bacdc4cb.js";import"./index-ff788b4b.js";import"./dev.utils-157f0499.js";import"./reuse-3a02afb9.js";const patchBrowser=()=>{const e=import.meta.url,a={};return""!==e&&(a.resourcesUrl=new URL(".",e).href),promiseResolve(a)};patchBrowser().then((e=>(globalScripts(),bootstrapLazy(JSON.parse('[["kol-button-wc_3",[[4,"kol-heading-wc",{"_label":[1],"_level":[2],"_secondaryHeadline":[1,"_secondary-headline"],"state":[32]}],[4,"kol-button-wc",{"_accessKey":[1,"_access-key"],"_ariaControls":[1,"_aria-controls"],"_ariaCurrent":[8,"_aria-current"],"_ariaExpanded":[516,"_aria-expanded"],"_ariaLabel":[1025,"_aria-label"],"_ariaSelected":[516,"_aria-selected"],"_customClass":[1,"_custom-class"],"_disabled":[516],"_icon":[1],"_iconAlign":[1,"_icon-align"],"_iconOnly":[516,"_icon-only"],"_id":[1],"_label":[1025],"_on":[16],"_role":[1],"_tabIndex":[2,"_tab-index"],"_tooltipAlign":[1,"_tooltip-align"],"_type":[1],"_value":[16],"_variant":[1],"state":[32]}],[4,"kol-span-wc",{"_icon":[1],"_iconOnly":[516,"_icon-only"],"_label":[1],"state":[32]}]]],["kol-table",[[33,"kol-table",{"_caption":[1],"_data":[1],"_headers":[1],"_minWidth":[1,"_min-width"],"_pagination":[8],"state":[32]}]]],["kol-input-adapter-leanup",[[1,"kol-input-adapter-leanup"]]],["kol-input-radio-group",[[1,"kol-input-radio-group",{"_accessKey":[1,"_access-key"],"_alert":[516],"_disabled":[516],"_error":[1],"_hideLabel":[516,"_hide-label"],"_hint":[1],"_id":[1],"_label":[1],"_list":[1],"_name":[1],"_on":[16],"_orientation":[1],"_required":[516],"_tabIndex":[2,"_tab-index"],"_touched":[516],"_value":[8]}]]],["kol-input-checkbox",[[33,"kol-input-checkbox",{"_accessKey":[1,"_access-key"],"_alert":[1540],"_checked":[1540],"_disabled":[516],"_error":[1],"_hideLabel":[516,"_hide-label"],"_hint":[1],"_icon":[1],"_id":[1],"_indeterminate":[1540],"_label":[1],"_name":[1],"_on":[16],"_required":[516],"_tabIndex":[2,"_tab-index"],"_touched":[1540],"_type":[1],"_value":[1],"_variant":[1],"state":[32]}]]],["kol-input-color",[[33,"kol-input-color",{"_accessKey":[1,"_access-key"],"_alert":[1540],"_autoComplete":[1,"_auto-complete"],"_disabled":[516],"_error":[1],"_hideLabel":[516,"_hide-label"],"_hint":[1],"_icon":[1],"_id":[1],"_label":[1],"_list":[1],"_name":[1],"_on":[16],"_smartButton":[16],"_tabIndex":[2,"_tab-index"],"_touched":[1540],"_value":[1],"state":[32]}]]],["kol-input-date",[[33,"kol-input-date",{"_accessKey":[1,"_access-key"],"_alert":[1540],"_autoComplete":[1,"_auto-complete"],"_disabled":[516],"_error":[1],"_hideLabel":[516,"_hide-label"],"_hint":[1],"_icon":[1],"_id":[1],"_label":[1],"_list":[1],"_max":[1],"_min":[1],"_name":[1],"_on":[16],"_readOnly":[516,"_read-only"],"_required":[516],"_smartButton":[16],"_step":[2],"_tabIndex":[2,"_tab-index"],"_touched":[1540],"_type":[1],"_value":[1025],"state":[32]}]]],["kol-input-email",[[33,"kol-input-email",{"_accessKey":[1,"_access-key"],"_alert":[1540],"_autoComplete":[1,"_auto-complete"],"_disabled":[516],"_error":[1],"_hideLabel":[516,"_hide-label"],"_hint":[1],"_icon":[1],"_id":[1],"_label":[1],"_list":[1],"_maxLength":[2,"_max-length"],"_multiple":[516],"_name":[1],"_on":[16],"_pattern":[1],"_placeholder":[1],"_readOnly":[516,"_read-only"],"_required":[516],"_size":[2],"_smartButton":[16],"_tabIndex":[2,"_tab-index"],"_touched":[1540],"_value":[1],"state":[32]}]]],["kol-input-file",[[33,"kol-input-file",{"_accept":[1],"_accessKey":[1,"_access-key"],"_alert":[1540],"_disabled":[516],"_error":[1],"_hideLabel":[516,"_hide-label"],"_hint":[1],"_icon":[1],"_id":[1],"_label":[1],"_multiple":[516],"_name":[1],"_on":[16],"_required":[516],"_smartButton":[16],"_tabIndex":[2,"_tab-index"],"_touched":[1540],"_value":[1],"state":[32]}]]],["kol-input-number",[[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],"_label":[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]}]]],["kol-input-password",[[33,"kol-input-password",{"_accessKey":[1,"_access-key"],"_alert":[1540],"_autoComplete":[1,"_auto-complete"],"_disabled":[516],"_error":[1],"_hideLabel":[516,"_hide-label"],"_hint":[1],"_icon":[1],"_id":[1],"_label":[1],"_maxLength":[2,"_max-length"],"_name":[1],"_on":[16],"_pattern":[1],"_placeholder":[1],"_readOnly":[516,"_read-only"],"_required":[516],"_size":[2],"_smartButton":[16],"_tabIndex":[2,"_tab-index"],"_touched":[1540],"_value":[1],"state":[32]}]]],["kol-input-range",[[33,"kol-input-range",{"_accessKey":[1,"_access-key"],"_alert":[1540],"_autoComplete":[1,"_auto-complete"],"_disabled":[516],"_error":[1],"_hideLabel":[516,"_hide-label"],"_hint":[1],"_icon":[1],"_id":[1],"_label":[1],"_list":[1],"_max":[2],"_min":[2],"_name":[1],"_on":[16],"_step":[2],"_tabIndex":[2,"_tab-index"],"_touched":[1540],"_value":[2],"state":[32]}]]],["kol-input-text",[[33,"kol-input-text",{"_accessKey":[1,"_access-key"],"_alert":[1540],"_autoComplete":[1,"_auto-complete"],"_disabled":[516],"_error":[1],"_hideLabel":[516,"_hide-label"],"_hint":[1],"_icon":[1],"_id":[1],"_label":[1],"_list":[1],"_maxLength":[2,"_max-length"],"_name":[1],"_on":[16],"_pattern":[1],"_placeholder":[1],"_readOnly":[516,"_read-only"],"_required":[516],"_size":[2],"_smartButton":[16],"_tabIndex":[2,"_tab-index"],"_touched":[1540],"_type":[1],"_value":[1025],"state":[32]}]]],["kol-textarea",[[33,"kol-textarea",{"_accessKey":[1,"_access-key"],"_adjustHeight":[516,"_adjust-height"],"_alert":[1540],"_disabled":[516],"_error":[1],"_hasCounter":[516,"_has-counter"],"_hideLabel":[516,"_hide-label"],"_hint":[1],"_id":[1],"_label":[1],"_maxLength":[2,"_max-length"],"_name":[1],"_on":[16],"_placeholder":[1],"_readOnly":[516,"_read-only"],"_resize":[1],"_required":[516],"_rows":[1026],"_tabIndex":[2,"_tab-index"],"_touched":[1540],"_value":[1],"state":[32]}]]],["kol-toast",[[33,"kol-toast",{"_alert":[516],"_hasCloser":[516,"_has-closer"],"_heading":[1],"_level":[2],"_on":[16],"_show":[1540],"_showDuration":[2,"_show-duration"],"_type":[1],"state":[32]}]]],["kol-link-group",[[33,"kol-link-group",{"_ariaLabel":[1,"_aria-label"],"_listStyleType":[1,"_list-style-type"],"_heading":[1],"_level":[2],"_links":[1],"_ordered":[516],"_orientation":[1],"state":[32]}]]],["kol-nav",[[33,"kol-nav",{"_ariaCurrentValue":[8,"_aria-current-value"],"_ariaLabel":[1,"_aria-label"],"_collapsible":[516],"_compact":[516],"_hasCompactButton":[516,"_has-compact-button"],"_orientation":[1],"_links":[1],"_variant":[1],"state":[32]}]]],["kol-accordion",[[33,"kol-accordion",{"_heading":[1],"_level":[2],"_on":[16],"_open":[1540],"state":[32]}]]],["kol-breadcrumb",[[33,"kol-breadcrumb",{"_ariaLabel":[1,"_aria-label"],"_links":[1],"state":[32]}]]],["kol-quote",[[33,"kol-quote",{"_caption":[1],"_href":[1],"_quote":[1],"_variant":[1],"state":[32]}]]],["kol-skip-nav",[[33,"kol-skip-nav",{"_ariaLabel":[1,"_aria-label"],"_links":[1],"state":[32]}]]],["kol-tabs",[[33,"kol-tabs",{"_ariaLabel":[1,"_aria-label"],"_on":[16],"_selected":[1538],"_tabs":[1],"_tabsAlign":[1,"_tabs-align"],"state":[32]}]]],["kol-version",[[33,"kol-version",{"_version":[1],"state":[32]}]]],["kol-button-link",[[33,"kol-button-link",{"_accessKey":[1,"_access-key"],"_ariaControls":[1,"_aria-controls"],"_ariaCurrent":[8,"_aria-current"],"_ariaExpanded":[516,"_aria-expanded"],"_ariaLabel":[1025,"_aria-label"],"_ariaSelected":[516,"_aria-selected"],"_disabled":[516],"_icon":[1],"_iconOnly":[516,"_icon-only"],"_id":[1],"_label":[1],"_on":[16],"_role":[1],"_tabIndex":[2,"_tab-index"],"_tooltipAlign":[1,"_tooltip-align"],"_type":[1],"_value":[16]}]]],["kol-link-button",[[33,"kol-link-button",{"_ariaControls":[1,"_aria-controls"],"_ariaCurrent":[8,"_aria-current"],"_ariaExpanded":[516,"_aria-expanded"],"_ariaLabel":[1,"_aria-label"],"_ariaSelected":[516,"_aria-selected"],"_customClass":[1,"_custom-class"],"_disabled":[516],"_download":[8],"_href":[1],"_icon":[1],"_iconOnly":[516,"_icon-only"],"_label":[1],"_on":[16],"_role":[1],"_tabIndex":[2,"_tab-index"],"_target":[1],"_targetDescription":[1,"_target-description"],"_tooltipAlign":[1,"_tooltip-align"],"_variant":[1]}]]],["kol-split-button",[[33,"kol-split-button",{"_accessKey":[1,"_access-key"],"_ariaControls":[1,"_aria-controls"],"_ariaCurrent":[8,"_aria-current"],"_ariaExpanded":[516,"_aria-expanded"],"_ariaLabel":[1025,"_aria-label"],"_ariaSelected":[516,"_aria-selected"],"_customClass":[1,"_custom-class"],"_disabled":[516],"_hideLabel":[516,"_hide-label"],"_icon":[1],"_iconOnly":[516,"_icon-only"],"_label":[1025],"_on":[16],"_role":[1],"_showDropdown":[1540,"_show-dropdown"],"_tabIndex":[2,"_tab-index"],"_tooltipAlign":[1,"_tooltip-align"],"_type":[1],"_value":[16],"_variant":[1],"state":[32]}]]],["kol-abbr",[[33,"kol-abbr",{"_tooltipAlign":[1,"_tooltip-align"],"_title":[1],"state":[32]}]]],["kol-details",[[33,"kol-details",{"_open":[1540],"_summary":[1],"state":[32]}]]],["kol-span",[[33,"kol-span",{"_icon":[1],"_iconOnly":[516,"_icon-only"],"_label":[1]}]]],["kol-button-group",[[33,"kol-button-group"]]],["kol-card",[[33,"kol-card",{"_hasFooter":[516,"_has-footer"],"_heading":[1],"_headline":[1],"_level":[2],"state":[32]}]]],["kol-form",[[1,"kol-form",{"_on":[16],"_requiredText":[8,"_required-text"],"state":[32]}]]],["kol-heading",[[33,"kol-heading",{"_label":[1],"_level":[2],"_secondaryHeadline":[1,"_secondary-headline"]}]]],["kol-icon-font-awesome",[[0,"kol-icon-font-awesome",{"_ariaLabel":[1,"_aria-label"],"_icon":[1],"_prefix":[1],"_part":[1]}]]],["kol-image",[[33,"kol-image",{"_alt":[1],"_loading":[1],"_sizes":[1],"_src":[1],"_srcset":[1],"state":[32]}]]],["kol-kolibri",[[33,"kol-kolibri",{"_animate":[516],"_color":[1],"_labeled":[516],"state":[32]}]]],["kol-logo",[[33,"kol-logo",{"_abbr":[1],"_org":[1],"state":[32]}]]],["kol-modal",[[33,"kol-modal",{"_activeElement":[1040],"_ariaLabel":[1,"_aria-label"],"_on":[16],"_width":[1],"state":[32]}]]],["kol-popover",[[4,"kol-popover",{"_align":[1],"_show":[1540],"state":[32]}]]],["kol-progress",[[33,"kol-progress",{"_label":[1],"_max":[2],"_type":[1],"_unit":[1],"_value":[2],"_variant":[1],"state":[32]}]]],["kol-spin",[[33,"kol-spin",{"_show":[516],"_variant":[1],"state":[32]}]]],["kol-icon",[[33,"kol-icon",{"_ariaLabel":[1,"_aria-label"],"_icon":[1],"_part":[1],"state":[32]}]]],["kol-icon-icofont",[[0,"kol-icon-icofont",{"_ariaLabel":[1,"_aria-label"],"_icon":[1],"_part":[1]}]]],["kol-symbol",[[0,"kol-symbol",{"_ariaLabel":[1,"_aria-label"],"_symbol":[1],"state":[32]}]]],["kol-tooltip",[[0,"kol-tooltip",{"_align":[1],"_id":[1],"_label":[1],"state":[32]}]]],["kol-pagination",[[33,"kol-pagination",{"_boundaryCount":[2,"_boundary-count"],"_customClass":[1,"_custom-class"],"_hasButtons":[8,"_has-buttons"],"_page":[2],"_pageSize":[1026,"_page-size"],"_pageSizeOptions":[1,"_page-size-options"],"_on":[16],"_siblingCount":[2,"_sibling-count"],"_tooltipAlign":[1,"_tooltip-align"],"_total":[2],"_variant":[1],"state":[32]}]]],["kol-input-radio",[[33,"kol-input-radio",{"_accessKey":[1,"_access-key"],"_alert":[1540],"_disabled":[516],"_error":[1],"_hideLabel":[516,"_hide-label"],"_hint":[1],"_id":[1],"_label":[1],"_list":[1],"_name":[1],"_on":[16],"_orientation":[1],"_required":[516],"_tabIndex":[2,"_tab-index"],"_touched":[1540],"_value":[8],"state":[32]}]]],["kol-badge",[[33,"kol-badge",{"_color":[1],"_icon":[1],"_iconOnly":[516,"_icon-only"],"_label":[1],"_smartButton":[1,"_smart-button"],"state":[32]}]]],["kol-select",[[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],"_label":[1],"_list":[1],"_multiple":[516],"_name":[1],"_on":[16],"_required":[516],"_size":[2],"_tabIndex":[2,"_tab-index"],"_touched":[1540],"_value":[1025],"state":[32]}]]],["kol-button-group-wc",[[4,"kol-button-group-wc",{"state":[32]}]]],["kol-indented-text",[[33,"kol-indented-text",{"state":[32]}]]],["kol-button",[[33,"kol-button",{"_accessKey":[1,"_access-key"],"_ariaControls":[1,"_aria-controls"],"_ariaCurrent":[8,"_aria-current"],"_ariaExpanded":[516,"_aria-expanded"],"_ariaLabel":[1,"_aria-label"],"_ariaSelected":[516,"_aria-selected"],"_customClass":[1,"_custom-class"],"_disabled":[516],"_icon":[1],"_iconAlign":[1,"_icon-align"],"_iconOnly":[516,"_icon-only"],"_id":[1],"_label":[1],"_on":[16],"_role":[1],"_tabIndex":[2,"_tab-index"],"_tooltipAlign":[1,"_tooltip-align"],"_type":[1],"_value":[16],"_variant":[1]}]]],["kol-link-wc",[[4,"kol-link-wc",{"_ariaControls":[1,"_aria-controls"],"_ariaCurrent":[8,"_aria-current"],"_ariaExpanded":[516,"_aria-expanded"],"_ariaLabel":[1,"_aria-label"],"_ariaSelected":[516,"_aria-selected"],"_disabled":[516],"_download":[8],"_href":[1],"_icon":[1],"_iconAlign":[1,"_icon-align"],"_iconOnly":[516,"_icon-only"],"_label":[1025],"_on":[16],"_role":[1],"_selector":[1],"_stealth":[516],"_tabIndex":[2,"_tab-index"],"_target":[1],"_targetDescription":[1,"_target-description"],"_tooltipAlign":[1,"_tooltip-align"],"_useCase":[1,"_use-case"],"state":[32]}]]],["kol-link",[[33,"kol-link",{"_ariaControls":[1,"_aria-controls"],"_ariaCurrent":[8,"_aria-current"],"_ariaExpanded":[516,"_aria-expanded"],"_ariaLabel":[1,"_aria-label"],"_ariaSelected":[516,"_aria-selected"],"_disabled":[516],"_download":[8],"_href":[1],"_icon":[1],"_iconAlign":[1,"_icon-align"],"_iconOnly":[516,"_icon-only"],"_label":[1],"_on":[16],"_role":[1],"_selector":[1],"_stealth":[516],"_tabIndex":[2,"_tab-index"],"_target":[1],"_targetDescription":[1,"_target-description"],"_tooltipAlign":[1,"_tooltip-align"],"_useCase":[1,"_use-case"]}]]],["kol-alert",[[33,"kol-alert",{"_alert":[516],"_hasCloser":[516,"_has-closer"],"_heading":[1],"_level":[2],"_on":[16],"_type":[1],"_variant":[1],"state":[32]}]]],["kol-alert-wc_2",[[4,"kol-input",{"_alert":[516],"_disabled":[516],"_error":[1],"_hideLabel":[516,"_hide-label"],"_hint":[1],"_icon":[16],"_id":[1],"_list":[1],"_readOnly":[516,"_read-only"],"_renderNoLabel":[516,"_render-no-label"],"_required":[516],"_smartButton":[16],"_touched":[516]}],[4,"kol-alert-wc",{"_alert":[516],"_hasCloser":[516,"_has-closer"],"_heading":[1],"_level":[2],"_on":[16],"_type":[1],"_variant":[1],"state":[32]}]]]]'),e))));

package/dist/esm/{label-58f2333f.js → label-559ca626.js} RENAMED Viewed

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{a as a11yHint,u as uiUxHint}from"./a11y.tipps-2e27f8e6.js";import{w as watchString}from"./prop.validators-2c20cdf8.js";import{i as isEmptyOrPrefixOf}from"./reuse-3a02afb9.js";const READABLE_CHARS=/[a-zA-Z0-9äöüÄÖÜß]/g,ONLY_NUMBERS=/^\d+$/;function countReadableChars(a){var e;return"string"==typeof a&&(null===(e=a.match(READABLE_CHARS))||void 0===e?void 0:e.length)||0}function hasEnoughReadableChars(a,e=1){return countReadableChars(a)>=e}function containsOnlyNumbers(a){return ONLY_NUMBERS.test(a)}const syncAriaLabelBeforePatch=(a,e,t,r)=>{const i=e.has("_ariaLabel")?e.get("_ariaLabel"):t.state._ariaLabel;if("string"==typeof i){const a=e.has("_label")?e.get("_label"):t.state._label;!1===isEmptyOrPrefixOf(a,i)&&("_ariaLabel"===r?e.set("_label",i):e.set("_ariaLabel",void 0),a11yHint("The different Aria label is not barrier-free. A different Aria label must start with the label text for reasons of accessibility for voice control."))}},validateAriaLabel=(a,e,t={})=>{var r;watchString(a,"_ariaLabel",e,{hooks:{afterPatch:(a,e,r,i)=>{var o,l;"function"==typeof(null===(o=t.hooks)||void 0===o?void 0:o.afterPatch)&&(null===(l=t.hooks)||void 0===l||l.afterPatch(a,e,r,i)),"string"==typeof a&&a.length>0&&!1===hasEnoughReadableChars(a,3)&&!1===containsOnlyNumbers(a)&&a11yHint(`The different aria label ("${a}") is not accessible. A different aria label should consist of at least three readable characters.`)},beforePatch:null===(r=t.hooks)||void 0===r?void 0:r.beforePatch}})},validateAriaLabelWithLabel=(a,e)=>{validateAriaLabel(a,e,{hooks:{beforePatch:syncAriaLabelBeforePatch}})},validateLabel=(a,e,t={})=>{var r;watchString(a,"_label",e,{hooks:{afterPatch:(a,e,r,i)=>{var o,l;"function"==typeof(null===(o=t.hooks)||void 0===o?void 0:o.afterPatch)&&(null===(l=t.hooks)||void 0===l||l.afterPatch(a,e,r,i)),"string"==typeof a&&!1===hasEnoughReadableChars(a,3)&&!1===containsOnlyNumbers(a)&&a11yHint(`The heading or label ("${a}") is not accessible. A label should consist of at least three readable characters.`),"string"==typeof a&&a.length>80&&uiUxHint("A heading or label should not be longer than 80 characters.")},beforePatch:null===(r=t.hooks)||void 0===r?void 0:r.beforePatch},required:!0})},validateLabelWithAriaLabel=(a,e)=>{validateLabel(a,e,{hooks:{beforePatch:syncAriaLabelBeforePatch}})};export{validateAriaLabelWithLabel as a,validateLabelWithAriaLabel as b,containsOnlyNumbers as c,hasEnoughReadableChars as h,validateLabel as v};
+import{a as a11yHint,u as uiUxHint}from"./a11y.tipps-2e27f8e6.js";import{w as watchString}from"./prop.validators-f81af56e.js";import{i as isEmptyOrPrefixOf}from"./reuse-3a02afb9.js";const READABLE_CHARS=/[a-zA-Z0-9äöüÄÖÜß]/g,ONLY_NUMBERS=/^\d+$/;function countReadableChars(a){var e;return"string"==typeof a&&(null===(e=a.match(READABLE_CHARS))||void 0===e?void 0:e.length)||0}function hasEnoughReadableChars(a,e=1){return countReadableChars(a)>=e}function containsOnlyNumbers(a){return ONLY_NUMBERS.test(a)}const syncAriaLabelBeforePatch=(a,e,t,r)=>{const i=e.has("_ariaLabel")?e.get("_ariaLabel"):t.state._ariaLabel;if("string"==typeof i){const a=e.has("_label")?e.get("_label"):t.state._label;!1===isEmptyOrPrefixOf(a,i)&&("_ariaLabel"===r?e.set("_label",i):e.set("_ariaLabel",void 0),a11yHint("The different Aria label is not barrier-free. A different Aria label must start with the label text for reasons of accessibility for voice control."))}},validateAriaLabel=(a,e,t={})=>{var r;watchString(a,"_ariaLabel",e,{hooks:{afterPatch:(a,e,r,i)=>{var o,l;"function"==typeof(null===(o=t.hooks)||void 0===o?void 0:o.afterPatch)&&(null===(l=t.hooks)||void 0===l||l.afterPatch(a,e,r,i)),"string"==typeof a&&a.length>0&&!1===hasEnoughReadableChars(a,3)&&!1===containsOnlyNumbers(a)&&a11yHint(`The different aria label ("${a}") is not accessible. A different aria label should consist of at least three readable characters.`)},beforePatch:null===(r=t.hooks)||void 0===r?void 0:r.beforePatch}})},validateAriaLabelWithLabel=(a,e)=>{validateAriaLabel(a,e,{hooks:{beforePatch:syncAriaLabelBeforePatch}})},validateLabel=(a,e,t={})=>{var r;watchString(a,"_label",e,{hooks:{afterPatch:(a,e,r,i)=>{var o,l;"function"==typeof(null===(o=t.hooks)||void 0===o?void 0:o.afterPatch)&&(null===(l=t.hooks)||void 0===l||l.afterPatch(a,e,r,i)),"string"==typeof a&&!1===hasEnoughReadableChars(a,3)&&!1===containsOnlyNumbers(a)&&a11yHint(`The heading or label ("${a}") is not accessible. A label should consist of at least three readable characters.`),"string"==typeof a&&a.length>80&&uiUxHint("A heading or label should not be longer than 80 characters.")},beforePatch:null===(r=t.hooks)||void 0===r?void 0:r.beforePatch},required:!0})},validateLabelWithAriaLabel=(a,e)=>{validateLabel(a,e,{hooks:{beforePatch:syncAriaLabelBeforePatch}})};export{validateAriaLabelWithLabel as a,validateLabelWithAriaLabel as b,containsOnlyNumbers as c,hasEnoughReadableChars as h,validateLabel as v};

package/dist/esm/{label-58f2333f.js.map → label-559ca626.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"label-~~58f2333f~~.js","mappings":"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","names":[],"sources":["./src/types/props/label.ts"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { a11yHint, uiUxHint } from '../../utils/a11y.tipps';\nimport { watchString, WatchStringOptions } from '../../utils/prop.validators';\nimport { isEmptyOrPrefixOf } from '../../utils/validator';\n\n/* types /\n\n/\n This is a regular expression that matches all readable characters.\n \n Interesting: https://stackoverflow.com/questions/150033/regular-expression-to-match-non-english-characters\n /\nconst READABLE_CHARS = /[a-zA-Z0-9äöüÄÖÜß]/g;\n\n/\n This is a regular expression that matches only numbers.\n /\nconst ONLY_NUMBERS = /^\\d+$/;\n\n/\n This function counts the number of readable characters in a string.\n * @param str The string to count.\n * @returns The number of readable characters in the string.\n /\nfunction countReadableChars(str: string): number {\n\treturn typeof str === 'string' ? str.match(READABLE_CHARS)?.length \|\| 0 : 0;\n}\n\n/\n This function checks if a string has at least a certain number of readable characters.\n * @param str The string to check.\n * @param min The minimum number of readable characters.\n * @returns True if the string has at least the minimum number of readable characters, false otherwise.\n /\nexport function hasEnoughReadableChars(str: string, min = 1): boolean {\n\treturn countReadableChars(str) >= min;\n}\n\n/\n This function checks if a string contains only numbers.\n * @param str The string to check.\n * @returns True if the string contains only numbers, false otherwise.\n /\nexport function containsOnlyNumbers(str: string): boolean {\n\treturn ONLY_NUMBERS.test(str);\n}\n\n/* de\n * Das Label dient der Beschriftung unterschiedlicher Elemente.\n * - Button -> label text\n * - Heading -> headline text\n * - Input, Select und Textarea -> label text\n * - Summary -> summary text\n * - Table -> caption text\n * - etc.\n \n Das Label ist häufig ein Pflichtattribut und kann leer gesetzt werden,\n * wenn man das Label mittels dem Expert-Slot überschreiben will.\n /\n/* en\n * The label is used to label different elements.\n * -Button -> label text\n * -Heading -> headline text\n * -Input, Select and Textarea -> label text\n * -Summary -> summary text\n * -Table -> caption text\n * -Etc.\n \n The label is often a mandatory attribute and can be set empty,\n * if you want to overwrite the label using the expert slot.\n /\nexport type PropLabel = {\n\tlabel: string;\n};\n\nexport type LabelProp = Generic.Element.Members<PropLabel, unknown>;\n\n/ validator /\n/\n Ein abweichendes Aria-Label muss aus Gründern der Barrierefreiheit für\n * die Sprachsteuerung mit dem Label-Text beginnen.\n */\nconst syncAriaLabelBeforePatch: Generic.Element.NextStateHooksCallback = (_nextValue, nextState, component: Generic.Element.Component, key): void => {\n\tconst ariaLabel: string \| undefined = nextState.has('_ariaLabel') ? (nextState.get('_ariaLabel') as string) : (component.state._ariaLabel as string);\n\tif (typeof ariaLabel === 'string') {\n\t\tconst label: string = nextState.has('_label') ? (nextState.get('_label') as string) : (component.state._label as string);\n\t\tif (isEmptyOrPrefixOf(label, ariaLabel) === false) {\n\t\t\tif (key === '_ariaLabel') {\n\t\t\t\tnextState.set('_label', ariaLabel);\n\t\t\t\t// smartSetTimeout(() => ((component as Generic.Element.Component & { _label: string })._label = ariaLabel), 50);\n\t\t\t} else {\n\t\t\t\tnextState.set('_ariaLabel', undefined);\n\t\t\t\t// smartSetTimeout(() => ((component as Generic.Element.Component & { _ariaLabel: string })._ariaLabel = label), 50);\n\t\t\t}\n\t\t\ta11yHint(\n\t\t\t\t`The different Aria label is not barrier-free. A different Aria label must start with the label text for reasons of accessibility for voice control.`\n\t\t\t);\n\t\t}\n\t}\n};\n\nconst validateAriaLabel = (component: Generic.Element.Component, value?: string, options: WatchStringOptions = {}): void => {\n\twatchString(component, '_ariaLabel', value, {\n\t\thooks: {\n\t\t\tafterPatch: (value, state, component, key) => {\n\t\t\t\tif (typeof options.hooks?.afterPatch === 'function') {\n\t\t\t\t\toptions.hooks?.afterPatch(value, state, component, key);\n\t\t\t\t}\n\t\t\t\tif (typeof value === 'string' && value.length > 0 && hasEnoughReadableChars(value, 3) === false && containsOnlyNumbers(value) === false) {\n\t\t\t\t\ta11yHint(`The different aria label (\"${value}\") is not accessible. A different aria label should consist of at least three readable characters.`);\n\t\t\t\t}\n\t\t\t},\n\t\t\tbeforePatch: options.hooks?.beforePatch,\n\t\t},\n\t});\n};\n\nexport const validateAriaLabelWithLabel = (component: Generic.Element.Component, value?: string): void => {\n\tvalidateAriaLabel(component, value, {\n\t\thooks: {\n\t\t\tbeforePatch: syncAriaLabelBeforePatch,\n\t\t},\n\t});\n};\n\nexport const validateLabel = (component: Generic.Element.Component, value?: string, options: WatchStringOptions = {}): void => {\n\twatchString(component, '_label', value, {\n\t\thooks: {\n\t\t\tafterPatch: (value, state, component, key) => {\n\t\t\t\tif (typeof options.hooks?.afterPatch === 'function') {\n\t\t\t\t\toptions.hooks?.afterPatch(value, state, component, key);\n\t\t\t\t}\n\t\t\t\tif (typeof value === 'string' && hasEnoughReadableChars(value, 3) === false && containsOnlyNumbers(value) === false) {\n\t\t\t\t\ta11yHint(`The heading or label (\"${value}\") is not accessible. A label should consist of at least three readable characters.`);\n\t\t\t\t}\n\t\t\t\tif (typeof value === 'string' && value.length > 80) {\n\t\t\t\t\tuiUxHint(`A heading or label should not be longer than 80 characters.`);\n\t\t\t\t}\n\t\t\t},\n\t\t\tbeforePatch: options.hooks?.beforePatch,\n\t\t},\n\t\trequired: true,\n\t});\n};\n\nexport const validateLabelWithAriaLabel = (component: Generic.Element.Component, value?: string): void => {\n\tvalidateLabel(component, value, {\n\t\thooks: {\n\t\t\tbeforePatch: syncAriaLabelBeforePatch,\n\t\t},\n\t});\n};\n"],"version":3}
1	+ {"file":"label-559ca626.js","mappings":"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","names":[],"sources":["./src/types/props/label.ts"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { a11yHint, uiUxHint } from '../../utils/a11y.tipps';\nimport { watchString, WatchStringOptions } from '../../utils/prop.validators';\nimport { isEmptyOrPrefixOf } from '../../utils/validator';\n\n/* types /\n\n/\n This is a regular expression that matches all readable characters.\n \n Interesting: https://stackoverflow.com/questions/150033/regular-expression-to-match-non-english-characters\n /\nconst READABLE_CHARS = /[a-zA-Z0-9äöüÄÖÜß]/g;\n\n/\n This is a regular expression that matches only numbers.\n /\nconst ONLY_NUMBERS = /^\\d+$/;\n\n/\n This function counts the number of readable characters in a string.\n * @param str The string to count.\n * @returns The number of readable characters in the string.\n /\nfunction countReadableChars(str: string): number {\n\treturn typeof str === 'string' ? str.match(READABLE_CHARS)?.length \|\| 0 : 0;\n}\n\n/\n This function checks if a string has at least a certain number of readable characters.\n * @param str The string to check.\n * @param min The minimum number of readable characters.\n * @returns True if the string has at least the minimum number of readable characters, false otherwise.\n /\nexport function hasEnoughReadableChars(str: string, min = 1): boolean {\n\treturn countReadableChars(str) >= min;\n}\n\n/\n This function checks if a string contains only numbers.\n * @param str The string to check.\n * @returns True if the string contains only numbers, false otherwise.\n /\nexport function containsOnlyNumbers(str: string): boolean {\n\treturn ONLY_NUMBERS.test(str);\n}\n\n/* de\n * Das Label dient der Beschriftung unterschiedlicher Elemente.\n * - Button -> label text\n * - Heading -> headline text\n * - Input, Select und Textarea -> label text\n * - Summary -> summary text\n * - Table -> caption text\n * - etc.\n \n Das Label ist häufig ein Pflichtattribut und kann leer gesetzt werden,\n * wenn man das Label mittels dem Expert-Slot überschreiben will.\n /\n/* en\n * The label is used to label different elements.\n * -Button -> label text\n * -Heading -> headline text\n * -Input, Select and Textarea -> label text\n * -Summary -> summary text\n * -Table -> caption text\n * -Etc.\n \n The label is often a mandatory attribute and can be set empty,\n * if you want to overwrite the label using the expert slot.\n /\nexport type PropLabel = {\n\tlabel: string;\n};\n\nexport type LabelProp = Generic.Element.Members<PropLabel, unknown>;\n\n/ validator /\n/\n Ein abweichendes Aria-Label muss aus Gründern der Barrierefreiheit für\n * die Sprachsteuerung mit dem Label-Text beginnen.\n */\nconst syncAriaLabelBeforePatch: Generic.Element.NextStateHooksCallback = (_nextValue, nextState, component: Generic.Element.Component, key): void => {\n\tconst ariaLabel: string \| undefined = nextState.has('_ariaLabel') ? (nextState.get('_ariaLabel') as string) : (component.state._ariaLabel as string);\n\tif (typeof ariaLabel === 'string') {\n\t\tconst label: string = nextState.has('_label') ? (nextState.get('_label') as string) : (component.state._label as string);\n\t\tif (isEmptyOrPrefixOf(label, ariaLabel) === false) {\n\t\t\tif (key === '_ariaLabel') {\n\t\t\t\tnextState.set('_label', ariaLabel);\n\t\t\t\t// smartSetTimeout(() => ((component as Generic.Element.Component & { _label: string })._label = ariaLabel), 50);\n\t\t\t} else {\n\t\t\t\tnextState.set('_ariaLabel', undefined);\n\t\t\t\t// smartSetTimeout(() => ((component as Generic.Element.Component & { _ariaLabel: string })._ariaLabel = label), 50);\n\t\t\t}\n\t\t\ta11yHint(\n\t\t\t\t`The different Aria label is not barrier-free. A different Aria label must start with the label text for reasons of accessibility for voice control.`\n\t\t\t);\n\t\t}\n\t}\n};\n\nconst validateAriaLabel = (component: Generic.Element.Component, value?: string, options: WatchStringOptions = {}): void => {\n\twatchString(component, '_ariaLabel', value, {\n\t\thooks: {\n\t\t\tafterPatch: (value, state, component, key) => {\n\t\t\t\tif (typeof options.hooks?.afterPatch === 'function') {\n\t\t\t\t\toptions.hooks?.afterPatch(value, state, component, key);\n\t\t\t\t}\n\t\t\t\tif (typeof value === 'string' && value.length > 0 && hasEnoughReadableChars(value, 3) === false && containsOnlyNumbers(value) === false) {\n\t\t\t\t\ta11yHint(`The different aria label (\"${value}\") is not accessible. A different aria label should consist of at least three readable characters.`);\n\t\t\t\t}\n\t\t\t},\n\t\t\tbeforePatch: options.hooks?.beforePatch,\n\t\t},\n\t});\n};\n\nexport const validateAriaLabelWithLabel = (component: Generic.Element.Component, value?: string): void => {\n\tvalidateAriaLabel(component, value, {\n\t\thooks: {\n\t\t\tbeforePatch: syncAriaLabelBeforePatch,\n\t\t},\n\t});\n};\n\nexport const validateLabel = (component: Generic.Element.Component, value?: string, options: WatchStringOptions = {}): void => {\n\twatchString(component, '_label', value, {\n\t\thooks: {\n\t\t\tafterPatch: (value, state, component, key) => {\n\t\t\t\tif (typeof options.hooks?.afterPatch === 'function') {\n\t\t\t\t\toptions.hooks?.afterPatch(value, state, component, key);\n\t\t\t\t}\n\t\t\t\tif (typeof value === 'string' && hasEnoughReadableChars(value, 3) === false && containsOnlyNumbers(value) === false) {\n\t\t\t\t\ta11yHint(`The heading or label (\"${value}\") is not accessible. A label should consist of at least three readable characters.`);\n\t\t\t\t}\n\t\t\t\tif (typeof value === 'string' && value.length > 80) {\n\t\t\t\t\tuiUxHint(`A heading or label should not be longer than 80 characters.`);\n\t\t\t\t}\n\t\t\t},\n\t\t\tbeforePatch: options.hooks?.beforePatch,\n\t\t},\n\t\trequired: true,\n\t});\n};\n\nexport const validateLabelWithAriaLabel = (component: Generic.Element.Component, value?: string): void => {\n\tvalidateLabel(component, value, {\n\t\thooks: {\n\t\t\tbeforePatch: syncAriaLabelBeforePatch,\n\t\t},\n\t});\n};\n"],"version":3}