@public-ui/components 1.4.0-rc.1 → 1.4.0-rc.11

package/dist/components/component2.js.map

@@ -1 +1 @@
-{"file":"component2.js","mappings":";;;;;;AAAA,MAAM,eAAe,GAAG,ky8OAAky8O;;MC4B7y8O,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}
+{"file":"component2.js","mappings":";;;;;;AAAA,MAAM,eAAe,GAAG,827OAA827O;;MC4Bz37O,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.css?tag=kol-icon&mode=default&encapsulation=shadow","./src/components/icon/component.tsx"],"sourcesContent":["@import '../../assets/codicons/codicon.css';\n@import '../../assets/fontawesome-free/css/all.css';\n@import '../../assets/icofont/icofont.css';\n\n:host > i {\n\tcolor: inherit !important;\n\tfont-size: inherit !important;\n}\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.css',\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

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";import{y as objectObjectHandler,z as parseJson,b as watchValidator,A as isString,B as isStyle,C as deprecatedHint,D as isObject,w as watchString,E as isEmptyOrPrefixOf,h as a11yHint,t as watchBoolean}from"./prop.validators.js";import{d as defineCustomElement$1}from"./component2.js";const 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,o,a,n,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"),n=(null===(o=t.nextState)||void 0===o?void 0:o.get("_iconAlign"))||t.state._iconAlign;null===(a=t.nextState)||void 0===a||a.set("_icon",mapIconProp2State(e,n))}else if(null===(n=t.nextState)||void 0===n?void 0:n.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,o)=>{const a=e.has("_ariaLabel")?e.get("_ariaLabel"):i.state._ariaLabel;if("string"==typeof a){const t=e.has("_label")?e.get("_label"):i.state._label;!1===isEmptyOrPrefixOf(t,a)&&("_ariaLabel"===o?e.set("_label",a):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."))}},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,validateIcon as a,validateLabel as b,defineCustomElement as d,isIcon as i,validateAriaLabel as v,watchIconAlign as w};
+import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";import{y as objectObjectHandler,z as parseJson,a as watchValidator,A as isString,B as isStyle,C as deprecatedHint,D as isObject,w as watchString,h as a11yHint,E as isEmptyOrPrefixOf,t as watchBoolean}from"./prop.validators.js";import{d as defineCustomElement$1}from"./component2.js";const 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,a,n,o,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"),o=(null===(a=t.nextState)||void 0===a?void 0:a.get("_iconAlign"))||t.state._iconAlign;null===(n=t.nextState)||void 0===n||n.set("_icon",mapIconProp2State(e,o))}else if(null===(o=t.nextState)||void 0===o?void 0:o.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)=>{watchValidator(t,"_iconAlign",(t=>"left"===t||"right"===t),new Set(["Alignment {left, right, top, bottom}"]),e,{hooks:{beforePatch:()=>{beforePatchIcon(t)},afterPatch:t=>{deprecatedHint(`Das Property _icon-align bzw. _iconAlign ist veraltet (value: ${t}). Die Ausrichtung der Icon's kann jetzt direkt über das _icon-Property vorgenommen werden. (v1.1.10: https://public-ui.github.io/docs/changelog#1110---11112022)`)}}})},READABLE_CHARS=/[a-zA-Z0-9äöüÄÖÜß]/g,ONLY_NUMBERS=/^\d+$/,countReadableChars=t=>{var e;return"string"==typeof t&&(null===(e=t.match(READABLE_CHARS))||void 0===e?void 0:e.length)||0},hasEnoughReadableChars=(t,e=1)=>countReadableChars(t)>=e,containsOnlyNumbers=t=>ONLY_NUMBERS.test(t),syncAriaLabelBeforePatch=(t,e,i,a)=>{const n=e.has("_ariaLabel")?e.get("_ariaLabel"):i.state._ariaLabel;if("string"==typeof n){const t=e.has("_label")?e.get("_label"):i.state._label;!1===isEmptyOrPrefixOf(t,n)&&("_ariaLabel"===a?e.set("_label",n):e.set("_ariaLabel",t),a11yHint("Das abweichende Aria-Label ist nicht barrierefrei. Ein abweichendes Aria-Label muss aus Gründern der Barrierefreiheit für die Sprachsteuerung mit dem Label-Text beginnen."))}},validateAriaLabel=(t,e)=>{watchString(t,"_ariaLabel",e,{hooks:{afterPatch:t=>{"string"==typeof t&&t.length>0&&!1===hasEnoughReadableChars(t,3)&&!1===containsOnlyNumbers(t)&&a11yHint(`Ein abweichendes Aria-Label (${t}) ist nicht barrierefrei. Ein abweichendes Aria-Label sollte aus mindestens drei lesbaren Zeichen bestehen.`)},beforePatch:syncAriaLabelBeforePatch}})},validateLabel=(t,e)=>{watchString(t,"_label",e,{hooks:{afterPatch:t=>{"string"==typeof t&&!1===hasEnoughReadableChars(t,3)&&!1===containsOnlyNumbers(t)&&a11yHint(`Ein Label (${t}) ist nicht barrierefrei. Ein Label sollte aus mindestens drei lesbaren Zeichen bestehen.`)},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,validateIcon as a,validateLabel as b,containsOnlyNumbers as c,defineCustomElement as d,hasEnoughReadableChars as h,isIcon as i,validateAriaLabel as v,watchIconAlign as w};

package/dist/components/component3.js.map

@@ -1 +1 @@
-{"file":"component3.js","mappings":"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","names":[],"sources":["./src/utils/validators/icon.ts","./src/utils/validators/label.ts","./src/components/span/component.tsx"],"sourcesContent":["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}
+{"file":"component3.js","mappings":"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","names":[],"sources":["./src/utils/validators/icon.ts","./src/utils/validators/label.ts","./src/components/span/component.tsx"],"sourcesContent":["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\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\tafterPatch: (value: unknown) => {\n\t\t\t\tdeprecatedHint(\n\t\t\t\t\t`Das Property _icon-align bzw. _iconAlign ist veraltet (value: ${\n\t\t\t\t\t\tvalue as string\n\t\t\t\t\t}). Die Ausrichtung der Icon's kann jetzt direkt über das _icon-Property vorgenommen werden. (v1.1.10: https://public-ui.github.io/docs/changelog#1110---11112022)`\n\t\t\t\t);\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\nconst READABLE_CHARS = /[a-zA-Z0-9äöüÄÖÜß]/g;\nconst ONLY_NUMBERS = /^\\d+$/;\n\nconst countReadableChars = (str: string): number => (typeof str === 'string' ? str.match(READABLE_CHARS)?.length || 0 : 0);\n\nexport const hasEnoughReadableChars = (str: string, min = 1): boolean => countReadableChars(str) >= min;\n\nexport const containsOnlyNumbers = (str: string): boolean => ONLY_NUMBERS.test(str);\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 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\tafterPatch: (value) => {\n\t\t\t\tif (typeof value === 'string' && value.length > 0 && hasEnoughReadableChars(value, 3) === false && containsOnlyNumbers(value) === false) {\n\t\t\t\t\ta11yHint(\n\t\t\t\t\t\t`Ein abweichendes Aria-Label (${value}) ist nicht barrierefrei. Ein abweichendes Aria-Label sollte aus mindestens drei lesbaren Zeichen bestehen.`\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t},\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\tafterPatch: (value) => {\n\t\t\t\tif (typeof value === 'string' && hasEnoughReadableChars(value, 3) === false && containsOnlyNumbers(value) === false) {\n\t\t\t\t\ta11yHint(`Ein Label (${value}) ist nicht barrierefrei. Ein Label sollte aus mindestens drei lesbaren Zeichen bestehen.`);\n\t\t\t\t}\n\t\t\t},\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\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{/*\n\t\t\t\t\t\t\tEs ist keine gute Idee hier einen Slot einzufügen, da dadurch ermöglicht wird,\n\t\t\t\t\t\t\tdie Unterstützung hinsichtlich der Barrierefreiheit der Komponente zu umgehen.\n\t\t\t\t\t\t*/}\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/component4.js

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{proxyCustomElement,HTMLElement,h}from"@stencil/core/internal/client";import{b as watchValidator}from"./prop.validators.js";const watchHeadingLevel=(e,t)=>{watchValidator(e,"_level",(e=>"number"==typeof e&&1<=e&&e<=6),new Set(["Number {1, 2, 3, 4, 5, 6}"]),t,{defaultValue:1,required:!0})},KolHeadingWc=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this._level=1,this.state={}}validateLevel(e){watchHeadingLevel(this,e)}componentWillLoad(){this.validateLevel(this._level)}render(){switch(this.state._level){case 2:return h("h2",null,h("slot",null));case 3:return h("h3",null,h("slot",null));case 4:return h("h4",null,h("slot",null));case 5:return h("h5",null,h("slot",null));case 6:return h("h6",null,h("slot",null));default:return h("h1",null,h("slot",null))}}static get watchers(){return{_level:["validateLevel"]}}},[4,"kol-heading-wc",{_level:[514],state:[32]}]);function defineCustomElement(){if("undefined"==typeof customElements)return;["kol-heading-wc"].forEach((e=>{if("kol-heading-wc"===e)customElements.get(e)||customElements.define(e,KolHeadingWc)}))}export{KolHeadingWc as K,defineCustomElement as d,watchHeadingLevel as w};
+import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";import{a as watchValidator,w as watchString}from"./prop.validators.js";const watchHeadingLevel=(e,l)=>{watchValidator(e,"_level",(e=>"number"==typeof e&&1<=e&&e<=6),new Set(["Number {1, 2, 3, 4, 5, 6}"]),l,{defaultValue:1,required:!0})},KolHeadingWc=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.renderHeadline=(e,l)=>{switch(l){case 1:return h("h1",{class:"headline"},e,h("slot",null));case 2:return h("h2",{class:"headline"},e,h("slot",null));case 3:return h("h3",{class:"headline"},e,h("slot",null));case 4:return h("h4",{class:"headline"},e,h("slot",null));case 5:return h("h5",{class:"headline"},e,h("slot",null));case 6:return h("h6",{class:"headline"},e,h("slot",null));default:return h("strong",{class:"headline"},e,h("slot",null))}},this._level=1,this._label=void 0,this._overline="",this.state={_label:""}}validateLabel(e){watchString(this,"_label",e)}validateLevel(e){watchHeadingLevel(this,e)}validateOverline(e){watchString(this,"_overline",e)}componentWillLoad(){this.validateLabel(this._label),this.validateLevel(this._level),this.validateOverline(this._overline)}render(){return h(Host,null,this.renderHeadline(this.state._label,this.state._level),this.state._overline&&h("span",{class:"overline"},this.state._overline))}static get watchers(){return{_label:["validateLabel"],_level:["validateLevel"],_overline:["validateOverline"]}}},[4,"kol-heading-wc",{_level:[2],_label:[1],_overline:[1],state:[32]}]);function defineCustomElement(){if("undefined"==typeof customElements)return;["kol-heading-wc"].forEach((e=>{if("kol-heading-wc"===e)customElements.get(e)||customElements.define(e,KolHeadingWc)}))}export{KolHeadingWc as K,defineCustomElement as d,watchHeadingLevel as w};

package/dist/components/component4.js.map

@@ -1 +1 @@
-{"file":"component4.js","mappings":";;;;;;MAGa,iBAAiB,GAAG,CAAC,SAAoC,EAAE,KAAc;EACrF,cAAc,CACb,SAAS,EACT,QAAQ,EACR,CAAC,KAAK;IACL,OAAO,OAAO,KAAK,KAAK,QAAQ,IAAI,CAAC,IAAI,KAAK,IAAI,KAAK,IAAI,CAAC,CAAC;GAC7D,EACD,IAAI,GAAG,CAAC,CAAC,2BAA2B,CAAC,CAAC,EACtC,KAAK,EACL;IACC,YAAY,EAAE,CAAC;IACf,QAAQ,EAAE,IAAI;GACd,CACD,CAAC;AACH;;MCMa,YAAY;;;;kBAIgC,CAAC;iBAKzB,EAAE;;EAM3B,aAAa,CAAC,KAAoB;IACxC,iBAAiB,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;GAC/B;EAKM,iBAAiB;IACvB,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;GAChC;EAEM,MAAM;IACZ,QAAQ,IAAI,CAAC,KAAK,CAAC,MAAM;MACxB,KAAK,CAAC;QACL,QACC,cACC,eAAQ,CACJ,EACJ;MACH,KAAK,CAAC;QACL,QACC,cACC,eAAQ,CACJ,EACJ;MACH,KAAK,CAAC;QACL,QACC,cACC,eAAQ,CACJ,EACJ;MACH,KAAK,CAAC;QACL,QACC,cACC,eAAQ,CACJ,EACJ;MACH,KAAK,CAAC;QACL,QACC,cACC,eAAQ,CACJ,EACJ;MACH;QACC,QACC,cACC,eAAQ,CACJ,EACJ;KACH;GACD;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/heading/validation.ts","./src/components/heading/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { watchValidator } from '../../utils/prop.validators';\n\nexport const watchHeadingLevel = (component: Generic.Element.Component, value?: number): void => {\n\twatchValidator(\n\t\tcomponent,\n\t\t'_level',\n\t\t(value): boolean => {\n\t\t\treturn typeof value === 'number' && 1 <= value && value <= 6;\n\t\t},\n\t\tnew Set(['Number {1, 2, 3, 4, 5, 6}']),\n\t\tvalue,\n\t\t{\n\t\t\tdefaultValue: 1,\n\t\t\trequired: true,\n\t\t}\n\t);\n};\n","import { Component, h, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { HeadingLevel } from '../../types/heading-level';\nimport { watchHeadingLevel } from './validation';\n\n/**\n * API\n */\ntype RequiredProps = unknown;\ntype OptionalProps = {\n\tlevel: HeadingLevel;\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-heading-wc',\n\tshadow: false,\n})\nexport class KolHeadingWc implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\t/**\n\t * Gibt an, welchen H-Level von 1 bis 6 die Überschrift hat.\n\t */\n\t@Prop({ reflect: true }) public _level?: HeadingLevel = 1;\n\n\t/**\n\t * @see: components/abbr/component.tsx (@State)\n\t */\n\t@State() public state: States = {};\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 (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tthis.validateLevel(this._level);\n\t}\n\n\tpublic render(): JSX.Element {\n\t\tswitch (this.state._level) {\n\t\t\tcase 2:\n\t\t\t\treturn (\n\t\t\t\t\t<h2>\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</h2>\n\t\t\t\t);\n\t\t\tcase 3:\n\t\t\t\treturn (\n\t\t\t\t\t<h3>\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</h3>\n\t\t\t\t);\n\t\t\tcase 4:\n\t\t\t\treturn (\n\t\t\t\t\t<h4>\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</h4>\n\t\t\t\t);\n\t\t\tcase 5:\n\t\t\t\treturn (\n\t\t\t\t\t<h5>\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</h5>\n\t\t\t\t);\n\t\t\tcase 6:\n\t\t\t\treturn (\n\t\t\t\t\t<h6>\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</h6>\n\t\t\t\t);\n\t\t\tdefault:\n\t\t\t\treturn (\n\t\t\t\t\t<h1>\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</h1>\n\t\t\t\t);\n\t\t}\n\t}\n}\n"],"version":3}
+{"file":"component4.js","mappings":";;;;;;MAGa,iBAAiB,GAAG,CAAC,SAAoC,EAAE,KAAc;EACrF,cAAc,CACb,SAAS,EACT,QAAQ,EACR,CAAC,KAAK;IACL,OAAO,OAAO,KAAK,KAAK,QAAQ,IAAI,CAAC,IAAI,KAAK,IAAI,KAAK,IAAI,CAAC,CAAC;GAC7D,EACD,IAAI,GAAG,CAAC,CAAC,2BAA2B,CAAC,CAAC,EACtC,KAAK,EACL;IACC,YAAY,EAAE,CAAC;IACf,QAAQ,EAAE,IAAI;GACd,CACD,CAAC;AACH;;MCUa,YAAY;;;;IAwDP,mBAAc,GAAG,CAAC,KAAa,EAAE,KAAoB;MACrE,QAAQ,KAAK;QACZ,KAAK,CAAC;UACL,QACC,UAAI,KAAK,EAAC,UAAU,IAClB,KAAK,EACN,eAAQ,CACJ,EACJ;QACH,KAAK,CAAC;UACL,QACC,UAAI,KAAK,EAAC,UAAU,IAClB,KAAK,EACN,eAAQ,CACJ,EACJ;QACH,KAAK,CAAC;UACL,QACC,UAAI,KAAK,EAAC,UAAU,IAClB,KAAK,EACN,eAAQ,CACJ,EACJ;QACH,KAAK,CAAC;UACL,QACC,UAAI,KAAK,EAAC,UAAU,IAClB,KAAK,EACN,eAAQ,CACJ,EACJ;QACH,KAAK,CAAC;UACL,QACC,UAAI,KAAK,EAAC,UAAU,IAClB,KAAK,EACN,eAAQ,CACJ,EACJ;QACH,KAAK,CAAC;UACL,QACC,UAAI,KAAK,EAAC,UAAU,IAClB,KAAK,EACN,eAAQ,CACJ,EACJ;QACH;UACC,QACC,cAAQ,KAAK,EAAC,UAAU,IACtB,KAAK,EACN,eAAQ,CACA,EACR;OACH;KACD,CAAC;kBAxGqC,CAAC;;qBAUJ,EAAE;iBAKN;MAC/B,MAAM,EAAE,EAAE;KACV;;EAMM,aAAa,CAAC,KAAc;IAClC,WAAW,CAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,CAAC,CAAC;GACnC;EAMM,aAAa,CAAC,KAAoB;IACxC,iBAAiB,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;GAC/B;EAMM,gBAAgB,CAAC,KAAc;IACrC,WAAW,CAAC,IAAI,EAAE,WAAW,EAAE,KAAK,CAAC,CAAC;GACtC;EAKM,iBAAiB;IACvB,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IAChC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IAChC,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;GACtC;EAwDM,MAAM;IACZ,QACC,EAAC,IAAI,QACH,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,EACzD,IAAI,CAAC,KAAK,CAAC,SAAS,IAAI,YAAM,KAAK,EAAC,UAAU,IAAE,IAAI,CAAC,KAAK,CAAC,SAAS,CAAQ,CACvE,EACN;GACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/heading/validation.ts","./src/components/heading/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { watchValidator } from '../../utils/prop.validators';\n\nexport const watchHeadingLevel = (component: Generic.Element.Component, value?: number): void => {\n\twatchValidator(\n\t\tcomponent,\n\t\t'_level',\n\t\t(value): boolean => {\n\t\t\treturn typeof value === 'number' && 1 <= value && value <= 6;\n\t\t},\n\t\tnew Set(['Number {1, 2, 3, 4, 5, 6}']),\n\t\tvalue,\n\t\t{\n\t\t\tdefaultValue: 1,\n\t\t\trequired: true,\n\t\t}\n\t);\n};\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { HeadingLevel } from '../../types/heading-level';\nimport { watchHeadingLevel } from './validation';\nimport { watchString } from '../../utils/prop.validators';\n\n/**\n * API\n */\ntype RequiredProps = {\n\tlabel: string;\n};\ntype OptionalProps = {\n\toverline: string;\n\tlevel: HeadingLevel;\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-heading-wc',\n\tshadow: false,\n})\nexport class KolHeadingWc implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\t/**\n\t * Gibt an, welchen H-Level von 1 bis 6 die Überschrift hat. Oder ob es keine Überschrift ist, sondern nur fett gedruckt.\n\t */\n\t@Prop() public _level?: HeadingLevel = 1;\n\n\t/**\n\t * Gibt den Text der Überschrift an.\n\t */\n\t@Prop() public _label!: string;\n\n\t/**\n\t * Gibt den Text der zusätzlichen Beschriftung an.\n\t */\n\t@Prop() public _overline?: string = '';\n\n\t/**\n\t * @see: components/abbr/component.tsx (@State)\n\t */\n\t@State() public state: States = {\n\t\t_label: '',\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\twatchString(this, '_label', value);\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('_overline')\n\tpublic validateOverline(value?: string): void {\n\t\twatchString(this, '_overline', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tthis.validateLabel(this._label);\n\t\tthis.validateLevel(this._level);\n\t\tthis.validateOverline(this._overline);\n\t}\n\n\tprivate readonly renderHeadline = (label: string, level?: HeadingLevel): JSX.Element => {\n\t\tswitch (level) {\n\t\t\tcase 1:\n\t\t\t\treturn (\n\t\t\t\t\t<h1 class=\"headline\">\n\t\t\t\t\t\t{label}\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</h1>\n\t\t\t\t);\n\t\t\tcase 2:\n\t\t\t\treturn (\n\t\t\t\t\t<h2 class=\"headline\">\n\t\t\t\t\t\t{label}\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</h2>\n\t\t\t\t);\n\t\t\tcase 3:\n\t\t\t\treturn (\n\t\t\t\t\t<h3 class=\"headline\">\n\t\t\t\t\t\t{label}\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</h3>\n\t\t\t\t);\n\t\t\tcase 4:\n\t\t\t\treturn (\n\t\t\t\t\t<h4 class=\"headline\">\n\t\t\t\t\t\t{label}\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</h4>\n\t\t\t\t);\n\t\t\tcase 5:\n\t\t\t\treturn (\n\t\t\t\t\t<h5 class=\"headline\">\n\t\t\t\t\t\t{label}\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</h5>\n\t\t\t\t);\n\t\t\tcase 6:\n\t\t\t\treturn (\n\t\t\t\t\t<h6 class=\"headline\">\n\t\t\t\t\t\t{label}\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</h6>\n\t\t\t\t);\n\t\t\tdefault:\n\t\t\t\treturn (\n\t\t\t\t\t<strong class=\"headline\">\n\t\t\t\t\t\t{label}\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</strong>\n\t\t\t\t);\n\t\t}\n\t};\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t{this.renderHeadline(this.state._label, this.state._level)}\n\t\t\t\t{this.state._overline && <span class=\"overline\">{this.state._overline}</span>}\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"version":3}

package/dist/components/component5.js

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";import{L as Log,t as watchBoolean,w as watchString,x as featureHint,v as setState,b as watchValidator}from"./prop.validators.js";import{w as watchHeadingLevel,d as defineCustomElement$4}from"./component4.js";import{a as translate}from"./i18n.js";import{d as defineCustomElement$1,a as defineCustomElement$5,b as defineCustomElement$6}from"./component.js";import{d as defineCustomElement$3}from"./component2.js";import{d as defineCustomElement$2}from"./component3.js";const defaultStyleCss="*{box-sizing:border-box;font-size:inherit;hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}kol-heading-wc{font-weight:bold}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,input,select,textarea{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{background-color:transparent;border-width:0}",Icon=e=>h("kol-icon",{class:"icon",_ariaLabel:"string"==typeof e.heading&&e.heading.length>0?"":e.ariaLabel,_icon:e.icon}),AlertIcon=e=>{switch(e.type){case"error":return h(Icon,{ariaLabel:translate("kol-error"),icon:"fa-solid fa-circle-xmark",heading:e.heading});case"info":return h(Icon,{ariaLabel:translate("kol-info"),icon:"fa-solid fa-circle-info",heading:e.heading});case"warning":return h(Icon,{ariaLabel:translate("kol-warning"),icon:"fa-solid fa-triangle-exclamation",heading:e.heading});case"success":return h(Icon,{ariaLabel:translate("kol-success"),icon:"fa-solid fa-circle-check",heading:e.heading});default:return h(Icon,{ariaLabel:translate("kol-message"),icon:"fa-regular fa-comment",heading:e.heading})}},KolAlert=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.__attachShadow(),this.close=()=>{var e;void 0!==(null===(e=this._on)||void 0===e?void 0:e.onClose)&&this._on.onClose(new Event("Close"))},this.on={onClick:this.close},this._alert=!1,this._hasCloser=!1,this._heading=void 0,this._level=1,this._on=void 0,this._type="default",this._variant="msg",this.state={_level:1}}render(){if(this.state._alert){try{Log.debug(["Navigator should vibrate ...",navigator.vibrate([100,75,100,75,100])])}catch(e){Log.debug("Navigator does not support vibration.")}setTimeout((()=>{this.validateAlert(!1)}),1e4)}return h(Host,null,h("div",{class:{[this.state._type]:!0,[this.state._variant]:!0},role:this.state._alert?"alert":void 0},"msg"===this.state._variant&&h(AlertIcon,{heading:this.state._heading,type:this.state._type}),h("div",null,("string"==typeof this.state._heading&&this.state._heading.length>0||"card"===this.state._variant)&&h("kol-heading-wc",{class:"heading",_level:this.state._level},"card"===this.state._variant&&h(AlertIcon,{heading:this.state._heading,type:this.state._type}),this.state._heading),h("div",{class:"content"},h("slot",null)),this.state._hasCloser&&h("kol-button-wc",{class:"close",_icon:{left:{icon:"fa-solid fa-circle-xmark"}},_iconOnly:!0,_label:translate("kol-close"),_on:this.on,_tooltipAlign:"left"}))))}validateAlert(e){watchBoolean(this,"_alert",e)}validateHasCloser(e){watchBoolean(this,"_hasCloser",e)}validateHeading(e){watchString(this,"_heading",e)}validateLevel(e){watchHeadingLevel(this,e)}validateOn(e){if("object"==typeof e&&null!==e){featureHint("[KolAlert] Prüfen, wie man auch einen EventCallback einzeln ändern kann.");const t={};"function"!=typeof e.onClose&&!0!==e.onClose||(t.onClose=e.onClose),setState(this,"_on",t)}}validateType(e){watchValidator(this,"_type",(e=>"string"==typeof e&&("default"===e||"error"===e||"info"===e||"success"===e||"warning"===e)),new Set("String {success, info, warning, error}"),e)}validateVariant(e){watchValidator(this,"_variant",(e=>"card"===e||"msg"===e),new Set("AlertVariant {card, msg}"),e)}componentWillLoad(){this.validateAlert(this._alert),this.validateHasCloser(this._hasCloser),this.validateHeading(this._heading),this.validateLevel(this._level),this.validateOn(this._on),this.validateType(this._type),this.validateVariant(this._variant)}static get watchers(){return{_alert:["validateAlert"],_hasCloser:["validateHasCloser"],_heading:["validateHeading"],_level:["validateLevel"],_on:["validateOn"],_type:["validateType"],_variant:["validateVariant"]}}static get style(){return{default:defaultStyleCss}}},[33,"kol-alert",{_alert:[516],_hasCloser:[516,"_has-closer"],_heading:[1],_level:[2],_on:[16],_type:[1],_variant:[1],state:[32]}]);function defineCustomElement(){if("undefined"==typeof customElements)return;["kol-alert","kol-badge","kol-button-wc","kol-heading-wc","kol-icon","kol-span-wc","kol-tooltip"].forEach((e=>{switch(e){case"kol-alert":customElements.get(e)||customElements.define(e,KolAlert);break;case"kol-badge":customElements.get(e)||defineCustomElement$6();break;case"kol-button-wc":customElements.get(e)||defineCustomElement$5();break;case"kol-heading-wc":customElements.get(e)||defineCustomElement$4();break;case"kol-icon":customElements.get(e)||defineCustomElement$3();break;case"kol-span-wc":customElements.get(e)||defineCustomElement$2();break;case"kol-tooltip":customElements.get(e)||defineCustomElement$1()}}))}export{KolAlert as K,defineCustomElement as d};
+import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";import{L as Log,t as watchBoolean,w as watchString,v as setState,a as watchValidator}from"./prop.validators.js";import{w as watchHeadingLevel,d as defineCustomElement$4}from"./component4.js";import{a as translate}from"./i18n.js";import{d as defineCustomElement$1,a as defineCustomElement$5,b as defineCustomElement$6}from"./component.js";import{d as defineCustomElement$3}from"./component2.js";import{d as defineCustomElement$2}from"./component3.js";const defaultStyleCss=":host{--kolibri-border-color:#e0e0e0;--kolibri-border-radius:0.125rem;--kolibri-border-width:1px;--kolibri-color-error:#f44336;--kolibri-color-info:#2196f3;--kolibri-color-success:#4caf50;--kolibri-color-warning:#ff9800;--kolibri-color-primary:#3f51b5;--kolibri-color-secondary:#ff4081;--kolibri-color-normal:#9e9e9e;--kolibri-color-danger:#f44336;--kolibri-color-ghost:#f5f5f5;--kolibri-color-disabled:#bdbdbd;--kolibri-color-text:#222222;--kolibri-color-visited:#9c27b0;--kolibri-font-family:Verdana, Arial, Tahoma, Helvetica, sans-serif;--kolibri-font-size:16px;--kolibri-spacing:0.25rem}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}*{box-sizing:border-box;font-family:var(--kolibri-font-family)}kol-icon{color:inherit}kol-span-wc{display:grid;place-items:center;width:100%}kol-span-wc>span{display:flex;gap:var(--kolibri-spacing);place-items:center}button{min-height:44px;min-width:44px;padding:0;margin:0}a,button,input,select,textarea{cursor:pointer;font-family:inherit}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{background-color:transparent;border-width:0}h1,h2,h3,h4,h5,h6{font-size:1rem;margin:0}:host>div{background-color:white;border-color:var(--kolibri-border-color);border-radius:var(--kolibri-border-radius);border-style:solid;border-width:calc(2 * var(--kolibri-border-width));display:inline-block;overflow:hidden;width:100%}:host>div>div.heading{display:grid;gap:var(--kolibri-spacing);grid-template-columns:2em auto 44px;place-items:stretch start}:host>div>div.heading .heading-icon{display:inline-flex;color:white;padding:0.5em;place-items:center}:host>div.card>div.heading .heading-icon{border-radius:0 0 var(--kolibri-border-radius) 0}:host>div>div.heading>div{align-self:center;display:grid;gap:var(--kolibri-spacing)}:host>div.card>div.content{padding:var(--kolibri-spacing)}:host>div.default{border-color:var(--kolibri-color-normal)}:host>div.default .heading-icon{background-color:var(--kolibri-color-normal)}:host>div.error{border-color:var(--kolibri-color-error)}:host>div.error .heading-icon{background-color:var(--kolibri-color-error)}:host>div.info{border-color:var(--kolibri-color-info)}:host>div.info .heading-icon{background-color:var(--kolibri-color-info)}:host>div.success{border-color:var(--kolibri-color-success)}:host>div.success .heading-icon{background-color:var(--kolibri-color-success)}:host>div.warning{border-color:var(--kolibri-color-warning)}:host>div.warning .heading-icon{background-color:var(--kolibri-color-warning)}.close,.close>button{min-width:44px;min-height:44px}",Icon=e=>h("kol-icon",{class:"heading-icon",_ariaLabel:"string"==typeof e.heading&&e.heading.length>0?"":e.ariaLabel,_icon:e.icon}),AlertIcon=e=>{switch(e.type){case"error":return h(Icon,{ariaLabel:translate("kol-error"),icon:"fa-solid fa-circle-xmark",heading:e.heading});case"info":return h(Icon,{ariaLabel:translate("kol-info"),icon:"fa-solid fa-circle-info",heading:e.heading});case"warning":return h(Icon,{ariaLabel:translate("kol-warning"),icon:"fa-solid fa-triangle-exclamation",heading:e.heading});case"success":return h(Icon,{ariaLabel:translate("kol-success"),icon:"fa-solid fa-circle-check",heading:e.heading});default:return h(Icon,{ariaLabel:translate("kol-message"),icon:"fa-regular fa-comment",heading:e.heading})}},KolAlert=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.__attachShadow(),this.close=()=>{var e;void 0!==(null===(e=this._on)||void 0===e?void 0:e.onClose)&&this._on.onClose(new Event("Close"))},this.on={onClick:this.close},this.validateOnValue=e=>"object"==typeof e&&null!==e&&"function"==typeof e.onClose,this._alert=!1,this._hasCloser=!1,this._heading=void 0,this._level=1,this._on=void 0,this._type="default",this._variant="msg",this.state={_level:1}}render(){var e;if(this.state._alert){try{Log.debug(["Navigator should vibrate ...",navigator.vibrate([100,75,100,75,100])])}catch(e){Log.debug("Navigator does not support vibration.")}setTimeout((()=>{this.validateAlert(!1)}),1e4)}return h(Host,null,h("div",{class:{[this.state._type]:!0,[this.state._variant]:!0},role:this.state._alert?"alert":void 0},h("div",{class:"heading"},h(AlertIcon,{heading:this.state._heading,type:this.state._type}),h("div",null,"string"==typeof this.state._heading&&(null===(e=this.state._heading)||void 0===e?void 0:e.length)>0&&h("kol-heading-wc",{_label:this.state._heading,_level:this.state._level}),"msg"===this._variant&&h("div",{class:"content"},h("slot",null))),this.state._hasCloser&&h("kol-button-wc",{class:"close",_icon:{left:{icon:"fa-solid fa-xmark"}},_iconOnly:!0,_label:translate("kol-close"),_on:this.on,_tooltipAlign:"left"})),"card"===this._variant&&h("div",{class:"content"},h("slot",null))))}validateAlert(e){watchBoolean(this,"_alert",e)}validateHasCloser(e){watchBoolean(this,"_hasCloser",e)}validateHeading(e){watchString(this,"_heading",e)}validateLevel(e){watchHeadingLevel(this,e)}validateOn(e){this.validateOnValue(e)&&setState(this,"_on",{onClose:e.onClose})}validateType(e){watchValidator(this,"_type",(e=>"string"==typeof e&&("default"===e||"error"===e||"info"===e||"success"===e||"warning"===e)),new Set("String {success, info, warning, error}"),e)}validateVariant(e){watchValidator(this,"_variant",(e=>"card"===e||"msg"===e),new Set("AlertVariant {card, msg}"),e)}componentWillLoad(){this.validateAlert(this._alert),this.validateHasCloser(this._hasCloser),this.validateHeading(this._heading),this.validateLevel(this._level),this.validateOn(this._on),this.validateType(this._type),this.validateVariant(this._variant)}static get watchers(){return{_alert:["validateAlert"],_hasCloser:["validateHasCloser"],_heading:["validateHeading"],_level:["validateLevel"],_on:["validateOn"],_type:["validateType"],_variant:["validateVariant"]}}static get style(){return{default:defaultStyleCss}}},[33,"kol-alert",{_alert:[516],_hasCloser:[516,"_has-closer"],_heading:[1],_level:[2],_on:[16],_type:[1],_variant:[1],state:[32]}]);function defineCustomElement(){if("undefined"==typeof customElements)return;["kol-alert","kol-badge","kol-button-wc","kol-heading-wc","kol-icon","kol-span-wc","kol-tooltip"].forEach((e=>{switch(e){case"kol-alert":customElements.get(e)||customElements.define(e,KolAlert);break;case"kol-badge":customElements.get(e)||defineCustomElement$6();break;case"kol-button-wc":customElements.get(e)||defineCustomElement$5();break;case"kol-heading-wc":customElements.get(e)||defineCustomElement$4();break;case"kol-icon":customElements.get(e)||defineCustomElement$3();break;case"kol-span-wc":customElements.get(e)||defineCustomElement$2();break;case"kol-tooltip":customElements.get(e)||defineCustomElement$1()}}))}export{KolAlert as K,defineCustomElement as d};

package/dist/components/component5.js.map

@@ -1 +1 @@
-{"file":"component5.js","mappings":"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","names":[],"sources":["./src/components/style.sass?tag=kol-alert&mode=default&encapsulation=shadow","./src/components/alert/component.tsx"],"sourcesContent":["*\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: bold\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,\ninput,\nselect,\ntextarea\n\tcursor: pointer\n\na,\nbutton\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\tbackground-color: transparent\n\tborder-width: 0\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { AlertType, AlertVariant, KoliBriAlertEventCallbacks } from '../../types/alert';\nimport { HeadingLevel } from '../../types/heading-level';\nimport { featureHint } from '../../utils/a11y.tipps';\nimport { Log } from '../../utils/dev.utils';\nimport { setState, watchBoolean, watchString, watchValidator } from '../../utils/prop.validators';\nimport { watchHeadingLevel } from '../heading/validation';\nimport { translate } from '../../i18n';\n\n/**\n * API\n */\ntype RequiredProps = unknown;\ntype OptionalProps = {\n\talert: boolean;\n\thasCloser: boolean;\n\theading: string;\n\tlevel: HeadingLevel;\n\ton: KoliBriAlertEventCallbacks;\n\ttype: AlertType;\n\tvariant: AlertVariant;\n};\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = RequiredProps;\ntype OptionalStates = OptionalProps;\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\nconst Icon = (props: { ariaLabel: string; icon: string; heading?: string }) => {\n\treturn <kol-icon class=\"icon\" _ariaLabel={typeof props.heading === 'string' && props.heading.length > 0 ? '' : props.ariaLabel} _icon={props.icon} />;\n};\n\nconst AlertIcon = (props: { heading?: string; type?: AlertType }) => {\n\tswitch (props.type) {\n\t\tcase 'error':\n\t\t\treturn <Icon ariaLabel={translate('kol-error')} icon=\"fa-solid fa-circle-xmark\" heading={props.heading} />;\n\t\tcase 'info':\n\t\t\treturn <Icon ariaLabel={translate('kol-info')} icon=\"fa-solid fa-circle-info\" heading={props.heading} />;\n\t\tcase 'warning':\n\t\t\treturn <Icon ariaLabel={translate('kol-warning')} icon=\"fa-solid fa-triangle-exclamation\" heading={props.heading} />;\n\t\tcase 'success':\n\t\t\treturn <Icon ariaLabel={translate('kol-success')} icon=\"fa-solid fa-circle-check\" heading={props.heading} />;\n\t\tdefault:\n\t\t\treturn <Icon ariaLabel={translate('kol-message')} icon=\"fa-regular fa-comment\" heading={props.heading} />;\n\t}\n};\n\n@Component({\n\ttag: 'kol-alert',\n\tstyleUrls: {\n\t\tdefault: '../style.sass',\n\t},\n\tshadow: true,\n})\nexport class KolAlert implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\tprivate readonly close = () => {\n\t\tif (this._on?.onClose !== undefined) {\n\t\t\tthis._on.onClose(new Event('Close'));\n\t\t}\n\t};\n\n\tprivate readonly on = {\n\t\tonClick: this.close,\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tif (this.state._alert) {\n\t\t\t/**\n\t\t\t * - https://developer.mozilla.org/de/docs/Web/API/Navigator/vibrate\n\t\t\t * - https://googlechrome.github.io/samples/vibration/\n\t\t\t */\n\t\t\ttry {\n\t\t\t\tLog.debug(['Navigator should vibrate ...', navigator.vibrate([100, 75, 100, 75, 100])]);\n\t\t\t} catch (e) {\n\t\t\t\tLog.debug('Navigator does not support vibration.');\n\t\t\t}\n\n\t\t\tsetTimeout(() => {\n\t\t\t\tthis.validateAlert(false);\n\t\t\t}, 10000);\n\t\t}\n\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<div\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t[this.state._type as string]: true,\n\t\t\t\t\t\t[this.state._variant as string]: true,\n\t\t\t\t\t}}\n\t\t\t\t\trole={this.state._alert ? 'alert' : undefined}\n\t\t\t\t>\n\t\t\t\t\t{this.state._variant === 'msg' && <AlertIcon heading={this.state._heading} type={this.state._type} />}\n\t\t\t\t\t<div>\n\t\t\t\t\t\t{((typeof this.state._heading === 'string' && this.state._heading.length > 0) || this.state._variant === 'card') && (\n\t\t\t\t\t\t\t<kol-heading-wc class=\"heading\" _level={this.state._level}>\n\t\t\t\t\t\t\t\t{this.state._variant === 'card' && <AlertIcon heading={this.state._heading} type={this.state._type} />}\n\t\t\t\t\t\t\t\t{this.state._heading}\n\t\t\t\t\t\t\t</kol-heading-wc>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<div class=\"content\">\n\t\t\t\t\t\t\t<slot />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t{this.state._hasCloser && (\n\t\t\t\t\t\t\t<kol-button-wc\n\t\t\t\t\t\t\t\tclass=\"close\"\n\t\t\t\t\t\t\t\t_icon={{\n\t\t\t\t\t\t\t\t\tleft: {\n\t\t\t\t\t\t\t\t\t\ticon: 'fa-solid fa-circle-xmark',\n\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t_iconOnly\n\t\t\t\t\t\t\t\t_label={translate('kol-close')}\n\t\t\t\t\t\t\t\t_on={this.on}\n\t\t\t\t\t\t\t\t_tooltipAlign=\"left\"\n\t\t\t\t\t\t\t></kol-button-wc>\n\t\t\t\t\t\t)}\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 an, ob der Screenreader die Meldung vorlesen soll.\n\t */\n\t@Prop({ reflect: true }) public _alert?: boolean = false;\n\n\t/**\n\t * Gibt an, ob der Alert ein Schließen-Icon hat.\n\t */\n\t@Prop({ reflect: true }) public _hasCloser?: boolean = false;\n\n\t/**\n\t * Gibt den Titel der Meldung an.\n\t */\n\t@Prop() public _heading?: string;\n\n\t/**\n\t * Gibt an, welchen H-Level von 1 bis 6 die Überschrift hat.\n\t */\n\t@Prop() public _level?: HeadingLevel = 1;\n\n\t/**\n\t * Gibt die EventCallback-Function für das Schließen des Alerts an.\n\t */\n\t@Prop() public _on?: KoliBriAlertEventCallbacks;\n\n\t/**\n\t * Gibt an, ob es sich um eine Erfolgs-, Info-, Warnung- oder Fehlermeldung handelt.\n\t */\n\t@Prop() public _type?: AlertType = 'default';\n\n\t/**\n\t * Gibt an, welche Benachrichtigungsvariante dargestellt wird.\n\t */\n\t@Prop() public _variant?: AlertVariant = 'msg';\n\n\t/**\n\t * @see: components/abbr/component.tsx (@State)\n\t */\n\t@State() public state: States = {\n\t\t_level: 1,\n\t};\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\twatchBoolean(this, '_alert', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hasCloser')\n\tpublic validateHasCloser(value?: boolean): void {\n\t\twatchBoolean(this, '_hasCloser', value);\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}\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?: KoliBriAlertEventCallbacks): void {\n\t\tif (typeof value === 'object' && value !== null) {\n\t\t\tfeatureHint('[KolAlert] Prüfen, wie man auch einen EventCallback einzeln ändern kann.');\n\t\t\tconst callbacks: KoliBriAlertEventCallbacks = {};\n\t\t\tif (typeof value.onClose === 'function' || value.onClose === true) {\n\t\t\t\tcallbacks.onClose = value.onClose;\n\t\t\t}\n\t\t\tsetState<KoliBriAlertEventCallbacks>(this, '_on', callbacks);\n\t\t}\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_type')\n\tpublic validateType(value?: AlertType): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_type',\n\t\t\t(value) => typeof value === 'string' && (value === 'default' || value === 'error' || value === 'info' || value === 'success' || value === 'warning'),\n\t\t\tnew Set('String {success, info, warning, error}'),\n\t\t\tvalue\n\t\t);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_variant')\n\tpublic validateVariant(value?: AlertVariant): void {\n\t\twatchValidator(this, '_variant', (value) => value === 'card' || value === 'msg', new Set('AlertVariant {card, msg}'), value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAlert(this._alert);\n\t\tthis.validateHasCloser(this._hasCloser);\n\t\tthis.validateHeading(this._heading);\n\t\tthis.validateLevel(this._level);\n\t\tthis.validateOn(this._on);\n\t\tthis.validateType(this._type);\n\t\tthis.validateVariant(this._variant);\n\t}\n}\n"],"version":3}
+{"file":"component5.js","mappings":"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","names":[],"sources":["./src/components/alert/style.css?tag=kol-alert&mode=default&encapsulation=shadow","./src/components/alert/component.tsx"],"sourcesContent":["@import '../style.css';\n\n:host > div {\n\tbackground-color: white;\n\tborder-color: var(--kolibri-border-color);\n\tborder-radius: var(--kolibri-border-radius);\n\tborder-style: solid;\n\tborder-width: calc(2 * var(--kolibri-border-width));\n\tdisplay: inline-block;\n\toverflow: hidden;\n\twidth: 100%;\n}\n\n:host > div > div.heading {\n\tdisplay: grid;\n\tgap: var(--kolibri-spacing);\n\tgrid-template-columns: 2em auto 44px;\n\tplace-items: stretch start;\n}\n:host > div > div.heading .heading-icon {\n\tdisplay: inline-flex;\n\tcolor: white;\n\tpadding: 0.5em;\n\tplace-items: center;\n}\n:host > div.card > div.heading .heading-icon {\n\tborder-radius: 0 0 var(--kolibri-border-radius) 0;\n}\n:host > div > div.heading > div {\n\talign-self: center;\n\tdisplay: grid;\n\tgap: var(--kolibri-spacing);\n}\n:host > div.card > div.content {\n\tpadding: var(--kolibri-spacing);\n}\n:host > div.default {\n\tborder-color: var(--kolibri-color-normal);\n}\n:host > div.default .heading-icon {\n\tbackground-color: var(--kolibri-color-normal);\n}\n:host > div.error {\n\tborder-color: var(--kolibri-color-error);\n}\n:host > div.error .heading-icon {\n\tbackground-color: var(--kolibri-color-error);\n}\n:host > div.info {\n\tborder-color: var(--kolibri-color-info);\n}\n:host > div.info .heading-icon {\n\tbackground-color: var(--kolibri-color-info);\n}\n:host > div.success {\n\tborder-color: var(--kolibri-color-success);\n}\n:host > div.success .heading-icon {\n\tbackground-color: var(--kolibri-color-success);\n}\n:host > div.warning {\n\tborder-color: var(--kolibri-color-warning);\n}\n:host > div.warning .heading-icon {\n\tbackground-color: var(--kolibri-color-warning);\n}\n\n/* close button */\n\n.close,\n.close > button {\n\tmin-width: 44px;\n\tmin-height: 44px;\n}\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { AlertType, AlertVariant, KoliBriAlertEventCallbacks } from '../../types/alert';\nimport { HeadingLevel } from '../../types/heading-level';\nimport { Log } from '../../utils/log';\nimport { setState, watchBoolean, watchString, watchValidator } from '../../utils/prop.validators';\nimport { watchHeadingLevel } from '../heading/validation';\nimport { translate } from '../../i18n';\n\n/**\n * API\n */\ntype RequiredProps = unknown;\ntype OptionalProps = {\n\talert: boolean;\n\thasCloser: boolean;\n\theading: string;\n\tlevel: HeadingLevel;\n\ton: KoliBriAlertEventCallbacks;\n\ttype: AlertType;\n\tvariant: AlertVariant;\n};\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = RequiredProps;\ntype OptionalStates = OptionalProps;\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\nconst Icon = (props: { ariaLabel: string; icon: string; heading?: string }) => {\n\treturn <kol-icon class=\"heading-icon\" _ariaLabel={typeof props.heading === 'string' && props.heading.length > 0 ? '' : props.ariaLabel} _icon={props.icon} />;\n};\n\nconst AlertIcon = (props: { heading?: string; type?: AlertType }) => {\n\tswitch (props.type) {\n\t\tcase 'error':\n\t\t\treturn <Icon ariaLabel={translate('kol-error')} icon=\"fa-solid fa-circle-xmark\" heading={props.heading} />;\n\t\tcase 'info':\n\t\t\treturn <Icon ariaLabel={translate('kol-info')} icon=\"fa-solid fa-circle-info\" heading={props.heading} />;\n\t\tcase 'warning':\n\t\t\treturn <Icon ariaLabel={translate('kol-warning')} icon=\"fa-solid fa-triangle-exclamation\" heading={props.heading} />;\n\t\tcase 'success':\n\t\t\treturn <Icon ariaLabel={translate('kol-success')} icon=\"fa-solid fa-circle-check\" heading={props.heading} />;\n\t\tdefault:\n\t\t\treturn <Icon ariaLabel={translate('kol-message')} icon=\"fa-regular fa-comment\" heading={props.heading} />;\n\t}\n};\n\n@Component({\n\ttag: 'kol-alert',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolAlert implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\tprivate readonly close = () => {\n\t\tif (this._on?.onClose !== undefined) {\n\t\t\tthis._on.onClose(new Event('Close'));\n\t\t}\n\t};\n\n\tprivate readonly on = {\n\t\tonClick: this.close,\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tif (this.state._alert) {\n\t\t\t/**\n\t\t\t * - https://developer.mozilla.org/de/docs/Web/API/Navigator/vibrate\n\t\t\t * - https://googlechrome.github.io/samples/vibration/\n\t\t\t */\n\t\t\ttry {\n\t\t\t\tLog.debug(['Navigator should vibrate ...', navigator.vibrate([100, 75, 100, 75, 100])]);\n\t\t\t} catch (e) {\n\t\t\t\tLog.debug('Navigator does not support vibration.');\n\t\t\t}\n\n\t\t\tsetTimeout(() => {\n\t\t\t\tthis.validateAlert(false);\n\t\t\t}, 10000);\n\t\t}\n\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<div\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t[this.state._type as string]: true,\n\t\t\t\t\t\t[this.state._variant as string]: true,\n\t\t\t\t\t}}\n\t\t\t\t\trole={this.state._alert ? 'alert' : undefined}\n\t\t\t\t>\n\t\t\t\t\t<div class=\"heading\">\n\t\t\t\t\t\t<AlertIcon heading={this.state._heading} type={this.state._type} />\n\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t{typeof this.state._heading === 'string' && this.state._heading?.length > 0 && (\n\t\t\t\t\t\t\t\t<kol-heading-wc _label={this.state._heading} _level={this.state._level}></kol-heading-wc>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{this._variant === 'msg' && (\n\t\t\t\t\t\t\t\t<div class=\"content\">\n\t\t\t\t\t\t\t\t\t<slot />\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t{this.state._hasCloser && (\n\t\t\t\t\t\t\t<kol-button-wc\n\t\t\t\t\t\t\t\tclass=\"close\"\n\t\t\t\t\t\t\t\t_icon={{\n\t\t\t\t\t\t\t\t\tleft: {\n\t\t\t\t\t\t\t\t\t\ticon: 'fa-solid fa-xmark',\n\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t_iconOnly\n\t\t\t\t\t\t\t\t_label={translate('kol-close')}\n\t\t\t\t\t\t\t\t_on={this.on}\n\t\t\t\t\t\t\t\t_tooltipAlign=\"left\"\n\t\t\t\t\t\t\t></kol-button-wc>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t\t{this._variant === 'card' && (\n\t\t\t\t\t\t<div class=\"content\">\n\t\t\t\t\t\t\t<slot />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Gibt an, ob der Screenreader die Meldung vorlesen soll.\n\t */\n\t@Prop({ reflect: true }) public _alert?: boolean = false;\n\n\t/**\n\t * Gibt an, ob der Alert ein Schließen-Icon hat.\n\t */\n\t@Prop({ reflect: true }) public _hasCloser?: boolean = false;\n\n\t/**\n\t * Gibt den Titel der Meldung an.\n\t */\n\t@Prop() public _heading?: string;\n\n\t/**\n\t * Gibt an, welchen H-Level von 1 bis 6 die Überschrift hat.\n\t */\n\t@Prop() public _level?: HeadingLevel = 1;\n\n\t/**\n\t * Gibt die EventCallback-Function für das Schließen des Alerts an.\n\t */\n\t@Prop() public _on?: KoliBriAlertEventCallbacks;\n\n\t/**\n\t * Gibt an, ob es sich um eine Erfolgs-, Info-, Warnung- oder Fehlermeldung handelt.\n\t */\n\t@Prop() public _type?: AlertType = 'default';\n\n\t/**\n\t * Gibt an, welche Benachrichtigungsvariante dargestellt wird.\n\t */\n\t@Prop() public _variant?: AlertVariant = 'msg';\n\n\t/**\n\t * @see: components/abbr/component.tsx (@State)\n\t */\n\t@State() public state: States = {\n\t\t_level: 1,\n\t};\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\twatchBoolean(this, '_alert', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_hasCloser')\n\tpublic validateHasCloser(value?: boolean): void {\n\t\twatchBoolean(this, '_hasCloser', value);\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}\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\tprivate validateOnValue = (value: unknown): boolean =>\n\t\ttypeof value === 'object' && value !== null && typeof (value as KoliBriAlertEventCallbacks).onClose === 'function';\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_on')\n\tpublic validateOn(value?: KoliBriAlertEventCallbacks): void {\n\t\tif (this.validateOnValue(value)) {\n\t\t\tsetState<KoliBriAlertEventCallbacks>(\n\t\t\t\tthis,\n\t\t\t\t'_on',\n\t\t\t\t{\n\t\t\t\t\tonClose: (value as KoliBriAlertEventCallbacks).onClose,\n\t\t\t\t}\n\t\t\t\t// {\n\t\t\t\t// \tafterPatch: (value: unknown) => {\n\t\t\t\t// \t\tthis._hasCloser = this.validateOnValue(value);\n\t\t\t\t// \t},\n\t\t\t\t// }\n\t\t\t);\n\t\t\t// } else {\n\t\t\t// \tsetState<KoliBriAlertEventCallbacks>(this, '_on', null, {\n\t\t\t// \t\tafterPatch: (value: unknown) => {\n\t\t\t// \t\t\tthis._hasCloser = this.validateOnValue(value);\n\t\t\t// \t\t},\n\t\t\t// \t});\n\t\t}\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_type')\n\tpublic validateType(value?: AlertType): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_type',\n\t\t\t(value) => typeof value === 'string' && (value === 'default' || value === 'error' || value === 'info' || value === 'success' || value === 'warning'),\n\t\t\tnew Set('String {success, info, warning, error}'),\n\t\t\tvalue\n\t\t);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_variant')\n\tpublic validateVariant(value?: AlertVariant): void {\n\t\twatchValidator(this, '_variant', (value) => value === 'card' || value === 'msg', new Set('AlertVariant {card, msg}'), value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAlert(this._alert);\n\t\tthis.validateHasCloser(this._hasCloser);\n\t\tthis.validateHeading(this._heading);\n\t\tthis.validateLevel(this._level);\n\t\tthis.validateOn(this._on);\n\t\tthis.validateType(this._type);\n\t\tthis.validateVariant(this._variant);\n\t}\n}\n"],"version":3}

package/dist/components/component6.js

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";import{a as translate}from"./i18n.js";import{v as validateTabIndex,w as watchTooltipAlignment,d as defineCustomElement$1,a as defineCustomElement$4,b as defineCustomElement$5}from"./component.js";import{n as nonce,m as propergateFocus,i as setEventTargetAndStopPropagation,d as devHint,q as mapBoolean2String,w as watchString,b as watchValidator,t as watchBoolean,u as a11yHintDisabled,I as scrollBySelector}from"./prop.validators.js";import{v as validateAriaLabel,a as validateIcon,w as watchIconAlign,b as validateLabel,d as defineCustomElement$2}from"./component3.js";import{d as defineCustomElement$3}from"./component2.js";const KolLinkWc=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.nonce=nonce(),this.catchRef=t=>{this.ref=t,propergateFocus(this.host,this.ref)},this.onClick=t=>{var e,a;"function"==typeof(null===(e=this.state._on)||void 0===e?void 0:e.onClick)&&(t.preventDefault(),setEventTargetAndStopPropagation(t,this.ref),null===(a=this.state._on)||void 0===a||a.onClick(t,this.state._href))},this.getRenderValues=()=>{let t={};"string"==typeof this.state._selector&&(t={role:"link",tabIndex:0,onClick:()=>{scrollBySelector(this.state._selector)},onKeyPress:()=>{scrollBySelector(this.state._selector)}});const e="string"==typeof this.state._target&&"_self"!==this.state._target,a={href:"string"==typeof this.state._href&&this.state._href.length>0?this.state._href:"javascript:void(0)",target:"string"==typeof this.state._target&&this.state._target.length>0?this.state._target:void 0,rel:e?"noopener":void 0};return"image"!==this.state._useCase&&!0!==this.state._iconOnly||"string"==typeof this.state._ariaLabel&&0!==this.state._ariaLabel.length||devHint("[KolLink] Es muss ein Aria-Label gesetzt werden, wenn eine Grafik verlinkt oder der Icon-Only-Modus verwendet wird."),{isExternal:e,tagAttrs:a,goToProps:t}},this._ariaControls=void 0,this._ariaCurrent=void 0,this._ariaExpanded=void 0,this._ariaLabel="",this._ariaSelected=void 0,this._disabled=!1,this._href=void 0,this._icon=void 0,this._iconAlign="left",this._iconOnly=!1,this._label=void 0,this._on=void 0,this._role=void 0,this._selector=void 0,this._stealth=!1,this._tabIndex=void 0,this._target=void 0,this._targetDescription=translate("kol-open-link-in-tab"),this._tooltipAlign="right",this._useCase="text",this.state={_ariaLabel:"",_href:"javascript:void(0)",_icon:{},_iconAlign:"left",_label:""}}render(){const{isExternal:t,tagAttrs:e,goToProps:a}=this.getRenderValues();return h(Host,null,h("a",Object.assign({ref:this.catchRef},e,{"aria-controls":this.state._ariaControls,"aria-current":this.state._ariaCurrent,"aria-expanded":mapBoolean2String(this.state._ariaExpanded),"aria-labelledby":"image"===this.state._useCase||!0===this.state._iconOnly?this.nonce:void 0,"aria-selected":mapBoolean2String(this.state._ariaSelected),class:{disabled:!0===this.state._disabled,"skip ":!1!==this.state._stealth,"icon-only":!0===this.state._iconOnly,"external-link":t}},this.state._on,{onClick:this.onClick,onKeyPress:this.onClick},a,{role:this.state._role,tabIndex:this.state._tabIndex}),h("kol-span-wc",{_icon:this._icon,_iconOnly:this._iconOnly,_label:this.state._ariaLabel||this.state._label},h("slot",{name:"expert",slot:"expert"})),t&&h("kol-icon",{class:"external-link-icon",_ariaLabel:this.state._targetDescription,_icon:"fa-solid fa-arrow-up-right-from-square"})),(!0===this.state._iconOnly||"image"===this.state._useCase)&&h("kol-tooltip",{"aria-hidden":"true",_align:this.state._tooltipAlign,_id:this.nonce,_label:this.state._ariaLabel||this.state._label}))}validateAriaControls(t){watchString(this,"_ariaControls",t)}validateAriaCurrent(t){watchValidator(this,"_ariaCurrent",(t=>!0===t||"date"===t||"location"===t||"page"===t||"step"===t||"time"===t),new Set(["boolean","String {data, location, page, step, time}"]),t)}validateAriaExpanded(t){watchBoolean(this,"_ariaExpanded",t)}validateAriaLabel(t){validateAriaLabel(this,t)}validateAriaSelected(t){watchBoolean(this,"_ariaSelected",t)}validateDisabled(t){watchBoolean(this,"_disabled",t),!0===t&&a11yHintDisabled()}validateHref(t){watchString(this,"_href",t)}validateIcon(t){validateIcon(this,t)}validateIconAlign(t){watchIconAlign(this,t)}validateIconOnly(t){watchBoolean(this,"_iconOnly",t)}validateLabel(t){validateLabel(this,t)}validateOn(t){"object"==typeof t&&null!==t&&Object.prototype.hasOwnProperty.call(t,"onClick")&&"function"==typeof t.onClick&&(this.state=Object.assign(Object.assign({},this.state),{_on:t}))}validateRole(t){watchString(this,"_role",t)}validateSelector(t){watchString(this,"_selector",t)}validateStealth(t){watchBoolean(this,"_stealth",t)}validateTabIndex(t){validateTabIndex(this,t)}validateTarget(t){watchString(this,"_target",t)}validateTargetDescription(t){watchString(this,"_targetDescription",t)}validateTooltipAlign(t){watchTooltipAlignment(this,"_tooltipAlign",t)}validateUseCase(t){"string"==typeof t&&(this.state=Object.assign(Object.assign({},this.state),{_useCase:t}))}componentWillLoad(){this.validateAriaControls(this._ariaControls),this.validateAriaCurrent(this._ariaCurrent),this.validateAriaExpanded(this._ariaExpanded),this.validateAriaLabel(this._ariaLabel),this.validateAriaSelected(this._ariaSelected),this.validateDisabled(this._disabled),this.validateHref(this._href),this.validateIcon(this._icon),this.validateIconAlign(this._iconAlign),this.validateIconOnly(this._iconOnly),this.validateLabel(this._label),this.validateOn(this._on),this.validateRole(this._role),this.validateSelector(this._selector),this.validateStealth(this._stealth),this.validateTabIndex(this._tabIndex),this.validateTarget(this._target),this.validateTargetDescription(this._targetDescription),this.validateTooltipAlign(this._tooltipAlign),this.validateUseCase(this._useCase)}get host(){return this}static get watchers(){return{_ariaControls:["validateAriaControls"],_ariaCurrent:["validateAriaCurrent"],_ariaExpanded:["validateAriaExpanded"],_ariaLabel:["validateAriaLabel"],_ariaSelected:["validateAriaSelected"],_disabled:["validateDisabled"],_href:["validateHref"],_icon:["validateIcon"],_iconAlign:["validateIconAlign"],_iconOnly:["validateIconOnly"],_label:["validateLabel"],_on:["validateOn"],_role:["validateRole"],_selector:["validateSelector"],_stealth:["validateStealth"],_tabIndex:["validateTabIndex"],_target:["validateTarget"],_targetDescription:["validateTargetDescription"],_tooltipAlign:["validateTooltipAlign"],_useCase:["validateUseCase"]}}},[4,"kol-link-wc",{_ariaControls:[1,"_aria-controls"],_ariaCurrent:[8,"_aria-current"],_ariaExpanded:[516,"_aria-expanded"],_ariaLabel:[1,"_aria-label"],_ariaSelected:[516,"_aria-selected"],_disabled:[516],_href:[1],_icon:[1],_iconAlign:[1,"_icon-align"],_iconOnly:[516,"_icon-only"],_label:[1025],_on:[16],_role:[1],_selector:[1],_stealth:[516],_tabIndex:[2,"_tab-index"],_target:[1],_targetDescription:[1,"_target-description"],_tooltipAlign:[1,"_tooltip-align"],_useCase:[1,"_use-case"],state:[32]}]);function defineCustomElement(){if("undefined"==typeof customElements)return;["kol-link-wc","kol-badge","kol-button-wc","kol-icon","kol-span-wc","kol-tooltip"].forEach((t=>{switch(t){case"kol-link-wc":customElements.get(t)||customElements.define(t,KolLinkWc);break;case"kol-badge":customElements.get(t)||defineCustomElement$5();break;case"kol-button-wc":customElements.get(t)||defineCustomElement$4();break;case"kol-icon":customElements.get(t)||defineCustomElement$3();break;case"kol-span-wc":customElements.get(t)||defineCustomElement$2();break;case"kol-tooltip":customElements.get(t)||defineCustomElement$1()}}))}export{KolLinkWc as K,defineCustomElement as d};
+import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";import{a as translate}from"./i18n.js";import{v as validateTabIndex,w as watchTooltipAlignment,d as defineCustomElement$1,a as defineCustomElement$4,b as defineCustomElement$5}from"./component.js";import{n as nonce,m as propergateFocus,i as setEventTargetAndStopPropagation,d as devHint,q as mapBoolean2String,w as watchString,a as watchValidator,t as watchBoolean,u as a11yHintDisabled,I as scrollBySelector}from"./prop.validators.js";import{v as validateAriaLabel,a as validateIcon,w as watchIconAlign,b as validateLabel,d as defineCustomElement$2}from"./component3.js";import{d as defineCustomElement$3}from"./component2.js";const KolLinkWc=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.nonce=nonce(),this.catchRef=t=>{this.ref=t,propergateFocus(this.host,this.ref)},this.onClick=t=>{var e,a;"function"==typeof(null===(e=this.state._on)||void 0===e?void 0:e.onClick)&&(t.preventDefault(),setEventTargetAndStopPropagation(t,this.ref),null===(a=this.state._on)||void 0===a||a.onClick(t,this.state._href))},this.getRenderValues=()=>{let t={};"string"==typeof this.state._selector&&(t={role:"link",tabIndex:0,onClick:()=>{scrollBySelector(this.state._selector)},onKeyPress:()=>{scrollBySelector(this.state._selector)}});const e="string"==typeof this.state._target&&"_self"!==this.state._target,a={href:"string"==typeof this.state._href&&this.state._href.length>0?this.state._href:"javascript:void(0)",target:"string"==typeof this.state._target&&this.state._target.length>0?this.state._target:void 0,rel:e?"noopener":void 0};return"image"!==this.state._useCase&&!0!==this.state._iconOnly||"string"==typeof this.state._ariaLabel&&0!==this.state._ariaLabel.length||devHint("[KolLink] Es muss ein Aria-Label gesetzt werden, wenn eine Grafik verlinkt oder der Icon-Only-Modus verwendet wird."),{isExternal:e,tagAttrs:a,goToProps:t}},this._ariaControls=void 0,this._ariaCurrent=void 0,this._ariaExpanded=void 0,this._ariaLabel="",this._ariaSelected=void 0,this._disabled=!1,this._href=void 0,this._icon=void 0,this._iconAlign="left",this._iconOnly=!1,this._label=void 0,this._on=void 0,this._role=void 0,this._selector=void 0,this._stealth=!1,this._tabIndex=void 0,this._target=void 0,this._targetDescription=translate("kol-open-link-in-tab"),this._tooltipAlign="right",this._useCase="text",this.state={_ariaLabel:"",_href:"javascript:void(0)",_icon:{},_iconAlign:"left",_label:""}}render(){const{isExternal:t,tagAttrs:e,goToProps:a}=this.getRenderValues();return h(Host,null,h("a",Object.assign({ref:this.catchRef},e,{"aria-controls":this.state._ariaControls,"aria-current":this.state._ariaCurrent,"aria-expanded":mapBoolean2String(this.state._ariaExpanded),"aria-labelledby":"image"===this.state._useCase||!0===this.state._iconOnly?this.nonce:void 0,"aria-selected":mapBoolean2String(this.state._ariaSelected),class:{disabled:!0===this.state._disabled,"skip ":!1!==this.state._stealth,"icon-only":!0===this.state._iconOnly,"external-link":t}},this.state._on,{onClick:this.onClick,onKeyPress:this.onClick},a,{role:this.state._role,tabIndex:this.state._tabIndex}),h("kol-span-wc",{_icon:this._icon,_iconOnly:this._iconOnly,_label:this.state._label},h("slot",{name:"expert",slot:"expert"})),t&&h("kol-icon",{class:"external-link-icon",_ariaLabel:this.state._targetDescription,_icon:"fa-solid fa-arrow-up-right-from-square"})),(!0===this.state._iconOnly||"image"===this.state._useCase)&&h("kol-tooltip",{"aria-hidden":"true",_align:this.state._tooltipAlign,_id:this.nonce,_label:this.state._ariaLabel||this.state._label}))}validateAriaControls(t){watchString(this,"_ariaControls",t)}validateAriaCurrent(t){watchValidator(this,"_ariaCurrent",(t=>!0===t||"date"===t||"location"===t||"page"===t||"step"===t||"time"===t),new Set(["boolean","String {data, location, page, step, time}"]),t)}validateAriaExpanded(t){watchBoolean(this,"_ariaExpanded",t)}validateAriaLabel(t){validateAriaLabel(this,t)}validateAriaSelected(t){watchBoolean(this,"_ariaSelected",t)}validateDisabled(t){watchBoolean(this,"_disabled",t),!0===t&&a11yHintDisabled()}validateHref(t){watchString(this,"_href",t)}validateIcon(t){validateIcon(this,t)}validateIconAlign(t){watchIconAlign(this,t)}validateIconOnly(t){watchBoolean(this,"_iconOnly",t)}validateLabel(t){validateLabel(this,t)}validateOn(t){"object"==typeof t&&null!==t&&Object.prototype.hasOwnProperty.call(t,"onClick")&&"function"==typeof t.onClick&&(this.state=Object.assign(Object.assign({},this.state),{_on:t}))}validateRole(t){watchString(this,"_role",t)}validateSelector(t){watchString(this,"_selector",t)}validateStealth(t){watchBoolean(this,"_stealth",t)}validateTabIndex(t){validateTabIndex(this,t)}validateTarget(t){watchString(this,"_target",t)}validateTargetDescription(t){watchString(this,"_targetDescription",t)}validateTooltipAlign(t){watchTooltipAlignment(this,"_tooltipAlign",t)}validateUseCase(t){"string"==typeof t&&(this.state=Object.assign(Object.assign({},this.state),{_useCase:t}))}componentWillLoad(){this.validateAriaControls(this._ariaControls),this.validateAriaCurrent(this._ariaCurrent),this.validateAriaExpanded(this._ariaExpanded),this.validateAriaLabel(this._ariaLabel),this.validateAriaSelected(this._ariaSelected),this.validateDisabled(this._disabled),this.validateHref(this._href),this.validateIcon(this._icon),this.validateIconAlign(this._iconAlign),this.validateIconOnly(this._iconOnly),this.validateLabel(this._label),this.validateOn(this._on),this.validateRole(this._role),this.validateSelector(this._selector),this.validateStealth(this._stealth),this.validateTabIndex(this._tabIndex),this.validateTarget(this._target),this.validateTargetDescription(this._targetDescription),this.validateTooltipAlign(this._tooltipAlign),this.validateUseCase(this._useCase)}get host(){return this}static get watchers(){return{_ariaControls:["validateAriaControls"],_ariaCurrent:["validateAriaCurrent"],_ariaExpanded:["validateAriaExpanded"],_ariaLabel:["validateAriaLabel"],_ariaSelected:["validateAriaSelected"],_disabled:["validateDisabled"],_href:["validateHref"],_icon:["validateIcon"],_iconAlign:["validateIconAlign"],_iconOnly:["validateIconOnly"],_label:["validateLabel"],_on:["validateOn"],_role:["validateRole"],_selector:["validateSelector"],_stealth:["validateStealth"],_tabIndex:["validateTabIndex"],_target:["validateTarget"],_targetDescription:["validateTargetDescription"],_tooltipAlign:["validateTooltipAlign"],_useCase:["validateUseCase"]}}},[4,"kol-link-wc",{_ariaControls:[1,"_aria-controls"],_ariaCurrent:[8,"_aria-current"],_ariaExpanded:[516,"_aria-expanded"],_ariaLabel:[1,"_aria-label"],_ariaSelected:[516,"_aria-selected"],_disabled:[516],_href:[1],_icon:[1],_iconAlign:[1,"_icon-align"],_iconOnly:[516,"_icon-only"],_label:[1025],_on:[16],_role:[1],_selector:[1],_stealth:[516],_tabIndex:[2,"_tab-index"],_target:[1],_targetDescription:[1,"_target-description"],_tooltipAlign:[1,"_tooltip-align"],_useCase:[1,"_use-case"],state:[32]}]);function defineCustomElement(){if("undefined"==typeof customElements)return;["kol-link-wc","kol-badge","kol-button-wc","kol-icon","kol-span-wc","kol-tooltip"].forEach((t=>{switch(t){case"kol-link-wc":customElements.get(t)||customElements.define(t,KolLinkWc);break;case"kol-badge":customElements.get(t)||defineCustomElement$5();break;case"kol-button-wc":customElements.get(t)||defineCustomElement$4();break;case"kol-icon":customElements.get(t)||defineCustomElement$3();break;case"kol-span-wc":customElements.get(t)||defineCustomElement$2();break;case"kol-tooltip":customElements.get(t)||defineCustomElement$1()}}))}export{KolLinkWc as K,defineCustomElement as d};

package/dist/components/component6.js.map

@@ -1 +1 @@
-{"file":"component6.js","mappings":"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","names":[],"sources":["./src/components/link/component.tsx"],"sourcesContent":["import { Component, Element, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { translate } from '../../i18n';\nimport {\n\tAlternativButtonLinkRole,\n\tAriaCurrent,\n\tLinkOnCallbacks,\n\tLinkStates,\n\tLinkTarget,\n\tLinkUseCase,\n\tOptionalLinkProps,\n\tOptionalLinkStates,\n\tRequiredLinkProps,\n\tRequiredLinkStates,\n\twatchTooltipAlignment,\n} from '../../types/button-link';\nimport { Stringified } from '../../types/common';\nimport { KoliBriIconProp } from '../../types/icon';\nimport { Alignment } from '../../types/props/alignment';\nimport { a11yHintDisabled, devHint } from '../../utils/a11y.tipps';\nimport { nonce } from '../../utils/dev.utils';\nimport { mapBoolean2String, scrollBySelector, setEventTargetAndStopPropagation, watchBoolean, watchString, watchValidator } from '../../utils/prop.validators';\nimport { propergateFocus } from '../../utils/reuse';\nimport { validateIcon, watchIconAlign } from '../../utils/validators/icon';\nimport { validateAriaLabel, validateLabel } from '../../utils/validators/label';\nimport { validateTabIndex } from '../../utils/validators/tab-index';\n\ntype RequiredNavLinkProps = RequiredLinkProps;\ntype OptionalNavLinkProps = OptionalLinkProps & {\n\tactive: boolean;\n};\nexport type NavLinkProps = Generic.Element.Members<RequiredNavLinkProps, OptionalNavLinkProps>;\n\n/**\n * @internal\n */\n@Component({\n\ttag: 'kol-link-wc',\n\tshadow: false,\n})\nexport class KolLinkWc implements Generic.Element.ComponentApi<RequiredLinkProps, OptionalLinkProps, RequiredLinkStates, OptionalLinkStates> {\n\t@Element() private readonly host?: HTMLKolLinkWcElement;\n\tprivate readonly nonce = nonce();\n\tprivate ref?: HTMLAnchorElement;\n\n\tprivate readonly catchRef = (ref?: HTMLAnchorElement) => {\n\t\tthis.ref = ref;\n\t\tpropergateFocus(this.host, this.ref);\n\t};\n\n\tprivate readonly onClick = (event: Event) => {\n\t\tif (typeof this.state._on?.onClick === 'function') {\n\t\t\tevent.preventDefault();\n\t\t\tsetEventTargetAndStopPropagation(event, this.ref);\n\t\t\tthis.state._on?.onClick(event, this.state._href);\n\t\t}\n\t};\n\n\tprivate readonly getRenderValues = () => {\n\t\t/**\n\t\t * DX\n\t\t * Das möchte ich ungern für HTML machen, sondern nur für Barrierefreiheitsthemen.\n\t\t */\n\t\t// if (typeof this.state._href === 'string' && this.state._href.length > 0) {\n\t\t//   console.error('Setz den URL.');\n\t\t//   throw new Error('Setz den URL.');\n\t\t// }\n\n\t\t// switch (this.state._target) {\n\t\t//   case '_blank':\n\t\t//   case '_self':\n\t\t//     break;\n\t\t//   default:\n\t\t//     console.error('Fehlerhaftes Target.');\n\t\t//     throw new Error('Fehlerhaftes Target.');\n\t\t// }\n\n\t\t// ROBUSTHEIT durch Validierung\n\t\tlet goToProps = {};\n\t\tif (typeof this.state._selector === 'string') {\n\t\t\tgoToProps = {\n\t\t\t\trole: 'link',\n\t\t\t\ttabIndex: 0,\n\t\t\t\tonClick: () => {\n\t\t\t\t\tscrollBySelector(this.state._selector as string);\n\t\t\t\t},\n\t\t\t\tonKeyPress: () => {\n\t\t\t\t\tscrollBySelector(this.state._selector as string);\n\t\t\t\t},\n\t\t\t};\n\t\t}\n\n\t\tconst isExternal = typeof this.state._target === 'string' && this.state._target !== '_self';\n\n\t\tconst tagAttrs = {\n\t\t\thref: typeof this.state._href === 'string' && this.state._href.length > 0 ? this.state._href : 'javascript:void(0)',\n\t\t\ttarget: typeof this.state._target === 'string' && this.state._target.length > 0 ? this.state._target : undefined,\n\t\t\trel: isExternal ? 'noopener' : undefined,\n\t\t};\n\n\t\tif (\n\t\t\t(this.state._useCase === 'image' || this.state._iconOnly === true) &&\n\t\t\t(typeof this.state._ariaLabel !== 'string' || this.state._ariaLabel.length === 0)\n\t\t) {\n\t\t\tdevHint(`[KolLink] Es muss ein Aria-Label gesetzt werden, wenn eine Grafik verlinkt oder der Icon-Only-Modus verwendet wird.`);\n\t\t}\n\t\treturn { isExternal, tagAttrs, goToProps };\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { isExternal, tagAttrs, goToProps } = this.getRenderValues();\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<a\n\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t{...tagAttrs}\n\t\t\t\t\taria-controls={this.state._ariaControls}\n\t\t\t\t\taria-current={this.state._ariaCurrent}\n\t\t\t\t\taria-expanded={mapBoolean2String(this.state._ariaExpanded)}\n\t\t\t\t\taria-labelledby={this.state._useCase === 'image' || this.state._iconOnly === true ? this.nonce : undefined}\n\t\t\t\t\taria-selected={mapBoolean2String(this.state._ariaSelected)}\n\t\t\t\t\tclass={{\n\t\t\t\t\t\tdisabled: this.state._disabled === true,\n\t\t\t\t\t\t'skip ': this.state._stealth !== false,\n\t\t\t\t\t\t'icon-only': this.state._iconOnly === true,\n\t\t\t\t\t\t'external-link': isExternal,\n\t\t\t\t\t}}\n\t\t\t\t\t{...this.state._on}\n\t\t\t\t\t// https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/blob/main/docs/rules/click-events-have-key-events.md\n\t\t\t\t\tonClick={this.onClick}\n\t\t\t\t\tonKeyPress={this.onClick}\n\t\t\t\t\t{...goToProps}\n\t\t\t\t\trole={this.state._role}\n\t\t\t\t\ttabIndex={this.state._tabIndex}\n\t\t\t\t>\n\t\t\t\t\t<kol-span-wc _icon={this._icon} _iconOnly={this._iconOnly} _label={this.state._ariaLabel || this.state._label}>\n\t\t\t\t\t\t{/*\n\t\t\t\t\t\t\tEs ist keine gute Idee hier einen Slot einzufügen, da dadurch\n\t\t\t\t\t\t\tdie Unterstützung hinsichtlich der Barrierefreiheit 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\t<slot name=\"expert\" slot=\"expert\" />\n\t\t\t\t\t</kol-span-wc>\n\t\t\t\t\t{isExternal && (\n\t\t\t\t\t\t<kol-icon class=\"external-link-icon\" _ariaLabel={this.state._targetDescription as string} _icon={'fa-solid fa-arrow-up-right-from-square'} />\n\t\t\t\t\t)}\n\t\t\t\t</a>\n\t\t\t\t{(this.state._iconOnly === true || this.state._useCase === 'image') && (\n\t\t\t\t\t<kol-tooltip\n\t\t\t\t\t\t/**\n\t\t\t\t\t\t * Dieses Aria-Hidden verhindert das doppelte Vorlesen des Labels,\n\t\t\t\t\t\t * verhindert aber nicht das Aria-Labelledby vorgelesen wird.\n\t\t\t\t\t\t */\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t_align={this.state._tooltipAlign}\n\t\t\t\t\t\t_id={this.nonce}\n\t\t\t\t\t\t_label={this.state._ariaLabel || this.state._label}\n\t\t\t\t\t></kol-tooltip>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Gibt an, welche Elemente kontrolliert werden.  (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls)\n\t */\n\t@Prop() public _ariaControls?: string;\n\n\t/**\n\t * Gibt an, welchen aktuellen Auswahlstatus der Link hat. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current)\n\t */\n\t@Prop() public _ariaCurrent?: AriaCurrent;\n\n\t/**\n\t * Gibt an, ob durch den Link etwas aufgeklappt wurde. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded)\n\t */\n\t@Prop({ reflect: true }) public _ariaExpanded?: boolean;\n\n\t/**\n\t * Gibt einen beschreibenden Text des Links an.  (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label)\n\t */\n\t@Prop() public _ariaLabel?: string = '';\n\n\t/**\n\t * Gibt an, ob Element ausgewählt ist (role=tab). (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected)\n\t */\n\t@Prop({ reflect: true }) public _ariaSelected?: boolean;\n\n\t/**\n\t * Gibt an, ob der Link deaktiviert ist.\n\t */\n\t@Prop({ reflect: true }) public _disabled?: boolean = false;\n\n\t/**\n\t * Gibt die Ziel-Url des Links an.\n\t */\n\t@Prop() public _href!: string;\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 das Icon entweder links oder rechts dargestellt werden soll.\n\t *\n\t * @deprecated Wird durch das neue flexibleren Icon-Typ abgedeckt.\n\t */\n\t@Prop() public _iconAlign?: Alignment = 'left';\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 den Label für die Beschriftung der Schaltfläche an.\n\t */\n\t// - eslint-disable-next-line @stencil/strict-mutable\n\t@Prop({ mutable: true, reflect: false }) public _label!: string;\n\n\t/**\n\t * Gibt die EventCallback-Funktionen für den Link an.\n\t *\n\t * @deprecated Hierzu sollte statt Link- die ButtonLink-Komponente verwendet werden.\n\t */\n\t@Prop() public _on?: LinkOnCallbacks;\n\n\t/**\n\t * Gibt an, welche Role der Schalter hat.\n\t */\n\t@Prop() public _role?: AlternativButtonLinkRole;\n\n\t/**\n\t * Gibt die ID eines DOM-Elements, zu dem gesprungen werden soll, aus.\n\t *\n\t * @deprecated Das Styling sollte stets über CSS erfolgen.\n\t */\n\t@Prop() public _selector?: string;\n\n\t/**\n\t * Gibt an, ob der Link nur beim Fokus sichtbar ist.\n\t *\n\t * @deprecated Das Styling sollte stets über CSS erfolgen.\n\t */\n\t@Prop({ reflect: true }) public _stealth?: boolean = false;\n\n\t/**\n\t * Gibt an, welchen Tab-Index der Button hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)\n\t */\n\t@Prop() public _tabIndex?: number;\n\n\t/**\n\t * Definiert das Verhalten, bei dem der Link geöffnet werden soll.\n\t */\n\t@Prop() public _target?: LinkTarget;\n\n\t/**\n\t * Gibt die Beschreibung an, wenn der Link in einem anderen Programm geöffnet wird.\n\t */\n\t@Prop() public _targetDescription?: string = translate('kol-open-link-in-tab');\n\n\t/**\n\t * Gibt an, ob der Tooltip entweder oben, rechts, unten oder links angezeigt werden soll.\n\t */\n\t@Prop() public _tooltipAlign?: Alignment = 'right';\n\n\t/**\n\t * Gibt den Verwendungsfall des Links an.\n\t *\n\t * @deprecated Das Styling sollte stets über CSS erfolgen.\n\t */\n\t@Prop() public _useCase?: LinkUseCase = 'text';\n\n\t/**\n\t * @see: components/abbr/component.tsx (@State)\n\t */\n\t@State() public state: LinkStates = {\n\t\t_ariaLabel: '',\n\t\t_href: 'javascript:void(0)',\n\t\t_icon: {},\n\t\t/**\n\t\t * @deprecated\n\t\t */\n\t\t_iconAlign: 'left',\n\t\t_label: '',\n\t};\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_ariaControls')\n\tpublic validateAriaControls(value?: string): void {\n\t\twatchString(this, '_ariaControls', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_ariaCurrent')\n\tpublic validateAriaCurrent(value?: AriaCurrent): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_ariaCurrent',\n\t\t\t(value) => value === true || value === 'date' || value === 'location' || value === 'page' || value === 'step' || value === 'time',\n\t\t\tnew Set(['boolean', 'String {data, location, page, step, time}']),\n\t\t\tvalue\n\t\t);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_ariaExpanded')\n\tpublic validateAriaExpanded(value?: boolean): void {\n\t\twatchBoolean(this, '_ariaExpanded', value);\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\tvalidateAriaLabel(this, value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_ariaSelected')\n\tpublic validateAriaSelected(value?: boolean): void {\n\t\twatchBoolean(this, '_ariaSelected', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\twatchBoolean(this, '_disabled', value);\n\t\tif (value === true) {\n\t\t\ta11yHintDisabled();\n\t\t}\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_href')\n\tpublic validateHref(value?: string): void {\n\t\twatchString(this, '_href', value);\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 * @deprecated\n\t */\n\t@Watch('_iconAlign')\n\tpublic validateIconAlign(value?: Alignment): void {\n\t\twatchIconAlign(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 (@Watch)\n\t * @deprecated\n\t */\n\t@Watch('_on')\n\tpublic validateOn(value?: LinkOnCallbacks): void {\n\t\tif (\n\t\t\ttypeof value === 'object' &&\n\t\t\tvalue !== null &&\n\t\t\t// https://eslint.org/docs/rules/no-prototype-builtins\n\t\t\tObject.prototype.hasOwnProperty.call(value, 'onClick') &&\n\t\t\ttypeof value.onClick === 'function'\n\t\t) {\n\t\t\tthis.state = {\n\t\t\t\t...this.state,\n\t\t\t\t_on: value,\n\t\t\t};\n\t\t}\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_role')\n\tpublic validateRole(value?: AlternativButtonLinkRole): void {\n\t\twatchString(this, '_role', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_selector')\n\tpublic validateSelector(value?: string): void {\n\t\twatchString(this, '_selector', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_stealth')\n\tpublic validateStealth(value?: boolean): void {\n\t\twatchBoolean(this, '_stealth', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tvalidateTabIndex(this, value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_target')\n\tpublic validateTarget(value?: LinkTarget): void {\n\t\twatchString(this, '_target', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_targetDescription')\n\tpublic validateTargetDescription(value?: string): void {\n\t\twatchString(this, '_targetDescription', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_tooltipAlign')\n\tpublic validateTooltipAlign(value?: Alignment): void {\n\t\twatchTooltipAlignment(this, '_tooltipAlign', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_useCase')\n\tpublic validateUseCase(value?: LinkUseCase): void {\n\t\tif (typeof value === 'string') {\n\t\t\tthis.state = {\n\t\t\t\t...this.state,\n\t\t\t\t_useCase: value,\n\t\t\t};\n\t\t}\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAriaControls(this._ariaControls);\n\t\tthis.validateAriaCurrent(this._ariaCurrent);\n\t\tthis.validateAriaExpanded(this._ariaExpanded);\n\t\tthis.validateAriaLabel(this._ariaLabel);\n\t\tthis.validateAriaSelected(this._ariaSelected);\n\t\tthis.validateDisabled(this._disabled);\n\t\tthis.validateHref(this._href);\n\t\tthis.validateIcon(this._icon);\n\t\tthis.validateIconAlign(this._iconAlign);\n\t\tthis.validateIconOnly(this._iconOnly);\n\t\tthis.validateLabel(this._label);\n\t\tthis.validateOn(this._on);\n\t\tthis.validateRole(this._role);\n\t\tthis.validateSelector(this._selector);\n\t\tthis.validateStealth(this._stealth);\n\t\tthis.validateTabIndex(this._tabIndex);\n\t\tthis.validateTarget(this._target);\n\t\tthis.validateTargetDescription(this._targetDescription);\n\t\tthis.validateTooltipAlign(this._tooltipAlign);\n\t\tthis.validateUseCase(this._useCase);\n\t}\n}\n"],"version":3}
+{"file":"component6.js","mappings":"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","names":[],"sources":["./src/components/link/component.tsx"],"sourcesContent":["import { Component, Element, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { translate } from '../../i18n';\nimport {\n\tAlternativButtonLinkRole,\n\tAriaCurrent,\n\tLinkOnCallbacks,\n\tLinkStates,\n\tLinkTarget,\n\tLinkUseCase,\n\tOptionalLinkProps,\n\tOptionalLinkStates,\n\tRequiredLinkProps,\n\tRequiredLinkStates,\n\twatchTooltipAlignment,\n} from '../../types/button-link';\nimport { Stringified } from '../../types/common';\nimport { KoliBriIconProp } from '../../types/icon';\nimport { Alignment } from '../../types/props/alignment';\nimport { a11yHintDisabled, devHint } from '../../utils/a11y.tipps';\nimport { nonce } from '../../utils/dev.utils';\nimport { mapBoolean2String, scrollBySelector, setEventTargetAndStopPropagation, watchBoolean, watchString, watchValidator } from '../../utils/prop.validators';\nimport { propergateFocus } from '../../utils/reuse';\nimport { validateIcon, watchIconAlign } from '../../utils/validators/icon';\nimport { validateAriaLabel, validateLabel } from '../../utils/validators/label';\nimport { validateTabIndex } from '../../utils/validators/tab-index';\n\ntype RequiredNavLinkProps = RequiredLinkProps;\ntype OptionalNavLinkProps = OptionalLinkProps & {\n\tactive: boolean;\n};\nexport type NavLinkProps = Generic.Element.Members<RequiredNavLinkProps, OptionalNavLinkProps>;\n\n/**\n * @internal\n */\n@Component({\n\ttag: 'kol-link-wc',\n\tshadow: false,\n})\nexport class KolLinkWc implements Generic.Element.ComponentApi<RequiredLinkProps, OptionalLinkProps, RequiredLinkStates, OptionalLinkStates> {\n\t@Element() private readonly host?: HTMLKolLinkWcElement;\n\tprivate readonly nonce = nonce();\n\tprivate ref?: HTMLAnchorElement;\n\n\tprivate readonly catchRef = (ref?: HTMLAnchorElement) => {\n\t\tthis.ref = ref;\n\t\tpropergateFocus(this.host, this.ref);\n\t};\n\n\tprivate readonly onClick = (event: Event) => {\n\t\tif (typeof this.state._on?.onClick === 'function') {\n\t\t\tevent.preventDefault();\n\t\t\tsetEventTargetAndStopPropagation(event, this.ref);\n\t\t\tthis.state._on?.onClick(event, this.state._href);\n\t\t}\n\t};\n\n\tprivate readonly getRenderValues = () => {\n\t\t/**\n\t\t * DX\n\t\t * Das möchte ich ungern für HTML machen, sondern nur für Barrierefreiheitsthemen.\n\t\t */\n\t\t// if (typeof this.state._href === 'string' && this.state._href.length > 0) {\n\t\t//   console.error('Setz den URL.');\n\t\t//   throw new Error('Setz den URL.');\n\t\t// }\n\n\t\t// switch (this.state._target) {\n\t\t//   case '_blank':\n\t\t//   case '_self':\n\t\t//     break;\n\t\t//   default:\n\t\t//     console.error('Fehlerhaftes Target.');\n\t\t//     throw new Error('Fehlerhaftes Target.');\n\t\t// }\n\n\t\t// ROBUSTHEIT durch Validierung\n\t\tlet goToProps = {};\n\t\tif (typeof this.state._selector === 'string') {\n\t\t\tgoToProps = {\n\t\t\t\trole: 'link',\n\t\t\t\ttabIndex: 0,\n\t\t\t\tonClick: () => {\n\t\t\t\t\tscrollBySelector(this.state._selector as string);\n\t\t\t\t},\n\t\t\t\tonKeyPress: () => {\n\t\t\t\t\tscrollBySelector(this.state._selector as string);\n\t\t\t\t},\n\t\t\t};\n\t\t}\n\n\t\tconst isExternal = typeof this.state._target === 'string' && this.state._target !== '_self';\n\n\t\tconst tagAttrs = {\n\t\t\thref: typeof this.state._href === 'string' && this.state._href.length > 0 ? this.state._href : 'javascript:void(0)',\n\t\t\ttarget: typeof this.state._target === 'string' && this.state._target.length > 0 ? this.state._target : undefined,\n\t\t\trel: isExternal ? 'noopener' : undefined,\n\t\t};\n\n\t\tif (\n\t\t\t(this.state._useCase === 'image' || this.state._iconOnly === true) &&\n\t\t\t(typeof this.state._ariaLabel !== 'string' || this.state._ariaLabel.length === 0)\n\t\t) {\n\t\t\tdevHint(`[KolLink] Es muss ein Aria-Label gesetzt werden, wenn eine Grafik verlinkt oder der Icon-Only-Modus verwendet wird.`);\n\t\t}\n\t\treturn { isExternal, tagAttrs, goToProps };\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { isExternal, tagAttrs, goToProps } = this.getRenderValues();\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<a\n\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t{...tagAttrs}\n\t\t\t\t\taria-controls={this.state._ariaControls}\n\t\t\t\t\taria-current={this.state._ariaCurrent}\n\t\t\t\t\taria-expanded={mapBoolean2String(this.state._ariaExpanded)}\n\t\t\t\t\taria-labelledby={this.state._useCase === 'image' || this.state._iconOnly === true ? this.nonce : undefined}\n\t\t\t\t\taria-selected={mapBoolean2String(this.state._ariaSelected)}\n\t\t\t\t\tclass={{\n\t\t\t\t\t\tdisabled: this.state._disabled === true,\n\t\t\t\t\t\t'skip ': this.state._stealth !== false,\n\t\t\t\t\t\t'icon-only': this.state._iconOnly === true,\n\t\t\t\t\t\t'external-link': isExternal,\n\t\t\t\t\t}}\n\t\t\t\t\t{...this.state._on}\n\t\t\t\t\t// https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/blob/main/docs/rules/click-events-have-key-events.md\n\t\t\t\t\tonClick={this.onClick}\n\t\t\t\t\tonKeyPress={this.onClick}\n\t\t\t\t\t{...goToProps}\n\t\t\t\t\trole={this.state._role}\n\t\t\t\t\ttabIndex={this.state._tabIndex}\n\t\t\t\t>\n\t\t\t\t\t<kol-span-wc _icon={this._icon} _iconOnly={this._iconOnly} _label={this.state._label}>\n\t\t\t\t\t\t{/*\n\t\t\t\t\t\t\tEs ist keine gute Idee hier einen Slot einzufügen, da dadurch ermöglicht wird,\n\t\t\t\t\t\t\tdie Unterstützung hinsichtlich der Barrierefreiheit der Komponente zu umgehen.\n\t\t\t\t\t\t*/}\n\t\t\t\t\t\t<slot name=\"expert\" slot=\"expert\" />\n\t\t\t\t\t</kol-span-wc>\n\t\t\t\t\t{isExternal && (\n\t\t\t\t\t\t<kol-icon class=\"external-link-icon\" _ariaLabel={this.state._targetDescription as string} _icon={'fa-solid fa-arrow-up-right-from-square'} />\n\t\t\t\t\t)}\n\t\t\t\t</a>\n\t\t\t\t{(this.state._iconOnly === true || this.state._useCase === 'image') && (\n\t\t\t\t\t<kol-tooltip\n\t\t\t\t\t\t/**\n\t\t\t\t\t\t * Dieses Aria-Hidden verhindert das doppelte Vorlesen des Labels,\n\t\t\t\t\t\t * verhindert aber nicht das Aria-Labelledby vorgelesen wird.\n\t\t\t\t\t\t */\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t_align={this.state._tooltipAlign}\n\t\t\t\t\t\t_id={this.nonce}\n\t\t\t\t\t\t_label={this.state._ariaLabel || this.state._label}\n\t\t\t\t\t></kol-tooltip>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Gibt an, welche Elemente kontrolliert werden.  (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls)\n\t */\n\t@Prop() public _ariaControls?: string;\n\n\t/**\n\t * Gibt an, welchen aktuellen Auswahlstatus der Link hat. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current)\n\t */\n\t@Prop() public _ariaCurrent?: AriaCurrent;\n\n\t/**\n\t * Gibt an, ob durch den Link etwas aufgeklappt wurde. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded)\n\t */\n\t@Prop({ reflect: true }) public _ariaExpanded?: boolean;\n\n\t/**\n\t * Gibt einen beschreibenden Text des Links an.  (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label)\n\t */\n\t@Prop() public _ariaLabel?: string = '';\n\n\t/**\n\t * Gibt an, ob Element ausgewählt ist (role=tab). (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected)\n\t */\n\t@Prop({ reflect: true }) public _ariaSelected?: boolean;\n\n\t/**\n\t * Gibt an, ob der Link deaktiviert ist.\n\t */\n\t@Prop({ reflect: true }) public _disabled?: boolean = false;\n\n\t/**\n\t * Gibt die Ziel-Url des Links an.\n\t */\n\t@Prop() public _href!: string;\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 das Icon entweder links oder rechts dargestellt werden soll.\n\t *\n\t * @deprecated Wird durch das neue flexibleren Icon-Typ abgedeckt.\n\t */\n\t@Prop() public _iconAlign?: Alignment = 'left';\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 den Label für die Beschriftung der Schaltfläche an.\n\t */\n\t// - eslint-disable-next-line @stencil/strict-mutable\n\t@Prop({ mutable: true, reflect: false }) public _label!: string;\n\n\t/**\n\t * Gibt die EventCallback-Funktionen für den Link an.\n\t *\n\t * @deprecated Hierzu sollte statt Link- die ButtonLink-Komponente verwendet werden.\n\t */\n\t@Prop() public _on?: LinkOnCallbacks;\n\n\t/**\n\t * Gibt an, welche Role der Schalter hat.\n\t */\n\t@Prop() public _role?: AlternativButtonLinkRole;\n\n\t/**\n\t * Gibt die ID eines DOM-Elements, zu dem gesprungen werden soll, aus.\n\t *\n\t * @deprecated Das Styling sollte stets über CSS erfolgen.\n\t */\n\t@Prop() public _selector?: string;\n\n\t/**\n\t * Gibt an, ob der Link nur beim Fokus sichtbar ist.\n\t *\n\t * @deprecated Das Styling sollte stets über CSS erfolgen.\n\t */\n\t@Prop({ reflect: true }) public _stealth?: boolean = false;\n\n\t/**\n\t * Gibt an, welchen Tab-Index der Button hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)\n\t */\n\t@Prop() public _tabIndex?: number;\n\n\t/**\n\t * Definiert das Verhalten, bei dem der Link geöffnet werden soll.\n\t */\n\t@Prop() public _target?: LinkTarget;\n\n\t/**\n\t * Gibt die Beschreibung an, wenn der Link in einem anderen Programm geöffnet wird.\n\t */\n\t@Prop() public _targetDescription?: string = translate('kol-open-link-in-tab');\n\n\t/**\n\t * Gibt an, ob der Tooltip entweder oben, rechts, unten oder links angezeigt werden soll.\n\t */\n\t@Prop() public _tooltipAlign?: Alignment = 'right';\n\n\t/**\n\t * Gibt den Verwendungsfall des Links an.\n\t *\n\t * @deprecated Das Styling sollte stets über CSS erfolgen.\n\t */\n\t@Prop() public _useCase?: LinkUseCase = 'text';\n\n\t/**\n\t * @see: components/abbr/component.tsx (@State)\n\t */\n\t@State() public state: LinkStates = {\n\t\t_ariaLabel: '',\n\t\t_href: 'javascript:void(0)',\n\t\t_icon: {},\n\t\t/**\n\t\t * @deprecated\n\t\t */\n\t\t_iconAlign: 'left',\n\t\t_label: '',\n\t};\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_ariaControls')\n\tpublic validateAriaControls(value?: string): void {\n\t\twatchString(this, '_ariaControls', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_ariaCurrent')\n\tpublic validateAriaCurrent(value?: AriaCurrent): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_ariaCurrent',\n\t\t\t(value) => value === true || value === 'date' || value === 'location' || value === 'page' || value === 'step' || value === 'time',\n\t\t\tnew Set(['boolean', 'String {data, location, page, step, time}']),\n\t\t\tvalue\n\t\t);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_ariaExpanded')\n\tpublic validateAriaExpanded(value?: boolean): void {\n\t\twatchBoolean(this, '_ariaExpanded', value);\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\tvalidateAriaLabel(this, value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_ariaSelected')\n\tpublic validateAriaSelected(value?: boolean): void {\n\t\twatchBoolean(this, '_ariaSelected', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\twatchBoolean(this, '_disabled', value);\n\t\tif (value === true) {\n\t\t\ta11yHintDisabled();\n\t\t}\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_href')\n\tpublic validateHref(value?: string): void {\n\t\twatchString(this, '_href', value);\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 * @deprecated\n\t */\n\t@Watch('_iconAlign')\n\tpublic validateIconAlign(value?: Alignment): void {\n\t\twatchIconAlign(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 (@Watch)\n\t * @deprecated\n\t */\n\t@Watch('_on')\n\tpublic validateOn(value?: LinkOnCallbacks): void {\n\t\tif (\n\t\t\ttypeof value === 'object' &&\n\t\t\tvalue !== null &&\n\t\t\t// https://eslint.org/docs/rules/no-prototype-builtins\n\t\t\tObject.prototype.hasOwnProperty.call(value, 'onClick') &&\n\t\t\ttypeof value.onClick === 'function'\n\t\t) {\n\t\t\tthis.state = {\n\t\t\t\t...this.state,\n\t\t\t\t_on: value,\n\t\t\t};\n\t\t}\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_role')\n\tpublic validateRole(value?: AlternativButtonLinkRole): void {\n\t\twatchString(this, '_role', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_selector')\n\tpublic validateSelector(value?: string): void {\n\t\twatchString(this, '_selector', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_stealth')\n\tpublic validateStealth(value?: boolean): void {\n\t\twatchBoolean(this, '_stealth', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tvalidateTabIndex(this, value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_target')\n\tpublic validateTarget(value?: LinkTarget): void {\n\t\twatchString(this, '_target', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_targetDescription')\n\tpublic validateTargetDescription(value?: string): void {\n\t\twatchString(this, '_targetDescription', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_tooltipAlign')\n\tpublic validateTooltipAlign(value?: Alignment): void {\n\t\twatchTooltipAlignment(this, '_tooltipAlign', value);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t */\n\t@Watch('_useCase')\n\tpublic validateUseCase(value?: LinkUseCase): void {\n\t\tif (typeof value === 'string') {\n\t\t\tthis.state = {\n\t\t\t\t...this.state,\n\t\t\t\t_useCase: value,\n\t\t\t};\n\t\t}\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAriaControls(this._ariaControls);\n\t\tthis.validateAriaCurrent(this._ariaCurrent);\n\t\tthis.validateAriaExpanded(this._ariaExpanded);\n\t\tthis.validateAriaLabel(this._ariaLabel);\n\t\tthis.validateAriaSelected(this._ariaSelected);\n\t\tthis.validateDisabled(this._disabled);\n\t\tthis.validateHref(this._href);\n\t\tthis.validateIcon(this._icon);\n\t\tthis.validateIconAlign(this._iconAlign);\n\t\tthis.validateIconOnly(this._iconOnly);\n\t\tthis.validateLabel(this._label);\n\t\tthis.validateOn(this._on);\n\t\tthis.validateRole(this._role);\n\t\tthis.validateSelector(this._selector);\n\t\tthis.validateStealth(this._stealth);\n\t\tthis.validateTabIndex(this._tabIndex);\n\t\tthis.validateTarget(this._target);\n\t\tthis.validateTargetDescription(this._targetDescription);\n\t\tthis.validateTooltipAlign(this._tooltipAlign);\n\t\tthis.validateUseCase(this._useCase);\n\t}\n}\n"],"version":3}

package/dist/components/component7.js

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";const KolButtonGroupWc=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.state={}}render(){return h(Host,null,h("div",{class:"flex flex-wrap bg-normal"},h("slot",null)))}},[4,"kol-button-group-wc",{state:[32]}]);function defineCustomElement(){if("undefined"==typeof customElements)return;["kol-button-group-wc"].forEach((t=>{if("kol-button-group-wc"===t)customElements.get(t)||customElements.define(t,KolButtonGroupWc)}))}export{KolButtonGroupWc as K,defineCustomElement as d};
+import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";const KolButtonGroupWc=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.state={}}render(){return h(Host,null,h("slot",null))}},[4,"kol-button-group-wc",{state:[32]}]);function defineCustomElement(){if("undefined"==typeof customElements)return;["kol-button-group-wc"].forEach((t=>{if("kol-button-group-wc"===t)customElements.get(t)||customElements.define(t,KolButtonGroupWc)}))}export{KolButtonGroupWc as K,defineCustomElement as d};

package/dist/components/component7.js.map

@@ -1 +1 @@
-{"file":"component7.js","mappings":";;;;;MAmBa,gBAAgB;;;;iBAcI,EAAE;;EAb3B,MAAM;IACZ,QACC,EAAC,IAAI,QACJ,WAAK,KAAK,EAAC,0BAA0B,IACpC,eAAQ,CACH,CACA,EACN;GACF;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/button-group/component.tsx"],"sourcesContent":["import { Component, h, Host, JSX, State } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\n\n/**\n * API\n */\ntype RequiredProps = unknown;\ntype OptionalProps = unknown;\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = RequiredProps;\ntype OptionalStates = OptionalProps;\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n@Component({\n\ttag: 'kol-button-group-wc',\n\tshadow: false,\n})\nexport class KolButtonGroupWc 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<div class=\"flex flex-wrap bg-normal\">\n\t\t\t\t\t<slot />\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@State)\n\t */\n\t@State() public state: States = {};\n}\n"],"version":3}
+{"file":"component7.js","mappings":";;;;;MAmBa,gBAAgB;;;;iBAYI,EAAE;;EAX3B,MAAM;IACZ,QACC,EAAC,IAAI,QACJ,eAAQ,CACF,EACN;GACF;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/button-group/component.tsx"],"sourcesContent":["import { Component, h, Host, JSX, State } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\n\n/**\n * API\n */\ntype RequiredProps = unknown;\ntype OptionalProps = unknown;\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = RequiredProps;\ntype OptionalStates = OptionalProps;\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n@Component({\n\ttag: 'kol-button-group-wc',\n\tshadow: false,\n})\nexport class KolButtonGroupWc 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<slot />\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@State)\n\t */\n\t@State() public state: States = {};\n}\n"],"version":3}

package/dist/components/component8.js

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";const defaultStyleCss="*{box-sizing:border-box;font-size:inherit;hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}kol-heading-wc{font-weight:bold}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,input,select,textarea{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{background-color:transparent;border-width:0}:host>div{border-left-color:#666;border-left-style:solid;border-left-width:0.25rem;padding:0.125rem 0.25rem;width:100%}",KolIndentedText=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.__attachShadow(),this.state={}}render(){return h(Host,null,h("div",null,h("slot",null)))}static get style(){return{default:defaultStyleCss}}},[33,"kol-indented-text",{state:[32]}]);function defineCustomElement(){if("undefined"==typeof customElements)return;["kol-indented-text"].forEach((e=>{if("kol-indented-text"===e)customElements.get(e)||customElements.define(e,KolIndentedText)}))}export{KolIndentedText as K,defineCustomElement as d};
+import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";const defaultStyleCss=":host{--kolibri-border-color:#e0e0e0;--kolibri-border-radius:0.125rem;--kolibri-border-width:1px;--kolibri-color-error:#f44336;--kolibri-color-info:#2196f3;--kolibri-color-success:#4caf50;--kolibri-color-warning:#ff9800;--kolibri-color-primary:#3f51b5;--kolibri-color-secondary:#ff4081;--kolibri-color-normal:#9e9e9e;--kolibri-color-danger:#f44336;--kolibri-color-ghost:#f5f5f5;--kolibri-color-disabled:#bdbdbd;--kolibri-color-text:#222222;--kolibri-color-visited:#9c27b0;--kolibri-font-family:Verdana, Arial, Tahoma, Helvetica, sans-serif;--kolibri-font-size:16px;--kolibri-spacing:0.25rem}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}*{box-sizing:border-box;font-family:var(--kolibri-font-family)}kol-icon{color:inherit}kol-span-wc{display:grid;place-items:center;width:100%}kol-span-wc>span{display:flex;gap:var(--kolibri-spacing);place-items:center}button{min-height:44px;min-width:44px;padding:0;margin:0}a,button,input,select,textarea{cursor:pointer;font-family:inherit}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{background-color:transparent;border-width:0}h1,h2,h3,h4,h5,h6{font-size:1rem;margin:0}:host>div{border-left-color:var(--kolibri-border-color);border-left-style:solid;border-left-width:var(--kolibri-spacing);display:block;padding:calc(var(--kolibri-spacing) / 2) calc(2 * var(--kolibri-spacing))}",KolIndentedText=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.__attachShadow(),this.state={}}render(){return h(Host,null,h("div",null,h("slot",null)))}static get style(){return{default:defaultStyleCss}}},[33,"kol-indented-text",{state:[32]}]);function defineCustomElement(){if("undefined"==typeof customElements)return;["kol-indented-text"].forEach((e=>{if("kol-indented-text"===e)customElements.get(e)||customElements.define(e,KolIndentedText)}))}export{KolIndentedText as K,defineCustomElement as d};

package/dist/components/component8.js.map

@@ -1 +1 @@
-{"file":"component8.js","mappings":";;;;;AAAA,MAAM,eAAe,GAAG,+nBAA+nB;;MCsB1oB,eAAe;;;;;iBAIK,EAAE;;EAE3B,MAAM;IACZ,QACC,EAAC,IAAI,QACJ,eACC,eAAQ,CACH,CACA,EACN;GACF;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/indented-text/style.sass?tag=kol-indented-text&mode=default&encapsulation=shadow","./src/components/indented-text/component.tsx"],"sourcesContent":["@import ../style\n\n:host\n\n\t> div\n\t\tborder-left-color: #666\n\t\tborder-left-style: solid\n\t\tborder-left-width: 0.25rem\n\t\tpadding: 0.125rem 0.25rem\n\t\twidth: 100%\n","import { Component, h, Host, JSX, State } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\n\n/**\n * API\n */\ntype RequiredProps = unknown;\ntype OptionalProps = unknown;\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = RequiredProps;\ntype OptionalStates = OptionalProps;\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n@Component({\n\ttag: 'kol-indented-text',\n\tstyleUrls: {\n\t\tdefault: './style.sass',\n\t},\n\tshadow: true,\n})\nexport class KolIndentedText implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\t/**\n\t * @see: components/abbr/component.tsx (@State)\n\t */\n\t@State() public state: States = {};\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<div>\n\t\t\t\t\t<slot />\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"version":3}
+{"file":"component8.js","mappings":";;;;;AAAA,MAAM,eAAe,GAAG,q6CAAq6C;;MCsBh7C,eAAe;;;;;iBAIK,EAAE;;EAE3B,MAAM;IACZ,QACC,EAAC,IAAI,QACJ,eACC,eAAQ,CACH,CACA,EACN;GACF;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/indented-text/style.css?tag=kol-indented-text&mode=default&encapsulation=shadow","./src/components/indented-text/component.tsx"],"sourcesContent":["@import '../style.css';\n\n:host > div {\n\tborder-left-color: var(--kolibri-border-color);\n\tborder-left-style: solid;\n\tborder-left-width: var(--kolibri-spacing);\n\tdisplay: block;\n\tpadding: calc(var(--kolibri-spacing) / 2) calc(2 * var(--kolibri-spacing));\n}\n","import { Component, h, Host, JSX, State } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\n\n/**\n * API\n */\ntype RequiredProps = unknown;\ntype OptionalProps = unknown;\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = RequiredProps;\ntype OptionalStates = OptionalProps;\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n@Component({\n\ttag: 'kol-indented-text',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolIndentedText implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\t/**\n\t * @see: components/abbr/component.tsx (@State)\n\t */\n\t@State() public state: States = {};\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<div>\n\t\t\t\t\t<slot />\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"version":3}

package/dist/components/controller-icon.js

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{y as objectObjectHandler,z as parseJson,b as watchValidator,A as isString}from"./prop.validators.js";import{i as isIcon}from"./component3.js";import{I as InputController}from"./controller.js";const beforePatchIcon=(o,t)=>{const n=o;"object"==typeof n&&null!==n&&(isString(n.right,1)&&(n.right={icon:n.right}),isString(n.left,1)&&(n.left={icon:n.left}),t.set("_icon",n))};class InputIconController extends InputController{constructor(o,t,n){super(o,t,n),this.component=o}validateIcon(o){objectObjectHandler(o,(()=>{try{o=parseJson(o)}catch(o){}watchValidator(this.component,"_icon",(o=>"object"==typeof o&&null!==o&&(isString(o.left,1)||isIcon(o.left)||isString(o.right,1)||isIcon(o.right))),new Set(["KoliBriHorizontalIcon"]),o,{hooks:{beforePatch:beforePatchIcon},required:!0})}))}componentWillLoad(){super.componentWillLoad(),this.validateIcon(this.component._icon)}}export{InputIconController as I};
+import{y as objectObjectHandler,z as parseJson,a as watchValidator,A as isString}from"./prop.validators.js";import{i as isIcon}from"./component3.js";import{I as InputController}from"./controller.js";const beforePatchIcon=(o,t)=>{const n=o;"object"==typeof n&&null!==n&&(isString(n.right,1)&&(n.right={icon:n.right}),isString(n.left,1)&&(n.left={icon:n.left}),t.set("_icon",n))};class InputIconController extends InputController{constructor(o,t,n){super(o,t,n),this.component=o}validateIcon(o){objectObjectHandler(o,(()=>{try{o=parseJson(o)}catch(o){}watchValidator(this.component,"_icon",(o=>"object"==typeof o&&null!==o&&(isString(o.left,1)||isIcon(o.left)||isString(o.right,1)||isIcon(o.right))),new Set(["KoliBriHorizontalIcon"]),o,{hooks:{beforePatch:beforePatchIcon},required:!0})}))}componentWillLoad(){super.componentWillLoad(),this.validateIcon(this.component._icon)}}export{InputIconController as I};

package/dist/components/controller2.js

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{b as watchValidator,G as watchJsonArrayString,J as mapString2Unknown,v as setState,M as STATE_CHANGE_EVENT,t as watchBoolean}from"./prop.validators.js";import{I as InputController}from"./controller.js";const fillKeyOptionMap=(t,e,o="")=>{e.forEach(((e,a)=>{const i=`${o}-${a}`;"object"==typeof e&&null!==e&&"string"==typeof e.label&&e.label.length>0&&(Array.isArray(e.options)?fillKeyOptionMap(t,e.options,i):t.set(i,e))}))};class InputCheckboxRadioController extends InputController{constructor(t,e,o){super(t,e,o),this.component=t}validateRequired(t){watchBoolean(this.component,"_required",t)}componentWillLoad(){super.componentWillLoad(),this.validateRequired(this.component._required)}}class InputRadioController extends InputCheckboxRadioController{constructor(t,e,o){super(t,e,o),this.keyOptionMap=new Map,this.getOptionByKey=t=>this.keyOptionMap.get(t),this.isValueInOptions=(t,e)=>void 0!==e.find((e=>e.value===t)),this.beforePatchListValue=(t,e)=>{const o=e.has("_list")?e.get("_list"):this.component.state._list;if(Array.isArray(o)&&o.length>0){this.keyOptionMap.clear(),fillKeyOptionMap(this.keyOptionMap,o);const t=e.has("_value")?e.get("_value"):this.component.state._value;if(!1===this.isValueInOptions(t,o)){const t=o[0].value;e.set("_value",t),this.onStateChange()}}},this.component=t}validateOrientation(t){watchValidator(this.component,"_orientation",(t=>"horizontal"===t||"vertical"===t),new Set(["Orientation {horizontal, vertical}"]),t,{defaultValue:"vertical"})}validateList(t){watchJsonArrayString(this.component,"_list",(t=>"object"==typeof t&&null!==t&&"string"==typeof t.label&&t.label.length>0),t,void 0,{hooks:{beforePatch:this.beforePatchListValue}})}validateValue(t){t=mapString2Unknown(t),t=Array.isArray(t)?t[0]:t,setState(this.component,"_value",t,{beforePatch:this.beforePatchListValue}),this.setFormAssociatedValue(this.component._value)}componentWillLoad(t){super.componentWillLoad(),this.onStateChange=()=>{if("function"==typeof t){const e=setTimeout((()=>{clearTimeout(e),t(STATE_CHANGE_EVENT)}))}},this.validateOrientation(this.component._orientation),this.validateList(this.component._list),this.validateValue(this.component._value)}}export{InputCheckboxRadioController as I,InputRadioController as a,fillKeyOptionMap as f};
+import{a as watchValidator,G as watchJsonArrayString,J as mapString2Unknown,v as setState,M as STATE_CHANGE_EVENT,t as watchBoolean}from"./prop.validators.js";import{I as InputController}from"./controller.js";const fillKeyOptionMap=(t,e,o="")=>{e.forEach(((e,a)=>{const i=`${o}-${a}`;"object"==typeof e&&null!==e&&"string"==typeof e.label&&e.label.length>0&&(Array.isArray(e.options)?fillKeyOptionMap(t,e.options,i):t.set(i,e))}))};class InputCheckboxRadioController extends InputController{constructor(t,e,o){super(t,e,o),this.component=t}validateRequired(t){watchBoolean(this.component,"_required",t)}componentWillLoad(){super.componentWillLoad(),this.validateRequired(this.component._required)}}class InputRadioController extends InputCheckboxRadioController{constructor(t,e,o){super(t,e,o),this.keyOptionMap=new Map,this.getOptionByKey=t=>this.keyOptionMap.get(t),this.isValueInOptions=(t,e)=>void 0!==e.find((e=>e.value===t)),this.beforePatchListValue=(t,e)=>{const o=e.has("_list")?e.get("_list"):this.component.state._list;if(Array.isArray(o)&&o.length>0){this.keyOptionMap.clear(),fillKeyOptionMap(this.keyOptionMap,o);const t=e.has("_value")?e.get("_value"):this.component.state._value;if(!1===this.isValueInOptions(t,o)){const t=o[0].value;e.set("_value",t),this.onStateChange()}}},this.component=t}validateOrientation(t){watchValidator(this.component,"_orientation",(t=>"horizontal"===t||"vertical"===t),new Set(["Orientation {horizontal, vertical}"]),t,{defaultValue:"vertical"})}validateList(t){watchJsonArrayString(this.component,"_list",(t=>"object"==typeof t&&null!==t&&"string"==typeof t.label&&t.label.length>0),t,void 0,{hooks:{beforePatch:this.beforePatchListValue}})}validateValue(t){t=mapString2Unknown(t),t=Array.isArray(t)?t[0]:t,setState(this.component,"_value",t,{beforePatch:this.beforePatchListValue}),this.setFormAssociatedValue(this.component._value)}componentWillLoad(t){super.componentWillLoad(),this.onStateChange=()=>{if("function"==typeof t){const e=setTimeout((()=>{clearTimeout(e),t(STATE_CHANGE_EVENT)}))}},this.validateOrientation(this.component._orientation),this.validateList(this.component._list),this.validateValue(this.component._value)}}export{InputCheckboxRadioController as I,InputRadioController as a,fillKeyOptionMap as f};

package/dist/components/controller3.js

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{b as watchValidator,G as watchJsonArrayString}from"./prop.validators.js";import{I as InputPasswordController}from"./controller4.js";class InputTextEmailController extends InputPasswordController{constructor(t,o,r){super(t,o,r),this.component=t}validateList(t){watchJsonArrayString(this.component,"_list",(t=>"string"==typeof t),t)}componentWillLoad(){super.componentWillLoad(),this.validateList(this.component._list)}}class InputTextController extends InputTextEmailController{constructor(t,o,r){super(t,o,r),this.hasError=!1,this.hasList=!1,this.component=t}validateType(t){watchValidator(this.component,"_type",(t=>"string"==typeof t&&("text"===t||"search"===t||"url"===t||"tel"===t)),new Set(["String {text, search, url, tel}"]),t)}componentWillLoad(){super.componentWillLoad(),this.validateType(this.component._type)}}export{InputTextEmailController as I,InputTextController as a};
+import{a as watchValidator,G as watchJsonArrayString}from"./prop.validators.js";import{I as InputPasswordController}from"./controller4.js";class InputTextEmailController extends InputPasswordController{constructor(t,o,r){super(t,o,r),this.component=t}validateList(t){watchJsonArrayString(this.component,"_list",(t=>"string"==typeof t),t)}componentWillLoad(){super.componentWillLoad(),this.validateList(this.component._list)}}class InputTextController extends InputTextEmailController{constructor(t,o,r){super(t,o,r),this.hasError=!1,this.hasList=!1,this.component=t}validateType(t){watchValidator(this.component,"_type",(t=>"string"==typeof t&&("text"===t||"search"===t||"url"===t||"tel"===t)),new Set(["String {text, search, url, tel}"]),t)}componentWillLoad(){super.componentWillLoad(),this.validateType(this.component._type)}}export{InputTextEmailController as I,InputTextController as a};