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

package/dist/components/kol-link-group.js

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{proxyCustomElement,HTMLElement,h}from"@stencil/core/internal/client";import{v as validateLabel}from"./label.js";import{w as watchValidator}from"./prop.validators.js";import{r as removeNavLabel,a as addNavLabel}from"./unique-nav-labels.js";import{w as watchNavLinks}from"./validation.js";import{d as defineCustomElement$6}from"./component.js";import{d as defineCustomElement$5}from"./shadow2.js";import{d as defineCustomElement$4}from"./component9.js";import{d as defineCustomElement$3}from"./component2.js";import{d as defineCustomElement$2}from"./component3.js";const defaultStyleCss=":host{--a11y-min-size:44px;font-size:inherit}*{font-family:Verdana;hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}ul{list-style:none;margin:0;padding:0}nav.horizontal ul{display:flex;flex-wrap:wrap}nav.horizontal li{margin-left:1.25rem;margin-right:0.25rem}nav.horizontal li:first-child{margin-left:0}nav.horizontal li:last-child{margin-right:0}nav.vertical li{margin-left:1.75rem;margin-right:0.5rem}li.list-none{list-style-type:none !important;margin-left:0}",ListItem=t=>{const e=[];return t.links.map(((i,a)=>{e.push(h("li",{key:a,class:{ident:a>0&&"vertical"===t.orientation,"list-none":0===a&&"horizontal"===t.orientation},style:{listStyleType:t.listStyleType}},h("kol-link",Object.assign({},i))))})),e},KolLinkGroup$1=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.__attachShadow(),this.isUl=!0,this._listStyleType=void 0,this._label=void 0,this._links=void 0,this._orientation="vertical",this.state={_label:"…",_listStyleType:"disc",_links:[],_orientation:"vertical"}}render(){return h("nav",{"aria-label":this.state._label,class:{vertical:"vertical"===this.state._orientation,horizontal:"horizontal"===this.state._orientation}},!1===this.isUl?h("ol",null,h(ListItem,{links:this.state._links,orientation:this.state._orientation,listStyleType:this.state._listStyleType})):h("ul",null,h(ListItem,{links:this.state._links,orientation:this.state._orientation,listStyleType:this.state._listStyleType})))}validateLabel(t,e,i=!1){i||removeNavLabel(this.state._label),validateLabel(this,t),addNavLabel(this.state._label)}validateListStyleType(t){watchValidator(this,"_listStyleType",(t=>{switch(t){case"disc":case"circle":case"square":case"none":return this.isUl=!0,!0;case"decimal":case"decimal-leading-zero":case"lower-alpha":case"lower-latin":case"lower-greek":case"lower-roman":case"upper-alpha":case"upper-latin":case"upper-roman":return this.isUl=!1,!0;default:return!1}}),new Set(["https://www.w3schools.com/tags/tag_ol.asp"]),t)}validateLinks(t){watchNavLinks("KolLinkGroup",this,t)}validateOrientation(t){watchValidator(this,"_orientation",(t=>"horizontal"===t||"vertical"===t),new Set(["Orientation {horizontal, vertical}"]),t,{defaultValue:"vertical"})}componentWillLoad(){this.validateLabel(this._label,void 0,!0),this.validateListStyleType(this._listStyleType),this.validateLinks(this._links),this.validateOrientation(this._orientation)}disconnectedCallback(){removeNavLabel(this.state._label)}static get watchers(){return{_label:["validateLabel"],_listStyleType:["validateListStyleType"],_links:["validateLinks"],_orientation:["validateOrientation"]}}static get style(){return{default:defaultStyleCss}}},[33,"kol-link-group",{_listStyleType:[1,"_list-style-type"],_label:[1],_links:[1],_orientation:[1],state:[32]},void 0,{_label:["validateLabel"],_listStyleType:["validateListStyleType"],_links:["validateLinks"],_orientation:["validateOrientation"]}]);function defineCustomElement$1(){if("undefined"==typeof customElements)return;["kol-link-group","kol-icon","kol-link","kol-link-wc","kol-span-wc","kol-tooltip-wc"].forEach((t=>{switch(t){case"kol-link-group":customElements.get(t)||customElements.define(t,KolLinkGroup$1);break;case"kol-icon":customElements.get(t)||defineCustomElement$6();break;case"kol-link":customElements.get(t)||defineCustomElement$5();break;case"kol-link-wc":customElements.get(t)||defineCustomElement$4();break;case"kol-span-wc":customElements.get(t)||defineCustomElement$3();break;case"kol-tooltip-wc":customElements.get(t)||defineCustomElement$2()}}))}const KolLinkGroup=KolLinkGroup$1,defineCustomElement=defineCustomElement$1;export{KolLinkGroup,defineCustomElement};
+import{proxyCustomElement,HTMLElement,h}from"@stencil/core/internal/client";import{v as validateLabel}from"./label.js";import{w as watchValidator}from"./prop.validators.js";import{r as removeNavLabel,a as addNavLabel}from"./unique-nav-labels.js";import{w as watchNavLinks}from"./validation.js";import{d as defineCustomElement$6}from"./component.js";import{d as defineCustomElement$5}from"./shadow2.js";import{d as defineCustomElement$4}from"./component9.js";import{d as defineCustomElement$3}from"./component2.js";import{d as defineCustomElement$2}from"./component3.js";const defaultStyleCss="/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n\t:host {\n\t\t/*\n\t\t * Minimum size of interactive elements.\n\t\t */\n\t\t--a11y-min-size: 44px;\n\t\t/*\n\t\t * Verdana is an accessible font that can be used without requiring additional loading time.\n\t\t */\n\t\tfont-family: Verdana;\n\t}\n\n\t* {\n\t\t/*\n\t\t * This rule enables the word dividing for all texts. That is important for high zoom levels.\n\t\t */\n\t\thyphens: auto;\n\t\t/*\n\t\t * Letter spacing is required for all texts.\n\t\t */\n\t\tletter-spacing: inherit;\n\t\t/*\n\t\t * This rule enables the word dividing for all texts. That is important for high zoom levels.\n\t\t */\n\t\tword-break: break-word;\n\t\t/*\n\t\t * Word spacing is required for all texts.\n\t\t */\n\t\tword-spacing: inherit;\n\t}\n\n\t/*\n\t * All interactive elements should have a minimum size of 44px.\n\t */\n\t/* input:not([type='checkbox'], [type='radio'], [type='range']), */\n\t/* option, */\n\t/* select, */\n\t/* textarea, */\n\t[role='button'],\n\tbutton:not([role='link']),\n\tkol-input .input {\n\t\tmin-height: var(--a11y-min-size);\n\t\tmin-width: var(--a11y-min-size);\n\t}\n\n\t/*\n\t * Some interactive elements should not inherit the font-family and font-size.\n\t */\n\ta,\n\tbutton,\n\th1,\n\th2,\n\th3,\n\th4,\n\th5,\n\th6,\n\tinput,\n\toption,\n\tselect,\n\ttextarea {\n\t\t/*\n\t\t * All elements should inherit the font family from his parent element.\n\t\t */\n\t\tfont-family: inherit;\n\t\t/*\n\t\t * All elements should inherit the font size from his parent element.\n\t\t */\n\t\tfont-size: inherit;\n\t}\n}\n\n@layer kol-global {\n\t/*\n\t * Dieses CSS stellt sicher, dass der Standard-Style\n\t * von A und Button resettet werden.\n\t */\n\t:is(a, button) {\n\t\tbackground-color: transparent;\n\t\tborder: none;\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t\twidth: 100%; /* 100% needed for custom width from outside */\n\t}\n}\n\n@layer kol-global {\n\t:host {\n\t\t/*\n\t\t * The max-width is needed to prevent the table from overflowing the\n\t\t * parent node, if the table is wider than the parent node.\n\t\t */\n\t\tmax-width: 100%;\n\t}\n\n\t* {\n\t\t/*\n\t\t * We prefer to box-sizing: border-box for all elements.\n\t\t */\n\t\tbox-sizing: border-box;\n\t}\n\n\t/* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n\tkol-span-wc {\n\t\tdisplay: grid;\n\t\tplace-items: center;\n\t}\n\n\t/* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n\tkol-span-wc > span {\n\t\tdisplay: flex;\n\t\tplace-items: center;\n\t}\n\n\ta,\n\tbutton {\n\t\tcursor: pointer;\n\t}\n\n\t/* This is the text label. */\n\t.icon-only > kol-span-wc > span > span {\n\t\tdisplay: none;\n\t}\n}\n\n@layer kol-component {\n\tul {\n\t\tlist-style: none;\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t}\n\n\tnav.horizontal ul {\n\t\tdisplay: flex;\n\t\tflex-wrap: wrap;\n\t}\n\n\tnav.horizontal li {\n\t\tmargin-left: 1.25rem;\n\t\tmargin-right: 0.25rem;\n\t}\n\n\tnav.horizontal li:first-child {\n\t\tmargin-left: 0;\n\t}\n\n\tnav.horizontal li:last-child {\n\t\tmargin-right: 0;\n\t}\n\n\tnav.vertical li {\n\t\tmargin-left: 1.75rem;\n\t\tmargin-right: 0.5rem;\n\t}\n\n\tli.list-none {\n\t\tlist-style-type: none !important;\n\t\tmargin-left: 0;\n\t}\n}\n",ListItem=t=>{const e=[];return t.links.map(((n,i)=>{e.push(h("li",{key:i,class:{ident:i>0&&"vertical"===t.orientation,"list-none":0===i&&"horizontal"===t.orientation},style:{listStyleType:t.listStyleType}},h("kol-link",Object.assign({},n))))})),e},KolLinkGroup$1=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.__attachShadow(),this.isUl=!0,this._listStyleType=void 0,this._label=void 0,this._links=void 0,this._orientation="vertical",this.state={_label:"…",_listStyleType:"disc",_links:[],_orientation:"vertical"}}render(){return h("nav",{"aria-label":this.state._label,class:{vertical:"vertical"===this.state._orientation,horizontal:"horizontal"===this.state._orientation}},!1===this.isUl?h("ol",null,h(ListItem,{links:this.state._links,orientation:this.state._orientation,listStyleType:this.state._listStyleType})):h("ul",null,h(ListItem,{links:this.state._links,orientation:this.state._orientation,listStyleType:this.state._listStyleType})))}validateLabel(t,e,n=!1){n||removeNavLabel(this.state._label),validateLabel(this,t),addNavLabel(this.state._label)}validateListStyleType(t){watchValidator(this,"_listStyleType",(t=>{switch(t){case"disc":case"circle":case"square":case"none":return this.isUl=!0,!0;case"decimal":case"decimal-leading-zero":case"lower-alpha":case"lower-latin":case"lower-greek":case"lower-roman":case"upper-alpha":case"upper-latin":case"upper-roman":return this.isUl=!1,!0;default:return!1}}),new Set(["https://www.w3schools.com/tags/tag_ol.asp"]),t)}validateLinks(t){watchNavLinks("KolLinkGroup",this,t)}validateOrientation(t){watchValidator(this,"_orientation",(t=>"horizontal"===t||"vertical"===t),new Set(["Orientation {horizontal, vertical}"]),t,{defaultValue:"vertical"})}componentWillLoad(){this.validateLabel(this._label,void 0,!0),this.validateListStyleType(this._listStyleType),this.validateLinks(this._links),this.validateOrientation(this._orientation)}disconnectedCallback(){removeNavLabel(this.state._label)}static get watchers(){return{_label:["validateLabel"],_listStyleType:["validateListStyleType"],_links:["validateLinks"],_orientation:["validateOrientation"]}}static get style(){return{default:defaultStyleCss}}},[33,"kol-link-group",{_listStyleType:[1,"_list-style-type"],_label:[1],_links:[1],_orientation:[1],state:[32]},void 0,{_label:["validateLabel"],_listStyleType:["validateListStyleType"],_links:["validateLinks"],_orientation:["validateOrientation"]}]);function defineCustomElement$1(){if("undefined"==typeof customElements)return;["kol-link-group","kol-icon","kol-link","kol-link-wc","kol-span-wc","kol-tooltip-wc"].forEach((t=>{switch(t){case"kol-link-group":customElements.get(t)||customElements.define(t,KolLinkGroup$1);break;case"kol-icon":customElements.get(t)||defineCustomElement$6();break;case"kol-link":customElements.get(t)||defineCustomElement$5();break;case"kol-link-wc":customElements.get(t)||defineCustomElement$4();break;case"kol-span-wc":customElements.get(t)||defineCustomElement$3();break;case"kol-tooltip-wc":customElements.get(t)||defineCustomElement$2()}}))}const KolLinkGroup=KolLinkGroup$1,defineCustomElement=defineCustomElement$1;export{KolLinkGroup,defineCustomElement};

package/dist/components/kol-link-group.js.map

@@ -1 +1 @@
-{"file":"kol-link-group.js","mappings":"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","names":["KolLinkGroup"],"sources":["src/components/link-group/style.css?tag=kol-link-group&mode=default&encapsulation=shadow","src/components/link-group/component.tsx"],"sourcesContent":["@import url(../style.css);\nul {\n\tlist-style: none;\n\tmargin: 0;\n\tpadding: 0;\n}\nnav.horizontal ul {\n\tdisplay: flex;\n\tflex-wrap: wrap;\n}\nnav.horizontal li {\n\tmargin-left: 1.25rem;\n\tmargin-right: 0.25rem;\n}\nnav.horizontal li:first-child {\n\tmargin-left: 0;\n}\nnav.horizontal li:last-child {\n\tmargin-right: 0;\n}\nnav.vertical li {\n\tmargin-left: 1.75rem;\n\tmargin-right: 0.5rem;\n}\nli.list-none {\n\tlist-style-type: none !important;\n\tmargin-left: 0;\n}\n","import { Component, h, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Stringified } from '../../types/common';\nimport { Orientation } from '../../types/orientation';\nimport { LabelPropType, validateLabel } from '../../types/props/label';\nimport { watchValidator } from '../../utils/prop.validators';\nimport { addNavLabel, removeNavLabel } from '../../utils/unique-nav-labels';\nimport { LinkProps } from '../link/types';\nimport { watchNavLinks } from '../nav/validation';\nimport { API, ListStyleType, States } from './types';\n\nconst ListItem = (props: { links: LinkProps[]; orientation: Orientation; listStyleType: ListStyleType }): JSX.Element => {\n\tconst list: JSX.Element[] = [];\n\tprops.links.map((link, index: number) => {\n\t\tlist.push(\n\t\t\t(\n\t\t\t\t<li\n\t\t\t\t\tkey={index}\n\t\t\t\t\tclass={{\n\t\t\t\t\t\tident: index > 0 && props.orientation === 'vertical',\n\t\t\t\t\t\t'list-none': index === 0 && props.orientation === 'horizontal',\n\t\t\t\t\t}}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tlistStyleType: props.listStyleType,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<kol-link {...link}></kol-link>\n\t\t\t\t</li>\n\t\t\t) as JSX.Element\n\t\t);\n\t});\n\treturn list;\n};\n\n@Component({\n\ttag: 'kol-link-group',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolLinkGroup implements API {\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<nav\n\t\t\t\taria-label={this.state._label}\n\t\t\t\tclass={{\n\t\t\t\t\tvertical: this.state._orientation === 'vertical',\n\t\t\t\t\thorizontal: this.state._orientation === 'horizontal',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{this.isUl === false ? (\n\t\t\t\t\t<ol>\n\t\t\t\t\t\t<ListItem links={this.state._links} orientation={this.state._orientation} listStyleType={this.state._listStyleType} />\n\t\t\t\t\t</ol>\n\t\t\t\t) : (\n\t\t\t\t\t<ul>\n\t\t\t\t\t\t<ListItem links={this.state._links} orientation={this.state._orientation} listStyleType={this.state._listStyleType} />\n\t\t\t\t\t</ul>\n\t\t\t\t)}\n\t\t\t</nav>\n\t\t);\n\t}\n\n\tprivate isUl = true;\n\n\t/**\n\t * Gibt den List-Style-Typen für ungeordnete Listen aus. Wird bei horizontalen LinkGroups als Trenner verwendet\n\t */\n\t@Prop() public _listStyleType?: ListStyleType;\n\n\t/**\n\t * Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.).\n\t */\n\t@Prop() public _label!: LabelPropType;\n\n\t/**\n\t * Defines the list of links to render.\n\t */\n\t@Prop() public _links!: Stringified<LinkProps[]>;\n\n\t/**\n\t * Defines whether the orientation of the component is horizontal or vertical.\n\t */\n\t@Prop() public _orientation?: Orientation = 'vertical';\n\n\t@State() public state: States = {\n\t\t_label: '…', // ⚠ required\n\t\t_listStyleType: 'disc',\n\t\t_links: [],\n\t\t_orientation: 'vertical',\n\t};\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: LabelPropType, _oldValue?: LabelPropType, initial = false): void {\n\t\tif (!initial) {\n\t\t\tremoveNavLabel(this.state._label); // remove the current\n\t\t}\n\t\tvalidateLabel(this, value);\n\t\taddNavLabel(this.state._label); // add the state instead of prop, because the prop could be invalid and not set as new label\n\t}\n\n\t@Watch('_listStyleType')\n\tpublic validateListStyleType(value?: ListStyleType): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_listStyleType',\n\t\t\t(value) => {\n\t\t\t\tswitch (value) {\n\t\t\t\t\tcase 'disc':\n\t\t\t\t\tcase 'circle':\n\t\t\t\t\tcase 'square':\n\t\t\t\t\tcase 'none':\n\t\t\t\t\t\tthis.isUl = true;\n\t\t\t\t\t\treturn true;\n\t\t\t\t\tcase 'decimal':\n\t\t\t\t\tcase 'decimal-leading-zero':\n\t\t\t\t\tcase 'lower-alpha':\n\t\t\t\t\tcase 'lower-latin':\n\t\t\t\t\tcase 'lower-greek':\n\t\t\t\t\tcase 'lower-roman':\n\t\t\t\t\tcase 'upper-alpha':\n\t\t\t\t\tcase 'upper-latin':\n\t\t\t\t\tcase 'upper-roman':\n\t\t\t\t\t\tthis.isUl = false;\n\t\t\t\t\t\treturn true;\n\t\t\t\t\tdefault:\n\t\t\t\t\t\treturn false;\n\t\t\t\t}\n\t\t\t},\n\t\t\tnew Set(['https://www.w3schools.com/tags/tag_ol.asp']),\n\t\t\tvalue\n\t\t);\n\t}\n\n\t@Watch('_links')\n\tpublic validateLinks(value?: Stringified<LinkProps[]>): void {\n\t\twatchNavLinks('KolLinkGroup', this, value);\n\t}\n\n\t@Watch('_orientation')\n\tpublic validateOrientation(value?: Orientation): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_orientation',\n\t\t\t(value): boolean => value === 'horizontal' || value === 'vertical',\n\t\t\tnew Set(['Orientation {horizontal, vertical}']),\n\t\t\tvalue,\n\t\t\t{\n\t\t\t\tdefaultValue: 'vertical',\n\t\t\t}\n\t\t);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateLabel(this._label, undefined, true);\n\t\tthis.validateListStyleType(this._listStyleType);\n\t\tthis.validateLinks(this._links);\n\t\tthis.validateOrientation(this._orientation);\n\t}\n\n\tpublic disconnectedCallback(): void {\n\t\tremoveNavLabel(this.state._label);\n\t}\n}\n\n// console.log(\n//   stringifyJson([\n//     { _label: 'Fehler 1', _id: '#anschrift_anschrift_adresse_strasse', _icons: 'error' },\n//     { _label: 'Fehler 2', _id: '#anschrift_anschrift_adresse_hausnummer', _icons: 'error' },\n//   ])\n// );\n"],"version":3}
+{"file":"kol-link-group.js","mappings":"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","names":["KolLinkGroup"],"sources":["src/components/link-group/style.css?tag=kol-link-group&mode=default&encapsulation=shadow","src/components/link-group/component.tsx"],"sourcesContent":["@import url(../style.css);\n@layer kol-component {\n\tul {\n\t\tlist-style: none;\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t}\n\n\tnav.horizontal ul {\n\t\tdisplay: flex;\n\t\tflex-wrap: wrap;\n\t}\n\n\tnav.horizontal li {\n\t\tmargin-left: 1.25rem;\n\t\tmargin-right: 0.25rem;\n\t}\n\n\tnav.horizontal li:first-child {\n\t\tmargin-left: 0;\n\t}\n\n\tnav.horizontal li:last-child {\n\t\tmargin-right: 0;\n\t}\n\n\tnav.vertical li {\n\t\tmargin-left: 1.75rem;\n\t\tmargin-right: 0.5rem;\n\t}\n\n\tli.list-none {\n\t\tlist-style-type: none !important;\n\t\tmargin-left: 0;\n\t}\n}\n","import { Component, h, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Stringified } from '../../types/common';\nimport { Orientation } from '../../types/orientation';\nimport { LabelPropType, validateLabel } from '../../types/props/label';\nimport { watchValidator } from '../../utils/prop.validators';\nimport { addNavLabel, removeNavLabel } from '../../utils/unique-nav-labels';\nimport { LinkProps } from '../link/types';\nimport { watchNavLinks } from '../nav/validation';\nimport { API, ListStyleType, States } from './types';\n\nconst ListItem = (props: { links: LinkProps[]; orientation: Orientation; listStyleType: ListStyleType }): JSX.Element => {\n\tconst list: JSX.Element[] = [];\n\tprops.links.map((link, index: number) => {\n\t\tlist.push(\n\t\t\t(\n\t\t\t\t<li\n\t\t\t\t\tkey={index}\n\t\t\t\t\tclass={{\n\t\t\t\t\t\tident: index > 0 && props.orientation === 'vertical',\n\t\t\t\t\t\t'list-none': index === 0 && props.orientation === 'horizontal',\n\t\t\t\t\t}}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tlistStyleType: props.listStyleType,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<kol-link {...link}></kol-link>\n\t\t\t\t</li>\n\t\t\t) as JSX.Element\n\t\t);\n\t});\n\treturn list;\n};\n\n@Component({\n\ttag: 'kol-link-group',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolLinkGroup implements API {\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<nav\n\t\t\t\taria-label={this.state._label}\n\t\t\t\tclass={{\n\t\t\t\t\tvertical: this.state._orientation === 'vertical',\n\t\t\t\t\thorizontal: this.state._orientation === 'horizontal',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{this.isUl === false ? (\n\t\t\t\t\t<ol>\n\t\t\t\t\t\t<ListItem links={this.state._links} orientation={this.state._orientation} listStyleType={this.state._listStyleType} />\n\t\t\t\t\t</ol>\n\t\t\t\t) : (\n\t\t\t\t\t<ul>\n\t\t\t\t\t\t<ListItem links={this.state._links} orientation={this.state._orientation} listStyleType={this.state._listStyleType} />\n\t\t\t\t\t</ul>\n\t\t\t\t)}\n\t\t\t</nav>\n\t\t);\n\t}\n\n\tprivate isUl = true;\n\n\t/**\n\t * Gibt den List-Style-Typen für ungeordnete Listen aus. Wird bei horizontalen LinkGroups als Trenner verwendet\n\t */\n\t@Prop() public _listStyleType?: ListStyleType;\n\n\t/**\n\t * Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.).\n\t */\n\t@Prop() public _label!: LabelPropType;\n\n\t/**\n\t * Defines the list of links to render.\n\t */\n\t@Prop() public _links!: Stringified<LinkProps[]>;\n\n\t/**\n\t * Defines whether the orientation of the component is horizontal or vertical.\n\t */\n\t@Prop() public _orientation?: Orientation = 'vertical';\n\n\t@State() public state: States = {\n\t\t_label: '…', // ⚠ required\n\t\t_listStyleType: 'disc',\n\t\t_links: [],\n\t\t_orientation: 'vertical',\n\t};\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: LabelPropType, _oldValue?: LabelPropType, initial = false): void {\n\t\tif (!initial) {\n\t\t\tremoveNavLabel(this.state._label); // remove the current\n\t\t}\n\t\tvalidateLabel(this, value);\n\t\taddNavLabel(this.state._label); // add the state instead of prop, because the prop could be invalid and not set as new label\n\t}\n\n\t@Watch('_listStyleType')\n\tpublic validateListStyleType(value?: ListStyleType): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_listStyleType',\n\t\t\t(value) => {\n\t\t\t\tswitch (value) {\n\t\t\t\t\tcase 'disc':\n\t\t\t\t\tcase 'circle':\n\t\t\t\t\tcase 'square':\n\t\t\t\t\tcase 'none':\n\t\t\t\t\t\tthis.isUl = true;\n\t\t\t\t\t\treturn true;\n\t\t\t\t\tcase 'decimal':\n\t\t\t\t\tcase 'decimal-leading-zero':\n\t\t\t\t\tcase 'lower-alpha':\n\t\t\t\t\tcase 'lower-latin':\n\t\t\t\t\tcase 'lower-greek':\n\t\t\t\t\tcase 'lower-roman':\n\t\t\t\t\tcase 'upper-alpha':\n\t\t\t\t\tcase 'upper-latin':\n\t\t\t\t\tcase 'upper-roman':\n\t\t\t\t\t\tthis.isUl = false;\n\t\t\t\t\t\treturn true;\n\t\t\t\t\tdefault:\n\t\t\t\t\t\treturn false;\n\t\t\t\t}\n\t\t\t},\n\t\t\tnew Set(['https://www.w3schools.com/tags/tag_ol.asp']),\n\t\t\tvalue\n\t\t);\n\t}\n\n\t@Watch('_links')\n\tpublic validateLinks(value?: Stringified<LinkProps[]>): void {\n\t\twatchNavLinks('KolLinkGroup', this, value);\n\t}\n\n\t@Watch('_orientation')\n\tpublic validateOrientation(value?: Orientation): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_orientation',\n\t\t\t(value): boolean => value === 'horizontal' || value === 'vertical',\n\t\t\tnew Set(['Orientation {horizontal, vertical}']),\n\t\t\tvalue,\n\t\t\t{\n\t\t\t\tdefaultValue: 'vertical',\n\t\t\t}\n\t\t);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateLabel(this._label, undefined, true);\n\t\tthis.validateListStyleType(this._listStyleType);\n\t\tthis.validateLinks(this._links);\n\t\tthis.validateOrientation(this._orientation);\n\t}\n\n\tpublic disconnectedCallback(): void {\n\t\tremoveNavLabel(this.state._label);\n\t}\n}\n\n// console.log(\n//   stringifyJson([\n//     { _label: 'Fehler 1', _id: '#anschrift_anschrift_adresse_strasse', _icons: 'error' },\n//     { _label: 'Fehler 2', _id: '#anschrift_anschrift_adresse_hausnummer', _icons: 'error' },\n//   ])\n// );\n"],"version":3}

package/dist/components/kol-logo.js

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{proxyCustomElement,HTMLElement,h}from"@stencil/core/internal/client";import{d as Bundesanstalt,B as Bundesministerium,b as Bundesamt,f as BUND_LOGO_TEXT_MAP}from"./bund.js";import{a as translate}from"./i18n.js";import{t as setState,d as devHint}from"./prop.validators.js";const defaultStyleCss=":host{--a11y-min-size:44px;font-size:inherit}*{font-family:Verdana;hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}:host{display:inline-block}text{font-size:16px;letter-spacing:normal;word-spacing:normal}svg{max-height:100%}";function enumToArray(c,t=new Map){return Object.entries(c).map((([c,n])=>{t.set(n,c)})),t}const ENUM_AS_MAP=enumToArray(Bundesamt,enumToArray(Bundesanstalt,enumToArray(Bundesministerium)));function getAriaLabel(c){return ENUM_AS_MAP.has(c)?ENUM_AS_MAP.get(c):""}const Adler=()=>h("path",{d:"M21.72,12.77c0.04-0.33,0.06-0.67,0.06-1c0-0.2,0-0.43,0-0.69c3.06,0,5.74-2.25,5.74-4.78\nc-0.09-1.07-0.56-2.08-1.32-2.84l0.32-0.07c1,0.89,1.61,2.14,1.7,3.48c0,3-3,5.85-6.5,5.92 M18.64,2.21\nc-0.05-0.33-0.19-0.64-0.39-0.91c0-0.31,0.14-0.61,0.64-0.36c-0.27,0.27-0.06,0.76-0.06,0.76s0.55-0.26,0.44-0.62\nC20.09,1.28,19.5,2.38,18.64,2.21 M17.93,3.77c-0.12-0.47-0.34-0.9-0.64-1.27c-0.3-0.42-0.77-0.69-1.29-0.73\nc-0.34,0.03-0.68,0.12-1,0.25c-0.16-0.28-0.27-0.58-0.32-0.9c0-0.22,0.38-0.44,1.1-0.44c1.58,0,2.52,0.71,2.52,1.91\nC18.26,3.01,18.14,3.41,17.93,3.77 M22,24.16c0.13,0,0.26,0.02,0.38,0.07c0.64,1.3,1.4,2.53,2.29,3.68l0,0l0,0\nc0.81-0.14,1.63-0.22,2.45-0.24l0,0c0.1-0.01,0.2,0.01,0.28,0.07c0.07,0.09,0.1,0.2,0.09,0.31c-0.01,0.28-0.08,0.55-0.21,0.79\nc-0.46-0.4-1.07-0.59-1.68-0.51c-0.24,0.01-0.48,0.05-0.71,0.12h-0.07h-0.07l0.48,0.49c0.77,0.83,1.44,1.43,1.44,1.83\nc-0.04,0.31-0.22,0.58-0.48,0.74c-0.22-0.98-0.8-1.84-1.62-2.42h-0.06v0.27c0,0.19,0,0.47,0,0.77c0,1.49-0.15,1.72-0.67,1.72\nc-0.09,0.01-0.19,0.01-0.28,0c0.33-0.49,0.48-1.08,0.41-1.67v-0.7c0-0.27,0.03-0.53,0.06-0.8v-0.11h-0.08\nc-0.33-0.05-0.67-0.09-1-0.1c-0.57-0.07-1.14,0.07-1.6,0.41c-0.24-0.18-0.41-0.44-0.48-0.73c0-0.32,0.19-0.34,0.45-0.34\nc0.14-0.01,0.27-0.01,0.41,0c0.59,0.09,1.18,0.13,1.78,0.12h0.06v-0.06c-0.5-1.13-1.18-2.17-2-3.09c0.1-0.35,0.2-0.59,0.54-0.59\nM12.64,27.87v0.06h0.06c0.55-0.01,1.1-0.06,1.64-0.16c0.14-0.01,0.27-0.01,0.41,0c0.26,0,0.45,0,0.45,0.34\nc-0.07,0.29-0.24,0.55-0.48,0.73c-0.46-0.34-1.03-0.49-1.6-0.41c-0.33,0.01-0.67,0.05-1,0.1H12v0.11\nc0.03,0.27,0.06,0.53,0.06,0.8v0.7c-0.05,0.58,0.1,1.15,0.42,1.63c-0.09,0.01-0.19,0.01-0.28,0c-0.52,0-0.67-0.23-0.67-1.72\nc0-0.3,0-0.58,0-0.77V29l-0.06,0.05c-0.82,0.58-1.39,1.44-1.61,2.42c-0.28-0.14-0.47-0.4-0.53-0.7c0-0.43,0.65-1.07,1.39-1.81\nl0.43-0.43v-0.06h-0.14c-0.23-0.07-0.47-0.11-0.71-0.12c-0.61-0.08-1.22,0.11-1.68,0.51c-0.13-0.24-0.2-0.51-0.21-0.79\nc0.01-0.11,0.06-0.22,0.14-0.3c0.08-0.06,0.18-0.08,0.28-0.07l0,0c0.82,0.02,1.64,0.1,2.45,0.24l0,0l0,0\nc0.88-1.15,1.64-2.38,2.28-3.68c0.12-0.05,0.25-0.07,0.38-0.07c0.35,0,0.44,0.24,0.54,0.59c-0.82,0.92-1.5,1.96-2,3.09\nM7.78,6.87c0.08-1.36,0.7-2.62,1.72-3.52l0.32,0.07C9.06,4.19,8.6,5.19,8.51,6.26c0,2.56,2.73,4.78,5.82,4.78\nc0,0.22,0,0.45,0,0.69c-0.01,0.35,0,0.69,0.03,1.04c-3.5,0-6.58-2.86-6.58-5.92 M31.25,12.23c1.57,2.49,2.8,2.45,4.66,2.45\nc-1.19-0.97-2.21-2.14-3-3.46L30,6.65c-0.29-1.44-1.03-2.75-2.12-3.73c0.31-0.1,0.6-0.24,0.87-0.42c-1.88,0-3.73-1-4.75-1\nc-0.55-0.05-1.03,0.36-1.08,0.91c0,0.58,0.63,1.16,1.73,1.16c0.31,0,0.62-0.04,0.92-0.09c0.65,0.74,1.03,1.67,1.08,2.65\nc0,2-2.41,3.58-4.83,3.58h-0.41c-0.5-0.67-0.84-1.45-1-2.28c0-1.6,1.05-2.9,1.05-4.48c0-0.68-0.24-1.33-0.67-1.85\nc0.29-0.23,0.53-0.52,0.7-0.85c-0.22,0.08-0.45,0.11-0.68,0.09c-1.16,0-2.11-0.3-3-0.3c-0.53,0-0.67,0.16-0.67,0.31\nc-0.01,0.05-0.01,0.1,0,0.15c-0.19-0.08-0.39-0.13-0.59-0.17c-0.29-0.05-0.58-0.08-0.88-0.08c-1.13,0-1.52,0.47-1.52,0.87\nc0.07,0.52,0.27,1.01,0.57,1.44c0.4-0.2,0.84-0.31,1.28-0.34c0.6,0,1.13,0.57,1.41,1.24c-0.29,0.05-0.59,0.07-0.88,0.07\nc-0.68-0.03-1.36-0.16-2-0.39l0,0c0,0,0.31,0.56,0.92,0.78c0.72,0.22,1.46,0.37,2.21,0.45c-0.08,0.21-0.23,0.38-0.43,0.49\nc-0.05,0.02-0.09,0.02-0.14,0c-0.74-0.14-1.45-0.35-2.14-0.65H14.9c0,0.42,1.09,1.35,2.07,1.71c-1.06,1.1-1.87,2.41-2.39,3.85\nh-0.41c-2.42,0-4.82-1.57-4.82-3.58c0.05-0.98,0.43-1.91,1.07-2.65c0.3,0.05,0.61,0.09,0.92,0.09c1.1,0,1.69-0.58,1.74-1.16\nc-0.04-0.55-0.52-0.96-1.07-0.92c0,0,0,0-0.01,0c-1,0-2.88,1-4.76,1C7.51,2.73,7.8,2.87,8.11,2.97C7.03,3.94,6.29,5.23,6,6.65\nl-2.87,4.59c-0.79,1.32-1.81,2.49-3,3.46c1.86,0,3.09,0,4.66-2.45L6.26,9.9c0.11,0.31,0.24,0.61,0.4,0.9l-2.97,4.67\nc-0.79,1.32-1.8,2.49-3,3.46c1.85,0,3.08,0,4.65-2.44l2.52-4c0.19,0.2,0.39,0.4,0.6,0.58l-3.59,5.7c-0.79,1.32-1.8,2.49-3,3.45\nc1.85,0,3.08,0.05,4.65-2.44L10,14.2c0.22,0.14,0.46,0.28,0.7,0.41l-4.27,6.77c-0.79,1.31-1.81,2.48-3,3.45\nc1.85,0,3.08,0,4.65-2.44l4.36-7c0.25,0.1,0.51,0.2,0.78,0.28l-4.95,7.9c-0.79,1.31-1.81,2.48-3,3.45c1.85,0,3.08,0.05,4.65-2.43\nl5.24-8.39h0.16c0.14,0.42,0.22,0.86,0.24,1.3c0,2.64-1.73,5-3.8,6.76c0.19,0.06,0.38,0.09,0.58,0.08c0.3,0.01,0.6-0.01,0.9-0.05\nc-0.57,1.13-1.24,2.21-2,3.23c-0.77-0.13-1.54-0.2-2.32-0.22c-0.67,0-0.75,0.4-0.75,0.75c-0.01,0.53,0.22,1.03,0.62,1.38\nc0.13-0.31,0.38-0.73,1.63-0.73h0.13C10.11,29.13,9,30.06,9,30.77c0.06,0.66,0.59,1.18,1.25,1.24c-0.02-0.14-0.02-0.28,0-0.42\nc0.13-0.69,0.48-1.33,1-1.8c-0.01,0.1-0.01,0.2,0,0.3c0,1.43,0.13,2.08,1,2.08c0.31-0.01,0.61-0.12,0.86-0.31\nc-0.5-0.44-0.73-1.11-0.62-1.77c0-0.21,0-0.41,0-0.69c0.02-0.2,0.02-0.41,0-0.61c0.24-0.02,0.47-0.02,0.71,0\nc0,0,1.29-0.1,1.6,0.57c0.35-0.32,0.86-0.78,0.86-1.27c0-0.33-0.16-0.71-0.83-0.71c-0.25,0-1,0.16-1.7,0.16\nc0.48-0.84,1.04-1.64,1.66-2.39c0.1,0.39,0.31,0.74,0.62,1c0.12-1.17,0.54-2.28,1.21-3.24c0.16,0.93,0.24,1.87,0.23,2.82\nc0,3.55-0.85,6.17-2.66,6.67c0.26,0.46,0.73,0.75,1.25,0.78c0.66,0,1-0.75,1.39-1.46c0.19,0.53,0.72,1.8,1.25,1.8\ns1.06-1.27,1.25-1.8c0.37,0.71,0.73,1.46,1.39,1.46c0.52-0.03,1-0.33,1.26-0.78c-1.82-0.5-2.67-3.12-2.67-6.67\nc-0.01-0.95,0.07-1.89,0.23-2.82c0.68,0.96,1.1,2.07,1.21,3.24c0.31-0.26,0.53-0.61,0.63-1c0.61,0.75,1.15,1.54,1.62,2.38\nc-0.66,0-1.45-0.16-1.7-0.16c-0.67,0-0.82,0.38-0.82,0.71c0,0.49,0.51,1,0.86,1.27c0.3-0.67,1.59-0.57,1.59-0.57\nc0.24-0.02,0.47-0.02,0.71,0c-0.02,0.2-0.02,0.41,0,0.61v0.69c0.11,0.66-0.12,1.33-0.62,1.77c0.25,0.19,0.55,0.3,0.86,0.31\nc0.91,0,1-0.65,1-2.08c0.01-0.1,0.01-0.2,0-0.3c0.52,0.47,0.87,1.11,1,1.8c0.02,0.14,0.02,0.28,0,0.42\nc0.61-0.11,1.06-0.62,1.12-1.23c0-0.74-1.15-1.67-1.52-2.08h0.13c1.25,0,1.5,0.42,1.63,0.73c0.4-0.35,0.63-0.85,0.62-1.38\nc0-0.35-0.07-0.75-0.75-0.75c-0.78,0.02-1.55,0.09-2.32,0.22c-0.76-1.02-1.43-2.1-2-3.23c0.3,0.04,0.6,0.06,0.9,0.05\nc0.19,0.01,0.39-0.02,0.57-0.08c-2.07-1.79-3.8-4.12-3.8-6.76c0.02-0.44,0.1-0.88,0.24-1.3h0.16l5.24,8.39\nc1.57,2.48,2.8,2.43,4.65,2.43c-1.19-0.97-2.21-2.14-3-3.45l-4.92-7.87c0.27-0.08,0.53-0.18,0.79-0.28l4.35,7\nc1.57,2.48,2.8,2.44,4.65,2.44c-1.19-0.97-2.21-2.14-3-3.45l-4.23-6.77c0.24-0.13,0.48-0.27,0.7-0.41l3.42,5.55\nc1.57,2.49,2.8,2.44,4.65,2.44c-1.19-0.97-2.21-2.13-3-3.45l-3.55-5.69c0.2-0.18,0.4-0.38,0.59-0.58l2.52,4\nc1.57,2.48,2.8,2.44,4.65,2.44c-1.2-0.97-2.21-2.14-3-3.46l-2.99-4.7c0.16-0.29,0.29-0.59,0.4-0.9L31.25,12.23z"}),KolLogo$1=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.__attachShadow(),this._org=void 0,this.state={_org:Bundesanstalt["Informationstechnikzentrum Bund"]}}validateOrg(c){"string"==typeof c&&ENUM_AS_MAP.has(c)?setState(this,"_org",c):devHint(`Die verwendete Abkürzung (${c}) ist nicht definiert!`)}componentWillLoad(){this.validateOrg(this._org)}render(){var c;return h("svg",{"aria-label":translate("kol-logo-description",{placeholders:{orgShort:this.state._org,orgLong:getAriaLabel(this.state._org)}}),role:"img",viewBox:"0 0 225 100"},h("rect",{width:"100%",height:"100%",fill:"white"}),h("svg",{x:"0",y:"4",height:"75"},h(Adler,null)),h("svg",{x:"40.5",y:"3.5",height:"100"},h("rect",{width:"5",height:"30"}),h("rect",{y:"30",width:"5",height:"30",fill:"red"}),h("rect",{y:"60",width:"5",height:"30",fill:"#fc0"})),h("svg",{x:"50",y:"0"},h("text",{x:"0",y:"-0.05em","font-family":"BundesSans Web",style:{backgroundColor:"white",color:"black"}},BUND_LOGO_TEXT_MAP.has(this.state._org)?h("tspan",null,null===(c=BUND_LOGO_TEXT_MAP.get(this.state._org))||void 0===c?void 0:c.map(((c,t)=>h("tspan",{x:"0",dy:"1.1em",key:`kol-logo-text-${t}`},c)))):h("tspan",{fill:"red"},h("tspan",{x:"0",dy:"1.1em"},"Der Schlüsselwert"),h("tspan",{x:"0",dy:"1.1em","font-weight":"bold"},"'",this.state._org,"'"),h("tspan",{x:"0",dy:"1.1em"},"ist nicht definiert."),h("tspan",{x:"0",dy:"1.1em"},"oder freigegeben.")))))}static get watchers(){return{_org:["validateOrg"]}}static get style(){return{default:defaultStyleCss}}},[33,"kol-logo",{_org:[1],state:[32]},void 0,{_org:["validateOrg"]}]);function defineCustomElement$1(){if("undefined"==typeof customElements)return;["kol-logo"].forEach((c=>{if("kol-logo"===c)customElements.get(c)||customElements.define(c,KolLogo$1)}))}const KolLogo=KolLogo$1,defineCustomElement=defineCustomElement$1;export{KolLogo,defineCustomElement};
+import{proxyCustomElement,HTMLElement,h}from"@stencil/core/internal/client";import{d as Bundesanstalt,B as Bundesministerium,b as Bundesamt,f as BUND_LOGO_TEXT_MAP}from"./bund.js";import{a as translate}from"./i18n.js";import{v as setState,d as devHint}from"./prop.validators.js";const defaultStyleCss="/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n\t:host {\n\t\t/*\n\t\t * Minimum size of interactive elements.\n\t\t */\n\t\t--a11y-min-size: 44px;\n\t\t/*\n\t\t * Verdana is an accessible font that can be used without requiring additional loading time.\n\t\t */\n\t\tfont-family: Verdana;\n\t}\n\n\t* {\n\t\t/*\n\t\t * This rule enables the word dividing for all texts. That is important for high zoom levels.\n\t\t */\n\t\thyphens: auto;\n\t\t/*\n\t\t * Letter spacing is required for all texts.\n\t\t */\n\t\tletter-spacing: inherit;\n\t\t/*\n\t\t * This rule enables the word dividing for all texts. That is important for high zoom levels.\n\t\t */\n\t\tword-break: break-word;\n\t\t/*\n\t\t * Word spacing is required for all texts.\n\t\t */\n\t\tword-spacing: inherit;\n\t}\n\n\t/*\n\t * All interactive elements should have a minimum size of 44px.\n\t */\n\t/* input:not([type='checkbox'], [type='radio'], [type='range']), */\n\t/* option, */\n\t/* select, */\n\t/* textarea, */\n\t[role='button'],\n\tbutton:not([role='link']),\n\tkol-input .input {\n\t\tmin-height: var(--a11y-min-size);\n\t\tmin-width: var(--a11y-min-size);\n\t}\n\n\t/*\n\t * Some interactive elements should not inherit the font-family and font-size.\n\t */\n\ta,\n\tbutton,\n\th1,\n\th2,\n\th3,\n\th4,\n\th5,\n\th6,\n\tinput,\n\toption,\n\tselect,\n\ttextarea {\n\t\t/*\n\t\t * All elements should inherit the font family from his parent element.\n\t\t */\n\t\tfont-family: inherit;\n\t\t/*\n\t\t * All elements should inherit the font size from his parent element.\n\t\t */\n\t\tfont-size: inherit;\n\t}\n}\n\n@layer kol-global {\n\t/*\n\t * Dieses CSS stellt sicher, dass der Standard-Style\n\t * von A und Button resettet werden.\n\t */\n\t:is(a, button) {\n\t\tbackground-color: transparent;\n\t\tborder: none;\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t\twidth: 100%; /* 100% needed for custom width from outside */\n\t}\n}\n\n@layer kol-global {\n\t:host {\n\t\t/*\n\t\t * The max-width is needed to prevent the table from overflowing the\n\t\t * parent node, if the table is wider than the parent node.\n\t\t */\n\t\tmax-width: 100%;\n\t}\n\n\t* {\n\t\t/*\n\t\t * We prefer to box-sizing: border-box for all elements.\n\t\t */\n\t\tbox-sizing: border-box;\n\t}\n\n\t/* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n\tkol-span-wc {\n\t\tdisplay: grid;\n\t\tplace-items: center;\n\t}\n\n\t/* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n\tkol-span-wc > span {\n\t\tdisplay: flex;\n\t\tplace-items: center;\n\t}\n\n\ta,\n\tbutton {\n\t\tcursor: pointer;\n\t}\n\n\t/* This is the text label. */\n\t.icon-only > kol-span-wc > span > span {\n\t\tdisplay: none;\n\t}\n}\n\n@layer kol-component {\n\t:host {\n\t\tdisplay: inline-block;\n\t}\n\n\ttext {\n\t\tfont-size: 16px;\n\t\tletter-spacing: normal;\n\t\tword-spacing: normal;\n\t}\n\n\tsvg {\n\t\tmax-height: 100%;\n\t}\n}\n";function enumToArray(t,n=new Map){return Object.entries(t).map((([t,e])=>{n.set(e,t)})),n}const ENUM_AS_MAP=enumToArray(Bundesamt,enumToArray(Bundesanstalt,enumToArray(Bundesministerium)));function getAriaLabel(t){return ENUM_AS_MAP.has(t)?ENUM_AS_MAP.get(t):""}const Adler=()=>h("path",{d:"M21.72,12.77c0.04-0.33,0.06-0.67,0.06-1c0-0.2,0-0.43,0-0.69c3.06,0,5.74-2.25,5.74-4.78\nc-0.09-1.07-0.56-2.08-1.32-2.84l0.32-0.07c1,0.89,1.61,2.14,1.7,3.48c0,3-3,5.85-6.5,5.92 M18.64,2.21\nc-0.05-0.33-0.19-0.64-0.39-0.91c0-0.31,0.14-0.61,0.64-0.36c-0.27,0.27-0.06,0.76-0.06,0.76s0.55-0.26,0.44-0.62\nC20.09,1.28,19.5,2.38,18.64,2.21 M17.93,3.77c-0.12-0.47-0.34-0.9-0.64-1.27c-0.3-0.42-0.77-0.69-1.29-0.73\nc-0.34,0.03-0.68,0.12-1,0.25c-0.16-0.28-0.27-0.58-0.32-0.9c0-0.22,0.38-0.44,1.1-0.44c1.58,0,2.52,0.71,2.52,1.91\nC18.26,3.01,18.14,3.41,17.93,3.77 M22,24.16c0.13,0,0.26,0.02,0.38,0.07c0.64,1.3,1.4,2.53,2.29,3.68l0,0l0,0\nc0.81-0.14,1.63-0.22,2.45-0.24l0,0c0.1-0.01,0.2,0.01,0.28,0.07c0.07,0.09,0.1,0.2,0.09,0.31c-0.01,0.28-0.08,0.55-0.21,0.79\nc-0.46-0.4-1.07-0.59-1.68-0.51c-0.24,0.01-0.48,0.05-0.71,0.12h-0.07h-0.07l0.48,0.49c0.77,0.83,1.44,1.43,1.44,1.83\nc-0.04,0.31-0.22,0.58-0.48,0.74c-0.22-0.98-0.8-1.84-1.62-2.42h-0.06v0.27c0,0.19,0,0.47,0,0.77c0,1.49-0.15,1.72-0.67,1.72\nc-0.09,0.01-0.19,0.01-0.28,0c0.33-0.49,0.48-1.08,0.41-1.67v-0.7c0-0.27,0.03-0.53,0.06-0.8v-0.11h-0.08\nc-0.33-0.05-0.67-0.09-1-0.1c-0.57-0.07-1.14,0.07-1.6,0.41c-0.24-0.18-0.41-0.44-0.48-0.73c0-0.32,0.19-0.34,0.45-0.34\nc0.14-0.01,0.27-0.01,0.41,0c0.59,0.09,1.18,0.13,1.78,0.12h0.06v-0.06c-0.5-1.13-1.18-2.17-2-3.09c0.1-0.35,0.2-0.59,0.54-0.59\nM12.64,27.87v0.06h0.06c0.55-0.01,1.1-0.06,1.64-0.16c0.14-0.01,0.27-0.01,0.41,0c0.26,0,0.45,0,0.45,0.34\nc-0.07,0.29-0.24,0.55-0.48,0.73c-0.46-0.34-1.03-0.49-1.6-0.41c-0.33,0.01-0.67,0.05-1,0.1H12v0.11\nc0.03,0.27,0.06,0.53,0.06,0.8v0.7c-0.05,0.58,0.1,1.15,0.42,1.63c-0.09,0.01-0.19,0.01-0.28,0c-0.52,0-0.67-0.23-0.67-1.72\nc0-0.3,0-0.58,0-0.77V29l-0.06,0.05c-0.82,0.58-1.39,1.44-1.61,2.42c-0.28-0.14-0.47-0.4-0.53-0.7c0-0.43,0.65-1.07,1.39-1.81\nl0.43-0.43v-0.06h-0.14c-0.23-0.07-0.47-0.11-0.71-0.12c-0.61-0.08-1.22,0.11-1.68,0.51c-0.13-0.24-0.2-0.51-0.21-0.79\nc0.01-0.11,0.06-0.22,0.14-0.3c0.08-0.06,0.18-0.08,0.28-0.07l0,0c0.82,0.02,1.64,0.1,2.45,0.24l0,0l0,0\nc0.88-1.15,1.64-2.38,2.28-3.68c0.12-0.05,0.25-0.07,0.38-0.07c0.35,0,0.44,0.24,0.54,0.59c-0.82,0.92-1.5,1.96-2,3.09\nM7.78,6.87c0.08-1.36,0.7-2.62,1.72-3.52l0.32,0.07C9.06,4.19,8.6,5.19,8.51,6.26c0,2.56,2.73,4.78,5.82,4.78\nc0,0.22,0,0.45,0,0.69c-0.01,0.35,0,0.69,0.03,1.04c-3.5,0-6.58-2.86-6.58-5.92 M31.25,12.23c1.57,2.49,2.8,2.45,4.66,2.45\nc-1.19-0.97-2.21-2.14-3-3.46L30,6.65c-0.29-1.44-1.03-2.75-2.12-3.73c0.31-0.1,0.6-0.24,0.87-0.42c-1.88,0-3.73-1-4.75-1\nc-0.55-0.05-1.03,0.36-1.08,0.91c0,0.58,0.63,1.16,1.73,1.16c0.31,0,0.62-0.04,0.92-0.09c0.65,0.74,1.03,1.67,1.08,2.65\nc0,2-2.41,3.58-4.83,3.58h-0.41c-0.5-0.67-0.84-1.45-1-2.28c0-1.6,1.05-2.9,1.05-4.48c0-0.68-0.24-1.33-0.67-1.85\nc0.29-0.23,0.53-0.52,0.7-0.85c-0.22,0.08-0.45,0.11-0.68,0.09c-1.16,0-2.11-0.3-3-0.3c-0.53,0-0.67,0.16-0.67,0.31\nc-0.01,0.05-0.01,0.1,0,0.15c-0.19-0.08-0.39-0.13-0.59-0.17c-0.29-0.05-0.58-0.08-0.88-0.08c-1.13,0-1.52,0.47-1.52,0.87\nc0.07,0.52,0.27,1.01,0.57,1.44c0.4-0.2,0.84-0.31,1.28-0.34c0.6,0,1.13,0.57,1.41,1.24c-0.29,0.05-0.59,0.07-0.88,0.07\nc-0.68-0.03-1.36-0.16-2-0.39l0,0c0,0,0.31,0.56,0.92,0.78c0.72,0.22,1.46,0.37,2.21,0.45c-0.08,0.21-0.23,0.38-0.43,0.49\nc-0.05,0.02-0.09,0.02-0.14,0c-0.74-0.14-1.45-0.35-2.14-0.65H14.9c0,0.42,1.09,1.35,2.07,1.71c-1.06,1.1-1.87,2.41-2.39,3.85\nh-0.41c-2.42,0-4.82-1.57-4.82-3.58c0.05-0.98,0.43-1.91,1.07-2.65c0.3,0.05,0.61,0.09,0.92,0.09c1.1,0,1.69-0.58,1.74-1.16\nc-0.04-0.55-0.52-0.96-1.07-0.92c0,0,0,0-0.01,0c-1,0-2.88,1-4.76,1C7.51,2.73,7.8,2.87,8.11,2.97C7.03,3.94,6.29,5.23,6,6.65\nl-2.87,4.59c-0.79,1.32-1.81,2.49-3,3.46c1.86,0,3.09,0,4.66-2.45L6.26,9.9c0.11,0.31,0.24,0.61,0.4,0.9l-2.97,4.67\nc-0.79,1.32-1.8,2.49-3,3.46c1.85,0,3.08,0,4.65-2.44l2.52-4c0.19,0.2,0.39,0.4,0.6,0.58l-3.59,5.7c-0.79,1.32-1.8,2.49-3,3.45\nc1.85,0,3.08,0.05,4.65-2.44L10,14.2c0.22,0.14,0.46,0.28,0.7,0.41l-4.27,6.77c-0.79,1.31-1.81,2.48-3,3.45\nc1.85,0,3.08,0,4.65-2.44l4.36-7c0.25,0.1,0.51,0.2,0.78,0.28l-4.95,7.9c-0.79,1.31-1.81,2.48-3,3.45c1.85,0,3.08,0.05,4.65-2.43\nl5.24-8.39h0.16c0.14,0.42,0.22,0.86,0.24,1.3c0,2.64-1.73,5-3.8,6.76c0.19,0.06,0.38,0.09,0.58,0.08c0.3,0.01,0.6-0.01,0.9-0.05\nc-0.57,1.13-1.24,2.21-2,3.23c-0.77-0.13-1.54-0.2-2.32-0.22c-0.67,0-0.75,0.4-0.75,0.75c-0.01,0.53,0.22,1.03,0.62,1.38\nc0.13-0.31,0.38-0.73,1.63-0.73h0.13C10.11,29.13,9,30.06,9,30.77c0.06,0.66,0.59,1.18,1.25,1.24c-0.02-0.14-0.02-0.28,0-0.42\nc0.13-0.69,0.48-1.33,1-1.8c-0.01,0.1-0.01,0.2,0,0.3c0,1.43,0.13,2.08,1,2.08c0.31-0.01,0.61-0.12,0.86-0.31\nc-0.5-0.44-0.73-1.11-0.62-1.77c0-0.21,0-0.41,0-0.69c0.02-0.2,0.02-0.41,0-0.61c0.24-0.02,0.47-0.02,0.71,0\nc0,0,1.29-0.1,1.6,0.57c0.35-0.32,0.86-0.78,0.86-1.27c0-0.33-0.16-0.71-0.83-0.71c-0.25,0-1,0.16-1.7,0.16\nc0.48-0.84,1.04-1.64,1.66-2.39c0.1,0.39,0.31,0.74,0.62,1c0.12-1.17,0.54-2.28,1.21-3.24c0.16,0.93,0.24,1.87,0.23,2.82\nc0,3.55-0.85,6.17-2.66,6.67c0.26,0.46,0.73,0.75,1.25,0.78c0.66,0,1-0.75,1.39-1.46c0.19,0.53,0.72,1.8,1.25,1.8\ns1.06-1.27,1.25-1.8c0.37,0.71,0.73,1.46,1.39,1.46c0.52-0.03,1-0.33,1.26-0.78c-1.82-0.5-2.67-3.12-2.67-6.67\nc-0.01-0.95,0.07-1.89,0.23-2.82c0.68,0.96,1.1,2.07,1.21,3.24c0.31-0.26,0.53-0.61,0.63-1c0.61,0.75,1.15,1.54,1.62,2.38\nc-0.66,0-1.45-0.16-1.7-0.16c-0.67,0-0.82,0.38-0.82,0.71c0,0.49,0.51,1,0.86,1.27c0.3-0.67,1.59-0.57,1.59-0.57\nc0.24-0.02,0.47-0.02,0.71,0c-0.02,0.2-0.02,0.41,0,0.61v0.69c0.11,0.66-0.12,1.33-0.62,1.77c0.25,0.19,0.55,0.3,0.86,0.31\nc0.91,0,1-0.65,1-2.08c0.01-0.1,0.01-0.2,0-0.3c0.52,0.47,0.87,1.11,1,1.8c0.02,0.14,0.02,0.28,0,0.42\nc0.61-0.11,1.06-0.62,1.12-1.23c0-0.74-1.15-1.67-1.52-2.08h0.13c1.25,0,1.5,0.42,1.63,0.73c0.4-0.35,0.63-0.85,0.62-1.38\nc0-0.35-0.07-0.75-0.75-0.75c-0.78,0.02-1.55,0.09-2.32,0.22c-0.76-1.02-1.43-2.1-2-3.23c0.3,0.04,0.6,0.06,0.9,0.05\nc0.19,0.01,0.39-0.02,0.57-0.08c-2.07-1.79-3.8-4.12-3.8-6.76c0.02-0.44,0.1-0.88,0.24-1.3h0.16l5.24,8.39\nc1.57,2.48,2.8,2.43,4.65,2.43c-1.19-0.97-2.21-2.14-3-3.45l-4.92-7.87c0.27-0.08,0.53-0.18,0.79-0.28l4.35,7\nc1.57,2.48,2.8,2.44,4.65,2.44c-1.19-0.97-2.21-2.14-3-3.45l-4.23-6.77c0.24-0.13,0.48-0.27,0.7-0.41l3.42,5.55\nc1.57,2.49,2.8,2.44,4.65,2.44c-1.19-0.97-2.21-2.13-3-3.45l-3.55-5.69c0.2-0.18,0.4-0.38,0.59-0.58l2.52,4\nc1.57,2.48,2.8,2.44,4.65,2.44c-1.2-0.97-2.21-2.14-3-3.46l-2.99-4.7c0.16-0.29,0.29-0.59,0.4-0.9L31.25,12.23z"}),KolLogo$1=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.__attachShadow(),this._org=void 0,this.state={_org:Bundesanstalt["Informationstechnikzentrum Bund"]}}validateOrg(t){"string"==typeof t&&ENUM_AS_MAP.has(t)?setState(this,"_org",t):devHint(`Die verwendete Abkürzung (${t}) ist nicht definiert!`)}componentWillLoad(){this.validateOrg(this._org)}render(){var t;return h("svg",{"aria-label":translate("kol-logo-description",{placeholders:{orgShort:this.state._org,orgLong:getAriaLabel(this.state._org)}}),role:"img",viewBox:"0 0 225 100"},h("rect",{width:"100%",height:"100%",fill:"white"}),h("svg",{x:"0",y:"4",height:"75"},h(Adler,null)),h("svg",{x:"40.5",y:"3.5",height:"100"},h("rect",{width:"5",height:"30"}),h("rect",{y:"30",width:"5",height:"30",fill:"red"}),h("rect",{y:"60",width:"5",height:"30",fill:"#fc0"})),h("svg",{x:"50",y:"0"},h("text",{x:"0",y:"-0.05em","font-family":"BundesSans Web",style:{backgroundColor:"white",color:"black"}},BUND_LOGO_TEXT_MAP.has(this.state._org)?h("tspan",null,null===(t=BUND_LOGO_TEXT_MAP.get(this.state._org))||void 0===t?void 0:t.map(((t,n)=>h("tspan",{x:"0",dy:"1.1em",key:`kol-logo-text-${n}`},t)))):h("tspan",{fill:"red"},h("tspan",{x:"0",dy:"1.1em"},"Der Schlüsselwert"),h("tspan",{x:"0",dy:"1.1em","font-weight":"bold"},"'",this.state._org,"'"),h("tspan",{x:"0",dy:"1.1em"},"ist nicht definiert."),h("tspan",{x:"0",dy:"1.1em"},"oder freigegeben.")))))}static get watchers(){return{_org:["validateOrg"]}}static get style(){return{default:defaultStyleCss}}},[33,"kol-logo",{_org:[1],state:[32]},void 0,{_org:["validateOrg"]}]);function defineCustomElement$1(){if("undefined"==typeof customElements)return;["kol-logo"].forEach((t=>{if("kol-logo"===t)customElements.get(t)||customElements.define(t,KolLogo$1)}))}const KolLogo=KolLogo$1,defineCustomElement=defineCustomElement$1;export{KolLogo,defineCustomElement};

package/dist/components/kol-logo.js.map

@@ -1 +1 @@
-{"file":"kol-logo.js","mappings":"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","names":["KolLogo"],"sources":["src/components/logo/style.css?tag=kol-logo&mode=default&encapsulation=shadow","src/components/logo/component.tsx"],"sourcesContent":["@import url(../style.css);\n:host {\n\tdisplay: inline-block;\n}\ntext {\n\tfont-size: 16px;\n\tletter-spacing: normal;\n\tword-spacing: normal;\n}\nsvg {\n\tmax-height: 100%;\n}\n","import { Component, h, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { BUND_LOGO_TEXT_MAP, Bundesamt, Bundesanstalt, Bundesministerium } from '../../enums/bund';\nimport { translate } from '../../i18n';\nimport { devHint } from '../../utils/a11y.tipps';\nimport { setState } from '../../utils/prop.validators';\nimport { API, States } from './types';\n\nfunction enumToArray(enumeration: Record<string, string>, enumAsMap: Map<string, string> = new Map()): Map<string, string> {\n\tObject.entries(enumeration).map(([key, value]) => {\n\t\tenumAsMap.set(value, key);\n\t});\n\treturn enumAsMap;\n}\n\nconst ENUM_AS_MAP = enumToArray(Bundesamt, enumToArray(Bundesanstalt, enumToArray(Bundesministerium)));\n\nfunction getAriaLabel(organ: string): string {\n\tif (ENUM_AS_MAP.has(organ)) {\n\t\treturn ENUM_AS_MAP.get(organ) as string;\n\t} else {\n\t\treturn '';\n\t}\n}\n\nconst Adler = (): JSX.Element => (\n\t<path\n\t\td=\"M21.72,12.77c0.04-0.33,0.06-0.67,0.06-1c0-0.2,0-0.43,0-0.69c3.06,0,5.74-2.25,5.74-4.78\nc-0.09-1.07-0.56-2.08-1.32-2.84l0.32-0.07c1,0.89,1.61,2.14,1.7,3.48c0,3-3,5.85-6.5,5.92 M18.64,2.21\nc-0.05-0.33-0.19-0.64-0.39-0.91c0-0.31,0.14-0.61,0.64-0.36c-0.27,0.27-0.06,0.76-0.06,0.76s0.55-0.26,0.44-0.62\nC20.09,1.28,19.5,2.38,18.64,2.21 M17.93,3.77c-0.12-0.47-0.34-0.9-0.64-1.27c-0.3-0.42-0.77-0.69-1.29-0.73\nc-0.34,0.03-0.68,0.12-1,0.25c-0.16-0.28-0.27-0.58-0.32-0.9c0-0.22,0.38-0.44,1.1-0.44c1.58,0,2.52,0.71,2.52,1.91\nC18.26,3.01,18.14,3.41,17.93,3.77 M22,24.16c0.13,0,0.26,0.02,0.38,0.07c0.64,1.3,1.4,2.53,2.29,3.68l0,0l0,0\nc0.81-0.14,1.63-0.22,2.45-0.24l0,0c0.1-0.01,0.2,0.01,0.28,0.07c0.07,0.09,0.1,0.2,0.09,0.31c-0.01,0.28-0.08,0.55-0.21,0.79\nc-0.46-0.4-1.07-0.59-1.68-0.51c-0.24,0.01-0.48,0.05-0.71,0.12h-0.07h-0.07l0.48,0.49c0.77,0.83,1.44,1.43,1.44,1.83\nc-0.04,0.31-0.22,0.58-0.48,0.74c-0.22-0.98-0.8-1.84-1.62-2.42h-0.06v0.27c0,0.19,0,0.47,0,0.77c0,1.49-0.15,1.72-0.67,1.72\nc-0.09,0.01-0.19,0.01-0.28,0c0.33-0.49,0.48-1.08,0.41-1.67v-0.7c0-0.27,0.03-0.53,0.06-0.8v-0.11h-0.08\nc-0.33-0.05-0.67-0.09-1-0.1c-0.57-0.07-1.14,0.07-1.6,0.41c-0.24-0.18-0.41-0.44-0.48-0.73c0-0.32,0.19-0.34,0.45-0.34\nc0.14-0.01,0.27-0.01,0.41,0c0.59,0.09,1.18,0.13,1.78,0.12h0.06v-0.06c-0.5-1.13-1.18-2.17-2-3.09c0.1-0.35,0.2-0.59,0.54-0.59\nM12.64,27.87v0.06h0.06c0.55-0.01,1.1-0.06,1.64-0.16c0.14-0.01,0.27-0.01,0.41,0c0.26,0,0.45,0,0.45,0.34\nc-0.07,0.29-0.24,0.55-0.48,0.73c-0.46-0.34-1.03-0.49-1.6-0.41c-0.33,0.01-0.67,0.05-1,0.1H12v0.11\nc0.03,0.27,0.06,0.53,0.06,0.8v0.7c-0.05,0.58,0.1,1.15,0.42,1.63c-0.09,0.01-0.19,0.01-0.28,0c-0.52,0-0.67-0.23-0.67-1.72\nc0-0.3,0-0.58,0-0.77V29l-0.06,0.05c-0.82,0.58-1.39,1.44-1.61,2.42c-0.28-0.14-0.47-0.4-0.53-0.7c0-0.43,0.65-1.07,1.39-1.81\nl0.43-0.43v-0.06h-0.14c-0.23-0.07-0.47-0.11-0.71-0.12c-0.61-0.08-1.22,0.11-1.68,0.51c-0.13-0.24-0.2-0.51-0.21-0.79\nc0.01-0.11,0.06-0.22,0.14-0.3c0.08-0.06,0.18-0.08,0.28-0.07l0,0c0.82,0.02,1.64,0.1,2.45,0.24l0,0l0,0\nc0.88-1.15,1.64-2.38,2.28-3.68c0.12-0.05,0.25-0.07,0.38-0.07c0.35,0,0.44,0.24,0.54,0.59c-0.82,0.92-1.5,1.96-2,3.09\nM7.78,6.87c0.08-1.36,0.7-2.62,1.72-3.52l0.32,0.07C9.06,4.19,8.6,5.19,8.51,6.26c0,2.56,2.73,4.78,5.82,4.78\nc0,0.22,0,0.45,0,0.69c-0.01,0.35,0,0.69,0.03,1.04c-3.5,0-6.58-2.86-6.58-5.92 M31.25,12.23c1.57,2.49,2.8,2.45,4.66,2.45\nc-1.19-0.97-2.21-2.14-3-3.46L30,6.65c-0.29-1.44-1.03-2.75-2.12-3.73c0.31-0.1,0.6-0.24,0.87-0.42c-1.88,0-3.73-1-4.75-1\nc-0.55-0.05-1.03,0.36-1.08,0.91c0,0.58,0.63,1.16,1.73,1.16c0.31,0,0.62-0.04,0.92-0.09c0.65,0.74,1.03,1.67,1.08,2.65\nc0,2-2.41,3.58-4.83,3.58h-0.41c-0.5-0.67-0.84-1.45-1-2.28c0-1.6,1.05-2.9,1.05-4.48c0-0.68-0.24-1.33-0.67-1.85\nc0.29-0.23,0.53-0.52,0.7-0.85c-0.22,0.08-0.45,0.11-0.68,0.09c-1.16,0-2.11-0.3-3-0.3c-0.53,0-0.67,0.16-0.67,0.31\nc-0.01,0.05-0.01,0.1,0,0.15c-0.19-0.08-0.39-0.13-0.59-0.17c-0.29-0.05-0.58-0.08-0.88-0.08c-1.13,0-1.52,0.47-1.52,0.87\nc0.07,0.52,0.27,1.01,0.57,1.44c0.4-0.2,0.84-0.31,1.28-0.34c0.6,0,1.13,0.57,1.41,1.24c-0.29,0.05-0.59,0.07-0.88,0.07\nc-0.68-0.03-1.36-0.16-2-0.39l0,0c0,0,0.31,0.56,0.92,0.78c0.72,0.22,1.46,0.37,2.21,0.45c-0.08,0.21-0.23,0.38-0.43,0.49\nc-0.05,0.02-0.09,0.02-0.14,0c-0.74-0.14-1.45-0.35-2.14-0.65H14.9c0,0.42,1.09,1.35,2.07,1.71c-1.06,1.1-1.87,2.41-2.39,3.85\nh-0.41c-2.42,0-4.82-1.57-4.82-3.58c0.05-0.98,0.43-1.91,1.07-2.65c0.3,0.05,0.61,0.09,0.92,0.09c1.1,0,1.69-0.58,1.74-1.16\nc-0.04-0.55-0.52-0.96-1.07-0.92c0,0,0,0-0.01,0c-1,0-2.88,1-4.76,1C7.51,2.73,7.8,2.87,8.11,2.97C7.03,3.94,6.29,5.23,6,6.65\nl-2.87,4.59c-0.79,1.32-1.81,2.49-3,3.46c1.86,0,3.09,0,4.66-2.45L6.26,9.9c0.11,0.31,0.24,0.61,0.4,0.9l-2.97,4.67\nc-0.79,1.32-1.8,2.49-3,3.46c1.85,0,3.08,0,4.65-2.44l2.52-4c0.19,0.2,0.39,0.4,0.6,0.58l-3.59,5.7c-0.79,1.32-1.8,2.49-3,3.45\nc1.85,0,3.08,0.05,4.65-2.44L10,14.2c0.22,0.14,0.46,0.28,0.7,0.41l-4.27,6.77c-0.79,1.31-1.81,2.48-3,3.45\nc1.85,0,3.08,0,4.65-2.44l4.36-7c0.25,0.1,0.51,0.2,0.78,0.28l-4.95,7.9c-0.79,1.31-1.81,2.48-3,3.45c1.85,0,3.08,0.05,4.65-2.43\nl5.24-8.39h0.16c0.14,0.42,0.22,0.86,0.24,1.3c0,2.64-1.73,5-3.8,6.76c0.19,0.06,0.38,0.09,0.58,0.08c0.3,0.01,0.6-0.01,0.9-0.05\nc-0.57,1.13-1.24,2.21-2,3.23c-0.77-0.13-1.54-0.2-2.32-0.22c-0.67,0-0.75,0.4-0.75,0.75c-0.01,0.53,0.22,1.03,0.62,1.38\nc0.13-0.31,0.38-0.73,1.63-0.73h0.13C10.11,29.13,9,30.06,9,30.77c0.06,0.66,0.59,1.18,1.25,1.24c-0.02-0.14-0.02-0.28,0-0.42\nc0.13-0.69,0.48-1.33,1-1.8c-0.01,0.1-0.01,0.2,0,0.3c0,1.43,0.13,2.08,1,2.08c0.31-0.01,0.61-0.12,0.86-0.31\nc-0.5-0.44-0.73-1.11-0.62-1.77c0-0.21,0-0.41,0-0.69c0.02-0.2,0.02-0.41,0-0.61c0.24-0.02,0.47-0.02,0.71,0\nc0,0,1.29-0.1,1.6,0.57c0.35-0.32,0.86-0.78,0.86-1.27c0-0.33-0.16-0.71-0.83-0.71c-0.25,0-1,0.16-1.7,0.16\nc0.48-0.84,1.04-1.64,1.66-2.39c0.1,0.39,0.31,0.74,0.62,1c0.12-1.17,0.54-2.28,1.21-3.24c0.16,0.93,0.24,1.87,0.23,2.82\nc0,3.55-0.85,6.17-2.66,6.67c0.26,0.46,0.73,0.75,1.25,0.78c0.66,0,1-0.75,1.39-1.46c0.19,0.53,0.72,1.8,1.25,1.8\ns1.06-1.27,1.25-1.8c0.37,0.71,0.73,1.46,1.39,1.46c0.52-0.03,1-0.33,1.26-0.78c-1.82-0.5-2.67-3.12-2.67-6.67\nc-0.01-0.95,0.07-1.89,0.23-2.82c0.68,0.96,1.1,2.07,1.21,3.24c0.31-0.26,0.53-0.61,0.63-1c0.61,0.75,1.15,1.54,1.62,2.38\nc-0.66,0-1.45-0.16-1.7-0.16c-0.67,0-0.82,0.38-0.82,0.71c0,0.49,0.51,1,0.86,1.27c0.3-0.67,1.59-0.57,1.59-0.57\nc0.24-0.02,0.47-0.02,0.71,0c-0.02,0.2-0.02,0.41,0,0.61v0.69c0.11,0.66-0.12,1.33-0.62,1.77c0.25,0.19,0.55,0.3,0.86,0.31\nc0.91,0,1-0.65,1-2.08c0.01-0.1,0.01-0.2,0-0.3c0.52,0.47,0.87,1.11,1,1.8c0.02,0.14,0.02,0.28,0,0.42\nc0.61-0.11,1.06-0.62,1.12-1.23c0-0.74-1.15-1.67-1.52-2.08h0.13c1.25,0,1.5,0.42,1.63,0.73c0.4-0.35,0.63-0.85,0.62-1.38\nc0-0.35-0.07-0.75-0.75-0.75c-0.78,0.02-1.55,0.09-2.32,0.22c-0.76-1.02-1.43-2.1-2-3.23c0.3,0.04,0.6,0.06,0.9,0.05\nc0.19,0.01,0.39-0.02,0.57-0.08c-2.07-1.79-3.8-4.12-3.8-6.76c0.02-0.44,0.1-0.88,0.24-1.3h0.16l5.24,8.39\nc1.57,2.48,2.8,2.43,4.65,2.43c-1.19-0.97-2.21-2.14-3-3.45l-4.92-7.87c0.27-0.08,0.53-0.18,0.79-0.28l4.35,7\nc1.57,2.48,2.8,2.44,4.65,2.44c-1.19-0.97-2.21-2.14-3-3.45l-4.23-6.77c0.24-0.13,0.48-0.27,0.7-0.41l3.42,5.55\nc1.57,2.49,2.8,2.44,4.65,2.44c-1.19-0.97-2.21-2.13-3-3.45l-3.55-5.69c0.2-0.18,0.4-0.38,0.59-0.58l2.52,4\nc1.57,2.48,2.8,2.44,4.65,2.44c-1.2-0.97-2.21-2.14-3-3.46l-2.99-4.7c0.16-0.29,0.29-0.59,0.4-0.9L31.25,12.23z\"\n\t></path>\n);\n\n@Component({\n\ttag: 'kol-logo',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolLogo implements API {\n\t/**\n\t * Gibt die Abkürzung eines Ministeriums, eines Amts oder einer Bundesanstalt an.\n\t */\n\t@Prop() public _org!: Bundesministerium | Bundesamt | Bundesanstalt;\n\n\t@State() public state: States = {\n\t\t_org: Bundesanstalt['Informationstechnikzentrum Bund'],\n\t};\n\n\t@Watch('_org')\n\tpublic validateOrg(value?: Bundesministerium | Bundesamt | Bundesanstalt): void {\n\t\tif (typeof value === 'string' && ENUM_AS_MAP.has(value)) {\n\t\t\tsetState(this, '_org', value);\n\t\t} else {\n\t\t\tdevHint(`Die verwendete Abkürzung (${value as string}) ist nicht definiert!`);\n\t\t}\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateOrg(this._org);\n\t}\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<svg\n\t\t\t\taria-label={translate('kol-logo-description', { placeholders: { orgShort: this.state._org, orgLong: getAriaLabel(this.state._org) } })}\n\t\t\t\trole=\"img\"\n\t\t\t\tviewBox=\"0 0 225 100\"\n\t\t\t>\n\t\t\t\t<rect width=\"100%\" height=\"100%\" fill=\"white\"></rect>\n\t\t\t\t<svg x=\"0\" y=\"4\" height=\"75\">\n\t\t\t\t\t<Adler />\n\t\t\t\t</svg>\n\t\t\t\t<svg x=\"40.5\" y=\"3.5\" height=\"100\">\n\t\t\t\t\t<rect width=\"5\" height=\"30\"></rect>\n\t\t\t\t\t<rect y=\"30\" width=\"5\" height=\"30\" fill=\"red\"></rect>\n\t\t\t\t\t<rect y=\"60\" width=\"5\" height=\"30\" fill=\"#fc0\"></rect>\n\t\t\t\t</svg>\n\t\t\t\t<svg x=\"50\" y=\"0\">\n\t\t\t\t\t<text x=\"0\" y=\"-0.05em\" font-family=\"BundesSans Web\" style={{ backgroundColor: 'white', color: 'black' }}>\n\t\t\t\t\t\t{BUND_LOGO_TEXT_MAP.has(this.state._org) ? (\n\t\t\t\t\t\t\t<tspan>\n\t\t\t\t\t\t\t\t{BUND_LOGO_TEXT_MAP.get(this.state._org)?.map((text: string, index: number) => {\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t<tspan x=\"0\" dy=\"1.1em\" key={`kol-logo-text-${index}`}>\n\t\t\t\t\t\t\t\t\t\t\t{text}\n\t\t\t\t\t\t\t\t\t\t</tspan>\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</tspan>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<tspan fill=\"red\">\n\t\t\t\t\t\t\t\t<tspan x=\"0\" dy=\"1.1em\">\n\t\t\t\t\t\t\t\t\tDer Schlüsselwert\n\t\t\t\t\t\t\t\t</tspan>\n\t\t\t\t\t\t\t\t<tspan x=\"0\" dy=\"1.1em\" font-weight=\"bold\">\n\t\t\t\t\t\t\t\t\t'{this.state._org}'\n\t\t\t\t\t\t\t\t</tspan>\n\t\t\t\t\t\t\t\t<tspan x=\"0\" dy=\"1.1em\">\n\t\t\t\t\t\t\t\t\tist nicht definiert.\n\t\t\t\t\t\t\t\t</tspan>\n\t\t\t\t\t\t\t\t<tspan x=\"0\" dy=\"1.1em\">\n\t\t\t\t\t\t\t\t\toder freigegeben.\n\t\t\t\t\t\t\t\t</tspan>\n\t\t\t\t\t\t\t</tspan>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</text>\n\t\t\t\t</svg>\n\t\t\t</svg>\n\t\t);\n\t}\n}\n"],"version":3}
+{"file":"kol-logo.js","mappings":"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","names":["KolLogo"],"sources":["src/components/logo/style.css?tag=kol-logo&mode=default&encapsulation=shadow","src/components/logo/component.tsx"],"sourcesContent":["@import url(../style.css);\n@layer kol-component {\n\t:host {\n\t\tdisplay: inline-block;\n\t}\n\n\ttext {\n\t\tfont-size: 16px;\n\t\tletter-spacing: normal;\n\t\tword-spacing: normal;\n\t}\n\n\tsvg {\n\t\tmax-height: 100%;\n\t}\n}\n","import { Component, h, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { BUND_LOGO_TEXT_MAP, Bundesamt, Bundesanstalt, Bundesministerium } from '../../enums/bund';\nimport { translate } from '../../i18n';\nimport { devHint } from '../../utils/a11y.tipps';\nimport { setState } from '../../utils/prop.validators';\nimport { API, States } from './types';\n\nfunction enumToArray(enumeration: Record<string, string>, enumAsMap: Map<string, string> = new Map()): Map<string, string> {\n\tObject.entries(enumeration).map(([key, value]) => {\n\t\tenumAsMap.set(value, key);\n\t});\n\treturn enumAsMap;\n}\n\nconst ENUM_AS_MAP = enumToArray(Bundesamt, enumToArray(Bundesanstalt, enumToArray(Bundesministerium)));\n\nfunction getAriaLabel(organ: string): string {\n\tif (ENUM_AS_MAP.has(organ)) {\n\t\treturn ENUM_AS_MAP.get(organ) as string;\n\t} else {\n\t\treturn '';\n\t}\n}\n\nconst Adler = (): JSX.Element => (\n\t<path\n\t\td=\"M21.72,12.77c0.04-0.33,0.06-0.67,0.06-1c0-0.2,0-0.43,0-0.69c3.06,0,5.74-2.25,5.74-4.78\nc-0.09-1.07-0.56-2.08-1.32-2.84l0.32-0.07c1,0.89,1.61,2.14,1.7,3.48c0,3-3,5.85-6.5,5.92 M18.64,2.21\nc-0.05-0.33-0.19-0.64-0.39-0.91c0-0.31,0.14-0.61,0.64-0.36c-0.27,0.27-0.06,0.76-0.06,0.76s0.55-0.26,0.44-0.62\nC20.09,1.28,19.5,2.38,18.64,2.21 M17.93,3.77c-0.12-0.47-0.34-0.9-0.64-1.27c-0.3-0.42-0.77-0.69-1.29-0.73\nc-0.34,0.03-0.68,0.12-1,0.25c-0.16-0.28-0.27-0.58-0.32-0.9c0-0.22,0.38-0.44,1.1-0.44c1.58,0,2.52,0.71,2.52,1.91\nC18.26,3.01,18.14,3.41,17.93,3.77 M22,24.16c0.13,0,0.26,0.02,0.38,0.07c0.64,1.3,1.4,2.53,2.29,3.68l0,0l0,0\nc0.81-0.14,1.63-0.22,2.45-0.24l0,0c0.1-0.01,0.2,0.01,0.28,0.07c0.07,0.09,0.1,0.2,0.09,0.31c-0.01,0.28-0.08,0.55-0.21,0.79\nc-0.46-0.4-1.07-0.59-1.68-0.51c-0.24,0.01-0.48,0.05-0.71,0.12h-0.07h-0.07l0.48,0.49c0.77,0.83,1.44,1.43,1.44,1.83\nc-0.04,0.31-0.22,0.58-0.48,0.74c-0.22-0.98-0.8-1.84-1.62-2.42h-0.06v0.27c0,0.19,0,0.47,0,0.77c0,1.49-0.15,1.72-0.67,1.72\nc-0.09,0.01-0.19,0.01-0.28,0c0.33-0.49,0.48-1.08,0.41-1.67v-0.7c0-0.27,0.03-0.53,0.06-0.8v-0.11h-0.08\nc-0.33-0.05-0.67-0.09-1-0.1c-0.57-0.07-1.14,0.07-1.6,0.41c-0.24-0.18-0.41-0.44-0.48-0.73c0-0.32,0.19-0.34,0.45-0.34\nc0.14-0.01,0.27-0.01,0.41,0c0.59,0.09,1.18,0.13,1.78,0.12h0.06v-0.06c-0.5-1.13-1.18-2.17-2-3.09c0.1-0.35,0.2-0.59,0.54-0.59\nM12.64,27.87v0.06h0.06c0.55-0.01,1.1-0.06,1.64-0.16c0.14-0.01,0.27-0.01,0.41,0c0.26,0,0.45,0,0.45,0.34\nc-0.07,0.29-0.24,0.55-0.48,0.73c-0.46-0.34-1.03-0.49-1.6-0.41c-0.33,0.01-0.67,0.05-1,0.1H12v0.11\nc0.03,0.27,0.06,0.53,0.06,0.8v0.7c-0.05,0.58,0.1,1.15,0.42,1.63c-0.09,0.01-0.19,0.01-0.28,0c-0.52,0-0.67-0.23-0.67-1.72\nc0-0.3,0-0.58,0-0.77V29l-0.06,0.05c-0.82,0.58-1.39,1.44-1.61,2.42c-0.28-0.14-0.47-0.4-0.53-0.7c0-0.43,0.65-1.07,1.39-1.81\nl0.43-0.43v-0.06h-0.14c-0.23-0.07-0.47-0.11-0.71-0.12c-0.61-0.08-1.22,0.11-1.68,0.51c-0.13-0.24-0.2-0.51-0.21-0.79\nc0.01-0.11,0.06-0.22,0.14-0.3c0.08-0.06,0.18-0.08,0.28-0.07l0,0c0.82,0.02,1.64,0.1,2.45,0.24l0,0l0,0\nc0.88-1.15,1.64-2.38,2.28-3.68c0.12-0.05,0.25-0.07,0.38-0.07c0.35,0,0.44,0.24,0.54,0.59c-0.82,0.92-1.5,1.96-2,3.09\nM7.78,6.87c0.08-1.36,0.7-2.62,1.72-3.52l0.32,0.07C9.06,4.19,8.6,5.19,8.51,6.26c0,2.56,2.73,4.78,5.82,4.78\nc0,0.22,0,0.45,0,0.69c-0.01,0.35,0,0.69,0.03,1.04c-3.5,0-6.58-2.86-6.58-5.92 M31.25,12.23c1.57,2.49,2.8,2.45,4.66,2.45\nc-1.19-0.97-2.21-2.14-3-3.46L30,6.65c-0.29-1.44-1.03-2.75-2.12-3.73c0.31-0.1,0.6-0.24,0.87-0.42c-1.88,0-3.73-1-4.75-1\nc-0.55-0.05-1.03,0.36-1.08,0.91c0,0.58,0.63,1.16,1.73,1.16c0.31,0,0.62-0.04,0.92-0.09c0.65,0.74,1.03,1.67,1.08,2.65\nc0,2-2.41,3.58-4.83,3.58h-0.41c-0.5-0.67-0.84-1.45-1-2.28c0-1.6,1.05-2.9,1.05-4.48c0-0.68-0.24-1.33-0.67-1.85\nc0.29-0.23,0.53-0.52,0.7-0.85c-0.22,0.08-0.45,0.11-0.68,0.09c-1.16,0-2.11-0.3-3-0.3c-0.53,0-0.67,0.16-0.67,0.31\nc-0.01,0.05-0.01,0.1,0,0.15c-0.19-0.08-0.39-0.13-0.59-0.17c-0.29-0.05-0.58-0.08-0.88-0.08c-1.13,0-1.52,0.47-1.52,0.87\nc0.07,0.52,0.27,1.01,0.57,1.44c0.4-0.2,0.84-0.31,1.28-0.34c0.6,0,1.13,0.57,1.41,1.24c-0.29,0.05-0.59,0.07-0.88,0.07\nc-0.68-0.03-1.36-0.16-2-0.39l0,0c0,0,0.31,0.56,0.92,0.78c0.72,0.22,1.46,0.37,2.21,0.45c-0.08,0.21-0.23,0.38-0.43,0.49\nc-0.05,0.02-0.09,0.02-0.14,0c-0.74-0.14-1.45-0.35-2.14-0.65H14.9c0,0.42,1.09,1.35,2.07,1.71c-1.06,1.1-1.87,2.41-2.39,3.85\nh-0.41c-2.42,0-4.82-1.57-4.82-3.58c0.05-0.98,0.43-1.91,1.07-2.65c0.3,0.05,0.61,0.09,0.92,0.09c1.1,0,1.69-0.58,1.74-1.16\nc-0.04-0.55-0.52-0.96-1.07-0.92c0,0,0,0-0.01,0c-1,0-2.88,1-4.76,1C7.51,2.73,7.8,2.87,8.11,2.97C7.03,3.94,6.29,5.23,6,6.65\nl-2.87,4.59c-0.79,1.32-1.81,2.49-3,3.46c1.86,0,3.09,0,4.66-2.45L6.26,9.9c0.11,0.31,0.24,0.61,0.4,0.9l-2.97,4.67\nc-0.79,1.32-1.8,2.49-3,3.46c1.85,0,3.08,0,4.65-2.44l2.52-4c0.19,0.2,0.39,0.4,0.6,0.58l-3.59,5.7c-0.79,1.32-1.8,2.49-3,3.45\nc1.85,0,3.08,0.05,4.65-2.44L10,14.2c0.22,0.14,0.46,0.28,0.7,0.41l-4.27,6.77c-0.79,1.31-1.81,2.48-3,3.45\nc1.85,0,3.08,0,4.65-2.44l4.36-7c0.25,0.1,0.51,0.2,0.78,0.28l-4.95,7.9c-0.79,1.31-1.81,2.48-3,3.45c1.85,0,3.08,0.05,4.65-2.43\nl5.24-8.39h0.16c0.14,0.42,0.22,0.86,0.24,1.3c0,2.64-1.73,5-3.8,6.76c0.19,0.06,0.38,0.09,0.58,0.08c0.3,0.01,0.6-0.01,0.9-0.05\nc-0.57,1.13-1.24,2.21-2,3.23c-0.77-0.13-1.54-0.2-2.32-0.22c-0.67,0-0.75,0.4-0.75,0.75c-0.01,0.53,0.22,1.03,0.62,1.38\nc0.13-0.31,0.38-0.73,1.63-0.73h0.13C10.11,29.13,9,30.06,9,30.77c0.06,0.66,0.59,1.18,1.25,1.24c-0.02-0.14-0.02-0.28,0-0.42\nc0.13-0.69,0.48-1.33,1-1.8c-0.01,0.1-0.01,0.2,0,0.3c0,1.43,0.13,2.08,1,2.08c0.31-0.01,0.61-0.12,0.86-0.31\nc-0.5-0.44-0.73-1.11-0.62-1.77c0-0.21,0-0.41,0-0.69c0.02-0.2,0.02-0.41,0-0.61c0.24-0.02,0.47-0.02,0.71,0\nc0,0,1.29-0.1,1.6,0.57c0.35-0.32,0.86-0.78,0.86-1.27c0-0.33-0.16-0.71-0.83-0.71c-0.25,0-1,0.16-1.7,0.16\nc0.48-0.84,1.04-1.64,1.66-2.39c0.1,0.39,0.31,0.74,0.62,1c0.12-1.17,0.54-2.28,1.21-3.24c0.16,0.93,0.24,1.87,0.23,2.82\nc0,3.55-0.85,6.17-2.66,6.67c0.26,0.46,0.73,0.75,1.25,0.78c0.66,0,1-0.75,1.39-1.46c0.19,0.53,0.72,1.8,1.25,1.8\ns1.06-1.27,1.25-1.8c0.37,0.71,0.73,1.46,1.39,1.46c0.52-0.03,1-0.33,1.26-0.78c-1.82-0.5-2.67-3.12-2.67-6.67\nc-0.01-0.95,0.07-1.89,0.23-2.82c0.68,0.96,1.1,2.07,1.21,3.24c0.31-0.26,0.53-0.61,0.63-1c0.61,0.75,1.15,1.54,1.62,2.38\nc-0.66,0-1.45-0.16-1.7-0.16c-0.67,0-0.82,0.38-0.82,0.71c0,0.49,0.51,1,0.86,1.27c0.3-0.67,1.59-0.57,1.59-0.57\nc0.24-0.02,0.47-0.02,0.71,0c-0.02,0.2-0.02,0.41,0,0.61v0.69c0.11,0.66-0.12,1.33-0.62,1.77c0.25,0.19,0.55,0.3,0.86,0.31\nc0.91,0,1-0.65,1-2.08c0.01-0.1,0.01-0.2,0-0.3c0.52,0.47,0.87,1.11,1,1.8c0.02,0.14,0.02,0.28,0,0.42\nc0.61-0.11,1.06-0.62,1.12-1.23c0-0.74-1.15-1.67-1.52-2.08h0.13c1.25,0,1.5,0.42,1.63,0.73c0.4-0.35,0.63-0.85,0.62-1.38\nc0-0.35-0.07-0.75-0.75-0.75c-0.78,0.02-1.55,0.09-2.32,0.22c-0.76-1.02-1.43-2.1-2-3.23c0.3,0.04,0.6,0.06,0.9,0.05\nc0.19,0.01,0.39-0.02,0.57-0.08c-2.07-1.79-3.8-4.12-3.8-6.76c0.02-0.44,0.1-0.88,0.24-1.3h0.16l5.24,8.39\nc1.57,2.48,2.8,2.43,4.65,2.43c-1.19-0.97-2.21-2.14-3-3.45l-4.92-7.87c0.27-0.08,0.53-0.18,0.79-0.28l4.35,7\nc1.57,2.48,2.8,2.44,4.65,2.44c-1.19-0.97-2.21-2.14-3-3.45l-4.23-6.77c0.24-0.13,0.48-0.27,0.7-0.41l3.42,5.55\nc1.57,2.49,2.8,2.44,4.65,2.44c-1.19-0.97-2.21-2.13-3-3.45l-3.55-5.69c0.2-0.18,0.4-0.38,0.59-0.58l2.52,4\nc1.57,2.48,2.8,2.44,4.65,2.44c-1.2-0.97-2.21-2.14-3-3.46l-2.99-4.7c0.16-0.29,0.29-0.59,0.4-0.9L31.25,12.23z\"\n\t></path>\n);\n\n@Component({\n\ttag: 'kol-logo',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolLogo implements API {\n\t/**\n\t * Gibt die Abkürzung eines Ministeriums, eines Amts oder einer Bundesanstalt an.\n\t */\n\t@Prop() public _org!: Bundesministerium | Bundesamt | Bundesanstalt;\n\n\t@State() public state: States = {\n\t\t_org: Bundesanstalt['Informationstechnikzentrum Bund'],\n\t};\n\n\t@Watch('_org')\n\tpublic validateOrg(value?: Bundesministerium | Bundesamt | Bundesanstalt): void {\n\t\tif (typeof value === 'string' && ENUM_AS_MAP.has(value)) {\n\t\t\tsetState(this, '_org', value);\n\t\t} else {\n\t\t\tdevHint(`Die verwendete Abkürzung (${value as string}) ist nicht definiert!`);\n\t\t}\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateOrg(this._org);\n\t}\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<svg\n\t\t\t\taria-label={translate('kol-logo-description', { placeholders: { orgShort: this.state._org, orgLong: getAriaLabel(this.state._org) } })}\n\t\t\t\trole=\"img\"\n\t\t\t\tviewBox=\"0 0 225 100\"\n\t\t\t>\n\t\t\t\t<rect width=\"100%\" height=\"100%\" fill=\"white\"></rect>\n\t\t\t\t<svg x=\"0\" y=\"4\" height=\"75\">\n\t\t\t\t\t<Adler />\n\t\t\t\t</svg>\n\t\t\t\t<svg x=\"40.5\" y=\"3.5\" height=\"100\">\n\t\t\t\t\t<rect width=\"5\" height=\"30\"></rect>\n\t\t\t\t\t<rect y=\"30\" width=\"5\" height=\"30\" fill=\"red\"></rect>\n\t\t\t\t\t<rect y=\"60\" width=\"5\" height=\"30\" fill=\"#fc0\"></rect>\n\t\t\t\t</svg>\n\t\t\t\t<svg x=\"50\" y=\"0\">\n\t\t\t\t\t<text x=\"0\" y=\"-0.05em\" font-family=\"BundesSans Web\" style={{ backgroundColor: 'white', color: 'black' }}>\n\t\t\t\t\t\t{BUND_LOGO_TEXT_MAP.has(this.state._org) ? (\n\t\t\t\t\t\t\t<tspan>\n\t\t\t\t\t\t\t\t{BUND_LOGO_TEXT_MAP.get(this.state._org)?.map((text: string, index: number) => {\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t<tspan x=\"0\" dy=\"1.1em\" key={`kol-logo-text-${index}`}>\n\t\t\t\t\t\t\t\t\t\t\t{text}\n\t\t\t\t\t\t\t\t\t\t</tspan>\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</tspan>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<tspan fill=\"red\">\n\t\t\t\t\t\t\t\t<tspan x=\"0\" dy=\"1.1em\">\n\t\t\t\t\t\t\t\t\tDer Schlüsselwert\n\t\t\t\t\t\t\t\t</tspan>\n\t\t\t\t\t\t\t\t<tspan x=\"0\" dy=\"1.1em\" font-weight=\"bold\">\n\t\t\t\t\t\t\t\t\t'{this.state._org}'\n\t\t\t\t\t\t\t\t</tspan>\n\t\t\t\t\t\t\t\t<tspan x=\"0\" dy=\"1.1em\">\n\t\t\t\t\t\t\t\t\tist nicht definiert.\n\t\t\t\t\t\t\t\t</tspan>\n\t\t\t\t\t\t\t\t<tspan x=\"0\" dy=\"1.1em\">\n\t\t\t\t\t\t\t\t\toder freigegeben.\n\t\t\t\t\t\t\t\t</tspan>\n\t\t\t\t\t\t\t</tspan>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</text>\n\t\t\t\t</svg>\n\t\t\t</svg>\n\t\t);\n\t}\n}\n"],"version":3}

package/dist/components/kol-modal.js

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";import{v as validateLabel}from"./label.js";import{P as getKoliBri,w as watchValidator,q as featureHint,t as setState,b as watchString}from"./prop.validators.js";const defaultStyleCss=":host{--a11y-min-size:44px;font-size:inherit}*{font-family:Verdana;hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.overlay{background-color:rgba(0, 0, 0, 0.33);display:flex;height:100%;inset:0;position:fixed;width:100%;z-index:100}.modal{margin:auto;max-height:100%;max-width:100%}",KolModal$1=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.__attachShadow(),this.onKeyDown=t=>{t&&"Escape"===t.code&&(this._activeElement=null)},this._activeElement=void 0,this._label=void 0,this._on=void 0,this._width="100%",this.state={_activeElement:null,_label:"…",_width:"100%"}}componentDidRender(){this.hostElement&&(this.state._activeElement?getKoliBri().Modal.openModal(this.hostElement,this.state._activeElement):getKoliBri().Modal.closeModal(this.hostElement))}disconnectedCallback(){this.hostElement&&getKoliBri().Modal.closeModal(this.hostElement)}render(){return h(Host,{ref:t=>{this.hostElement=t}},this.state._activeElement&&h("div",{class:"overlay"},h("div",{class:"modal",style:{width:this.state._width},"aria-label":this.state._label,"aria-modal":"true",role:"dialog",onKeyDown:this.onKeyDown,ref:t=>{t&&(t.setAttribute("tabindex","0"),setTimeout((()=>t.focus()),250))}},h("slot",null))))}validateActiveElement(t){watchValidator(this,"_activeElement",(t=>"object"==typeof t||null===t),new Set(["HTMLElement","null"]),t,{defaultValue:null,hooks:{afterPatch:()=>{var t;null===this._activeElement&&(null===(t=this.state._on)||void 0===t?void 0:t.onClose)&&this.state._on.onClose()}}})}validateLabel(t){validateLabel(this,t)}validateOn(t){if("object"==typeof t&&null!==t){featureHint("[KolTabs] Prüfen, wie man auch einen EventCallback einzeln ändern kann.");const e={};"function"!=typeof t.onClose&&!0!==t.onClose||(e.onClose=t.onClose),setState(this,"_on",e)}}validateWidth(t){watchString(this,"_width",t,{defaultValue:"100%"})}componentWillLoad(){this.validateActiveElement(this._activeElement),this.validateLabel(this._label),this.validateOn(this._on),this.validateWidth(this._width)}static get watchers(){return{_activeElement:["validateActiveElement"],_label:["validateLabel"],_on:["validateOn"],_width:["validateWidth"]}}static get style(){return{default:defaultStyleCss}}},[33,"kol-modal",{_activeElement:[1040],_label:[1],_on:[16],_width:[1],state:[32]},void 0,{_activeElement:["validateActiveElement"],_label:["validateLabel"],_on:["validateOn"],_width:["validateWidth"]}]);function defineCustomElement$1(){if("undefined"==typeof customElements)return;["kol-modal"].forEach((t=>{if("kol-modal"===t)customElements.get(t)||customElements.define(t,KolModal$1)}))}const KolModal=KolModal$1,defineCustomElement=defineCustomElement$1;export{KolModal,defineCustomElement};
+import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";import{v as validateLabel}from"./label.js";import{O as getKoliBri,w as watchValidator,q as featureHint,v as setState,b as watchString}from"./prop.validators.js";const defaultStyleCss="/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n\t:host {\n\t\t/*\n\t\t * Minimum size of interactive elements.\n\t\t */\n\t\t--a11y-min-size: 44px;\n\t\t/*\n\t\t * Verdana is an accessible font that can be used without requiring additional loading time.\n\t\t */\n\t\tfont-family: Verdana;\n\t}\n\n\t* {\n\t\t/*\n\t\t * This rule enables the word dividing for all texts. That is important for high zoom levels.\n\t\t */\n\t\thyphens: auto;\n\t\t/*\n\t\t * Letter spacing is required for all texts.\n\t\t */\n\t\tletter-spacing: inherit;\n\t\t/*\n\t\t * This rule enables the word dividing for all texts. That is important for high zoom levels.\n\t\t */\n\t\tword-break: break-word;\n\t\t/*\n\t\t * Word spacing is required for all texts.\n\t\t */\n\t\tword-spacing: inherit;\n\t}\n\n\t/*\n\t * All interactive elements should have a minimum size of 44px.\n\t */\n\t/* input:not([type='checkbox'], [type='radio'], [type='range']), */\n\t/* option, */\n\t/* select, */\n\t/* textarea, */\n\t[role='button'],\n\tbutton:not([role='link']),\n\tkol-input .input {\n\t\tmin-height: var(--a11y-min-size);\n\t\tmin-width: var(--a11y-min-size);\n\t}\n\n\t/*\n\t * Some interactive elements should not inherit the font-family and font-size.\n\t */\n\ta,\n\tbutton,\n\th1,\n\th2,\n\th3,\n\th4,\n\th5,\n\th6,\n\tinput,\n\toption,\n\tselect,\n\ttextarea {\n\t\t/*\n\t\t * All elements should inherit the font family from his parent element.\n\t\t */\n\t\tfont-family: inherit;\n\t\t/*\n\t\t * All elements should inherit the font size from his parent element.\n\t\t */\n\t\tfont-size: inherit;\n\t}\n}\n\n@layer kol-global {\n\t/*\n\t * Dieses CSS stellt sicher, dass der Standard-Style\n\t * von A und Button resettet werden.\n\t */\n\t:is(a, button) {\n\t\tbackground-color: transparent;\n\t\tborder: none;\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t\twidth: 100%; /* 100% needed for custom width from outside */\n\t}\n}\n\n@layer kol-global {\n\t:host {\n\t\t/*\n\t\t * The max-width is needed to prevent the table from overflowing the\n\t\t * parent node, if the table is wider than the parent node.\n\t\t */\n\t\tmax-width: 100%;\n\t}\n\n\t* {\n\t\t/*\n\t\t * We prefer to box-sizing: border-box for all elements.\n\t\t */\n\t\tbox-sizing: border-box;\n\t}\n\n\t/* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n\tkol-span-wc {\n\t\tdisplay: grid;\n\t\tplace-items: center;\n\t}\n\n\t/* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n\tkol-span-wc > span {\n\t\tdisplay: flex;\n\t\tplace-items: center;\n\t}\n\n\ta,\n\tbutton {\n\t\tcursor: pointer;\n\t}\n\n\t/* This is the text label. */\n\t.icon-only > kol-span-wc > span > span {\n\t\tdisplay: none;\n\t}\n}\n\n@layer kol-component {\n\t.overlay {\n\t\tbackground-color: rgba(0, 0, 0, 0.33);\n\t\tdisplay: flex;\n\t\theight: 100%;\n\t\tinset: 0;\n\t\tposition: fixed;\n\t\twidth: 100%;\n\t\tz-index: 100;\n\t}\n\n\t.modal {\n\t\tmargin: auto;\n\t\tmax-height: 100%;\n\t\tmax-width: 100%;\n\t}\n}\n",KolModal$1=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.__attachShadow(),this.onKeyDown=t=>{t&&"Escape"===t.code&&(this._activeElement=null)},this._activeElement=void 0,this._label=void 0,this._on=void 0,this._width="100%",this.state={_activeElement:null,_label:"…",_width:"100%"}}componentDidRender(){this.hostElement&&(this.state._activeElement?getKoliBri().Modal.openModal(this.hostElement,this.state._activeElement):getKoliBri().Modal.closeModal(this.hostElement))}disconnectedCallback(){this.hostElement&&getKoliBri().Modal.closeModal(this.hostElement)}render(){return h(Host,{ref:t=>{this.hostElement=t}},this.state._activeElement&&h("div",{class:"overlay"},h("div",{class:"modal",style:{width:this.state._width},"aria-label":this.state._label,"aria-modal":"true",role:"dialog",onKeyDown:this.onKeyDown,ref:t=>{t&&(t.setAttribute("tabindex","0"),setTimeout((()=>t.focus()),250))}},h("slot",null))))}validateActiveElement(t){watchValidator(this,"_activeElement",(t=>"object"==typeof t||null===t),new Set(["HTMLElement","null"]),t,{defaultValue:null,hooks:{afterPatch:()=>{var t;null===this._activeElement&&(null===(t=this.state._on)||void 0===t?void 0:t.onClose)&&this.state._on.onClose()}}})}validateLabel(t){validateLabel(this,t)}validateOn(t){if("object"==typeof t&&null!==t){featureHint("[KolTabs] Prüfen, wie man auch einen EventCallback einzeln ändern kann.");const e={};"function"!=typeof t.onClose&&!0!==t.onClose||(e.onClose=t.onClose),setState(this,"_on",e)}}validateWidth(t){watchString(this,"_width",t,{defaultValue:"100%"})}componentWillLoad(){this.validateActiveElement(this._activeElement),this.validateLabel(this._label),this.validateOn(this._on),this.validateWidth(this._width)}static get watchers(){return{_activeElement:["validateActiveElement"],_label:["validateLabel"],_on:["validateOn"],_width:["validateWidth"]}}static get style(){return{default:defaultStyleCss}}},[33,"kol-modal",{_activeElement:[1040],_label:[1],_on:[16],_width:[1],state:[32]},void 0,{_activeElement:["validateActiveElement"],_label:["validateLabel"],_on:["validateOn"],_width:["validateWidth"]}]);function defineCustomElement$1(){if("undefined"==typeof customElements)return;["kol-modal"].forEach((t=>{if("kol-modal"===t)customElements.get(t)||customElements.define(t,KolModal$1)}))}const KolModal=KolModal$1,defineCustomElement=defineCustomElement$1;export{KolModal,defineCustomElement};

package/dist/components/kol-modal.js.map

@@ -1 +1 @@
-{"file":"kol-modal.js","mappings":"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","names":["KolModal"],"sources":["src/components/modal/style.css?tag=kol-modal&mode=default&encapsulation=shadow","src/components/modal/component.tsx"],"sourcesContent":["@import url(../style.css);\n.overlay {\n\tbackground-color: rgba(0, 0, 0, 0.33);\n\tdisplay: flex;\n\theight: 100%;\n\tinset: 0;\n\tposition: fixed;\n\twidth: 100%;\n\tz-index: 100;\n}\n.modal {\n\tmargin: auto;\n\tmax-height: 100%;\n\tmax-width: 100%;\n}\n","/* eslint-disable jsx-a11y/no-noninteractive-element-interactions */\nimport { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { KoliBriModalEventCallbacks } from '../../types/modal';\nimport { LabelPropType, validateLabel } from '../../types/props/label';\nimport { featureHint } from '../../utils/a11y.tipps';\nimport { getKoliBri } from '../../utils/dev.utils';\nimport { setState, watchString, watchValidator } from '../../utils/prop.validators';\nimport { ModalService } from './service';\nimport { API, States } from './types';\n\n/**\n * https://en.wikipedia.org/wiki/Modal_window\n * @deprecated use the native <dialog> instead\n */\n\n/**\n * @slot - Der Inhalt des Modals.\n */\n@Component({\n\ttag: 'kol-modal',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolModal implements API {\n\tprivate hostElement?: HTMLElement;\n\n\tpublic componentDidRender(): void {\n\t\tif (this.hostElement /* SSR instanceof HTMLElement */) {\n\t\t\tif (this.state._activeElement /* SSR instanceof HTMLElement */) {\n\t\t\t\t(getKoliBri().Modal as ModalService).openModal(this.hostElement, this.state._activeElement);\n\t\t\t} else {\n\t\t\t\t(getKoliBri().Modal as ModalService).closeModal(this.hostElement);\n\t\t\t}\n\t\t}\n\t}\n\n\tpublic disconnectedCallback(): void {\n\t\tif (this.hostElement /* SSR instanceof HTMLElement */) {\n\t\t\t(getKoliBri().Modal as ModalService).closeModal(this.hostElement);\n\t\t}\n\t}\n\n\tprivate readonly onKeyDown = (event: KeyboardEvent) => {\n\t\tif (event && event.code === 'Escape') {\n\t\t\tthis._activeElement = null;\n\t\t}\n\t};\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tref={(el) => {\n\t\t\t\t\tthis.hostElement = el as HTMLElement;\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{this.state._activeElement /* SSR instanceof HTMLElement */ && (\n\t\t\t\t\t<div class=\"overlay\">\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclass=\"modal\"\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\twidth: this.state._width,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\taria-label={this.state._label}\n\t\t\t\t\t\t\taria-modal=\"true\"\n\t\t\t\t\t\t\trole=\"dialog\"\n\t\t\t\t\t\t\tonKeyDown={this.onKeyDown}\n\t\t\t\t\t\t\tref={(el) => {\n\t\t\t\t\t\t\t\tif (el /* SSR instanceof HTMLElement */) {\n\t\t\t\t\t\t\t\t\tel.setAttribute('tabindex', '0');\n\t\t\t\t\t\t\t\t\tsetTimeout(() => el.focus(), 250);\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<slot />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Gibt die Referenz auf das auslösende HTML-Element an, wodurch das Modal geöffnet wurde.\n\t */\n\t@Prop({ mutable: true }) public _activeElement?: HTMLElement | null;\n\n\t/**\n\t * Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.).\n\t */\n\t@Prop() public _label!: LabelPropType;\n\n\t/**\n\t * Gibt die EventCallback-Function für das Schließen des Modals an.\n\t */\n\t@Prop() public _on?: KoliBriModalEventCallbacks;\n\n\t/**\n\t * Defines the width of the modal. (max-width: 100%)\n\t */\n\t@Prop() public _width?: string = '100%';\n\n\t@State() public state: States = {\n\t\t_activeElement: null,\n\t\t_label: '…', // ⚠ required\n\t\t_width: '100%',\n\t};\n\n\t@Watch('_activeElement')\n\tpublic validateActiveElement(value?: HTMLElement | null): void {\n\t\twatchValidator(this, '_activeElement', (value): boolean => typeof value === 'object' || value === null, new Set(['HTMLElement', 'null']), value, {\n\t\t\tdefaultValue: null,\n\t\t\thooks: {\n\t\t\t\tafterPatch: () => {\n\t\t\t\t\t/* Call onClose event in the _activeElement watcher because activeElement can be set internally and from the outside and closes the modal when set to null. */\n\t\t\t\t\tif (this._activeElement === null && this.state._on?.onClose) {\n\t\t\t\t\t\tthis.state._on.onClose();\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t},\n\t\t});\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: LabelPropType): void {\n\t\tvalidateLabel(this, value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: KoliBriModalEventCallbacks): void {\n\t\tif (typeof value === 'object' && value !== null) {\n\t\t\tfeatureHint('[KolTabs] Prüfen, wie man auch einen EventCallback einzeln ändern kann.');\n\t\t\tconst callbacks: KoliBriModalEventCallbacks = {};\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<KoliBriModalEventCallbacks>(this, '_on', callbacks);\n\t\t}\n\t}\n\n\t@Watch('_width')\n\tpublic validateWidth(value?: string): void {\n\t\twatchString(this, '_width', value, {\n\t\t\tdefaultValue: '100%',\n\t\t});\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateActiveElement(this._activeElement);\n\t\tthis.validateLabel(this._label);\n\t\tthis.validateOn(this._on);\n\t\tthis.validateWidth(this._width);\n\t}\n}\n"],"version":3}
+{"file":"kol-modal.js","mappings":"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","names":["KolModal"],"sources":["src/components/modal/style.css?tag=kol-modal&mode=default&encapsulation=shadow","src/components/modal/component.tsx"],"sourcesContent":["@import url(../style.css);\n@layer kol-component {\n\t.overlay {\n\t\tbackground-color: rgba(0, 0, 0, 0.33);\n\t\tdisplay: flex;\n\t\theight: 100%;\n\t\tinset: 0;\n\t\tposition: fixed;\n\t\twidth: 100%;\n\t\tz-index: 100;\n\t}\n\n\t.modal {\n\t\tmargin: auto;\n\t\tmax-height: 100%;\n\t\tmax-width: 100%;\n\t}\n}\n","/* eslint-disable jsx-a11y/no-noninteractive-element-interactions */\nimport { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { KoliBriModalEventCallbacks } from '../../types/modal';\nimport { LabelPropType, validateLabel } from '../../types/props/label';\nimport { featureHint } from '../../utils/a11y.tipps';\nimport { getKoliBri } from '../../utils/dev.utils';\nimport { setState, watchString, watchValidator } from '../../utils/prop.validators';\nimport { ModalService } from './service';\nimport { API, States } from './types';\n\n/**\n * https://en.wikipedia.org/wiki/Modal_window\n * @deprecated use the native <dialog> instead\n */\n\n/**\n * @slot - Der Inhalt des Modals.\n */\n@Component({\n\ttag: 'kol-modal',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolModal implements API {\n\tprivate hostElement?: HTMLElement;\n\n\tpublic componentDidRender(): void {\n\t\tif (this.hostElement /* SSR instanceof HTMLElement */) {\n\t\t\tif (this.state._activeElement /* SSR instanceof HTMLElement */) {\n\t\t\t\t(getKoliBri().Modal as ModalService).openModal(this.hostElement, this.state._activeElement);\n\t\t\t} else {\n\t\t\t\t(getKoliBri().Modal as ModalService).closeModal(this.hostElement);\n\t\t\t}\n\t\t}\n\t}\n\n\tpublic disconnectedCallback(): void {\n\t\tif (this.hostElement /* SSR instanceof HTMLElement */) {\n\t\t\t(getKoliBri().Modal as ModalService).closeModal(this.hostElement);\n\t\t}\n\t}\n\n\tprivate readonly onKeyDown = (event: KeyboardEvent) => {\n\t\tif (event && event.code === 'Escape') {\n\t\t\tthis._activeElement = null;\n\t\t}\n\t};\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tref={(el) => {\n\t\t\t\t\tthis.hostElement = el as HTMLElement;\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{this.state._activeElement /* SSR instanceof HTMLElement */ && (\n\t\t\t\t\t<div class=\"overlay\">\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclass=\"modal\"\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\twidth: this.state._width,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\taria-label={this.state._label}\n\t\t\t\t\t\t\taria-modal=\"true\"\n\t\t\t\t\t\t\trole=\"dialog\"\n\t\t\t\t\t\t\tonKeyDown={this.onKeyDown}\n\t\t\t\t\t\t\tref={(el) => {\n\t\t\t\t\t\t\t\tif (el /* SSR instanceof HTMLElement */) {\n\t\t\t\t\t\t\t\t\tel.setAttribute('tabindex', '0');\n\t\t\t\t\t\t\t\t\tsetTimeout(() => el.focus(), 250);\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<slot />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Gibt die Referenz auf das auslösende HTML-Element an, wodurch das Modal geöffnet wurde.\n\t */\n\t@Prop({ mutable: true }) public _activeElement?: HTMLElement | null;\n\n\t/**\n\t * Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.).\n\t */\n\t@Prop() public _label!: LabelPropType;\n\n\t/**\n\t * Gibt die EventCallback-Function für das Schließen des Modals an.\n\t */\n\t@Prop() public _on?: KoliBriModalEventCallbacks;\n\n\t/**\n\t * Defines the width of the modal. (max-width: 100%)\n\t */\n\t@Prop() public _width?: string = '100%';\n\n\t@State() public state: States = {\n\t\t_activeElement: null,\n\t\t_label: '…', // ⚠ required\n\t\t_width: '100%',\n\t};\n\n\t@Watch('_activeElement')\n\tpublic validateActiveElement(value?: HTMLElement | null): void {\n\t\twatchValidator(this, '_activeElement', (value): boolean => typeof value === 'object' || value === null, new Set(['HTMLElement', 'null']), value, {\n\t\t\tdefaultValue: null,\n\t\t\thooks: {\n\t\t\t\tafterPatch: () => {\n\t\t\t\t\t/* Call onClose event in the _activeElement watcher because activeElement can be set internally and from the outside and closes the modal when set to null. */\n\t\t\t\t\tif (this._activeElement === null && this.state._on?.onClose) {\n\t\t\t\t\t\tthis.state._on.onClose();\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t},\n\t\t});\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: LabelPropType): void {\n\t\tvalidateLabel(this, value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: KoliBriModalEventCallbacks): void {\n\t\tif (typeof value === 'object' && value !== null) {\n\t\t\tfeatureHint('[KolTabs] Prüfen, wie man auch einen EventCallback einzeln ändern kann.');\n\t\t\tconst callbacks: KoliBriModalEventCallbacks = {};\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<KoliBriModalEventCallbacks>(this, '_on', callbacks);\n\t\t}\n\t}\n\n\t@Watch('_width')\n\tpublic validateWidth(value?: string): void {\n\t\twatchString(this, '_width', value, {\n\t\t\tdefaultValue: '100%',\n\t\t});\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateActiveElement(this._activeElement);\n\t\tthis.validateLabel(this._label);\n\t\tthis.validateOn(this._on);\n\t\tthis.validateWidth(this._width);\n\t}\n}\n"],"version":3}

package/dist/components/kol-nav.js

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";import{e as watchBoolean,w as watchValidator,G as a11yHintLabelingLandmarks,d as devHint}from"./prop.validators.js";import{v as validateHideLabel,d as defineCustomElement$3}from"./component2.js";import{v as validateLabel}from"./label.js";import{r as removeNavLabel,a as addNavLabel}from"./unique-nav-labels.js";import{w as watchNavLinks}from"./validation.js";import{d as defineCustomElement$7}from"./component11.js";import{d as defineCustomElement$6}from"./component5.js";import{d as defineCustomElement$5}from"./component.js";import{d as defineCustomElement$4}from"./component9.js";import{d as defineCustomElement$2}from"./component3.js";const validateCollapsible=(e,t)=>{watchBoolean(e,"_collapsible",t)},defaultStyleCss=":host{--a11y-min-size:44px;font-size:inherit}*{font-family:Verdana;hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}:host>div{display:grid;place-items:center}nav{width:100%}.list{display:flex;list-style:none;margin:0;padding:0}.list.vertical{flex-direction:column}.entry{display:flex}.entry kol-button-wc:first-child,.entry kol-link-wc,.entry kol-span-wc{flex-grow:1}.entry kol-span-wc{justify-items:start}",KolNav$1=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.__attachShadow(),this.onClick=e=>{e._active=!e._active,this.state=Object.assign({},this.state)},this.hasActiveChild=e=>!!(Array.isArray(e._children)&&e._children.length>0)&&e._children.some(this.hasActiveChild),this.linkList=e=>h("ul",{class:"list "+(0===e.deep&&"horizontal"===e.orientation?" horizontal":" vertical"),"data-deep":e.deep},e.links.map(((t,a)=>this.li(e.collapsible,e.hideLabel,e.deep,a,t,e.orientation)))),this._ariaCurrentValue=!1,this._collapsible=!0,this._hideLabel=!1,this._label=void 0,this._links=void 0,this._orientation="vertical",this.state={_ariaCurrentValue:!1,_collapsible:!0,_hideLabel:!1,_label:"…",_links:[],_orientation:"vertical"}}entry(e,t,a,i,l){return h("div",{class:{entry:!0,"hide-label":t}},h("kol-button-link-text-switch",{_link:Object.assign(Object.assign({},i),{_hideLabel:t})}),a?this.expandButton(e,i,l):"")}expandButton(e,t,a){return h("kol-button-wc",{class:"expand-button",_ariaExpanded:a,_disabled:!e,_icons:"codicon codicon-"+(a?"remove":"add"),_hideLabel:!0,_label:`Untermenü zu ${t._label} ${a?"schließen":"öffnen"}`,_on:{onClick:()=>this.onClick(t)}})}li(e,t,a,i,l,n){const s=!!l._active,o=Array.isArray(l._children)&&l._children.length>0,r=o&&s;return h("li",{class:{active:s,expanded:r,"has-children":o},key:i},this.entry(e,t,o,l,s),r?h(this.linkList,{collapsible:e,hideLabel:t,deep:a+1,links:l._children||[],orientation:n}):"")}render(){const e=!0===this.state._collapsible,t=!0===this.state._hideLabel,a=this.state._orientation;return h(Host,null,h("div",{class:{[a]:!0}},h("nav",{"aria-label":this.state._label,id:"nav"},h(this.linkList,{collapsible:e,hideLabel:t,deep:0,links:this.state._links,orientation:a}))))}validateAriaCurrentValue(e){watchValidator(this,"_ariaCurrentValue",(e=>!0===e||"date"===e||"location"===e||"page"===e||"step"===e||"time"===e),new Set(["boolean","String {data, location, page, step, time}"]),e)}validateCollapsible(e){validateCollapsible(this,e)}validateHideLabel(e){validateHideLabel(this,e)}validateLabel(e,t,a=!1){a||removeNavLabel(this.state._label),validateLabel(this,e),a11yHintLabelingLandmarks(e),addNavLabel(this.state._label)}validateLinks(e){watchNavLinks("KolNav",this,e),devHint("[KolNav] Die Navigationsstruktur wird noch nicht rekursiv validiert.")}validateOrientation(e){watchValidator(this,"_orientation",(e=>"horizontal"===e||"vertical"===e),new Set(["Orientation {horizontal, vertical}"]),e,{defaultValue:"vertical"})}componentWillLoad(){this.validateAriaCurrentValue(this._ariaCurrentValue),this.validateCollapsible(this._collapsible),this.validateHideLabel(this._hideLabel),this.validateLabel(this._label,void 0,!0),this.validateLinks(this._links),this.validateOrientation(this._orientation)}disconnectedCallback(){removeNavLabel(this.state._label)}static get watchers(){return{_ariaCurrentValue:["validateAriaCurrentValue"],_collapsible:["validateCollapsible"],_hideLabel:["validateHideLabel"],_label:["validateLabel"],_links:["validateLinks"],_orientation:["validateOrientation"]}}static get style(){return{default:defaultStyleCss}}},[33,"kol-nav",{_ariaCurrentValue:[8,"_aria-current-value"],_collapsible:[4],_hideLabel:[4,"_hide-label"],_label:[1],_links:[1],_orientation:[1],state:[32]},void 0,{_ariaCurrentValue:["validateAriaCurrentValue"],_collapsible:["validateCollapsible"],_hideLabel:["validateHideLabel"],_label:["validateLabel"],_links:["validateLinks"],_orientation:["validateOrientation"]}]);function defineCustomElement$1(){if("undefined"==typeof customElements)return;["kol-nav","kol-button-link-text-switch","kol-button-wc","kol-icon","kol-link-wc","kol-span-wc","kol-tooltip-wc"].forEach((e=>{switch(e){case"kol-nav":customElements.get(e)||customElements.define(e,KolNav$1);break;case"kol-button-link-text-switch":customElements.get(e)||defineCustomElement$7();break;case"kol-button-wc":customElements.get(e)||defineCustomElement$6();break;case"kol-icon":customElements.get(e)||defineCustomElement$5();break;case"kol-link-wc":customElements.get(e)||defineCustomElement$4();break;case"kol-span-wc":customElements.get(e)||defineCustomElement$3();break;case"kol-tooltip-wc":customElements.get(e)||defineCustomElement$2()}}))}const KolNav=KolNav$1,defineCustomElement=defineCustomElement$1;export{KolNav,defineCustomElement};
+import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";import{a as translate}from"./i18n.js";import{e as watchBoolean,z as devWarning,G as a11yHintLabelingLandmarks,d as devHint,w as watchValidator}from"./prop.validators.js";import{a as validateHideLabel,d as defineCustomElement$3}from"./component2.js";import{v as validateLabel}from"./label.js";import{r as removeNavLabel,a as addNavLabel}from"./unique-nav-labels.js";import{w as watchNavLinks}from"./validation.js";import{d as defineCustomElement$8}from"./shadow3.js";import{d as defineCustomElement$7}from"./component11.js";import{d as defineCustomElement$6}from"./component5.js";import{d as defineCustomElement$5}from"./component.js";import{d as defineCustomElement$4}from"./component9.js";import{d as defineCustomElement$2}from"./component3.js";const validateCollapsible=(t,e)=>{watchBoolean(t,"_collapsible",e)},validateHasCompactButton=(t,e)=>{watchBoolean(t,"_hasCompactButton",e)},defaultStyleCss="/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n\t:host {\n\t\t/*\n\t\t * Minimum size of interactive elements.\n\t\t */\n\t\t--a11y-min-size: 44px;\n\t\t/*\n\t\t * Verdana is an accessible font that can be used without requiring additional loading time.\n\t\t */\n\t\tfont-family: Verdana;\n\t}\n\n\t* {\n\t\t/*\n\t\t * This rule enables the word dividing for all texts. That is important for high zoom levels.\n\t\t */\n\t\thyphens: auto;\n\t\t/*\n\t\t * Letter spacing is required for all texts.\n\t\t */\n\t\tletter-spacing: inherit;\n\t\t/*\n\t\t * This rule enables the word dividing for all texts. That is important for high zoom levels.\n\t\t */\n\t\tword-break: break-word;\n\t\t/*\n\t\t * Word spacing is required for all texts.\n\t\t */\n\t\tword-spacing: inherit;\n\t}\n\n\t/*\n\t * All interactive elements should have a minimum size of 44px.\n\t */\n\t/* input:not([type='checkbox'], [type='radio'], [type='range']), */\n\t/* option, */\n\t/* select, */\n\t/* textarea, */\n\t[role='button'],\n\tbutton:not([role='link']),\n\tkol-input .input {\n\t\tmin-height: var(--a11y-min-size);\n\t\tmin-width: var(--a11y-min-size);\n\t}\n\n\t/*\n\t * Some interactive elements should not inherit the font-family and font-size.\n\t */\n\ta,\n\tbutton,\n\th1,\n\th2,\n\th3,\n\th4,\n\th5,\n\th6,\n\tinput,\n\toption,\n\tselect,\n\ttextarea {\n\t\t/*\n\t\t * All elements should inherit the font family from his parent element.\n\t\t */\n\t\tfont-family: inherit;\n\t\t/*\n\t\t * All elements should inherit the font size from his parent element.\n\t\t */\n\t\tfont-size: inherit;\n\t}\n}\n\n@layer kol-global {\n\t/*\n\t * Dieses CSS stellt sicher, dass der Standard-Style\n\t * von A und Button resettet werden.\n\t */\n\t:is(a, button) {\n\t\tbackground-color: transparent;\n\t\tborder: none;\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t\twidth: 100%; /* 100% needed for custom width from outside */\n\t}\n}\n\n@layer kol-global {\n\t:host {\n\t\t/*\n\t\t * The max-width is needed to prevent the table from overflowing the\n\t\t * parent node, if the table is wider than the parent node.\n\t\t */\n\t\tmax-width: 100%;\n\t}\n\n\t* {\n\t\t/*\n\t\t * We prefer to box-sizing: border-box for all elements.\n\t\t */\n\t\tbox-sizing: border-box;\n\t}\n\n\t/* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n\tkol-span-wc {\n\t\tdisplay: grid;\n\t\tplace-items: center;\n\t}\n\n\t/* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n\tkol-span-wc > span {\n\t\tdisplay: flex;\n\t\tplace-items: center;\n\t}\n\n\ta,\n\tbutton {\n\t\tcursor: pointer;\n\t}\n\n\t/* This is the text label. */\n\t.icon-only > kol-span-wc > span > span {\n\t\tdisplay: none;\n\t}\n}\n\n@layer kol-component {\n\t:host > div {\n\t\tdisplay: grid;\n\t\tplace-items: center;\n\t}\n\n\tnav {\n\t\twidth: 100%;\n\t}\n\n\t.list {\n\t\tdisplay: flex;\n\t\tlist-style: none;\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t}\n\n\t.list.vertical {\n\t\tflex-direction: column;\n\t}\n\n\t.entry {\n\t\tdisplay: flex;\n\t}\n\n\t.button-link-text-switch {\n\t\tflex-grow: 1;\n\t}\n\n\t.entry kol-span-wc {\n\t\tjustify-items: start;\n\t}\n}\n",KolNav$1=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.__attachShadow(),this.onClick=t=>{t._active=!t._active,this.state=Object.assign({},this.state)},this.hasActiveChild=t=>!!(Array.isArray(t._children)&&t._children.length>0)&&t._children.some(this.hasActiveChild),this.linkList=t=>h("ul",{class:"list "+(0===t.deep&&"horizontal"===t.orientation?" horizontal":" vertical"),"data-deep":t.deep},t.links.map(((e,n)=>this.li(t.collapsible,t.hideLabel,t.deep,n,e,t.orientation)))),this._collapsible=!0,this._hasCompactButton=!1,this._hideLabel=!1,this._label=void 0,this._links=void 0,this._orientation="vertical",this.state={_collapsible:!0,_hasCompactButton:!1,_hideLabel:!1,_label:"…",_links:[],_orientation:"vertical"}}entry(t,e,n,i,a){return h("div",{class:{entry:!0,"hide-label":e}},h("kol-button-link-text-switch",{class:"button-link-text-switch",_link:Object.assign(Object.assign({},i),{_hideLabel:e})}),n?this.expandButton(t,i,a):"")}expandButton(t,e,n){return h("kol-button-wc",{class:"expand-button",_ariaExpanded:n,_disabled:!t,_icons:"codicon codicon-"+(n?"remove":"add"),_hideLabel:!0,_label:`Untermenü zu ${e._label} ${n?"schließen":"öffnen"}`,_on:{onClick:()=>this.onClick(e)}})}li(t,e,n,i,a,l){const o=!!a._active,s=Array.isArray(a._children)&&a._children.length>0,r=s&&o;return h("li",{class:{active:o,expanded:r,"has-children":s},key:i},this.entry(t,e,s,a,o),r?h(this.linkList,{collapsible:t,hideLabel:e,deep:n+1,links:a._children||[],orientation:l}):"")}render(){let t=this.state._hasCompactButton;"horizontal"===this.state._orientation&&!0===this.state._hasCompactButton&&(t=!1,devWarning("[KolNav] Wenn eine horizontale Navigation verwendet wird, kann die Option _hasCompactButton nicht aktiviert werden."));const e=!0===this.state._collapsible,n=!0===this.state._hideLabel,i=this.state._orientation;return h(Host,null,h("div",{class:{[i]:!0}},h("nav",{"aria-label":this.state._label,id:"nav"},h(this.linkList,{collapsible:e,hideLabel:n,deep:0,links:this.state._links,orientation:i})),t&&h("div",{class:"compact"},h("kol-button",{_ariaControls:"nav",_ariaExpanded:!n,_icons:n?"codicon codicon-chevron-right":"codicon codicon-chevron-left",_hideLabel:!0,_label:translate(n?"kol-nav-maximize":"kol-nav-minimize"),_on:{onClick:()=>{this.state=Object.assign(Object.assign({},this.state),{_hideLabel:!1===this.state._hideLabel})}},_tooltipAlign:"right",_variant:"ghost"}))))}validateCollapsible(t){validateCollapsible(this,t)}validateHasCompactButton(t){validateHasCompactButton(this,t)}validateHideLabel(t){validateHideLabel(this,t)}validateLabel(t,e,n=!1){n||removeNavLabel(this.state._label),validateLabel(this,t),a11yHintLabelingLandmarks(t),addNavLabel(this.state._label)}validateLinks(t){watchNavLinks("KolNav",this,t),devHint("[KolNav] Die Navigationsstruktur wird noch nicht rekursiv validiert.")}validateOrientation(t){watchValidator(this,"_orientation",(t=>"horizontal"===t||"vertical"===t),new Set(["Orientation {horizontal, vertical}"]),t,{defaultValue:"vertical"})}componentWillLoad(){this.validateCollapsible(this._collapsible),this.validateHideLabel(this._hideLabel),this.validateHasCompactButton(this._hasCompactButton),this.validateLabel(this._label,void 0,!0),this.validateLinks(this._links),this.validateOrientation(this._orientation)}disconnectedCallback(){removeNavLabel(this.state._label)}static get watchers(){return{_collapsible:["validateCollapsible"],_hasCompactButton:["validateHasCompactButton"],_hideLabel:["validateHideLabel"],_label:["validateLabel"],_links:["validateLinks"],_orientation:["validateOrientation"]}}static get style(){return{default:defaultStyleCss}}},[33,"kol-nav",{_collapsible:[4],_hasCompactButton:[4,"_has-compact-button"],_hideLabel:[4,"_hide-label"],_label:[1],_links:[1],_orientation:[1],state:[32]},void 0,{_collapsible:["validateCollapsible"],_hasCompactButton:["validateHasCompactButton"],_hideLabel:["validateHideLabel"],_label:["validateLabel"],_links:["validateLinks"],_orientation:["validateOrientation"]}]);function defineCustomElement$1(){if("undefined"==typeof customElements)return;["kol-nav","kol-button","kol-button-link-text-switch","kol-button-wc","kol-icon","kol-link-wc","kol-span-wc","kol-tooltip-wc"].forEach((t=>{switch(t){case"kol-nav":customElements.get(t)||customElements.define(t,KolNav$1);break;case"kol-button":customElements.get(t)||defineCustomElement$8();break;case"kol-button-link-text-switch":customElements.get(t)||defineCustomElement$7();break;case"kol-button-wc":customElements.get(t)||defineCustomElement$6();break;case"kol-icon":customElements.get(t)||defineCustomElement$5();break;case"kol-link-wc":customElements.get(t)||defineCustomElement$4();break;case"kol-span-wc":customElements.get(t)||defineCustomElement$3();break;case"kol-tooltip-wc":customElements.get(t)||defineCustomElement$2()}}))}const KolNav=KolNav$1,defineCustomElement=defineCustomElement$1;export{KolNav,defineCustomElement};

package/dist/components/kol-nav.js.map

@@ -1 +1 @@
-{"file":"kol-nav.js","mappings":"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","names":["KolNav"],"sources":["src/types/props/collapsible.ts","src/components/nav/style.css?tag=kol-nav&mode=default&encapsulation=shadow","src/components/nav/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\n\nimport { watchBoolean } from '../../utils/prop.validators';\n\n/* types */\nexport type CollapsiblePropType = boolean;\n\n/**\n * Defines if navigation nodes can be collapsed or not.\n */\nexport type PropCollapsible = {\n\tcollapsible: CollapsiblePropType;\n};\n\n/* validator */\nexport const validateCollapsible = (component: Generic.Element.Component, value?: CollapsiblePropType): void => {\n\twatchBoolean(component, '_collapsible', value);\n};\n","@import url(../style.css);\n:host > div {\n\tdisplay: grid;\n\tplace-items: center;\n}\nnav {\n\twidth: 100%;\n}\n.list {\n\tdisplay: flex;\n\tlist-style: none;\n\tmargin: 0;\n\tpadding: 0;\n}\n.list.vertical {\n\tflex-direction: column;\n}\n.entry {\n\tdisplay: flex;\n}\n.entry kol-button-wc:first-child,\n.entry kol-link-wc,\n.entry kol-span-wc {\n\tflex-grow: 1;\n}\n.entry kol-span-wc {\n\tjustify-items: start;\n}\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\nimport { ButtonOrLinkOrTextWithChildrenProps, ButtonWithChildrenProps } from '../../types/button-link-text';\nimport { Stringified } from '../../types/common';\nimport { Orientation } from '../../types/orientation';\nimport { AriaCurrentPropType } from '../../types/props/aria-current';\nimport { CollapsiblePropType, validateCollapsible } from '../../types/props/collapsible';\nimport { HideLabelPropType, validateHideLabel } from '../../types/props/hide-label';\nimport { LabelPropType, validateLabel } from '../../types/props/label';\nimport { a11yHintLabelingLandmarks, devHint } from '../../utils/a11y.tipps';\nimport { watchValidator } from '../../utils/prop.validators';\nimport { addNavLabel, removeNavLabel } from '../../utils/unique-nav-labels';\nimport { API, States } from './types';\nimport { watchNavLinks } from './validation';\n\nconst linkValidator = (link: ButtonOrLinkOrTextWithChildrenProps): boolean => {\n\tif (typeof link === 'object' && typeof link._label === 'string' /* && typeof newLink._href === 'string' */) {\n\t\tif (Array.isArray(link._children)) {\n\t\t\treturn linksValidator(link._children);\n\t\t}\n\t\treturn false;\n\t}\n\treturn true;\n};\n\nconst linksValidator = (links: ButtonOrLinkOrTextWithChildrenProps[]): boolean => {\n\tif (Array.isArray(links)) {\n\t\treturn links.find(linkValidator) !== undefined;\n\t}\n\treturn true;\n};\n\n@Component({\n\ttag: 'kol-nav',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolNav implements API {\n\tprivate readonly onClick = (link: ButtonOrLinkOrTextWithChildrenProps): void => {\n\t\tlink._active = !link._active;\n\t\tthis.state = {\n\t\t\t...this.state,\n\t\t};\n\t};\n\n\tprivate readonly hasActiveChild = (link: ButtonOrLinkOrTextWithChildrenProps): boolean => {\n\t\tif (Array.isArray(link._children) && link._children.length > 0) {\n\t\t\treturn link._children.some(this.hasActiveChild);\n\t\t}\n\n\t\treturn false;\n\t};\n\n\tprivate entry(\n\t\tcollapsible: boolean,\n\t\thideLabel: HideLabelPropType,\n\t\thasChildren: boolean,\n\t\tlink: ButtonOrLinkOrTextWithChildrenProps,\n\t\texpanded: boolean\n\t): JSX.Element {\n\t\treturn (\n\t\t\t<div class={{ entry: true, 'hide-label': hideLabel }}>\n\t\t\t\t<kol-button-link-text-switch\n\t\t\t\t\t_link={{\n\t\t\t\t\t\t...link,\n\t\t\t\t\t\t_hideLabel: hideLabel,\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t{hasChildren ? this.expandButton(collapsible, link as ButtonWithChildrenProps, expanded) : ''}\n\t\t\t</div>\n\t\t);\n\t}\n\n\tprivate expandButton(collapsible: boolean, link: ButtonWithChildrenProps, expanded: boolean): JSX.Element {\n\t\treturn (\n\t\t\t<kol-button-wc\n\t\t\t\tclass=\"expand-button\"\n\t\t\t\t_ariaExpanded={expanded}\n\t\t\t\t_disabled={!collapsible}\n\t\t\t\t_icons={'codicon codicon-' + (expanded ? 'remove' : 'add')}\n\t\t\t\t_hideLabel\n\t\t\t\t_label={`Untermenü zu ${link._label} ${expanded ? 'schließen' : 'öffnen'}`}\n\t\t\t\t_on={{ onClick: () => this.onClick(link) }}\n\t\t\t></kol-button-wc>\n\t\t);\n\t}\n\n\tprivate li(\n\t\tcollapsible: boolean,\n\t\thideLabel: HideLabelPropType,\n\t\tdeep: number,\n\t\tindex: number,\n\t\tlink: ButtonOrLinkOrTextWithChildrenProps,\n\t\torientation: Orientation\n\t): JSX.Element {\n\t\tconst active = !!link._active;\n\t\tconst hasChildren = Array.isArray(link._children) && link._children.length > 0;\n\t\tconst expanded = hasChildren && active;\n\t\treturn (\n\t\t\t<li\n\t\t\t\tclass={{\n\t\t\t\t\tactive,\n\t\t\t\t\texpanded,\n\t\t\t\t\t'has-children': hasChildren,\n\t\t\t\t}}\n\t\t\t\tkey={index}\n\t\t\t>\n\t\t\t\t{this.entry(collapsible, hideLabel, hasChildren, link, active)}\n\t\t\t\t{expanded ? (\n\t\t\t\t\t<this.linkList collapsible={collapsible} hideLabel={hideLabel} deep={deep + 1} links={link._children || []} orientation={orientation} />\n\t\t\t\t) : (\n\t\t\t\t\t''\n\t\t\t\t)}\n\t\t\t</li>\n\t\t);\n\t}\n\n\tprivate linkList = (props: {\n\t\tcollapsible: boolean;\n\t\thideLabel: HideLabelPropType;\n\t\tdeep: number;\n\t\tlinks: ButtonOrLinkOrTextWithChildrenProps[];\n\t\torientation: Orientation;\n\t}): JSX.Element => {\n\t\treturn (\n\t\t\t<ul class={`list ${props.deep === 0 && props.orientation === 'horizontal' ? ' horizontal' : ' vertical'}`} data-deep={props.deep}>\n\t\t\t\t{props.links.map((link, index: number) => {\n\t\t\t\t\treturn this.li(props.collapsible, props.hideLabel, props.deep, index, link, props.orientation);\n\t\t\t\t})}\n\t\t\t</ul>\n\t\t);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst collapsible = this.state._collapsible === true;\n\t\tconst hideLabel = this.state._hideLabel === true;\n\t\tconst orientation = this.state._orientation;\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[orientation]: true,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<nav aria-label={this.state._label} id=\"nav\">\n\t\t\t\t\t\t<this.linkList collapsible={collapsible} hideLabel={hideLabel} deep={0} links={this.state._links} orientation={orientation}></this.linkList>\n\t\t\t\t\t</nav>\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Defines the value of aria-current to be used with the current context within the navigation.\n\t */\n\t@Prop() public _ariaCurrentValue: AriaCurrentPropType = false;\n\n\t/**\n\t * Defines if navigation nodes can be collapsed or not. Enabled by default.\n\t * @TODO: Change type back to `CollapsiblePropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _collapsible?: boolean = true;\n\n\t/**\n\t * Hides the caption by default and displays the caption text with a tooltip when the\n\t * interactive element is focused or the mouse is over it.\n\t * @TODO: Change type back to `HideLabelPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _hideLabel?: boolean = false;\n\n\t/**\n\t * Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.).\n\t */\n\t@Prop() public _label!: LabelPropType;\n\n\t/**\n\t * Defines the list of links, buttons or texts to render.\n\t */\n\t@Prop() public _links!: Stringified<ButtonOrLinkOrTextWithChildrenProps[]>;\n\n\t/**\n\t * Defines whether the orientation of the component is horizontal or vertical.\n\t */\n\t@Prop() public _orientation?: Orientation = 'vertical';\n\n\t@State() public state: States = {\n\t\t_ariaCurrentValue: false,\n\t\t_collapsible: true,\n\t\t_hideLabel: false,\n\t\t_label: '…', // ⚠ required\n\t\t_links: [],\n\t\t_orientation: 'vertical',\n\t};\n\n\t@Watch('_ariaCurrentValue')\n\tpublic validateAriaCurrentValue(value?: AriaCurrentPropType): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_ariaCurrentValue',\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@Watch('_collapsible')\n\tpublic validateCollapsible(value?: CollapsiblePropType): void {\n\t\tvalidateCollapsible(this, value);\n\t}\n\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: HideLabelPropType) {\n\t\tvalidateHideLabel(this, value);\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: LabelPropType, _oldValue?: LabelPropType, initial = false): void {\n\t\tif (!initial) {\n\t\t\tremoveNavLabel(this.state._label); // remove the current\n\t\t}\n\t\tvalidateLabel(this, value);\n\t\ta11yHintLabelingLandmarks(value);\n\t\taddNavLabel(this.state._label); // add the state instead of prop, because the prop could be invalid and not set as new label\n\t}\n\n\t@Watch('_links')\n\tpublic validateLinks(value?: Stringified<ButtonOrLinkOrTextWithChildrenProps[]>): void {\n\t\twatchNavLinks('KolNav', this, value);\n\t\tdevHint(`[KolNav] Die Navigationsstruktur wird noch nicht rekursiv validiert.`);\n\t}\n\n\t@Watch('_orientation')\n\tpublic validateOrientation(value?: Orientation): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_orientation',\n\t\t\t(value): boolean => value === 'horizontal' || value === 'vertical',\n\t\t\tnew Set(['Orientation {horizontal, vertical}']),\n\t\t\tvalue,\n\t\t\t{\n\t\t\t\tdefaultValue: 'vertical',\n\t\t\t}\n\t\t);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAriaCurrentValue(this._ariaCurrentValue);\n\t\tthis.validateCollapsible(this._collapsible);\n\t\tthis.validateHideLabel(this._hideLabel);\n\t\tthis.validateLabel(this._label, undefined, true);\n\t\tthis.validateLinks(this._links);\n\t\tthis.validateOrientation(this._orientation);\n\t}\n\n\tpublic disconnectedCallback(): void {\n\t\tremoveNavLabel(this.state._label);\n\t}\n}\n\n// console.log(\n//   stringifyJson([\n//     { _label: '1 Navigationspunkt', _href: '#abc', _icons: 'codicon codicon-folder-closed', _target: 'asdasd' },\n//     { _label: '2 Navigationspunkt', _href: '#abc', _icons: 'codicon codicon-folder-closed' },\n//     {\n//       _active: true,\n//       _label: '3 Navigationspunkt',\n//       _href: '#abc',\n//       _icons: 'codicon codicon-folder-closed',\n//       _children: [\n//         { _label: '3.1 Navigationspunkt', _href: '#abc', _icons: 'codicon codicon-folder-closed' },\n//         { _label: '3.2 Navigationspunkt', _href: '#abc', _icons: 'codicon codicon-folder-closed', _target: 'asdasd' },\n//         {\n//           _active: true,\n//           _label: '3.3 Navigationspunkt',\n//           _href: '#abc',\n//           _children: [\n//             { _active: true, _label: '3.3.1 Navigationspunkt (aktiv)', _href: '#abc' },\n//             { _label: '3.3.2 Navigationspunkt', _href: '#abc' },\n//           ],\n//         },\n//         {\n//           _label: '3.4 Navigationspunkt',\n//           _href: '#abc',\n//           _children: [\n//             { _label: '3.4.1 Navigationspunkt', _href: '#abc' },\n//             { _label: '3.4.2 Navigationspunkt', _href: '#abc' },\n//           ],\n//         },\n//         { _label: '3.5 Navigationspunkt', _href: '#abc' },\n//       ],\n//     },\n//     { _label: '4 Navigationspunkt', _href: '#abc' },\n//   ])\n// );\n"],"version":3}
+{"file":"kol-nav.js","mappings":";;;;;;;;;;;;;;;;;AAeO,MAAM,mBAAmB,GAAG,CAAC,SAAoC,EAAE,KAA2B;EACpG,YAAY,CAAC,SAAS,EAAE,cAAc,EAAE,KAAK,CAAC,CAAC;AAChD,CAAC;;ACHM,MAAM,wBAAwB,GAAG,CAAC,SAAoC,EAAE,KAAgC;EAC9G,YAAY,CAAC,SAAS,EAAE,mBAAmB,EAAE,KAAK,CAAC,CAAC;AACrD,CAAC;;AChBD,MAAM,eAAe,GAAG,6pGAA6pG;;MCwCxqGA,QAAM;;;;;IACD,YAAO,GAAG,CAAC,IAAyC;MACpE,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC;MAC7B,IAAI,CAAC,KAAK,qBACN,IAAI,CAAC,KAAK,CACb,CAAC;KACF,CAAC;IAEe,mBAAc,GAAG,CAAC,IAAyC;MAC3E,IAAI,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,IAAI,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,EAAE;QAC/D,OAAO,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;OAChD;MAED,OAAO,KAAK,CAAC;KACb,CAAC;IAmEM,aAAQ,GAAG,CAAC,KAMnB;MACA,QACC,UAAI,KAAK,EAAE,QAAQ,KAAK,CAAC,IAAI,KAAK,CAAC,IAAI,KAAK,CAAC,WAAW,KAAK,YAAY,GAAG,aAAa,GAAG,WAAW,EAAE,eAAa,KAAK,CAAC,IAAI,IAC9H,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAa;QACpC,OAAO,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,WAAW,EAAE,KAAK,CAAC,SAAS,EAAE,KAAK,CAAC,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,CAAC,WAAW,CAAC,CAAC;OAC/F,CAAC,CACE,EACJ;KACF,CAAC;wBAmDsC,IAAI;6BAKC,KAAK;sBAOZ,KAAK;;;wBAeC,UAAU;iBAEtB;MAC/B,YAAY,EAAE,IAAI;MAClB,iBAAiB,EAAE,KAAK;MACxB,UAAU,EAAE,KAAK;MACjB,MAAM,EAAE,GAAG;MACX,MAAM,EAAE,EAAE;MACV,YAAY,EAAE,UAAU;KACxB;;EAtKO,KAAK,CACZ,WAAoB,EACpB,SAA4B,EAC5B,WAAoB,EACpB,IAAyC,EACzC,QAAiB;IAEjB,QACC,WAAK,KAAK,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,YAAY,EAAE,SAAS,EAAE,IACnD,mCACC,KAAK,EAAC,yBAAyB,EAC/B,KAAK,kCACD,IAAI,KACP,UAAU,EAAE,SAAS,MAErB,EACD,WAAW,GAAG,IAAI,CAAC,YAAY,CAAC,WAAW,EAAE,IAA+B,EAAE,QAAQ,CAAC,GAAG,EAAE,CACxF,EACL;GACF;EAEO,YAAY,CAAC,WAAoB,EAAE,IAA6B,EAAE,QAAiB;IAC1F,QACC,qBACC,KAAK,EAAC,eAAe,EACrB,aAAa,EAAE,QAAQ,EACvB,SAAS,EAAE,CAAC,WAAW,EACvB,MAAM,EAAE,kBAAkB,IAAI,QAAQ,GAAG,QAAQ,GAAG,KAAK,CAAC,EAC1D,UAAU,QACV,MAAM,EAAE,gBAAgB,IAAI,CAAC,MAAM,IAAI,QAAQ,GAAG,WAAW,GAAG,QAAQ,EAAE,EAC1E,GAAG,EAAE,EAAE,OAAO,EAAE,MAAM,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,GAC1B,EAChB;GACF;EAEO,EAAE,CACT,WAAoB,EACpB,SAA4B,EAC5B,IAAY,EACZ,KAAa,EACb,IAAyC,EACzC,WAAwB;IAExB,MAAM,MAAM,GAAG,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC;IAC9B,MAAM,WAAW,GAAG,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,IAAI,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,CAAC;IAC/E,MAAM,QAAQ,GAAG,WAAW,IAAI,MAAM,CAAC;IACvC,QACC,UACC,KAAK,EAAE;QACN,MAAM;QACN,QAAQ;QACR,cAAc,EAAE,WAAW;OAC3B,EACD,GAAG,EAAE,KAAK,IAET,IAAI,CAAC,KAAK,CAAC,WAAW,EAAE,SAAS,EAAE,WAAW,EAAE,IAAI,EAAE,MAAM,CAAC,EAC7D,QAAQ,IACR,EAAC,IAAI,CAAC,QAAQ,IAAC,WAAW,EAAE,WAAW,EAAE,SAAS,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,GAAG,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,SAAS,IAAI,EAAE,EAAE,WAAW,EAAE,WAAW,GAAI,KAExI,EAAE,CACF,CACG,EACJ;GACF;EAkBM,MAAM;IACZ,IAAI,gBAAgB,GAAG,IAAI,CAAC,KAAK,CAAC,iBAAiB,CAAC;IACpD,IAAI,IAAI,CAAC,KAAK,CAAC,YAAY,KAAK,YAAY,IAAI,IAAI,CAAC,KAAK,CAAC,iBAAiB,KAAK,IAAI,EAAE;MACtF,gBAAgB,GAAG,KAAK,CAAC;MACzB,UAAU,CAAC,qHAAqH,CAAC,CAAC;KAClI;IACD,MAAM,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,YAAY,KAAK,IAAI,CAAC;IACrD,MAAM,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACjD,MAAM,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC;IAC5C,QACC,EAAC,IAAI,QACJ,WACC,KAAK,EAAE;QACN,CAAC,WAAW,GAAG,IAAI;OACnB,IAED,yBAAiB,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE,EAAE,EAAC,KAAK,IAC3C,EAAC,IAAI,CAAC,QAAQ,IAAC,WAAW,EAAE,WAAW,EAAE,SAAS,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE,WAAW,EAAE,WAAW,GAAkB,CACvI,EACL,gBAAgB,KAChB,WAAK,KAAK,EAAC,SAAS,IACnB,kBACC,aAAa,EAAC,KAAK,EACnB,aAAa,EAAE,CAAC,SAAS,EACzB,MAAM,EAAE,SAAS,GAAG,+BAA+B,GAAG,8BAA8B,EACpF,UAAU,QACV,MAAM,EAAE,SAAS,CAAC,SAAS,GAAG,kBAAkB,GAAG,kBAAkB,CAAC,EACtE,GAAG,EAAE;QACJ,OAAO,EAAE;UACR,IAAI,CAAC,KAAK,mCACN,IAAI,CAAC,KAAK,KACb,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,KAAK,KAAK,GAC3C,CAAC;SACF;OACD,EACD,aAAa,EAAC,OAAO,EACrB,QAAQ,EAAC,OAAO,GACH,CACT,CACN,CACI,CACA,EACN;GACF;EA6CM,mBAAmB,CAAC,KAA2B;IACrD,mBAAmB,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;GACjC;EAGM,wBAAwB,CAAC,KAAe;IAC9C,wBAAwB,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;GACtC;EAGM,iBAAiB,CAAC,KAAyB;IACjD,iBAAiB,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;GAC/B;EAGM,aAAa,CAAC,KAAqB,EAAE,SAAyB,EAAE,OAAO,GAAG,KAAK;IACrF,IAAI,CAAC,OAAO,EAAE;MACb,cAAc,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;KAClC;IACD,aAAa,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;IAC3B,yBAAyB,CAAC,KAAK,CAAC,CAAC;IACjC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;GAC/B;EAGM,aAAa,CAAC,KAA0D;IAC9E,aAAa,CAAC,QAAQ,EAAE,IAAI,EAAE,KAAK,CAAC,CAAC;IACrC,OAAO,CAAC,sEAAsE,CAAC,CAAC;GAChF;EAGM,mBAAmB,CAAC,KAAmB;IAC7C,cAAc,CACb,IAAI,EACJ,cAAc,EACd,CAAC,KAAK,KAAc,KAAK,KAAK,YAAY,IAAI,KAAK,KAAK,UAAU,EAClE,IAAI,GAAG,CAAC,CAAC,oCAAoC,CAAC,CAAC,EAC/C,KAAK,EACL;MACC,YAAY,EAAE,UAAU;KACxB,CACD,CAAC;GACF;EAEM,iBAAiB;IACvB,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;IAC5C,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;IACxC,IAAI,CAAC,wBAAwB,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC;IACtD,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,MAAM,EAAE,SAAS,EAAE,IAAI,CAAC,CAAC;IACjD,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IAChC,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;GAC5C;EAEM,oBAAoB;IAC1B,cAAc,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;GAClC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["KolNav"],"sources":["src/types/props/collapsible.ts","src/types/props/has-compact-button.ts","src/components/nav/style.css?tag=kol-nav&mode=default&encapsulation=shadow","src/components/nav/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\n\nimport { watchBoolean } from '../../utils/prop.validators';\n\n/* types */\nexport type CollapsiblePropType = boolean;\n\n/**\n * Defines if navigation nodes can be collapsed or not.\n */\nexport type PropCollapsible = {\n\tcollapsible: CollapsiblePropType;\n};\n\n/* validator */\nexport const validateCollapsible = (component: Generic.Element.Component, value?: CollapsiblePropType): void => {\n\twatchBoolean(component, '_collapsible', value);\n};\n","import { Generic } from '@a11y-ui/core';\n\nimport { watchBoolean } from '../../utils/prop.validators';\n\ntype HasCompactButtonPropType = boolean;\n\n/**\n * Creates a button below the navigation, that toggles _collapsible. Only available for _orientation=\"vertical\".\n */\nexport type PropHasCompactButton = {\n\thasCompactButton: HasCompactButtonPropType;\n};\n\n/* validator */\nexport const validateHasCompactButton = (component: Generic.Element.Component, value?: HasCompactButtonPropType): void => {\n\twatchBoolean(component, '_hasCompactButton', value);\n};\n","@import url(../style.css);\n@layer kol-component {\n\t:host > div {\n\t\tdisplay: grid;\n\t\tplace-items: center;\n\t}\n\n\tnav {\n\t\twidth: 100%;\n\t}\n\n\t.list {\n\t\tdisplay: flex;\n\t\tlist-style: none;\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t}\n\n\t.list.vertical {\n\t\tflex-direction: column;\n\t}\n\n\t.entry {\n\t\tdisplay: flex;\n\t}\n\n\t.button-link-text-switch {\n\t\tflex-grow: 1;\n\t}\n\n\t.entry kol-span-wc {\n\t\tjustify-items: start;\n\t}\n}\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { translate } from '../../i18n';\nimport { ButtonOrLinkOrTextWithChildrenProps, ButtonWithChildrenProps } from '../../types/button-link-text';\nimport { Stringified } from '../../types/common';\nimport { Orientation } from '../../types/orientation';\nimport { CollapsiblePropType, validateCollapsible } from '../../types/props/collapsible';\nimport { validateHasCompactButton } from '../../types/props/has-compact-button';\nimport { HideLabelPropType, validateHideLabel } from '../../types/props/hide-label';\nimport { LabelPropType, validateLabel } from '../../types/props/label';\nimport { a11yHintLabelingLandmarks, devHint, devWarning } from '../../utils/a11y.tipps';\nimport { watchValidator } from '../../utils/prop.validators';\nimport { addNavLabel, removeNavLabel } from '../../utils/unique-nav-labels';\nimport { API, States } from './types';\nimport { watchNavLinks } from './validation';\n\nconst linkValidator = (link: ButtonOrLinkOrTextWithChildrenProps): boolean => {\n\tif (typeof link === 'object' && typeof link._label === 'string' /* && typeof newLink._href === 'string' */) {\n\t\tif (Array.isArray(link._children)) {\n\t\t\treturn linksValidator(link._children);\n\t\t}\n\t\treturn false;\n\t}\n\treturn true;\n};\n\nconst linksValidator = (links: ButtonOrLinkOrTextWithChildrenProps[]): boolean => {\n\tif (Array.isArray(links)) {\n\t\treturn links.find(linkValidator) !== undefined;\n\t}\n\treturn true;\n};\n\n@Component({\n\ttag: 'kol-nav',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolNav implements API {\n\tprivate readonly onClick = (link: ButtonOrLinkOrTextWithChildrenProps): void => {\n\t\tlink._active = !link._active;\n\t\tthis.state = {\n\t\t\t...this.state,\n\t\t};\n\t};\n\n\tprivate readonly hasActiveChild = (link: ButtonOrLinkOrTextWithChildrenProps): boolean => {\n\t\tif (Array.isArray(link._children) && link._children.length > 0) {\n\t\t\treturn link._children.some(this.hasActiveChild);\n\t\t}\n\n\t\treturn false;\n\t};\n\n\tprivate entry(\n\t\tcollapsible: boolean,\n\t\thideLabel: HideLabelPropType,\n\t\thasChildren: boolean,\n\t\tlink: ButtonOrLinkOrTextWithChildrenProps,\n\t\texpanded: boolean\n\t): JSX.Element {\n\t\treturn (\n\t\t\t<div class={{ entry: true, 'hide-label': hideLabel }}>\n\t\t\t\t<kol-button-link-text-switch\n\t\t\t\t\tclass=\"button-link-text-switch\"\n\t\t\t\t\t_link={{\n\t\t\t\t\t\t...link,\n\t\t\t\t\t\t_hideLabel: hideLabel,\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t{hasChildren ? this.expandButton(collapsible, link as ButtonWithChildrenProps, expanded) : ''}\n\t\t\t</div>\n\t\t);\n\t}\n\n\tprivate expandButton(collapsible: boolean, link: ButtonWithChildrenProps, expanded: boolean): JSX.Element {\n\t\treturn (\n\t\t\t<kol-button-wc\n\t\t\t\tclass=\"expand-button\"\n\t\t\t\t_ariaExpanded={expanded}\n\t\t\t\t_disabled={!collapsible}\n\t\t\t\t_icons={'codicon codicon-' + (expanded ? 'remove' : 'add')}\n\t\t\t\t_hideLabel\n\t\t\t\t_label={`Untermenü zu ${link._label} ${expanded ? 'schließen' : 'öffnen'}`}\n\t\t\t\t_on={{ onClick: () => this.onClick(link) }}\n\t\t\t></kol-button-wc>\n\t\t);\n\t}\n\n\tprivate li(\n\t\tcollapsible: boolean,\n\t\thideLabel: HideLabelPropType,\n\t\tdeep: number,\n\t\tindex: number,\n\t\tlink: ButtonOrLinkOrTextWithChildrenProps,\n\t\torientation: Orientation\n\t): JSX.Element {\n\t\tconst active = !!link._active;\n\t\tconst hasChildren = Array.isArray(link._children) && link._children.length > 0;\n\t\tconst expanded = hasChildren && active;\n\t\treturn (\n\t\t\t<li\n\t\t\t\tclass={{\n\t\t\t\t\tactive,\n\t\t\t\t\texpanded,\n\t\t\t\t\t'has-children': hasChildren,\n\t\t\t\t}}\n\t\t\t\tkey={index}\n\t\t\t>\n\t\t\t\t{this.entry(collapsible, hideLabel, hasChildren, link, active)}\n\t\t\t\t{expanded ? (\n\t\t\t\t\t<this.linkList collapsible={collapsible} hideLabel={hideLabel} deep={deep + 1} links={link._children || []} orientation={orientation} />\n\t\t\t\t) : (\n\t\t\t\t\t''\n\t\t\t\t)}\n\t\t\t</li>\n\t\t);\n\t}\n\n\tprivate linkList = (props: {\n\t\tcollapsible: boolean;\n\t\thideLabel: HideLabelPropType;\n\t\tdeep: number;\n\t\tlinks: ButtonOrLinkOrTextWithChildrenProps[];\n\t\torientation: Orientation;\n\t}): JSX.Element => {\n\t\treturn (\n\t\t\t<ul class={`list ${props.deep === 0 && props.orientation === 'horizontal' ? ' horizontal' : ' vertical'}`} data-deep={props.deep}>\n\t\t\t\t{props.links.map((link, index: number) => {\n\t\t\t\t\treturn this.li(props.collapsible, props.hideLabel, props.deep, index, link, props.orientation);\n\t\t\t\t})}\n\t\t\t</ul>\n\t\t);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tlet hasCompactButton = this.state._hasCompactButton;\n\t\tif (this.state._orientation === 'horizontal' && this.state._hasCompactButton === true) {\n\t\t\thasCompactButton = false;\n\t\t\tdevWarning(`[KolNav] Wenn eine horizontale Navigation verwendet wird, kann die Option _hasCompactButton nicht aktiviert werden.`);\n\t\t}\n\t\tconst collapsible = this.state._collapsible === true;\n\t\tconst hideLabel = this.state._hideLabel === true;\n\t\tconst orientation = this.state._orientation;\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[orientation]: true,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<nav aria-label={this.state._label} id=\"nav\">\n\t\t\t\t\t\t<this.linkList collapsible={collapsible} hideLabel={hideLabel} deep={0} links={this.state._links} orientation={orientation}></this.linkList>\n\t\t\t\t\t</nav>\n\t\t\t\t\t{hasCompactButton && (\n\t\t\t\t\t\t<div class=\"compact\">\n\t\t\t\t\t\t\t<kol-button\n\t\t\t\t\t\t\t\t_ariaControls=\"nav\"\n\t\t\t\t\t\t\t\t_ariaExpanded={!hideLabel}\n\t\t\t\t\t\t\t\t_icons={hideLabel ? 'codicon codicon-chevron-right' : 'codicon codicon-chevron-left'}\n\t\t\t\t\t\t\t\t_hideLabel\n\t\t\t\t\t\t\t\t_label={translate(hideLabel ? 'kol-nav-maximize' : 'kol-nav-minimize')}\n\t\t\t\t\t\t\t\t_on={{\n\t\t\t\t\t\t\t\t\tonClick: (): void => {\n\t\t\t\t\t\t\t\t\t\tthis.state = {\n\t\t\t\t\t\t\t\t\t\t\t...this.state,\n\t\t\t\t\t\t\t\t\t\t\t_hideLabel: this.state._hideLabel === false,\n\t\t\t\t\t\t\t\t\t\t};\n\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t_tooltipAlign=\"right\"\n\t\t\t\t\t\t\t\t_variant=\"ghost\"\n\t\t\t\t\t\t\t></kol-button>\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 * Defines if navigation nodes can be collapsed or not. Enabled by default.\n\t * @TODO: Change type back to `CollapsiblePropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _collapsible?: boolean = true;\n\n\t/**\n\t * Gibt an, ob die Navigation eine zusätzliche Schaltfläche zum Aus- und Einklappen der Navigation anzeigen soll.\n\t */\n\t@Prop() public _hasCompactButton?: boolean = false;\n\n\t/**\n\t * Hides the caption by default and displays the caption text with a tooltip when the\n\t * interactive element is focused or the mouse is over it.\n\t * @TODO: Change type back to `HideLabelPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _hideLabel?: boolean = false;\n\n\t/**\n\t * Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.).\n\t */\n\t@Prop() public _label!: LabelPropType;\n\n\t/**\n\t * Defines the list of links, buttons or texts to render.\n\t */\n\t@Prop() public _links!: Stringified<ButtonOrLinkOrTextWithChildrenProps[]>;\n\n\t/**\n\t * Defines whether the orientation of the component is horizontal or vertical.\n\t */\n\t@Prop() public _orientation?: Orientation = 'vertical';\n\n\t@State() public state: States = {\n\t\t_collapsible: true,\n\t\t_hasCompactButton: false,\n\t\t_hideLabel: false,\n\t\t_label: '…', // ⚠ required\n\t\t_links: [],\n\t\t_orientation: 'vertical',\n\t};\n\n\t@Watch('_collapsible')\n\tpublic validateCollapsible(value?: CollapsiblePropType): void {\n\t\tvalidateCollapsible(this, value);\n\t}\n\n\t@Watch('_hasCompactButton')\n\tpublic validateHasCompactButton(value?: boolean): void {\n\t\tvalidateHasCompactButton(this, value);\n\t}\n\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: HideLabelPropType) {\n\t\tvalidateHideLabel(this, value);\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: LabelPropType, _oldValue?: LabelPropType, initial = false): void {\n\t\tif (!initial) {\n\t\t\tremoveNavLabel(this.state._label); // remove the current\n\t\t}\n\t\tvalidateLabel(this, value);\n\t\ta11yHintLabelingLandmarks(value);\n\t\taddNavLabel(this.state._label); // add the state instead of prop, because the prop could be invalid and not set as new label\n\t}\n\n\t@Watch('_links')\n\tpublic validateLinks(value?: Stringified<ButtonOrLinkOrTextWithChildrenProps[]>): void {\n\t\twatchNavLinks('KolNav', this, value);\n\t\tdevHint(`[KolNav] Die Navigationsstruktur wird noch nicht rekursiv validiert.`);\n\t}\n\n\t@Watch('_orientation')\n\tpublic validateOrientation(value?: Orientation): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_orientation',\n\t\t\t(value): boolean => value === 'horizontal' || value === 'vertical',\n\t\t\tnew Set(['Orientation {horizontal, vertical}']),\n\t\t\tvalue,\n\t\t\t{\n\t\t\t\tdefaultValue: 'vertical',\n\t\t\t}\n\t\t);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateCollapsible(this._collapsible);\n\t\tthis.validateHideLabel(this._hideLabel);\n\t\tthis.validateHasCompactButton(this._hasCompactButton);\n\t\tthis.validateLabel(this._label, undefined, true);\n\t\tthis.validateLinks(this._links);\n\t\tthis.validateOrientation(this._orientation);\n\t}\n\n\tpublic disconnectedCallback(): void {\n\t\tremoveNavLabel(this.state._label);\n\t}\n}\n\n// console.log(\n//   stringifyJson([\n//     { _label: '1 Navigationspunkt', _href: '#abc', _icons: 'codicon codicon-folder-closed', _target: 'asdasd' },\n//     { _label: '2 Navigationspunkt', _href: '#abc', _icons: 'codicon codicon-folder-closed' },\n//     {\n//       _active: true,\n//       _label: '3 Navigationspunkt',\n//       _href: '#abc',\n//       _icons: 'codicon codicon-folder-closed',\n//       _children: [\n//         { _label: '3.1 Navigationspunkt', _href: '#abc', _icons: 'codicon codicon-folder-closed' },\n//         { _label: '3.2 Navigationspunkt', _href: '#abc', _icons: 'codicon codicon-folder-closed', _target: 'asdasd' },\n//         {\n//           _active: true,\n//           _label: '3.3 Navigationspunkt',\n//           _href: '#abc',\n//           _children: [\n//             { _active: true, _label: '3.3.1 Navigationspunkt (aktiv)', _href: '#abc' },\n//             { _label: '3.3.2 Navigationspunkt', _href: '#abc' },\n//           ],\n//         },\n//         {\n//           _label: '3.4 Navigationspunkt',\n//           _href: '#abc',\n//           _children: [\n//             { _label: '3.4.1 Navigationspunkt', _href: '#abc' },\n//             { _label: '3.4.2 Navigationspunkt', _href: '#abc' },\n//           ],\n//         },\n//         { _label: '3.5 Navigationspunkt', _href: '#abc' },\n//       ],\n//     },\n//     { _label: '4 Navigationspunkt', _href: '#abc' },\n//   ])\n// );\n"],"version":3}

package/dist/components/{kol-popover.d.ts → kol-popover-wc.d.ts}

@@ -1,9 +1,9 @@
 import type { Components, JSX } from "../types/components";
 
-interface KolPopover extends Components.KolPopover, HTMLElement {}
-export const KolPopover: {
-  prototype: KolPopover;
-  new (): KolPopover;
+interface KolPopoverWc extends Components.KolPopoverWc, HTMLElement {}
+export const KolPopoverWc: {
+  prototype: KolPopoverWc;
+  new (): KolPopoverWc;
 };
 /**
  * Used to define this component and all nested components recursively.

package/dist/components/kol-popover-wc.js

@@ -0,0 +1,4 @@
+/*!
+ * KoliBri - The accessible HTML-Standard
+ */
+import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";import{b as alignFloatingElements,c as validateAlign}from"./align-floating-elements.js";import{v as validateShow}from"./show.js";import{m as getDocument}from"./prop.validators.js";const styleCss="/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n\t:host {\n\t\t/*\n\t\t * Minimum size of interactive elements.\n\t\t */\n\t\t--a11y-min-size: 44px;\n\t\t/*\n\t\t * Verdana is an accessible font that can be used without requiring additional loading time.\n\t\t */\n\t\tfont-family: Verdana;\n\t}\n\n\t* {\n\t\t/*\n\t\t * This rule enables the word dividing for all texts. That is important for high zoom levels.\n\t\t */\n\t\thyphens: auto;\n\t\t/*\n\t\t * Letter spacing is required for all texts.\n\t\t */\n\t\tletter-spacing: inherit;\n\t\t/*\n\t\t * This rule enables the word dividing for all texts. That is important for high zoom levels.\n\t\t */\n\t\tword-break: break-word;\n\t\t/*\n\t\t * Word spacing is required for all texts.\n\t\t */\n\t\tword-spacing: inherit;\n\t}\n\n\t/*\n\t * All interactive elements should have a minimum size of 44px.\n\t */\n\t/* input:not([type='checkbox'], [type='radio'], [type='range']), */\n\t/* option, */\n\t/* select, */\n\t/* textarea, */\n\t[role='button'],\n\tbutton:not([role='link']),\n\tkol-input .input {\n\t\tmin-height: var(--a11y-min-size);\n\t\tmin-width: var(--a11y-min-size);\n\t}\n\n\t/*\n\t * Some interactive elements should not inherit the font-family and font-size.\n\t */\n\ta,\n\tbutton,\n\th1,\n\th2,\n\th3,\n\th4,\n\th5,\n\th6,\n\tinput,\n\toption,\n\tselect,\n\ttextarea {\n\t\t/*\n\t\t * All elements should inherit the font family from his parent element.\n\t\t */\n\t\tfont-family: inherit;\n\t\t/*\n\t\t * All elements should inherit the font size from his parent element.\n\t\t */\n\t\tfont-size: inherit;\n\t}\n}\n\n@layer kol-global {\n\t/*\n\t * Dieses CSS stellt sicher, dass der Standard-Style\n\t * von A und Button resettet werden.\n\t */\n\t:is(a, button) {\n\t\tbackground-color: transparent;\n\t\tborder: none;\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t\twidth: 100%; /* 100% needed for custom width from outside */\n\t}\n}\n\n@layer kol-global {\n\t:host {\n\t\t/*\n\t\t * The max-width is needed to prevent the table from overflowing the\n\t\t * parent node, if the table is wider than the parent node.\n\t\t */\n\t\tmax-width: 100%;\n\t}\n\n\t* {\n\t\t/*\n\t\t * We prefer to box-sizing: border-box for all elements.\n\t\t */\n\t\tbox-sizing: border-box;\n\t}\n\n\t/* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n\tkol-span-wc {\n\t\tdisplay: grid;\n\t\tplace-items: center;\n\t}\n\n\t/* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n\tkol-span-wc > span {\n\t\tdisplay: flex;\n\t\tplace-items: center;\n\t}\n\n\ta,\n\tbutton {\n\t\tcursor: pointer;\n\t}\n\n\t/* This is the text label. */\n\t.icon-only > kol-span-wc > span > span {\n\t\tdisplay: none;\n\t}\n}\n\n@layer kol-component {\n\tkol-popover {\n\t\theight: 0;\n\t\tposition: absolute;\n\t}\n\n\tkol-popover .popover {\n\t\tbackground-color: #fff;\n\t\tmin-height: max-content;\n\t\tmin-width: max-content;\n\t\topacity: 0;\n\t\tposition: absolute;\n\t}\n\n\tkol-popover .hidden {\n\t\tdisplay: none;\n\t}\n\n\tkol-popover .show {\n\t\tanimation: 0.3s ease-in forwards fadeInOpacity;\n\t}\n\n\tkol-popover .disappear {\n\t\tanimation: 0.3s ease-in backwards fadeInOpacity;\n\t}\n\n\tkol-popover .arrow {\n\t\tbackground-color: inherit;\n\t\theight: var(--font-size);\n\t\tposition: absolute;\n\t\trotate: 0.125turn;\n\t\twidth: var(--font-size);\n\t\tz-index: -1;\n\t}\n\n\t@keyframes fadeInOpacity {\n\t\t0% {\n\t\t\topacity: 0;\n\t\t}\n\t\t100% {\n\t\t\topacity: 1;\n\t\t}\n\t}\n}\n",KolPopover=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.hidePopoverByEscape=t=>{"Escape"===t.key&&this.hidePopover()},this.hidePopoverByClickOutside=t=>{this.host&&!this.host.contains(t.target)&&this.hidePopover()},this.catchHostAndTriggerElement=t=>{t&&(this.host=t,this.triggerElement=t.previousElementSibling)},this.catchPopoverElement=t=>{this.popoverElement=t},this.catchArrowElement=t=>{this.arrowElement=t},this._align="top",this._show=!1,this.state={_align:"top",_show:!1,_visible:!1}}async showPopover(){this.addListenersToBody(),this.triggerElement&&this.popoverElement&&(await alignFloatingElements({align:this._align,referenceElement:this.triggerElement,arrowElement:this.arrowElement,floatingElement:this.popoverElement}),this.state=Object.assign(Object.assign({},this.state),{_visible:!0}))}hidePopover(){var t;this.state=Object.assign(Object.assign({},this.state),{_visible:!1}),this._show=!1,null===(t=this.triggerElement)||void 0===t||t.focus(),this.removeListenersToBody()}addListenersToBody(){var t;const e=getDocument().body;e.addEventListener("keyup",this.hidePopoverByEscape),e.addEventListener("click",this.hidePopoverByClickOutside),null===(t=document.scrollingElement)||void 0===t||t.addEventListener("scroll",(()=>{this.showPopover()}),{passive:!0})}removeListenersToBody(){var t;const e=getDocument().body;e.removeEventListener("keyup",this.hidePopoverByEscape),e.removeEventListener("click",this.hidePopoverByClickOutside),null===(t=document.scrollingElement)||void 0===t||t.removeEventListener("scroll",(()=>{this.showPopover()}))}render(){return h(Host,{ref:this.catchHostAndTriggerElement},h("div",{class:{popover:!0,hidden:!this.state._show,show:this.state._visible},ref:this.catchPopoverElement},h("div",{class:`arrow ${this.state._align}`,ref:this.catchArrowElement}),h("slot",null)))}validateAlign(t){validateAlign(this,t)}validateShow(t){validateShow(this,t),t&&this.showPopover()}componentWillLoad(){this.validateAlign(this._align),this.validateShow(this._show)}static get watchers(){return{_align:["validateAlign"],_show:["validateShow"]}}static get style(){return styleCss}},[4,"kol-popover-wc",{_align:[1],_show:[1540],state:[32]},void 0,{_align:["validateAlign"],_show:["validateShow"]}]);function defineCustomElement$1(){if("undefined"==typeof customElements)return;["kol-popover-wc"].forEach((t=>{if("kol-popover-wc"===t)customElements.get(t)||customElements.define(t,KolPopover)}))}const KolPopoverWc=KolPopover,defineCustomElement=defineCustomElement$1;export{KolPopoverWc,defineCustomElement};

package/dist/components/kol-popover-wc.js.map

@@ -0,0 +1 @@
+{"file":"kol-popover-wc.js","mappings":"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","names":[],"sources":["src/components/popover/style.css?tag=kol-popover-wc","src/components/popover/component.tsx"],"sourcesContent":["@import url(../style.css);\n@layer kol-component {\n\tkol-popover {\n\t\theight: 0;\n\t\tposition: absolute;\n\t}\n\n\tkol-popover .popover {\n\t\tbackground-color: #fff;\n\t\tmin-height: max-content;\n\t\tmin-width: max-content;\n\t\topacity: 0;\n\t\tposition: absolute;\n\t}\n\n\tkol-popover .hidden {\n\t\tdisplay: none;\n\t}\n\n\tkol-popover .show {\n\t\tanimation: 0.3s ease-in forwards fadeInOpacity;\n\t}\n\n\tkol-popover .disappear {\n\t\tanimation: 0.3s ease-in backwards fadeInOpacity;\n\t}\n\n\tkol-popover .arrow {\n\t\tbackground-color: inherit;\n\t\theight: var(--font-size);\n\t\tposition: absolute;\n\t\trotate: 0.125turn;\n\t\twidth: var(--font-size);\n\t\tz-index: -1;\n\t}\n\n\t@keyframes fadeInOpacity {\n\t\t0% {\n\t\t\topacity: 0;\n\t\t}\n\t\t100% {\n\t\t\topacity: 1;\n\t\t}\n\t}\n}\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { AlignPropType, validateAlign } from '../../types/props/align';\nimport { ShowPropType, validateShow } from '../../types/props/show';\nimport { getDocument } from '../../utils/dev.utils';\nimport { API, States } from './types';\nimport { alignFloatingElements } from '../../utils/align-floating-elements';\n\n/**\n * @slot - Der Inhalt des Popover.\n */\n@Component({\n\ttag: 'kol-popover-wc',\n\tstyleUrl: './style.css',\n\tshadow: false,\n})\nexport class KolPopover implements API {\n\tprivate arrowElement?: HTMLDivElement;\n\tprivate popoverElement?: HTMLDivElement;\n\tprivate triggerElement?: HTMLElement | null;\n\tprivate host?: HTMLElement;\n\n\tprivate async showPopover(): Promise<void> {\n\t\tthis.addListenersToBody();\n\n\t\tif (this.triggerElement && this.popoverElement) {\n\t\t\tawait alignFloatingElements({\n\t\t\t\talign: this._align,\n\t\t\t\treferenceElement: this.triggerElement,\n\t\t\t\tarrowElement: this.arrowElement,\n\t\t\t\tfloatingElement: this.popoverElement,\n\t\t\t});\n\t\t\tthis.state = { ...this.state, _visible: true };\n\t\t}\n\t}\n\tprivate hidePopover(): void {\n\t\tthis.state = {\n\t\t\t...this.state,\n\t\t\t_visible: false,\n\t\t};\n\t\tthis._show = false;\n\t\tthis.triggerElement?.focus();\n\t\tthis.removeListenersToBody();\n\t}\n\tprivate hidePopoverByEscape = (event: KeyboardEvent): void => {\n\t\tif (event.key === 'Escape') this.hidePopover();\n\t};\n\tprivate hidePopoverByClickOutside = (event: MouseEvent): void => {\n\t\tif (this.host && !this.host.contains(event.target as HTMLElement)) {\n\t\t\tthis.hidePopover();\n\t\t}\n\t};\n\n\t/* EventListener functions */\n\tprivate addListenersToBody(): void {\n\t\tconst body = getDocument().body;\n\t\tbody.addEventListener('keyup', this.hidePopoverByEscape);\n\t\tbody.addEventListener('click', this.hidePopoverByClickOutside);\n\t\tdocument.scrollingElement?.addEventListener(\n\t\t\t'scroll',\n\t\t\t() => {\n\t\t\t\tvoid this.showPopover();\n\t\t\t},\n\t\t\t{ passive: true }\n\t\t);\n\t}\n\tprivate removeListenersToBody(): void {\n\t\tconst body = getDocument().body;\n\t\tbody.removeEventListener('keyup', this.hidePopoverByEscape);\n\t\tbody.removeEventListener('click', this.hidePopoverByClickOutside);\n\t\tdocument.scrollingElement?.removeEventListener('scroll', () => {\n\t\t\tvoid this.showPopover();\n\t\t});\n\t}\n\n\t/* catchElement functions */\n\tprivate catchHostAndTriggerElement = (element: HTMLElement | null): void => {\n\t\tif (element) {\n\t\t\tthis.host = element;\n\t\t\tthis.triggerElement = element.previousElementSibling as HTMLElement | null;\n\t\t}\n\t};\n\tprivate catchPopoverElement = (element?: HTMLDivElement): void => {\n\t\tthis.popoverElement = element;\n\t};\n\tprivate catchArrowElement = (element?: HTMLDivElement): void => {\n\t\tthis.arrowElement = element;\n\t};\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host ref={this.catchHostAndTriggerElement}>\n\t\t\t\t<div class={{ popover: true, hidden: !this.state._show, show: this.state._visible }} ref={this.catchPopoverElement}>\n\t\t\t\t\t<div class={`arrow ${this.state._align}`} ref={this.catchArrowElement} />\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 * Defines the alignment of the tooltip, popover or tabs in relation to the element.\n\t */\n\t@Prop() public _align?: AlignPropType = 'top';\n\n\t/**\n\t * Makes the element show up.\n\t * @TODO: Change type back to `ShowPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _show?: boolean = false;\n\n\t@State() public state: States = {\n\t\t_align: 'top',\n\t\t_show: false,\n\t\t_visible: false,\n\t};\n\n\t@Watch('_align')\n\tpublic validateAlign(value?: AlignPropType): void {\n\t\tvalidateAlign(this, value);\n\t}\n\n\t@Watch('_show')\n\tpublic validateShow(value?: ShowPropType): void {\n\t\tvalidateShow(this, value);\n\t\tif (value) void this.showPopover();\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAlign(this._align);\n\t\tthis.validateShow(this._show);\n\t}\n}\n"],"version":3}

package/dist/components/kol-progress.js

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";import{v as validateLabel}from"./label.js";import{D as watchNumber,b as watchString,w as watchValidator}from"./prop.validators.js";var KoliBriProgressVariantEnum;!function(e){e.bar="bar",e.cycle="cycle",e["cycle-value-label"]="cycle-value-label",e["cycle-label-value"]="cycle-label-value"}(KoliBriProgressVariantEnum||(KoliBriProgressVariantEnum={}));const defaultStyleCss=":host{--a11y-min-size:44px;font-size:inherit}*{font-family:Verdana;hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}progress{display:block;height:0;overflow:hidden;width:0}.bar .border{fill:transparent;stroke:black}.bar .background{fill:lightgray;stroke:white}.bar .progress{fill:#0075ff;stroke:transparent;transition:250ms ease-in-out 50ms}.cycle .background{fill:transparent;stroke:lightgray}.cycle .border{fill:transparent;stroke:black}.cycle .whitespace{fill:transparent;stroke:white}.cycle .progress{fill:transparent;stroke:#0075ff;transform-origin:50% 50%;transform:rotate(-90deg);transition:250ms ease-in-out 50ms}@media (prefers-reduced-motion){.progress{transition-duration:0s;transition-delay:0s}}",VALID_VARIANTS=Object.keys(KoliBriProgressVariantEnum),createProgressSVG=e=>{let t="43%",a=e._label?"57%":"50%";switch(e._variant){case"cycle-value-label":e._label&&(t="57%",a="43%");case"cycle":case"cycle-label-value":return h("svg",{class:"cycle",width:"100",viewBox:"0 0 120 120",xmlns:"http://www.w3.org/2000/svg"},h("circle",{class:"background",cx:"60",cy:"60",r:"54.5",fill:"currentColor",stroke:"currentColor","stroke-width":"8"}),h("circle",{class:"whitespace",cx:"60",cy:"60",r:"59",fill:"currentColor",stroke:"currentColor","stroke-width":"3"}),h("circle",{class:"border",cx:"60",cy:"60",r:"59",fill:"currentColor",stroke:"currentColor","stroke-width":"1"}),h("circle",{class:"whitespace",cx:"60",cy:"60",r:"51",fill:"currentColor",stroke:"currentColor","stroke-width":"1"}),h("circle",{class:"border",cx:"60",cy:"60",r:"50",fill:"currentColor",stroke:"currentColor","stroke-width":"1"}),h("circle",{class:"progress",fill:"currentColor",stroke:"currentColor","stroke-linecap":"round","stroke-dasharray":`${Math.round(e._value/e._max*342)}px 342px`,"stroke-width":"6",cx:"60",cy:"60",r:"54.5"}),e._label&&h("text",{"aria-hidden":"true",x:"50%",y:t,"text-anchor":"middle",fill:"currentColor"},e._label),h("text",{"aria-hidden":"true",x:"50%",y:a,"text-anchor":"middle",fill:"currentColor"},e._value,e._unit));default:return h("div",{class:"bar"},e._label&&h("div",null,e._label),h("div",{style:{display:"flex",gap:"0.3em"}},h("svg",{width:"100",viewBox:"0 0 102 8",xmlns:"http://www.w3.org/2000/svg"},h("rect",{class:"background",x:"1",y:"1",height:"10",rx:"5",fill:"currentColor",stroke:"currentColor","stroke-width":"3",width:"100"}),h("rect",{class:"progress",x:"2.5",y:"2.5",height:"7",rx:"3.5",fill:"currentColor",stroke:"currentColor","stroke-width":"3",width:e._value/e._max*95}),h("rect",{class:"border",x:"1",y:"1",height:"10",rx:"5",fill:"currentColor",stroke:"currentColor","stroke-width":"1",width:"100"})),h("text",{"aria-hidden":"true","text-anchor":"middle","dominant-baseline":"central",fill:"currentColor"},e._value,e._unit)))}},KolProcess=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.__attachShadow(),this._label=void 0,this._max=void 0,this._unit="%",this._value=void 0,this._variant=void 0,this.state={_max:100,_unit:"%",_value:0,_variant:"bar",_liveValue:0}}render(){return h(Host,null,createProgressSVG(this.state),h("progress",{"aria-busy":this.state._value<this.state._max?"true":"false",max:this.state._max,value:this.state._value}),h("span",{"aria-live":"polite","aria-relevant":"removals text",hidden:!0},this.state._liveValue," von ",this.state._max," ",this.state._unit))}validateLabel(e){validateLabel(this,e)}validateMax(e){"number"!=typeof e&&(e=100),watchNumber(this,"_max",e,{required:!0})}validateUnit(e){watchString(this,"_unit",e)}validateValue(e){"number"!=typeof e&&(e=0),watchNumber(this,"_value",e,{required:!0})}validateVariant(e){watchValidator(this,"_variant",(e=>"string"==typeof e&&VALID_VARIANTS.includes(e)),new Set(VALID_VARIANTS),e)}componentWillLoad(){this.validateLabel(this._label),this.validateMax(this._max),this.validateUnit(this._unit),this.validateValue(this._value),this.validateVariant(this._variant),this.interval=setInterval((()=>{this.state._liveValue!==this.state._value&&(this.state=Object.assign(Object.assign({},this.state),{_liveValue:this.state._value}))}),5e3)}disconnectedCallback(){clearInterval(this.interval)}static get watchers(){return{_label:["validateLabel"],_max:["validateMax"],_unit:["validateUnit"],_value:["validateValue"],_variant:["validateVariant"]}}static get style(){return{default:defaultStyleCss}}},[33,"kol-progress",{_label:[1],_max:[2],_unit:[1],_value:[2],_variant:[1],state:[32]},void 0,{_label:["validateLabel"],_max:["validateMax"],_unit:["validateUnit"],_value:["validateValue"],_variant:["validateVariant"]}]);function defineCustomElement$1(){if("undefined"==typeof customElements)return;["kol-progress"].forEach((e=>{if("kol-progress"===e)customElements.get(e)||customElements.define(e,KolProcess)}))}const KolProgress=KolProcess,defineCustomElement=defineCustomElement$1;export{KolProgress,defineCustomElement};
+import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";import{v as validateLabel}from"./label.js";import{D as watchNumber,b as watchString,w as watchValidator}from"./prop.validators.js";var KoliBriProgressVariantEnum;!function(t){t.bar="bar",t.cycle="cycle",t["cycle-value-label"]="cycle-value-label",t["cycle-label-value"]="cycle-label-value"}(KoliBriProgressVariantEnum||(KoliBriProgressVariantEnum={}));const defaultStyleCss="/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n\t:host {\n\t\t/*\n\t\t * Minimum size of interactive elements.\n\t\t */\n\t\t--a11y-min-size: 44px;\n\t\t/*\n\t\t * Verdana is an accessible font that can be used without requiring additional loading time.\n\t\t */\n\t\tfont-family: Verdana;\n\t}\n\n\t* {\n\t\t/*\n\t\t * This rule enables the word dividing for all texts. That is important for high zoom levels.\n\t\t */\n\t\thyphens: auto;\n\t\t/*\n\t\t * Letter spacing is required for all texts.\n\t\t */\n\t\tletter-spacing: inherit;\n\t\t/*\n\t\t * This rule enables the word dividing for all texts. That is important for high zoom levels.\n\t\t */\n\t\tword-break: break-word;\n\t\t/*\n\t\t * Word spacing is required for all texts.\n\t\t */\n\t\tword-spacing: inherit;\n\t}\n\n\t/*\n\t * All interactive elements should have a minimum size of 44px.\n\t */\n\t/* input:not([type='checkbox'], [type='radio'], [type='range']), */\n\t/* option, */\n\t/* select, */\n\t/* textarea, */\n\t[role='button'],\n\tbutton:not([role='link']),\n\tkol-input .input {\n\t\tmin-height: var(--a11y-min-size);\n\t\tmin-width: var(--a11y-min-size);\n\t}\n\n\t/*\n\t * Some interactive elements should not inherit the font-family and font-size.\n\t */\n\ta,\n\tbutton,\n\th1,\n\th2,\n\th3,\n\th4,\n\th5,\n\th6,\n\tinput,\n\toption,\n\tselect,\n\ttextarea {\n\t\t/*\n\t\t * All elements should inherit the font family from his parent element.\n\t\t */\n\t\tfont-family: inherit;\n\t\t/*\n\t\t * All elements should inherit the font size from his parent element.\n\t\t */\n\t\tfont-size: inherit;\n\t}\n}\n\n@layer kol-global {\n\t/*\n\t * Dieses CSS stellt sicher, dass der Standard-Style\n\t * von A und Button resettet werden.\n\t */\n\t:is(a, button) {\n\t\tbackground-color: transparent;\n\t\tborder: none;\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t\twidth: 100%; /* 100% needed for custom width from outside */\n\t}\n}\n\n@layer kol-global {\n\t:host {\n\t\t/*\n\t\t * The max-width is needed to prevent the table from overflowing the\n\t\t * parent node, if the table is wider than the parent node.\n\t\t */\n\t\tmax-width: 100%;\n\t}\n\n\t* {\n\t\t/*\n\t\t * We prefer to box-sizing: border-box for all elements.\n\t\t */\n\t\tbox-sizing: border-box;\n\t}\n\n\t/* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n\tkol-span-wc {\n\t\tdisplay: grid;\n\t\tplace-items: center;\n\t}\n\n\t/* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n\tkol-span-wc > span {\n\t\tdisplay: flex;\n\t\tplace-items: center;\n\t}\n\n\ta,\n\tbutton {\n\t\tcursor: pointer;\n\t}\n\n\t/* This is the text label. */\n\t.icon-only > kol-span-wc > span > span {\n\t\tdisplay: none;\n\t}\n}\n\n@layer kol-component {\n\tprogress {\n\t\tdisplay: block;\n\t\theight: 0;\n\t\toverflow: hidden;\n\t\twidth: 0;\n\t}\n\n\t.bar .border {\n\t\tfill: transparent;\n\t\tstroke: black;\n\t}\n\n\t.bar .background {\n\t\tfill: lightgray;\n\t\tstroke: white;\n\t}\n\n\t.bar .progress {\n\t\tfill: #0075ff;\n\t\tstroke: transparent;\n\t\ttransition: 250ms ease-in-out 50ms;\n\t}\n\n\t.cycle .background {\n\t\tfill: transparent;\n\t\tstroke: lightgray;\n\t}\n\n\t.cycle .border {\n\t\tfill: transparent;\n\t\tstroke: black;\n\t}\n\n\t.cycle .whitespace {\n\t\tfill: transparent;\n\t\tstroke: white;\n\t}\n\n\t.cycle .progress {\n\t\tfill: transparent;\n\t\tstroke: #0075ff;\n\t\ttransform-origin: 50% 50%;\n\t\ttransform: rotate(-90deg);\n\t\ttransition: 250ms ease-in-out 50ms;\n\t}\n\n\t/* https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion */\n\t@media (prefers-reduced-motion) {\n\t\t.progress {\n\t\t\ttransition-duration: 0s;\n\t\t\ttransition-delay: 0s;\n\t\t}\n\t}\n}\n",VALID_VARIANTS=Object.keys(KoliBriProgressVariantEnum),createProgressSVG=t=>{let e="43%",n=t._label?"57%":"50%";switch(t._variant){case"cycle-value-label":t._label&&(e="57%",n="43%");case"cycle":case"cycle-label-value":return h("svg",{class:"cycle",width:"100",viewBox:"0 0 120 120",xmlns:"http://www.w3.org/2000/svg"},h("circle",{class:"background",cx:"60",cy:"60",r:"54.5",fill:"currentColor",stroke:"currentColor","stroke-width":"8"}),h("circle",{class:"whitespace",cx:"60",cy:"60",r:"59",fill:"currentColor",stroke:"currentColor","stroke-width":"3"}),h("circle",{class:"border",cx:"60",cy:"60",r:"59",fill:"currentColor",stroke:"currentColor","stroke-width":"1"}),h("circle",{class:"whitespace",cx:"60",cy:"60",r:"51",fill:"currentColor",stroke:"currentColor","stroke-width":"1"}),h("circle",{class:"border",cx:"60",cy:"60",r:"50",fill:"currentColor",stroke:"currentColor","stroke-width":"1"}),h("circle",{class:"progress",fill:"currentColor",stroke:"currentColor","stroke-linecap":"round","stroke-dasharray":`${Math.round(t._value/t._max*342)}px 342px`,"stroke-width":"6",cx:"60",cy:"60",r:"54.5"}),t._label&&h("text",{"aria-hidden":"true",x:"50%",y:e,"text-anchor":"middle",fill:"currentColor"},t._label),h("text",{"aria-hidden":"true",x:"50%",y:n,"text-anchor":"middle",fill:"currentColor"},t._value,t._unit));default:return h("div",{class:"bar"},t._label&&h("div",null,t._label),h("div",{style:{display:"flex",gap:"0.3em"}},h("svg",{width:"100",viewBox:"0 0 102 8",xmlns:"http://www.w3.org/2000/svg"},h("rect",{class:"background",x:"1",y:"1",height:"10",rx:"5",fill:"currentColor",stroke:"currentColor","stroke-width":"3",width:"100"}),h("rect",{class:"progress",x:"2.5",y:"2.5",height:"7",rx:"3.5",fill:"currentColor",stroke:"currentColor","stroke-width":"3",width:t._value/t._max*95}),h("rect",{class:"border",x:"1",y:"1",height:"10",rx:"5",fill:"currentColor",stroke:"currentColor","stroke-width":"1",width:"100"})),h("text",{"aria-hidden":"true","text-anchor":"middle","dominant-baseline":"central",fill:"currentColor"},t._value,t._unit)))}},KolProcess=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.__attachShadow(),this._label=void 0,this._max=void 0,this._unit="%",this._value=void 0,this._variant=void 0,this.state={_max:100,_unit:"%",_value:0,_variant:"bar",_liveValue:0}}render(){return h(Host,null,createProgressSVG(this.state),h("progress",{"aria-busy":this.state._value<this.state._max?"true":"false",max:this.state._max,value:this.state._value}),h("span",{"aria-live":"polite","aria-relevant":"removals text",hidden:!0},this.state._liveValue," von ",this.state._max," ",this.state._unit))}validateLabel(t){validateLabel(this,t)}validateMax(t){"number"!=typeof t&&(t=100),watchNumber(this,"_max",t,{required:!0})}validateUnit(t){watchString(this,"_unit",t)}validateValue(t){"number"!=typeof t&&(t=0),watchNumber(this,"_value",t,{required:!0})}validateVariant(t){watchValidator(this,"_variant",(t=>"string"==typeof t&&VALID_VARIANTS.includes(t)),new Set(VALID_VARIANTS),t)}componentWillLoad(){this.validateLabel(this._label),this.validateMax(this._max),this.validateUnit(this._unit),this.validateValue(this._value),this.validateVariant(this._variant),this.interval=setInterval((()=>{this.state._liveValue!==this.state._value&&(this.state=Object.assign(Object.assign({},this.state),{_liveValue:this.state._value}))}),5e3)}disconnectedCallback(){clearInterval(this.interval)}static get watchers(){return{_label:["validateLabel"],_max:["validateMax"],_unit:["validateUnit"],_value:["validateValue"],_variant:["validateVariant"]}}static get style(){return{default:defaultStyleCss}}},[33,"kol-progress",{_label:[1],_max:[2],_unit:[1],_value:[2],_variant:[1],state:[32]},void 0,{_label:["validateLabel"],_max:["validateMax"],_unit:["validateUnit"],_value:["validateValue"],_variant:["validateVariant"]}]);function defineCustomElement$1(){if("undefined"==typeof customElements)return;["kol-progress"].forEach((t=>{if("kol-progress"===t)customElements.get(t)||customElements.define(t,KolProcess)}))}const KolProgress=KolProcess,defineCustomElement=defineCustomElement$1;export{KolProgress,defineCustomElement};