npm - @public-ui/components - Versions diffs - 1.5.0-rc.6 → 1.5.0-rc.7 - Mend

@public-ui/components 1.5.0-rc.6 → 1.5.0-rc.7

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

Files changed (41) hide show

package/cheat-sheet.html +6 -6
package/custom-elements.json +2 -2
package/dist/cjs/kol-alert.cjs.entry.js +1 -1
package/dist/cjs/kol-alert.cjs.entry.js.map +1 -1
package/dist/cjs/kol-icon.cjs.entry.js +1 -1
package/dist/cjs/kol-icon.cjs.entry.js.map +1 -1
package/dist/cjs/kol-nav.cjs.entry.js +1 -1
package/dist/cjs/kol-nav.cjs.entry.js.map +1 -1
package/dist/cjs/kol-toast.cjs.entry.js +1 -1
package/dist/cjs/kol-toast.cjs.entry.js.map +1 -1
package/dist/components/component2.js +1 -1
package/dist/components/component2.js.map +1 -1
package/dist/components/component5.js +1 -1
package/dist/components/component5.js.map +1 -1
package/dist/components/kol-nav.js +1 -1
package/dist/components/kol-nav.js.map +1 -1
package/dist/components/kol-toast.js +1 -1
package/dist/components/kol-toast.js.map +1 -1
package/dist/esm/kol-alert.entry.js +1 -1
package/dist/esm/kol-alert.entry.js.map +1 -1
package/dist/esm/kol-icon.entry.js +1 -1
package/dist/esm/kol-icon.entry.js.map +1 -1
package/dist/esm/kol-nav.entry.js +1 -1
package/dist/esm/kol-nav.entry.js.map +1 -1
package/dist/esm/kol-toast.entry.js +1 -1
package/dist/esm/kol-toast.entry.js.map +1 -1
package/dist/kolibri/assets/nav-simulation.js +1 -1
package/dist/kolibri/assets/toast-simulation.js +1 -1
package/dist/kolibri/kol-alert.entry.js +1 -1
package/dist/kolibri/kol-alert.entry.js.map +1 -1
package/dist/kolibri/kol-icon.entry.js +1 -1
package/dist/kolibri/kol-icon.entry.js.map +1 -1
package/dist/kolibri/kol-nav.entry.js +1 -1
package/dist/kolibri/kol-nav.entry.js.map +1 -1
package/dist/kolibri/kol-toast.entry.js +1 -1
package/dist/kolibri/kol-toast.entry.js.map +1 -1
package/dist/types/components/nav/component.d.ts +7 -0
package/doc/components.md +3 -3
package/doc/nav.md +8 -6
package/jest-test-results.json +1 -1
package/package.json +1 -1

package/dist/kolibri/kol-alert.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["defaultStyleCss","Icon","props","h","class","_ariaLabel","heading","length","ariaLabel","_icon","icon","AlertIcon","type","translate","KolAlert","this","close","_a","_on","onClose","undefined","Event","on","onClick","validateOnValue","value","_level","render","state","_alert","Log","debug","navigator","vibrate","e","setTimeout","validateAlert","Host","_type","_variant","role","_heading","_headline","_hasCloser","left","_iconOnly","_label","_tooltipAlign","watchBoolean","validateHasCloser","validateHeading","watchString","validateLevel","watchHeadingLevel","validateOn","setState","validateType","watchValidator","Set","validateVariant","componentWillLoad"],"sources":["./src/components/alert/style.css?tag=kol-alert&mode=default&encapsulation=shadow","./src/components/alert/component.tsx"],"sourcesContent":["@import '../style.css';\n@import '../host-display-block.css';\n\n:host > div {\n\tdisplay: grid;\n\tplace-items: stretch;\n\toverflow: hidden;\n}\n\n.heading {\n\tdisplay: grid;\n\tgrid-template-columns: auto 1fr auto;\n\tplace-items: center;\n}\n.heading > div {\n\tdisplay: grid;\n\tjustify-self: start;\n}\n.heading .heading-icon {\n\talign-items: center;\n\talign-self: stretch;\n\tdisplay: inline-flex;\n}\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { AlertType, AlertVariant, KoliBriAlertEventCallbacks } from '../../types/alert';\nimport { HeadingLevel } from '../../types/heading-level';\nimport { setState, watchBoolean, watchString, watchValidator } from '../../utils/prop.validators';\nimport { watchHeadingLevel } from '../heading/validation';\nimport { translate } from '../../i18n';\nimport { Log } from '../../utils/dev.utils';\n\n/*\n API\n /\ntype RequiredProps = unknown;\ntype OptionalProps = {\n\talert: boolean;\n\thasCloser: boolean;\n\theading: string;\n\tlevel: HeadingLevel;\n\ton: KoliBriAlertEventCallbacks;\n\ttype: AlertType;\n\tvariant: AlertVariant;\n};\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = RequiredProps;\ntype OptionalStates = OptionalProps;\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\nconst Icon = (props: { ariaLabel: string; icon: string; heading?: string }) => {\n\treturn <kol-icon class=\"heading-icon\" _ariaLabel={typeof props.heading === 'string' && props.heading.length > 0 ? '' : props.ariaLabel} _icon={props.icon} />;\n};\n\nconst AlertIcon = (props: { heading?: string; type?: AlertType }) => {\n\tswitch (props.type) {\n\t\tcase 'error':\n\t\t\treturn <Icon ariaLabel={translate('kol-error')} icon=\"codicon codicon-error\" heading={props.heading} />;\n\t\tcase 'info':\n\t\t\treturn <Icon ariaLabel={translate('kol-info')} icon=\"codicon codicon-info\" heading={props.heading} />;\n\t\tcase 'warning':\n\t\t\treturn <Icon ariaLabel={translate('kol-warning')} icon=\"codicon codicon-warning\" heading={props.heading} />;\n\t\tcase 'success':\n\t\t\treturn <Icon ariaLabel={translate('kol-success')} icon=\"codicon codicon-pass\" heading={props.heading} />;\n\t\tdefault:\n\t\t\treturn <Icon ariaLabel={translate('kol-message')} icon=\"codicon codicon-comment\" heading={props.heading} />;\n\t}\n};\n\n@Component({\n\ttag: 'kol-alert',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolAlert implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\tprivate readonly close = () => {\n\t\tif (this._on?.onClose !== undefined) {\n\t\t\tthis._on.onClose(new Event('Close'));\n\t\t}\n\t};\n\n\tprivate readonly on = {\n\t\tonClick: this.close,\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tif (this.state._alert) {\n\t\t\t/\n\t\t\t - https://developer.mozilla.org/de/docs/Web/API/Navigator/vibrate\n\t\t\t * - https://googlechrome.github.io/samples/vibration/\n\t\t\t /\n\t\t\ttry {\n\t\t\t\tLog.debug(['Navigator should vibrate ...', navigator.vibrate([100, 75, 100, 75, 100])]);\n\t\t\t} catch (e) {\n\t\t\t\tLog.debug('Navigator does not support vibration.');\n\t\t\t}\n\n\t\t\tsetTimeout(() => {\n\t\t\t\tthis.validateAlert(false);\n\t\t\t}, 10000);\n\t\t}\n\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<div\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t[this.state._type as string]: true,\n\t\t\t\t\t\t[this.state._variant as string]: true,\n\t\t\t\t\t}}\n\t\t\t\t\trole={this.state._alert ? 'alert' : undefined}\n\t\t\t\t>\n\t\t\t\t\t<div class=\"heading\">\n\t\t\t\t\t\t<AlertIcon heading={this.state._heading} type={this.state._type} />\n\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t{typeof this.state._heading === 'string' && this.state._heading?.length > 0 && (\n\t\t\t\t\t\t\t\t<kol-heading-wc _headline={this.state._heading} _level={this.state._level}></kol-heading-wc>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{this._variant === 'msg' && (\n\t\t\t\t\t\t\t\t<div class=\"content\">\n\t\t\t\t\t\t\t\t\t<slot />\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t{this.state._hasCloser && (\n\t\t\t\t\t\t\t<kol-button-wc\n\t\t\t\t\t\t\t\tclass=\"close\"\n\t\t\t\t\t\t\t\t_icon={{\n\t\t\t\t\t\t\t\t\tleft: {\n\t\t\t\t\t\t\t\t\t\ticon: 'codicon codicon-close',\n\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t_iconOnly\n\t\t\t\t\t\t\t\t_label={translate('kol-close')}\n\t\t\t\t\t\t\t\t_on={this.on}\n\t\t\t\t\t\t\t\t_tooltipAlign=\"left\"\n\t\t\t\t\t\t\t></kol-button-wc>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t\t{this._variant === 'card' && (\n\t\t\t\t\t\t<div class=\"content\">\n\t\t\t\t\t\t\t<slot />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/\n\t Gibt an, ob der Screenreader die Meldung vorlesen soll.\n\t /\n\t@Prop({ reflect: true }) public _alert?: boolean = false;\n\n\t/\n\t Gibt an, ob der Alert ein Schließen-Icon hat.\n\t /\n\t@Prop({ reflect: true }) public _hasCloser?: boolean = false;\n\n\t/\n\t Gibt den Titel der Meldung an.\n\t /\n\t@Prop() public _heading?: string;\n\n\t/\n\t Gibt an, welchen H-Level von 1 bis 6 die Überschrift hat.\n\t /\n\t@Prop() public _level?: HeadingLevel = 1;\n\n\t/\n\t Gibt die EventCallback-Function für das Schließen des Alerts an.\n\t /\n\t@Prop() public _on?: KoliBriAlertEventCallbacks;\n\n\t/\n\t Gibt an, ob es sich um eine Erfolgs-, Info-, Warnung- oder Fehlermeldung handelt.\n\t /\n\t@Prop() public _type?: AlertType = 'default';\n\n\t/\n\t Gibt an, welche Benachrichtigungsvariante dargestellt wird.\n\t /\n\t@Prop() public _variant?: AlertVariant = 'msg';\n\n\t/\n\t @see: components/abbr/component.tsx (@State)\n\t /\n\t@State() public state: States = {\n\t\t_level: 1,\n\t};\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\twatchBoolean(this, '_alert', value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_hasCloser')\n\tpublic validateHasCloser(value?: boolean): void {\n\t\twatchBoolean(this, '_hasCloser', value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_heading')\n\tpublic validateHeading(value?: string): void {\n\t\twatchString(this, '_heading', value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_level')\n\tpublic validateLevel(value?: HeadingLevel): void {\n\t\twatchHeadingLevel(this, value);\n\t}\n\n\tprivate validateOnValue = (value: unknown): boolean =>\n\t\ttypeof value === 'object' && value !== null && typeof (value as KoliBriAlertEventCallbacks).onClose === 'function';\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_on')\n\tpublic validateOn(value?: KoliBriAlertEventCallbacks): void {\n\t\tif (this.validateOnValue(value)) {\n\t\t\tsetState<KoliBriAlertEventCallbacks>(\n\t\t\t\tthis,\n\t\t\t\t'_on',\n\t\t\t\t{\n\t\t\t\t\tonClose: (value as KoliBriAlertEventCallbacks).onClose,\n\t\t\t\t}\n\t\t\t\t// {\n\t\t\t\t// \tafterPatch: (value: unknown) => {\n\t\t\t\t// \t\tthis._hasCloser = this.validateOnValue(value);\n\t\t\t\t// \t},\n\t\t\t\t// }\n\t\t\t);\n\t\t\t// } else {\n\t\t\t// \tsetState<KoliBriAlertEventCallbacks>(this, '_on', null, {\n\t\t\t// \t\tafterPatch: (value: unknown) => {\n\t\t\t// \t\t\tthis._hasCloser = this.validateOnValue(value);\n\t\t\t// \t\t},\n\t\t\t// \t});\n\t\t}\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_type')\n\tpublic validateType(value?: AlertType): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_type',\n\t\t\t(value) => typeof value === 'string' && (value === 'default' \|\| value === 'error' \|\| value === 'info' \|\| value === 'success' \|\| value === 'warning'),\n\t\t\tnew Set('String {success, info, warning, error}'),\n\t\t\tvalue\n\t\t);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_variant')\n\tpublic validateVariant(value?: AlertVariant): void {\n\t\twatchValidator(this, '_variant', (value) => value === 'card' \|\| value === 'msg', new Set('AlertVariant {card, msg}'), value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAlert(this._alert);\n\t\tthis.validateHasCloser(this._hasCloser);\n\t\tthis.validateHeading(this._heading);\n\t\tthis.validateLevel(this._level);\n\t\tthis.validateOn(this._on);\n\t\tthis.validateType(this._type);\n\t\tthis.validateVariant(this._variant);\n\t}\n}\n"],"mappings":"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"}
1	+ {"version":3,"names":["defaultStyleCss","Icon","props","h","class","_ariaLabel","heading","length","ariaLabel","_icon","icon","AlertIcon","type","translate","KolAlert","this","close","_a","_on","onClose","undefined","Event","on","onClick","validateOnValue","value","_level","render","state","_alert","Log","debug","navigator","vibrate","e","setTimeout","validateAlert","Host","_type","_variant","role","_heading","_headline","_hasCloser","left","_iconOnly","_label","_tooltipAlign","watchBoolean","validateHasCloser","validateHeading","watchString","validateLevel","watchHeadingLevel","validateOn","setState","validateType","watchValidator","Set","validateVariant","componentWillLoad"],"sources":["./src/components/alert/style.css?tag=kol-alert&mode=default&encapsulation=shadow","./src/components/alert/component.tsx"],"sourcesContent":["@import '../style.css';\n@import '../host-display-block.css';\n\n:host > div {\n\tbackground-color: white; /* needed for overlay situations /\n\tdisplay: grid;\n\tplace-items: stretch;\n\toverflow: hidden;\n}\n\n.heading {\n\tdisplay: grid;\n\tgrid-template-columns: auto 1fr auto;\n\tplace-items: center;\n}\n.heading > div {\n\tdisplay: grid;\n\tjustify-self: start;\n}\n.heading .heading-icon {\n\talign-items: center;\n\talign-self: stretch;\n\tdisplay: inline-flex;\n}\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { AlertType, AlertVariant, KoliBriAlertEventCallbacks } from '../../types/alert';\nimport { HeadingLevel } from '../../types/heading-level';\nimport { setState, watchBoolean, watchString, watchValidator } from '../../utils/prop.validators';\nimport { watchHeadingLevel } from '../heading/validation';\nimport { translate } from '../../i18n';\nimport { Log } from '../../utils/dev.utils';\n\n/\n API\n /\ntype RequiredProps = unknown;\ntype OptionalProps = {\n\talert: boolean;\n\thasCloser: boolean;\n\theading: string;\n\tlevel: HeadingLevel;\n\ton: KoliBriAlertEventCallbacks;\n\ttype: AlertType;\n\tvariant: AlertVariant;\n};\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = RequiredProps;\ntype OptionalStates = OptionalProps;\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\nconst Icon = (props: { ariaLabel: string; icon: string; heading?: string }) => {\n\treturn <kol-icon class=\"heading-icon\" _ariaLabel={typeof props.heading === 'string' && props.heading.length > 0 ? '' : props.ariaLabel} _icon={props.icon} />;\n};\n\nconst AlertIcon = (props: { heading?: string; type?: AlertType }) => {\n\tswitch (props.type) {\n\t\tcase 'error':\n\t\t\treturn <Icon ariaLabel={translate('kol-error')} icon=\"codicon codicon-error\" heading={props.heading} />;\n\t\tcase 'info':\n\t\t\treturn <Icon ariaLabel={translate('kol-info')} icon=\"codicon codicon-info\" heading={props.heading} />;\n\t\tcase 'warning':\n\t\t\treturn <Icon ariaLabel={translate('kol-warning')} icon=\"codicon codicon-warning\" heading={props.heading} />;\n\t\tcase 'success':\n\t\t\treturn <Icon ariaLabel={translate('kol-success')} icon=\"codicon codicon-pass\" heading={props.heading} />;\n\t\tdefault:\n\t\t\treturn <Icon ariaLabel={translate('kol-message')} icon=\"codicon codicon-comment\" heading={props.heading} />;\n\t}\n};\n\n@Component({\n\ttag: 'kol-alert',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolAlert implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\tprivate readonly close = () => {\n\t\tif (this._on?.onClose !== undefined) {\n\t\t\tthis._on.onClose(new Event('Close'));\n\t\t}\n\t};\n\n\tprivate readonly on = {\n\t\tonClick: this.close,\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tif (this.state._alert) {\n\t\t\t/\n\t\t\t - https://developer.mozilla.org/de/docs/Web/API/Navigator/vibrate\n\t\t\t * - https://googlechrome.github.io/samples/vibration/\n\t\t\t /\n\t\t\ttry {\n\t\t\t\tLog.debug(['Navigator should vibrate ...', navigator.vibrate([100, 75, 100, 75, 100])]);\n\t\t\t} catch (e) {\n\t\t\t\tLog.debug('Navigator does not support vibration.');\n\t\t\t}\n\n\t\t\tsetTimeout(() => {\n\t\t\t\tthis.validateAlert(false);\n\t\t\t}, 10000);\n\t\t}\n\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<div\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t[this.state._type as string]: true,\n\t\t\t\t\t\t[this.state._variant as string]: true,\n\t\t\t\t\t}}\n\t\t\t\t\trole={this.state._alert ? 'alert' : undefined}\n\t\t\t\t>\n\t\t\t\t\t<div class=\"heading\">\n\t\t\t\t\t\t<AlertIcon heading={this.state._heading} type={this.state._type} />\n\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t{typeof this.state._heading === 'string' && this.state._heading?.length > 0 && (\n\t\t\t\t\t\t\t\t<kol-heading-wc _headline={this.state._heading} _level={this.state._level}></kol-heading-wc>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{this._variant === 'msg' && (\n\t\t\t\t\t\t\t\t<div class=\"content\">\n\t\t\t\t\t\t\t\t\t<slot />\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t{this.state._hasCloser && (\n\t\t\t\t\t\t\t<kol-button-wc\n\t\t\t\t\t\t\t\tclass=\"close\"\n\t\t\t\t\t\t\t\t_icon={{\n\t\t\t\t\t\t\t\t\tleft: {\n\t\t\t\t\t\t\t\t\t\ticon: 'codicon codicon-close',\n\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t_iconOnly\n\t\t\t\t\t\t\t\t_label={translate('kol-close')}\n\t\t\t\t\t\t\t\t_on={this.on}\n\t\t\t\t\t\t\t\t_tooltipAlign=\"left\"\n\t\t\t\t\t\t\t></kol-button-wc>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t\t{this._variant === 'card' && (\n\t\t\t\t\t\t<div class=\"content\">\n\t\t\t\t\t\t\t<slot />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/\n\t Gibt an, ob der Screenreader die Meldung vorlesen soll.\n\t /\n\t@Prop({ reflect: true }) public _alert?: boolean = false;\n\n\t/\n\t Gibt an, ob der Alert ein Schließen-Icon hat.\n\t /\n\t@Prop({ reflect: true }) public _hasCloser?: boolean = false;\n\n\t/\n\t Gibt den Titel der Meldung an.\n\t /\n\t@Prop() public _heading?: string;\n\n\t/\n\t Gibt an, welchen H-Level von 1 bis 6 die Überschrift hat.\n\t /\n\t@Prop() public _level?: HeadingLevel = 1;\n\n\t/\n\t Gibt die EventCallback-Function für das Schließen des Alerts an.\n\t /\n\t@Prop() public _on?: KoliBriAlertEventCallbacks;\n\n\t/\n\t Gibt an, ob es sich um eine Erfolgs-, Info-, Warnung- oder Fehlermeldung handelt.\n\t /\n\t@Prop() public _type?: AlertType = 'default';\n\n\t/\n\t Gibt an, welche Benachrichtigungsvariante dargestellt wird.\n\t /\n\t@Prop() public _variant?: AlertVariant = 'msg';\n\n\t/\n\t @see: components/abbr/component.tsx (@State)\n\t /\n\t@State() public state: States = {\n\t\t_level: 1,\n\t};\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\twatchBoolean(this, '_alert', value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_hasCloser')\n\tpublic validateHasCloser(value?: boolean): void {\n\t\twatchBoolean(this, '_hasCloser', value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_heading')\n\tpublic validateHeading(value?: string): void {\n\t\twatchString(this, '_heading', value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_level')\n\tpublic validateLevel(value?: HeadingLevel): void {\n\t\twatchHeadingLevel(this, value);\n\t}\n\n\tprivate validateOnValue = (value: unknown): boolean =>\n\t\ttypeof value === 'object' && value !== null && typeof (value as KoliBriAlertEventCallbacks).onClose === 'function';\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_on')\n\tpublic validateOn(value?: KoliBriAlertEventCallbacks): void {\n\t\tif (this.validateOnValue(value)) {\n\t\t\tsetState<KoliBriAlertEventCallbacks>(\n\t\t\t\tthis,\n\t\t\t\t'_on',\n\t\t\t\t{\n\t\t\t\t\tonClose: (value as KoliBriAlertEventCallbacks).onClose,\n\t\t\t\t}\n\t\t\t\t// {\n\t\t\t\t// \tafterPatch: (value: unknown) => {\n\t\t\t\t// \t\tthis._hasCloser = this.validateOnValue(value);\n\t\t\t\t// \t},\n\t\t\t\t// }\n\t\t\t);\n\t\t\t// } else {\n\t\t\t// \tsetState<KoliBriAlertEventCallbacks>(this, '_on', null, {\n\t\t\t// \t\tafterPatch: (value: unknown) => {\n\t\t\t// \t\t\tthis._hasCloser = this.validateOnValue(value);\n\t\t\t// \t\t},\n\t\t\t// \t});\n\t\t}\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_type')\n\tpublic validateType(value?: AlertType): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_type',\n\t\t\t(value) => typeof value === 'string' && (value === 'default' \|\| value === 'error' \|\| value === 'info' \|\| value === 'success' \|\| value === 'warning'),\n\t\t\tnew Set('String {success, info, warning, error}'),\n\t\t\tvalue\n\t\t);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_variant')\n\tpublic validateVariant(value?: AlertVariant): void {\n\t\twatchValidator(this, '_variant', (value) => value === 'card' \|\| value === 'msg', new Set('AlertVariant {card, msg}'), value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAlert(this._alert);\n\t\tthis.validateHasCloser(this._hasCloser);\n\t\tthis.validateHeading(this._heading);\n\t\tthis.validateLevel(this._level);\n\t\tthis.validateOn(this._on);\n\t\tthis.validateType(this._type);\n\t\tthis.validateVariant(this._variant);\n\t}\n}\n"],"mappings":";;;6WAAA,MAAMA,EAAkB,uqCC6BxB,MAAMC,EAAQC,GACNC,EAAA,YAAUC,MAAM,eAAeC,kBAAmBH,EAAMI,UAAY,UAAYJ,EAAMI,QAAQC,OAAS,EAAI,GAAKL,EAAMM,UAAWC,MAAOP,EAAMQ,OAGtJ,MAAMC,EAAaT,IAClB,OAAQA,EAAMU,MACb,IAAK,QACJ,OAAOT,EAACF,EAAI,CAACO,UAAWK,EAAU,aAAcH,KAAK,wBAAwBJ,QAASJ,EAAMI,UAC7F,IAAK,OACJ,OAAOH,EAACF,EAAI,CAACO,UAAWK,EAAU,YAAaH,KAAK,uBAAuBJ,QAASJ,EAAMI,UAC3F,IAAK,UACJ,OAAOH,EAACF,EAAI,CAACO,UAAWK,EAAU,eAAgBH,KAAK,0BAA0BJ,QAASJ,EAAMI,UACjG,IAAK,UACJ,OAAOH,EAACF,EAAI,CAACO,UAAWK,EAAU,eAAgBH,KAAK,uBAAuBJ,QAASJ,EAAMI,UAC9F,QACC,OAAOH,EAACF,EAAI,CAACO,UAAWK,EAAU,eAAgBH,KAAK,0BAA0BJ,QAASJ,EAAMI,U,QAWtFQ,EAAQ,M,yBACHC,KAAAC,MAAQ,K,MACxB,KAAIC,EAAAF,KAAKG,OAAG,MAAAD,SAAA,SAAAA,EAAEE,WAAYC,UAAW,CACpCL,KAAKG,IAAIC,QAAQ,IAAIE,MAAM,S,GAIZN,KAAAO,GAAK,CACrBC,QAASR,KAAKC,OA4IPD,KAAAS,gBAAmBC,UACnBA,IAAU,UAAYA,IAAU,aAAgBA,EAAqCN,UAAY,W,YAxEtD,M,gBAKI,M,oCAUhB,E,8BAUJ,U,cAKM,M,WAKT,CAC/BO,OAAQ,E,CAtGFC,S,MACN,GAAIZ,KAAKa,MAAMC,OAAQ,CAKtB,IACCC,EAAIC,MAAM,CAAC,+BAAgCC,UAAUC,QAAQ,CAAC,IAAK,GAAI,IAAK,GAAI,O,CAC/E,MAAOC,GACRJ,EAAIC,MAAM,wC,CAGXI,YAAW,KACVpB,KAAKqB,cAAc,MAAM,GACvB,I,CAGJ,OACCjC,EAACkC,EAAI,KACJlC,EAAA,OACCC,MAAO,CACN,CAACW,KAAKa,MAAMU,OAAkB,KAC9B,CAACvB,KAAKa,MAAMW,UAAqB,MAElCC,KAAMzB,KAAKa,MAAMC,OAAS,QAAUT,WAEpCjB,EAAA,OAAKC,MAAM,WACVD,EAACQ,EAAS,CAACL,QAASS,KAAKa,MAAMa,SAAU7B,KAAMG,KAAKa,MAAMU,QAC1DnC,EAAA,kBACSY,KAAKa,MAAMa,WAAa,YAAYxB,EAAAF,KAAKa,MAAMa,YAAQ,MAAAxB,SAAA,SAAAA,EAAEV,QAAS,GACzEJ,EAAA,kBAAgBuC,UAAW3B,KAAKa,MAAMa,SAAUf,OAAQX,KAAKa,MAAMF,SAEnEX,KAAKwB,WAAa,OAClBpC,EAAA,OAAKC,MAAM,WACVD,EAAA,eAIFY,KAAKa,MAAMe,YACXxC,EAAA,iBACCC,MAAM,QACNK,MAAO,CACNmC,KAAM,CACLlC,KAAM,0BAGRmC,UAAS,KACTC,OAAQjC,EAAU,aAClBK,IAAKH,KAAKO,GACVyB,cAAc,UAIhBhC,KAAKwB,WAAa,QAClBpC,EAAA,OAAKC,MAAM,WACVD,EAAA,e,CAsDCiC,cAAcX,GACpBuB,EAAajC,KAAM,SAAUU,E,CAOvBwB,kBAAkBxB,GACxBuB,EAAajC,KAAM,aAAcU,E,CAO3ByB,gBAAgBzB,GACtB0B,EAAYpC,KAAM,WAAYU,E,CAOxB2B,cAAc3B,GACpB4B,EAAkBtC,KAAMU,E,CAUlB6B,WAAW7B,GACjB,GAAIV,KAAKS,gBAAgBC,GAAQ,CAChC8B,EACCxC,KACA,MACA,CACCI,QAAUM,EAAqCN,S,EAqB5CqC,aAAa/B,GACnBgC,EACC1C,KACA,SACCU,UAAiBA,IAAU,WAAaA,IAAU,WAAaA,IAAU,SAAWA,IAAU,QAAUA,IAAU,WAAaA,IAAU,YAC1I,IAAIiC,IAAI,0CACRjC,E,CAQKkC,gBAAgBlC,GACtBgC,EAAe1C,KAAM,YAAaU,GAAUA,IAAU,QAAUA,IAAU,OAAO,IAAIiC,IAAI,4BAA6BjC,E,CAMhHmC,oBACN7C,KAAKqB,cAAcrB,KAAKc,QACxBd,KAAKkC,kBAAkBlC,KAAK4B,YAC5B5B,KAAKmC,gBAAgBnC,KAAK0B,UAC1B1B,KAAKqC,cAAcrC,KAAKW,QACxBX,KAAKuC,WAAWvC,KAAKG,KACrBH,KAAKyC,aAAazC,KAAKuB,OACvBvB,KAAK4C,gBAAgB5C,KAAKwB,S"}

package/dist/kolibri/kol-icon.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{r as e,h as o,H as c}from"./index-50adf9a0.js";import{w as n}from"./prop.validators-daa14517.js";import{d as t}from"./a11y.tipps-e0a65f3c.js";import"./dev.utils-bedce29d.js";import"./reuse-56bb5a4b.js";import"./index-81bd9b41.js";const b='@font-face{font-family:"codicon";font-display:block;src:url("./codicon.ttf?0e5b0adf625a37fbcd638d31f0fe72aa") format("truetype")}.codicon[class*=\'codicon-\']{font:normal normal normal 16px/1 codicon;display:inline-block;text-decoration:none;text-rendering:auto;text-align:center;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;user-select:none;-webkit-user-select:none;-ms-user-select:none}@keyframes codicon-spin{100%{transform:rotate(360deg)}}.codicon-sync.codicon-modifier-spin,.codicon-loading.codicon-modifier-spin,.codicon-gear.codicon-modifier-spin{animation:codicon-spin 1.5s steps(30) infinite}.codicon-modifier-disabled{opacity:0.5}.codicon-modifier-hidden{opacity:0}.codicon-loading{animation-duration:1s !important;animation-timing-function:cubic-bezier(0.53, 0.21, 0.29, 0.67) !important}.codicon-add:before{content:"\\ea60"}.codicon-plus:before{content:"\\ea60"}.codicon-gist-new:before{content:"\\ea60"}.codicon-repo-create:before{content:"\\ea60"}.codicon-lightbulb:before{content:"\\ea61"}.codicon-light-bulb:before{content:"\\ea61"}.codicon-repo:before{content:"\\ea62"}.codicon-repo-delete:before{content:"\\ea62"}.codicon-gist-fork:before{content:"\\ea63"}.codicon-repo-forked:before{content:"\\ea63"}.codicon-git-pull-request:before{content:"\\ea64"}.codicon-git-pull-request-abandoned:before{content:"\\ea64"}.codicon-record-keys:before{content:"\\ea65"}.codicon-keyboard:before{content:"\\ea65"}.codicon-tag:before{content:"\\ea66"}.codicon-tag-add:before{content:"\\ea66"}.codicon-tag-remove:before{content:"\\ea66"}.codicon-person:before{content:"\\ea67"}.codicon-person-follow:before{content:"\\ea67"}.codicon-person-outline:before{content:"\\ea67"}.codicon-person-filled:before{content:"\\ea67"}.codicon-git-branch:before{content:"\\ea68"}.codicon-git-branch-create:before{content:"\\ea68"}.codicon-git-branch-delete:before{content:"\\ea68"}.codicon-source-control:before{content:"\\ea68"}.codicon-mirror:before{content:"\\ea69"}.codicon-mirror-public:before{content:"\\ea69"}.codicon-star:before{content:"\\ea6a"}.codicon-star-add:before{content:"\\ea6a"}.codicon-star-delete:before{content:"\\ea6a"}.codicon-star-empty:before{content:"\\ea6a"}.codicon-comment:before{content:"\\ea6b"}.codicon-comment-add:before{content:"\\ea6b"}.codicon-alert:before{content:"\\ea6c"}.codicon-warning:before{content:"\\ea6c"}.codicon-search:before{content:"\\ea6d"}.codicon-search-save:before{content:"\\ea6d"}.codicon-log-out:before{content:"\\ea6e"}.codicon-sign-out:before{content:"\\ea6e"}.codicon-log-in:before{content:"\\ea6f"}.codicon-sign-in:before{content:"\\ea6f"}.codicon-eye:before{content:"\\ea70"}.codicon-eye-unwatch:before{content:"\\ea70"}.codicon-eye-watch:before{content:"\\ea70"}.codicon-circle-filled:before{content:"\\ea71"}.codicon-primitive-dot:before{content:"\\ea71"}.codicon-close-dirty:before{content:"\\ea71"}.codicon-debug-breakpoint:before{content:"\\ea71"}.codicon-debug-breakpoint-disabled:before{content:"\\ea71"}.codicon-debug-hint:before{content:"\\ea71"}.codicon-primitive-square:before{content:"\\ea72"}.codicon-edit:before{content:"\\ea73"}.codicon-pencil:before{content:"\\ea73"}.codicon-info:before{content:"\\ea74"}.codicon-issue-opened:before{content:"\\ea74"}.codicon-gist-private:before{content:"\\ea75"}.codicon-git-fork-private:before{content:"\\ea75"}.codicon-lock:before{content:"\\ea75"}.codicon-mirror-private:before{content:"\\ea75"}.codicon-close:before{content:"\\ea76"}.codicon-remove-close:before{content:"\\ea76"}.codicon-x:before{content:"\\ea76"}.codicon-repo-sync:before{content:"\\ea77"}.codicon-sync:before{content:"\\ea77"}.codicon-clone:before{content:"\\ea78"}.codicon-desktop-download:before{content:"\\ea78"}.codicon-beaker:before{content:"\\ea79"}.codicon-microscope:before{content:"\\ea79"}.codicon-vm:before{content:"\\ea7a"}.codicon-device-desktop:before{content:"\\ea7a"}.codicon-file:before{content:"\\ea7b"}.codicon-file-text:before{content:"\\ea7b"}.codicon-more:before{content:"\\ea7c"}.codicon-ellipsis:before{content:"\\ea7c"}.codicon-kebab-horizontal:before{content:"\\ea7c"}.codicon-mail-reply:before{content:"\\ea7d"}.codicon-reply:before{content:"\\ea7d"}.codicon-organization:before{content:"\\ea7e"}.codicon-organization-filled:before{content:"\\ea7e"}.codicon-organization-outline:before{content:"\\ea7e"}.codicon-new-file:before{content:"\\ea7f"}.codicon-file-add:before{content:"\\ea7f"}.codicon-new-folder:before{content:"\\ea80"}.codicon-file-directory-create:before{content:"\\ea80"}.codicon-trash:before{content:"\\ea81"}.codicon-trashcan:before{content:"\\ea81"}.codicon-history:before{content:"\\ea82"}.codicon-clock:before{content:"\\ea82"}.codicon-folder:before{content:"\\ea83"}.codicon-file-directory:before{content:"\\ea83"}.codicon-symbol-folder:before{content:"\\ea83"}.codicon-logo-github:before{content:"\\ea84"}.codicon-mark-github:before{content:"\\ea84"}.codicon-github:before{content:"\\ea84"}.codicon-terminal:before{content:"\\ea85"}.codicon-console:before{content:"\\ea85"}.codicon-repl:before{content:"\\ea85"}.codicon-zap:before{content:"\\ea86"}.codicon-symbol-event:before{content:"\\ea86"}.codicon-error:before{content:"\\ea87"}.codicon-stop:before{content:"\\ea87"}.codicon-variable:before{content:"\\ea88"}.codicon-symbol-variable:before{content:"\\ea88"}.codicon-array:before{content:"\\ea8a"}.codicon-symbol-array:before{content:"\\ea8a"}.codicon-symbol-module:before{content:"\\ea8b"}.codicon-symbol-package:before{content:"\\ea8b"}.codicon-symbol-namespace:before{content:"\\ea8b"}.codicon-symbol-object:before{content:"\\ea8b"}.codicon-symbol-method:before{content:"\\ea8c"}.codicon-symbol-function:before{content:"\\ea8c"}.codicon-symbol-constructor:before{content:"\\ea8c"}.codicon-symbol-boolean:before{content:"\\ea8f"}.codicon-symbol-null:before{content:"\\ea8f"}.codicon-symbol-numeric:before{content:"\\ea90"}.codicon-symbol-number:before{content:"\\ea90"}.codicon-symbol-structure:before{content:"\\ea91"}.codicon-symbol-struct:before{content:"\\ea91"}.codicon-symbol-parameter:before{content:"\\ea92"}.codicon-symbol-type-parameter:before{content:"\\ea92"}.codicon-symbol-key:before{content:"\\ea93"}.codicon-symbol-text:before{content:"\\ea93"}.codicon-symbol-reference:before{content:"\\ea94"}.codicon-go-to-file:before{content:"\\ea94"}.codicon-symbol-enum:before{content:"\\ea95"}.codicon-symbol-value:before{content:"\\ea95"}.codicon-symbol-ruler:before{content:"\\ea96"}.codicon-symbol-unit:before{content:"\\ea96"}.codicon-activate-breakpoints:before{content:"\\ea97"}.codicon-archive:before{content:"\\ea98"}.codicon-arrow-both:before{content:"\\ea99"}.codicon-arrow-down:before{content:"\\ea9a"}.codicon-arrow-left:before{content:"\\ea9b"}.codicon-arrow-right:before{content:"\\ea9c"}.codicon-arrow-small-down:before{content:"\\ea9d"}.codicon-arrow-small-left:before{content:"\\ea9e"}.codicon-arrow-small-right:before{content:"\\ea9f"}.codicon-arrow-small-up:before{content:"\\eaa0"}.codicon-arrow-up:before{content:"\\eaa1"}.codicon-bell:before{content:"\\eaa2"}.codicon-bold:before{content:"\\eaa3"}.codicon-book:before{content:"\\eaa4"}.codicon-bookmark:before{content:"\\eaa5"}.codicon-debug-breakpoint-conditional-unverified:before{content:"\\eaa6"}.codicon-debug-breakpoint-conditional:before{content:"\\eaa7"}.codicon-debug-breakpoint-conditional-disabled:before{content:"\\eaa7"}.codicon-debug-breakpoint-data-unverified:before{content:"\\eaa8"}.codicon-debug-breakpoint-data:before{content:"\\eaa9"}.codicon-debug-breakpoint-data-disabled:before{content:"\\eaa9"}.codicon-debug-breakpoint-log-unverified:before{content:"\\eaaa"}.codicon-debug-breakpoint-log:before{content:"\\eaab"}.codicon-debug-breakpoint-log-disabled:before{content:"\\eaab"}.codicon-briefcase:before{content:"\\eaac"}.codicon-broadcast:before{content:"\\eaad"}.codicon-browser:before{content:"\\eaae"}.codicon-bug:before{content:"\\eaaf"}.codicon-calendar:before{content:"\\eab0"}.codicon-case-sensitive:before{content:"\\eab1"}.codicon-check:before{content:"\\eab2"}.codicon-checklist:before{content:"\\eab3"}.codicon-chevron-down:before{content:"\\eab4"}.codicon-chevron-left:before{content:"\\eab5"}.codicon-chevron-right:before{content:"\\eab6"}.codicon-chevron-up:before{content:"\\eab7"}.codicon-chrome-close:before{content:"\\eab8"}.codicon-chrome-maximize:before{content:"\\eab9"}.codicon-chrome-minimize:before{content:"\\eaba"}.codicon-chrome-restore:before{content:"\\eabb"}.codicon-circle-outline:before{content:"\\eabc"}.codicon-debug-breakpoint-unverified:before{content:"\\eabc"}.codicon-circle-slash:before{content:"\\eabd"}.codicon-circuit-board:before{content:"\\eabe"}.codicon-clear-all:before{content:"\\eabf"}.codicon-clippy:before{content:"\\eac0"}.codicon-close-all:before{content:"\\eac1"}.codicon-cloud-download:before{content:"\\eac2"}.codicon-cloud-upload:before{content:"\\eac3"}.codicon-code:before{content:"\\eac4"}.codicon-collapse-all:before{content:"\\eac5"}.codicon-color-mode:before{content:"\\eac6"}.codicon-comment-discussion:before{content:"\\eac7"}.codicon-credit-card:before{content:"\\eac9"}.codicon-dash:before{content:"\\eacc"}.codicon-dashboard:before{content:"\\eacd"}.codicon-database:before{content:"\\eace"}.codicon-debug-continue:before{content:"\\eacf"}.codicon-debug-disconnect:before{content:"\\ead0"}.codicon-debug-pause:before{content:"\\ead1"}.codicon-debug-restart:before{content:"\\ead2"}.codicon-debug-start:before{content:"\\ead3"}.codicon-debug-step-into:before{content:"\\ead4"}.codicon-debug-step-out:before{content:"\\ead5"}.codicon-debug-step-over:before{content:"\\ead6"}.codicon-debug-stop:before{content:"\\ead7"}.codicon-debug:before{content:"\\ead8"}.codicon-device-camera-video:before{content:"\\ead9"}.codicon-device-camera:before{content:"\\eada"}.codicon-device-mobile:before{content:"\\eadb"}.codicon-diff-added:before{content:"\\eadc"}.codicon-diff-ignored:before{content:"\\eadd"}.codicon-diff-modified:before{content:"\\eade"}.codicon-diff-removed:before{content:"\\eadf"}.codicon-diff-renamed:before{content:"\\eae0"}.codicon-diff:before{content:"\\eae1"}.codicon-discard:before{content:"\\eae2"}.codicon-editor-layout:before{content:"\\eae3"}.codicon-empty-window:before{content:"\\eae4"}.codicon-exclude:before{content:"\\eae5"}.codicon-extensions:before{content:"\\eae6"}.codicon-eye-closed:before{content:"\\eae7"}.codicon-file-binary:before{content:"\\eae8"}.codicon-file-code:before{content:"\\eae9"}.codicon-file-media:before{content:"\\eaea"}.codicon-file-pdf:before{content:"\\eaeb"}.codicon-file-submodule:before{content:"\\eaec"}.codicon-file-symlink-directory:before{content:"\\eaed"}.codicon-file-symlink-file:before{content:"\\eaee"}.codicon-file-zip:before{content:"\\eaef"}.codicon-files:before{content:"\\eaf0"}.codicon-filter:before{content:"\\eaf1"}.codicon-flame:before{content:"\\eaf2"}.codicon-fold-down:before{content:"\\eaf3"}.codicon-fold-up:before{content:"\\eaf4"}.codicon-fold:before{content:"\\eaf5"}.codicon-folder-active:before{content:"\\eaf6"}.codicon-folder-opened:before{content:"\\eaf7"}.codicon-gear:before{content:"\\eaf8"}.codicon-gift:before{content:"\\eaf9"}.codicon-gist-secret:before{content:"\\eafa"}.codicon-gist:before{content:"\\eafb"}.codicon-git-commit:before{content:"\\eafc"}.codicon-git-compare:before{content:"\\eafd"}.codicon-compare-changes:before{content:"\\eafd"}.codicon-git-merge:before{content:"\\eafe"}.codicon-github-action:before{content:"\\eaff"}.codicon-github-alt:before{content:"\\eb00"}.codicon-globe:before{content:"\\eb01"}.codicon-grabber:before{content:"\\eb02"}.codicon-graph:before{content:"\\eb03"}.codicon-gripper:before{content:"\\eb04"}.codicon-heart:before{content:"\\eb05"}.codicon-home:before{content:"\\eb06"}.codicon-horizontal-rule:before{content:"\\eb07"}.codicon-hubot:before{content:"\\eb08"}.codicon-inbox:before{content:"\\eb09"}.codicon-issue-reopened:before{content:"\\eb0b"}.codicon-issues:before{content:"\\eb0c"}.codicon-italic:before{content:"\\eb0d"}.codicon-jersey:before{content:"\\eb0e"}.codicon-json:before{content:"\\eb0f"}.codicon-kebab-vertical:before{content:"\\eb10"}.codicon-key:before{content:"\\eb11"}.codicon-law:before{content:"\\eb12"}.codicon-lightbulb-autofix:before{content:"\\eb13"}.codicon-link-external:before{content:"\\eb14"}.codicon-link:before{content:"\\eb15"}.codicon-list-ordered:before{content:"\\eb16"}.codicon-list-unordered:before{content:"\\eb17"}.codicon-live-share:before{content:"\\eb18"}.codicon-loading:before{content:"\\eb19"}.codicon-location:before{content:"\\eb1a"}.codicon-mail-read:before{content:"\\eb1b"}.codicon-mail:before{content:"\\eb1c"}.codicon-markdown:before{content:"\\eb1d"}.codicon-megaphone:before{content:"\\eb1e"}.codicon-mention:before{content:"\\eb1f"}.codicon-milestone:before{content:"\\eb20"}.codicon-mortar-board:before{content:"\\eb21"}.codicon-move:before{content:"\\eb22"}.codicon-multiple-windows:before{content:"\\eb23"}.codicon-mute:before{content:"\\eb24"}.codicon-no-newline:before{content:"\\eb25"}.codicon-note:before{content:"\\eb26"}.codicon-octoface:before{content:"\\eb27"}.codicon-open-preview:before{content:"\\eb28"}.codicon-package:before{content:"\\eb29"}.codicon-paintcan:before{content:"\\eb2a"}.codicon-pin:before{content:"\\eb2b"}.codicon-play:before{content:"\\eb2c"}.codicon-run:before{content:"\\eb2c"}.codicon-plug:before{content:"\\eb2d"}.codicon-preserve-case:before{content:"\\eb2e"}.codicon-preview:before{content:"\\eb2f"}.codicon-project:before{content:"\\eb30"}.codicon-pulse:before{content:"\\eb31"}.codicon-question:before{content:"\\eb32"}.codicon-quote:before{content:"\\eb33"}.codicon-radio-tower:before{content:"\\eb34"}.codicon-reactions:before{content:"\\eb35"}.codicon-references:before{content:"\\eb36"}.codicon-refresh:before{content:"\\eb37"}.codicon-regex:before{content:"\\eb38"}.codicon-remote-explorer:before{content:"\\eb39"}.codicon-remote:before{content:"\\eb3a"}.codicon-remove:before{content:"\\eb3b"}.codicon-replace-all:before{content:"\\eb3c"}.codicon-replace:before{content:"\\eb3d"}.codicon-repo-clone:before{content:"\\eb3e"}.codicon-repo-force-push:before{content:"\\eb3f"}.codicon-repo-pull:before{content:"\\eb40"}.codicon-repo-push:before{content:"\\eb41"}.codicon-report:before{content:"\\eb42"}.codicon-request-changes:before{content:"\\eb43"}.codicon-rocket:before{content:"\\eb44"}.codicon-root-folder-opened:before{content:"\\eb45"}.codicon-root-folder:before{content:"\\eb46"}.codicon-rss:before{content:"\\eb47"}.codicon-ruby:before{content:"\\eb48"}.codicon-save-all:before{content:"\\eb49"}.codicon-save-as:before{content:"\\eb4a"}.codicon-save:before{content:"\\eb4b"}.codicon-screen-full:before{content:"\\eb4c"}.codicon-screen-normal:before{content:"\\eb4d"}.codicon-search-stop:before{content:"\\eb4e"}.codicon-server:before{content:"\\eb50"}.codicon-settings-gear:before{content:"\\eb51"}.codicon-settings:before{content:"\\eb52"}.codicon-shield:before{content:"\\eb53"}.codicon-smiley:before{content:"\\eb54"}.codicon-sort-precedence:before{content:"\\eb55"}.codicon-split-horizontal:before{content:"\\eb56"}.codicon-split-vertical:before{content:"\\eb57"}.codicon-squirrel:before{content:"\\eb58"}.codicon-star-full:before{content:"\\eb59"}.codicon-star-half:before{content:"\\eb5a"}.codicon-symbol-class:before{content:"\\eb5b"}.codicon-symbol-color:before{content:"\\eb5c"}.codicon-symbol-constant:before{content:"\\eb5d"}.codicon-symbol-enum-member:before{content:"\\eb5e"}.codicon-symbol-field:before{content:"\\eb5f"}.codicon-symbol-file:before{content:"\\eb60"}.codicon-symbol-interface:before{content:"\\eb61"}.codicon-symbol-keyword:before{content:"\\eb62"}.codicon-symbol-misc:before{content:"\\eb63"}.codicon-symbol-operator:before{content:"\\eb64"}.codicon-symbol-property:before{content:"\\eb65"}.codicon-wrench:before{content:"\\eb65"}.codicon-wrench-subaction:before{content:"\\eb65"}.codicon-symbol-snippet:before{content:"\\eb66"}.codicon-tasklist:before{content:"\\eb67"}.codicon-telescope:before{content:"\\eb68"}.codicon-text-size:before{content:"\\eb69"}.codicon-three-bars:before{content:"\\eb6a"}.codicon-thumbsdown:before{content:"\\eb6b"}.codicon-thumbsup:before{content:"\\eb6c"}.codicon-tools:before{content:"\\eb6d"}.codicon-triangle-down:before{content:"\\eb6e"}.codicon-triangle-left:before{content:"\\eb6f"}.codicon-triangle-right:before{content:"\\eb70"}.codicon-triangle-up:before{content:"\\eb71"}.codicon-twitter:before{content:"\\eb72"}.codicon-unfold:before{content:"\\eb73"}.codicon-unlock:before{content:"\\eb74"}.codicon-unmute:before{content:"\\eb75"}.codicon-unverified:before{content:"\\eb76"}.codicon-verified:before{content:"\\eb77"}.codicon-versions:before{content:"\\eb78"}.codicon-vm-active:before{content:"\\eb79"}.codicon-vm-outline:before{content:"\\eb7a"}.codicon-vm-running:before{content:"\\eb7b"}.codicon-watch:before{content:"\\eb7c"}.codicon-whitespace:before{content:"\\eb7d"}.codicon-whole-word:before{content:"\\eb7e"}.codicon-window:before{content:"\\eb7f"}.codicon-word-wrap:before{content:"\\eb80"}.codicon-zoom-in:before{content:"\\eb81"}.codicon-zoom-out:before{content:"\\eb82"}.codicon-list-filter:before{content:"\\eb83"}.codicon-list-flat:before{content:"\\eb84"}.codicon-list-selection:before{content:"\\eb85"}.codicon-selection:before{content:"\\eb85"}.codicon-list-tree:before{content:"\\eb86"}.codicon-debug-breakpoint-function-unverified:before{content:"\\eb87"}.codicon-debug-breakpoint-function:before{content:"\\eb88"}.codicon-debug-breakpoint-function-disabled:before{content:"\\eb88"}.codicon-debug-stackframe-active:before{content:"\\eb89"}.codicon-circle-small-filled:before{content:"\\eb8a"}.codicon-debug-stackframe-dot:before{content:"\\eb8a"}.codicon-debug-stackframe:before{content:"\\eb8b"}.codicon-debug-stackframe-focused:before{content:"\\eb8b"}.codicon-debug-breakpoint-unsupported:before{content:"\\eb8c"}.codicon-symbol-string:before{content:"\\eb8d"}.codicon-debug-reverse-continue:before{content:"\\eb8e"}.codicon-debug-step-back:before{content:"\\eb8f"}.codicon-debug-restart-frame:before{content:"\\eb90"}.codicon-debug-alt:before{content:"\\eb91"}.codicon-call-incoming:before{content:"\\eb92"}.codicon-call-outgoing:before{content:"\\eb93"}.codicon-menu:before{content:"\\eb94"}.codicon-expand-all:before{content:"\\eb95"}.codicon-feedback:before{content:"\\eb96"}.codicon-group-by-ref-type:before{content:"\\eb97"}.codicon-ungroup-by-ref-type:before{content:"\\eb98"}.codicon-account:before{content:"\\eb99"}.codicon-bell-dot:before{content:"\\eb9a"}.codicon-debug-console:before{content:"\\eb9b"}.codicon-library:before{content:"\\eb9c"}.codicon-output:before{content:"\\eb9d"}.codicon-run-all:before{content:"\\eb9e"}.codicon-sync-ignored:before{content:"\\eb9f"}.codicon-pinned:before{content:"\\eba0"}.codicon-github-inverted:before{content:"\\eba1"}.codicon-server-process:before{content:"\\eba2"}.codicon-server-environment:before{content:"\\eba3"}.codicon-pass:before{content:"\\eba4"}.codicon-issue-closed:before{content:"\\eba4"}.codicon-stop-circle:before{content:"\\eba5"}.codicon-play-circle:before{content:"\\eba6"}.codicon-record:before{content:"\\eba7"}.codicon-debug-alt-small:before{content:"\\eba8"}.codicon-vm-connect:before{content:"\\eba9"}.codicon-cloud:before{content:"\\ebaa"}.codicon-merge:before{content:"\\ebab"}.codicon-export:before{content:"\\ebac"}.codicon-graph-left:before{content:"\\ebad"}.codicon-magnet:before{content:"\\ebae"}.codicon-notebook:before{content:"\\ebaf"}.codicon-redo:before{content:"\\ebb0"}.codicon-check-all:before{content:"\\ebb1"}.codicon-pinned-dirty:before{content:"\\ebb2"}.codicon-pass-filled:before{content:"\\ebb3"}.codicon-circle-large-filled:before{content:"\\ebb4"}.codicon-circle-large-outline:before{content:"\\ebb5"}.codicon-combine:before{content:"\\ebb6"}.codicon-gather:before{content:"\\ebb6"}.codicon-table:before{content:"\\ebb7"}.codicon-variable-group:before{content:"\\ebb8"}.codicon-type-hierarchy:before{content:"\\ebb9"}.codicon-type-hierarchy-sub:before{content:"\\ebba"}.codicon-type-hierarchy-super:before{content:"\\ebbb"}.codicon-git-pull-request-create:before{content:"\\ebbc"}.codicon-run-above:before{content:"\\ebbd"}.codicon-run-below:before{content:"\\ebbe"}.codicon-notebook-template:before{content:"\\ebbf"}.codicon-debug-rerun:before{content:"\\ebc0"}.codicon-workspace-trusted:before{content:"\\ebc1"}.codicon-workspace-untrusted:before{content:"\\ebc2"}.codicon-workspace-unknown:before{content:"\\ebc3"}.codicon-terminal-cmd:before{content:"\\ebc4"}.codicon-terminal-debian:before{content:"\\ebc5"}.codicon-terminal-linux:before{content:"\\ebc6"}.codicon-terminal-powershell:before{content:"\\ebc7"}.codicon-terminal-tmux:before{content:"\\ebc8"}.codicon-terminal-ubuntu:before{content:"\\ebc9"}.codicon-terminal-bash:before{content:"\\ebca"}.codicon-arrow-swap:before{content:"\\ebcb"}.codicon-copy:before{content:"\\ebcc"}.codicon-person-add:before{content:"\\ebcd"}.codicon-filter-filled:before{content:"\\ebce"}.codicon-wand:before{content:"\\ebcf"}.codicon-debug-line-by-line:before{content:"\\ebd0"}.codicon-inspect:before{content:"\\ebd1"}.codicon-layers:before{content:"\\ebd2"}.codicon-layers-dot:before{content:"\\ebd3"}.codicon-layers-active:before{content:"\\ebd4"}.codicon-compass:before{content:"\\ebd5"}.codicon-compass-dot:before{content:"\\ebd6"}.codicon-compass-active:before{content:"\\ebd7"}.codicon-azure:before{content:"\\ebd8"}.codicon-issue-draft:before{content:"\\ebd9"}.codicon-git-pull-request-closed:before{content:"\\ebda"}.codicon-git-pull-request-draft:before{content:"\\ebdb"}.codicon-debug-all:before{content:"\\ebdc"}.codicon-debug-coverage:before{content:"\\ebdd"}.codicon-run-errors:before{content:"\\ebde"}.codicon-folder-library:before{content:"\\ebdf"}.codicon-debug-continue-small:before{content:"\\ebe0"}.codicon-beaker-stop:before{content:"\\ebe1"}.codicon-graph-line:before{content:"\\ebe2"}.codicon-graph-scatter:before{content:"\\ebe3"}.codicon-pie-chart:before{content:"\\ebe4"}.codicon-bracket:before{content:"\\eb0f"}.codicon-bracket-dot:before{content:"\\ebe5"}.codicon-bracket-error:before{content:"\\ebe6"}.codicon-lock-small:before{content:"\\ebe7"}.codicon-azure-devops:before{content:"\\ebe8"}.codicon-verified-filled:before{content:"\\ebe9"}.codicon-newline:before{content:"\\ebea"}.codicon-layout:before{content:"\\ebeb"}.codicon-layout-activitybar-left:before{content:"\\ebec"}.codicon-layout-activitybar-right:before{content:"\\ebed"}.codicon-layout-panel-left:before{content:"\\ebee"}.codicon-layout-panel-center:before{content:"\\ebef"}.codicon-layout-panel-justify:before{content:"\\ebf0"}.codicon-layout-panel-right:before{content:"\\ebf1"}.codicon-layout-panel:before{content:"\\ebf2"}.codicon-layout-sidebar-left:before{content:"\\ebf3"}.codicon-layout-sidebar-right:before{content:"\\ebf4"}.codicon-layout-statusbar:before{content:"\\ebf5"}.codicon-layout-menubar:before{content:"\\ebf6"}.codicon-layout-centered:before{content:"\\ebf7"}.codicon-target:before{content:"\\ebf8"}.codicon-indent:before{content:"\\ebf9"}.codicon-record-small:before{content:"\\ebfa"}.codicon-error-small:before{content:"\\ebfb"}.codicon-arrow-circle-down:before{content:"\\ebfc"}.codicon-arrow-circle-left:before{content:"\\ebfd"}.codicon-arrow-circle-right:before{content:"\\ebfe"}.codicon-arrow-circle-up:before{content:"\\ebff"}.codicon-layout-sidebar-right-off:before{content:"\\ec00"}.codicon-layout-panel-off:before{content:"\\ec01"}.codicon-layout-sidebar-left-off:before{content:"\\ec02"}.codicon-blank:before{content:"\\ec03"}.codicon-heart-filled:before{content:"\\ec04"}.codicon-map:before{content:"\\ec05"}.codicon-map-filled:before{content:"\\ec06"}.codicon-circle-small:before{content:"\\ec07"}.codicon-bell-slash:before{content:"\\ec08"}.codicon-bell-slash-dot:before{content:"\\ec09"}.codicon-comment-unresolved:before{content:"\\ec0a"}.codicon-git-pull-request-go-to-changes:before{content:"\\ec0b"}.codicon-git-pull-request-new-changes:before{content:"\\ec0c"}:host{color:inherit;display:contents;line-height:inherit}:host,:host>i,:host>i::before{font-size:inherit !important}',r=class{constructor(o){e(this,o),this._ariaLabel=void 0,this._icon=void 0,this._part=void 0,this.state={_ariaLabel:"…",_icon:"codicon codicon-home"}}render(){return o(c,{exportparts:"icon"},o("i",{"aria-hidden":this.state._ariaLabel.length>0?void 0:"true","aria-label":this.state._ariaLabel.length>0?this.state._ariaLabel:void 0,class:this.state._icon,part:"icon",role:"img"}))}validateAriaLabel(e){n(this,"_ariaLabel",e,{required:!0})}validateIcon(e){n(this,"_icon",e,{required:!0})}validatePart(e){t("ICON: The usage of the part attribute is deprecated and has no effect.")}componentWillLoad(){this.validateAriaLabel(this._ariaLabel),this.validateIcon(this._icon),this.validatePart(this._part)}static get watchers(){return{_ariaLabel:["validateAriaLabel"],_icon:["validateIcon"],_part:["validatePart"]}}};r.style={default:b};export{r as kol_icon};
+import{r as e,h as o,H as c}from"./index-50adf9a0.js";import{w as n}from"./prop.validators-daa14517.js";import{d as t}from"./a11y.tipps-e0a65f3c.js";import"./dev.utils-bedce29d.js";import"./reuse-56bb5a4b.js";import"./index-81bd9b41.js";const b='@font-face{font-family:"codicon";font-display:block;src:url("./codicon.ttf?0e5b0adf625a37fbcd638d31f0fe72aa") format("truetype")}.codicon[class*=\'codicon-\']{font:normal normal normal 16px/1 codicon;display:inline-block;text-decoration:none;text-rendering:auto;text-align:center;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;user-select:none;-webkit-user-select:none;-ms-user-select:none}@keyframes codicon-spin{100%{transform:rotate(360deg)}}.codicon-sync.codicon-modifier-spin,.codicon-loading.codicon-modifier-spin,.codicon-gear.codicon-modifier-spin{animation:codicon-spin 1.5s steps(30) infinite}.codicon-modifier-disabled{opacity:0.5}.codicon-modifier-hidden{opacity:0}.codicon-loading{animation-duration:1s !important;animation-timing-function:cubic-bezier(0.53, 0.21, 0.29, 0.67) !important}.codicon-add:before{content:"\\ea60"}.codicon-plus:before{content:"\\ea60"}.codicon-gist-new:before{content:"\\ea60"}.codicon-repo-create:before{content:"\\ea60"}.codicon-lightbulb:before{content:"\\ea61"}.codicon-light-bulb:before{content:"\\ea61"}.codicon-repo:before{content:"\\ea62"}.codicon-repo-delete:before{content:"\\ea62"}.codicon-gist-fork:before{content:"\\ea63"}.codicon-repo-forked:before{content:"\\ea63"}.codicon-git-pull-request:before{content:"\\ea64"}.codicon-git-pull-request-abandoned:before{content:"\\ea64"}.codicon-record-keys:before{content:"\\ea65"}.codicon-keyboard:before{content:"\\ea65"}.codicon-tag:before{content:"\\ea66"}.codicon-tag-add:before{content:"\\ea66"}.codicon-tag-remove:before{content:"\\ea66"}.codicon-person:before{content:"\\ea67"}.codicon-person-follow:before{content:"\\ea67"}.codicon-person-outline:before{content:"\\ea67"}.codicon-person-filled:before{content:"\\ea67"}.codicon-git-branch:before{content:"\\ea68"}.codicon-git-branch-create:before{content:"\\ea68"}.codicon-git-branch-delete:before{content:"\\ea68"}.codicon-source-control:before{content:"\\ea68"}.codicon-mirror:before{content:"\\ea69"}.codicon-mirror-public:before{content:"\\ea69"}.codicon-star:before{content:"\\ea6a"}.codicon-star-add:before{content:"\\ea6a"}.codicon-star-delete:before{content:"\\ea6a"}.codicon-star-empty:before{content:"\\ea6a"}.codicon-comment:before{content:"\\ea6b"}.codicon-comment-add:before{content:"\\ea6b"}.codicon-alert:before{content:"\\ea6c"}.codicon-warning:before{content:"\\ea6c"}.codicon-search:before{content:"\\ea6d"}.codicon-search-save:before{content:"\\ea6d"}.codicon-log-out:before{content:"\\ea6e"}.codicon-sign-out:before{content:"\\ea6e"}.codicon-log-in:before{content:"\\ea6f"}.codicon-sign-in:before{content:"\\ea6f"}.codicon-eye:before{content:"\\ea70"}.codicon-eye-unwatch:before{content:"\\ea70"}.codicon-eye-watch:before{content:"\\ea70"}.codicon-circle-filled:before{content:"\\ea71"}.codicon-primitive-dot:before{content:"\\ea71"}.codicon-close-dirty:before{content:"\\ea71"}.codicon-debug-breakpoint:before{content:"\\ea71"}.codicon-debug-breakpoint-disabled:before{content:"\\ea71"}.codicon-debug-hint:before{content:"\\ea71"}.codicon-primitive-square:before{content:"\\ea72"}.codicon-edit:before{content:"\\ea73"}.codicon-pencil:before{content:"\\ea73"}.codicon-info:before{content:"\\ea74"}.codicon-issue-opened:before{content:"\\ea74"}.codicon-gist-private:before{content:"\\ea75"}.codicon-git-fork-private:before{content:"\\ea75"}.codicon-lock:before{content:"\\ea75"}.codicon-mirror-private:before{content:"\\ea75"}.codicon-close:before{content:"\\ea76"}.codicon-remove-close:before{content:"\\ea76"}.codicon-x:before{content:"\\ea76"}.codicon-repo-sync:before{content:"\\ea77"}.codicon-sync:before{content:"\\ea77"}.codicon-clone:before{content:"\\ea78"}.codicon-desktop-download:before{content:"\\ea78"}.codicon-beaker:before{content:"\\ea79"}.codicon-microscope:before{content:"\\ea79"}.codicon-vm:before{content:"\\ea7a"}.codicon-device-desktop:before{content:"\\ea7a"}.codicon-file:before{content:"\\ea7b"}.codicon-file-text:before{content:"\\ea7b"}.codicon-more:before{content:"\\ea7c"}.codicon-ellipsis:before{content:"\\ea7c"}.codicon-kebab-horizontal:before{content:"\\ea7c"}.codicon-mail-reply:before{content:"\\ea7d"}.codicon-reply:before{content:"\\ea7d"}.codicon-organization:before{content:"\\ea7e"}.codicon-organization-filled:before{content:"\\ea7e"}.codicon-organization-outline:before{content:"\\ea7e"}.codicon-new-file:before{content:"\\ea7f"}.codicon-file-add:before{content:"\\ea7f"}.codicon-new-folder:before{content:"\\ea80"}.codicon-file-directory-create:before{content:"\\ea80"}.codicon-trash:before{content:"\\ea81"}.codicon-trashcan:before{content:"\\ea81"}.codicon-history:before{content:"\\ea82"}.codicon-clock:before{content:"\\ea82"}.codicon-folder:before{content:"\\ea83"}.codicon-file-directory:before{content:"\\ea83"}.codicon-symbol-folder:before{content:"\\ea83"}.codicon-logo-github:before{content:"\\ea84"}.codicon-mark-github:before{content:"\\ea84"}.codicon-github:before{content:"\\ea84"}.codicon-terminal:before{content:"\\ea85"}.codicon-console:before{content:"\\ea85"}.codicon-repl:before{content:"\\ea85"}.codicon-zap:before{content:"\\ea86"}.codicon-symbol-event:before{content:"\\ea86"}.codicon-error:before{content:"\\ea87"}.codicon-stop:before{content:"\\ea87"}.codicon-variable:before{content:"\\ea88"}.codicon-symbol-variable:before{content:"\\ea88"}.codicon-array:before{content:"\\ea8a"}.codicon-symbol-array:before{content:"\\ea8a"}.codicon-symbol-module:before{content:"\\ea8b"}.codicon-symbol-package:before{content:"\\ea8b"}.codicon-symbol-namespace:before{content:"\\ea8b"}.codicon-symbol-object:before{content:"\\ea8b"}.codicon-symbol-method:before{content:"\\ea8c"}.codicon-symbol-function:before{content:"\\ea8c"}.codicon-symbol-constructor:before{content:"\\ea8c"}.codicon-symbol-boolean:before{content:"\\ea8f"}.codicon-symbol-null:before{content:"\\ea8f"}.codicon-symbol-numeric:before{content:"\\ea90"}.codicon-symbol-number:before{content:"\\ea90"}.codicon-symbol-structure:before{content:"\\ea91"}.codicon-symbol-struct:before{content:"\\ea91"}.codicon-symbol-parameter:before{content:"\\ea92"}.codicon-symbol-type-parameter:before{content:"\\ea92"}.codicon-symbol-key:before{content:"\\ea93"}.codicon-symbol-text:before{content:"\\ea93"}.codicon-symbol-reference:before{content:"\\ea94"}.codicon-go-to-file:before{content:"\\ea94"}.codicon-symbol-enum:before{content:"\\ea95"}.codicon-symbol-value:before{content:"\\ea95"}.codicon-symbol-ruler:before{content:"\\ea96"}.codicon-symbol-unit:before{content:"\\ea96"}.codicon-activate-breakpoints:before{content:"\\ea97"}.codicon-archive:before{content:"\\ea98"}.codicon-arrow-both:before{content:"\\ea99"}.codicon-arrow-down:before{content:"\\ea9a"}.codicon-arrow-left:before{content:"\\ea9b"}.codicon-arrow-right:before{content:"\\ea9c"}.codicon-arrow-small-down:before{content:"\\ea9d"}.codicon-arrow-small-left:before{content:"\\ea9e"}.codicon-arrow-small-right:before{content:"\\ea9f"}.codicon-arrow-small-up:before{content:"\\eaa0"}.codicon-arrow-up:before{content:"\\eaa1"}.codicon-bell:before{content:"\\eaa2"}.codicon-bold:before{content:"\\eaa3"}.codicon-book:before{content:"\\eaa4"}.codicon-bookmark:before{content:"\\eaa5"}.codicon-debug-breakpoint-conditional-unverified:before{content:"\\eaa6"}.codicon-debug-breakpoint-conditional:before{content:"\\eaa7"}.codicon-debug-breakpoint-conditional-disabled:before{content:"\\eaa7"}.codicon-debug-breakpoint-data-unverified:before{content:"\\eaa8"}.codicon-debug-breakpoint-data:before{content:"\\eaa9"}.codicon-debug-breakpoint-data-disabled:before{content:"\\eaa9"}.codicon-debug-breakpoint-log-unverified:before{content:"\\eaaa"}.codicon-debug-breakpoint-log:before{content:"\\eaab"}.codicon-debug-breakpoint-log-disabled:before{content:"\\eaab"}.codicon-briefcase:before{content:"\\eaac"}.codicon-broadcast:before{content:"\\eaad"}.codicon-browser:before{content:"\\eaae"}.codicon-bug:before{content:"\\eaaf"}.codicon-calendar:before{content:"\\eab0"}.codicon-case-sensitive:before{content:"\\eab1"}.codicon-check:before{content:"\\eab2"}.codicon-checklist:before{content:"\\eab3"}.codicon-chevron-down:before{content:"\\eab4"}.codicon-chevron-left:before{content:"\\eab5"}.codicon-chevron-right:before{content:"\\eab6"}.codicon-chevron-up:before{content:"\\eab7"}.codicon-chrome-close:before{content:"\\eab8"}.codicon-chrome-maximize:before{content:"\\eab9"}.codicon-chrome-minimize:before{content:"\\eaba"}.codicon-chrome-restore:before{content:"\\eabb"}.codicon-circle-outline:before{content:"\\eabc"}.codicon-debug-breakpoint-unverified:before{content:"\\eabc"}.codicon-circle-slash:before{content:"\\eabd"}.codicon-circuit-board:before{content:"\\eabe"}.codicon-clear-all:before{content:"\\eabf"}.codicon-clippy:before{content:"\\eac0"}.codicon-close-all:before{content:"\\eac1"}.codicon-cloud-download:before{content:"\\eac2"}.codicon-cloud-upload:before{content:"\\eac3"}.codicon-code:before{content:"\\eac4"}.codicon-collapse-all:before{content:"\\eac5"}.codicon-color-mode:before{content:"\\eac6"}.codicon-comment-discussion:before{content:"\\eac7"}.codicon-credit-card:before{content:"\\eac9"}.codicon-dash:before{content:"\\eacc"}.codicon-dashboard:before{content:"\\eacd"}.codicon-database:before{content:"\\eace"}.codicon-debug-continue:before{content:"\\eacf"}.codicon-debug-disconnect:before{content:"\\ead0"}.codicon-debug-pause:before{content:"\\ead1"}.codicon-debug-restart:before{content:"\\ead2"}.codicon-debug-start:before{content:"\\ead3"}.codicon-debug-step-into:before{content:"\\ead4"}.codicon-debug-step-out:before{content:"\\ead5"}.codicon-debug-step-over:before{content:"\\ead6"}.codicon-debug-stop:before{content:"\\ead7"}.codicon-debug:before{content:"\\ead8"}.codicon-device-camera-video:before{content:"\\ead9"}.codicon-device-camera:before{content:"\\eada"}.codicon-device-mobile:before{content:"\\eadb"}.codicon-diff-added:before{content:"\\eadc"}.codicon-diff-ignored:before{content:"\\eadd"}.codicon-diff-modified:before{content:"\\eade"}.codicon-diff-removed:before{content:"\\eadf"}.codicon-diff-renamed:before{content:"\\eae0"}.codicon-diff:before{content:"\\eae1"}.codicon-discard:before{content:"\\eae2"}.codicon-editor-layout:before{content:"\\eae3"}.codicon-empty-window:before{content:"\\eae4"}.codicon-exclude:before{content:"\\eae5"}.codicon-extensions:before{content:"\\eae6"}.codicon-eye-closed:before{content:"\\eae7"}.codicon-file-binary:before{content:"\\eae8"}.codicon-file-code:before{content:"\\eae9"}.codicon-file-media:before{content:"\\eaea"}.codicon-file-pdf:before{content:"\\eaeb"}.codicon-file-submodule:before{content:"\\eaec"}.codicon-file-symlink-directory:before{content:"\\eaed"}.codicon-file-symlink-file:before{content:"\\eaee"}.codicon-file-zip:before{content:"\\eaef"}.codicon-files:before{content:"\\eaf0"}.codicon-filter:before{content:"\\eaf1"}.codicon-flame:before{content:"\\eaf2"}.codicon-fold-down:before{content:"\\eaf3"}.codicon-fold-up:before{content:"\\eaf4"}.codicon-fold:before{content:"\\eaf5"}.codicon-folder-active:before{content:"\\eaf6"}.codicon-folder-opened:before{content:"\\eaf7"}.codicon-gear:before{content:"\\eaf8"}.codicon-gift:before{content:"\\eaf9"}.codicon-gist-secret:before{content:"\\eafa"}.codicon-gist:before{content:"\\eafb"}.codicon-git-commit:before{content:"\\eafc"}.codicon-git-compare:before{content:"\\eafd"}.codicon-compare-changes:before{content:"\\eafd"}.codicon-git-merge:before{content:"\\eafe"}.codicon-github-action:before{content:"\\eaff"}.codicon-github-alt:before{content:"\\eb00"}.codicon-globe:before{content:"\\eb01"}.codicon-grabber:before{content:"\\eb02"}.codicon-graph:before{content:"\\eb03"}.codicon-gripper:before{content:"\\eb04"}.codicon-heart:before{content:"\\eb05"}.codicon-home:before{content:"\\eb06"}.codicon-horizontal-rule:before{content:"\\eb07"}.codicon-hubot:before{content:"\\eb08"}.codicon-inbox:before{content:"\\eb09"}.codicon-issue-reopened:before{content:"\\eb0b"}.codicon-issues:before{content:"\\eb0c"}.codicon-italic:before{content:"\\eb0d"}.codicon-jersey:before{content:"\\eb0e"}.codicon-json:before{content:"\\eb0f"}.codicon-kebab-vertical:before{content:"\\eb10"}.codicon-key:before{content:"\\eb11"}.codicon-law:before{content:"\\eb12"}.codicon-lightbulb-autofix:before{content:"\\eb13"}.codicon-link-external:before{content:"\\eb14"}.codicon-link:before{content:"\\eb15"}.codicon-list-ordered:before{content:"\\eb16"}.codicon-list-unordered:before{content:"\\eb17"}.codicon-live-share:before{content:"\\eb18"}.codicon-loading:before{content:"\\eb19"}.codicon-location:before{content:"\\eb1a"}.codicon-mail-read:before{content:"\\eb1b"}.codicon-mail:before{content:"\\eb1c"}.codicon-markdown:before{content:"\\eb1d"}.codicon-megaphone:before{content:"\\eb1e"}.codicon-mention:before{content:"\\eb1f"}.codicon-milestone:before{content:"\\eb20"}.codicon-mortar-board:before{content:"\\eb21"}.codicon-move:before{content:"\\eb22"}.codicon-multiple-windows:before{content:"\\eb23"}.codicon-mute:before{content:"\\eb24"}.codicon-no-newline:before{content:"\\eb25"}.codicon-note:before{content:"\\eb26"}.codicon-octoface:before{content:"\\eb27"}.codicon-open-preview:before{content:"\\eb28"}.codicon-package:before{content:"\\eb29"}.codicon-paintcan:before{content:"\\eb2a"}.codicon-pin:before{content:"\\eb2b"}.codicon-play:before{content:"\\eb2c"}.codicon-run:before{content:"\\eb2c"}.codicon-plug:before{content:"\\eb2d"}.codicon-preserve-case:before{content:"\\eb2e"}.codicon-preview:before{content:"\\eb2f"}.codicon-project:before{content:"\\eb30"}.codicon-pulse:before{content:"\\eb31"}.codicon-question:before{content:"\\eb32"}.codicon-quote:before{content:"\\eb33"}.codicon-radio-tower:before{content:"\\eb34"}.codicon-reactions:before{content:"\\eb35"}.codicon-references:before{content:"\\eb36"}.codicon-refresh:before{content:"\\eb37"}.codicon-regex:before{content:"\\eb38"}.codicon-remote-explorer:before{content:"\\eb39"}.codicon-remote:before{content:"\\eb3a"}.codicon-remove:before{content:"\\eb3b"}.codicon-replace-all:before{content:"\\eb3c"}.codicon-replace:before{content:"\\eb3d"}.codicon-repo-clone:before{content:"\\eb3e"}.codicon-repo-force-push:before{content:"\\eb3f"}.codicon-repo-pull:before{content:"\\eb40"}.codicon-repo-push:before{content:"\\eb41"}.codicon-report:before{content:"\\eb42"}.codicon-request-changes:before{content:"\\eb43"}.codicon-rocket:before{content:"\\eb44"}.codicon-root-folder-opened:before{content:"\\eb45"}.codicon-root-folder:before{content:"\\eb46"}.codicon-rss:before{content:"\\eb47"}.codicon-ruby:before{content:"\\eb48"}.codicon-save-all:before{content:"\\eb49"}.codicon-save-as:before{content:"\\eb4a"}.codicon-save:before{content:"\\eb4b"}.codicon-screen-full:before{content:"\\eb4c"}.codicon-screen-normal:before{content:"\\eb4d"}.codicon-search-stop:before{content:"\\eb4e"}.codicon-server:before{content:"\\eb50"}.codicon-settings-gear:before{content:"\\eb51"}.codicon-settings:before{content:"\\eb52"}.codicon-shield:before{content:"\\eb53"}.codicon-smiley:before{content:"\\eb54"}.codicon-sort-precedence:before{content:"\\eb55"}.codicon-split-horizontal:before{content:"\\eb56"}.codicon-split-vertical:before{content:"\\eb57"}.codicon-squirrel:before{content:"\\eb58"}.codicon-star-full:before{content:"\\eb59"}.codicon-star-half:before{content:"\\eb5a"}.codicon-symbol-class:before{content:"\\eb5b"}.codicon-symbol-color:before{content:"\\eb5c"}.codicon-symbol-constant:before{content:"\\eb5d"}.codicon-symbol-enum-member:before{content:"\\eb5e"}.codicon-symbol-field:before{content:"\\eb5f"}.codicon-symbol-file:before{content:"\\eb60"}.codicon-symbol-interface:before{content:"\\eb61"}.codicon-symbol-keyword:before{content:"\\eb62"}.codicon-symbol-misc:before{content:"\\eb63"}.codicon-symbol-operator:before{content:"\\eb64"}.codicon-symbol-property:before{content:"\\eb65"}.codicon-wrench:before{content:"\\eb65"}.codicon-wrench-subaction:before{content:"\\eb65"}.codicon-symbol-snippet:before{content:"\\eb66"}.codicon-tasklist:before{content:"\\eb67"}.codicon-telescope:before{content:"\\eb68"}.codicon-text-size:before{content:"\\eb69"}.codicon-three-bars:before{content:"\\eb6a"}.codicon-thumbsdown:before{content:"\\eb6b"}.codicon-thumbsup:before{content:"\\eb6c"}.codicon-tools:before{content:"\\eb6d"}.codicon-triangle-down:before{content:"\\eb6e"}.codicon-triangle-left:before{content:"\\eb6f"}.codicon-triangle-right:before{content:"\\eb70"}.codicon-triangle-up:before{content:"\\eb71"}.codicon-twitter:before{content:"\\eb72"}.codicon-unfold:before{content:"\\eb73"}.codicon-unlock:before{content:"\\eb74"}.codicon-unmute:before{content:"\\eb75"}.codicon-unverified:before{content:"\\eb76"}.codicon-verified:before{content:"\\eb77"}.codicon-versions:before{content:"\\eb78"}.codicon-vm-active:before{content:"\\eb79"}.codicon-vm-outline:before{content:"\\eb7a"}.codicon-vm-running:before{content:"\\eb7b"}.codicon-watch:before{content:"\\eb7c"}.codicon-whitespace:before{content:"\\eb7d"}.codicon-whole-word:before{content:"\\eb7e"}.codicon-window:before{content:"\\eb7f"}.codicon-word-wrap:before{content:"\\eb80"}.codicon-zoom-in:before{content:"\\eb81"}.codicon-zoom-out:before{content:"\\eb82"}.codicon-list-filter:before{content:"\\eb83"}.codicon-list-flat:before{content:"\\eb84"}.codicon-list-selection:before{content:"\\eb85"}.codicon-selection:before{content:"\\eb85"}.codicon-list-tree:before{content:"\\eb86"}.codicon-debug-breakpoint-function-unverified:before{content:"\\eb87"}.codicon-debug-breakpoint-function:before{content:"\\eb88"}.codicon-debug-breakpoint-function-disabled:before{content:"\\eb88"}.codicon-debug-stackframe-active:before{content:"\\eb89"}.codicon-circle-small-filled:before{content:"\\eb8a"}.codicon-debug-stackframe-dot:before{content:"\\eb8a"}.codicon-debug-stackframe:before{content:"\\eb8b"}.codicon-debug-stackframe-focused:before{content:"\\eb8b"}.codicon-debug-breakpoint-unsupported:before{content:"\\eb8c"}.codicon-symbol-string:before{content:"\\eb8d"}.codicon-debug-reverse-continue:before{content:"\\eb8e"}.codicon-debug-step-back:before{content:"\\eb8f"}.codicon-debug-restart-frame:before{content:"\\eb90"}.codicon-debug-alt:before{content:"\\eb91"}.codicon-call-incoming:before{content:"\\eb92"}.codicon-call-outgoing:before{content:"\\eb93"}.codicon-menu:before{content:"\\eb94"}.codicon-expand-all:before{content:"\\eb95"}.codicon-feedback:before{content:"\\eb96"}.codicon-group-by-ref-type:before{content:"\\eb97"}.codicon-ungroup-by-ref-type:before{content:"\\eb98"}.codicon-account:before{content:"\\eb99"}.codicon-bell-dot:before{content:"\\eb9a"}.codicon-debug-console:before{content:"\\eb9b"}.codicon-library:before{content:"\\eb9c"}.codicon-output:before{content:"\\eb9d"}.codicon-run-all:before{content:"\\eb9e"}.codicon-sync-ignored:before{content:"\\eb9f"}.codicon-pinned:before{content:"\\eba0"}.codicon-github-inverted:before{content:"\\eba1"}.codicon-server-process:before{content:"\\eba2"}.codicon-server-environment:before{content:"\\eba3"}.codicon-pass:before{content:"\\eba4"}.codicon-issue-closed:before{content:"\\eba4"}.codicon-stop-circle:before{content:"\\eba5"}.codicon-play-circle:before{content:"\\eba6"}.codicon-record:before{content:"\\eba7"}.codicon-debug-alt-small:before{content:"\\eba8"}.codicon-vm-connect:before{content:"\\eba9"}.codicon-cloud:before{content:"\\ebaa"}.codicon-merge:before{content:"\\ebab"}.codicon-export:before{content:"\\ebac"}.codicon-graph-left:before{content:"\\ebad"}.codicon-magnet:before{content:"\\ebae"}.codicon-notebook:before{content:"\\ebaf"}.codicon-redo:before{content:"\\ebb0"}.codicon-check-all:before{content:"\\ebb1"}.codicon-pinned-dirty:before{content:"\\ebb2"}.codicon-pass-filled:before{content:"\\ebb3"}.codicon-circle-large-filled:before{content:"\\ebb4"}.codicon-circle-large-outline:before{content:"\\ebb5"}.codicon-combine:before{content:"\\ebb6"}.codicon-gather:before{content:"\\ebb6"}.codicon-table:before{content:"\\ebb7"}.codicon-variable-group:before{content:"\\ebb8"}.codicon-type-hierarchy:before{content:"\\ebb9"}.codicon-type-hierarchy-sub:before{content:"\\ebba"}.codicon-type-hierarchy-super:before{content:"\\ebbb"}.codicon-git-pull-request-create:before{content:"\\ebbc"}.codicon-run-above:before{content:"\\ebbd"}.codicon-run-below:before{content:"\\ebbe"}.codicon-notebook-template:before{content:"\\ebbf"}.codicon-debug-rerun:before{content:"\\ebc0"}.codicon-workspace-trusted:before{content:"\\ebc1"}.codicon-workspace-untrusted:before{content:"\\ebc2"}.codicon-workspace-unknown:before{content:"\\ebc3"}.codicon-terminal-cmd:before{content:"\\ebc4"}.codicon-terminal-debian:before{content:"\\ebc5"}.codicon-terminal-linux:before{content:"\\ebc6"}.codicon-terminal-powershell:before{content:"\\ebc7"}.codicon-terminal-tmux:before{content:"\\ebc8"}.codicon-terminal-ubuntu:before{content:"\\ebc9"}.codicon-terminal-bash:before{content:"\\ebca"}.codicon-arrow-swap:before{content:"\\ebcb"}.codicon-copy:before{content:"\\ebcc"}.codicon-person-add:before{content:"\\ebcd"}.codicon-filter-filled:before{content:"\\ebce"}.codicon-wand:before{content:"\\ebcf"}.codicon-debug-line-by-line:before{content:"\\ebd0"}.codicon-inspect:before{content:"\\ebd1"}.codicon-layers:before{content:"\\ebd2"}.codicon-layers-dot:before{content:"\\ebd3"}.codicon-layers-active:before{content:"\\ebd4"}.codicon-compass:before{content:"\\ebd5"}.codicon-compass-dot:before{content:"\\ebd6"}.codicon-compass-active:before{content:"\\ebd7"}.codicon-azure:before{content:"\\ebd8"}.codicon-issue-draft:before{content:"\\ebd9"}.codicon-git-pull-request-closed:before{content:"\\ebda"}.codicon-git-pull-request-draft:before{content:"\\ebdb"}.codicon-debug-all:before{content:"\\ebdc"}.codicon-debug-coverage:before{content:"\\ebdd"}.codicon-run-errors:before{content:"\\ebde"}.codicon-folder-library:before{content:"\\ebdf"}.codicon-debug-continue-small:before{content:"\\ebe0"}.codicon-beaker-stop:before{content:"\\ebe1"}.codicon-graph-line:before{content:"\\ebe2"}.codicon-graph-scatter:before{content:"\\ebe3"}.codicon-pie-chart:before{content:"\\ebe4"}.codicon-bracket:before{content:"\\eb0f"}.codicon-bracket-dot:before{content:"\\ebe5"}.codicon-bracket-error:before{content:"\\ebe6"}.codicon-lock-small:before{content:"\\ebe7"}.codicon-azure-devops:before{content:"\\ebe8"}.codicon-verified-filled:before{content:"\\ebe9"}.codicon-newline:before{content:"\\ebea"}.codicon-layout:before{content:"\\ebeb"}.codicon-layout-activitybar-left:before{content:"\\ebec"}.codicon-layout-activitybar-right:before{content:"\\ebed"}.codicon-layout-panel-left:before{content:"\\ebee"}.codicon-layout-panel-center:before{content:"\\ebef"}.codicon-layout-panel-justify:before{content:"\\ebf0"}.codicon-layout-panel-right:before{content:"\\ebf1"}.codicon-layout-panel:before{content:"\\ebf2"}.codicon-layout-sidebar-left:before{content:"\\ebf3"}.codicon-layout-sidebar-right:before{content:"\\ebf4"}.codicon-layout-statusbar:before{content:"\\ebf5"}.codicon-layout-menubar:before{content:"\\ebf6"}.codicon-layout-centered:before{content:"\\ebf7"}.codicon-target:before{content:"\\ebf8"}.codicon-indent:before{content:"\\ebf9"}.codicon-record-small:before{content:"\\ebfa"}.codicon-error-small:before{content:"\\ebfb"}.codicon-arrow-circle-down:before{content:"\\ebfc"}.codicon-arrow-circle-left:before{content:"\\ebfd"}.codicon-arrow-circle-right:before{content:"\\ebfe"}.codicon-arrow-circle-up:before{content:"\\ebff"}.codicon-layout-sidebar-right-off:before{content:"\\ec00"}.codicon-layout-panel-off:before{content:"\\ec01"}.codicon-layout-sidebar-left-off:before{content:"\\ec02"}.codicon-blank:before{content:"\\ec03"}.codicon-heart-filled:before{content:"\\ec04"}.codicon-map:before{content:"\\ec05"}.codicon-map-filled:before{content:"\\ec06"}.codicon-circle-small:before{content:"\\ec07"}.codicon-bell-slash:before{content:"\\ec08"}.codicon-bell-slash-dot:before{content:"\\ec09"}.codicon-comment-unresolved:before{content:"\\ec0a"}.codicon-git-pull-request-go-to-changes:before{content:"\\ec0b"}.codicon-git-pull-request-new-changes:before{content:"\\ec0c"}:host{color:inherit;display:contents;line-height:inherit}:host>i,:host>i::before{font-size:inherit !important}',r=class{constructor(o){e(this,o),this._ariaLabel=void 0,this._icon=void 0,this._part=void 0,this.state={_ariaLabel:"…",_icon:"codicon codicon-home"}}render(){return o(c,{exportparts:"icon"},o("i",{"aria-hidden":this.state._ariaLabel.length>0?void 0:"true","aria-label":this.state._ariaLabel.length>0?this.state._ariaLabel:void 0,class:this.state._icon,part:"icon",role:"img"}))}validateAriaLabel(e){n(this,"_ariaLabel",e,{required:!0})}validateIcon(e){n(this,"_icon",e,{required:!0})}validatePart(e){t("ICON: The usage of the part attribute is deprecated and has no effect.")}componentWillLoad(){this.validateAriaLabel(this._ariaLabel),this.validateIcon(this._icon),this.validatePart(this._part)}static get watchers(){return{_ariaLabel:["validateAriaLabel"],_icon:["validateIcon"],_part:["validatePart"]}}};r.style={default:b};export{r as kol_icon};

package/dist/kolibri/kol-icon.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["defaultStyleCss","KolIcon","_ariaLabel","_icon","render","h","Host","exportparts","this","state","length","undefined","class","part","role","validateAriaLabel","value","watchString","required","validateIcon","validatePart","_value","devHint","componentWillLoad","_part"],"sources":["./src/components/icon/style.css?tag=kol-icon&mode=default&encapsulation=shadow","./src/components/icon/component.tsx"],"sourcesContent":["@import '../../assets/codicons/codicon.css';\n\n:host {\n\tcolor: inherit;\n\tdisplay: contents;\n\tline-height: inherit;\n}\n\n/*\n The <code>:important</code> is important, because we should always override the font icon style.\n /\n:host~~,\n:host~~ > i,\n:host > i::before {\n\tfont-size: inherit !important;\n}\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { AriaLabel } from '../../types/aria-label';\nimport { watchString } from '../../utils/prop.validators';\nimport { devHint } from '../../utils/a11y.tipps';\n\n/\n API\n /\ntype RequiredProps = AriaLabel & {\n\ticon: string;\n};\ntype OptionalProps = {\n\tpart: string;\n};\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = RequiredProps;\ntype OptionalStates = OptionalProps;\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n@Component({\n\ttag: 'kol-icon',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolIcon implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host exportparts=\"icon\">\n\t\t\t\t<i\n\t\t\t\t\taria-hidden={this.state._ariaLabel.length > 0 ? undefined : 'true'}\n\t\t\t\t\t/\n\t\t\t\t\t Die Auszeichnung `aria-hidden` ist eigentlich nicht erforderlich, da die aktuellen\n\t\t\t\t\t * Screenreader, wie NVDA und JAWS, es auch ohne `aria-hidden` nicht vorlesen.\n\t\t\t\t\t \n\t\t\t\t\t Referenz: https://www.w3.org/TR/wai-aria/states_and_properties#aria-hidden\n\t\t\t\t\t /\n\t\t\t\t\taria-label={this.state._ariaLabel.length > 0 ? this.state._ariaLabel : undefined}\n\t\t\t\t\tclass={this.state._icon}\n\t\t\t\t\tpart=\"icon\"\n\t\t\t\t\trole=\"img\"\n\t\t\t\t></i>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/\n\t Gibt das Aria-Label am Icon an.\n\t /\n\t@Prop() public _ariaLabel!: string;\n\n\t/\n\t Gibt einen Identifier eines Icons aus den Icon's an.\n\t /\n\t@Prop() public _icon!: string;\n\n\t/\n\t Gibt den Identifier für den CSS-Part an, um das Icon von Außen ändern zu können. (https://meowni.ca/posts/part-theme-explainer/)\n\t \n\t @deprecated Das Styling sollte stets über CSS erfolgen.\n\t /\n\t@Prop() public _part?: string;\n\n\t@State() public state: States = {\n\t\t_ariaLabel: '…', // ⚠ required\n\t\t_icon: 'codicon codicon-home',\n\t};\n\n\t@Watch('_ariaLabel')\n\tpublic validateAriaLabel(value?: string): void {\n\t\twatchString(this, '_ariaLabel', value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\t@Watch('_icon')\n\tpublic validateIcon(value?: string): void {\n\t\twatchString(this, '_icon', value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\t/\n\t @deprecated\n\t */\n\t@Watch('_part')\n\tpublic validatePart(_value?: string): void {\n\t\tdevHint(`ICON: The usage of the part attribute is deprecated and has no effect.`);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAriaLabel(this._ariaLabel);\n\t\tthis.validateIcon(this._icon);\n\t\tthis.validatePart(this._part);\n\t}\n}\n"],"mappings":";;;6OAAA,MAAMA,EAAkB,~~ijvB~~,MC6BXC,EAAO,M,wGAsCa,CAC/BC,WAAY,IACZC,MAAO,uB,CAvCDC,SACN,OACCC,EAACC,EAAI,CAACC,YAAY,QACjBF,EAAA,mBACcG,KAAKC,MAAMP,WAAWQ,OAAS,EAAIC,UAAY,OAAM,aAOtDH,KAAKC,MAAMP,WAAWQ,OAAS,EAAIF,KAAKC,MAAMP,WAAaS,UACvEC,MAAOJ,KAAKC,MAAMN,MAClBU,KAAK,OACLC,KAAK,Q,CA6BFC,kBAAkBC,GACxBC,EAAYT,KAAM,aAAcQ,EAAO,CACtCE,SAAU,M,CAKLC,aAAaH,GACnBC,EAAYT,KAAM,QAASQ,EAAO,CACjCE,SAAU,M,CAQLE,aAAaC,GACnBC,EAAQ,yE,CAGFC,oBACNf,KAAKO,kBAAkBP,KAAKN,YAC5BM,KAAKW,aAAaX,KAAKL,OACvBK,KAAKY,aAAaZ,KAAKgB,M"}
1	+ {"version":3,"names":["defaultStyleCss","KolIcon","_ariaLabel","_icon","render","h","Host","exportparts","this","state","length","undefined","class","part","role","validateAriaLabel","value","watchString","required","validateIcon","validatePart","_value","devHint","componentWillLoad","_part"],"sources":["./src/components/icon/style.css?tag=kol-icon&mode=default&encapsulation=shadow","./src/components/icon/component.tsx"],"sourcesContent":["@import '../../assets/codicons/codicon.css';\n\n:host {\n\tcolor: inherit;\n\tdisplay: contents;\n\tline-height: inherit;\n}\n\n/*\n The <code>:important</code> is important, because we should always override the font icon style.\n /\n:host > i,\n:host > i::before {\n\tfont-size: inherit !important;\n}\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { AriaLabel } from '../../types/aria-label';\nimport { watchString } from '../../utils/prop.validators';\nimport { devHint } from '../../utils/a11y.tipps';\n\n/\n API\n /\ntype RequiredProps = AriaLabel & {\n\ticon: string;\n};\ntype OptionalProps = {\n\tpart: string;\n};\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = RequiredProps;\ntype OptionalStates = OptionalProps;\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n@Component({\n\ttag: 'kol-icon',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolIcon implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host exportparts=\"icon\">\n\t\t\t\t<i\n\t\t\t\t\taria-hidden={this.state._ariaLabel.length > 0 ? undefined : 'true'}\n\t\t\t\t\t/\n\t\t\t\t\t Die Auszeichnung `aria-hidden` ist eigentlich nicht erforderlich, da die aktuellen\n\t\t\t\t\t * Screenreader, wie NVDA und JAWS, es auch ohne `aria-hidden` nicht vorlesen.\n\t\t\t\t\t \n\t\t\t\t\t Referenz: https://www.w3.org/TR/wai-aria/states_and_properties#aria-hidden\n\t\t\t\t\t /\n\t\t\t\t\taria-label={this.state._ariaLabel.length > 0 ? this.state._ariaLabel : undefined}\n\t\t\t\t\tclass={this.state._icon}\n\t\t\t\t\tpart=\"icon\"\n\t\t\t\t\trole=\"img\"\n\t\t\t\t></i>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/\n\t Gibt das Aria-Label am Icon an.\n\t /\n\t@Prop() public _ariaLabel!: string;\n\n\t/\n\t Gibt einen Identifier eines Icons aus den Icon's an.\n\t /\n\t@Prop() public _icon!: string;\n\n\t/\n\t Gibt den Identifier für den CSS-Part an, um das Icon von Außen ändern zu können. (https://meowni.ca/posts/part-theme-explainer/)\n\t \n\t @deprecated Das Styling sollte stets über CSS erfolgen.\n\t /\n\t@Prop() public _part?: string;\n\n\t@State() public state: States = {\n\t\t_ariaLabel: '…', // ⚠ required\n\t\t_icon: 'codicon codicon-home',\n\t};\n\n\t@Watch('_ariaLabel')\n\tpublic validateAriaLabel(value?: string): void {\n\t\twatchString(this, '_ariaLabel', value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\t@Watch('_icon')\n\tpublic validateIcon(value?: string): void {\n\t\twatchString(this, '_icon', value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\t/\n\t @deprecated\n\t */\n\t@Watch('_part')\n\tpublic validatePart(_value?: string): void {\n\t\tdevHint(`ICON: The usage of the part attribute is deprecated and has no effect.`);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAriaLabel(this._ariaLabel);\n\t\tthis.validateIcon(this._icon);\n\t\tthis.validatePart(this._part);\n\t}\n}\n"],"mappings":";;;6OAAA,MAAMA,EAAkB,2ivB,MC6BXC,EAAO,M,wGAsCa,CAC/BC,WAAY,IACZC,MAAO,uB,CAvCDC,SACN,OACCC,EAACC,EAAI,CAACC,YAAY,QACjBF,EAAA,mBACcG,KAAKC,MAAMP,WAAWQ,OAAS,EAAIC,UAAY,OAAM,aAOtDH,KAAKC,MAAMP,WAAWQ,OAAS,EAAIF,KAAKC,MAAMP,WAAaS,UACvEC,MAAOJ,KAAKC,MAAMN,MAClBU,KAAK,OACLC,KAAK,Q,CA6BFC,kBAAkBC,GACxBC,EAAYT,KAAM,aAAcQ,EAAO,CACtCE,SAAU,M,CAKLC,aAAaH,GACnBC,EAAYT,KAAM,QAASQ,EAAO,CACjCE,SAAU,M,CAQLE,aAAaC,GACnBC,EAAQ,yE,CAGFC,oBACNf,KAAKO,kBAAkBP,KAAKN,YAC5BM,KAAKW,aAAaX,KAAKL,OACvBK,KAAKY,aAAaZ,KAAKgB,M"}

package/dist/kolibri/kol-nav.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{r as t,h as i,H as e}from"./index-50adf9a0.js";import{d as a,b as n}from"./a11y.tipps-e0a65f3c.js";import{a as r,w as s,b as o}from"./prop.validators-daa14517.js";import{w as l}from"./validation-8f8d53e5.js";import{a as c}from"./i18n-bc1e0dfd.js";import"./dev.utils-bedce29d.js";import"./reuse-56bb5a4b.js";import"./index-81bd9b41.js";import"./index-f3c76945.js";const h=":host{--a11y-min-size:44px}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}*[role='button'],button:not([role='link']),input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],option,select,textarea{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}: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,input,option,select,textarea{cursor:pointer;font-family:inherit;font-size:inherit}.icon-only>kol-span-wc>span>span{display:none}:host>div{display:inline-block}",d=[],p=t=>{const i=d.indexOf(t);i>=0&&d.splice(i,1)},u=class{constructor(a){t(this,a),this.onClick=t=>{t._active=!1===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=>i("ul",{class:{flex:0===t.deep&&"horizontal"===this.state._orientation},part:`nav ${this.state._orientation}`},t.links.map(((a,e)=>i("li",{key:e,part:`li ${0===t.deep?this.state._orientation:"vertical"}${a._active?" selected":""}${e<t.links.length-1?"":" last"}`},Array.isArray(a._children)&&a._children.length>0?i("div",{class:"h-full"},i("div",{class:{"h-full":!0}},i("kol-link-wc",{class:"block w-full h-full",exportparts:"icon,link,span"+(!0===a._active?",selected":""),_ariaLabel:!0===this.state._compact||!0===a._iconOnly?a._label:void 0,_ariaExpanded:!0===a._active,_disabled:a._disabled,_href:"javascript:void(0)",_icon:!0===this.state._collapsible?!0===a._active?"codicon codicon-remove":"codicon codicon-add":"string"==typeof a._icon?a._icon:"codicon codicon-symbol-event",_iconOnly:!0===this.state._compact||!0===a._iconOnly,_label:a._label,onClick:()=>this.onClick(a)})),!0===a._active&&i("div",{class:{expanded:!0,active:!0===a._active,"active-child":this.hasActiveChild(a),"absolute ":0===t.deep&&"horizontal"===this.state._orientation}},i(this.linkList,{links:a._children,deep:t.deep+1}))):i("div",{class:{"h-full":!0,"text-center":!0===this.state._compact||!0===a._iconOnly}},i("kol-link-wc",{class:{"block w-full h-full":!0,active:!0===a._active},exportparts:"icon,link,span"+(!0===a._active?",selected":""),_ariaCurrent:!0===a._active&&this.state._ariaCurrentValue,_ariaLabel:!0===this.state._compact||!0===a._iconOnly?a._label:void 0,_href:a._href,_icon:"string"==typeof a._icon?a._icon:"codicon codicon-symbol-event","_icon-only":!0===this.state._compact||!0===a._iconOnly,_label:a._label,_on:a._on,_selector:a._selector,_tooltipAlign:a._tooltipAlign,_target:a._target})))))),this._ariaCurrentValue=!1,this._ariaLabel=void 0,this._collapsible=!1,this._compact=!1,this._hasCompactButton=!1,this._orientation="vertical",this._links=void 0,this._variant="primary",this.state={_ariaCurrentValue:!1,_ariaLabel:"…",_collapsible:!0,_hasCompactButton:!1,_links:[],_orientation:"vertical",_variant:"primary"}}render(){let t=this.state._hasCompactButton;return"horizontal"===this.state._orientation&&!0===this.state._hasCompactButton&&(t=!1,a("[KolNav] Wenn eine horizontale Navigation verwendet wird, kann die Option _hasCompactButton nicht aktiviert werden.")),i(e,null,i("div",{class:{[this.state._orientation]:!0,"inline-block":!0===this.state._compact,[this.state._variant]:!0}},i("nav",{"aria-label":this.state._ariaLabel,id:"nav",part:"nav"},i(this.linkList,{links:this.state._links,deep:0})),t&&i("div",{class:"mt-2 w-full text-center"},i("kol-button",{exportparts:"button,ghost",_ariaControls:"nav",_ariaExpanded:!0===this.state._compact,_ariaLabel:c(this.state._compact?"kol-nav-maximize":"kol-nav-minimize"),_icon:this.state._compact?"codicon codicon-chevron-right":"codicon codicon-chevron-left",_iconOnly:!0,_label:c(this.state._compact?"kol-nav-maximize":"kol-nav-minimize"),_on:{onClick:()=>{this.state=Object.assign(Object.assign({},this.state),{_compact:!1===this.state._compact})}},_tooltipAlign:"right",_variant:"ghost"}))))}validateAriaCurrentValue(t){r(this,"_ariaCurrentValue",(t=>!0===t||"date"===t||"location"===t||"page"===t||"step"===t||"time"===t),new Set(["boolean","String {data, location, page, step, time}"]),t)}validateAriaLabel(t){s(this,"_ariaLabel",t,{hooks:{afterPatch:()=>{d.includes(this.state._ariaLabel)&&a(`[KolNav] Das Aria-Label "${this.state._ariaLabel}" wurde für die Rolle Navigation mehrfach verwendet!`),d.push(this.state._ariaLabel)},beforePatch:()=>{p(this.state._ariaLabel)}},required:!0}),n(t)}validateCollapsible(t){o(this,"_collapsible",t)}validateCompact(t){o(this,"_compact",t)}validateHasCompactButton(t){o(this,"_hasCompactButton",t)}validateLinks(t){l("KolNav",this,t),a("[KolNav] Die Navigationsstruktur wird noch nicht rekursiv validiert.")}validateOrientation(t){r(this,"_orientation",(t=>"horizontal"===t||"vertical"===t),new Set(["Orientation {horizontal, vertical}"]),t,{defaultValue:"vertical"})}validateVariant(t){r(this,"_variant",(t=>"primary"===t||"secondary"===t),new Set(["KoliBriNavVariant {primary, secondary}"]),t,{defaultValue:"primary"})}componentWillLoad(){this.validateAriaCurrentValue(this._ariaCurrentValue),this.validateAriaLabel(this._ariaLabel),this.validateCollapsible(this._collapsible),this.validateCompact(this._compact),this.validateHasCompactButton(this._hasCompactButton),this.validateLinks(this._links),this.validateOrientation(this._orientation),this.validateVariant(this._variant)}disconnectedCallback(){p(this.state._ariaLabel)}static get watchers(){return{_ariaCurrentValue:["validateAriaCurrentValue"],_ariaLabel:["validateAriaLabel"],_collapsible:["validateCollapsible"],_compact:["validateCompact"],_hasCompactButton:["validateHasCompactButton"],_links:["validateLinks"],_orientation:["validateOrientation"],_variant:["validateVariant"]}}};u.style={default:h};export{u as kol_nav};
+import{r as t,h as i,H as e}from"./index-50adf9a0.js";import{d as a,b as n}from"./a11y.tipps-e0a65f3c.js";import{a as o,w as r,b as s}from"./prop.validators-daa14517.js";import{w as l}from"./validation-8f8d53e5.js";import{a as c}from"./i18n-bc1e0dfd.js";import"./dev.utils-bedce29d.js";import"./reuse-56bb5a4b.js";import"./index-81bd9b41.js";import"./index-f3c76945.js";const d=":host{--a11y-min-size:44px}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}*[role='button'],button:not([role='link']),input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],option,select,textarea{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}: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,input,option,select,textarea{cursor:pointer;font-family:inherit;font-size:inherit}.icon-only>kol-span-wc>span>span{display:none}.list-container.absolute{position:absolute;inset:100% 0 auto 0}.list{display:flex;list-style:none;margin:0px;padding:0px}.list.vertical{flex-direction:column}.entry,.entry>kol-button-wc>button{height:100%}.entry.has-children{display:flex;justify-content:space-between}.entry kol-link-wc{flex-grow:1}.expand-button-container{display:grid;place-content:center}",p=[],h=t=>{const i=p.indexOf(t);i>=0&&p.splice(i,1)},u=class{constructor(a){t(this,a),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=>i("ul",{class:"list "+(0===t.deep&&"horizontal"===t.orientation?" horizontal":" vertical"),"data-deep":t.deep,part:`nav ${t.orientation}`},t.links.map(((i,a)=>this.li(t.collapsible,t.compact,t.deep,a,a<t.links.length-1,i,t.orientation)))),this._ariaCurrentValue=!1,this._ariaLabel=void 0,this._collapsible=!0,this._compact=!1,this._hasCompactButton=!1,this._orientation="vertical",this._links=void 0,this._variant="primary",this.state={_ariaCurrentValue:!1,_ariaLabel:"…",_collapsible:!0,_hasCompactButton:!1,_links:[],_orientation:"vertical",_variant:"primary"}}button(t,a,e,n,o,l,s){return i("kol-button-wc",{exportparts:"icon,button,span"+(t?",selected":""),_ariaLabel:a||o?l:void 0,_ariaExpanded:t,_disabled:e,_icon:n,_iconOnly:a||o,_label:l,_on:s})}dropDown(t,a,e,n,o){return i("div",{class:{"list-container":!0,"active-child":this.hasActiveChild(n),"absolute ":0===e&&"horizontal"===o}},i(this.linkList,{collapsible:t,compact:a,deep:e+1,links:n._children,orientation:o}))}entry(t,a,e,n,o,l,s){return i("div",{class:{entry:!0,"has-children":e,"has-link":!!n._href,selected:l,expanded:o,"text-center":s}},this.textLinkOrButton(t,a,n,l),e?this.expandButton(t,n,l):"")}expandButton(t,a,e){return i("kol-button-wc",{_customClass:"expand-button",_disabled:!t||!a._href,_icon:"codicon codicon-"+(e?"remove":"add"),_label:"",_variant:"custom",class:"expand-button-container",onClick:()=>this.onClick(a)})}li(t,a,e,n,o,l,s){const r=Array.isArray(l._children)&&l._children.length>0,c=!!l._active,p=r&&!!l._active,d=a||!0===l._iconOnly;return i("li",{class:{selected:c,"has-children":r},key:n,part:`li ${0===e?s:"vertical"}${c?" selected":""}${o?"":" last"}`,style:{position:"relative"}},this.entry(t,a,r,l,p,c,d),r&&c?this.dropDown(t,a,e,l,s):"")}link(t,a,e,n,o,l,s){return i("kol-link-wc",{exportparts:"icon,link,span"+(t?",selected":""),_ariaLabel:a||l?s:void 0,_ariaExpanded:t,_disabled:e,_href:n,_icon:o,_iconOnly:a||l,_label:s})}textLinkOrButton(t,i,a,e){return a._href?this.link(e,i,!0===a._disabled,a._href,a._icon,!0===a._iconOnly,a._label):this.button(e,i,!0===a._disabled,a._icon,!0===a._iconOnly,a._label,a._on?a._on:t?{onClick:()=>this.onClick(a)}:null)}render(){let t=this.state._hasCompactButton;"horizontal"===this.state._orientation&&!0===this.state._hasCompactButton&&(t=!1,a("[KolNav] Wenn eine horizontale Navigation verwendet wird, kann die Option _hasCompactButton nicht aktiviert werden."));const n=this.state._collapsible,o=!0===this.state._compact,l=this.state._orientation;return i(e,null,i("div",{class:{[l]:!0,"inline-block":o,[this.state._variant]:!0}},i("nav",{"aria-label":this.state._ariaLabel,id:"nav",part:"nav"},i(this.linkList,{collapsible:n,compact:o,deep:0,links:this.state._links,orientation:l})),t&&i("div",{class:"mt-2 w-full text-center"},i("kol-button",{exportparts:"button,ghost",_ariaControls:"nav",_ariaExpanded:o,_ariaLabel:c(o?"kol-nav-maximize":"kol-nav-minimize"),_icon:o?"codicon codicon-chevron-right":"codicon codicon-chevron-left",_iconOnly:!0,_label:c(o?"kol-nav-maximize":"kol-nav-minimize"),_on:{onClick:()=>{this.state=Object.assign(Object.assign({},this.state),{_compact:!1===this.state._compact})}},_tooltipAlign:"right",_variant:"ghost"}))))}validateAriaCurrentValue(t){o(this,"_ariaCurrentValue",(t=>!0===t||"date"===t||"location"===t||"page"===t||"step"===t||"time"===t),new Set(["boolean","String {data, location, page, step, time}"]),t)}validateAriaLabel(t){r(this,"_ariaLabel",t,{hooks:{afterPatch:()=>{p.includes(this.state._ariaLabel)&&a(`[KolNav] Das Aria-Label "${this.state._ariaLabel}" wurde für die Rolle Navigation mehrfach verwendet!`),p.push(this.state._ariaLabel)},beforePatch:()=>{h(this.state._ariaLabel)}},required:!0}),n(t)}validateCollapsible(t){s(this,"_collapsible",t)}validateCompact(t){s(this,"_compact",t)}validateHasCompactButton(t){s(this,"_hasCompactButton",t)}validateLinks(t){l("KolNav",this,t),a("[KolNav] Die Navigationsstruktur wird noch nicht rekursiv validiert.")}validateOrientation(t){o(this,"_orientation",(t=>"horizontal"===t||"vertical"===t),new Set(["Orientation {horizontal, vertical}"]),t,{defaultValue:"vertical"})}validateVariant(t){o(this,"_variant",(t=>"primary"===t||"secondary"===t),new Set(["KoliBriNavVariant {primary, secondary}"]),t,{defaultValue:"primary"})}componentWillLoad(){this.validateAriaCurrentValue(this._ariaCurrentValue),this.validateAriaLabel(this._ariaLabel),this.validateCollapsible(this._collapsible),this.validateCompact(this._compact),this.validateHasCompactButton(this._hasCompactButton),this.validateLinks(this._links),this.validateOrientation(this._orientation),this.validateVariant(this._variant)}disconnectedCallback(){h(this.state._ariaLabel)}static get watchers(){return{_ariaCurrentValue:["validateAriaCurrentValue"],_ariaLabel:["validateAriaLabel"],_collapsible:["validateCollapsible"],_compact:["validateCompact"],_hasCompactButton:["validateHasCompactButton"],_links:["validateLinks"],_orientation:["validateOrientation"],_variant:["validateVariant"]}}};u.style={default:d};export{u as kol_nav};

package/dist/kolibri/kol-nav.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["defaultStyleCss","UNIQUE_ARIA_LABEL","removeAriaLabel","ariaLabel","index","indexOf","splice","KolNav","this","onClick","link","_active","state","Object","assign","hasActiveChild","Array","isArray","_children","length","some","linkList","props","h","class","flex","deep","_orientation","part","links","map","key","exportparts","_ariaLabel","_compact","_iconOnly","_label","undefined","_ariaExpanded","_disabled","_href","_icon","_collapsible","expanded","active","_ariaCurrent","_ariaCurrentValue","_on","_selector","_tooltipAlign","_target","_hasCompactButton","_links","_variant","render","hasCompactButton","devHint","Host","id","_ariaControls","translate","validateAriaCurrentValue","value","watchValidator","Set","validateAriaLabel","watchString","hooks","afterPatch","includes","push","beforePatch","required","a11yHintLabelingLandmarks","validateCollapsible","watchBoolean","validateCompact","validateHasCompactButton","validateLinks","watchNavLinks","validateOrientation","defaultValue","validateVariant","componentWillLoad","disconnectedCallback"],"sources":["./src/components/nav/style.css?tag=kol-nav&mode=default&encapsulation=shadow","./src/components/nav/component.tsx"],"sourcesContent":["@import '../style.css';\n\n:host > div {\n\tdisplay: inline-block;\n}\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\nimport { Generic } from '@a11y-ui/core';\nimport { Orientation } from '../../types/orientation';\nimport { a11yHintLabelingLandmarks, devHint } from '../../utils/a11y.tipps';\nimport { watchBoolean, watchString, watchValidator } from '../../utils/prop.validators';\nimport { NavLinkProps } from '../link/component';\nimport { watchNavLinks } from './validation';\nimport { Stringified } from '../../types/common';\nimport { AriaCurrent } from '../../types/button-link';\nimport { translate } from '../../i18n';\n\nexport type NavLinkWithChildrenProps = NavLinkProps & {\n\t_children?: NavLinkWithChildrenProps[];\n};\n\nexport type KoliBriNavVariant = 'primary' \| 'secondary';\n\nconst UNIQUE_ARIA_LABEL: string[] = [];\nconst removeAriaLabel = (ariaLabel: string) => {\n\tconst index = UNIQUE_ARIA_LABEL.indexOf(ariaLabel);\n\tif (index >= 0) {\n\t\tUNIQUE_ARIA_LABEL.splice(index, 1);\n\t}\n};\n\nconst linkValidator = (link: NavLinkWithChildrenProps): 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: NavLinkWithChildrenProps[]): boolean => {\n\tif (Array.isArray(links)) {\n\t\treturn links.find(linkValidator) !== undefined;\n\t}\n\treturn true;\n};\n\n/\n API\n /\ntype RequiredProps = {\n\tariaLabel: string;\n\tlinks: Stringified<NavLinkWithChildrenProps[]>;\n};\ntype OptionalProps = {\n\tariaCurrentValue: AriaCurrent;\n\tcollapsible: boolean;\n\tcompact: boolean;\n\thasCompactButton: boolean;\n\torientation: Orientation;\n\tvariant: KoliBriNavVariant;\n};\n// type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = {\n\tariaCurrentValue: AriaCurrent;\n\tariaLabel: string;\n\tcollapsible: boolean;\n\thasCompactButton: boolean;\n\tlinks: NavLinkWithChildrenProps[];\n\torientation: Orientation;\n\tvariant: KoliBriNavVariant;\n};\ntype OptionalStates = {\n\tcompact: boolean;\n};\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n/\n @part nav - TBD\n /\n@Component({\n\ttag: 'kol-nav',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolNav implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\tprivate readonly onClick = (link: NavLinkWithChildrenProps): void => {\n\t\tlink._active = link._active === false;\n\t\tthis.state = {\n\t\t\t...this.state,\n\t\t};\n\t};\n\n\tprivate readonly hasActiveChild = (link: NavLinkWithChildrenProps): 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 linkList = (props: { links: NavLinkWithChildrenProps[]; deep: number }): JSX.Element => {\n\t\treturn (\n\t\t\t<ul\n\t\t\t\tclass={{\n\t\t\t\t\tflex: props.deep === 0 && this.state._orientation === 'horizontal',\n\t\t\t\t}}\n\t\t\t\tpart={`nav ${this.state._orientation}`}\n\t\t\t>\n\t\t\t\t{props.links.map((link, index: number) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<li\n\t\t\t\t\t\t\tkey={index}\n\t\t\t\t\t\t\tpart={`li ${props.deep === 0 ? this.state._orientation : 'vertical'}${link._active ? ' selected' : ''}${\n\t\t\t\t\t\t\t\tindex < props.links.length - 1 ? '' : ' last'\n\t\t\t\t\t\t\t}`}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{Array.isArray(link._children) && link._children.length > 0 ? (\n\t\t\t\t\t\t\t\t<div class=\"h-full\">\n\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t\t\t\t'h-full': true,\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\t\t<kol-link-wc\n\t\t\t\t\t\t\t\t\t\t\tclass=\"block w-full h-full\"\n\t\t\t\t\t\t\t\t\t\t\texportparts={`icon,link,span${link._active === true ? ',selected' : ''}`}\n\t\t\t\t\t\t\t\t\t\t\t// _ariaCurrent will not be set here, since it will be set on a child of this item.\n\t\t\t\t\t\t\t\t\t\t\t_ariaLabel={this.state._compact === true \|\| link._iconOnly === true ? link._label : undefined}\n\t\t\t\t\t\t\t\t\t\t\t_ariaExpanded={link._active === true}\n\t\t\t\t\t\t\t\t\t\t\t_disabled={link._disabled}\n\t\t\t\t\t\t\t\t\t\t\t_href=\"javascript:void(0)\"\n\t\t\t\t\t\t\t\t\t\t\t_icon={\n\t\t\t\t\t\t\t\t\t\t\t\tthis.state._collapsible === true\n\t\t\t\t\t\t\t\t\t\t\t\t\t? link._active === true\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 'codicon codicon-remove'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t: 'codicon codicon-add'\n\t\t\t\t\t\t\t\t\t\t\t\t\t: typeof link._icon === 'string'\n\t\t\t\t\t\t\t\t\t\t\t\t\t? link._icon\n\t\t\t\t\t\t\t\t\t\t\t\t\t: 'codicon codicon-symbol-event'\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t_iconOnly={this.state._compact === true \|\| link._iconOnly === true}\n\t\t\t\t\t\t\t\t\t\t\t_label={link._label}\n\t\t\t\t\t\t\t\t\t\t\tonClick={() => this.onClick(link)}\n\t\t\t\t\t\t\t\t\t\t></kol-link-wc>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t{link._active === true && (\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t\t\t\t\texpanded: true,\n\t\t\t\t\t\t\t\t\t\t\t\tactive: link._active === true,\n\t\t\t\t\t\t\t\t\t\t\t\t'active-child': this.hasActiveChild(link),\n\t\t\t\t\t\t\t\t\t\t\t\t'absolute ': props.deep === 0 && this.state._orientation === 'horizontal',\n\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t<this.linkList links={link._children} deep={props.deep + 1} />\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t\t\t'h-full': true,\n\t\t\t\t\t\t\t\t\t\t'text-center': this.state._compact === true \|\| link._iconOnly === true,\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\t<kol-link-wc\n\t\t\t\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t\t\t\t'block w-full h-full': true,\n\t\t\t\t\t\t\t\t\t\t\tactive: link._active === true,\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\texportparts={`icon,link,span${link._active === true ? ',selected' : ''}`}\n\t\t\t\t\t\t\t\t\t\t_ariaCurrent={link._active === true ? this.state._ariaCurrentValue : false}\n\t\t\t\t\t\t\t\t\t\t_ariaLabel={this.state._compact === true \|\| link._iconOnly === true ? link._label : undefined}\n\t\t\t\t\t\t\t\t\t\t_href={link._href}\n\t\t\t\t\t\t\t\t\t\t_icon={typeof link._icon === 'string' ? link._icon : 'codicon codicon-symbol-event'}\n\t\t\t\t\t\t\t\t\t\t_icon-only={this.state._compact === true \|\| link._iconOnly === true}\n\t\t\t\t\t\t\t\t\t\t_label={link._label}\n\t\t\t\t\t\t\t\t\t\t_on={link._on}\n\t\t\t\t\t\t\t\t\t\t_selector={link._selector}\n\t\t\t\t\t\t\t\t\t\t_tooltipAlign={link._tooltipAlign}\n\t\t\t\t\t\t\t\t\t\t_target={link._target}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</li>\n\t\t\t\t\t);\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\tdevHint(`[KolNav] Wenn eine horizontale Navigation verwendet wird, kann die Option _hasCompactButton nicht aktiviert werden.`);\n\t\t}\n\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<div\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t[this.state._orientation]: true,\n\t\t\t\t\t\t'inline-block': this.state._compact === true,\n\t\t\t\t\t\t[this.state._variant]: true,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<nav aria-label={this.state._ariaLabel} id=\"nav\" part=\"nav\">\n\t\t\t\t\t\t<this.linkList links={this.state._links} deep={0}></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=\"mt-2 w-full text-center\">\n\t\t\t\t\t\t\t<kol-button\n\t\t\t\t\t\t\t\texportparts=\"button,ghost\"\n\t\t\t\t\t\t\t\t_ariaControls=\"nav\"\n\t\t\t\t\t\t\t\t_ariaExpanded={this.state._compact === true}\n\t\t\t\t\t\t\t\t_ariaLabel={translate(this.state._compact ? 'kol-nav-maximize' : 'kol-nav-minimize')}\n\t\t\t\t\t\t\t\t_icon={this.state._compact ? 'codicon codicon-chevron-right' : 'codicon codicon-chevron-left'}\n\t\t\t\t\t\t\t\t_iconOnly\n\t\t\t\t\t\t\t\t_label={translate(this.state._compact ? '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_compact: this.state._compact === 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 Gibt den Wert von aria-current an, der bei dem aktuellen Kontext innerhalb der Navigation verwendet werden soll.\n\t /\n\t@Prop() public _ariaCurrentValue: AriaCurrent = false;\n\n\t/\n\t Gibt den Text an, der die Navigation von anderen Navigationen differenziert.\n\t /\n\t@Prop() public _ariaLabel!: string;\n\n\t/\n\t Gibt an, ob Knoten in der Navigation zusammengeklappt werden können. Ist standardmäßig aktiv.\n\t /\n\t@Prop({ reflect: true }) public _collapsible?: boolean = false;\n\n\t/\n\t Gibt an, ob die Navigation kompakt angezeigt wird.\n\t /\n\t@Prop({ reflect: true }) public _compact?: boolean = false;\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({ reflect: true }) public _hasCompactButton?: boolean = false;\n\n\t/\n\t Gibt die Ausrichtung der Navigation an.\n\t /\n\t@Prop() public _orientation?: Orientation = 'vertical';\n\n\t/\n\t Gibt die geordnete Liste der Seitenhierarchie an.\n\t /\n\t@Prop() public _links!: Stringified<NavLinkWithChildrenProps[]>;\n\n\t/\n\t Gibt an, welche Ausprägung der Button hat.\n\t /\n\t@Prop() public _variant?: KoliBriNavVariant = 'primary';\n\n\t/\n\t @see: components/abbr/component.tsx (@State)\n\t /\n\t@State() public state: States = {\n\t\t_ariaCurrentValue: false,\n\t\t_ariaLabel: '…', // '⚠'\n\t\t_collapsible: true,\n\t\t_hasCompactButton: false,\n\t\t_links: [],\n\t\t_orientation: 'vertical',\n\t\t_variant: 'primary',\n\t};\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_ariaCurrentValue')\n\tpublic validateAriaCurrentValue(value?: AriaCurrent): 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/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_ariaLabel')\n\tpublic validateAriaLabel(value?: string): void {\n\t\twatchString(this, '_ariaLabel', value, {\n\t\t\thooks: {\n\t\t\t\tafterPatch: () => {\n\t\t\t\t\tif (UNIQUE_ARIA_LABEL.includes(this.state._ariaLabel)) {\n\t\t\t\t\t\tdevHint(`[KolNav] Das Aria-Label \"${this.state._ariaLabel}\" wurde für die Rolle Navigation mehrfach verwendet!`);\n\t\t\t\t\t}\n\t\t\t\t\tUNIQUE_ARIA_LABEL.push(this.state._ariaLabel);\n\t\t\t\t},\n\t\t\t\tbeforePatch: () => {\n\t\t\t\t\tremoveAriaLabel(this.state._ariaLabel);\n\t\t\t\t},\n\t\t\t},\n\t\t\trequired: true,\n\t\t});\n\t\ta11yHintLabelingLandmarks(value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_collapsible')\n\tpublic validateCollapsible(value?: boolean): void {\n\t\twatchBoolean(this, '_collapsible', value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_compact')\n\tpublic validateCompact(value?: boolean): void {\n\t\twatchBoolean(this, '_compact', value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_hasCompactButton')\n\tpublic validateHasCompactButton(value?: boolean): void {\n\t\twatchBoolean(this, '_hasCompactButton', value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_links')\n\tpublic validateLinks(value?: Stringified<NavLinkWithChildrenProps[]>): void {\n\t\twatchNavLinks('KolNav', this, value);\n\t\tdevHint(`[KolNav] Die Navigationsstruktur wird noch nicht rekursiv validiert.`);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\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\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_variant')\n\tpublic validateVariant(value?: KoliBriNavVariant): void {\n\t\twatchValidator(this, '_variant', (value) => value === 'primary' \|\| value === 'secondary', new Set(['KoliBriNavVariant {primary, secondary}']), value, {\n\t\t\tdefaultValue: 'primary',\n\t\t});\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAriaCurrentValue(this._ariaCurrentValue);\n\t\tthis.validateAriaLabel(this._ariaLabel);\n\t\tthis.validateCollapsible(this._collapsible);\n\t\tthis.validateCompact(this._compact);\n\t\tthis.validateHasCompactButton(this._hasCompactButton);\n\t\tthis.validateLinks(this._links);\n\t\tthis.validateOrientation(this._orientation);\n\t\tthis.validateVariant(this._variant);\n\t}\n\n\tpublic disconnectedCallback(): void {\n\t\tremoveAriaLabel(this.state._ariaLabel);\n\t}\n}\n\n// console.log(\n// stringifyJson([\n// { _label: '1 Navigationspunkt', _href: '#abc', _icon: 'codicon codicon-folder-closed', _target: 'asdasd' },\n// { _label: '2 Navigationspunkt', _href: '#abc', _icon: 'codicon codicon-folder-closed' },\n// {\n// _active: true,\n// _label: '3 Navigationspunkt',\n// _href: '#abc',\n// _icon: 'codicon codicon-folder-closed',\n// _children: [\n// { _label: '3.1 Navigationspunkt', _href: '#abc', _icon: 'codicon codicon-folder-closed' },\n// { _label: '3.2 Navigationspunkt', _href: '#abc', _icon: '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"],"mappings":"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"}
1	+ {"version":3,"names":["defaultStyleCss","UNIQUE_ARIA_LABEL","removeAriaLabel","ariaLabel","index","indexOf","splice","KolNav","this","onClick","link","_active","state","Object","assign","hasActiveChild","Array","isArray","_children","length","some","linkList","props","h","class","deep","orientation","part","links","map","li","collapsible","compact","_ariaCurrentValue","_ariaLabel","_collapsible","_hasCompactButton","_links","_orientation","_variant","button","selected","disabled","icon","iconOnly","label","on","exportparts","undefined","_ariaExpanded","_disabled","_icon","_iconOnly","_label","_on","dropDown","entry","hasChildren","expanded","textCenter","_href","textLinkOrButton","expandButton","_customClass","isLast","key","style","position","href","render","hasCompactButton","devHint","_compact","Host","id","_ariaControls","translate","_tooltipAlign","validateAriaCurrentValue","value","watchValidator","Set","validateAriaLabel","watchString","hooks","afterPatch","includes","push","beforePatch","required","a11yHintLabelingLandmarks","validateCollapsible","watchBoolean","validateCompact","validateHasCompactButton","validateLinks","watchNavLinks","validateOrientation","defaultValue","validateVariant","componentWillLoad","disconnectedCallback"],"sources":["./src/components/nav/style.css?tag=kol-nav&mode=default&encapsulation=shadow","./src/components/nav/component.tsx"],"sourcesContent":["@import '../style.css';\n\n.list-container.absolute {\n\tposition: absolute;\n\tinset: 100% 0 auto 0;\n}\n.list {\n\tdisplay: flex;\n\t/** ul reset um das erwartete Verhalten zu erzeugen /\n\tlist-style: none;\n\tmargin: 0px;\n\tpadding: 0px;\n}\n.list.vertical {\n\tflex-direction: column;\n}\n\n.entry,\n.entry > kol-button-wc > button {\n\theight: 100%;\n}\n.entry.has-children {\n\tdisplay: flex;\n\tjustify-content: space-between;\n}\n\n.entry kol-link-wc {\n\tflex-grow: 1;\n}\n\n.expand-button-container {\n\tdisplay: grid;\n\tplace-content: center;\n}\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\nimport { Generic } from '@a11y-ui/core';\nimport { Orientation } from '../../types/orientation';\nimport { a11yHintLabelingLandmarks, devHint } from '../../utils/a11y.tipps';\nimport { watchBoolean, watchString, watchValidator } from '../../utils/prop.validators';\nimport { NavLinkProps } from '../link/component';\nimport { watchNavLinks } from './validation';\nimport { Stringified } from '../../types/common';\nimport { AriaCurrent, KoliBriButtonCallbacks } from '../../types/button-link';\nimport { translate } from '../../i18n';\nimport { KoliBriIconProp } from '../../components';\n\nexport type NavLinkWithChildrenProps = NavLinkProps & {\n\t_children?: NavLinkWithChildrenProps[];\n};\n\nexport type KoliBriNavVariant = 'primary' \| 'secondary';\n\nconst UNIQUE_ARIA_LABEL: string[] = [];\nconst removeAriaLabel = (ariaLabel: string) => {\n\tconst index = UNIQUE_ARIA_LABEL.indexOf(ariaLabel);\n\tif (index >= 0) {\n\t\tUNIQUE_ARIA_LABEL.splice(index, 1);\n\t}\n};\n\nconst linkValidator = (link: NavLinkWithChildrenProps): 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: NavLinkWithChildrenProps[]): boolean => {\n\tif (Array.isArray(links)) {\n\t\treturn links.find(linkValidator) !== undefined;\n\t}\n\treturn true;\n};\n\n/\n API\n /\ntype RequiredProps = {\n\tariaLabel: string;\n\tlinks: Stringified<NavLinkWithChildrenProps[]>;\n};\ntype OptionalProps = {\n\tariaCurrentValue: AriaCurrent;\n\tcollapsible: boolean;\n\tcompact: boolean;\n\thasCompactButton: boolean;\n\torientation: Orientation;\n\tvariant: KoliBriNavVariant;\n};\n// type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = {\n\tariaCurrentValue: AriaCurrent;\n\tariaLabel: string;\n\tcollapsible: boolean;\n\thasCompactButton: boolean;\n\tlinks: NavLinkWithChildrenProps[];\n\torientation: Orientation;\n\tvariant: KoliBriNavVariant;\n};\ntype OptionalStates = {\n\tcompact: boolean;\n};\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n/\n @part nav - TBD\n /\n@Component({\n\ttag: 'kol-nav',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolNav implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\tprivate readonly onClick = (link: NavLinkWithChildrenProps): 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: NavLinkWithChildrenProps): 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\t/* Element creation functions /\n\tprivate button(\n\t\tselected: boolean,\n\t\tcompact: boolean,\n\t\tdisabled: boolean,\n\t\ticon: Stringified<KoliBriIconProp> \| undefined,\n\t\ticonOnly: boolean,\n\t\tlabel: string,\n\t\ton: KoliBriButtonCallbacks<unknown>\n\t): JSX.Element {\n\t\treturn (\n\t\t\t<kol-button-wc\n\t\t\t\texportparts={`icon,button,span${selected ? ',selected' : ''}`}\n\t\t\t\t// _ariaCurrent will not be set here, since it will be set on a child of this item.\n\t\t\t\t_ariaLabel={compact \|\| iconOnly ? label : undefined}\n\t\t\t\t_ariaExpanded={selected}\n\t\t\t\t_disabled={disabled}\n\t\t\t\t_icon={icon}\n\t\t\t\t_iconOnly={compact \|\| iconOnly}\n\t\t\t\t_label={label}\n\t\t\t\t_on={on}\n\t\t\t></kol-button-wc>\n\t\t);\n\t}\n\n\tprivate dropDown(collapsible: boolean, compact: boolean, deep: number, link: NavLinkWithChildrenProps, orientation: Orientation): JSX.Element {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={{\n\t\t\t\t\t'list-container': true,\n\t\t\t\t\t'active-child': this.hasActiveChild(link),\n\t\t\t\t\t'absolute ': deep === 0 && orientation === 'horizontal',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{/ eslint-disable-next-line @typescript-eslint/no-non-null-assertion /}\n\t\t\t\t<this.linkList collapsible={collapsible} compact={compact} deep={deep + 1} links={link._children!} orientation={orientation} />\n\t\t\t</div>\n\t\t);\n\t}\n\n\tprivate entry(\n\t\tcollapsible: boolean,\n\t\tcompact: boolean,\n\t\thasChildren: boolean,\n\t\tlink: NavLinkWithChildrenProps,\n\t\texpanded: boolean,\n\t\tselected: boolean,\n\t\ttextCenter: boolean\n\t): JSX.Element {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={{\n\t\t\t\t\tentry: true,\n\t\t\t\t\t'has-children': hasChildren,\n\t\t\t\t\t'has-link': !!link._href,\n\t\t\t\t\tselected,\n\t\t\t\t\texpanded,\n\t\t\t\t\t'text-center': textCenter,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{this.textLinkOrButton(collapsible, compact, link, selected)}\n\t\t\t\t{hasChildren ? this.expandButton(collapsible, link, selected) : ''}\n\t\t\t</div>\n\t\t);\n\t}\n\n\tprivate expandButton(collapsible: boolean, link: NavLinkWithChildrenProps, selected: boolean): JSX.Element {\n\t\treturn (\n\t\t\t<kol-button-wc\n\t\t\t\t_customClass=\"expand-button\"\n\t\t\t\t_disabled={!collapsible \|\| !link._href}\n\t\t\t\t_icon={'codicon codicon-' + (selected ? 'remove' : 'add')}\n\t\t\t\t_label=\"\"\n\t\t\t\t_variant=\"custom\"\n\t\t\t\tclass=\"expand-button-container\"\n\t\t\t\tonClick={() => 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\tcompact: boolean,\n\t\tdeep: number,\n\t\tindex: number,\n\t\tisLast: boolean,\n\t\tlink: NavLinkWithChildrenProps,\n\t\torientation: Orientation\n\t): JSX.Element {\n\t\tconst hasChildren = Array.isArray(link._children) && link._children.length > 0;\n\t\tconst selected = !!link._active;\n\t\tconst expanded = hasChildren && !!link._active;\n\t\tconst textCenter = compact \|\| link._iconOnly === true;\n\t\treturn (\n\t\t\t<li\n\t\t\t\tclass={{ selected, 'has-children': hasChildren }}\n\t\t\t\tkey={index}\n\t\t\t\tpart={`li ${deep === 0 ? orientation : 'vertical'}${selected ? ' selected' : ''}${isLast ? '' : ' last'}`}\n\t\t\t\tstyle={{ position: 'relative' }}\n\t\t\t>\n\t\t\t\t{this.entry(collapsible, compact, hasChildren, link, expanded, selected, textCenter)}\n\t\t\t\t{hasChildren && selected ? this.dropDown(collapsible, compact, deep, link, orientation) : ''}\n\t\t\t</li>\n\t\t);\n\t}\n\n\tprivate link(\n\t\tselected: boolean,\n\t\tcompact: boolean,\n\t\tdisabled: boolean,\n\t\thref: string,\n\t\ticon: Stringified<KoliBriIconProp> \| undefined,\n\t\ticonOnly: boolean,\n\t\tlabel: string\n\t): JSX.Element {\n\t\treturn (\n\t\t\t<kol-link-wc\n\t\t\t\texportparts={`icon,link,span${selected ? ',selected' : ''}`}\n\t\t\t\t// _ariaCurrent will not be set here, since it will be set on a child of this item.\n\t\t\t\t_ariaLabel={compact \|\| iconOnly ? label : undefined}\n\t\t\t\t_ariaExpanded={selected}\n\t\t\t\t_disabled={disabled}\n\t\t\t\t_href={href}\n\t\t\t\t_icon={icon}\n\t\t\t\t_iconOnly={compact \|\| iconOnly}\n\t\t\t\t_label={label}\n\t\t\t></kol-link-wc>\n\t\t);\n\t}\n\n\tprivate linkList = (props: {\n\t\tcollapsible: boolean;\n\t\tcompact: boolean;\n\t\tdeep: number;\n\t\tlinks: NavLinkWithChildrenProps[];\n\t\torientation: Orientation;\n\t}): JSX.Element => {\n\t\treturn (\n\t\t\t<ul\n\t\t\t\tclass={`list ${props.deep === 0 && props.orientation === 'horizontal' ? ' horizontal' : ' vertical'}`}\n\t\t\t\tdata-deep={props.deep}\n\t\t\t\tpart={`nav ${props.orientation}`}\n\t\t\t>\n\t\t\t\t{props.links.map((link, index: number) => {\n\t\t\t\t\treturn this.li(props.collapsible, props.compact, props.deep, index, index < props.links.length - 1, link, props.orientation);\n\t\t\t\t})}\n\t\t\t</ul>\n\t\t);\n\t};\n\n\tprivate textLinkOrButton(collapsible: boolean, compact: boolean, link: NavLinkWithChildrenProps, selected: boolean): JSX.Element {\n\t\tif (link._href) {\n\t\t\treturn this.link(selected, compact, link._disabled === true, link._href, link._icon, link._iconOnly === true, link._label);\n\t\t} else {\n\t\t\treturn this.button(\n\t\t\t\tselected,\n\t\t\t\tcompact,\n\t\t\t\tlink._disabled === true,\n\t\t\t\tlink._icon,\n\t\t\t\tlink._iconOnly === true,\n\t\t\t\tlink._label,\n\t\t\t\t(link._on ? link._on : collapsible ? { onClick: () => this.onClick(link) } : null) as KoliBriButtonCallbacks<unknown>\n\t\t\t);\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\tdevHint(`[KolNav] Wenn eine horizontale Navigation verwendet wird, kann die Option _hasCompactButton nicht aktiviert werden.`);\n\t\t}\n\t\tconst collapsible = this.state._collapsible;\n\t\tconst compact = this.state._compact === 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\t'inline-block': compact,\n\t\t\t\t\t\t[this.state._variant]: true,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<nav aria-label={this.state._ariaLabel} id=\"nav\" part=\"nav\">\n\t\t\t\t\t\t<this.linkList collapsible={collapsible} compact={compact} 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=\"mt-2 w-full text-center\">\n\t\t\t\t\t\t\t<kol-button\n\t\t\t\t\t\t\t\texportparts=\"button,ghost\"\n\t\t\t\t\t\t\t\t_ariaControls=\"nav\"\n\t\t\t\t\t\t\t\t_ariaExpanded={compact}\n\t\t\t\t\t\t\t\t_ariaLabel={translate(compact ? 'kol-nav-maximize' : 'kol-nav-minimize')}\n\t\t\t\t\t\t\t\t_icon={compact ? 'codicon codicon-chevron-right' : 'codicon codicon-chevron-left'}\n\t\t\t\t\t\t\t\t_iconOnly\n\t\t\t\t\t\t\t\t_label={translate(compact ? '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_compact: this.state._compact === 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 Gibt den Wert von aria-current an, der bei dem aktuellen Kontext innerhalb der Navigation verwendet werden soll.\n\t /\n\t@Prop() public _ariaCurrentValue: AriaCurrent = false;\n\n\t/\n\t Gibt den Text an, der die Navigation von anderen Navigationen differenziert.\n\t /\n\t@Prop() public _ariaLabel!: string;\n\n\t/\n\t Gibt an, ob Knoten in der Navigation zusammengeklappt werden können. Ist standardmäßig aktiv.\n\t /\n\t@Prop({ reflect: true }) public _collapsible?: boolean = true;\n\n\t/\n\t Gibt an, ob die Navigation kompakt angezeigt wird.\n\t /\n\t@Prop({ reflect: true }) public _compact?: boolean = false;\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({ reflect: true }) public _hasCompactButton?: boolean = false;\n\n\t/\n\t Gibt die Ausrichtung der Navigation an.\n\t /\n\t@Prop() public _orientation?: Orientation = 'vertical';\n\n\t/\n\t Gibt die geordnete Liste der Seitenhierarchie an.\n\t /\n\t@Prop() public _links!: Stringified<NavLinkWithChildrenProps[]>;\n\n\t/\n\t Gibt an, welche Ausprägung der Button hat.\n\t /\n\t@Prop() public _variant?: KoliBriNavVariant = 'primary';\n\n\t/\n\t @see: components/abbr/component.tsx (@State)\n\t /\n\t@State() public state: States = {\n\t\t_ariaCurrentValue: false,\n\t\t_ariaLabel: '…', // '⚠'\n\t\t_collapsible: true,\n\t\t_hasCompactButton: false,\n\t\t_links: [],\n\t\t_orientation: 'vertical',\n\t\t_variant: 'primary',\n\t};\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_ariaCurrentValue')\n\tpublic validateAriaCurrentValue(value?: AriaCurrent): 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/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_ariaLabel')\n\tpublic validateAriaLabel(value?: string): void {\n\t\twatchString(this, '_ariaLabel', value, {\n\t\t\thooks: {\n\t\t\t\tafterPatch: () => {\n\t\t\t\t\tif (UNIQUE_ARIA_LABEL.includes(this.state._ariaLabel)) {\n\t\t\t\t\t\tdevHint(`[KolNav] Das Aria-Label \"${this.state._ariaLabel}\" wurde für die Rolle Navigation mehrfach verwendet!`);\n\t\t\t\t\t}\n\t\t\t\t\tUNIQUE_ARIA_LABEL.push(this.state._ariaLabel);\n\t\t\t\t},\n\t\t\t\tbeforePatch: () => {\n\t\t\t\t\tremoveAriaLabel(this.state._ariaLabel);\n\t\t\t\t},\n\t\t\t},\n\t\t\trequired: true,\n\t\t});\n\t\ta11yHintLabelingLandmarks(value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_collapsible')\n\tpublic validateCollapsible(value?: boolean): void {\n\t\twatchBoolean(this, '_collapsible', value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_compact')\n\tpublic validateCompact(value?: boolean): void {\n\t\twatchBoolean(this, '_compact', value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_hasCompactButton')\n\tpublic validateHasCompactButton(value?: boolean): void {\n\t\twatchBoolean(this, '_hasCompactButton', value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_links')\n\tpublic validateLinks(value?: Stringified<NavLinkWithChildrenProps[]>): void {\n\t\twatchNavLinks('KolNav', this, value);\n\t\tdevHint(`[KolNav] Die Navigationsstruktur wird noch nicht rekursiv validiert.`);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\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\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_variant')\n\tpublic validateVariant(value?: KoliBriNavVariant): void {\n\t\twatchValidator(this, '_variant', (value) => value === 'primary' \|\| value === 'secondary', new Set(['KoliBriNavVariant {primary, secondary}']), value, {\n\t\t\tdefaultValue: 'primary',\n\t\t});\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAriaCurrentValue(this._ariaCurrentValue);\n\t\tthis.validateAriaLabel(this._ariaLabel);\n\t\tthis.validateCollapsible(this._collapsible);\n\t\tthis.validateCompact(this._compact);\n\t\tthis.validateHasCompactButton(this._hasCompactButton);\n\t\tthis.validateLinks(this._links);\n\t\tthis.validateOrientation(this._orientation);\n\t\tthis.validateVariant(this._variant);\n\t}\n\n\tpublic disconnectedCallback(): void {\n\t\tremoveAriaLabel(this.state._ariaLabel);\n\t}\n}\n"],"mappings":";;;kXAAA,MAAMA,EAAkB,4tCCkBxB,MAAMC,EAA8B,GACpC,MAAMC,EAAmBC,IACxB,MAAMC,EAAQH,EAAkBI,QAAQF,GACxC,GAAIC,GAAS,EAAG,CACfH,EAAkBK,OAAOF,EAAO,E,SA8DrBG,EAAM,M,yBACDC,KAAAC,QAAWC,IAC3BA,EAAKC,SAAWD,EAAKC,QACrBH,KAAKI,MAAKC,OAAAC,OAAA,GACNN,KAAKI,MACR,EAGeJ,KAAAO,eAAkBL,IAClC,GAAIM,MAAMC,QAAQP,EAAKQ,YAAcR,EAAKQ,UAAUC,OAAS,EAAG,CAC/D,OAAOT,EAAKQ,UAAUE,KAAKZ,KAAKO,e,CAGjC,OAAO,KAAK,EAqILP,KAAAa,SAAYC,GAQlBC,EAAA,MACCC,MAAO,QAAQF,EAAMG,OAAS,GAAKH,EAAMI,cAAgB,aAAe,cAAgB,cAAa,YAC1FJ,EAAMG,KACjBE,KAAM,OAAOL,EAAMI,eAElBJ,EAAMM,MAAMC,KAAI,CAACnB,EAAMN,IAChBI,KAAKsB,GAAGR,EAAMS,YAAaT,EAAMU,QAASV,EAAMG,KAAMrB,EAAOA,EAAQkB,EAAMM,MAAMT,OAAS,EAAGT,EAAMY,EAAMI,gB,uBA0EpE,M,4CAUS,K,cAKJ,M,uBAKS,M,kBAKlB,W,oCAUE,U,WAKd,CAC/BO,kBAAmB,MACnBC,WAAY,IACZC,aAAc,KACdC,kBAAmB,MACnBC,OAAQ,GACRC,aAAc,WACdC,SAAU,U,CAxQHC,OACPC,EACAT,EACAU,EACAC,EACAC,EACAC,EACAC,GAEA,OACCvB,EAAA,iBACCwB,YAAa,mBAAmBN,EAAW,YAAc,KAEzDP,WAAYF,GAAWY,EAAWC,EAAQG,UAC1CC,cAAeR,EACfS,UAAWR,EACXS,MAAOR,EACPS,UAAWpB,GAAWY,EACtBS,OAAQR,EACRS,IAAKR,G,CAKAS,SAASxB,EAAsBC,EAAkBP,EAAcf,EAAgCgB,GACtG,OACCH,EAAA,OACCC,MAAO,CACN,iBAAkB,KAClB,eAAgBhB,KAAKO,eAAeL,GACpC,YAAae,IAAS,GAAKC,IAAgB,eAI5CH,EAACf,KAAKa,SAAQ,CAACU,YAAaA,EAAaC,QAASA,EAASP,KAAMA,EAAO,EAAGG,MAAOlB,EAAKQ,UAAYQ,YAAaA,I,CAK3G8B,MACPzB,EACAC,EACAyB,EACA/C,EACAgD,EACAjB,EACAkB,GAEA,OACCpC,EAAA,OACCC,MAAO,CACNgC,MAAO,KACP,eAAgBC,EAChB,aAAc/C,EAAKkD,MACnBnB,WACAiB,WACA,cAAeC,IAGfnD,KAAKqD,iBAAiB9B,EAAaC,EAAStB,EAAM+B,GAClDgB,EAAcjD,KAAKsD,aAAa/B,EAAarB,EAAM+B,GAAY,G,CAK3DqB,aAAa/B,EAAsBrB,EAAgC+B,GAC1E,OACClB,EAAA,iBACCwC,aAAa,gBACbb,WAAYnB,IAAgBrB,EAAKkD,MACjCT,MAAO,oBAAsBV,EAAW,SAAW,OACnDY,OAAO,GACPd,SAAS,SACTf,MAAM,0BACNf,QAAS,IAAMD,KAAKC,QAAQC,I,CAKvBoB,GACPC,EACAC,EACAP,EACArB,EACA4D,EACAtD,EACAgB,GAEA,MAAM+B,EAAczC,MAAMC,QAAQP,EAAKQ,YAAcR,EAAKQ,UAAUC,OAAS,EAC7E,MAAMsB,IAAa/B,EAAKC,QACxB,MAAM+C,EAAWD,KAAiB/C,EAAKC,QACvC,MAAMgD,EAAa3B,GAAWtB,EAAK0C,YAAc,KACjD,OACC7B,EAAA,MACCC,MAAO,CAAEiB,WAAU,eAAgBgB,GACnCQ,IAAK7D,EACLuB,KAAM,MAAMF,IAAS,EAAIC,EAAc,aAAae,EAAW,YAAc,KAAKuB,EAAS,GAAK,UAChGE,MAAO,CAAEC,SAAU,aAElB3D,KAAKgD,MAAMzB,EAAaC,EAASyB,EAAa/C,EAAMgD,EAAUjB,EAAUkB,GACxEF,GAAehB,EAAWjC,KAAK+C,SAASxB,EAAaC,EAASP,EAAMf,EAAMgB,GAAe,G,CAKrFhB,KACP+B,EACAT,EACAU,EACA0B,EACAzB,EACAC,EACAC,GAEA,OACCtB,EAAA,eACCwB,YAAa,iBAAiBN,EAAW,YAAc,KAEvDP,WAAYF,GAAWY,EAAWC,EAAQG,UAC1CC,cAAeR,EACfS,UAAWR,EACXkB,MAAOQ,EACPjB,MAAOR,EACPS,UAAWpB,GAAWY,EACtBS,OAAQR,G,CAyBHgB,iBAAiB9B,EAAsBC,EAAkBtB,EAAgC+B,GAChG,GAAI/B,EAAKkD,MAAO,CACf,OAAOpD,KAAKE,KAAK+B,EAAUT,EAAStB,EAAKwC,YAAc,KAAMxC,EAAKkD,MAAOlD,EAAKyC,MAAOzC,EAAK0C,YAAc,KAAM1C,EAAK2C,O,KAC7G,CACN,OAAO7C,KAAKgC,OACXC,EACAT,EACAtB,EAAKwC,YAAc,KACnBxC,EAAKyC,MACLzC,EAAK0C,YAAc,KACnB1C,EAAK2C,OACJ3C,EAAK4C,IAAM5C,EAAK4C,IAAMvB,EAAc,CAAEtB,QAAS,IAAMD,KAAKC,QAAQC,IAAU,K,EAKzE2D,SACN,IAAIC,EAAmB9D,KAAKI,MAAMwB,kBAClC,GAAI5B,KAAKI,MAAM0B,eAAiB,cAAgB9B,KAAKI,MAAMwB,oBAAsB,KAAM,CACtFkC,EAAmB,MACnBC,EAAQ,sH,CAET,MAAMxC,EAAcvB,KAAKI,MAAMuB,aAC/B,MAAMH,EAAUxB,KAAKI,MAAM4D,WAAa,KACxC,MAAM9C,EAAclB,KAAKI,MAAM0B,aAC/B,OACCf,EAACkD,EAAI,KACJlD,EAAA,OACCC,MAAO,CACNE,CAACA,GAAc,KACf,eAAgBM,EAChB,CAACxB,KAAKI,MAAM2B,UAAW,OAGxBhB,EAAA,oBAAiBf,KAAKI,MAAMsB,WAAYwC,GAAG,MAAM/C,KAAK,OACrDJ,EAACf,KAAKa,SAAQ,CAACU,YAAaA,EAAaC,QAASA,EAASP,KAAM,EAAGG,MAAOpB,KAAKI,MAAMyB,OAAQX,YAAaA,KAE3G4C,GACA/C,EAAA,OAAKC,MAAM,2BACVD,EAAA,cACCwB,YAAY,eACZ4B,cAAc,MACd1B,cAAejB,EACfE,WAAY0C,EAAU5C,EAAU,mBAAqB,oBACrDmB,MAAOnB,EAAU,gCAAkC,+BACnDoB,UAAS,KACTC,OAAQuB,EAAU5C,EAAU,mBAAqB,oBACjDsB,IAAK,CACJ7C,QAAS,KACRD,KAAKI,MAAKC,OAAAC,OAAAD,OAAAC,OAAA,GACNN,KAAKI,OAAK,CACb4D,SAAUhE,KAAKI,MAAM4D,WAAa,OAClC,GAGHK,cAAc,QACdtC,SAAS,Y,CAkETuC,yBAAyBC,GAC/BC,EACCxE,KACA,qBACCuE,GAAUA,IAAU,MAAQA,IAAU,QAAUA,IAAU,YAAcA,IAAU,QAAUA,IAAU,QAAUA,IAAU,QAC3H,IAAIE,IAAI,CAAC,UAAW,8CACpBF,E,CAQKG,kBAAkBH,GACxBI,EAAY3E,KAAM,aAAcuE,EAAO,CACtCK,MAAO,CACNC,WAAY,KACX,GAAIpF,EAAkBqF,SAAS9E,KAAKI,MAAMsB,YAAa,CACtDqC,EAAQ,4BAA4B/D,KAAKI,MAAMsB,iE,CAEhDjC,EAAkBsF,KAAK/E,KAAKI,MAAMsB,WAAW,EAE9CsD,YAAa,KACZtF,EAAgBM,KAAKI,MAAMsB,WAAW,GAGxCuD,SAAU,OAEXC,EAA0BX,E,CAOpBY,oBAAoBZ,GAC1Ba,EAAapF,KAAM,eAAgBuE,E,CAO7Bc,gBAAgBd,GACtBa,EAAapF,KAAM,WAAYuE,E,CAOzBe,yBAAyBf,GAC/Ba,EAAapF,KAAM,oBAAqBuE,E,CAOlCgB,cAAchB,GACpBiB,EAAc,SAAUxF,KAAMuE,GAC9BR,EAAQ,uE,CAOF0B,oBAAoBlB,GAC1BC,EACCxE,KACA,gBACCuE,GAAmBA,IAAU,cAAgBA,IAAU,YACxD,IAAIE,IAAI,CAAC,uCACTF,EACA,CACCmB,aAAc,Y,CASVC,gBAAgBpB,GACtBC,EAAexE,KAAM,YAAauE,GAAUA,IAAU,WAAaA,IAAU,aAAa,IAAIE,IAAI,CAAC,2CAA4CF,EAAO,CACrJmB,aAAc,W,CAOTE,oBACN5F,KAAKsE,yBAAyBtE,KAAKyB,mBACnCzB,KAAK0E,kBAAkB1E,KAAK0B,YAC5B1B,KAAKmF,oBAAoBnF,KAAK2B,cAC9B3B,KAAKqF,gBAAgBrF,KAAKgE,UAC1BhE,KAAKsF,yBAAyBtF,KAAK4B,mBACnC5B,KAAKuF,cAAcvF,KAAK6B,QACxB7B,KAAKyF,oBAAoBzF,KAAK8B,cAC9B9B,KAAK2F,gBAAgB3F,KAAK+B,S,CAGpB8D,uBACNnG,EAAgBM,KAAKI,MAAMsB,W"}

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

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{r as t,h as i,H as e}from"./index-50adf9a0.js";import{b as s,w as a,s as o,e as n,a as r}from"./prop.validators-daa14517.js";import{w as h}from"./validation-ce72d9b3.js";import{f as l}from"./a11y.tipps-e0a65f3c.js";import"./dev.utils-bedce29d.js";import"./reuse-56bb5a4b.js";import"./index-81bd9b41.js";const p=":host{--a11y-min-size:44px}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}*[role='button'],button:not([role='link']),input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],option,select,textarea{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}: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,input,option,select,textarea{cursor:pointer;font-family:inherit;font-size:inherit}.icon-only>kol-span-wc>span>span{display:none}:host{display:block}:host>div{height:0;left:0;position:fixed;top:0;width:100%;z-index:200}:host>div>kol-alert{display:block;margin:auto;max-width:750px}:host>div>kol-button-wc{display:block;margin:auto;position:relative;top:0;width:1em}",d=class{constructor(e){t(this,e),this.handleShowAndDuration=()=>{!0===this.state._show&&"number"==typeof this.state._showDuration&&this.state._showDuration>=0&&(clearTimeout(this.durationTimeout),this.durationTimeout=setTimeout((()=>{clearTimeout(this.durationTimeout),this.close()}),this.state._showDuration))},this.close=()=>{var t;this._show=!1,this.state=Object.assign(Object.assign({},this.state),{_show:!1}),void 0!==(null===(t=this._on)||void 0===t?void 0:t.onClose)&&this._on.onClose(new Event("Close"))},this.on={onClose:this.close},this._alert=!0,this._hasCloser=!1,this._heading="",this._level=1,this._on=void 0,this._show=!0,this._showDuration=1e4,this._type="default",this.state={_alert:!0,_level:1,_show:!0}}validateAlert(t){s(this,"_alert",t)}validateHasCloser(t){s(this,"_hasCloser",t)}validateHeading(t){a(this,"_heading",t)}validateLevel(t){h(this,t)}validateOn(t){if("object"==typeof t&&null!==t){l("[KolToast] Prüfen, wie man auch einen EventCallback einzeln ändern kann.");const e={};"function"!=typeof t.onClose&&!0!==t.onClose||(e.onClose=t.onClose),o(this,"_on",e)}}validateShow(t){s(this,"_show",t,{hooks:{afterPatch:this.handleShowAndDuration}})}validateShowDuration(t){n(this,"_showDuration",t,{hooks:{afterPatch:this.handleShowAndDuration}})}validateType(t){r(this,"_type",(t=>"string"==typeof t&&("default"===t||"error"===t||"info"===t||"success"===t||"warning"===t)),new Set("String {success, info, warning, error}"),t)}componentWillLoad(){this.validateAlert(this._alert),this.validateHasCloser(this._hasCloser),this.validateHeading(this._heading),this.validateLevel(this._level),this.validateOn(this._on),this.validateShow(this._show),this.validateShowDuration(this._showDuration),this.validateType(this._type)}render(){return i(e,null,this.state._show&&i("div",null,i("kol-alert",{_alert:this.state._alert,_heading:this.state._heading,_level:this.state._level,_hasCloser:this.state._hasCloser,_type:this.state._type,_variant:"card",_on:this.on},i("slot",null))))}static get watchers(){return{_alert:["validateAlert"],_hasCloser:["validateHasCloser"],_heading:["validateHeading"],_level:["validateLevel"],_on:["validateOn"],_show:["validateShow"],_showDuration:["validateShowDuration"],_type:["validateType"]}}};d.style={default:p};export{d as kol_toast};
+import{r as t,h as i,H as e}from"./index-50adf9a0.js";import{b as s,w as a,s as o,e as n,a as r}from"./prop.validators-daa14517.js";import{w as h}from"./validation-ce72d9b3.js";import{f as l}from"./a11y.tipps-e0a65f3c.js";import"./dev.utils-bedce29d.js";import"./reuse-56bb5a4b.js";import"./index-81bd9b41.js";const p=":host{--a11y-min-size:44px}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}*[role='button'],button:not([role='link']),input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],option,select,textarea{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}: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,input,option,select,textarea{cursor:pointer;font-family:inherit;font-size:inherit}.icon-only>kol-span-wc>span>span{display:none}:host{display:block}:host>div{height:0;left:0;margin:1rem;position:fixed;top:0;width:100%;z-index:200}:host>div>kol-alert{display:block;margin:auto;max-width:750px}:host>div>kol-button-wc{display:block;margin:auto;position:relative;top:0;width:1em}",d=class{constructor(e){t(this,e),this.handleShowAndDuration=()=>{!0===this.state._show&&"number"==typeof this.state._showDuration&&this.state._showDuration>=0&&(clearTimeout(this.durationTimeout),this.durationTimeout=setTimeout((()=>{clearTimeout(this.durationTimeout),this.close()}),this.state._showDuration))},this.close=()=>{var t;this._show=!1,this.state=Object.assign(Object.assign({},this.state),{_show:!1}),void 0!==(null===(t=this._on)||void 0===t?void 0:t.onClose)&&this._on.onClose(new Event("Close"))},this.on={onClose:this.close},this._alert=!0,this._hasCloser=!1,this._heading="",this._level=1,this._on=void 0,this._show=!0,this._showDuration=1e4,this._type="default",this.state={_alert:!0,_level:1,_show:!0}}validateAlert(t){s(this,"_alert",t)}validateHasCloser(t){s(this,"_hasCloser",t)}validateHeading(t){a(this,"_heading",t)}validateLevel(t){h(this,t)}validateOn(t){if("object"==typeof t&&null!==t){l("[KolToast] Prüfen, wie man auch einen EventCallback einzeln ändern kann.");const e={};"function"!=typeof t.onClose&&!0!==t.onClose||(e.onClose=t.onClose),o(this,"_on",e)}}validateShow(t){s(this,"_show",t,{hooks:{afterPatch:this.handleShowAndDuration}})}validateShowDuration(t){n(this,"_showDuration",t,{hooks:{afterPatch:this.handleShowAndDuration}})}validateType(t){r(this,"_type",(t=>"string"==typeof t&&("default"===t||"error"===t||"info"===t||"success"===t||"warning"===t)),new Set("String {success, info, warning, error}"),t)}componentWillLoad(){this.validateAlert(this._alert),this.validateHasCloser(this._hasCloser),this.validateHeading(this._heading),this.validateLevel(this._level),this.validateOn(this._on),this.validateShow(this._show),this.validateShowDuration(this._showDuration),this.validateType(this._type)}render(){return i(e,null,this.state._show&&i("div",null,i("kol-alert",{_alert:this.state._alert,_heading:this.state._heading,_level:this.state._level,_hasCloser:this.state._hasCloser,_type:this.state._type,_variant:"card",_on:this.on},i("slot",null))))}static get watchers(){return{_alert:["validateAlert"],_hasCloser:["validateHasCloser"],_heading:["validateHeading"],_level:["validateLevel"],_on:["validateOn"],_show:["validateShow"],_showDuration:["validateShowDuration"],_type:["validateType"]}}};d.style={default:p};export{d as kol_toast};

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

	@@ -1 +1 @@
1	- {"version":3,"names":["defaultStyleCss","KolToast","this","handleShowAndDuration","state","_show","_showDuration","clearTimeout","durationTimeout","setTimeout","close","Object","assign","_a","_on","onClose","undefined","Event","on","_alert","_level","validateAlert","value","watchBoolean","validateHasCloser","validateHeading","watchString","validateLevel","watchHeadingLevel","validateOn","featureHint","callbacks","setState","validateShow","hooks","afterPatch","validateShowDuration","watchNumber","validateType","watchValidator","Set","componentWillLoad","_hasCloser","_heading","_type","render","h","Host","_variant"],"sources":["./src/components/toast/style.css?tag=kol-toast&mode=default&encapsulation=shadow","./src/components/toast/component.tsx"],"sourcesContent":["@import '../style.css';\n@import '../host-display-block.css';\n\n:host > div {\n\theight: 0;\n\tleft: 0;\n\tposition: fixed;\n\ttop: 0;\n\twidth: 100%;\n\tz-index: 200;\n}\n\n:host > div > kol-alert {\n\tdisplay: block;\n\tmargin: auto;\n\tmax-width: 750px;\n}\n\n:host > div > kol-button-wc {\n\tdisplay: block;\n\tmargin: auto;\n\tposition: relative;\n\ttop: 0;\n\twidth: 1em;\n}\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { AlertType } from '../../types/alert';\nimport { HeadingLevel } from '../../types/heading-level';\nimport { setState, watchBoolean, watchNumber, watchString, watchValidator } from '../../utils/prop.validators';\nimport { watchHeadingLevel } from '../heading/validation';\nimport { KoliBriToastEventCallbacks } from '../../types/toast';\nimport { featureHint } from '../../utils/a11y.tipps';\n\n/*\n API\n /\ntype RequiredProps = unknown;\ntype OptionalProps = {\n\talert: boolean;\n\thasCloser: boolean;\n\theading: string;\n\tlevel: HeadingLevel;\n\ton: KoliBriToastEventCallbacks;\n\tshow: boolean;\n\tshowDuration: number;\n\ttype: AlertType;\n};\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = RequiredProps;\ntype OptionalStates = OptionalProps;\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n@Component({\n\ttag: 'kol-toast',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolToast implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\t/\n\t Gibt an, ob der Screenreader die Meldung vorlesen soll.\n\t /\n\t@Prop({ reflect: true }) public _alert?: boolean = true;\n\n\t/\n\t Gibt an, ob der Toast ein Schließen-Icon hat.\n\t /\n\t@Prop({ reflect: true }) public _hasCloser?: boolean = false;\n\n\t/\n\t Gibt den Titel der Meldung an.\n\t /\n\t@Prop() public _heading?: string = '';\n\n\t/\n\t Gibt an, welchen H-Level von 1 bis 6 die Überschrift hat.\n\t /\n\t@Prop() public _level?: HeadingLevel = 1;\n\n\t/\n\t Gibt die EventCallback-Function für das Schließen des Toasts an.\n\t /\n\t@Prop() public _on?: KoliBriToastEventCallbacks;\n\n\t/\n\t Gibt an, ob der Toast eingeblendet wird.\n\t /\n\t@Prop({ mutable: true, reflect: true }) public _show?: boolean = true;\n\n\t/\n\t Gibt an, wie viele Millisekunden der Toast eingeblendet werden soll.\n\t /\n\t@Prop() public _showDuration?: number = 10000;\n\n\t/\n\t Gibt an, ob es sich um eine Erfolgs-, Info-, Warnung- oder Fehlermeldung handelt.\n\t /\n\t@Prop() public _type?: AlertType = 'default';\n\n\t/\n\t @see: components/abbr/component.tsx (@State)\n\t /\n\t@State() public state: States = {\n\t\t_alert: true,\n\t\t_level: 1,\n\t\t_show: true,\n\t};\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\twatchBoolean(this, '_alert', value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_hasCloser')\n\tpublic validateHasCloser(value?: boolean): void {\n\t\twatchBoolean(this, '_hasCloser', value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_heading')\n\tpublic validateHeading(value?: string): void {\n\t\twatchString(this, '_heading', value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_level')\n\tpublic validateLevel(value?: HeadingLevel): void {\n\t\twatchHeadingLevel(this, value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_on')\n\tpublic validateOn(value?: KoliBriToastEventCallbacks): void {\n\t\tif (typeof value === 'object' && value !== null) {\n\t\t\tfeatureHint('[KolToast] Prüfen, wie man auch einen EventCallback einzeln ändern kann.');\n\t\t\tconst callbacks: KoliBriToastEventCallbacks = {};\n\t\t\tif (typeof value.onClose === 'function' \|\| value.onClose === true) {\n\t\t\t\tcallbacks.onClose = value.onClose;\n\t\t\t}\n\t\t\tsetState<KoliBriToastEventCallbacks>(this, '_on', callbacks);\n\t\t}\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_show')\n\tpublic validateShow(value?: boolean): void {\n\t\twatchBoolean(this, '_show', value, {\n\t\t\thooks: {\n\t\t\t\tafterPatch: this.handleShowAndDuration,\n\t\t\t},\n\t\t});\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_showDuration')\n\tpublic validateShowDuration(value?: number): void {\n\t\twatchNumber(this, '_showDuration', value, {\n\t\t\thooks: {\n\t\t\t\tafterPatch: this.handleShowAndDuration,\n\t\t\t},\n\t\t});\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_type')\n\tpublic validateType(value?: AlertType): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_type',\n\t\t\t(value) => typeof value === 'string' && (value === 'default' \|\| value === 'error' \|\| value === 'info' \|\| value === 'success' \|\| value === 'warning'),\n\t\t\tnew Set('String {success, info, warning, error}'),\n\t\t\tvalue\n\t\t);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAlert(this._alert);\n\t\tthis.validateHasCloser(this._hasCloser);\n\t\tthis.validateHeading(this._heading);\n\t\tthis.validateLevel(this._level);\n\t\tthis.validateOn(this._on);\n\t\tthis.validateShow(this._show);\n\t\tthis.validateShowDuration(this._showDuration);\n\t\tthis.validateType(this._type);\n\t}\n\n\tprivate durationTimeout?: NodeJS.Timer;\n\n\tprivate readonly handleShowAndDuration = () => {\n\t\tif (this.state._show === true && typeof this.state._showDuration === 'number' && this.state._showDuration >= 0) {\n\t\t\tclearTimeout(this.durationTimeout as NodeJS.Timer);\n\t\t\tthis.durationTimeout = setTimeout(() => {\n\t\t\t\tclearTimeout(this.durationTimeout as NodeJS.Timer);\n\t\t\t\tthis.close();\n\t\t\t}, this.state._showDuration);\n\t\t}\n\t};\n\n\tprivate readonly close = () => {\n\t\tthis._show = false;\n\t\tthis.state = {\n\t\t\t...this.state,\n\t\t\t_show: false,\n\t\t};\n\n\t\tif (this._on?.onClose !== undefined) {\n\t\t\tthis._on.onClose(new Event('Close'));\n\t\t}\n\t};\n\n\tprivate readonly on = {\n\t\tonClose: this.close,\n\t};\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t{this.state._show && (\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<kol-alert\n\t\t\t\t\t\t\t_alert={this.state._alert}\n\t\t\t\t\t\t\t_heading={this.state._heading}\n\t\t\t\t\t\t\t_level={this.state._level}\n\t\t\t\t\t\t\t_hasCloser={this.state._hasCloser}\n\t\t\t\t\t\t\t_type={this.state._type}\n\t\t\t\t\t\t\t_variant=\"card\"\n\t\t\t\t\t\t\t// tabindex=\"0\"\n\t\t\t\t\t\t\t_on={this.on}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<slot />\n\t\t\t\t\t\t</kol-alert>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"mappings":";;;sTAAA,MAAMA,EAAkB,~~kmC~~,MCqCXC,EAAQ,M,yBAuJHC,KAAAC,sBAAwB,KACxC,GAAID,KAAKE,MAAMC,QAAU,aAAeH,KAAKE,MAAME,gBAAkB,UAAYJ,KAAKE,MAAME,eAAiB,EAAG,CAC/GC,aAAaL,KAAKM,iBAClBN,KAAKM,gBAAkBC,YAAW,KACjCF,aAAaL,KAAKM,iBAClBN,KAAKQ,OAAO,GACVR,KAAKE,MAAME,c,GAICJ,KAAAQ,MAAQ,K,MACxBR,KAAKG,MAAQ,MACbH,KAAKE,MAAKO,OAAAC,OAAAD,OAAAC,OAAA,GACNV,KAAKE,OAAK,CACbC,MAAO,QAGR,KAAIQ,EAAAX,KAAKY,OAAG,MAAAD,SAAA,SAAAA,EAAEE,WAAYC,UAAW,CACpCd,KAAKY,IAAIC,QAAQ,IAAIE,MAAM,S,GAIZf,KAAAgB,GAAK,CACrBH,QAASb,KAAKQ,O,YA1KoC,K,gBAKI,M,cAKpB,G,YAKI,E,8BAU0B,K,mBAKzB,I,WAKL,U,WAKH,CAC/BS,OAAQ,KACRC,OAAQ,EACRf,MAAO,K,CAODgB,cAAcC,GACpBC,EAAarB,KAAM,SAAUoB,E,CAOvBE,kBAAkBF,GACxBC,EAAarB,KAAM,aAAcoB,E,CAO3BG,gBAAgBH,GACtBI,EAAYxB,KAAM,WAAYoB,E,CAOxBK,cAAcL,GACpBM,EAAkB1B,KAAMoB,E,CAOlBO,WAAWP,GACjB,UAAWA,IAAU,UAAYA,IAAU,KAAM,CAChDQ,EAAY,4EACZ,MAAMC,EAAwC,GAC9C,UAAWT,EAAMP,UAAY,YAAcO,EAAMP,UAAY,KAAM,CAClEgB,EAAUhB,QAAUO,EAAMP,O,CAE3BiB,EAAqC9B,KAAM,MAAO6B,E,EAQ7CE,aAAaX,GACnBC,EAAarB,KAAM,QAASoB,EAAO,CAClCY,MAAO,CACNC,WAAYjC,KAAKC,wB,CASbiC,qBAAqBd,GAC3Be,EAAYnC,KAAM,gBAAiBoB,EAAO,CACzCY,MAAO,CACNC,WAAYjC,KAAKC,wB,CASbmC,aAAahB,GACnBiB,EACCrC,KACA,SACCoB,UAAiBA,IAAU,WAAaA,IAAU,WAAaA,IAAU,SAAWA,IAAU,QAAUA,IAAU,WAAaA,IAAU,YAC1I,IAAIkB,IAAI,0CACRlB,E,CAOKmB,oBACNvC,KAAKmB,cAAcnB,KAAKiB,QACxBjB,KAAKsB,kBAAkBtB,KAAKwC,YAC5BxC,KAAKuB,gBAAgBvB,KAAKyC,UAC1BzC,KAAKyB,cAAczB,KAAKkB,QACxBlB,KAAK2B,WAAW3B,KAAKY,KACrBZ,KAAK+B,aAAa/B,KAAKG,OACvBH,KAAKkC,qBAAqBlC,KAAKI,eAC/BJ,KAAKoC,aAAapC,KAAK0C,M,CA+BjBC,SACN,OACCC,EAACC,EAAI,KACH7C,KAAKE,MAAMC,OACXyC,EAAA,WACCA,EAAA,aACC3B,OAAQjB,KAAKE,MAAMe,OACnBwB,SAAUzC,KAAKE,MAAMuC,SACrBvB,OAAQlB,KAAKE,MAAMgB,OACnBsB,WAAYxC,KAAKE,MAAMsC,WACvBE,MAAO1C,KAAKE,MAAMwC,MAClBI,SAAS,OAETlC,IAAKZ,KAAKgB,IAEV4B,EAAA,e"}
1	+ {"version":3,"names":["defaultStyleCss","KolToast","this","handleShowAndDuration","state","_show","_showDuration","clearTimeout","durationTimeout","setTimeout","close","Object","assign","_a","_on","onClose","undefined","Event","on","_alert","_level","validateAlert","value","watchBoolean","validateHasCloser","validateHeading","watchString","validateLevel","watchHeadingLevel","validateOn","featureHint","callbacks","setState","validateShow","hooks","afterPatch","validateShowDuration","watchNumber","validateType","watchValidator","Set","componentWillLoad","_hasCloser","_heading","_type","render","h","Host","_variant"],"sources":["./src/components/toast/style.css?tag=kol-toast&mode=default&encapsulation=shadow","./src/components/toast/component.tsx"],"sourcesContent":["@import '../style.css';\n@import '../host-display-block.css';\n\n:host > div {\n\theight: 0;\n\tleft: 0;\n\tmargin: 1rem; /* needed for overlay situations /\n\tposition: fixed;\n\ttop: 0;\n\twidth: 100%;\n\tz-index: 200;\n}\n\n:host > div > kol-alert {\n\tdisplay: block;\n\tmargin: auto;\n\tmax-width: 750px;\n}\n\n:host > div > kol-button-wc {\n\tdisplay: block;\n\tmargin: auto;\n\tposition: relative;\n\ttop: 0;\n\twidth: 1em;\n}\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { AlertType } from '../../types/alert';\nimport { HeadingLevel } from '../../types/heading-level';\nimport { setState, watchBoolean, watchNumber, watchString, watchValidator } from '../../utils/prop.validators';\nimport { watchHeadingLevel } from '../heading/validation';\nimport { KoliBriToastEventCallbacks } from '../../types/toast';\nimport { featureHint } from '../../utils/a11y.tipps';\n\n/\n API\n /\ntype RequiredProps = unknown;\ntype OptionalProps = {\n\talert: boolean;\n\thasCloser: boolean;\n\theading: string;\n\tlevel: HeadingLevel;\n\ton: KoliBriToastEventCallbacks;\n\tshow: boolean;\n\tshowDuration: number;\n\ttype: AlertType;\n};\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = RequiredProps;\ntype OptionalStates = OptionalProps;\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n@Component({\n\ttag: 'kol-toast',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolToast implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\t/\n\t Gibt an, ob der Screenreader die Meldung vorlesen soll.\n\t /\n\t@Prop({ reflect: true }) public _alert?: boolean = true;\n\n\t/\n\t Gibt an, ob der Toast ein Schließen-Icon hat.\n\t /\n\t@Prop({ reflect: true }) public _hasCloser?: boolean = false;\n\n\t/\n\t Gibt den Titel der Meldung an.\n\t /\n\t@Prop() public _heading?: string = '';\n\n\t/\n\t Gibt an, welchen H-Level von 1 bis 6 die Überschrift hat.\n\t /\n\t@Prop() public _level?: HeadingLevel = 1;\n\n\t/\n\t Gibt die EventCallback-Function für das Schließen des Toasts an.\n\t /\n\t@Prop() public _on?: KoliBriToastEventCallbacks;\n\n\t/\n\t Gibt an, ob der Toast eingeblendet wird.\n\t /\n\t@Prop({ mutable: true, reflect: true }) public _show?: boolean = true;\n\n\t/\n\t Gibt an, wie viele Millisekunden der Toast eingeblendet werden soll.\n\t /\n\t@Prop() public _showDuration?: number = 10000;\n\n\t/\n\t Gibt an, ob es sich um eine Erfolgs-, Info-, Warnung- oder Fehlermeldung handelt.\n\t /\n\t@Prop() public _type?: AlertType = 'default';\n\n\t/\n\t @see: components/abbr/component.tsx (@State)\n\t /\n\t@State() public state: States = {\n\t\t_alert: true,\n\t\t_level: 1,\n\t\t_show: true,\n\t};\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\twatchBoolean(this, '_alert', value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_hasCloser')\n\tpublic validateHasCloser(value?: boolean): void {\n\t\twatchBoolean(this, '_hasCloser', value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_heading')\n\tpublic validateHeading(value?: string): void {\n\t\twatchString(this, '_heading', value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_level')\n\tpublic validateLevel(value?: HeadingLevel): void {\n\t\twatchHeadingLevel(this, value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_on')\n\tpublic validateOn(value?: KoliBriToastEventCallbacks): void {\n\t\tif (typeof value === 'object' && value !== null) {\n\t\t\tfeatureHint('[KolToast] Prüfen, wie man auch einen EventCallback einzeln ändern kann.');\n\t\t\tconst callbacks: KoliBriToastEventCallbacks = {};\n\t\t\tif (typeof value.onClose === 'function' \|\| value.onClose === true) {\n\t\t\t\tcallbacks.onClose = value.onClose;\n\t\t\t}\n\t\t\tsetState<KoliBriToastEventCallbacks>(this, '_on', callbacks);\n\t\t}\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_show')\n\tpublic validateShow(value?: boolean): void {\n\t\twatchBoolean(this, '_show', value, {\n\t\t\thooks: {\n\t\t\t\tafterPatch: this.handleShowAndDuration,\n\t\t\t},\n\t\t});\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_showDuration')\n\tpublic validateShowDuration(value?: number): void {\n\t\twatchNumber(this, '_showDuration', value, {\n\t\t\thooks: {\n\t\t\t\tafterPatch: this.handleShowAndDuration,\n\t\t\t},\n\t\t});\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t /\n\t@Watch('_type')\n\tpublic validateType(value?: AlertType): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_type',\n\t\t\t(value) => typeof value === 'string' && (value === 'default' \|\| value === 'error' \|\| value === 'info' \|\| value === 'success' \|\| value === 'warning'),\n\t\t\tnew Set('String {success, info, warning, error}'),\n\t\t\tvalue\n\t\t);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (componentWillLoad)\n\t */\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAlert(this._alert);\n\t\tthis.validateHasCloser(this._hasCloser);\n\t\tthis.validateHeading(this._heading);\n\t\tthis.validateLevel(this._level);\n\t\tthis.validateOn(this._on);\n\t\tthis.validateShow(this._show);\n\t\tthis.validateShowDuration(this._showDuration);\n\t\tthis.validateType(this._type);\n\t}\n\n\tprivate durationTimeout?: NodeJS.Timer;\n\n\tprivate readonly handleShowAndDuration = () => {\n\t\tif (this.state._show === true && typeof this.state._showDuration === 'number' && this.state._showDuration >= 0) {\n\t\t\tclearTimeout(this.durationTimeout as NodeJS.Timer);\n\t\t\tthis.durationTimeout = setTimeout(() => {\n\t\t\t\tclearTimeout(this.durationTimeout as NodeJS.Timer);\n\t\t\t\tthis.close();\n\t\t\t}, this.state._showDuration);\n\t\t}\n\t};\n\n\tprivate readonly close = () => {\n\t\tthis._show = false;\n\t\tthis.state = {\n\t\t\t...this.state,\n\t\t\t_show: false,\n\t\t};\n\n\t\tif (this._on?.onClose !== undefined) {\n\t\t\tthis._on.onClose(new Event('Close'));\n\t\t}\n\t};\n\n\tprivate readonly on = {\n\t\tonClose: this.close,\n\t};\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t{this.state._show && (\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<kol-alert\n\t\t\t\t\t\t\t_alert={this.state._alert}\n\t\t\t\t\t\t\t_heading={this.state._heading}\n\t\t\t\t\t\t\t_level={this.state._level}\n\t\t\t\t\t\t\t_hasCloser={this.state._hasCloser}\n\t\t\t\t\t\t\t_type={this.state._type}\n\t\t\t\t\t\t\t_variant=\"card\"\n\t\t\t\t\t\t\t// tabindex=\"0\"\n\t\t\t\t\t\t\t_on={this.on}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<slot />\n\t\t\t\t\t\t</kol-alert>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"mappings":";;;sTAAA,MAAMA,EAAkB,8mC,MCqCXC,EAAQ,M,yBAuJHC,KAAAC,sBAAwB,KACxC,GAAID,KAAKE,MAAMC,QAAU,aAAeH,KAAKE,MAAME,gBAAkB,UAAYJ,KAAKE,MAAME,eAAiB,EAAG,CAC/GC,aAAaL,KAAKM,iBAClBN,KAAKM,gBAAkBC,YAAW,KACjCF,aAAaL,KAAKM,iBAClBN,KAAKQ,OAAO,GACVR,KAAKE,MAAME,c,GAICJ,KAAAQ,MAAQ,K,MACxBR,KAAKG,MAAQ,MACbH,KAAKE,MAAKO,OAAAC,OAAAD,OAAAC,OAAA,GACNV,KAAKE,OAAK,CACbC,MAAO,QAGR,KAAIQ,EAAAX,KAAKY,OAAG,MAAAD,SAAA,SAAAA,EAAEE,WAAYC,UAAW,CACpCd,KAAKY,IAAIC,QAAQ,IAAIE,MAAM,S,GAIZf,KAAAgB,GAAK,CACrBH,QAASb,KAAKQ,O,YA1KoC,K,gBAKI,M,cAKpB,G,YAKI,E,8BAU0B,K,mBAKzB,I,WAKL,U,WAKH,CAC/BS,OAAQ,KACRC,OAAQ,EACRf,MAAO,K,CAODgB,cAAcC,GACpBC,EAAarB,KAAM,SAAUoB,E,CAOvBE,kBAAkBF,GACxBC,EAAarB,KAAM,aAAcoB,E,CAO3BG,gBAAgBH,GACtBI,EAAYxB,KAAM,WAAYoB,E,CAOxBK,cAAcL,GACpBM,EAAkB1B,KAAMoB,E,CAOlBO,WAAWP,GACjB,UAAWA,IAAU,UAAYA,IAAU,KAAM,CAChDQ,EAAY,4EACZ,MAAMC,EAAwC,GAC9C,UAAWT,EAAMP,UAAY,YAAcO,EAAMP,UAAY,KAAM,CAClEgB,EAAUhB,QAAUO,EAAMP,O,CAE3BiB,EAAqC9B,KAAM,MAAO6B,E,EAQ7CE,aAAaX,GACnBC,EAAarB,KAAM,QAASoB,EAAO,CAClCY,MAAO,CACNC,WAAYjC,KAAKC,wB,CASbiC,qBAAqBd,GAC3Be,EAAYnC,KAAM,gBAAiBoB,EAAO,CACzCY,MAAO,CACNC,WAAYjC,KAAKC,wB,CASbmC,aAAahB,GACnBiB,EACCrC,KACA,SACCoB,UAAiBA,IAAU,WAAaA,IAAU,WAAaA,IAAU,SAAWA,IAAU,QAAUA,IAAU,WAAaA,IAAU,YAC1I,IAAIkB,IAAI,0CACRlB,E,CAOKmB,oBACNvC,KAAKmB,cAAcnB,KAAKiB,QACxBjB,KAAKsB,kBAAkBtB,KAAKwC,YAC5BxC,KAAKuB,gBAAgBvB,KAAKyC,UAC1BzC,KAAKyB,cAAczB,KAAKkB,QACxBlB,KAAK2B,WAAW3B,KAAKY,KACrBZ,KAAK+B,aAAa/B,KAAKG,OACvBH,KAAKkC,qBAAqBlC,KAAKI,eAC/BJ,KAAKoC,aAAapC,KAAK0C,M,CA+BjBC,SACN,OACCC,EAACC,EAAI,KACH7C,KAAKE,MAAMC,OACXyC,EAAA,WACCA,EAAA,aACC3B,OAAQjB,KAAKE,MAAMe,OACnBwB,SAAUzC,KAAKE,MAAMuC,SACrBvB,OAAQlB,KAAKE,MAAMgB,OACnBsB,WAAYxC,KAAKE,MAAMsC,WACvBE,MAAO1C,KAAKE,MAAMwC,MAClBI,SAAS,OAETlC,IAAKZ,KAAKgB,IAEV4B,EAAA,e"}

package/dist/types/components/nav/component.d.ts CHANGED Viewed

@@ -36,7 +36,14 @@ type States = Generic.Element.Members<RequiredStates, OptionalStates>;
 export declare class KolNav implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {
   private readonly onClick;
   private readonly hasActiveChild;
+  private button;
+  private dropDown;
+  private entry;
+  private expandButton;
+  private li;
+  private link;
   private linkList;
+  private textLinkOrButton;
   render(): JSX.Element;
   _ariaCurrentValue: AriaCurrent;
   _ariaLabel: string;

package/doc/components.md CHANGED Viewed

@@ -3,6 +3,6 @@
 ## Styling
 1. Do not use `!important`!
-2. Really, only use `:host` when addressing a direct child node via the selection (like `:host > .first-button`)!
-3. Align your styling to the default alignment, not the full styling!
-4. Use only the colors from the `design tokens`!
+2. Only alignment/position/layout!
+3. No colors/spacing/font/transform/animation!
+4. padding/margin 0 is allowed! If set, use comment.

package/doc/nav.md CHANGED Viewed

@@ -99,7 +99,7 @@ Die Navigationsleiste kann mit dem Attribut `_orientation` zwischen horizontaler
 | ------------------------- | --------------------- | ---------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------- | ------------ |
 | `_ariaCurrentValue`       | `_aria-current-value` | Gibt den Wert von aria-current an, der bei dem aktuellen Kontext innerhalb der Navigation verwendet werden soll. | `"date" \| "location" \| "page" \| "step" \| "time" \| boolean` | `false`      |
 | `_ariaLabel` _(required)_ | `_aria-label`         | Gibt den Text an, der die Navigation von anderen Navigationen differenziert.                                     | `string`                                                        | `undefined`  |
-| `_collapsible`            | `_collapsible`        | Gibt an, ob Knoten in der Navigation zusammengeklappt werden können. Ist standardmäßig aktiv.                    | `boolean \| undefined`                                          | `false`      |
+| `_collapsible`            | `_collapsible`        | Gibt an, ob Knoten in der Navigation zusammengeklappt werden können. Ist standardmäßig aktiv.                    | `boolean \| undefined`                                          | `true`       |
 | `_compact`                | `_compact`            | Gibt an, ob die Navigation kompakt angezeigt wird.                                                               | `boolean \| undefined`                                          | `false`      |
 | `_hasCompactButton`       | `_has-compact-button` | Gibt an, ob die Navigation eine zusätzliche Schaltfläche zum Aus- und Einklappen der Navigation anzeigen soll.   | `boolean \| undefined`                                          | `false`      |
 | `_links` _(required)_     | `_links`              | Gibt die geordnete Liste der Seitenhierarchie an.                                                                | `NavLinkWithChildrenProps[] \| string`                          | `undefined`  |
@@ -118,23 +118,25 @@ Die Navigationsleiste kann mit dem Attribut `_orientation` zwischen horizontaler
 ### Depends on
+- kol-button-wc
 - kol-link-wc
 - [kol-button](../button)
 ### Graph
 ```mermaid
 graph TD;
+  kol-nav --> kol-button-wc
   kol-nav --> kol-link-wc
   kol-nav --> kol-button
-  kol-link-wc --> kol-span-wc
-  kol-link-wc --> kol-icon
-  kol-link-wc --> kol-tooltip
+  kol-button-wc --> kol-span-wc
+  kol-button-wc --> kol-tooltip
   kol-span-wc --> kol-icon
   kol-tooltip --> kol-badge
   kol-badge --> kol-span-wc
   kol-badge --> kol-button-wc
-  kol-button-wc --> kol-span-wc
-  kol-button-wc --> kol-tooltip
+  kol-link-wc --> kol-span-wc
+  kol-link-wc --> kol-icon
+  kol-link-wc --> kol-tooltip
   kol-button --> kol-button-wc
   style kol-nav fill:#f9f,stroke:#333,stroke-width:4px
 ```