npm - @public-ui/components - Versions diffs - 1.3.0 → 1.3.3-rc.0 - Mend

@public-ui/components 1.3.0 → 1.3.3-rc.0

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

Files changed (359) hide show

package/dist/components/component2.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"component2.js","mappings":";;;;;;AAAA,MAAM,eAAe,GAAG,yv8OAAyv8O;;MC4Bpw8O,OAAO;;;;;;;;iBAyCa;MAC/B,UAAU,EAAE,EAAE;MACd,KAAK,EAAE,mBAAmB;KAC1B;;EA3CM,MAAM;IACZ,QACC,EAAC,IAAI,QACJ,wBACc,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,GAAG,SAAS,GAAG,MAAM,gBAOtD,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,UAAU,GAAG,SAAS,EAChF,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EACvB,IAAI,EAAE,OAAO,OAAO,IAAI,CAAC,KAAK,KAAK,QAAQ,GAAG,IAAI,IAAI,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE,EACrE,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,GAAG,KAAK,GAAG,SAAS,GACtD,CACC,EACN;GACF;EA+BM,iBAAiB,CAAC,KAAc;IACtC,WAAW,CAAC,IAAI,EAAE,YAAY,EAAE,KAAK,EAAE;MACtC,QAAQ,EAAE,IAAI;KACd,CAAC,CAAC;GACH;EAMM,YAAY,CAAC,KAAc;IACjC,WAAW,CAAC,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE;MACjC,QAAQ,EAAE,IAAI;KACd,CAAC,CAAC;GACH;EAMM,YAAY,CAAC,KAAc;IACjC,WAAW,CAAC,IAAI,EAAE,OAAO,EAAE,KAAK,CAAC,CAAC;GAClC;EAKM,iBAAiB;IACvB,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;IACxC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC9B,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;GAC9B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/icon/style.sass?tag=kol-icon&mode=default&encapsulation=shadow","./src/components/icon/component.tsx"],"sourcesContent":["@use '../../assets/codicons/codicon.css'\n@use '../../assets/fontawesome-free/~~v6/~~css/all.css'\n@use '../../assets/icofont/icofont.css'\n\n@import ../style\n\n:host\n\tcolor: inherit\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { AriaLabel } from '../../types/aria-label';\nimport { watchString } from '../../utils/prop.validators';\n\n/*\n API\n /\ntype RequiredProps = AriaLabel & {\n\ticon: string;\n};\ntype OptionalProps = {\n\tpart: string;\n};\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = RequiredProps;\ntype OptionalStates = OptionalProps;\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n@Component({\n\ttag: 'kol-icon',\n\tstyleUrls: {\n\t\tdefault: './style.sass',\n\t},\n\tshadow: true,\n})\nexport class KolIcon implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<i\n\t\t\t\t\taria-hidden={this.state._ariaLabel.length > 0 ? undefined : 'true'}\n\t\t\t\t\t/\n\t\t\t\t\t Die Auszeichnung `aria-hidden` ist eigentlich nicht erforderlich, da die aktuellen\n\t\t\t\t\t * Screenreader, wie NVDA und JAWS, es auch ohne `aria-hidden` nicht vorlesen.\n\t\t\t\t\t \n\t\t\t\t\t Referenz: https://www.w3.org/TR/wai-aria/states_and_properties#aria-hidden\n\t\t\t\t\t /\n\t\t\t\t\taria-label={this.state._ariaLabel.length > 0 ? this.state._ariaLabel : undefined}\n\t\t\t\t\tclass={this.state._icon}\n\t\t\t\t\tpart={`icon${typeof this._part === 'string' ? ` ${this._part}` : ''}`}\n\t\t\t\t\trole={this.state._ariaLabel.length > 0 ? 'img' : undefined}\n\t\t\t\t></i>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/\n\t Gibt das Aria-Label am Icon an.\n\t /\n\t@Prop() public _ariaLabel!: string;\n\n\t/\n\t Gibt einen Identifier eines Icons aus den Icon's an.\n\t /\n\t@Prop() public _icon!: string;\n\n\t/\n\t Gibt den Identifier für den CSS-Part an, um das Icon von Außen ändern zu können. (https://meowni.ca/posts/part-theme-explainer/)\n\t/*\n\t @deprecated Das Styling sollte stets über CSS erfolgen.\n\t /\n\t@Prop() public _part?: string;\n\n\t/\n\t @see: components/abbr/component.tsx (@State)\n\t /\n\t@State() public state: States = {\n\t\t_ariaLabel: '',\n\t\t_icon: 'fa-solid fa-house',\n\t};\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_ariaLabel')\n\tpublic validateAriaLabel(value?: string): void {\n\t\twatchString(this, '_ariaLabel', value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_icon')\n\tpublic validateIcon(value?: string): void {\n\t\twatchString(this, '_icon', value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_part')\n\tpublic validatePart(value?: string): void {\n\t\twatchString(this, '_part', value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAriaLabel(this._ariaLabel);\n\t\tthis.validateIcon(this._icon);\n\t\tthis.validatePart(this._part);\n\t}\n}\n"],"version":3}
1	+ {"file":"component2.js","mappings":";;;;;;AAAA,MAAM,eAAe,GAAG,yv8OAAyv8O;;MC4Bpw8O,OAAO;;;;;;;;iBAyCa;MAC/B,UAAU,EAAE,EAAE;MACd,KAAK,EAAE,mBAAmB;KAC1B;;EA3CM,MAAM;IACZ,QACC,EAAC,IAAI,QACJ,wBACc,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,GAAG,SAAS,GAAG,MAAM,gBAOtD,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,UAAU,GAAG,SAAS,EAChF,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EACvB,IAAI,EAAE,OAAO,OAAO,IAAI,CAAC,KAAK,KAAK,QAAQ,GAAG,IAAI,IAAI,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE,EACrE,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,GAAG,KAAK,GAAG,SAAS,GACtD,CACC,EACN;GACF;EA+BM,iBAAiB,CAAC,KAAc;IACtC,WAAW,CAAC,IAAI,EAAE,YAAY,EAAE,KAAK,EAAE;MACtC,QAAQ,EAAE,IAAI;KACd,CAAC,CAAC;GACH;EAMM,YAAY,CAAC,KAAc;IACjC,WAAW,CAAC,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE;MACjC,QAAQ,EAAE,IAAI;KACd,CAAC,CAAC;GACH;EAMM,YAAY,CAAC,KAAc;IACjC,WAAW,CAAC,IAAI,EAAE,OAAO,EAAE,KAAK,CAAC,CAAC;GAClC;EAKM,iBAAiB;IACvB,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;IACxC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC9B,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;GAC9B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/icon/style.sass?tag=kol-icon&mode=default&encapsulation=shadow","./src/components/icon/component.tsx"],"sourcesContent":["@use '../../assets/codicons/codicon.css'\n@use '../../assets/fontawesome-free/css/all.css'\n@use '../../assets/icofont/icofont.css'\n\n@import ../style\n\n:host\n\tcolor: inherit\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { AriaLabel } from '../../types/aria-label';\nimport { watchString } from '../../utils/prop.validators';\n\n/*\n API\n /\ntype RequiredProps = AriaLabel & {\n\ticon: string;\n};\ntype OptionalProps = {\n\tpart: string;\n};\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = RequiredProps;\ntype OptionalStates = OptionalProps;\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n@Component({\n\ttag: 'kol-icon',\n\tstyleUrls: {\n\t\tdefault: './style.sass',\n\t},\n\tshadow: true,\n})\nexport class KolIcon implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<i\n\t\t\t\t\taria-hidden={this.state._ariaLabel.length > 0 ? undefined : 'true'}\n\t\t\t\t\t/\n\t\t\t\t\t Die Auszeichnung `aria-hidden` ist eigentlich nicht erforderlich, da die aktuellen\n\t\t\t\t\t * Screenreader, wie NVDA und JAWS, es auch ohne `aria-hidden` nicht vorlesen.\n\t\t\t\t\t \n\t\t\t\t\t Referenz: https://www.w3.org/TR/wai-aria/states_and_properties#aria-hidden\n\t\t\t\t\t /\n\t\t\t\t\taria-label={this.state._ariaLabel.length > 0 ? this.state._ariaLabel : undefined}\n\t\t\t\t\tclass={this.state._icon}\n\t\t\t\t\tpart={`icon${typeof this._part === 'string' ? ` ${this._part}` : ''}`}\n\t\t\t\t\trole={this.state._ariaLabel.length > 0 ? 'img' : undefined}\n\t\t\t\t></i>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/\n\t Gibt das Aria-Label am Icon an.\n\t /\n\t@Prop() public _ariaLabel!: string;\n\n\t/\n\t Gibt einen Identifier eines Icons aus den Icon's an.\n\t /\n\t@Prop() public _icon!: string;\n\n\t/\n\t Gibt den Identifier für den CSS-Part an, um das Icon von Außen ändern zu können. (https://meowni.ca/posts/part-theme-explainer/)\n\t/*\n\t @deprecated Das Styling sollte stets über CSS erfolgen.\n\t /\n\t@Prop() public _part?: string;\n\n\t/\n\t @see: components/abbr/component.tsx (@State)\n\t /\n\t@State() public state: States = {\n\t\t_ariaLabel: '',\n\t\t_icon: 'fa-solid fa-house',\n\t};\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_ariaLabel')\n\tpublic validateAriaLabel(value?: string): void {\n\t\twatchString(this, '_ariaLabel', value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_icon')\n\tpublic validateIcon(value?: string): void {\n\t\twatchString(this, '_icon', value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_part')\n\tpublic validatePart(value?: string): void {\n\t\twatchString(this, '_part', value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAriaLabel(this._ariaLabel);\n\t\tthis.validateIcon(this._icon);\n\t\tthis.validatePart(this._part);\n\t}\n}\n"],"version":3}

package/dist/components/component3.js CHANGED Viewed

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";import{q as objectObjectHandler,t as parseJson,a as watchValidator,u as deprecatedHint,w as watchString,e as a11yHint,k as watchBoolean}from"./prop.validators.js";import{d as defineCustomElement$1}from"./component2.js";const isObject=t=>"object"==typeof t&&null!==t,isString=(t,e=0)=>"string"==typeof t&&t.length>=e,isStyle=t=>{if("object"!=typeof t||null===t)return isString(t,1);for(const e in t)if(!1===isString(e,1))return!1;return!0},isPrefixOf=(t,e)=>0===e.length&&new RegExp(`^${t}`).test(e),isEmptyOrPrefixOf=(t,e)=>0===e.length||isPrefixOf(t,e),STATE_CHANGE_EVENT=new Event("StateChange"),mapCustomIcon=(t,e,i)=>{isObject(i)?t[e]=i:isString(i,1)&&(t[e]={icon:i})},mapIconProp2State=(t,e)=>{let i={};if(isString(t,1))if("right"===e)i={right:{icon:t}};else i={left:{icon:t}};else"object"==typeof t&&null!==t&&(mapCustomIcon(i,"top",t.top),mapCustomIcon(i,"right",t.right),mapCustomIcon(i,"bottom",t.bottom),mapCustomIcon(i,"left",t.left));return i},beforePatchIcon=t=>{var e,i,n,o,a,l,s;if(null===(e=t.nextState)||void 0===e?void 0:e.has("_icon")){const e=null===(i=t.nextState)||void 0===i?void 0:i.get("_icon"),a=(null===(n=t.nextState)||void 0===n?void 0:n.get("_iconAlign"))||t.state._iconAlign;null===(o=t.nextState)||void 0===o||o.set("_icon",mapIconProp2State(e,a))}else if(null===(a=t.nextState)||void 0===a?void 0:a.has("_iconAlign")){const e=t.state._iconAlign;null===(l=t.nextState)||void 0===l||l.set("_icon",{[e]:void 0,[null===(s=t.nextState)||void 0===s?void 0:s.get("_iconAlign")]:t.state._icon[e]})}},isIcon=t=>"object"==typeof t&&null!==t&&(void 0===t.style||isStyle(t.style))&&isString(t.icon,1),validateIcon=(t,e)=>{objectObjectHandler(e,(()=>{try{e=parseJson(e)}catch(t){}watchValidator(t,"_icon",(t=>null===t||isString(t,1)||"object"==typeof t&&null!==t&&(isString(t.left,1)||isIcon(t.left)||isString(t.right,1)||isIcon(t.right)||isString(t.top,1)||isIcon(t.top)||isString(t.bottom,1)||isIcon(t.bottom))),new Set(["KoliBriIcon"]),e,{hooks:{beforePatch:(e,i)=>{null===e&&i.set("_icon",{}),beforePatchIcon(t)}},required:!0})}))},watchIconAlign=(t,e)=>{deprecatedHint("Das Property _icon-align bzw. _iconAlign ist veraltet. Die Ausrichtung der Icon's kann jetzt direkt über das _icon-Property vorgenommen werden. (v1.1.10: https://public-ui.github.io/?path=/story/backlog-und-changelog--page)"),watchValidator(t,"_iconAlign",(t=>"left"===t||"right"===t),new Set(["Alignment {left, right, top, bottom}"]),e,{hooks:{beforePatch:()=>{beforePatchIcon(t)}}})},syncAriaLabelBeforePatch=(t,e,i,n)=>{const o=e.has("_ariaLabel")?e.get("_ariaLabel"):i.state._ariaLabel;if("string"==typeof o){const t=e.has("_label")?e.get("_label"):i.state._label;!1===(a=t,0===(l=o).length||isPrefixOf(a,l))&&("_ariaLabel"===n?e.set("_label",o):e.set("_ariaLabel",t),a11yHint("Das abweichende Aria-Label am Schalter ist nicht barrierefrei. Ein abweichendes Aria-Label muss aus Gründern der Barrierefreiheit für die Sprachsteuerung mit dem Label-Text beginnen."))}var a,l},validateAriaLabel=(t,e)=>{watchString(t,"_ariaLabel",e,{hooks:{beforePatch:syncAriaLabelBeforePatch}})},validateLabel=(t,e)=>{watchString(t,"_label",e,{hooks:{beforePatch:syncAriaLabelBeforePatch},required:!0})},removeNode=t=>{t instanceof Node&&setTimeout((()=>{var e,i;null===(e=t.parentElement)||void 0===e||e.removeChild(t),null===(i=t.parentNode)||void 0===i||i.removeChild(t)}))},KolSpanWc=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this._icon=void 0,this._iconOnly=!1,this._label=void 0,this.state={_icon:{},_iconOnly:!1,_label:""}}render(){return h(Host,{class:{"icon-only":this.state._iconOnly}},this.state._icon.top&&h("kol-icon",{class:{"icon top":!0},style:this.state._icon.top.style,_ariaLabel:"",_icon:this.state._icon.top.icon}),h("span",null,this.state._icon.left&&h("kol-icon",{class:{"icon left":!0},style:this.state._icon.left.style,_ariaLabel:"",_icon:this.state._icon.left.icon}),!0!==this.state._iconOnly&&this.state._label.length>0?h("span",null,this.state._label):"",h("span",{ref:this.state._label.length>0||!0===this.state._iconOnly?removeNode:void 0},h("slot",{name:"expert"})),this.state._icon.right&&h("kol-icon",{class:{"icon right":!0},style:this.state._icon.right.style,_ariaLabel:"",_icon:this.state._icon.right.icon})),this.state._icon.bottom&&h("kol-icon",{class:{"icon bottom":!0},style:this.state._icon.bottom.style,_ariaLabel:"",_icon:this.state._icon.bottom.icon}))}validateIcon(t){validateIcon(this,t)}validateIconOnly(t){watchBoolean(this,"_iconOnly",t)}validateLabel(t){validateLabel(this,t)}componentWillLoad(){this.validateIcon(this._icon),this.validateIconOnly(this._iconOnly),this.validateLabel(this._label)}static get watchers(){return{_icon:["validateIcon"],_iconOnly:["validateIconOnly"],_label:["validateLabel"]}}},[4,"kol-span-wc",{_icon:[1],_iconOnly:[516,"_icon-only"],_label:[1],state:[32]}]);function defineCustomElement(){if("undefined"==typeof customElements)return;["kol-span-wc","kol-icon"].forEach((t=>{switch(t){case"kol-span-wc":customElements.get(t)||customElements.define(t,KolSpanWc);break;case"kol-icon":customElements.get(t)||defineCustomElement$1()}}))}export{KolSpanWc as K,STATE_CHANGE_EVENT as S,validateIcon as a,validateLabel as b,isString as c,defineCustomElement as d,isIcon as e,isObject as i,validateAriaLabel as v,watchIconAlign as w};
+import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";import{q as objectObjectHandler,t as parseJson,a as watchValidator,u as deprecatedHint,w as watchString,e as a11yHint,k as watchBoolean}from"./prop.validators.js";import{d as defineCustomElement$1}from"./component2.js";const isObject=t=>"object"==typeof t&&null!==t,isString=(t,e=0)=>"string"==typeof t&&t.length>=e,isStyle=t=>{if("object"!=typeof t||null===t)return isString(t,1);for(const e in t)if(!1===isString(e,1))return!1;return!0},isPrefixOf=(t,e)=>new RegExp(`^${t}`).test(e),isEmptyOrPrefixOf=(t,e)=>0===e.length||isPrefixOf(t,e),STATE_CHANGE_EVENT=new Event("StateChange"),mapCustomIcon=(t,e,i)=>{isObject(i)?t[e]=i:isString(i,1)&&(t[e]={icon:i})},mapIconProp2State=(t,e)=>{let i={};if(isString(t,1))if("right"===e)i={right:{icon:t}};else i={left:{icon:t}};else"object"==typeof t&&null!==t&&(mapCustomIcon(i,"top",t.top),mapCustomIcon(i,"right",t.right),mapCustomIcon(i,"bottom",t.bottom),mapCustomIcon(i,"left",t.left));return i},beforePatchIcon=t=>{var e,i,n,o,a,s,l;if(null===(e=t.nextState)||void 0===e?void 0:e.has("_icon")){const e=null===(i=t.nextState)||void 0===i?void 0:i.get("_icon"),a=(null===(n=t.nextState)||void 0===n?void 0:n.get("_iconAlign"))||t.state._iconAlign;null===(o=t.nextState)||void 0===o||o.set("_icon",mapIconProp2State(e,a))}else if(null===(a=t.nextState)||void 0===a?void 0:a.has("_iconAlign")){const e=t.state._iconAlign;null===(s=t.nextState)||void 0===s||s.set("_icon",{[e]:void 0,[null===(l=t.nextState)||void 0===l?void 0:l.get("_iconAlign")]:t.state._icon[e]})}},isIcon=t=>"object"==typeof t&&null!==t&&(void 0===t.style||isStyle(t.style))&&isString(t.icon,1),validateIcon=(t,e)=>{objectObjectHandler(e,(()=>{try{e=parseJson(e)}catch(t){}watchValidator(t,"_icon",(t=>null===t||isString(t,1)||"object"==typeof t&&null!==t&&(isString(t.left,1)||isIcon(t.left)||isString(t.right,1)||isIcon(t.right)||isString(t.top,1)||isIcon(t.top)||isString(t.bottom,1)||isIcon(t.bottom))),new Set(["KoliBriIcon"]),e,{hooks:{beforePatch:(e,i)=>{null===e&&i.set("_icon",{}),beforePatchIcon(t)}},required:!0})}))},watchIconAlign=(t,e)=>{deprecatedHint("Das Property _icon-align bzw. _iconAlign ist veraltet. Die Ausrichtung der Icon's kann jetzt direkt über das _icon-Property vorgenommen werden. (v1.1.10: https://public-ui.github.io/?path=/story/backlog-und-changelog--page)"),watchValidator(t,"_iconAlign",(t=>"left"===t||"right"===t),new Set(["Alignment {left, right, top, bottom}"]),e,{hooks:{beforePatch:()=>{beforePatchIcon(t)}}})},syncAriaLabelBeforePatch=(t,e,i,n)=>{const o=e.has("_ariaLabel")?e.get("_ariaLabel"):i.state._ariaLabel;if("string"==typeof o){const t=e.has("_label")?e.get("_label"):i.state._label;!1===(a=t,0===(s=o).length||isPrefixOf(a,s))&&("_ariaLabel"===n?e.set("_label",o):e.set("_ariaLabel",t),a11yHint("Das abweichende Aria-Label am Schalter ist nicht barrierefrei. Ein abweichendes Aria-Label muss aus Gründern der Barrierefreiheit für die Sprachsteuerung mit dem Label-Text beginnen."))}var a,s},validateAriaLabel=(t,e)=>{watchString(t,"_ariaLabel",e,{hooks:{beforePatch:syncAriaLabelBeforePatch}})},validateLabel=(t,e)=>{watchString(t,"_label",e,{hooks:{beforePatch:syncAriaLabelBeforePatch},required:!0})},removeNode=t=>{t instanceof Node&&setTimeout((()=>{var e,i;null===(e=t.parentElement)||void 0===e||e.removeChild(t),null===(i=t.parentNode)||void 0===i||i.removeChild(t)}))},KolSpanWc=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this._icon=void 0,this._iconOnly=!1,this._label=void 0,this.state={_icon:{},_iconOnly:!1,_label:""}}render(){return h(Host,{class:{"icon-only":this.state._iconOnly}},this.state._icon.top&&h("kol-icon",{class:{"icon top":!0},style:this.state._icon.top.style,_ariaLabel:"",_icon:this.state._icon.top.icon}),h("span",null,this.state._icon.left&&h("kol-icon",{class:{"icon left":!0},style:this.state._icon.left.style,_ariaLabel:"",_icon:this.state._icon.left.icon}),!0!==this.state._iconOnly&&this.state._label.length>0?h("span",null,this.state._label):"",h("span",{ref:this.state._label.length>0||!0===this.state._iconOnly?removeNode:void 0},h("slot",{name:"expert"})),this.state._icon.right&&h("kol-icon",{class:{"icon right":!0},style:this.state._icon.right.style,_ariaLabel:"",_icon:this.state._icon.right.icon})),this.state._icon.bottom&&h("kol-icon",{class:{"icon bottom":!0},style:this.state._icon.bottom.style,_ariaLabel:"",_icon:this.state._icon.bottom.icon}))}validateIcon(t){validateIcon(this,t)}validateIconOnly(t){watchBoolean(this,"_iconOnly",t)}validateLabel(t){validateLabel(this,t)}componentWillLoad(){this.validateIcon(this._icon),this.validateIconOnly(this._iconOnly),this.validateLabel(this._label)}static get watchers(){return{_icon:["validateIcon"],_iconOnly:["validateIconOnly"],_label:["validateLabel"]}}},[4,"kol-span-wc",{_icon:[1],_iconOnly:[516,"_icon-only"],_label:[1],state:[32]}]);function defineCustomElement(){if("undefined"==typeof customElements)return;["kol-span-wc","kol-icon"].forEach((t=>{switch(t){case"kol-span-wc":customElements.get(t)||customElements.define(t,KolSpanWc);break;case"kol-icon":customElements.get(t)||defineCustomElement$1()}}))}export{KolSpanWc as K,STATE_CHANGE_EVENT as S,validateIcon as a,validateLabel as b,isString as c,defineCustomElement as d,isIcon as e,isObject as i,validateAriaLabel as v,watchIconAlign as w};

package/dist/components/component3.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"component3.js","mappings":"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","names":[],"sources":["./src/utils/validator.ts","./src/utils/validators/icon.ts","./src/utils/validators/label.ts","./src/components/span/component.tsx"],"sourcesContent":["export const isObject = (value: unknown): boolean => typeof value === 'object' && value !== null;\n\nexport const isString = (value: unknown, minLength = 0): boolean => typeof value === 'string' && value.length >= minLength;\n\nexport const isStyle = (style?: Record<string, string>): boolean => {\n\tif (typeof style === 'object' && style !== null) {\n\t\tfor (const property in style) {\n\t\t\tif (isString(property, 1) === false) {\n\t\t\t\treturn false;\n\t\t\t}\n\t\t}\n\t} else {\n\t\treturn isString(style, 1);\n\t}\n\treturn true;\n};\n\nconst isPrefixOf = (prefix: string, text: string) => text.length === 0 && new RegExp(`^${prefix}`).test(text);\n\n/*\n Validate, if a text contains a prefix.\n /\nexport const isEmptyOrPrefixOf = (prefix: string, text: string) => text.length === 0 \|\| isPrefixOf(prefix, text);\n\n/\n Fix event instance for state changes.\n /\nexport const STATE_CHANGE_EVENT = new Event('StateChange');\n","import { Generic } from '@a11y-ui/core';\nimport { ButtonStates } from '../../types/button-link';\nimport { AnyIconFontClass, KoliBriAllIcon, KoliBriCustomIcon, KoliBriIconProp, KoliBriIconState } from '../../types/icon';\nimport { Alignment } from '../../types/props/alignment';\nimport { deprecatedHint } from '../a11y.tipps';\nimport { objectObjectHandler, parseJson, watchValidator } from '../prop.validators';\nimport { isObject, isString, isStyle } from '../validator';\n\nconst mapCustomIcon = (state: KoliBriIconState, alignment: Alignment \| 'top' \| 'bottom', icon?: AnyIconFontClass \| KoliBriCustomIcon) => {\n\tif (isObject(icon)) {\n\t\tstate[alignment] = icon as KoliBriCustomIcon;\n\t} else if (isString(icon, 1)) {\n\t\tstate[alignment] = {\n\t\t\ticon: icon as AnyIconFontClass,\n\t\t};\n\t}\n};\n\nexport const mapIconProp2State = (icon: KoliBriIconProp, iconAlign?: Alignment): KoliBriIconState => {\n\tlet state: KoliBriIconState = {};\n\tif (isString(icon, 1)) {\n\t\tswitch (iconAlign) {\n\t\t\tcase 'right':\n\t\t\t\tstate = {\n\t\t\t\t\tright: {\n\t\t\t\t\t\ticon: icon as AnyIconFontClass,\n\t\t\t\t\t},\n\t\t\t\t};\n\t\t\t\tbreak;\n\t\t\tdefault:\n\t\t\t\tstate = {\n\t\t\t\t\tleft: {\n\t\t\t\t\t\ticon: icon as AnyIconFontClass,\n\t\t\t\t\t},\n\t\t\t\t};\n\t\t}\n\t} else if (typeof icon === 'object' && icon !== null) {\n\t\tmapCustomIcon(state, 'top', icon.top);\n\t\tmapCustomIcon(state, 'right', icon.right);\n\t\tmapCustomIcon(state, 'bottom', icon.bottom);\n\t\tmapCustomIcon(state, 'left', icon.left);\n\t}\n\treturn state;\n};\n\nconst beforePatchIcon = (component: Generic.Element.Component): void => {\n\tif (component.nextState?.has('_icon')) {\n\t\tconst icon = component.nextState?.get('_icon') as KoliBriIconProp;\n\t\tconst iconAlign = (component.nextState?.get('_iconAlign') as Alignment) \|\| (component.state as ButtonStates)._iconAlign;\n\t\tcomponent.nextState?.set('_icon', mapIconProp2State(icon, iconAlign));\n\t} else if (component.nextState?.has('_iconAlign')) {\n\t\tconst lastIconAlign = (component.state as ButtonStates)._iconAlign;\n\t\tcomponent.nextState?.set('_icon', {\n\t\t\t[lastIconAlign]: undefined,\n\t\t\t[component.nextState?.get('_iconAlign') as Alignment]: (component.state as ButtonStates)._icon[lastIconAlign],\n\t\t});\n\t}\n};\n\nexport const isIcon = (value?: unknown): boolean =>\n\ttypeof value === 'object' &&\n\tvalue !== null &&\n\t(typeof (value as KoliBriCustomIcon).style === 'undefined' \|\| isStyle((value as KoliBriCustomIcon).style)) &&\n\tisString((value as KoliBriCustomIcon).icon, 1);\n\nexport const validateIcon = (component: Generic.Element.Component, value?: KoliBriIconProp): void => {\n\tobjectObjectHandler(value, () => {\n\t\ttry {\n\t\t\tvalue = parseJson<KoliBriIconProp>(value as string);\n\t\t} catch (e) {\n\t\t\t// value behält den ursprünglichen Wert\n\t\t}\n\t\twatchValidator(\n\t\t\tcomponent,\n\t\t\t'_icon',\n\t\t\t(value): boolean => {\n\t\t\t\treturn (\n\t\t\t\t\tvalue === null \|\|\n\t\t\t\t\tisString(value, 1) \|\|\n\t\t\t\t\t(typeof value === 'object' &&\n\t\t\t\t\t\tvalue !== null &&\n\t\t\t\t\t\t(isString((value as KoliBriAllIcon).left, 1) \|\|\n\t\t\t\t\t\t\tisIcon((value as KoliBriAllIcon).left) \|\|\n\t\t\t\t\t\t\tisString((value as KoliBriAllIcon).right, 1) \|\|\n\t\t\t\t\t\t\tisIcon((value as KoliBriAllIcon).right) \|\|\n\t\t\t\t\t\t\tisString((value as KoliBriAllIcon).top, 1) \|\|\n\t\t\t\t\t\t\tisIcon((value as KoliBriAllIcon).top) \|\|\n\t\t\t\t\t\t\tisString((value as KoliBriAllIcon).bottom, 1) \|\|\n\t\t\t\t\t\t\tisIcon((value as KoliBriAllIcon).bottom)))\n\t\t\t\t);\n\t\t\t},\n\t\t\tnew Set(['KoliBriIcon']),\n\t\t\tvalue,\n\t\t\t{\n\t\t\t\thooks: {\n\t\t\t\t\tbeforePatch: (nextValue: unknown, nextState: Map<string, unknown>) => {\n\t\t\t\t\t\tif (nextValue === null) {\n\t\t\t\t\t\t\tnextState.set('_icon', {});\n\t\t\t\t\t\t}\n\t\t\t\t\t\tbeforePatchIcon(component);\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t\trequired: true,\n\t\t\t}\n\t\t);\n\t});\n};\n\nexport const watchIconAlign = (component: Generic.Element.Component, value?: Alignment): void => {\n\tdeprecatedHint(\n\t\t`Das Property _icon-align bzw. _iconAlign ist veraltet. Die Ausrichtung der Icon's kann jetzt direkt über das _icon-Property vorgenommen werden. (v1.1.10: https://public-ui.github.io/?path=/story/backlog-und-changelog--page)`\n\t);\n\twatchValidator(component, '_iconAlign', (value) => value === 'left' \|\| value === 'right', new Set(['Alignment {left, right, top, bottom}']), value, {\n\t\thooks: {\n\t\t\tbeforePatch: () => {\n\t\t\t\tbeforePatchIcon(component);\n\t\t\t},\n\t\t},\n\t});\n};\n","import { Generic } from '@a11y-ui/core';\nimport { a11yHint } from '../a11y.tipps';\nimport { watchString } from '../prop.validators';\nimport { isEmptyOrPrefixOf } from '../validator';\n\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 \| undefined = 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', label);\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`Das abweichende Aria-Label am Schalter ist nicht barrierefrei. Ein abweichendes Aria-Label muss aus Gründern der Barrierefreiheit für die Sprachsteuerung mit dem Label-Text beginnen.`\n\t\t\t);\n\t\t}\n\t}\n};\n\nexport const validateAriaLabel = (component: Generic.Element.Component, value?: string): void => {\n\twatchString(component, '_ariaLabel', 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): void => {\n\twatchString(component, '_label', value, {\n\t\thooks: {\n\t\t\tbeforePatch: syncAriaLabelBeforePatch,\n\t\t},\n\t\trequired: true,\n\t});\n};\n","import { Generic } from '@a11y-ui/core';\nimport { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\nimport { Stringified } from '../../types/common';\n\nimport { KoliBriCustomIcon, KoliBriIconProp } from '../../types/icon';\nimport { watchBoolean } from '../../utils/prop.validators';\nimport { validateIcon } from '../../utils/validators/icon';\nimport { validateLabel } from '../../utils/validators/label';\n\n/\n API\n /\ntype RequiredProps = {\n\tlabel: string;\n};\ntype OptionalProps = {\n\ticon: Stringified<KoliBriIconProp>;\n\ticonOnly: boolean;\n};\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = {\n\ticon: {\n\t\ttop?: KoliBriCustomIcon;\n\t\tright?: KoliBriCustomIcon;\n\t\tbottom?: KoliBriCustomIcon;\n\t\tleft?: KoliBriCustomIcon;\n\t};\n\ticonOnly: boolean;\n\tlabel: string;\n};\ntype OptionalStates = unknown;\nexport type States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\nconst removeNode = (el?: Node) => {\n\tif (el instanceof Node) {\n\t\tsetTimeout(() => {\n\t\t\tel.parentElement?.removeChild(el);\n\t\t\tel.parentNode?.removeChild(el);\n\t\t});\n\t}\n};\n\n/\n @internal\n /\n@Component({\n\ttag: 'kol-span-wc',\n\tshadow: false,\n})\nexport class KolSpanWc implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tclass={{\n\t\t\t\t\t'icon-only': this.state._iconOnly,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{this.state._icon.top && (\n\t\t\t\t\t<kol-icon\n\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t'icon top': true,\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tstyle={this.state._icon.top.style}\n\t\t\t\t\t\t_ariaLabel=\"\"\n\t\t\t\t\t\t_icon={this.state._icon.top.icon}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t\t<span>\n\t\t\t\t\t{this.state._icon.left && (\n\t\t\t\t\t\t<kol-icon\n\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t'icon left': true,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tstyle={this.state._icon.left.style}\n\t\t\t\t\t\t\t_ariaLabel=\"\"\n\t\t\t\t\t\t\t_icon={this.state._icon.left.icon}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t\t{this.state._iconOnly !== true && this.state._label.length > 0 ? <span>{this.state._label}</span> : ''}\n\t\t\t\t\t{/\n\t\t\t\t\t\t\tEs ist keine gute Idee hier einen Slot einzufügen,\n\t\t\t\t\t\t\tda dadurch die komplette Unterstützung der Komponente\n\t\t\t\t\t\t\tumgangen werden kann.\n\t\t\t\t\t\t/}\n\t\t\t\t\t<span ref={this.state._label.length > 0 \|\| this.state._iconOnly === true ? removeNode : undefined}>\n\t\t\t\t\t\t<slot name=\"expert\" />\n\t\t\t\t\t</span>\n\t\t\t\t\t{this.state._icon.right && (\n\t\t\t\t\t\t<kol-icon\n\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t'icon right': true,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tstyle={this.state._icon.right.style}\n\t\t\t\t\t\t\t_ariaLabel=\"\"\n\t\t\t\t\t\t\t_icon={this.state._icon.right.icon}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</span>\n\t\t\t\t{this.state._icon.bottom && (\n\t\t\t\t\t<kol-icon\n\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t'icon bottom': true,\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tstyle={this.state._icon.bottom.style}\n\t\t\t\t\t\t_ariaLabel=\"\"\n\t\t\t\t\t\t_icon={this.state._icon.bottom.icon}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/\n\t Gibt den Class-Identifier eines Icons eine eingebunden Icofont an. (z.B. https://icofont.com/)\n\t /\n\t@Prop() public _icon?: Stringified<KoliBriIconProp>;\n\n\t/\n\t Gibt an, ob nur das Icon angezeigt wird.\n\t /\n\t@Prop({ reflect: true }) public _iconOnly?: boolean = false;\n\n\t/\n\t Gibt einen beschreibenden Text für das Text-Element an.\n\t /\n\t@Prop() public _label!: string;\n\n\t/\n\t @see: components/abbr/component.tsx (@State)\n\t /\n\t@State() public state: States = {\n\t\t_icon: {},\n\t\t_iconOnly: false,\n\t\t_label: '',\n\t};\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_icon')\n\tpublic validateIcon(value?: KoliBriIconProp): void {\n\t\tvalidateIcon(this, value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_iconOnly')\n\tpublic validateIconOnly(value?: boolean): void {\n\t\twatchBoolean(this, '_iconOnly', value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_label')\n\tpublic validateLabel(value?: string): void {\n\t\tvalidateLabel(this, value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tthis.validateIcon(this._icon);\n\t\tthis.validateIconOnly(this._iconOnly);\n\t\tthis.validateLabel(this._label);\n\t}\n}\n"],"version":3}
1	+ {"file":"component3.js","mappings":"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","names":[],"sources":["./src/utils/validator.ts","./src/utils/validators/icon.ts","./src/utils/validators/label.ts","./src/components/span/component.tsx"],"sourcesContent":["export const isObject = (value: unknown): boolean => typeof value === 'object' && value !== null;\n\nexport const isString = (value: unknown, minLength = 0): boolean => typeof value === 'string' && value.length >= minLength;\n\nexport const isStyle = (style?: Record<string, string>): boolean => {\n\tif (typeof style === 'object' && style !== null) {\n\t\tfor (const property in style) {\n\t\t\tif (isString(property, 1) === false) {\n\t\t\t\treturn false;\n\t\t\t}\n\t\t}\n\t} else {\n\t\treturn isString(style, 1);\n\t}\n\treturn true;\n};\n\n/*\n Validate, if a text contains a prefix.\n /\nconst isPrefixOf = (prefix: string, text: string) => new RegExp(`^${prefix}`).test(text);\n\n/\n Validate, if a text is empty or contains a prefix.\n /\nexport const isEmptyOrPrefixOf = (prefix: string, text: string) => text.length === 0 \|\| isPrefixOf(prefix, text);\n\n/\n Fix event instance for state changes.\n /\nexport const STATE_CHANGE_EVENT = new Event('StateChange');\n","import { Generic } from '@a11y-ui/core';\nimport { ButtonStates } from '../../types/button-link';\nimport { AnyIconFontClass, KoliBriAllIcon, KoliBriCustomIcon, KoliBriIconProp, KoliBriIconState } from '../../types/icon';\nimport { Alignment } from '../../types/props/alignment';\nimport { deprecatedHint } from '../a11y.tipps';\nimport { objectObjectHandler, parseJson, watchValidator } from '../prop.validators';\nimport { isObject, isString, isStyle } from '../validator';\n\nconst mapCustomIcon = (state: KoliBriIconState, alignment: Alignment \| 'top' \| 'bottom', icon?: AnyIconFontClass \| KoliBriCustomIcon) => {\n\tif (isObject(icon)) {\n\t\tstate[alignment] = icon as KoliBriCustomIcon;\n\t} else if (isString(icon, 1)) {\n\t\tstate[alignment] = {\n\t\t\ticon: icon as AnyIconFontClass,\n\t\t};\n\t}\n};\n\nexport const mapIconProp2State = (icon: KoliBriIconProp, iconAlign?: Alignment): KoliBriIconState => {\n\tlet state: KoliBriIconState = {};\n\tif (isString(icon, 1)) {\n\t\tswitch (iconAlign) {\n\t\t\tcase 'right':\n\t\t\t\tstate = {\n\t\t\t\t\tright: {\n\t\t\t\t\t\ticon: icon as AnyIconFontClass,\n\t\t\t\t\t},\n\t\t\t\t};\n\t\t\t\tbreak;\n\t\t\tdefault:\n\t\t\t\tstate = {\n\t\t\t\t\tleft: {\n\t\t\t\t\t\ticon: icon as AnyIconFontClass,\n\t\t\t\t\t},\n\t\t\t\t};\n\t\t}\n\t} else if (typeof icon === 'object' && icon !== null) {\n\t\tmapCustomIcon(state, 'top', icon.top);\n\t\tmapCustomIcon(state, 'right', icon.right);\n\t\tmapCustomIcon(state, 'bottom', icon.bottom);\n\t\tmapCustomIcon(state, 'left', icon.left);\n\t}\n\treturn state;\n};\n\nconst beforePatchIcon = (component: Generic.Element.Component): void => {\n\tif (component.nextState?.has('_icon')) {\n\t\tconst icon = component.nextState?.get('_icon') as KoliBriIconProp;\n\t\tconst iconAlign = (component.nextState?.get('_iconAlign') as Alignment) \|\| (component.state as ButtonStates)._iconAlign;\n\t\tcomponent.nextState?.set('_icon', mapIconProp2State(icon, iconAlign));\n\t} else if (component.nextState?.has('_iconAlign')) {\n\t\tconst lastIconAlign = (component.state as ButtonStates)._iconAlign;\n\t\tcomponent.nextState?.set('_icon', {\n\t\t\t[lastIconAlign]: undefined,\n\t\t\t[component.nextState?.get('_iconAlign') as Alignment]: (component.state as ButtonStates)._icon[lastIconAlign],\n\t\t});\n\t}\n};\n\nexport const isIcon = (value?: unknown): boolean =>\n\ttypeof value === 'object' &&\n\tvalue !== null &&\n\t(typeof (value as KoliBriCustomIcon).style === 'undefined' \|\| isStyle((value as KoliBriCustomIcon).style)) &&\n\tisString((value as KoliBriCustomIcon).icon, 1);\n\nexport const validateIcon = (component: Generic.Element.Component, value?: KoliBriIconProp): void => {\n\tobjectObjectHandler(value, () => {\n\t\ttry {\n\t\t\tvalue = parseJson<KoliBriIconProp>(value as string);\n\t\t} catch (e) {\n\t\t\t// value behält den ursprünglichen Wert\n\t\t}\n\t\twatchValidator(\n\t\t\tcomponent,\n\t\t\t'_icon',\n\t\t\t(value): boolean => {\n\t\t\t\treturn (\n\t\t\t\t\tvalue === null \|\|\n\t\t\t\t\tisString(value, 1) \|\|\n\t\t\t\t\t(typeof value === 'object' &&\n\t\t\t\t\t\tvalue !== null &&\n\t\t\t\t\t\t(isString((value as KoliBriAllIcon).left, 1) \|\|\n\t\t\t\t\t\t\tisIcon((value as KoliBriAllIcon).left) \|\|\n\t\t\t\t\t\t\tisString((value as KoliBriAllIcon).right, 1) \|\|\n\t\t\t\t\t\t\tisIcon((value as KoliBriAllIcon).right) \|\|\n\t\t\t\t\t\t\tisString((value as KoliBriAllIcon).top, 1) \|\|\n\t\t\t\t\t\t\tisIcon((value as KoliBriAllIcon).top) \|\|\n\t\t\t\t\t\t\tisString((value as KoliBriAllIcon).bottom, 1) \|\|\n\t\t\t\t\t\t\tisIcon((value as KoliBriAllIcon).bottom)))\n\t\t\t\t);\n\t\t\t},\n\t\t\tnew Set(['KoliBriIcon']),\n\t\t\tvalue,\n\t\t\t{\n\t\t\t\thooks: {\n\t\t\t\t\tbeforePatch: (nextValue: unknown, nextState: Map<string, unknown>) => {\n\t\t\t\t\t\tif (nextValue === null) {\n\t\t\t\t\t\t\tnextState.set('_icon', {});\n\t\t\t\t\t\t}\n\t\t\t\t\t\tbeforePatchIcon(component);\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t\trequired: true,\n\t\t\t}\n\t\t);\n\t});\n};\n\nexport const watchIconAlign = (component: Generic.Element.Component, value?: Alignment): void => {\n\tdeprecatedHint(\n\t\t`Das Property _icon-align bzw. _iconAlign ist veraltet. Die Ausrichtung der Icon's kann jetzt direkt über das _icon-Property vorgenommen werden. (v1.1.10: https://public-ui.github.io/?path=/story/backlog-und-changelog--page)`\n\t);\n\twatchValidator(component, '_iconAlign', (value) => value === 'left' \|\| value === 'right', new Set(['Alignment {left, right, top, bottom}']), value, {\n\t\thooks: {\n\t\t\tbeforePatch: () => {\n\t\t\t\tbeforePatchIcon(component);\n\t\t\t},\n\t\t},\n\t});\n};\n","import { Generic } from '@a11y-ui/core';\nimport { a11yHint } from '../a11y.tipps';\nimport { watchString } from '../prop.validators';\nimport { isEmptyOrPrefixOf } from '../validator';\n\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 \| undefined = 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', label);\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`Das abweichende Aria-Label am Schalter ist nicht barrierefrei. Ein abweichendes Aria-Label muss aus Gründern der Barrierefreiheit für die Sprachsteuerung mit dem Label-Text beginnen.`\n\t\t\t);\n\t\t}\n\t}\n};\n\nexport const validateAriaLabel = (component: Generic.Element.Component, value?: string): void => {\n\twatchString(component, '_ariaLabel', 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): void => {\n\twatchString(component, '_label', value, {\n\t\thooks: {\n\t\t\tbeforePatch: syncAriaLabelBeforePatch,\n\t\t},\n\t\trequired: true,\n\t});\n};\n","import { Generic } from '@a11y-ui/core';\nimport { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\nimport { Stringified } from '../../types/common';\n\nimport { KoliBriCustomIcon, KoliBriIconProp } from '../../types/icon';\nimport { watchBoolean } from '../../utils/prop.validators';\nimport { validateIcon } from '../../utils/validators/icon';\nimport { validateLabel } from '../../utils/validators/label';\n\n/\n API\n /\ntype RequiredProps = {\n\tlabel: string;\n};\ntype OptionalProps = {\n\ticon: Stringified<KoliBriIconProp>;\n\ticonOnly: boolean;\n};\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = {\n\ticon: {\n\t\ttop?: KoliBriCustomIcon;\n\t\tright?: KoliBriCustomIcon;\n\t\tbottom?: KoliBriCustomIcon;\n\t\tleft?: KoliBriCustomIcon;\n\t};\n\ticonOnly: boolean;\n\tlabel: string;\n};\ntype OptionalStates = unknown;\nexport type States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\nconst removeNode = (el?: Node) => {\n\tif (el instanceof Node) {\n\t\tsetTimeout(() => {\n\t\t\tel.parentElement?.removeChild(el);\n\t\t\tel.parentNode?.removeChild(el);\n\t\t});\n\t}\n};\n\n/\n @internal\n /\n@Component({\n\ttag: 'kol-span-wc',\n\tshadow: false,\n})\nexport class KolSpanWc implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tclass={{\n\t\t\t\t\t'icon-only': this.state._iconOnly,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{this.state._icon.top && (\n\t\t\t\t\t<kol-icon\n\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t'icon top': true,\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tstyle={this.state._icon.top.style}\n\t\t\t\t\t\t_ariaLabel=\"\"\n\t\t\t\t\t\t_icon={this.state._icon.top.icon}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t\t<span>\n\t\t\t\t\t{this.state._icon.left && (\n\t\t\t\t\t\t<kol-icon\n\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t'icon left': true,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tstyle={this.state._icon.left.style}\n\t\t\t\t\t\t\t_ariaLabel=\"\"\n\t\t\t\t\t\t\t_icon={this.state._icon.left.icon}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t\t{this.state._iconOnly !== true && this.state._label.length > 0 ? <span>{this.state._label}</span> : ''}\n\t\t\t\t\t{/\n\t\t\t\t\t\t\tEs ist keine gute Idee hier einen Slot einzufügen,\n\t\t\t\t\t\t\tda dadurch die komplette Unterstützung der Komponente\n\t\t\t\t\t\t\tumgangen werden kann.\n\t\t\t\t\t\t/}\n\t\t\t\t\t<span ref={this.state._label.length > 0 \|\| this.state._iconOnly === true ? removeNode : undefined}>\n\t\t\t\t\t\t<slot name=\"expert\" />\n\t\t\t\t\t</span>\n\t\t\t\t\t{this.state._icon.right && (\n\t\t\t\t\t\t<kol-icon\n\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t'icon right': true,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tstyle={this.state._icon.right.style}\n\t\t\t\t\t\t\t_ariaLabel=\"\"\n\t\t\t\t\t\t\t_icon={this.state._icon.right.icon}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</span>\n\t\t\t\t{this.state._icon.bottom && (\n\t\t\t\t\t<kol-icon\n\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t'icon bottom': true,\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tstyle={this.state._icon.bottom.style}\n\t\t\t\t\t\t_ariaLabel=\"\"\n\t\t\t\t\t\t_icon={this.state._icon.bottom.icon}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/\n\t Gibt den Class-Identifier eines Icons eine eingebunden Icofont an. (z.B. https://icofont.com/)\n\t /\n\t@Prop() public _icon?: Stringified<KoliBriIconProp>;\n\n\t/\n\t Gibt an, ob nur das Icon angezeigt wird.\n\t /\n\t@Prop({ reflect: true }) public _iconOnly?: boolean = false;\n\n\t/\n\t Gibt einen beschreibenden Text für das Text-Element an.\n\t /\n\t@Prop() public _label!: string;\n\n\t/\n\t @see: components/abbr/component.tsx (@State)\n\t /\n\t@State() public state: States = {\n\t\t_icon: {},\n\t\t_iconOnly: false,\n\t\t_label: '',\n\t};\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_icon')\n\tpublic validateIcon(value?: KoliBriIconProp): void {\n\t\tvalidateIcon(this, value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_iconOnly')\n\tpublic validateIconOnly(value?: boolean): void {\n\t\twatchBoolean(this, '_iconOnly', value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_label')\n\tpublic validateLabel(value?: string): void {\n\t\tvalidateLabel(this, value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tthis.validateIcon(this._icon);\n\t\tthis.validateIconOnly(this._iconOnly);\n\t\tthis.validateLabel(this._label);\n\t}\n}\n"],"version":3}

package/dist/components/kol-accordion.js CHANGED Viewed

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";import{p as featureHint,w as watchString,o as setState,k as watchBoolean}from"./prop.validators.js";import{w as watchHeadingLevel,d as defineCustomElement$3}from"./component4.js";import{d as defineCustomElement$2}from"./component2.js";const defaultStyleCss="@windicss; *{box-sizing:border-box;font-size:inherit;hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}kol-heading-wc{font-weight:700}kol-icon{color:inherit}kol-span-wc{display:grid;place-items:center;width:100%}kol-span-wc>span{display:flex;gap:0.25rem;place-items:center}a,button{cursor:pointer}a.icon-only>kol-span-wc>span>span,button.icon-only>kol-span-wc>span>span{display:none}a{display:inline-flex;place-items:baseline}button{border-width:0}";featureHint("[KolAccordion] Anfrage nach einer KolAccordionGroup bei dem immer nur ein Accordion geöffnet ist.\n\n- onClick auf der KolAccordion anwenden\n- Click-Event prüft den _open-Status der Accordions\n- Logik Öffnet und Schließt entsprechend"),featureHint("[KolAccordion] Tab-Sperre des Inhalts im geschlossenen Zustand.");const KolAccordion$1=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.__attachShadow(),this.catchAriaExpanded=e=>{e instanceof HTMLButtonElement&&(this.buttonRef=e)},this.triggerAriaExpanded=e=>{e.setAttribute("aria-expanded",this.state._open?"true":"false")},this.onClick=e=>{this._open=!1===this._open;const t=setTimeout((()=>{var n;clearTimeout(t),"function"==typeof(null===(n=this.state._on)||void 0===n?void 0:n.onClick)&&this.state._on.onClick(e,!0===this._open),this.buttonRef instanceof HTMLButtonElement&&this.triggerAriaExpanded(this.buttonRef)}))},this._heading=void 0,this._level=1,this._on=void 0,this._open=!1,this.state={_heading:"⚠",_level:1}}render(){return h(Host,null,h("div",{part:"accordion "+(this.state._open?"open":"close")},h("kol-heading-wc",{_level:this.state._level},h("button",{ref:this.catchAriaExpanded,onClick:this.onClick},h("kol-icon",{_ariaLabel:"",_icon:this.state._open?"fa-solid fa-minus":"fa-solid fa-plus",_part:this.state._open?"close":"open"}),h("span",null,this.state._heading))),h("div",{part:"header"},h("slot",{name:"header"})),h("div",{part:"content",style:!1===this.state._open?{display:"none",height:"0",visibility:"hidden"}:void 0},h("slot",{name:"content"}))))}validateHeading(e){watchString(this,"_heading",e,{required:!0})}validateLevel(e){watchHeadingLevel(this,e)}validateOn(e){"object"==typeof e&&null!==e&&"function"==typeof e.onClick&&setState(this,"_on",e)}validateOpen(e){watchBoolean(this,"_open",e)}componentWillLoad(){this.validateHeading(this._heading),this.validateLevel(this._level),this.validateOn(this._on),this.validateOpen(this._open)}static get watchers(){return{_heading:["validateHeading"],_level:["validateLevel"],_on:["validateOn"],_open:["validateOpen"]}}static get style(){return{default:defaultStyleCss}}},[33,"kol-accordion",{_heading:[1],_level:[2],_on:[16],_open:[1540],state:[32]}]);function defineCustomElement$1(){if("undefined"==typeof customElements)return;["kol-accordion","kol-heading-wc","kol-icon"].forEach((e=>{switch(e){case"kol-accordion":customElements.get(e)||customElements.define(e,KolAccordion$1);break;case"kol-heading-wc":customElements.get(e)||defineCustomElement$3();break;case"kol-icon":customElements.get(e)||defineCustomElement$2()}}))}const KolAccordion=KolAccordion$1,defineCustomElement=defineCustomElement$1;export{KolAccordion,defineCustomElement};
+import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";import{p as featureHint,w as watchString,o as setState,k as watchBoolean}from"./prop.validators.js";import{w as watchHeadingLevel,d as defineCustomElement$3}from"./component4.js";import{d as defineCustomElement$2}from"./component2.js";const defaultStyleCss="@windicss; *{box-sizing:border-box;font-size:inherit;hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}kol-heading-wc{font-weight:700}kol-icon{color:inherit}kol-span-wc{display:grid;place-items:center;width:100%}kol-span-wc>span{display:flex;gap:0.25rem;place-items:center}a,button{cursor:pointer}a.icon-only>kol-span-wc>span>span,button.icon-only>kol-span-wc>span>span{display:none}a{display:inline-flex;place-items:baseline}button{border-width:0}";featureHint("[KolAccordion] Anfrage nach einer KolAccordionGroup bei dem immer nur ein Accordion geöffnet ist.\n\n- onClick auf der KolAccordion anwenden\n- Click-Event prüft den _open-Status der Accordions\n- Logik Öffnet und Schließt entsprechend"),featureHint("[KolAccordion] Tab-Sperre des Inhalts im geschlossenen Zustand.");const KolAccordion$1=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.__attachShadow(),this.catchAriaExpanded=e=>{e instanceof HTMLButtonElement&&(this.buttonRef=e,this.triggerAriaExpanded(e))},this.triggerAriaExpanded=e=>{e.setAttribute("aria-expanded",this.state._open?"true":"false")},this.onClick=e=>{this._open=!1===this._open;const t=setTimeout((()=>{var n;clearTimeout(t),"function"==typeof(null===(n=this.state._on)||void 0===n?void 0:n.onClick)&&this.state._on.onClick(e,!0===this._open),this.buttonRef instanceof HTMLButtonElement&&this.triggerAriaExpanded(this.buttonRef)}))},this._heading=void 0,this._level=1,this._on=void 0,this._open=!1,this.state={_heading:"⚠",_level:1}}render(){return h(Host,null,h("div",{part:"accordion "+(this.state._open?"open":"close")},h("kol-heading-wc",{_level:this.state._level},h("button",{ref:this.catchAriaExpanded,onClick:this.onClick},h("kol-icon",{_ariaLabel:"",_icon:this.state._open?"fa-solid fa-minus":"fa-solid fa-plus",_part:this.state._open?"close":"open"}),h("span",null,this.state._heading))),h("div",{part:"header"},h("slot",{name:"header"})),h("div",{part:"content",style:!1===this.state._open?{display:"none",height:"0",visibility:"hidden"}:void 0},h("slot",{name:"content"}))))}validateHeading(e){watchString(this,"_heading",e,{required:!0})}validateLevel(e){watchHeadingLevel(this,e)}validateOn(e){"object"==typeof e&&null!==e&&"function"==typeof e.onClick&&setState(this,"_on",e)}validateOpen(e){watchBoolean(this,"_open",e)}componentWillLoad(){this.validateHeading(this._heading),this.validateLevel(this._level),this.validateOn(this._on),this.validateOpen(this._open)}static get watchers(){return{_heading:["validateHeading"],_level:["validateLevel"],_on:["validateOn"],_open:["validateOpen"]}}static get style(){return{default:defaultStyleCss}}},[33,"kol-accordion",{_heading:[1],_level:[2],_on:[16],_open:[1540],state:[32]}]);function defineCustomElement$1(){if("undefined"==typeof customElements)return;["kol-accordion","kol-heading-wc","kol-icon"].forEach((e=>{switch(e){case"kol-accordion":customElements.get(e)||customElements.define(e,KolAccordion$1);break;case"kol-heading-wc":customElements.get(e)||defineCustomElement$3();break;case"kol-icon":customElements.get(e)||defineCustomElement$2()}}))}const KolAccordion=KolAccordion$1,defineCustomElement=defineCustomElement$1;export{KolAccordion,defineCustomElement};

package/dist/components/kol-accordion.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"kol-accordion.js","mappings":";;;;;;;;AAAA,MAAM,eAAe,GAAG,+dAA+d;;ACYvf,WAAW,CAAC;;;;yCAI6B,CAAC,CAAC;AAC3C,WAAW,CAAC,iEAAiE,CAAC,CAAC;MAyClEA,cAAY;;;;;IAIhB,sBAAiB,GAAG,CAAC,MAA0B;MACtD,IAAI,MAAM,YAAY,iBAAiB,EAAE;QACxC,IAAI,CAAC,SAAS,GAAG,MAAM,CAAC;~~OACxB~~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","names":["KolAccordion"],"sources":["./src/components/style.sass?tag=kol-accordion&mode=default&encapsulation=shadow","./src/components/accordion/component.tsx"],"sourcesContent":["@windicss\n\n\n\tbox-sizing: border-box\n\tfont-size: inherit\n\thyphens: auto\n\tletter-spacing: inherit\n\tword-break: break-word\n\tword-spacing: inherit\n\nkol-heading-wc\n\tfont-weight: 700\n\nkol-icon\n\tcolor: inherit\n\nkol-span-wc\n\tdisplay: grid\n\tplace-items: center\n\twidth: 100%\n\n\t> span\n\t\tdisplay: flex\n\t\tgap: 0.25rem\n\t\tplace-items: center\n\na,\nbutton\n\tcursor: pointer\n\n\t&.icon-only\n\n\t\t> kol-span-wc\n\n\t\t\t> span\n\n\t\t\t\t> span\n\t\t\t\t\tdisplay: none\n\na\n\tdisplay: inline-flex\n\tplace-items: baseline\n\nbutton\n\tborder-width: 0\n","// https://codepen.io/mbxtr/pen/OJPOYg?html-preprocessor=haml\n\nimport { Generic } from '@a11y-ui/core';\nimport { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\nimport { Events } from '../../enums/events';\n\nimport { EventValueCallback } from '../../types/callbacks';\nimport { HeadingLevel } from '../../types/heading-level';\nimport { featureHint } from '../../utils/a11y.tipps';\nimport { setState, watchBoolean, watchString } from '../../utils/prop.validators';\nimport { watchHeadingLevel } from '../heading/validation';\n\nfeatureHint(`[KolAccordion] Anfrage nach einer KolAccordionGroup bei dem immer nur ein Accordion geöffnet ist.\n\n- onClick auf der KolAccordion anwenden\n- Click-Event prüft den _open-Status der Accordions\n- Logik Öffnet und Schließt entsprechend`);\nfeatureHint(`[KolAccordion] Tab-Sperre des Inhalts im geschlossenen Zustand.`);\n\nexport type KoliBriAccordionCallbacks = {\n\t[Events.onClick]?: EventValueCallback<Event, boolean>;\n};\n\n/\n API\n /\ntype RequiredProps = {\n\theading: string;\n};\ntype OptionalProps = {\n\tlevel: HeadingLevel;\n\topen: boolean;\n\ton: KoliBriAccordionCallbacks;\n};\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 @part accordion - Ermöglicht das Stylen des äußeren Container des Accordions.\n * @part open - Ermöglicht das Stylen des geöffneten Zustands und Icons.\n * @part close - Ermöglicht das Stylen des geschlossenen Zustands und Icons.\n * @part icon - Ermöglicht das Stylen der Icons.\n * @part header - Ermöglicht das Stylen des Kopfbereichs.\n * @part content - Ermöglicht das Stylen des Inhaltsbereichs.\n \n @slot header - Ermöglicht das Einfügen beliebigen HTML's in den Kopfbereich des Accordions.\n * @slot content - Ermöglicht das Einfügen beliebigen HTML's in den Inhaltsbereich des Accordions.\n /\n@Component({\n\ttag: 'kol-accordion',\n\tstyleUrls: {\n\t\tdefault: '../style.sass',\n\t},\n\tshadow: true,\n})\nexport class KolAccordion implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\tprivate buttonRef?: HTMLButtonElement;\n\t// private content?: HTMLDivElement;\n\n\tprivate catchAriaExpanded = (button?: HTMLButtonElement) => {\n\t\tif (button instanceof HTMLButtonElement) {\n\t\t\tthis.buttonRef = button;\n\t\t}\n\t};\n\tprivate triggerAriaExpanded = (button: HTMLButtonElement) => {\n\t\tbutton.setAttribute('aria-expanded', this.state._open ? 'true' : 'false');\n\t};\n\n\tpublic render(): JSX.Element {\n\t\t// const height = this.content?.getBoundingClientRect().height ?? 0;\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<div part={`accordion ${this.state._open ? 'open' : 'close'}`}>\n\t\t\t\t\t<kol-heading-wc _level={this.state._level}>\n\t\t\t\t\t\t<button ref={this.catchAriaExpanded} onClick={this.onClick}>\n\t\t\t\t\t\t\t<kol-icon _ariaLabel=\"\" _icon={this.state._open ? 'fa-solid fa-minus' : 'fa-solid fa-plus'} _part={this.state._open ? 'close' : 'open'} />\n\t\t\t\t\t\t\t<span>{this.state._heading}</span>\n\t\t\t\t\t\t</button>\n\t\t\t\t\t</kol-heading-wc>\n\t\t\t\t\t<div part=\"header\">\n\t\t\t\t\t\t<slot name=\"header\" />\n\t\t\t\t\t</div>\n\t\t\t\t\t<div\n\t\t\t\t\t\tpart=\"content\"\n\t\t\t\t\t\t// ref={(r) => (this.content = r)}\n\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\tthis.state._open === false\n\t\t\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t\t\tdisplay: 'none',\n\t\t\t\t\t\t\t\t\t\theight: '0',\n\t\t\t\t\t\t\t\t\t\tvisibility: 'hidden',\n\t\t\t\t\t\t\t\t }\n\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t\t// style={\n\t\t\t\t\t\t// \tthis.state._open\n\t\t\t\t\t\t// \t\t? height > 0 && process.env.NODE_ENV !== 'test' // TODO: remove this check when testing is fixed\n\t\t\t\t\t\t// \t\t\t? {\n\t\t\t\t\t\t// \t\t\t\theight: `${height}px`,\n\t\t\t\t\t\t// \t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t// \t\t\t}\n\t\t\t\t\t\t// \t\t\t: undefined\n\t\t\t\t\t\t// \t\t: {\n\t\t\t\t\t\t// \t\t\theight: '0',\n\t\t\t\t\t\t// \t\t\toverflow: 'hidden',\n\t\t\t\t\t\t// \t\t\tvisibility: 'hidden',\n\t\t\t\t\t\t// \t\t}\n\t\t\t\t\t\t// }\n\t\t\t\t\t>\n\t\t\t\t\t\t<slot name=\"content\" />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/\n\t Gibt die Überschrift des Accordions 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-Funktionen an.\n\t /\n\t@Prop() public _on?: KoliBriAccordionCallbacks;\n\n\t/\n\t Gibt an, ob das Accordion geöffnet ist.\n\t /\n\t@Prop({ mutable: true, reflect: true }) public _open?: boolean = false;\n\n\t/\n\t @see: components/abbr/component.tsx (@State)\n\t /\n\t@State() public state: States = {\n\t\t_heading: '⚠',\n\t\t_level: 1,\n\t};\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_heading')\n\tpublic validateHeading(value?: string): void {\n\t\twatchString(this, '_heading', value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_level')\n\tpublic validateLevel(value?: HeadingLevel): void {\n\t\twatchHeadingLevel(this, value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_on')\n\tpublic validateOn(value?: KoliBriAccordionCallbacks): void {\n\t\tif (typeof value === 'object' && value !== null && typeof value.onClick === 'function') {\n\t\t\tsetState(this, '_on', value);\n\t\t}\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_open')\n\tpublic validateOpen(value?: boolean): void {\n\t\twatchBoolean(this, '_open', value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (componentWillLoad)\n\t /\n\tpublic componentWillLoad(): void {\n\t\tthis.validateHeading(this._heading);\n\t\tthis.validateLevel(this._level);\n\t\tthis.validateOn(this._on);\n\t\tthis.validateOpen(this._open);\n\t}\n\n\tprivate onClick = (event: Event) => {\n\t\tthis._open = this._open === false;\n\n\t\t/\n\t\t Der Timeout wird benötigt, damit das Event\n\t\t * vom Button- auf das Accordion-Event wechselt.\n\t\t * So ist es dem Anwendenden möglich das _open-\n\t\t * Attribute abzufragen.\n\t\t */\n\t\tconst timeout = setTimeout(() => {\n\t\t\tclearTimeout(timeout);\n\t\t\tif (typeof this.state._on?.onClick === 'function') {\n\t\t\t\tthis.state._on.onClick(event, this._open === true);\n\t\t\t}\n\t\t\tif (this.buttonRef instanceof HTMLButtonElement) {\n\t\t\t\tthis.triggerAriaExpanded(this.buttonRef);\n\t\t\t}\n\t\t});\n\t};\n}\n"],"version":3}
1	+ {"file":"kol-accordion.js","mappings":"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","names":["KolAccordion"],"sources":["./src/components/style.sass?tag=kol-accordion&mode=default&encapsulation=shadow","./src/components/accordion/component.tsx"],"sourcesContent":["@windicss\n\n\n\tbox-sizing: border-box\n\tfont-size: inherit\n\thyphens: auto\n\tletter-spacing: inherit\n\tword-break: break-word\n\tword-spacing: inherit\n\nkol-heading-wc\n\tfont-weight: 700\n\nkol-icon\n\tcolor: inherit\n\nkol-span-wc\n\tdisplay: grid\n\tplace-items: center\n\twidth: 100%\n\n\t> span\n\t\tdisplay: flex\n\t\tgap: 0.25rem\n\t\tplace-items: center\n\na,\nbutton\n\tcursor: pointer\n\n\t&.icon-only\n\n\t\t> kol-span-wc\n\n\t\t\t> span\n\n\t\t\t\t> span\n\t\t\t\t\tdisplay: none\n\na\n\tdisplay: inline-flex\n\tplace-items: baseline\n\nbutton\n\tborder-width: 0\n","// https://codepen.io/mbxtr/pen/OJPOYg?html-preprocessor=haml\n\nimport { Generic } from '@a11y-ui/core';\nimport { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\nimport { Events } from '../../enums/events';\n\nimport { EventValueCallback } from '../../types/callbacks';\nimport { HeadingLevel } from '../../types/heading-level';\nimport { featureHint } from '../../utils/a11y.tipps';\nimport { setState, watchBoolean, watchString } from '../../utils/prop.validators';\nimport { watchHeadingLevel } from '../heading/validation';\n\nfeatureHint(`[KolAccordion] Anfrage nach einer KolAccordionGroup bei dem immer nur ein Accordion geöffnet ist.\n\n- onClick auf der KolAccordion anwenden\n- Click-Event prüft den _open-Status der Accordions\n- Logik Öffnet und Schließt entsprechend`);\nfeatureHint(`[KolAccordion] Tab-Sperre des Inhalts im geschlossenen Zustand.`);\n\nexport type KoliBriAccordionCallbacks = {\n\t[Events.onClick]?: EventValueCallback<Event, boolean>;\n};\n\n/\n API\n /\ntype RequiredProps = {\n\theading: string;\n};\ntype OptionalProps = {\n\tlevel: HeadingLevel;\n\topen: boolean;\n\ton: KoliBriAccordionCallbacks;\n};\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 @part accordion - Ermöglicht das Stylen des äußeren Container des Accordions.\n * @part open - Ermöglicht das Stylen des geöffneten Zustands und Icons.\n * @part close - Ermöglicht das Stylen des geschlossenen Zustands und Icons.\n * @part icon - Ermöglicht das Stylen der Icons.\n * @part header - Ermöglicht das Stylen des Kopfbereichs.\n * @part content - Ermöglicht das Stylen des Inhaltsbereichs.\n \n @slot header - Ermöglicht das Einfügen beliebigen HTML's in den Kopfbereich des Accordions.\n * @slot content - Ermöglicht das Einfügen beliebigen HTML's in den Inhaltsbereich des Accordions.\n /\n@Component({\n\ttag: 'kol-accordion',\n\tstyleUrls: {\n\t\tdefault: '../style.sass',\n\t},\n\tshadow: true,\n})\nexport class KolAccordion implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\tprivate buttonRef?: HTMLButtonElement;\n\t// private content?: HTMLDivElement;\n\n\tprivate catchAriaExpanded = (button?: HTMLButtonElement) => {\n\t\tif (button instanceof HTMLButtonElement) {\n\t\t\tthis.buttonRef = button;\n\t\t\tthis.triggerAriaExpanded(button);\n\t\t}\n\t};\n\tprivate triggerAriaExpanded = (button: HTMLButtonElement) => {\n\t\tbutton.setAttribute('aria-expanded', this.state._open ? 'true' : 'false');\n\t};\n\n\tpublic render(): JSX.Element {\n\t\t// const height = this.content?.getBoundingClientRect().height ?? 0;\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<div part={`accordion ${this.state._open ? 'open' : 'close'}`}>\n\t\t\t\t\t<kol-heading-wc _level={this.state._level}>\n\t\t\t\t\t\t<button ref={this.catchAriaExpanded} onClick={this.onClick}>\n\t\t\t\t\t\t\t<kol-icon _ariaLabel=\"\" _icon={this.state._open ? 'fa-solid fa-minus' : 'fa-solid fa-plus'} _part={this.state._open ? 'close' : 'open'} />\n\t\t\t\t\t\t\t<span>{this.state._heading}</span>\n\t\t\t\t\t\t</button>\n\t\t\t\t\t</kol-heading-wc>\n\t\t\t\t\t<div part=\"header\">\n\t\t\t\t\t\t<slot name=\"header\" />\n\t\t\t\t\t</div>\n\t\t\t\t\t<div\n\t\t\t\t\t\tpart=\"content\"\n\t\t\t\t\t\t// ref={(r) => (this.content = r)}\n\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\tthis.state._open === false\n\t\t\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t\t\tdisplay: 'none',\n\t\t\t\t\t\t\t\t\t\theight: '0',\n\t\t\t\t\t\t\t\t\t\tvisibility: 'hidden',\n\t\t\t\t\t\t\t\t }\n\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t\t// style={\n\t\t\t\t\t\t// \tthis.state._open\n\t\t\t\t\t\t// \t\t? height > 0 && process.env.NODE_ENV !== 'test' // TODO: remove this check when testing is fixed\n\t\t\t\t\t\t// \t\t\t? {\n\t\t\t\t\t\t// \t\t\t\theight: `${height}px`,\n\t\t\t\t\t\t// \t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t// \t\t\t}\n\t\t\t\t\t\t// \t\t\t: undefined\n\t\t\t\t\t\t// \t\t: {\n\t\t\t\t\t\t// \t\t\theight: '0',\n\t\t\t\t\t\t// \t\t\toverflow: 'hidden',\n\t\t\t\t\t\t// \t\t\tvisibility: 'hidden',\n\t\t\t\t\t\t// \t\t}\n\t\t\t\t\t\t// }\n\t\t\t\t\t>\n\t\t\t\t\t\t<slot name=\"content\" />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/\n\t Gibt die Überschrift des Accordions 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-Funktionen an.\n\t /\n\t@Prop() public _on?: KoliBriAccordionCallbacks;\n\n\t/\n\t Gibt an, ob das Accordion geöffnet ist.\n\t /\n\t@Prop({ mutable: true, reflect: true }) public _open?: boolean = false;\n\n\t/\n\t @see: components/abbr/component.tsx (@State)\n\t /\n\t@State() public state: States = {\n\t\t_heading: '⚠',\n\t\t_level: 1,\n\t};\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_heading')\n\tpublic validateHeading(value?: string): void {\n\t\twatchString(this, '_heading', value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_level')\n\tpublic validateLevel(value?: HeadingLevel): void {\n\t\twatchHeadingLevel(this, value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_on')\n\tpublic validateOn(value?: KoliBriAccordionCallbacks): void {\n\t\tif (typeof value === 'object' && value !== null && typeof value.onClick === 'function') {\n\t\t\tsetState(this, '_on', value);\n\t\t}\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_open')\n\tpublic validateOpen(value?: boolean): void {\n\t\twatchBoolean(this, '_open', value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (componentWillLoad)\n\t /\n\tpublic componentWillLoad(): void {\n\t\tthis.validateHeading(this._heading);\n\t\tthis.validateLevel(this._level);\n\t\tthis.validateOn(this._on);\n\t\tthis.validateOpen(this._open);\n\t}\n\n\tprivate onClick = (event: Event) => {\n\t\tthis._open = this._open === false;\n\n\t\t/\n\t\t Der Timeout wird benötigt, damit das Event\n\t\t * vom Button- auf das Accordion-Event wechselt.\n\t\t * So ist es dem Anwendenden möglich das _open-\n\t\t * Attribute abzufragen.\n\t\t */\n\t\tconst timeout = setTimeout(() => {\n\t\t\tclearTimeout(timeout);\n\t\t\tif (typeof this.state._on?.onClick === 'function') {\n\t\t\t\tthis.state._on.onClick(event, this._open === true);\n\t\t\t}\n\t\t\tif (this.buttonRef instanceof HTMLButtonElement) {\n\t\t\t\tthis.triggerAriaExpanded(this.buttonRef);\n\t\t\t}\n\t\t});\n\t};\n}\n"],"version":3}

package/dist/components/prop.validators.js CHANGED Viewed

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{s,f}from"./index.m.js";var commonjsGlobal="undefined"!=typeof globalThis?globalThis:"undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:{};function createCommonjsModule(e,t,o){return e(o={path:t,exports:{},require:function(e,t){return commonjsRequire()}},o.exports),o.exports}function commonjsRequire(){throw new Error("Dynamic requires are not currently supported by @rollup/plugin-commonjs")}var loglevel=createCommonjsModule((function(e){var t,o;t=commonjsGlobal,o=function(){var e=function(){},t="undefined",o=typeof window!==t&&typeof window.navigator!==t&&/Trident\/|MSIE /.test(window.navigator.userAgent),n=["trace","debug","info","warn","error"];function r(e,t){var o=e[t];if("function"==typeof o.bind)return o.bind(e);try{return Function.prototype.bind.call(o,e)}catch(t){return function(){return Function.prototype.apply.apply(o,[e,arguments])}}}function i(){console.log&&(console.log.apply?console.log.apply(console,arguments):Function.prototype.apply.apply(console.log,[console,arguments])),console.trace&&console.trace()}function l(n){return"debug"===n&&(n="log"),typeof console!==t&&("trace"===n&&o?i:void 0!==console[n]?r(console,n):void 0!==console.log?r(console,"log"):e)}function a(t,o){for(var r=0;r<n.length;r++){var i=n[r];this[i]=r<t?e:this.methodFactory(i,t,o)}this.log=this.debug}function s(e,o,n){return function(){typeof console!==t&&(a.call(this,o,n),this[e].apply(this,arguments))}}function c(e,t,o){return l(e)||s.apply(this,arguments)}function d(e,o,r){var i,l=this;o=null==o?"WARN":o;var s="loglevel";function d(){var e;if(typeof window!==t&&s){try{e=window.localStorage[s]}catch(e){}if(typeof e===t)try{var o=window.document.cookie,n=o.indexOf(encodeURIComponent(s)+"=");-1!==n&&(e=/^([^;]+)/.exec(o.slice(n))[1])}catch(e){}return void 0===l.levels[e]&&(e=void 0),e}}"string"==typeof e?s+=":"+e:"symbol"==typeof e&&(s=void 0),l.name=e,l.levels={TRACE:0,DEBUG:1,INFO:2,WARN:3,ERROR:4,SILENT:5},l.methodFactory=r||c,l.getLevel=function(){return i},l.setLevel=function(o,r){if("string"==typeof o&&void 0!==l.levels[o.toUpperCase()]&&(o=l.levels[o.toUpperCase()]),!("number"==typeof o&&o>=0&&o<=l.levels.SILENT))throw"log.setLevel() called with invalid level: "+o;if(i=o,!1!==r&&function(e){var o=(n[e]||"silent").toUpperCase();if(typeof window!==t&&s){try{return void(window.localStorage[s]=o)}catch(e){}try{window.document.cookie=encodeURIComponent(s)+"="+o+";"}catch(e){}}}(o),a.call(l,o,e),typeof console===t&&o<l.levels.SILENT)return"No console available for logging"},l.setDefaultLevel=function(e){o=e,d()||l.setLevel(e,!1)},l.resetLevel=function(){l.setLevel(o,!1),function(){if(typeof window!==t&&s){try{return void window.localStorage.removeItem(s)}catch(e){}try{window.document.cookie=encodeURIComponent(s)+"=; expires=Thu, 01 Jan 1970 00:00:00 UTC"}catch(e){}}}()},l.enableAll=function(e){l.setLevel(l.levels.TRACE,e)},l.disableAll=function(e){l.setLevel(l.levels.SILENT,e)};var u=d();null==u&&(u=o),l.setLevel(u,!1)}var u=new d,h={};u.getLogger=function(e){if("symbol"!=typeof e&&"string"!=typeof e||""===e)throw new TypeError("You must supply a name when creating a logger.");var t=h[e];return t||(t=h[e]=new d(e,u.getLevel(),u.methodFactory)),t};var m=typeof window!==t?window.log:void 0;return u.noConflict=function(){return typeof window!==t&&window.log===u&&(window.log=m),u},u.getLoggers=function(){return h},u.default=u,u},e.exports?e.exports=o():t.log=o()}));const STORE="object"==typeof window?window:"object"==typeof global?global:"object"==typeof self?self:{};let warrentyWarning=!1;const THEME_NAME_PATTERN=/^[a-z][a-z0-9]{1,}(-[a-z0-9]+)?$/,isThemeNameValid=e=>"string"==typeof e&&THEME_NAME_PATTERN.test(e),validateThemeName=e=>{if(!1===isThemeNameValid(e))throw new Error(`[Theming] The theme identifier "${"string"==typeof e?e:""}" (Type: ${typeof e}) is not valid. Please use only follow this pattern: /^[a-z][a-z0-9]{1,}(-[a-z0-9]+)?$/`)},patchThemeTag=(e,t,o)=>{validateThemeName(e),!1===warrentyWarning&&(warrentyWarning=!0,loglevel.warn(`[Theming] The theme process is locked. This means that the theme "${e}" should not be patched.\n\nimport { register } from '@a11y-ui/core';\nimport { defineCustomElements } from '...';\nimport { THEME } from '...';\n\nregister(THEME, defineCustomElements)\n\t.then(() => {\n\t\tconst htmlDivElement: HTMLElement | null = document.querySelector<HTMLElement>('#my-app');\n    if (htmlDivElement instanceof HTMLElement) {\n      const root = createRoot(htmlDivElement);\n      root.render(<App />);\n    }\n  })\n  .catch(console.warn);`)),"object"==typeof STORE.A11yUi&&null!==STORE.A11yUi||(STORE.A11yUi={}),"object"!=typeof STORE.A11yUi||null===STORE.A11yUi||"object"==typeof STORE.A11yUi.Themes&&null!==STORE.A11yUi.Themes||(STORE.A11yUi.Themes={}),"object"!=typeof STORE.A11yUi||null===STORE.A11yUi||"object"!=typeof STORE.A11yUi.Themes||null===STORE.A11yUi.Themes||"object"==typeof STORE.A11yUi.Themes[e]&&null!==STORE.A11yUi.Themes[e]||(STORE.A11yUi.Themes[e]={}),"object"==typeof STORE.A11yUi&&null!==STORE.A11yUi&&"object"==typeof STORE.A11yUi.Themes&&null!==STORE.A11yUi.Themes&&"object"==typeof STORE.A11yUi.Themes[e]&&null!==STORE.A11yUi.Themes[e]&&(STORE.A11yUi.Themes[e][t]=o)},patchTheme=(e,t)=>{if(validateThemeName(e),"object"==typeof t&&null!==t){Object.getOwnPropertyNames(t).forEach((o=>{const n=t[o];"string"==typeof n&&n.length>0&&patchThemeTag(e,o,n)}))}return e},getThemeNode=e=>{if(e instanceof HTMLElement){if("string"==typeof e.dataset.theme)return e;{let t=e.parentNode;for(;t instanceof ShadowRoot;)t=t.host;return getThemeNode(t)}}return null},getEncroachCss=(e={})=>"false"!==e.themeEncroachCss&&"true"!==e.themeReset&&{mode:"after"===e.themeEncroachCssMode||"before"===e.themeEncroachCssMode?e.themeEncroachCssMode:"before"},isTheCurrentThemeConfigValid=()=>"object"==typeof STORE.A11yUi&&null!==STORE.A11yUi&&"object"==typeof STORE.A11yUi.Theme&&null!==STORE.A11yUi.Theme&&"boolean"==typeof STORE.A11yUi.Theme.cache&&"object"==typeof STORE.A11yUi.Theme.encroachCss&&null!==typeof STORE.A11yUi.Theme.encroachCss&&"string"==typeof STORE.A11yUi.Theme.encroachCss.mode&&"string"==typeof STORE.A11yUi.Theme.name,getThemeDetails=e=>{if("object"==typeof STORE.A11yUi&&null!==STORE.A11yUi&&"object"==typeof STORE.A11yUi.Theme&&null!==STORE.A11yUi.Theme&&"boolean"==typeof STORE.A11yUi.Theme.cache&&"object"==typeof STORE.A11yUi.Theme.encroachCss&&null!==typeof STORE.A11yUi.Theme.encroachCss&&"string"==typeof STORE.A11yUi.Theme.encroachCss.mode&&"string"==typeof STORE.A11yUi.Theme.name)return STORE.A11yUi.Theme;{const t={cache:!0,encroachCss:getEncroachCss(),loglevel:"silent",name:null},o=getThemeNode(e);return o instanceof HTMLElement&&(t.cache="false"!==o.dataset.themeCache,t.encroachCss=getEncroachCss(o.dataset),t.loglevel="debug"===o.dataset.themeLoglevel?o.dataset.themeLoglevel:"silent",t.name=o.dataset.theme||null),t}},CSS_PROPERTIES_REGISTERED=new Set,CSS_STYLE_CACHE=new Map,REGEX_CSS_PROPERTIES=/--[^;]+/g,REGEX_SPLIT_CSS_PROPERTY=/:/,extractProperties=(e,t)=>{let o=t.match(REGEX_CSS_PROPERTIES);if(Array.isArray(o)){o=o.filter((e=>REGEX_SPLIT_CSS_PROPERTY.test(e)));const t=document.createElement("style");t.innerHTML=`.${e} {${o.join(";")}}`,document.querySelector("head")?.appendChild(t)}CSS_PROPERTIES_REGISTERED.add(e)},getCssStyle=(e,t)=>"object"==typeof STORE.A11yUi&&null!==STORE.A11yUi&&"object"==typeof STORE.A11yUi.Themes&&null!==STORE.A11yUi.Themes&&"object"==typeof STORE.A11yUi.Themes[e]&&null!==STORE.A11yUi.Themes[e]&&"string"==typeof STORE.A11yUi.Themes[e][t]?STORE.A11yUi.Themes[e][t].replace(/\r?\n/g,""):"",removeStyle=e=>{for(const t of Array.from(e.childNodes)){if(!(t instanceof HTMLStyleElement&&"STYLE"===t.tagName))break;e.removeChild(t)}},GLOBAL_A11Y_STYLE="* {\n  hyphens: auto;\n  letter-spacing: inherit;\n  word-break: break-word;\n  word-spacing: inherit;\n}".replace(/\r?\n/g,""),patchStyle=(e,t)=>{try{const o=[];t.forEach((e=>{const t=new CSSStyleSheet;t.replaceSync(e),o.push(t)})),e.adoptedStyleSheets=o}catch(o){t.reverse().forEach((t=>{const o=document.createElement("style");o.innerHTML=t,e.insertBefore(o,e.firstChild)}))}},minifyCss=(e,t)=>{t(e)},setThemeStyleAfterHydrated=(e,t,o)=>{const n=t.cache,r=t.encroachCss,i=t.name||"default",l=e.shadowRoot;let a;if(CSS_STYLE_CACHE.get(i)?.has(e.tagName))a=CSS_STYLE_CACHE.get(i)?.get(e.tagName),switchStyle(e,l,a,o);else{const c=getCssStyle(i,"GLOBAL"),d=getCssStyle(i,e.tagName);if(!1===CSS_PROPERTIES_REGISTERED.has(i)&&extractProperties(i,c),a=[c,d],!1!==r){const e=[...Array.from(l.childNodes).filter((e=>e instanceof HTMLStyleElement&&"STYLE"===e.tagName))],t=[...Array.from(l.adoptedStyleSheets)];"before"===r?.mode?(e.reverse().forEach((e=>a.unshift(e.innerHTML))),t.reverse().forEach((e=>a.unshift(Array.from(e.cssRules).map((e=>e.cssText)).join(""))))):"after"===r?.mode&&(e.forEach((e=>a.push(e.innerHTML))),t.forEach((e=>a.push(Array.from(e.cssRules).map((e=>e.cssText)).join("")))))}a.unshift(GLOBAL_A11Y_STYLE),s=r=>{"debug"===t.loglevel&&console.log(e.tagName,r),!0===n&&(!1===CSS_STYLE_CACHE.has(i)&&CSS_STYLE_CACHE.set(i,new Map),CSS_STYLE_CACHE.get(i)?.set(e.tagName,r)),switchStyle(e,l,r,o)},s(a)}var s},switchStyle=(e,t,o,n)=>{removeStyle(t),patchStyle(t,o),e.style.display=n},waitForHydrated=(e,t,o)=>{const n=setTimeout((()=>{clearTimeout(n),e.classList.contains("hydrated")?setThemeStyleAfterHydrated(e,t,o):waitForHydrated(e,t,o)}),25)},setThemeStyle=(e,t)=>{const o=`${e.style.display}`;e.style.display="none",waitForHydrated(e,t,o)};class ModalService{constructor(){this.lockedElements=new Map,this.modalStack=new Map}lockElement(e){const t=e.getAttribute("tabindex");(e instanceof HTMLAnchorElement||e instanceof HTMLButtonElement||e instanceof HTMLInputElement||e instanceof HTMLSelectElement||e instanceof HTMLTextAreaElement||"string"==typeof t||void 0!==e.dataset.kolModal)&&("string"==typeof t?this.lockedElements.set(e,{tabIndex:t}):this.lockedElements.set(e,{}),e.setAttribute("tabindex","-1"),e.setAttribute("aria-hidden","true"),e.style.userSelect="none")}unlockElement(e,t){"string"==typeof e.tabIndex?t.setAttribute("tabindex",e.tabIndex):t.removeAttribute("tabindex"),t.removeAttribute("aria-hidden"),t.style.userSelect="unset",this.lockedElements.delete(t)}unlockLockedElements(e){e.forEach(this.unlockElement.bind(this))}lockFocus(e,t){if(e!==t&&(e instanceof HTMLElement||e instanceof ShadowRoot)){e instanceof HTMLElement&&(this.lockElement(e),this.lockFocus(e.shadowRoot,t));for(let o=0;o<e.children.length;o++)this.lockFocus(e.children[o],t)}}renderModalIfExists(e){if(e instanceof HTMLElement){this.lockedElements.has(e)&&this.unlockElement(this.lockedElements.get(e),e);const t=setTimeout((()=>{clearTimeout(t),e.focus()}),500)}if(this.unlockLockedElements(this.lockedElements),this.modalStack.size>0){const e=Array.from(this.modalStack.keys()),t=e[e.length-1];this.modalStack.forEach(((e,o)=>{o.style.display=t===o?"inline":"none"})),getDocument().body.style.maxHeight="100vh",getDocument().body.style.overflow="hidden",this.lockFocus(getDocument().body,t)}else getDocument().body.style.maxHeight="unset",getDocument().body.style.overflow="unset"}openModal(e,t){e instanceof HTMLElement==!1?Log.warn("[KolModalService] Die DOM-Referenz des Modals ist nicht valide."):(this.modalStack.set(e,{activeElement:t}),this.renderModalIfExists())}closeModal(e){var t;if(e instanceof HTMLElement==!1)Log.warn("[KolModalService] Die DOM-Referenz des Modals ist nicht valide.");else{const o=null===(t=this.modalStack.get(e))||void 0===t?void 0:t.activeElement;this.modalStack.delete(e),this.renderModalIfExists(o)}}}class ToasterService{constructor(e){this.document=e,this.queue=new Set,this.isOpen=!1,this.toastElement=this.document.createElement("kol-toast"),this.toastElement.setAttribute("_level","3"),this.toastElement.setAttribute("_show","false"),this.toastElement.setAttribute("_show-duration","-1"),this.toastElement.setAttribute("_has-closer","true"),this.toastElement._on={onClose:()=>{const e=this.queue.values().next();e.value?(this.queue.delete(e.value),setTimeout((()=>{this.showToast(e.value)}),200)):this.isOpen=!1}},this.document.body.insertBefore(this.toastElement,this.document.body.firstChild)}enqueue(e){this.isOpen?this.queue.add(e):this.showToast(e)}showToast(e){this.toastElement.setAttribute("_heading",e.heading),this.toastElement.setAttribute("_show","true"),this.toastElement.setAttribute("_type",e.type),this.toastElement.innerText=e.description,this.isOpen=!0}}let WINDOW=null,DOCUMENT=null;const configKoliBri=e=>{e instanceof Window?(WINDOW=e,WINDOW.document instanceof Document?DOCUMENT=e.document:console.warn("The given Window has no valid Document.")):console.warn("The given Window is not valid.")},getWindow=()=>WINDOW||"undefined"==typeof window?null:window,getDocument=()=>DOCUMENT||void 0===getWindow().document?null:getWindow().document;let META_CONFIG=null,DEV_MODE=null,EXPERIMENTAL_MODE=null,COLOR_CONTRAST_ANALYSIS=null;const getDevMode=()=>!0===DEV_MODE,getExperimalMode=()=>!0===EXPERIMENTAL_MODE,getColorContrastAnalysis=()=>!0===COLOR_CONTRAST_ANALYSIS;class Log{static mapToArray(e){return Array.isArray(e)?e:[e]}static handleClassifier(e){return"string"==typeof e&&e.length>0?`${Log.shield.label} | ${e}`:Log.shield.label}static getShield(e){return[Log.handleClassifier(null==e?void 0:e.classifier),`${Log.shield.style};${(null==e?void 0:e.overwriteStyle)||""}`]}static debug(e,t){(DEV_MODE||!0===(null==t?void 0:t.forceLog))&&console.log(...Log.getShield(t),...Log.mapToArray(e))}static info(e,t){(DEV_MODE||!0===(null==t?void 0:t.forceLog))&&console.info(...Log.getShield(t),...Log.mapToArray(e))}static trace(e,t){(DEV_MODE||!0===(null==t?void 0:t.forceLog))&&console.trace(...Log.getShield(t),...Log.mapToArray(e))}static warn(e,t){(DEV_MODE||!0===(null==t?void 0:t.forceLog))&&console.warn(...Log.getShield(t),...Log.mapToArray(e))}static error(e,t){(DEV_MODE||!0===(null==t?void 0:t.forceLog))&&console.error(...Log.getShield(t),...Log.mapToArray(e))}static throw(e,t){if(DEV_MODE||!0===(null==t?void 0:t.forceLog))throw new Error(...Log.getShield(t),...Log.mapToArray(e))}}Log.shield={label:"%cKoliBri",style:"color: white; background: #666; font-weight: bold; padding: .25em .5em; border-radius: 3px; border: 1px solid #000"};const initMeta=()=>{if(null===DEV_MODE&&null===EXPERIMENTAL_MODE&&null===COLOR_CONTRAST_ANALYSIS){const e=getDocument().querySelector('meta[name="kolibri"]');e&&e.hasAttribute("content")&&(META_CONFIG=e.getAttribute("content"),"string"==typeof META_CONFIG&&(DEV_MODE=META_CONFIG.includes("dev-mode=true"),EXPERIMENTAL_MODE=META_CONFIG.includes("experimental-mode=true"),COLOR_CONTRAST_ANALYSIS=META_CONFIG.includes("color-contrast-analysis=true")))}else console.warn("You can only initialize DEV_MODE and COLOR_CONTRAST_ANALYSIS once.")};let KoliBri=null;const getKoliBri=()=>KoliBri||{},initKoliBri=()=>{if(null===KoliBri){KoliBri=getWindow().KoliBri||{};const e=new ModalService,t=new ToasterService(getDocument());Object.defineProperty(KoliBri,"Modal",{get:function(){return e}}),Object.defineProperty(KoliBri,"Toaster",{get:function(){return t}}),initMeta()}else console.warn("You can only initialize KoliBri once.")},renderDevAdvice=()=>{void 0===getWindow().KoliBri&&Object.defineProperty(window,"KoliBri",{get:function(){return KoliBri}}),!0!==getKoliBri().adviceShown&&(Object.defineProperty(KoliBri,"adviceShown",{get:function(){return!0}}),Log.debug("\n\nSie verwenden die KoliBri-Komponenten-Bibliothek. Sollten Sie Verbesserungsvorschläge haben oder ein Problem feststellen, dann wenden Sie sich gerne an kolibri@itzbund.de.\n\nHinweise:\n- WAI Web Accessibility Tutorials (https://www.w3.org/WAI/tutorials/)\n- The first rule of ARIA is “Don't use ARIA” (https://cccaccessibility.org/web-1/web-developer-tutorials/how-not-to-use-aria)\n- BIK BITV-Test (https://www.bitvtest.de/bitv_test.html)\n- A11y-Checkliste (https://www.a11yproject.com/checklist/)\n- BSI CON.10: Entwicklung von Webanwendungen (Edition 2021)\n\n"))};let nonce=()=>Math.floor(16777215*Math.random()).toString(16);const pushNodes=(e,t)=>{t.forEach((t=>{!1===e.has(t)&&e.add(t)}))},querySelectorAll=(e,t=document)=>{if(t instanceof Document||t instanceof HTMLElement||t instanceof ShadowRoot){const o=new Set;pushNodes(o,t.querySelectorAll(e));const n=t.querySelectorAll('[class*="hydrated"]');for(let t=0;t<n.length;t++){const r=n[t].shadowRoot;pushNodes(o,querySelectorAll(e,"object"==typeof r&&null!==r?r:n[t]))}return Array.from(o)}throw new Error("The parameter document for the method querySelectorAll is not type of Document, HTMLElement or ShadowRoot.")},querySelector=(e,t=document)=>{if(t instanceof Document||t instanceof HTMLElement||t instanceof ShadowRoot){let o=t.querySelector(e);if(null===o){const n=t.querySelectorAll('[class*="hydrated"]');for(let t=0;t<n.length;t++){const r=n[t].shadowRoot;if(o=querySelector(e,"object"==typeof r&&null!==r?r:n[t]),null!==o)break}}return o}throw new Error("The parameter document for the method querySelector is not type of Document, HTMLElement or ShadowRoot.")};var rgbaConvert=arr,arr_1=arr,obj_1=obj,css_1=css,hex_1=hex,num_1=num;function arr(e){var t=parse(e);return 3==t.length?t.concat(255):(t[3]=Math.round(t[3]),t)}function obj(e){var t=parse(e);return{r:t[0],g:t[1],b:t[2],a:3==t.length?255:Math.round(t[3])}}function css(e){var t=parse(e);return 3==t.length&&t.push(255),255==t[3]?"rgb("+t[0]+", "+t[1]+", "+t[2]+")":0==t[3]?"rgba("+t[0]+", "+t[1]+", "+t[2]+", 0)":"rgba("+t[0]+", "+t[1]+", "+t[2]+", "+String(t[3]/255).substr(1)+")"}function hex(e){3==(t=parse(e)).length&&t.push(255);var t,o=255==t[3],n=num2hex(t[0]),r=num2hex(t[1]),i=num2hex(t[2]),l=isshort(n,r,i,t=num2hex(Math.round(t[3])));return o?l?"#"+n.charAt(0)+r.charAt(0)+i.charAt(0):"#"+n+r+i:l?"#"+n.charAt(0)+r.charAt(0)+i.charAt(0)+t.charAt(0):"#"+n+r+i+t}function num(e){var t=parse(e);return 3==t.length?t.push(255):t[3]=Math.round(t[3]),(t[3]<<24>>>0|t[0]<<16|t[1]<<8|t[2])>>>0}function parse(e){return"string"==typeof e?name(e=e.toLowerCase())||hex3(e)||hex6(e)||rgb(e)||rgba(e)||[0,0,0,255]:object(e)||array(e)||number(e)||[0,0,0,255]}function num2hex(e){var t=e.toString(16);return 1==t.length?"0"+t:t}function isshort(e,t,o,n){var r=["ff","00","11","22","33","44","55","66","77","88","99","aa","bb","cc","dd","ee"];return-1!=r.indexOf(e)&&-1!=r.indexOf(t)&&-1!=r.indexOf(o)&&-1!=r.indexOf(n)}function name(e){return"red"==e?[255,0,0]:"green"==e?[0,255,0]:"blue"==e?[0,0,255]:"black"==e?[0,0,0]:"white"==e?[255,255,255]:"cyan"==e?[0,255,255]:"gray"==e||"grey"==e?[128,128,128]:"magenta"==e||"pink"==e?[255,0,255]:"yellow"==e?[255,255,0]:void 0}function hex2num(e){return 1==e.length?parseInt(e+e,16):parseInt(e,16)}function hex3(e){var t=e.replace(/^#/,""),o=t.length;if(3==o||4==o){var n=hex2num(t[0]),r=hex2num(t[1]),i=hex2num(t[2]),l=3==o?255:hex2num(t[3]);if(isNaN(n)||isNaN(r)||isNaN(i)||isNaN(l))return;return[n,r,i,l]}}function hex6(e){var t=e.replace(/^#/,""),o=t.length;if(6==o||8==o){var n=hex2num(t.slice(0,2)),r=hex2num(t.slice(2,4)),i=hex2num(t.slice(4,6)),l=6==o?255:hex2num(t.slice(6,8));if(isNaN(n)||isNaN(r)||isNaN(i)||isNaN(l))return;return[n,r,i,l]}}function getnum(e,t){return"number"!=typeof e||!0===t&&Math.floor(e)!==e?-1:e>=0&&e<=255?e:-1}function object(e){if("[object Object]"===Object.prototype.toString.call(e)&&Object.getPrototypeOf(e)===Object.getPrototypeOf({})){var t=getnum(null!=e.r?e.r:null!=e.red?e.red:0,!0),o=getnum(null!=e.g?e.g:null!=e.green?e.green:0,!0),n=getnum(null!=e.b?e.b:null!=e.blue?e.blue:0,!0),r=getnum(null!=e.a?e.a:null!=e.alpha?e.alpha:255,!0);if(-1!=t&&-1!=o&&-1!=n&&-1!=r)return[t,o,n,r]}}function array(e){if(Array.isArray(e)&&(3==e.length||4==e.length)){var t=getnum(e[0],!0),o=getnum(e[1],!0),n=getnum(e[2],!0),r=getnum(null!=e[3]?e[3]:255,!0);if(-1!=t&&-1!=o&&-1!=n&&-1!=r)return[t,o,n,r]}}function number(e){if("number"==typeof e&&Math.floor(e)==e&&e<=4294967295&&e>=0)return[e>>16&255,e>>8&255,255&e,e>>24&255]}function rgb(e){if("rgb("==e.substr(0,4)){var t=(e=e.match(/^rgb\(([^)]+)\)/)[1]).split(/ *, */).map(Number),o=getnum(t[0],!0),n=getnum(t[1],!0),r=getnum(t[2],!0);if(-1!=o&&-1!=n&&-1!=r)return[o,n,r,255]}}function rgba(e){if("rgba("==e.substr(0,5)){var t=(e=e.match(/^rgba\(([^)]+)\)/)[1]).split(/ *, */).map(Number),o=getnum(t[0],!0),n=getnum(t[1],!0),r=getnum(t[2],!0),i=getnum(255*t[3]);if(-1!=o&&-1!=n&&-1!=r&&-1!=i)return[o,n,r,i]}}rgbaConvert.arr=arr_1,rgbaConvert.obj=obj_1,rgbaConvert.css=css_1,rgbaConvert.hex=hex_1,rgbaConvert.num=num_1;const a11yCache=new Set,a11yHint=e=>{!1===a11yCache.has(e)&&(a11yCache.add(e),Log.info(e,{classifier:"✋a11y",overwriteStyle:"; background-color: #09f"}))},deprecatedCache=new Set,deprecatedHint=e=>{!1===deprecatedCache.has(e)&&(deprecatedCache.add(e),Log.warn(e,{classifier:"🔥deprecated",forceLog:!0,overwriteStyle:"; background-color: #f00"}))},devCache=new Set,devHint=e=>{!1===devCache.has(e)&&(devCache.add(e),Log.debug(e,{classifier:"💻dev",overwriteStyle:"; background-color: #f09"}))},featureCache=new Set,featureHint=(e,t=!1)=>{!1===featureCache.has(e)&&(featureCache.add(e),e+=!0===t?" ✅":"",Log.debug(e,{classifier:"🌟feature",overwriteStyle:"; background-color: #309"}))};devHint("Wir freuen uns über jedes Feedback, Kommentare, Screenshots oder Demo-Links von einer auf KoliBri-basierenden Anwendung (kolibri@itzbund.de). Vielen Dank!");const uiUxCache=new Set,uiUxHint=e=>{!1===uiUxCache.has(e)&&(uiUxCache.add(e),Log.debug(e,{classifier:"📑ui/ux",overwriteStyle:"; background-color: #060;"}))},a11yHintDisabled=()=>{a11yHint('"Disabled" schränkt die Zugänglichkeit und Sichtbarkeit ein. Wir empfehlen aus Sicht der Barrierefreiheit readonly- statt disabled-Attribut zu verwenden.\n- https://uxdesign.cc/is-it-ok-to-grey-out-disabled-buttons-8afa74a0fae')},a11yHintLabelingLandmarks=e=>{"string"==typeof e&&""!==e||a11yHint("Manche Strukturelemente, wie bspw. der nav-Tag, können mehrfach in einer Webseite verwendet werden. Damit die gleichnamigen Strukturelemente voneinander unterschieden werden können, ist es erforderlich ein Aria-Label zu setzen.\n- https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/Navigation_Role#accessibility_concerns")},uiUxHintMillerscheZahl=(e,t=8)=>{var o;t>7&&(o=`[${e}] Innerhalb von Navigationsstrukturen wird empfohlen nicht mehr als 7 Menüpunkte zu verwenden.\n\nLinks:\n- https://de.ryte.com/wiki/Millersche_Zahl\n- https://de.wikipedia.org/wiki/Millersche_Zahl`,!1===uiUxCache.has(o)&&(uiUxCache.add(o),Log.debug(o,{classifier:"📑ui/ux",overwriteStyle:"; background-color: #060;"})))},OBJECT_OBJECT=/\[object Object\]/,objectObjectHandler=(e,t)=>{"string"==typeof e&&OBJECT_OBJECT.test(e)||t()},emptyStringByArrayHandler=(e,t)=>{"string"==typeof e&&""===e||t()},setEventTargetAndStopPropagation=(e,t)=>{getExperimalMode()&&(Log.debug([e,t]),Log.debug("↑ We propagate the (submit) event to this target.")),Object.defineProperty(e,"target",{value:t,writable:!1})},patchState=e=>{var t,o,n;null===(t=e.nextHooks)||void 0===t||t.forEach(((t,o)=>{var n;const r=t.get("beforePatch");"function"==typeof r&&r(null===(n=e.nextState)||void 0===n?void 0:n.get(o),e.nextState,e,o)})),(null===(o=e.nextState)||void 0===o?void 0:o.size)>0&&(e.state=Object.assign(Object.assign({},e.state),Object.fromEntries(e.nextState)),delete e.nextState,null===(n=e.nextHooks)||void 0===n||n.forEach(((t,o)=>{const n=t.get("afterPatch");"function"==typeof n&&n(e.state[o],e.state,e,o)}))),delete e.nextHooks},setState=(e,t,o,n={})=>{var r,i;if(void 0===e.nextHooks&&(e.nextHooks=new Map),void 0===e.nextState&&(e.nextState=new Map),e.nextState.get(t)!==o){e.nextHooks.get(t)instanceof Map==!1&&e.nextHooks.set(t,new Map),"function"==typeof n.afterPatch&&(null===(r=e.nextHooks.get(t))||void 0===r||r.set("afterPatch",n.afterPatch)),"function"==typeof n.beforePatch&&(null===(i=e.nextHooks.get(t))||void 0===i||i.set("beforePatch",n.beforePatch)),e.nextState.set(t,o),patchState(e)}},logWarn=(e,t,o,n)=>{devHint(`[${e.constructor.name}] Der Property-Wert (${o}) für '${t}' ist nicht valide. Folgende Werte sind erlaubt: ${Array.from(n).join(", ")}`)},watchValidator=(e,t,o,n,r,i={})=>{o(r)?setState(e,t,r,null==i?void 0:i.hooks):void 0===r||null===r&&(void 0===(null==i?void 0:i.required)||!1===(null==i?void 0:i.required))?setState(e,t,null==i?void 0:i.defaultValue,null==i?void 0:i.hooks):(void 0!==(null==i?void 0:i.required)&&!1!==(null==i?void 0:i.required)||n.add(null),logWarn(e,t,r,n))},watchBoolean=(e,t,o,n)=>{watchValidator(e,t,(e=>"boolean"==typeof e),new Set(["Boolean {true, false}"]),o,n)},watchString=(e,t,o,n={})=>{const r="number"==typeof n.minLength?null==n?void 0:n.minLength:0;watchValidator(e,t,(e=>"string"==typeof e&&e.length>=r),new Set([`String (Mindestlänge ${r})`]),o,n)},watchNumber=(e,t,o,n)=>{watchValidator(e,t,(e=>"number"==typeof e&&(void 0===(null==n?void 0:n.min)||"number"==typeof(null==n?void 0:n.min)&&e>=n.min)&&(void 0===(null==n?void 0:n.max)||"number"==typeof(null==n?void 0:n.max)&&e<=n.max)),new Set(["Number"]),o,n)},watchJsonArrayString=(e,t,o,n,r=(e=>e==e),i={})=>{emptyStringByArrayHandler(n,(()=>{objectObjectHandler(n,(()=>{void 0===n&&(n=[]);try{try{n=parseJson(n)}catch(e){}if(Array.isArray(n)){const l=n.find((e=>!o(e)));void 0===l&&r(n)?setState(e,t,n,i.hooks):objectObjectHandler(l,(()=>{throw Log.debug(l),new Error("↑ Das Schema für das Property (_options) ist nicht valide. Der Wert wird nicht geändert.")}))}else objectObjectHandler(n,(()=>{throw Log.debug(n),new Error("↑ Das Schema für das Property (_options) ist nicht valide. Der Wert wird nicht geändert.")}))}catch(e){Log.debug(e)}}))}))},BOOLEAN=/^(true|false)$/,INTEGER=/^-?(0|[1-9]\d*)$/,FLOAT=/^-?(0.|[1-9]\d*.)\d*[1-9]$/,mapString2Unknown=e=>{const t=typeof e,o=`${e}`;if("string"==typeof e)if(BOOLEAN.test(e))e="true"===e;else if(INTEGER.test(e))e=parseInt(e);else if(FLOAT.test(e))e=parseFloat(e);else if(JSON_CHARS.test(e))try{e=parseJson(e)}catch(e){}return t!==typeof e&&devHint(`You have used a stringified property value (${o} to ${JSON.stringify(e)}) which type switched from ${t} to ${typeof e}!`),e},stringifyJson=e=>{try{return JSON.stringify(e).replace(/"/g,"'")}catch(t){throw Log.warn(["stringifyJson",e]),Log.error("↑ Das JSON konnte nicht in einen String umgewandelt werden. Es wird ein stringifizierbares JSON erwartet."),new Error}},JSON_CHARS=/^[{[]/,parseJson=e=>{if("string"==typeof e)try{return JSON.parse(e)}catch(t){if(JSON_CHARS.test(e))try{return JSON.parse(e.replace(/'/g,'"'))}catch(t){Log.warn(["parseJson",e]),Log.error("↑ Der JSON-String konnte nicht geparsed werden. Achten Sie darauf, dass einfache Anführungszeichen im Text maskiert werden (&#8216;).")}}throw new Error},mapBoolean2String=e=>"boolean"==typeof e?!0===e?"true":"false":void 0,mapStringOrBoolean2String=e=>"string"==typeof e?e:mapBoolean2String(e),koliBriQuerySelector=(e,t)=>querySelector(e,t||getDocument()),koliBriQuerySelectorAll=(e,t)=>querySelectorAll(e,t||getDocument());let DEFAULT_COLOR_CONTRAST=null;const getDefaultColorContrast=()=>(DEFAULT_COLOR_CONTRAST=DEFAULT_COLOR_CONTRAST||{backgroundColor:"#00000000",color:"#00000000",domNode:getDocument().body,level:"Fail",score:1},DEFAULT_COLOR_CONTRAST),TRANSPARENT_REGEXP=/(\d+, ){3}0\)/,koliBriA11yColorContrast=(e,t=getDefaultColorContrast())=>{const o=getComputedStyle(e),n=TRANSPARENT_REGEXP.test(o.backgroundColor)?t.backgroundColor:rgbaConvert.hex(o.backgroundColor),r=TRANSPARENT_REGEXP.test(o.color)?t.color:rgbaConvert.hex(o.color),i=s(n,r),l={backgroundColor:n,color:r,domNode:e,level:f(i),score:i};return i<4.5&&Log.error(["Color-Contrast-Error",{backgroundColor:l.backgroundColor,color:l.color,level:l.level,score:l.score},l.domNode]),l},koliBriQuerySelectorColors=(e,t=getDefaultColorContrast())=>{t.domNode instanceof HTMLElement&&(t=koliBriA11yColorContrast(t.domNode,t));const o=t.domNode.querySelector(e);if(null===o){const o=t.domNode.querySelectorAll('[class="hydrated"]');for(let n=0;n<o.length&&(t.domNode=o[n],null===(t=koliBriQuerySelectorColors(e,t)).domNode);n++);return t}return koliBriA11yColorContrast(o,t)},scrollByHTMLElement=(e,t=window)=>{e instanceof HTMLElement?(t.scrollTo({behavior:"smooth",top:e.getBoundingClientRect().top+getWindow().pageYOffset-50}),e.focus()):devHint("Das HTMLElement ist nicht valide, zu dem gescrollt werden soll.")},scrollBySelector=(e,t)=>{if((e instanceof Document||e instanceof HTMLElement||e instanceof ShadowRoot)&&"string"==typeof t){devHint("Bei der Methode querySelectorAll wurden die Parameter document, selector in selector, document getauscht, da der Parameter selector nicht, allerdings der Parameter document optional sein kann.");const o=`${t}`;t=e,e=o}if("string"==typeof e){const o=koliBriQuerySelector(e,t);o instanceof HTMLElement?scrollByHTMLElement(o):devHint(`Es konnte kein HTMLElement mit dem Selector (${e}) gefunden werden, zu dem gescrollt werden soll.`)}else devHint("Der Selector ist nicht valide, zu dem gescrollt werden soll.")};class KoliBriUtils{static queryHtmlElementColors(e,t,o=!1,n=!0){let r=null;if(!0===o||!1===KoliBriUtils.executionLock)if(!1===o&&(KoliBriUtils.cache.clear(),KoliBriUtils.cache.set(t.domNode,t),KoliBriUtils.executionLock=!0,!0===n&&Log.debug("[KoliBriUtils] Color contrast analysis started...")),e===t.domNode)r=t;else{const o=new Set;if(t.domNode.shadowRoot){const e=t.domNode.shadowRoot.children;for(let t=0;t<e.length;t++)o.add(e[t])}const n=t.domNode;if("function"==typeof n.assignedNodes){const e=n.assignedNodes();for(let t=0;t<e.length;t++)e[t]instanceof HTMLElement&&o.add(e[t])}const i=t.domNode.children;for(let e=0;e<i.length;e++)o.add(i[e]);const l=Array.from(o);for(let o=0;o<l.length;o++){let n=KoliBriUtils.cache.get(l[o]);void 0===n&&(n=koliBriA11yColorContrast(l[o],t)),KoliBriUtils.cache.set(l[o],n);const i=KoliBriUtils.queryHtmlElementColors(e,n,!0,!1);if(null!==i){r=i;break}}}else Log.debug("[KoliBriUtils] Call aborted because a color contrast analysis is currently being executed.");return!1===o&&(!0===n&&Log.debug(`[KoliBriUtils] Color contrast analysis finished (${KoliBriUtils.cache.size} DOM elements are analysed).`),KoliBriUtils.executionLock=!1,KoliBriUtils.cache.clear()),r}}KoliBriUtils.executionLock=!1,KoliBriUtils.cache=new Map;class KoliBriDevHelper{}KoliBriDevHelper.patchTheme=patchTheme,KoliBriDevHelper.patchThemeTag=patchThemeTag,KoliBriDevHelper.querySelector=koliBriQuerySelector,KoliBriDevHelper.querySelectorAll=koliBriQuerySelectorAll,KoliBriDevHelper.scrollByHTMLElement=scrollByHTMLElement,KoliBriDevHelper.scrollBySelector=scrollBySelector,KoliBriDevHelper.stringifyJson=stringifyJson;export{mapString2Unknown as A,getKoliBri as B,emptyStringByArrayHandler as C,koliBriQuerySelector as D,initKoliBri as E,getDevMode as F,renderDevAdvice as G,getColorContrastAnalysis as H,KoliBriUtils as I,koliBriA11yColorContrast as J,KoliBriDevHelper as K,Log as L,KoliBri as M,koliBriQuerySelectorAll as N,koliBriQuerySelectorColors as O,stringifyJson as P,STORE as S,ToasterService as T,watchValidator as a,watchNumber as b,configKoliBri as c,devHint as d,a11yHint as e,setEventTargetAndStopPropagation as f,getThemeDetails as g,getExperimalMode as h,getDocument as i,mapBoolean2String as j,watchBoolean as k,a11yHintDisabled as l,mapStringOrBoolean2String as m,nonce as n,setState as o,featureHint as p,objectObjectHandler as q,rgbaConvert as r,setThemeStyle as s,parseJson as t,deprecatedHint as u,a11yHintLabelingLandmarks as v,watchString as w,watchJsonArrayString as x,uiUxHintMillerscheZahl as y,scrollBySelector as z};
+import{s,f}from"./index.m.js";var commonjsGlobal="undefined"!=typeof globalThis?globalThis:"undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:{};function createCommonjsModule(e,t,o){return e(o={path:t,exports:{},require:function(e,t){return commonjsRequire()}},o.exports),o.exports}function commonjsRequire(){throw new Error("Dynamic requires are not currently supported by @rollup/plugin-commonjs")}var loglevel=createCommonjsModule((function(e){var t,o;t=commonjsGlobal,o=function(){var e=function(){},t="undefined",o=typeof window!==t&&typeof window.navigator!==t&&/Trident\/|MSIE /.test(window.navigator.userAgent),n=["trace","debug","info","warn","error"];function r(e,t){var o=e[t];if("function"==typeof o.bind)return o.bind(e);try{return Function.prototype.bind.call(o,e)}catch(t){return function(){return Function.prototype.apply.apply(o,[e,arguments])}}}function i(){console.log&&(console.log.apply?console.log.apply(console,arguments):Function.prototype.apply.apply(console.log,[console,arguments])),console.trace&&console.trace()}function l(n){return"debug"===n&&(n="log"),typeof console!==t&&("trace"===n&&o?i:void 0!==console[n]?r(console,n):void 0!==console.log?r(console,"log"):e)}function a(t,o){for(var r=0;r<n.length;r++){var i=n[r];this[i]=r<t?e:this.methodFactory(i,t,o)}this.log=this.debug}function s(e,o,n){return function(){typeof console!==t&&(a.call(this,o,n),this[e].apply(this,arguments))}}function c(e,t,o){return l(e)||s.apply(this,arguments)}function d(e,o,r){var i,l=this;o=null==o?"WARN":o;var s="loglevel";function d(){var e;if(typeof window!==t&&s){try{e=window.localStorage[s]}catch(e){}if(typeof e===t)try{var o=window.document.cookie,n=o.indexOf(encodeURIComponent(s)+"=");-1!==n&&(e=/^([^;]+)/.exec(o.slice(n))[1])}catch(e){}return void 0===l.levels[e]&&(e=void 0),e}}"string"==typeof e?s+=":"+e:"symbol"==typeof e&&(s=void 0),l.name=e,l.levels={TRACE:0,DEBUG:1,INFO:2,WARN:3,ERROR:4,SILENT:5},l.methodFactory=r||c,l.getLevel=function(){return i},l.setLevel=function(o,r){if("string"==typeof o&&void 0!==l.levels[o.toUpperCase()]&&(o=l.levels[o.toUpperCase()]),!("number"==typeof o&&o>=0&&o<=l.levels.SILENT))throw"log.setLevel() called with invalid level: "+o;if(i=o,!1!==r&&function(e){var o=(n[e]||"silent").toUpperCase();if(typeof window!==t&&s){try{return void(window.localStorage[s]=o)}catch(e){}try{window.document.cookie=encodeURIComponent(s)+"="+o+";"}catch(e){}}}(o),a.call(l,o,e),typeof console===t&&o<l.levels.SILENT)return"No console available for logging"},l.setDefaultLevel=function(e){o=e,d()||l.setLevel(e,!1)},l.resetLevel=function(){l.setLevel(o,!1),function(){if(typeof window!==t&&s){try{return void window.localStorage.removeItem(s)}catch(e){}try{window.document.cookie=encodeURIComponent(s)+"=; expires=Thu, 01 Jan 1970 00:00:00 UTC"}catch(e){}}}()},l.enableAll=function(e){l.setLevel(l.levels.TRACE,e)},l.disableAll=function(e){l.setLevel(l.levels.SILENT,e)};var u=d();null==u&&(u=o),l.setLevel(u,!1)}var u=new d,h={};u.getLogger=function(e){if("symbol"!=typeof e&&"string"!=typeof e||""===e)throw new TypeError("You must supply a name when creating a logger.");var t=h[e];return t||(t=h[e]=new d(e,u.getLevel(),u.methodFactory)),t};var m=typeof window!==t?window.log:void 0;return u.noConflict=function(){return typeof window!==t&&window.log===u&&(window.log=m),u},u.getLoggers=function(){return h},u.default=u,u},e.exports?e.exports=o():t.log=o()}));const STORE="object"==typeof window?window:"object"==typeof global?global:"object"==typeof self?self:{};let warrentyWarning=!1;const THEME_NAME_PATTERN=/^[a-z][a-z0-9]{1,}(-[a-z0-9]+)?$/,isThemeNameValid=e=>"string"==typeof e&&THEME_NAME_PATTERN.test(e),validateThemeName=e=>{if(!1===isThemeNameValid(e))throw new Error(`[Theming] The theme identifier "${"string"==typeof e?e:""}" (Type: ${typeof e}) is not valid. Please use only follow this pattern: /^[a-z][a-z0-9]{1,}(-[a-z0-9]+)?$/`)},patchThemeTag=(e,t,o)=>{validateThemeName(e),!1===warrentyWarning&&(warrentyWarning=!0,loglevel.warn(`[Theming] The theme process is locked. This means that the theme "${e}" should not be patched.\n\nimport { register } from '@a11y-ui/core';\nimport { defineCustomElements } from '...';\nimport { THEME } from '...';\n\nregister(THEME, defineCustomElements)\n\t.then(() => {\n\t\tconst htmlDivElement: HTMLElement | null = document.querySelector<HTMLElement>('#my-app');\n    if (htmlDivElement instanceof HTMLElement) {\n      const root = createRoot(htmlDivElement);\n      root.render(<App />);\n    }\n  })\n  .catch(console.warn);`)),"object"==typeof STORE.A11yUi&&null!==STORE.A11yUi||(STORE.A11yUi={}),"object"!=typeof STORE.A11yUi||null===STORE.A11yUi||"object"==typeof STORE.A11yUi.Themes&&null!==STORE.A11yUi.Themes||(STORE.A11yUi.Themes={}),"object"!=typeof STORE.A11yUi||null===STORE.A11yUi||"object"!=typeof STORE.A11yUi.Themes||null===STORE.A11yUi.Themes||"object"==typeof STORE.A11yUi.Themes[e]&&null!==STORE.A11yUi.Themes[e]||(STORE.A11yUi.Themes[e]={}),"object"==typeof STORE.A11yUi&&null!==STORE.A11yUi&&"object"==typeof STORE.A11yUi.Themes&&null!==STORE.A11yUi.Themes&&"object"==typeof STORE.A11yUi.Themes[e]&&null!==STORE.A11yUi.Themes[e]&&(STORE.A11yUi.Themes[e][t]=o)},patchTheme=(e,t)=>{if(validateThemeName(e),"object"==typeof t&&null!==t){Object.getOwnPropertyNames(t).forEach((o=>{const n=t[o];"string"==typeof n&&n.length>0&&patchThemeTag(e,o,n)}))}return e},getThemeNode=e=>{if(e instanceof HTMLElement){if("string"==typeof e.dataset.theme)return e;{let t=e.parentNode;for(;t instanceof ShadowRoot;)t=t.host;return getThemeNode(t)}}return null},getEncroachCss=(e={})=>"false"!==e.themeEncroachCss&&"true"!==e.themeReset&&{mode:"after"===e.themeEncroachCssMode||"before"===e.themeEncroachCssMode?e.themeEncroachCssMode:"before"},isTheCurrentThemeConfigValid=()=>"object"==typeof STORE.A11yUi&&null!==STORE.A11yUi&&"object"==typeof STORE.A11yUi.Theme&&null!==STORE.A11yUi.Theme&&"boolean"==typeof STORE.A11yUi.Theme.cache&&"object"==typeof STORE.A11yUi.Theme.encroachCss&&null!==typeof STORE.A11yUi.Theme.encroachCss&&"string"==typeof STORE.A11yUi.Theme.encroachCss.mode&&"string"==typeof STORE.A11yUi.Theme.name,getThemeDetails=e=>{if("object"==typeof STORE.A11yUi&&null!==STORE.A11yUi&&"object"==typeof STORE.A11yUi.Theme&&null!==STORE.A11yUi.Theme&&"boolean"==typeof STORE.A11yUi.Theme.cache&&"object"==typeof STORE.A11yUi.Theme.encroachCss&&null!==typeof STORE.A11yUi.Theme.encroachCss&&"string"==typeof STORE.A11yUi.Theme.encroachCss.mode&&"string"==typeof STORE.A11yUi.Theme.name)return STORE.A11yUi.Theme;{const t={cache:!0,encroachCss:getEncroachCss(),loglevel:"silent",name:null},o=getThemeNode(e);return o instanceof HTMLElement&&(t.cache="false"!==o.dataset.themeCache,t.encroachCss=getEncroachCss(o.dataset),t.loglevel="debug"===o.dataset.themeLoglevel?o.dataset.themeLoglevel:"silent",t.name=o.dataset.theme||null),t}},CSS_PROPERTIES_REGISTERED=new Set,CSS_STYLE_CACHE=new Map,REGEX_CSS_PROPERTIES=/--[^;]+/g,REGEX_SPLIT_CSS_PROPERTY=/:/,extractProperties=(e,t)=>{let o=t.match(REGEX_CSS_PROPERTIES);if(Array.isArray(o)){o=o.filter((e=>REGEX_SPLIT_CSS_PROPERTY.test(e)));const t=document.createElement("style");t.innerHTML=`.${e} {${o.join(";")}}`,document.querySelector("head")?.appendChild(t)}CSS_PROPERTIES_REGISTERED.add(e)},getCssStyle=(e,t)=>"object"==typeof STORE.A11yUi&&null!==STORE.A11yUi&&"object"==typeof STORE.A11yUi.Themes&&null!==STORE.A11yUi.Themes&&"object"==typeof STORE.A11yUi.Themes[e]&&null!==STORE.A11yUi.Themes[e]&&"string"==typeof STORE.A11yUi.Themes[e][t]?STORE.A11yUi.Themes[e][t].replace(/\r?\n/g,""):"",removeStyle=e=>{for(const t of Array.from(e.childNodes)){if(!(t instanceof HTMLStyleElement&&"STYLE"===t.tagName))break;e.removeChild(t)}},GLOBAL_A11Y_STYLE="* {\n  hyphens: auto;\n  letter-spacing: inherit;\n  word-break: break-word;\n  word-spacing: inherit;\n}".replace(/\r?\n/g,""),patchStyle=(e,t)=>{try{const o=[];t.forEach((e=>{const t=new CSSStyleSheet;t.replaceSync(e),o.push(t)})),e.adoptedStyleSheets=o}catch(o){t.reverse().forEach((t=>{const o=document.createElement("style");o.innerHTML=t,e.insertBefore(o,e.firstChild)}))}},minifyCss=(e,t)=>{t(e)},setThemeStyleAfterHydrated=(e,t,o)=>{const n=t.cache,r=t.encroachCss,i=t.name||"default",l=e.shadowRoot;let a;if(CSS_STYLE_CACHE.get(i)?.has(e.tagName))a=CSS_STYLE_CACHE.get(i)?.get(e.tagName),switchStyle(e,l,a,o);else{const c=getCssStyle(i,"GLOBAL"),d=getCssStyle(i,e.tagName);if(!1===CSS_PROPERTIES_REGISTERED.has(i)&&extractProperties(i,c),a=[c,d],!1!==r){const e=[...Array.from(l.childNodes).filter((e=>e instanceof HTMLStyleElement&&"STYLE"===e.tagName))],t=[...Array.from(l.adoptedStyleSheets)];"before"===r?.mode?(e.reverse().forEach((e=>a.unshift(e.innerHTML))),t.reverse().forEach((e=>a.unshift(Array.from(e.cssRules).map((e=>e.cssText)).join(""))))):"after"===r?.mode&&(e.forEach((e=>a.push(e.innerHTML))),t.forEach((e=>a.push(Array.from(e.cssRules).map((e=>e.cssText)).join("")))))}a.unshift(GLOBAL_A11Y_STYLE),s=r=>{"debug"===t.loglevel&&console.log(e.tagName,r),!0===n&&(!1===CSS_STYLE_CACHE.has(i)&&CSS_STYLE_CACHE.set(i,new Map),CSS_STYLE_CACHE.get(i)?.set(e.tagName,r)),switchStyle(e,l,r,o)},s(a)}var s},switchStyle=(e,t,o,n)=>{removeStyle(t),patchStyle(t,o),e.style.display=n},waitForHydrated=e=>{const t=setTimeout((()=>{if(clearTimeout(t),STYLING_TASK_QUEUE.has(e)&&e.classList.contains("hydrated")){const{styleDisplay:t,themeDetails:o}=STYLING_TASK_QUEUE.get(e);setThemeStyleAfterHydrated(e,o,t),STYLING_TASK_QUEUE.delete(e)}else waitForHydrated(e)}),25)},observerCallback=e=>{for(const t of e)if(STYLING_TASK_QUEUE.has(t.target)&&t.target.classList.contains("hydrated")){const{styleDisplay:e,themeDetails:o}=STYLING_TASK_QUEUE.get(t.target);setThemeStyleAfterHydrated(t.target,o,e),STYLING_TASK_QUEUE.delete(t.target)}},observerOptions={attributes:!0,attributeFilter:["class"],childList:!1,subtree:!1};let observer;try{new MutationObserver(observerCallback)}catch(e){observer=null}const STYLING_TASK_QUEUE=new Map,setThemeStyle=(e,t)=>{STYLING_TASK_QUEUE.set(e,{styleDisplay:`${e.style.display}`,themeDetails:t}),observer?observer.observe(e,observerOptions):waitForHydrated(e),e.style.display="none"};class ModalService{constructor(){this.lockedElements=new Map,this.modalStack=new Map}lockElement(e){const t=e.getAttribute("tabindex");(e instanceof HTMLAnchorElement||e instanceof HTMLButtonElement||e instanceof HTMLInputElement||e instanceof HTMLSelectElement||e instanceof HTMLTextAreaElement||"string"==typeof t||void 0!==e.dataset.kolModal)&&("string"==typeof t?this.lockedElements.set(e,{tabIndex:t}):this.lockedElements.set(e,{}),e.setAttribute("tabindex","-1"),e.setAttribute("aria-hidden","true"),e.style.userSelect="none")}unlockElement(e,t){"string"==typeof e.tabIndex?t.setAttribute("tabindex",e.tabIndex):t.removeAttribute("tabindex"),t.removeAttribute("aria-hidden"),t.style.userSelect="unset",this.lockedElements.delete(t)}unlockLockedElements(e){e.forEach(this.unlockElement.bind(this))}lockFocus(e,t){if(e!==t&&(e instanceof HTMLElement||e instanceof ShadowRoot)){e instanceof HTMLElement&&(this.lockElement(e),this.lockFocus(e.shadowRoot,t));for(let o=0;o<e.children.length;o++)this.lockFocus(e.children[o],t)}}renderModalIfExists(e){if(e instanceof HTMLElement){this.lockedElements.has(e)&&this.unlockElement(this.lockedElements.get(e),e);const t=setTimeout((()=>{clearTimeout(t),e.focus()}),500)}if(this.unlockLockedElements(this.lockedElements),this.modalStack.size>0){const e=Array.from(this.modalStack.keys()),t=e[e.length-1];this.modalStack.forEach(((e,o)=>{o.style.display=t===o?"inline":"none"})),getDocument().body.style.maxHeight="100vh",getDocument().body.style.overflow="hidden",this.lockFocus(getDocument().body,t)}else getDocument().body.style.maxHeight="unset",getDocument().body.style.overflow="unset"}openModal(e,t){e instanceof HTMLElement==!1?Log.warn("[KolModalService] Die DOM-Referenz des Modals ist nicht valide."):(this.modalStack.set(e,{activeElement:t}),this.renderModalIfExists())}closeModal(e){var t;if(e instanceof HTMLElement==!1)Log.warn("[KolModalService] Die DOM-Referenz des Modals ist nicht valide.");else{const o=null===(t=this.modalStack.get(e))||void 0===t?void 0:t.activeElement;this.modalStack.delete(e),this.renderModalIfExists(o)}}}class ToasterService{constructor(e){this.document=e,this.queue=new Set,this.isOpen=!1,this.toastElement=this.document.createElement("kol-toast"),this.toastElement.setAttribute("_level","3"),this.toastElement.setAttribute("_show","false"),this.toastElement.setAttribute("_show-duration","-1"),this.toastElement.setAttribute("_has-closer","true"),this.toastElement._on={onClose:()=>{const e=this.queue.values().next();e.value?(this.queue.delete(e.value),setTimeout((()=>{this.showToast(e.value)}),200)):this.isOpen=!1}},this.document.body.insertBefore(this.toastElement,this.document.body.firstChild)}enqueue(e){this.isOpen?this.queue.add(e):this.showToast(e)}showToast(e){this.toastElement.setAttribute("_heading",e.heading),this.toastElement.setAttribute("_show","true"),this.toastElement.setAttribute("_type",e.type),this.toastElement.innerText=e.description,this.isOpen=!0}}let WINDOW=null,DOCUMENT=null;const configKoliBri=e=>{e instanceof Window?(WINDOW=e,WINDOW.document instanceof Document?DOCUMENT=e.document:console.warn("The given Window has no valid Document.")):console.warn("The given Window is not valid.")},getWindow=()=>WINDOW||"undefined"==typeof window?null:window,getDocument=()=>DOCUMENT||void 0===getWindow().document?null:getWindow().document;let META_CONFIG=null,DEV_MODE=null,EXPERIMENTAL_MODE=null,COLOR_CONTRAST_ANALYSIS=null;const getDevMode=()=>!0===DEV_MODE,getExperimalMode=()=>!0===EXPERIMENTAL_MODE,getColorContrastAnalysis=()=>!0===COLOR_CONTRAST_ANALYSIS;class Log{static mapToArray(e){return Array.isArray(e)?e:[e]}static handleClassifier(e){return"string"==typeof e&&e.length>0?`${Log.shield.label} | ${e}`:Log.shield.label}static getShield(e){return[Log.handleClassifier(null==e?void 0:e.classifier),`${Log.shield.style};${(null==e?void 0:e.overwriteStyle)||""}`]}static debug(e,t){(DEV_MODE||!0===(null==t?void 0:t.forceLog))&&console.log(...Log.getShield(t),...Log.mapToArray(e))}static info(e,t){(DEV_MODE||!0===(null==t?void 0:t.forceLog))&&console.info(...Log.getShield(t),...Log.mapToArray(e))}static trace(e,t){(DEV_MODE||!0===(null==t?void 0:t.forceLog))&&console.trace(...Log.getShield(t),...Log.mapToArray(e))}static warn(e,t){(DEV_MODE||!0===(null==t?void 0:t.forceLog))&&console.warn(...Log.getShield(t),...Log.mapToArray(e))}static error(e,t){(DEV_MODE||!0===(null==t?void 0:t.forceLog))&&console.error(...Log.getShield(t),...Log.mapToArray(e))}static throw(e,t){if(DEV_MODE||!0===(null==t?void 0:t.forceLog))throw new Error(...Log.getShield(t),...Log.mapToArray(e))}}Log.shield={label:"%cKoliBri",style:"color: white; background: #666; font-weight: bold; padding: .25em .5em; border-radius: 3px; border: 1px solid #000"};const initMeta=()=>{if(null===DEV_MODE&&null===EXPERIMENTAL_MODE&&null===COLOR_CONTRAST_ANALYSIS){const e=getDocument().querySelector('meta[name="kolibri"]');e&&e.hasAttribute("content")&&(META_CONFIG=e.getAttribute("content"),"string"==typeof META_CONFIG&&(DEV_MODE=META_CONFIG.includes("dev-mode=true"),EXPERIMENTAL_MODE=META_CONFIG.includes("experimental-mode=true"),COLOR_CONTRAST_ANALYSIS=META_CONFIG.includes("color-contrast-analysis=true")))}else console.warn("You can only initialize DEV_MODE and COLOR_CONTRAST_ANALYSIS once.")};let KoliBri=null;const getKoliBri=()=>KoliBri||{},initKoliBri=()=>{if(null===KoliBri){KoliBri=getWindow().KoliBri||{};const e=new ModalService,t=new ToasterService(getDocument());Object.defineProperty(KoliBri,"Modal",{get:function(){return e}}),Object.defineProperty(KoliBri,"Toaster",{get:function(){return t}}),initMeta()}else console.warn("You can only initialize KoliBri once.")},renderDevAdvice=()=>{void 0===getWindow().KoliBri&&Object.defineProperty(window,"KoliBri",{get:function(){return KoliBri}}),!0!==getKoliBri().adviceShown&&(Object.defineProperty(KoliBri,"adviceShown",{get:function(){return!0}}),Log.debug("\n\nSie verwenden die KoliBri-Komponenten-Bibliothek. Sollten Sie Verbesserungsvorschläge haben oder ein Problem feststellen, dann wenden Sie sich gerne an kolibri@itzbund.de.\n\nHinweise:\n- WAI Web Accessibility Tutorials (https://www.w3.org/WAI/tutorials/)\n- The first rule of ARIA is “Don't use ARIA” (https://cccaccessibility.org/web-1/web-developer-tutorials/how-not-to-use-aria)\n- BIK BITV-Test (https://www.bitvtest.de/bitv_test.html)\n- A11y-Checkliste (https://www.a11yproject.com/checklist/)\n- BSI CON.10: Entwicklung von Webanwendungen (Edition 2021)\n\n"))};let nonce=()=>Math.floor(16777215*Math.random()).toString(16);const pushNodes=(e,t)=>{t.forEach((t=>{!1===e.has(t)&&e.add(t)}))},querySelectorAll=(e,t=document)=>{if(t instanceof Document||t instanceof HTMLElement||t instanceof ShadowRoot){const o=new Set;pushNodes(o,t.querySelectorAll(e));const n=t.querySelectorAll('[class*="hydrated"]');for(let t=0;t<n.length;t++){const r=n[t].shadowRoot;pushNodes(o,querySelectorAll(e,"object"==typeof r&&null!==r?r:n[t]))}return Array.from(o)}throw new Error("The parameter document for the method querySelectorAll is not type of Document, HTMLElement or ShadowRoot.")},querySelector=(e,t=document)=>{if(t instanceof Document||t instanceof HTMLElement||t instanceof ShadowRoot){let o=t.querySelector(e);if(null===o){const n=t.querySelectorAll('[class*="hydrated"]');for(let t=0;t<n.length;t++){const r=n[t].shadowRoot;if(o=querySelector(e,"object"==typeof r&&null!==r?r:n[t]),null!==o)break}}return o}throw new Error("The parameter document for the method querySelector is not type of Document, HTMLElement or ShadowRoot.")};var rgbaConvert=arr,arr_1=arr,obj_1=obj,css_1=css,hex_1=hex,num_1=num;function arr(e){var t=parse(e);return 3==t.length?t.concat(255):(t[3]=Math.round(t[3]),t)}function obj(e){var t=parse(e);return{r:t[0],g:t[1],b:t[2],a:3==t.length?255:Math.round(t[3])}}function css(e){var t=parse(e);return 3==t.length&&t.push(255),255==t[3]?"rgb("+t[0]+", "+t[1]+", "+t[2]+")":0==t[3]?"rgba("+t[0]+", "+t[1]+", "+t[2]+", 0)":"rgba("+t[0]+", "+t[1]+", "+t[2]+", "+String(t[3]/255).substr(1)+")"}function hex(e){3==(t=parse(e)).length&&t.push(255);var t,o=255==t[3],n=num2hex(t[0]),r=num2hex(t[1]),i=num2hex(t[2]),l=isshort(n,r,i,t=num2hex(Math.round(t[3])));return o?l?"#"+n.charAt(0)+r.charAt(0)+i.charAt(0):"#"+n+r+i:l?"#"+n.charAt(0)+r.charAt(0)+i.charAt(0)+t.charAt(0):"#"+n+r+i+t}function num(e){var t=parse(e);return 3==t.length?t.push(255):t[3]=Math.round(t[3]),(t[3]<<24>>>0|t[0]<<16|t[1]<<8|t[2])>>>0}function parse(e){return"string"==typeof e?name(e=e.toLowerCase())||hex3(e)||hex6(e)||rgb(e)||rgba(e)||[0,0,0,255]:object(e)||array(e)||number(e)||[0,0,0,255]}function num2hex(e){var t=e.toString(16);return 1==t.length?"0"+t:t}function isshort(e,t,o,n){var r=["ff","00","11","22","33","44","55","66","77","88","99","aa","bb","cc","dd","ee"];return-1!=r.indexOf(e)&&-1!=r.indexOf(t)&&-1!=r.indexOf(o)&&-1!=r.indexOf(n)}function name(e){return"red"==e?[255,0,0]:"green"==e?[0,255,0]:"blue"==e?[0,0,255]:"black"==e?[0,0,0]:"white"==e?[255,255,255]:"cyan"==e?[0,255,255]:"gray"==e||"grey"==e?[128,128,128]:"magenta"==e||"pink"==e?[255,0,255]:"yellow"==e?[255,255,0]:void 0}function hex2num(e){return 1==e.length?parseInt(e+e,16):parseInt(e,16)}function hex3(e){var t=e.replace(/^#/,""),o=t.length;if(3==o||4==o){var n=hex2num(t[0]),r=hex2num(t[1]),i=hex2num(t[2]),l=3==o?255:hex2num(t[3]);if(isNaN(n)||isNaN(r)||isNaN(i)||isNaN(l))return;return[n,r,i,l]}}function hex6(e){var t=e.replace(/^#/,""),o=t.length;if(6==o||8==o){var n=hex2num(t.slice(0,2)),r=hex2num(t.slice(2,4)),i=hex2num(t.slice(4,6)),l=6==o?255:hex2num(t.slice(6,8));if(isNaN(n)||isNaN(r)||isNaN(i)||isNaN(l))return;return[n,r,i,l]}}function getnum(e,t){return"number"!=typeof e||!0===t&&Math.floor(e)!==e?-1:e>=0&&e<=255?e:-1}function object(e){if("[object Object]"===Object.prototype.toString.call(e)&&Object.getPrototypeOf(e)===Object.getPrototypeOf({})){var t=getnum(null!=e.r?e.r:null!=e.red?e.red:0,!0),o=getnum(null!=e.g?e.g:null!=e.green?e.green:0,!0),n=getnum(null!=e.b?e.b:null!=e.blue?e.blue:0,!0),r=getnum(null!=e.a?e.a:null!=e.alpha?e.alpha:255,!0);if(-1!=t&&-1!=o&&-1!=n&&-1!=r)return[t,o,n,r]}}function array(e){if(Array.isArray(e)&&(3==e.length||4==e.length)){var t=getnum(e[0],!0),o=getnum(e[1],!0),n=getnum(e[2],!0),r=getnum(null!=e[3]?e[3]:255,!0);if(-1!=t&&-1!=o&&-1!=n&&-1!=r)return[t,o,n,r]}}function number(e){if("number"==typeof e&&Math.floor(e)==e&&e<=4294967295&&e>=0)return[e>>16&255,e>>8&255,255&e,e>>24&255]}function rgb(e){if("rgb("==e.substr(0,4)){var t=(e=e.match(/^rgb\(([^)]+)\)/)[1]).split(/ *, */).map(Number),o=getnum(t[0],!0),n=getnum(t[1],!0),r=getnum(t[2],!0);if(-1!=o&&-1!=n&&-1!=r)return[o,n,r,255]}}function rgba(e){if("rgba("==e.substr(0,5)){var t=(e=e.match(/^rgba\(([^)]+)\)/)[1]).split(/ *, */).map(Number),o=getnum(t[0],!0),n=getnum(t[1],!0),r=getnum(t[2],!0),i=getnum(255*t[3]);if(-1!=o&&-1!=n&&-1!=r&&-1!=i)return[o,n,r,i]}}rgbaConvert.arr=arr_1,rgbaConvert.obj=obj_1,rgbaConvert.css=css_1,rgbaConvert.hex=hex_1,rgbaConvert.num=num_1;const a11yCache=new Set,a11yHint=e=>{!1===a11yCache.has(e)&&(a11yCache.add(e),Log.info(e,{classifier:"✋a11y",overwriteStyle:"; background-color: #09f"}))},deprecatedCache=new Set,deprecatedHint=e=>{!1===deprecatedCache.has(e)&&(deprecatedCache.add(e),Log.warn(e,{classifier:"🔥deprecated",forceLog:!0,overwriteStyle:"; background-color: #f00"}))},devCache=new Set,devHint=e=>{!1===devCache.has(e)&&(devCache.add(e),Log.debug(e,{classifier:"💻dev",overwriteStyle:"; background-color: #f09"}))},featureCache=new Set,featureHint=(e,t=!1)=>{!1===featureCache.has(e)&&(featureCache.add(e),e+=!0===t?" ✅":"",Log.debug(e,{classifier:"🌟feature",overwriteStyle:"; background-color: #309"}))};devHint("Wir freuen uns über jedes Feedback, Kommentare, Screenshots oder Demo-Links von einer auf KoliBri-basierenden Anwendung (kolibri@itzbund.de). Vielen Dank!");const uiUxCache=new Set,uiUxHint=e=>{!1===uiUxCache.has(e)&&(uiUxCache.add(e),Log.debug(e,{classifier:"📑ui/ux",overwriteStyle:"; background-color: #060;"}))},a11yHintDisabled=()=>{a11yHint('"Disabled" schränkt die Zugänglichkeit und Sichtbarkeit ein. Wir empfehlen aus Sicht der Barrierefreiheit readonly- statt disabled-Attribut zu verwenden.\n- https://uxdesign.cc/is-it-ok-to-grey-out-disabled-buttons-8afa74a0fae')},a11yHintLabelingLandmarks=e=>{"string"==typeof e&&""!==e||a11yHint("Manche Strukturelemente, wie bspw. der nav-Tag, können mehrfach in einer Webseite verwendet werden. Damit die gleichnamigen Strukturelemente voneinander unterschieden werden können, ist es erforderlich ein Aria-Label zu setzen.\n- https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/Navigation_Role#accessibility_concerns")},uiUxHintMillerscheZahl=(e,t=8)=>{var o;t>7&&(o=`[${e}] Innerhalb von Navigationsstrukturen wird empfohlen nicht mehr als 7 Menüpunkte zu verwenden.\n\nLinks:\n- https://de.ryte.com/wiki/Millersche_Zahl\n- https://de.wikipedia.org/wiki/Millersche_Zahl`,!1===uiUxCache.has(o)&&(uiUxCache.add(o),Log.debug(o,{classifier:"📑ui/ux",overwriteStyle:"; background-color: #060;"})))},OBJECT_OBJECT=/\[object Object\]/,objectObjectHandler=(e,t)=>{"string"==typeof e&&OBJECT_OBJECT.test(e)||t()},emptyStringByArrayHandler=(e,t)=>{"string"==typeof e&&""===e||t()},setEventTargetAndStopPropagation=(e,t)=>{getExperimalMode()&&(Log.debug([e,t]),Log.debug("↑ We propagate the (submit) event to this target.")),Object.defineProperty(e,"target",{value:t,writable:!1})},patchState=e=>{var t,o,n;null===(t=e.nextHooks)||void 0===t||t.forEach(((t,o)=>{var n;const r=t.get("beforePatch");"function"==typeof r&&r(null===(n=e.nextState)||void 0===n?void 0:n.get(o),e.nextState,e,o)})),(null===(o=e.nextState)||void 0===o?void 0:o.size)>0&&(e.state=Object.assign(Object.assign({},e.state),Object.fromEntries(e.nextState)),delete e.nextState,null===(n=e.nextHooks)||void 0===n||n.forEach(((t,o)=>{const n=t.get("afterPatch");"function"==typeof n&&n(e.state[o],e.state,e,o)}))),delete e.nextHooks},setState=(e,t,o,n={})=>{var r,i;if(void 0===e.nextHooks&&(e.nextHooks=new Map),void 0===e.nextState&&(e.nextState=new Map),e.nextState.get(t)!==o){e.nextHooks.get(t)instanceof Map==!1&&e.nextHooks.set(t,new Map),"function"==typeof n.afterPatch&&(null===(r=e.nextHooks.get(t))||void 0===r||r.set("afterPatch",n.afterPatch)),"function"==typeof n.beforePatch&&(null===(i=e.nextHooks.get(t))||void 0===i||i.set("beforePatch",n.beforePatch)),e.nextState.set(t,o),patchState(e)}},logWarn=(e,t,o,n)=>{devHint(`[${e.constructor.name}] Der Property-Wert (${o}) für '${t}' ist nicht valide. Folgende Werte sind erlaubt: ${Array.from(n).join(", ")}`)},watchValidator=(e,t,o,n,r,i={})=>{o(r)?setState(e,t,r,null==i?void 0:i.hooks):void 0===r||null===r&&(void 0===(null==i?void 0:i.required)||!1===(null==i?void 0:i.required))?setState(e,t,null==i?void 0:i.defaultValue,null==i?void 0:i.hooks):(void 0!==(null==i?void 0:i.required)&&!1!==(null==i?void 0:i.required)||n.add(null),logWarn(e,t,r,n))},watchBoolean=(e,t,o,n)=>{watchValidator(e,t,(e=>"boolean"==typeof e),new Set(["Boolean {true, false}"]),o,n)},watchString=(e,t,o,n={})=>{const r="number"==typeof n.minLength?null==n?void 0:n.minLength:0;watchValidator(e,t,(e=>"string"==typeof e&&e.length>=r),new Set([`String (Mindestlänge ${r})`]),o,n)},watchNumber=(e,t,o,n)=>{watchValidator(e,t,(e=>"number"==typeof e&&(void 0===(null==n?void 0:n.min)||"number"==typeof(null==n?void 0:n.min)&&e>=n.min)&&(void 0===(null==n?void 0:n.max)||"number"==typeof(null==n?void 0:n.max)&&e<=n.max)),new Set(["Number"]),o,n)},watchJsonArrayString=(e,t,o,n,r=(e=>e==e),i={})=>{emptyStringByArrayHandler(n,(()=>{objectObjectHandler(n,(()=>{void 0===n&&(n=[]);try{try{n=parseJson(n)}catch(e){}if(Array.isArray(n)){const l=n.find((e=>!o(e)));void 0===l&&r(n)?setState(e,t,n,i.hooks):objectObjectHandler(l,(()=>{throw Log.debug(l),new Error("↑ Das Schema für das Property (_options) ist nicht valide. Der Wert wird nicht geändert.")}))}else objectObjectHandler(n,(()=>{throw Log.debug(n),new Error("↑ Das Schema für das Property (_options) ist nicht valide. Der Wert wird nicht geändert.")}))}catch(e){Log.debug(e)}}))}))},BOOLEAN=/^(true|false)$/,INTEGER=/^-?(0|[1-9]\d*)$/,FLOAT=/^-?(0.|[1-9]\d*.)\d*[1-9]$/,mapString2Unknown=e=>{const t=typeof e,o=`${e}`;if("string"==typeof e)if(BOOLEAN.test(e))e="true"===e;else if(INTEGER.test(e))e=parseInt(e);else if(FLOAT.test(e))e=parseFloat(e);else if(JSON_CHARS.test(e))try{e=parseJson(e)}catch(e){}return t!==typeof e&&devHint(`You have used a stringified property value (${o} to ${JSON.stringify(e)}) which type switched from ${t} to ${typeof e}!`),e},stringifyJson=e=>{try{return JSON.stringify(e).replace(/"/g,"'")}catch(t){throw Log.warn(["stringifyJson",e]),Log.error("↑ Das JSON konnte nicht in einen String umgewandelt werden. Es wird ein stringifizierbares JSON erwartet."),new Error}},JSON_CHARS=/^[{[]/,parseJson=e=>{if("string"==typeof e)try{return JSON.parse(e)}catch(t){if(JSON_CHARS.test(e))try{return JSON.parse(e.replace(/'/g,'"'))}catch(t){Log.warn(["parseJson",e]),Log.error("↑ Der JSON-String konnte nicht geparsed werden. Achten Sie darauf, dass einfache Anführungszeichen im Text maskiert werden (&#8216;).")}}throw new Error},mapBoolean2String=e=>"boolean"==typeof e?!0===e?"true":"false":void 0,mapStringOrBoolean2String=e=>"string"==typeof e?e:mapBoolean2String(e),koliBriQuerySelector=(e,t)=>querySelector(e,t||getDocument()),koliBriQuerySelectorAll=(e,t)=>querySelectorAll(e,t||getDocument());let DEFAULT_COLOR_CONTRAST=null;const getDefaultColorContrast=()=>(DEFAULT_COLOR_CONTRAST=DEFAULT_COLOR_CONTRAST||{backgroundColor:"#00000000",color:"#00000000",domNode:getDocument().body,level:"Fail",score:1},DEFAULT_COLOR_CONTRAST),TRANSPARENT_REGEXP=/(\d+, ){3}0\)/,koliBriA11yColorContrast=(e,t=getDefaultColorContrast())=>{const o=getComputedStyle(e),n=TRANSPARENT_REGEXP.test(o.backgroundColor)?t.backgroundColor:rgbaConvert.hex(o.backgroundColor),r=TRANSPARENT_REGEXP.test(o.color)?t.color:rgbaConvert.hex(o.color),i=s(n,r),l={backgroundColor:n,color:r,domNode:e,level:f(i),score:i};return i<4.5&&Log.error(["Color-Contrast-Error",{backgroundColor:l.backgroundColor,color:l.color,level:l.level,score:l.score},l.domNode]),l},koliBriQuerySelectorColors=(e,t=getDefaultColorContrast())=>{t.domNode instanceof HTMLElement&&(t=koliBriA11yColorContrast(t.domNode,t));const o=t.domNode.querySelector(e);if(null===o){const o=t.domNode.querySelectorAll('[class="hydrated"]');for(let n=0;n<o.length&&(t.domNode=o[n],null===(t=koliBriQuerySelectorColors(e,t)).domNode);n++);return t}return koliBriA11yColorContrast(o,t)},scrollByHTMLElement=(e,t=window)=>{e instanceof HTMLElement?(t.scrollTo({behavior:"smooth",top:e.getBoundingClientRect().top+getWindow().pageYOffset-50}),e.focus()):devHint("Das HTMLElement ist nicht valide, zu dem gescrollt werden soll.")},scrollBySelector=(e,t)=>{if((e instanceof Document||e instanceof HTMLElement||e instanceof ShadowRoot)&&"string"==typeof t){devHint("Bei der Methode querySelectorAll wurden die Parameter document, selector in selector, document getauscht, da der Parameter selector nicht, allerdings der Parameter document optional sein kann.");const o=`${t}`;t=e,e=o}if("string"==typeof e){const o=koliBriQuerySelector(e,t);o instanceof HTMLElement?scrollByHTMLElement(o):devHint(`Es konnte kein HTMLElement mit dem Selector (${e}) gefunden werden, zu dem gescrollt werden soll.`)}else devHint("Der Selector ist nicht valide, zu dem gescrollt werden soll.")};class KoliBriUtils{static queryHtmlElementColors(e,t,o=!1,n=!0){let r=null;if(!0===o||!1===KoliBriUtils.executionLock)if(!1===o&&(KoliBriUtils.cache.clear(),KoliBriUtils.cache.set(t.domNode,t),KoliBriUtils.executionLock=!0,!0===n&&Log.debug("[KoliBriUtils] Color contrast analysis started...")),e===t.domNode)r=t;else{const o=new Set;if(t.domNode.shadowRoot){const e=t.domNode.shadowRoot.children;for(let t=0;t<e.length;t++)o.add(e[t])}const n=t.domNode;if("function"==typeof n.assignedNodes){const e=n.assignedNodes();for(let t=0;t<e.length;t++)e[t]instanceof HTMLElement&&o.add(e[t])}const i=t.domNode.children;for(let e=0;e<i.length;e++)o.add(i[e]);const l=Array.from(o);for(let o=0;o<l.length;o++){let n=KoliBriUtils.cache.get(l[o]);void 0===n&&(n=koliBriA11yColorContrast(l[o],t)),KoliBriUtils.cache.set(l[o],n);const i=KoliBriUtils.queryHtmlElementColors(e,n,!0,!1);if(null!==i){r=i;break}}}else Log.debug("[KoliBriUtils] Call aborted because a color contrast analysis is currently being executed.");return!1===o&&(!0===n&&Log.debug(`[KoliBriUtils] Color contrast analysis finished (${KoliBriUtils.cache.size} DOM elements are analysed).`),KoliBriUtils.executionLock=!1,KoliBriUtils.cache.clear()),r}}KoliBriUtils.executionLock=!1,KoliBriUtils.cache=new Map;class KoliBriDevHelper{}KoliBriDevHelper.patchTheme=patchTheme,KoliBriDevHelper.patchThemeTag=patchThemeTag,KoliBriDevHelper.querySelector=koliBriQuerySelector,KoliBriDevHelper.querySelectorAll=koliBriQuerySelectorAll,KoliBriDevHelper.scrollByHTMLElement=scrollByHTMLElement,KoliBriDevHelper.scrollBySelector=scrollBySelector,KoliBriDevHelper.stringifyJson=stringifyJson;export{mapString2Unknown as A,getKoliBri as B,emptyStringByArrayHandler as C,koliBriQuerySelector as D,initKoliBri as E,getDevMode as F,renderDevAdvice as G,getColorContrastAnalysis as H,KoliBriUtils as I,koliBriA11yColorContrast as J,KoliBriDevHelper as K,Log as L,KoliBri as M,koliBriQuerySelectorAll as N,koliBriQuerySelectorColors as O,stringifyJson as P,STORE as S,ToasterService as T,watchValidator as a,watchNumber as b,configKoliBri as c,devHint as d,a11yHint as e,setEventTargetAndStopPropagation as f,getThemeDetails as g,getExperimalMode as h,getDocument as i,mapBoolean2String as j,watchBoolean as k,a11yHintDisabled as l,mapStringOrBoolean2String as m,nonce as n,setState as o,featureHint as p,objectObjectHandler as q,rgbaConvert as r,setThemeStyle as s,parseJson as t,deprecatedHint as u,a11yHintLabelingLandmarks as v,watchString as w,watchJsonArrayString as x,uiUxHintMillerscheZahl as y,scrollBySelector as z};