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

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

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

Files changed (598) hide show

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

	@@ -1 +1 @@
1	- {"file":"component7.js","mappings":";;;;;;;;;;;AAAA,MAAM,eAAe,GAAG,sxBAAsxB;;~~ACW9yB~~,WAAW,CAAC,qEAAqE,CAAC,CAAC;MA6BtE,QAAQ;;;;;IACZ,eAAU,GAAG,MAAM,CAAC;IACpB,aAAQ,GAAG,MAAM,CAAC;~~IAmElB~~,sBAAiB,GAAG,CAAC,KAAc;MAC1C,MAAM,SAAS,GAAG,iBAAiB,CAAC,KAAK,CAAC,CAAC;MAC3C,IAAI,CAAC,UAAU,GAAG,SAAS,CAAC,eAAe,CAAC;MAC5C,IAAI,CAAC,QAAQ,GAAG,SAAS,CAAC,eAAyB,CAAC;KACpD,CAAC;kBAlC+C,MAAM;;qBAUD,KAAK;;;iBAY3B;MAC/B,MAAM,EAAE;QACP,eAAe,EAAE,MAAM;QACvB,eAAe,EAAE,MAAM;OACvB;MACD,MAAM,EAAE,GAAG;KACX;;~~EA/DM~~,MAAM;IACZ,QACC,EAAC,IAAI,QACJ,YACC,KAAK,EAAE;QACN,cAAc,EAAE,OAAO,IAAI,CAAC,KAAK,CAAC,YAAY,KAAK,QAAQ,IAAI,IAAI,CAAC,KAAK,CAAC,YAAY,KAAK,IAAI;OAC/F,EACD,KAAK,EAAE;QACN,eAAe,EAAE,IAAI,CAAC,UAAU;QAChC,KAAK,EAAE,IAAI,CAAC,QAAQ;OACpB,IAED,mBAAa,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,SAAS,EAAE,IAAI,CAAC,SAAS,EAAE,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,GAAgB,~~EACnG~~,OAAO,IAAI,CAAC,KAAK,CAAC,YAAY,KAAK,QAAQ,IAAI,IAAI,CAAC,KAAK,CAAC,YAAY,KAAK,IAAI,KAC/E,qBACC,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,UAAU,EAC9C,YAAY,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,YAAY,EAClD,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,SAAS,EAC5C,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,KAAK,EACpC,SAAS,EAAE,IAAI,EACf,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,GAAG,EAChC,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,MAAM,EACtC,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,GAAG,EAChC,aAAa,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,aAAa,EACpD,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,QAAQ,GAC1B,CACjB,CACK,CACD,EACN;GACF;EA0CM,aAAa,CAAC,KAA8B;IAClD,aAAa,CAAC,IAAI,EAAE,KAAK,EAAE;MAC1B,YAAY,EAAE,MAAM;MACpB,KAAK,EAAE;QACN,WAAW,EAAE,IAAI,CAAC,iBAAiB;OACnC;KACD,CAAC,CAAC;GACH;EAGM,aAAa,CAAC,KAAc;IAClC,aAAa,CAAC,IAAI,EAAE,KAAK,EAAE;MAC1B,KAAK,EAAE;QACN,UAAU,EAAE,CAAC,KAAK;UACjB,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,KAAK,CAAC,MAAM,GAAG,EAAE,EAAE;YACnD,QAAQ,CAAC,iDAAiD,KAAK,CAAC,MAAM,SAAS,CAAC,CAAC;WACjF;SACD;OACD;KACD,CAAC,CAAC;GACH;EAGM,mBAAmB,CAAC,KAA4B;IACtD,mBAAmB,CAAC,KAAK,EAAE;MAC1B,IAAI;QACH,KAAK,GAAG,SAAS,CAAc,KAAe,CAAC,CAAC;OAEhD;MAAC,OAAO,CAAC,EAAE;OAEX;MACD,QAAQ,CAAC,IAAI,EAAE,cAAc,EAAE,KAAK,CAAC,CAAC;KACtC,CAAC,CAAC;GACH;EAEM,iBAAiB;IACvB,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IAChC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IAChC,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;GAC5C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/badge/style.css?tag=kol-badge&mode=default&encapsulation=shadow","./src/components/badge/component.tsx"],"sourcesContent":["@import url(../style.css);\n:host > span {\n\tdisplay: inline-flex;\n\tplace-items: center;\n}\n:host > span > kol-button-wc button {\n\tcolor: inherit;\n}\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { ButtonProps } from '../../types/button-link';\nimport { Stringified } from '../../types/common';\nimport { KoliBriIconProp } from '../../types/icon';\nimport { ColorPair, handleColorChange, PropColor, validateColor } from '../../types/props/color';\nimport { a11yHint, featureHint } from '../../utils/a11y.tipps';\nimport { objectObjectHandler, parseJson, setState } from '../../utils/prop.validators';\nimport { validateLabel } from '../../types/props';\n\nfeatureHint(`[KolBadge] Optimierung des _color-Properties (rgba, rgb, hex usw.).`);\n\ntype RequiredProps = {\n\tlabel: string;\n};\ntype OptionalProps = {\n\tcolor: Stringified<PropColor>;\n\ticon: Stringified<KoliBriIconProp>;\n\ticonOnly: boolean;\n\tsmartButton: Stringified<ButtonProps>;\n};\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = {\n\tcolor: ColorPair;\n\tlabel: string;\n};\ntype OptionalStates = {\n\tsmartButton: ButtonProps;\n};\nexport type States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n@Component({\n\ttag: 'kol-badge',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolBadge implements Props {\n\tprivate bgColorStr = '#000';\n\tprivate colorStr = '#fff';\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<span\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t'smart-button': typeof this.state._smartButton === 'object' && this.state._smartButton !== null,\n\t\t\t\t\t}}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tbackgroundColor: this.bgColorStr,\n\t\t\t\t\t\tcolor: this.colorStr,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<kol-span-wc _icon={this._icon} _iconOnly={this._iconOnly} _label={this.state._label}></kol-span-wc>\n\t\t\t\t\t{typeof this.state._smartButton === 'object' && this.state._smartButton !== null && (\n\t\t\t\t\t\t<kol-button-wc\n\t\t\t\t\t\t\t_ariaLabel={this.state._smartButton._ariaLabel}\n\t\t\t\t\t\t\t_customClass={this.state._smartButton._customClass}\n\t\t\t\t\t\t\t_disabled={this.state._smartButton._disabled}\n\t\t\t\t\t\t\t_icon={this.state._smartButton._icon}\n\t\t\t\t\t\t\t_iconOnly={true}\n\t\t\t\t\t\t\t_id={this.state._smartButton._id}\n\t\t\t\t\t\t\t_label={this.state._smartButton._label}\n\t\t\t\t\t\t\t_on={this.state._smartButton._on}\n\t\t\t\t\t\t\t_tooltipAlign={this.state._smartButton._tooltipAlign}\n\t\t\t\t\t\t\t_variant={this.state._smartButton._variant}\n\t\t\t\t\t\t></kol-button-wc>\n\t\t\t\t\t)}\n\t\t\t\t</span>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/*\n\t Setzt die Hintergrundfarbe.\n\t /\n\t@Prop() public _color?: Stringified<PropColor> = '#000';\n\n\t/\n\t Iconklasse (z.B.: \"codicon codicon-home\")\n\t /\n\t@Prop() public _icon?: Stringified<KoliBriIconProp>;\n\n\t/\n\t ~~Gibt~~ ~~an,~~ ob ~~nur~~ ~~das~~ ~~Icon~~ ~~angezeigt~~ ~~wird~~.\n\t /\n\t@Prop({ reflect: true }) public _iconOnly?: boolean = false;\n\n\t/\n\t Setzt ~~den~~ ~~sichtbaren~~ ~~Text~~ ~~des~~ ~~Elements~~.\n\t /\n\t@Prop() public _label!: string;\n\n\t/\n\t Ermöglicht einen Schalter ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (nur Icon-Only).\n\t */\n\t@Prop() public _smartButton?: Stringified<ButtonProps>;\n\n\t@State() public state: States = {\n\t\t_color: {\n\t\t\tbackgroundColor: '#000',\n\t\t\tforegroundColor: '#fff',\n\t\t},\n\t\t_label: '…', // ⚠ required\n\t};\n\n\tprivate handleColorChange = (value: unknown) => {\n\t\tconst colorPair = handleColorChange(value);\n\t\tthis.bgColorStr = colorPair.backgroundColor;\n\t\tthis.colorStr = colorPair.foregroundColor as string;\n\t};\n\n\t@Watch('_color')\n\tpublic validateColor(value?: Stringified<PropColor>): void {\n\t\tvalidateColor(this, value, {\n\t\t\tdefaultValue: '#000',\n\t\t\thooks: {\n\t\t\t\tbeforePatch: this.handleColorChange,\n\t\t\t},\n\t\t});\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: string): void {\n\t\tvalidateLabel(this, value, {\n\t\t\thooks: {\n\t\t\t\tafterPatch: (value) => {\n\t\t\t\t\tif (typeof value === 'string' && value.length > 32) {\n\t\t\t\t\t\ta11yHint(`[KolBadge] The label is too long for a badge (${value.length} > 32).`);\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t},\n\t\t});\n\t}\n\n\t@Watch('_smartButton')\n\tpublic validateSmartButton(value?: ButtonProps \| string): void {\n\t\tobjectObjectHandler(value, () => {\n\t\t\ttry {\n\t\t\t\tvalue = parseJson<ButtonProps>(value as string);\n\t\t\t\t// eslint-disable-next-line no-empty\n\t\t\t} catch (e) {\n\t\t\t\t// value behält den ursprünglichen Wert\n\t\t\t}\n\t\t\tsetState(this, '_smartButton', value);\n\t\t});\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateColor(this._color);\n\t\tthis.validateLabel(this._label);\n\t\tthis.validateSmartButton(this._smartButton);\n\t}\n}\n"],"version":3}
1	+ {"file":"component7.js","mappings":"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","names":[],"sources":["./src/components/badge/style.css?tag=kol-badge&mode=default&encapsulation=shadow","./src/components/badge/component.tsx"],"sourcesContent":["@import url(../style.css);\n:host > span {\n\tdisplay: inline-flex;\n\tplace-items: center;\n}\n:host > span > kol-button-wc button {\n\tcolor: inherit;\n}\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { ButtonProps } from '../../types/button-link';\nimport { Stringified } from '../../types/common';\nimport { KoliBriIconProp } from '../../types/icon';\nimport { ColorPair, handleColorChange, PropColor, validateColor } from '../../types/props/color';\nimport { a11yHint, featureHint } from '../../utils/a11y.tipps';\nimport { objectObjectHandler, parseJson, setState } from '../../utils/prop.validators';\nimport { validateLabel } from '../../types/props';\nimport { nonce } from '../../utils/dev.utils';\n\nfeatureHint(`[KolBadge] Optimierung des _color-Properties (rgba, rgb, hex usw.).`);\n\ntype RequiredProps = {\n\tlabel: string;\n};\ntype OptionalProps = {\n\tcolor: Stringified<PropColor>;\n\ticon: Stringified<KoliBriIconProp>;\n\ticonOnly: boolean;\n\tsmartButton: Stringified<ButtonProps>;\n};\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = {\n\tcolor: ColorPair;\n\tlabel: string;\n};\ntype OptionalStates = {\n\tsmartButton: ButtonProps;\n};\nexport type States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n@Component({\n\ttag: 'kol-badge',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolBadge implements Props {\n\tprivate bgColorStr = '#000';\n\tprivate colorStr = '#fff';\n\tprivate readonly id = nonce();\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<span\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t'smart-button': typeof this.state._smartButton === 'object' && this.state._smartButton !== null,\n\t\t\t\t\t}}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tbackgroundColor: this.bgColorStr,\n\t\t\t\t\t\tcolor: this.colorStr,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<kol-span-wc id={this.id} _icon={this._icon} _iconOnly={this._iconOnly} _label={this.state._label}></kol-span-wc>\n\t\t\t\t\t{typeof this.state._smartButton === 'object' && this.state._smartButton !== null && (\n\t\t\t\t\t\t<kol-button-wc\n\t\t\t\t\t\t\t_ariaControls={this.id}\n\t\t\t\t\t\t\t_ariaLabel={this.state._smartButton._ariaLabel}\n\t\t\t\t\t\t\t_customClass={this.state._smartButton._customClass}\n\t\t\t\t\t\t\t_disabled={this.state._smartButton._disabled}\n\t\t\t\t\t\t\t_icon={this.state._smartButton._icon}\n\t\t\t\t\t\t\t_iconOnly={true}\n\t\t\t\t\t\t\t_id={this.state._smartButton._id}\n\t\t\t\t\t\t\t_label={this.state._smartButton._label}\n\t\t\t\t\t\t\t_on={this.state._smartButton._on}\n\t\t\t\t\t\t\t_tooltipAlign={this.state._smartButton._tooltipAlign}\n\t\t\t\t\t\t\t_variant={this.state._smartButton._variant}\n\t\t\t\t\t\t></kol-button-wc>\n\t\t\t\t\t)}\n\t\t\t\t</span>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/*\n\t Setzt die Hintergrundfarbe.\n\t /\n\t@Prop() public _color?: Stringified<PropColor> = '#000';\n\n\t/\n\t Setzt die Iconklasse (z.B.: `_icon=\"codicon codicon-home`).\n\t /\n\t@Prop() public _icon?: Stringified<KoliBriIconProp>;\n\n\t/\n\t Blendet die Beschriftung (Label) aus und zeigt sie stattdessen mittels eines Tooltips an.\n\t /\n\t@Prop({ reflect: true }) public _iconOnly?: boolean = false;\n\n\t/\n\t Setzt die sichtbare oder semantische Beschriftung der Komponente (z.B. Aria-Label, Label, Headline, Caption, Summary usw.).\n\t /\n\t@Prop() public _label!: string;\n\n\t/\n\t Ermöglicht einen Schalter ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (nur Icon-Only).\n\t */\n\t@Prop() public _smartButton?: Stringified<ButtonProps>;\n\n\t@State() public state: States = {\n\t\t_color: {\n\t\t\tbackgroundColor: '#000',\n\t\t\tforegroundColor: '#fff',\n\t\t},\n\t\t_label: '…', // ⚠ required\n\t};\n\n\tprivate handleColorChange = (value: unknown) => {\n\t\tconst colorPair = handleColorChange(value);\n\t\tthis.bgColorStr = colorPair.backgroundColor;\n\t\tthis.colorStr = colorPair.foregroundColor as string;\n\t};\n\n\t@Watch('_color')\n\tpublic validateColor(value?: Stringified<PropColor>): void {\n\t\tvalidateColor(this, value, {\n\t\t\tdefaultValue: '#000',\n\t\t\thooks: {\n\t\t\t\tbeforePatch: this.handleColorChange,\n\t\t\t},\n\t\t});\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: string): void {\n\t\tvalidateLabel(this, value, {\n\t\t\thooks: {\n\t\t\t\tafterPatch: (value) => {\n\t\t\t\t\tif (typeof value === 'string' && value.length > 32) {\n\t\t\t\t\t\ta11yHint(`[KolBadge] The label is too long for a badge (${value.length} > 32).`);\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t},\n\t\t});\n\t}\n\n\t@Watch('_smartButton')\n\tpublic validateSmartButton(value?: ButtonProps \| string): void {\n\t\tobjectObjectHandler(value, () => {\n\t\t\ttry {\n\t\t\t\tvalue = parseJson<ButtonProps>(value as string);\n\t\t\t\t// eslint-disable-next-line no-empty\n\t\t\t} catch (e) {\n\t\t\t\t// value behält den ursprünglichen Wert\n\t\t\t}\n\t\t\tsetState(this, '_smartButton', value);\n\t\t});\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateColor(this._color);\n\t\tthis.validateLabel(this._label);\n\t\tthis.validateSmartButton(this._smartButton);\n\t}\n}\n"],"version":3}

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

	@@ -1 +1 @@
1	- {"file":"component8.js","mappings":"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","names":[],"sources":["./src/types/props/download.ts","./src/types/props/stealth.ts","./src/components/link/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { watchBoolean, watchString } from '../../utils/prop.validators';\n\n/* types /\n/* de\n * Teilt dem Browser mit, dass sich hinter dem Link eine Datei befindet. Setzt optional den Dateinamen.\n /\n/* en\n * Tells the browser that the link contains a file. Optionally sets the filename.\n /\nexport type PropDownload = {\n\tdownload?: boolean \| string;\n};\n\n/ validator /\nexport const validateDownload = (component: Generic.Element.Component, value?: boolean \| string): void => {\n\tif (typeof value === 'boolean') watchBoolean(component, '_download', value);\n\telse watchString(component, '_download', value);\n};\n","import { Generic } from '@a11y-ui/core';\nimport { watchBoolean } from '../../utils/prop.validators';\n\n/ types /\n/* de\n * Versteckt den Link und lässt ihn bei Fokussierung erscheinen.\n /\n/* en\n * Hides the link und makes it appear on focus.\n /\nexport type PropStealth = {\n\tstealth: boolean;\n};\n\n/ validator /\nexport const validateStealth = (component: Generic.Element.Component, value?: boolean): void => {\n\twatchBoolean(component, '_stealth', value);\n};\n","import { Component, Element, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { translate } from '../../i18n';\nimport {\n\tAlternativButtonLinkRole,\n\tLinkOnCallbacks,\n\tLinkStates,\n\tLinkTarget,\n\tLinkUseCase,\n\tOptionalLinkProps,\n\tOptionalLinkStates,\n\tRequiredLinkProps,\n\tRequiredLinkStates,\n\twatchTooltipAlignment,\n} from '../../types/button-link';\nimport { Stringified } from '../../types/common';\nimport { KoliBriIconProp } from '../../types/icon';\nimport { AriaCurrent, Alignment, validateAriaCurrent, validateAriaSelected, validateStealth, validateDownload } from '../../types/props';\nimport { a11yHintDisabled, devHint } from '../../utils/a11y.tipps';\nimport { nonce } from '../../utils/dev.utils';\nimport { mapBoolean2String, scrollBySelector, setEventTarget, watchBoolean, watchString } from '../../utils/prop.validators';\nimport { propagateFocus } from '../../utils/reuse';\nimport { validateIcon, watchIconAlign } from '../../types/props/icon';\nimport { validateAriaLabelWithLabel, validateLabelWithAriaLabel } from '../../types/props/label';\nimport { validateTabIndex } from '../../utils/validators/tab-index';\n\n/\n @internal\n /\n@Component({\n\ttag: 'kol-link-wc',\n\tshadow: false,\n})\nexport class KolLinkWc implements Generic.Element.ComponentApi<RequiredLinkProps, OptionalLinkProps, RequiredLinkStates, OptionalLinkStates> {\n\t@Element() private readonly host?: HTMLKolLinkWcElement;\n\tprivate readonly nonce = nonce();\n\tprivate ref?: HTMLAnchorElement;\n\n\tprivate readonly catchRef = (ref?: HTMLAnchorElement) => {\n\t\tthis.ref = ref;\n\t\tpropagateFocus(this.host, this.ref);\n\t};\n\n\tprivate readonly onClick = (event: Event) => {\n\t\tif (typeof this.state._on?.onClick === 'function') {\n\t\t\tevent.preventDefault();\n\t\t\tsetEventTarget(event, this.ref);\n\t\t\tthis.state._on?.onClick(event, this.state._href);\n\t\t}\n\t};\n\n\tprivate readonly getRenderValues = () => {\n\t\t/\n\t\t DX\n\t\t * Das möchte ich ungern für HTML machen, sondern nur für Barrierefreiheitsthemen.\n\t\t /\n\t\t// if (typeof this.state._href === 'string' && this.state._href.length > 0) {\n\t\t// console.error('Setz den URL.');\n\t\t// throw new Error('Setz den URL.');\n\t\t// }\n\n\t\t// switch (this.state._target) {\n\t\t// case '_blank':\n\t\t// case '_self':\n\t\t// break;\n\t\t// default:\n\t\t// console.error('Fehlerhaftes Target.');\n\t\t// throw new Error('Fehlerhaftes Target.');\n\t\t// }\n\n\t\t// ROBUSTHEIT durch Validierung\n\t\tlet goToProps = {};\n\t\tif (typeof this.state._selector === 'string') {\n\t\t\tgoToProps = {\n\t\t\t\trole: 'link',\n\t\t\t\ttabIndex: 0,\n\t\t\t\tonClick: () => {\n\t\t\t\t\tscrollBySelector(this.state._selector as string);\n\t\t\t\t},\n\t\t\t\tonKeyPress: () => {\n\t\t\t\t\tscrollBySelector(this.state._selector as string);\n\t\t\t\t},\n\t\t\t};\n\t\t}\n\n\t\tconst isExternal = typeof this.state._target === 'string' && this.state._target !== '_self';\n\n\t\tconst tagAttrs = {\n\t\t\thref: typeof this.state._href === 'string' && this.state._href.length > 0 ? this.state._href : 'javascript:void(0)',\n\t\t\ttarget: typeof this.state._target === 'string' && this.state._target.length > 0 ? this.state._target : undefined,\n\t\t\trel: isExternal ? 'noopener' : undefined,\n\t\t};\n\n\t\tif (\n\t\t\t(this.state._useCase === 'image' \|\| this.state._iconOnly === true) &&\n\t\t\t(typeof this.state._ariaLabel !== 'string' \|\| this.state._ariaLabel.length === 0)\n\t\t) {\n\t\t\tdevHint(`[KolLink] Es muss ein Aria-Label gesetzt werden, wenn eine Grafik verlinkt oder der Icon-Only-Modus verwendet wird.`);\n\t\t}\n\t\treturn { isExternal, tagAttrs, goToProps };\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { isExternal, tagAttrs, goToProps } = this.getRenderValues();\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<a\n\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t{...tagAttrs}\n\t\t\t\t\taria-controls={this.state._ariaControls}\n\t\t\t\t\taria-current={this.state._ariaCurrent}\n\t\t\t\t\taria-expanded={mapBoolean2String(this.state._ariaExpanded)}\n\t\t\t\t\taria-labelledby={this.state._useCase === 'image' \|\| this.state._iconOnly === true ? this.nonce : undefined}\n\t\t\t\t\taria-selected={mapBoolean2String(this.state._ariaSelected)}\n\t\t\t\t\tclass={{\n\t\t\t\t\t\tdisabled: this.state._disabled === true,\n\t\t\t\t\t\t'skip ': this.state._stealth !== false,\n\t\t\t\t\t\t'icon-only': this.state._iconOnly === true,\n\t\t\t\t\t\t'external-link': isExternal,\n\t\t\t\t\t}}\n\t\t\t\t\t{...this.state._on}\n\t\t\t\t\t// https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/blob/main/docs/rules/click-events-have-key-events.md\n\t\t\t\t\tonClick={this.onClick}\n\t\t\t\t\tonKeyPress={this.onClick}\n\t\t\t\t\t{...goToProps}\n\t\t\t\t\trole={this.state._role}\n\t\t\t\t\ttabIndex={this.state._tabIndex}\n\t\t\t\t>\n\t\t\t\t\t<kol-span-wc _icon={this._icon} _iconOnly={this._iconOnly} _label={this.state._label}>\n\t\t\t\t\t\t<slot name=\"expert\" slot=\"expert\"></slot>\n\t\t\t\t\t</kol-span-wc>\n\t\t\t\t\t{isExternal && <kol-icon class=\"external-link-icon\" _ariaLabel={this.state._targetDescription as string} _icon={'codicon codicon-link-external'} />}\n\t\t\t\t</a>\n\t\t\t\t{(this.state._iconOnly === true \|\| this.state._useCase === 'image') && (\n\t\t\t\t\t<kol-tooltip\n\t\t\t\t\t\t/\n\t\t\t\t\t\t Dieses Aria-Hidden verhindert das doppelte Vorlesen des Labels,\n\t\t\t\t\t\t * verhindert aber nicht das Aria-Labelledby vorgelesen wird.\n\t\t\t\t\t\t /\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t_align={this.state._tooltipAlign}\n\t\t\t\t\t\t_id={this.nonce}\n\t\t\t\t\t\t_label={this.state._ariaLabel \|\| this.state._label}\n\t\t\t\t\t></kol-tooltip>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/\n\t Gibt an, welche Elemente kontrolliert werden. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls)\n\t /\n\t@Prop() public _ariaControls?: string;\n\n\t/\n\t Gibt an, welchen aktuellen Auswahlstatus der Link hat. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current)\n\t /\n\t@Prop() public _ariaCurrent?: AriaCurrent;\n\n\t/\n\t Gibt an, ob durch den Link etwas aufgeklappt wurde. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded)\n\t /\n\t@Prop({ reflect: true }) public _ariaExpanded?: boolean;\n\n\t/\n\t Gibt einen beschreibenden Text des Links an. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label)\n\t /\n\t@Prop() public _ariaLabel?: string;\n\n\t/\n\t Gibt an, ob Element ausgewählt ist (role=tab). (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected)\n\t /\n\t@Prop({ reflect: true }) public _ariaSelected?: boolean;\n\n\t/\n\t Gibt an, ob der Link deaktiviert ist.\n\t \n\t @deprecated Ein Link kann nicht deaktiviert werden, nutzen Sie den Button-Link stattdessen.\n\t /\n\t@Prop({ reflect: true }) public _disabled?: boolean = false;\n\n\t/\n\t Teilt dem Browser mit, dass sich hinter dem Link eine Datei befindet. Setzt optional den Dateinamen.\n\t /\n\t@Prop() public _download?: boolean \| string = false;\n\n\t/\n\t Gibt die Ziel-Url des Links an.\n\t /\n\t@Prop() public _href!: string;\n\n\t/\n\t Iconklasse (z.B.: \"codicon codicon-home\")\n\t /\n\t@Prop() public _icon?: Stringified<KoliBriIconProp>;\n\n\t/\n\t Gibt an, ob das Icon entweder links oder rechts dargestellt werden soll.\n\t \n\t @deprecated Wird durch das neue flexibleren Icon-Typ abgedeckt.\n\t /\n\t@Prop() public _iconAlign?: Alignment;\n\n\t/\n\t Gibt an, ob nur das Icon angezeigt wird.\n\t /\n\t@Prop({ reflect: true }) public _iconOnly?: boolean = false;\n\n\t/\n\t Setzt den sichtbaren Text des Elements.\n\t /\n\t// - eslint-disable-next-line @stencil/strict-mutable\n\t@Prop({ mutable: true, reflect: false }) public _label!: string;\n\n\t/\n\t Gibt die EventCallback-Funktionen für den Link an.\n\t * @deprecated\n\t /\n\t@Prop() public _on?: LinkOnCallbacks;\n\n\t/\n\t Gibt an, welche Rolle der Schalter hat.\n\t /\n\t@Prop() public _role?: AlternativButtonLinkRole;\n\n\t/\n\t Gibt die ID eines DOM-Elements, zu dem gesprungen werden soll, aus.\n\t \n\t @deprecated Das Styling sollte stets über CSS erfolgen.\n\t /\n\t@Prop() public _selector?: string;\n\n\t/\n\t Gibt an, ob der Link nur beim Fokus sichtbar ist.\n\t \n\t @deprecated Das Styling sollte stets über CSS erfolgen.\n\t /\n\t@Prop({ reflect: true }) public _stealth?: boolean = false;\n\n\t/\n\t Gibt an, welchen Tab-Index der Button hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)\n\t /\n\t@Prop() public _tabIndex?: number;\n\n\t/\n\t Gibt an wo der Link geöffnet werden soll.\n\t /\n\t@Prop() public _target?: LinkTarget;\n\n\t/\n\t Gibt die Beschreibung an, wenn der Link in einem anderen Programm geöffnet wird.\n\t /\n\t@Prop() public _targetDescription?: string = translate('kol-open-link-in-tab');\n\n\t/\n\t Gibt an, ob der Tooltip entweder oben, rechts, unten oder links angezeigt werden soll.\n\t /\n\t@Prop() public _tooltipAlign?: Alignment = 'right';\n\n\t/\n\t Gibt den Verwendungsfall des Links an.\n\t \n\t @deprecated Das Styling sollte stets über CSS erfolgen.\n\t /\n\t@Prop() public _useCase?: LinkUseCase = 'text';\n\n\t@State() public state: LinkStates = {\n\t\t_href: 'javascript:void(0)',\n\t\t_icon: {},\n\t\t_label: '', // TODO: must removed to v2\n\t\t// _label: '…', // ⚠ required\n\t};\n\n\t@Watch('_ariaControls')\n\tpublic validateAriaControls(value?: string): void {\n\t\twatchString(this, '_ariaControls', value);\n\t}\n\n\t@Watch('_ariaCurrent')\n\tpublic validateAriaCurrent(value?: AriaCurrent): void {\n\t\tvalidateAriaCurrent(this, value);\n\t}\n\n\t@Watch('_ariaExpanded')\n\tpublic validateAriaExpanded(value?: boolean): void {\n\t\twatchBoolean(this, '_ariaExpanded', value);\n\t}\n\n\t@Watch('_ariaLabel')\n\tpublic validateAriaLabel(value?: string): void {\n\t\tvalidateAriaLabelWithLabel(this, value);\n\t}\n\n\t@Watch('_ariaSelected')\n\tpublic validateAriaSelected(value?: boolean): void {\n\t\tvalidateAriaSelected(this, value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t \n\t @deprecated\n\t /\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\twatchBoolean(this, '_disabled', value);\n\t\tif (value === true) {\n\t\t\ta11yHintDisabled();\n\t\t}\n\t}\n\n\t@Watch('_download')\n\tpublic validateDownload(value?: boolean \| string): void {\n\t\tvalidateDownload(this, value);\n\t}\n\n\t@Watch('_href')\n\tpublic validateHref(value?: string): void {\n\t\twatchString(this, '_href', value);\n\t}\n\n\t@Watch('_icon')\n\tpublic validateIcon(value?: KoliBriIconProp): void {\n\t\tvalidateIcon(this, value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t * @deprecated\n\t /\n\t@Watch('_iconAlign')\n\tpublic validateIconAlign(value?: Alignment): void {\n\t\twatchIconAlign(this, value);\n\t}\n\n\t@Watch('_iconOnly')\n\tpublic validateIconOnly(value?: boolean): void {\n\t\twatchBoolean(this, '_iconOnly', value);\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: string): void {\n\t\tvalidateLabelWithAriaLabel(this, value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t * @deprecated\n\t */\n\t@Watch('_on')\n\tpublic validateOn(value?: LinkOnCallbacks): void {\n\t\tif (\n\t\t\ttypeof value === 'object' &&\n\t\t\tvalue !== null &&\n\t\t\t// https://eslint.org/docs/rules/no-prototype-builtins\n\t\t\tObject.prototype.hasOwnProperty.call(value, 'onClick') &&\n\t\t\ttypeof value.onClick === 'function'\n\t\t) {\n\t\t\tthis.state = {\n\t\t\t\t...this.state,\n\t\t\t\t_on: value,\n\t\t\t};\n\t\t}\n\t}\n\n\t@Watch('_role')\n\tpublic validateRole(value?: AlternativButtonLinkRole): void {\n\t\twatchString(this, '_role', value);\n\t}\n\n\t@Watch('_selector')\n\tpublic validateSelector(value?: string): void {\n\t\twatchString(this, '_selector', value);\n\t}\n\n\t@Watch('_stealth')\n\tpublic validateStealth(value?: boolean): void {\n\t\tvalidateStealth(this, value);\n\t}\n\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tvalidateTabIndex(this, value);\n\t}\n\n\t@Watch('_target')\n\tpublic validateTarget(value?: LinkTarget): void {\n\t\twatchString(this, '_target', value);\n\t}\n\n\t@Watch('_targetDescription')\n\tpublic validateTargetDescription(value?: string): void {\n\t\twatchString(this, '_targetDescription', value);\n\t}\n\n\t@Watch('_tooltipAlign')\n\tpublic validateTooltipAlign(value?: Alignment): void {\n\t\twatchTooltipAlignment(this, '_tooltipAlign', value);\n\t}\n\n\t@Watch('_useCase')\n\tpublic validateUseCase(value?: LinkUseCase): void {\n\t\tif (typeof value === 'string') {\n\t\t\tthis.state = {\n\t\t\t\t...this.state,\n\t\t\t\t_useCase: value,\n\t\t\t};\n\t\t}\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAriaControls(this._ariaControls);\n\t\tthis.validateAriaCurrent(this._ariaCurrent);\n\t\tthis.validateAriaExpanded(this._ariaExpanded);\n\t\tthis.validateAriaLabel(this._ariaLabel);\n\t\tthis.validateAriaSelected(this._ariaSelected);\n\t\tthis.validateDisabled(this._disabled);\n\t\tthis.validateDownload(this._download);\n\t\tthis.validateHref(this._href);\n\t\tthis.validateIcon(this._icon);\n\t\tthis.validateIconAlign(this._iconAlign);\n\t\tthis.validateIconOnly(this._iconOnly);\n\t\tthis.validateLabel(this._label);\n\t\tthis.validateOn(this._on);\n\t\tthis.validateRole(this._role);\n\t\tthis.validateSelector(this._selector);\n\t\tthis.validateStealth(this._stealth);\n\t\tthis.validateTabIndex(this._tabIndex);\n\t\tthis.validateTarget(this._target);\n\t\tthis.validateTargetDescription(this._targetDescription);\n\t\tthis.validateTooltipAlign(this._tooltipAlign);\n\t\tthis.validateUseCase(this._useCase);\n\t}\n}\n"],"version":3}
1	+ {"file":"component8.js","mappings":"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","names":[],"sources":["./src/types/props/download.ts","./src/types/props/stealth.ts","./src/components/link/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { watchBoolean, watchString } from '../../utils/prop.validators';\n\n/* types /\n/* de\n * Teilt dem Browser mit, dass sich hinter dem Link eine Datei befindet. Setzt optional den Dateinamen.\n /\n/* en\n * Tells the browser that the link contains a file. Optionally sets the filename.\n /\nexport type PropDownload = {\n\tdownload?: boolean \| string;\n};\n\n/ validator /\nexport const validateDownload = (component: Generic.Element.Component, value?: boolean \| string): void => {\n\tif (typeof value === 'boolean') watchBoolean(component, '_download', value);\n\telse watchString(component, '_download', value);\n};\n","import { Generic } from '@a11y-ui/core';\nimport { watchBoolean } from '../../utils/prop.validators';\n\n/ types /\n/* de\n * Versteckt den Link und lässt ihn bei Fokussierung erscheinen.\n /\n/* en\n * Hides the link und makes it appear on focus.\n /\nexport type PropStealth = {\n\tstealth: boolean;\n};\n\n/ validator /\nexport const validateStealth = (component: Generic.Element.Component, value?: boolean): void => {\n\twatchBoolean(component, '_stealth', value);\n};\n","import { Component, Element, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { translate } from '../../i18n';\nimport {\n\tAlternativButtonLinkRole,\n\tLinkOnCallbacks,\n\tLinkStates,\n\tLinkTarget,\n\tLinkUseCase,\n\tOptionalLinkProps,\n\tOptionalLinkStates,\n\tRequiredLinkProps,\n\tRequiredLinkStates,\n\twatchTooltipAlignment,\n} from '../../types/button-link';\nimport { Stringified } from '../../types/common';\nimport { KoliBriIconProp } from '../../types/icon';\nimport { AriaCurrent, Align, validateAriaCurrent, validateAriaSelected, validateStealth, validateDownload } from '../../types/props';\nimport { a11yHintDisabled, devHint } from '../../utils/a11y.tipps';\nimport { nonce } from '../../utils/dev.utils';\nimport { mapBoolean2String, scrollBySelector, setEventTarget, watchBoolean, watchString } from '../../utils/prop.validators';\nimport { propagateFocus } from '../../utils/reuse';\nimport { validateIcon, watchIconAlign } from '../../types/props/icon';\nimport { validateAriaLabelWithLabel, validateLabelWithAriaLabel } from '../../types/props/label';\nimport { validateTabIndex } from '../../utils/validators/tab-index';\n\n/\n @internal\n /\n@Component({\n\ttag: 'kol-link-wc',\n\tshadow: false,\n})\nexport class KolLinkWc implements Generic.Element.ComponentApi<RequiredLinkProps, OptionalLinkProps, RequiredLinkStates, OptionalLinkStates> {\n\t@Element() private readonly host?: HTMLKolLinkWcElement;\n\tprivate readonly nonce = nonce();\n\tprivate ref?: HTMLAnchorElement;\n\n\tprivate readonly catchRef = (ref?: HTMLAnchorElement) => {\n\t\tthis.ref = ref;\n\t\tpropagateFocus(this.host, this.ref);\n\t};\n\n\tprivate readonly onClick = (event: Event) => {\n\t\tif (typeof this.state._on?.onClick === 'function') {\n\t\t\tevent.preventDefault();\n\t\t\tsetEventTarget(event, this.ref);\n\t\t\tthis.state._on?.onClick(event, this.state._href);\n\t\t}\n\t};\n\n\tprivate readonly getRenderValues = () => {\n\t\t/\n\t\t DX\n\t\t * Das möchte ich ungern für HTML machen, sondern nur für Barrierefreiheitsthemen.\n\t\t /\n\t\t// if (typeof this.state._href === 'string' && this.state._href.length > 0) {\n\t\t// console.error('Setz den URL.');\n\t\t// throw new Error('Setz den URL.');\n\t\t// }\n\n\t\t// switch (this.state._target) {\n\t\t// case '_blank':\n\t\t// case '_self':\n\t\t// break;\n\t\t// default:\n\t\t// console.error('Fehlerhaftes Target.');\n\t\t// throw new Error('Fehlerhaftes Target.');\n\t\t// }\n\n\t\t// ROBUSTHEIT durch Validierung\n\t\tlet goToProps = {};\n\t\tif (typeof this.state._selector === 'string') {\n\t\t\tgoToProps = {\n\t\t\t\trole: 'link',\n\t\t\t\ttabIndex: 0,\n\t\t\t\tonClick: () => {\n\t\t\t\t\tscrollBySelector(this.state._selector as string);\n\t\t\t\t},\n\t\t\t\tonKeyPress: () => {\n\t\t\t\t\tscrollBySelector(this.state._selector as string);\n\t\t\t\t},\n\t\t\t};\n\t\t}\n\n\t\tconst isExternal = typeof this.state._target === 'string' && this.state._target !== '_self';\n\n\t\tconst tagAttrs = {\n\t\t\thref: typeof this.state._href === 'string' && this.state._href.length > 0 ? this.state._href : 'javascript:void(0)',\n\t\t\ttarget: typeof this.state._target === 'string' && this.state._target.length > 0 ? this.state._target : undefined,\n\t\t\trel: isExternal ? 'noopener' : undefined,\n\t\t};\n\n\t\tif (\n\t\t\t(this.state._useCase === 'image' \|\| this.state._iconOnly === true) &&\n\t\t\t(typeof this.state._ariaLabel !== 'string' \|\| this.state._ariaLabel.length === 0)\n\t\t) {\n\t\t\tdevHint(`[KolLink] Es muss ein Aria-Label gesetzt werden, wenn eine Grafik verlinkt oder der Icon-Only-Modus verwendet wird.`);\n\t\t}\n\t\treturn { isExternal, tagAttrs, goToProps };\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { isExternal, tagAttrs, goToProps } = this.getRenderValues();\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<a\n\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t{...tagAttrs}\n\t\t\t\t\taria-controls={this.state._ariaControls}\n\t\t\t\t\taria-current={this.state._ariaCurrent}\n\t\t\t\t\taria-expanded={mapBoolean2String(this.state._ariaExpanded)}\n\t\t\t\t\taria-labelledby={this.state._useCase === 'image' \|\| this.state._iconOnly === true ? this.nonce : undefined}\n\t\t\t\t\taria-selected={mapBoolean2String(this.state._ariaSelected)}\n\t\t\t\t\tclass={{\n\t\t\t\t\t\tdisabled: this.state._disabled === true,\n\t\t\t\t\t\t'skip ': this.state._stealth !== false,\n\t\t\t\t\t\t'icon-only': this.state._iconOnly === true,\n\t\t\t\t\t\t'external-link': isExternal,\n\t\t\t\t\t}}\n\t\t\t\t\t{...this.state._on}\n\t\t\t\t\t// https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/blob/main/docs/rules/click-events-have-key-events.md\n\t\t\t\t\tonClick={this.onClick}\n\t\t\t\t\tonKeyPress={this.onClick}\n\t\t\t\t\t{...goToProps}\n\t\t\t\t\trole={this.state._role}\n\t\t\t\t\ttabIndex={this.state._tabIndex}\n\t\t\t\t>\n\t\t\t\t\t<kol-span-wc _icon={this._icon} _iconOnly={this._iconOnly} _label={this.state._label}>\n\t\t\t\t\t\t<slot name=\"expert\" slot=\"expert\"></slot>\n\t\t\t\t\t</kol-span-wc>\n\t\t\t\t\t{isExternal && <kol-icon class=\"external-link-icon\" _ariaLabel={this.state._targetDescription as string} _icon={'codicon codicon-link-external'} />}\n\t\t\t\t</a>\n\t\t\t\t{(this.state._iconOnly === true \|\| this.state._useCase === 'image') && (\n\t\t\t\t\t<kol-tooltip\n\t\t\t\t\t\t/\n\t\t\t\t\t\t Dieses Aria-Hidden verhindert das doppelte Vorlesen des Labels,\n\t\t\t\t\t\t * verhindert aber nicht das Aria-Labelledby vorgelesen wird.\n\t\t\t\t\t\t /\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t_align={this.state._tooltipAlign}\n\t\t\t\t\t\t_id={this.nonce}\n\t\t\t\t\t\t_label={this.state._ariaLabel \|\| this.state._label}\n\t\t\t\t\t></kol-tooltip>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/\n\t Gibt an, welche Elemente kontrolliert werden. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls)\n\t /\n\t@Prop() public _ariaControls?: string;\n\n\t/\n\t Gibt an, welchen aktuellen Auswahlstatus das interaktive Element der Komponente hat. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current)\n\t /\n\t@Prop() public _ariaCurrent?: AriaCurrent;\n\n\t/\n\t Gibt an, ob durch das interaktive Element in der Komponente etwas aufgeklappt wurde. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded)\n\t /\n\t@Prop({ reflect: true }) public _ariaExpanded?: boolean;\n\n\t/\n\t Setzt die sichtbare oder semantische Beschriftung der Komponente (z.B. Aria-Label, Label, Headline, Caption, Summary usw.).\n\t /\n\t@Prop() public _ariaLabel?: string;\n\n\t/\n\t Gibt an, ob interaktive Element in der Komponente ausgewählt ist (z.B. role=tab). (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected)\n\t /\n\t@Prop({ reflect: true }) public _ariaSelected?: boolean;\n\n\t/\n\t Deaktiviert das interaktive Element in der Komponente und erlaubt keine Interaktion mehr damit.\n\t \n\t @deprecated Ein Link kann nicht deaktiviert werden, nutzen Sie den Button-Link stattdessen.\n\t /\n\t@Prop({ reflect: true }) public _disabled?: boolean = false;\n\n\t/\n\t Teilt dem Browser mit, dass sich hinter dem Link eine Datei befindet. Setzt optional den Dateinamen.\n\t /\n\t@Prop() public _download?: boolean \| string = false;\n\n\t/\n\t Gibt die Ziel-Url des Links an.\n\t /\n\t@Prop() public _href!: string;\n\n\t/\n\t Setzt die Iconklasse (z.B.: `_icon=\"codicon codicon-home`).\n\t /\n\t@Prop() public _icon?: Stringified<KoliBriIconProp>;\n\n\t/\n\t Deprecated: Gibt an, ob das Icon links oder rechts von der Beschriftung angezeigt werden soll.\n\t \n\t @deprecated Wird durch das neue flexibleren Icon-Typ abgedeckt.\n\t /\n\t@Prop() public _iconAlign?: Align;\n\n\t/\n\t Blendet die Beschriftung (Label) aus und zeigt sie stattdessen mittels eines Tooltips an.\n\t /\n\t@Prop({ reflect: true }) public _iconOnly?: boolean = false;\n\n\t/\n\t Setzt die sichtbare oder semantische Beschriftung der Komponente (z.B. Aria-Label, Label, Headline, Caption, Summary usw.).\n\t /\n\t// - eslint-disable-next-line @stencil/strict-mutable\n\t@Prop({ mutable: true, reflect: false }) public _label!: string;\n\n\t/\n\t Gibt die EventCallback-Funktionen für den Link an.\n\t * @deprecated\n\t /\n\t@Prop() public _on?: LinkOnCallbacks;\n\n\t/\n\t Gibt die Rolle des primären Elements in der Komponente an.\n\t /\n\t@Prop() public _role?: AlternativButtonLinkRole;\n\n\t/\n\t Gibt die ID eines DOM-Elements, zu dem gesprungen werden soll, aus.\n\t \n\t @deprecated Das Styling sollte stets über CSS erfolgen.\n\t /\n\t@Prop() public _selector?: string;\n\n\t/\n\t Gibt an, ob der Link nur beim Fokus sichtbar ist.\n\t \n\t @deprecated Das Styling sollte stets über CSS erfolgen.\n\t /\n\t@Prop({ reflect: true }) public _stealth?: boolean = false;\n\n\t/\n\t Gibt an, welchen Tab-Index das primäre Element in der Komponente hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)\n\t /\n\t@Prop() public _tabIndex?: number;\n\n\t/\n\t Gibt an wo der Link geöffnet werden soll.\n\t /\n\t@Prop() public _target?: LinkTarget;\n\n\t/\n\t Gibt die Beschreibung an, wenn der Link in einem anderen Programm geöffnet wird.\n\t /\n\t@Prop() public _targetDescription?: string = translate('kol-open-link-in-tab');\n\n\t/\n\t Gibt an, ob der Tooltip bevorzugt entweder oben, rechts, unten oder links angezeigt werden soll.\n\t /\n\t@Prop() public _tooltipAlign?: Align = 'right';\n\n\t/\n\t Gibt den Verwendungsfall des Links an.\n\t \n\t @deprecated Das Styling sollte stets über CSS erfolgen.\n\t /\n\t@Prop() public _useCase?: LinkUseCase = 'text';\n\n\t@State() public state: LinkStates = {\n\t\t_href: 'javascript:void(0)',\n\t\t_icon: {},\n\t\t_label: '', // TODO: must removed to v2\n\t\t// _label: '…', // ⚠ required\n\t};\n\n\t@Watch('_ariaControls')\n\tpublic validateAriaControls(value?: string): void {\n\t\twatchString(this, '_ariaControls', value);\n\t}\n\n\t@Watch('_ariaCurrent')\n\tpublic validateAriaCurrent(value?: AriaCurrent): void {\n\t\tvalidateAriaCurrent(this, value);\n\t}\n\n\t@Watch('_ariaExpanded')\n\tpublic validateAriaExpanded(value?: boolean): void {\n\t\twatchBoolean(this, '_ariaExpanded', value);\n\t}\n\n\t@Watch('_ariaLabel')\n\tpublic validateAriaLabel(value?: string): void {\n\t\tvalidateAriaLabelWithLabel(this, value);\n\t}\n\n\t@Watch('_ariaSelected')\n\tpublic validateAriaSelected(value?: boolean): void {\n\t\tvalidateAriaSelected(this, value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t \n\t @deprecated\n\t /\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\twatchBoolean(this, '_disabled', value);\n\t\tif (value === true) {\n\t\t\ta11yHintDisabled();\n\t\t}\n\t}\n\n\t@Watch('_download')\n\tpublic validateDownload(value?: boolean \| string): void {\n\t\tvalidateDownload(this, value);\n\t}\n\n\t@Watch('_href')\n\tpublic validateHref(value?: string): void {\n\t\twatchString(this, '_href', value);\n\t}\n\n\t@Watch('_icon')\n\tpublic validateIcon(value?: KoliBriIconProp): void {\n\t\tvalidateIcon(this, value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t * @deprecated\n\t /\n\t@Watch('_iconAlign')\n\tpublic validateIconAlign(value?: Align): void {\n\t\twatchIconAlign(this, value);\n\t}\n\n\t@Watch('_iconOnly')\n\tpublic validateIconOnly(value?: boolean): void {\n\t\twatchBoolean(this, '_iconOnly', value);\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: string): void {\n\t\tvalidateLabelWithAriaLabel(this, value);\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t * @deprecated\n\t */\n\t@Watch('_on')\n\tpublic validateOn(value?: LinkOnCallbacks): void {\n\t\tif (\n\t\t\ttypeof value === 'object' &&\n\t\t\tvalue !== null &&\n\t\t\t// https://eslint.org/docs/rules/no-prototype-builtins\n\t\t\tObject.prototype.hasOwnProperty.call(value, 'onClick') &&\n\t\t\ttypeof value.onClick === 'function'\n\t\t) {\n\t\t\tthis.state = {\n\t\t\t\t...this.state,\n\t\t\t\t_on: value,\n\t\t\t};\n\t\t}\n\t}\n\n\t@Watch('_role')\n\tpublic validateRole(value?: AlternativButtonLinkRole): void {\n\t\twatchString(this, '_role', value);\n\t}\n\n\t@Watch('_selector')\n\tpublic validateSelector(value?: string): void {\n\t\twatchString(this, '_selector', value);\n\t}\n\n\t@Watch('_stealth')\n\tpublic validateStealth(value?: boolean): void {\n\t\tvalidateStealth(this, value);\n\t}\n\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tvalidateTabIndex(this, value);\n\t}\n\n\t@Watch('_target')\n\tpublic validateTarget(value?: LinkTarget): void {\n\t\twatchString(this, '_target', value);\n\t}\n\n\t@Watch('_targetDescription')\n\tpublic validateTargetDescription(value?: string): void {\n\t\twatchString(this, '_targetDescription', value);\n\t}\n\n\t@Watch('_tooltipAlign')\n\tpublic validateTooltipAlign(value?: Align): void {\n\t\twatchTooltipAlignment(this, '_tooltipAlign', value);\n\t}\n\n\t@Watch('_useCase')\n\tpublic validateUseCase(value?: LinkUseCase): void {\n\t\tif (typeof value === 'string') {\n\t\t\tthis.state = {\n\t\t\t\t...this.state,\n\t\t\t\t_useCase: value,\n\t\t\t};\n\t\t}\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAriaControls(this._ariaControls);\n\t\tthis.validateAriaCurrent(this._ariaCurrent);\n\t\tthis.validateAriaExpanded(this._ariaExpanded);\n\t\tthis.validateAriaLabel(this._ariaLabel);\n\t\tthis.validateAriaSelected(this._ariaSelected);\n\t\tthis.validateDisabled(this._disabled);\n\t\tthis.validateDownload(this._download);\n\t\tthis.validateHref(this._href);\n\t\tthis.validateIcon(this._icon);\n\t\tthis.validateIconAlign(this._iconAlign);\n\t\tthis.validateIconOnly(this._iconOnly);\n\t\tthis.validateLabel(this._label);\n\t\tthis.validateOn(this._on);\n\t\tthis.validateRole(this._role);\n\t\tthis.validateSelector(this._selector);\n\t\tthis.validateStealth(this._stealth);\n\t\tthis.validateTabIndex(this._tabIndex);\n\t\tthis.validateTarget(this._target);\n\t\tthis.validateTargetDescription(this._targetDescription);\n\t\tthis.validateTooltipAlign(this._tooltipAlign);\n\t\tthis.validateUseCase(this._useCase);\n\t}\n}\n"],"version":3}

package/dist/components/controller.js CHANGED Viewed

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{l as watchBoolean,v as getExperimalMode,w as watchString,B as a11yHintDisabled,d as devHint,q as setState,o as objectObjectHandler,e as parseJson}from"./prop.validators.js";import{v as validateTabIndex}from"./tab-index.js";import{c as validateLabel}from"./component3.js";const getRenderStates=t=>{const e="string"==typeof t._error&&t._error.length>0&&!0===t._touched,n="string"==typeof t._hint&&t._hint.length>0,o=[];return!0===e&&o.push(`${t._id}-error`),!0===n&&o.push(`${t._id}-hint`),{hasError:e,hasHint:n,ariaDescribedBy:o}},EXPERIMENTAL_MODE=getExperimalMode();class ControlledInputController{constructor(t,e,n){var o,i,a,s,h;if(this.syncFormAssociatedName=()=>{var t,e,n;EXPERIMENTAL_MODE&&(null===(t=this.formAssociated)||void 0===t||t.setAttribute("id",this.component.state._id),null===(e=this.formAssociated)||void 0===e||e.setAttribute("name",this.component.state._name),null===(n=this.formAssociated)||void 0===n||n.setAttribute("value",this.component.state._value))},this.setFormAssociatedValue=(t=null)=>{var e;EXPERIMENTAL_MODE&&(null===(e=this.formAssociated)||void 0===e||e.setAttribute("value",t))},this.component=t,this.name=e,this.host=n,EXPERIMENTAL_MODE){this.formAssociated=document.createElement("input"),this.formAssociated.setAttribute("type","hidden");const t=(null===(o=this.host)||void 0===o?void 0:o.children)||[];for(let e=0;e<t.length;e++)"INPUT"===(null===(i=this.host)||void 0===i?void 0:i.children[e].tagName)&&(null===(a=this.host)||void 0===a||a.removeChild(null===(s=this.host)||void 0===s?void 0:s.children[e]));null===(h=this.host)||void 0===h||h.appendChild(this.formAssociated)}}validateAlert(t){watchBoolean(this.component,"_alert",t)}validateTouched(t){watchBoolean(this.component,"_touched",t)}componentWillLoad(){this.validateAlert(this.component._alert),this.validateTouched(this.component._touched)}}class InputController extends ControlledInputController{constructor(t,e,n){super(t,e,n),this.hideLabel=!1,this.valueChangeListeners=[],this.onFacade={onBlur:this.onBlur.bind(this),onChange:this.onChange.bind(this),onClick:this.onClick.bind(this),onFocus:this.onFocus.bind(this)},this.component=t}validateAccessKey(t){watchString(this.component,"_accessKey",t)}validateAdjustHeight(t){watchBoolean(this.component,"_adjustHeight",t)}validateDisabled(t){watchBoolean(this.component,"_disabled",t),!0===t&&a11yHintDisabled()}validateError(t){watchString(this.component,"_error",t)}validateHideLabel(t){watchBoolean(this.component,"_hideLabel",t)}validateHint(t){watchString(this.component,"_hint",t)}validateId(t){watchString(this.component,"_id",t,{hooks:{afterPatch:this.syncFormAssociatedName},minLength:1}),""!==t&&void 0!==t||devHint("Eine eindeutige ID an den Eingabefeldern ist nicht zwingend erforderlich, könnte aber für die E2E-Tests relevant sein.")}validateLabel(t){validateLabel(this.component,t)}validateName(t){watchString(this.component,"_name",t,{hooks:{afterPatch:this.syncFormAssociatedName}}),void 0===t&&devHint("Ein Name an den Eingabefeldern ist nicht zwingend erforderlich, kann aber für die Autocomplete-Funktion und für das statische Versenden des Eingabefeldes relevant sein.")}validateOn(t){"object"==typeof t&&setState(this.component,"_on",t)}validateSmartButton(t){objectObjectHandler(t,(()=>{try{t=parseJson(t)}catch(t){}setState(this.component,"_smartButton",t)}))}validateTabIndex(t){validateTabIndex(this.component,t)}componentWillLoad(){super.componentWillLoad(),this.validateAccessKey(this.component._accessKey),this.validateAdjustHeight(this.component._adjustHeight),this.validateError(this.component._error),this.validateDisabled(this.component._disabled),this.validateHideLabel(this.component._hideLabel),this.validateHint(this.component._hint),this.validateId(this.component._id),this.validateLabel(this.component._label),this.validateName(this.component._name),this.validateSmartButton(this.component._smartButton),this.validateOn(this.component._on),this.validateTabIndex(this.component._tabIndex),this.syncFormAssociatedName()}onBlur(t){var e;this.component._alert=!0,this.component._touched=!0,"function"==typeof(null===(e=this.component._on)||void 0===e?void 0:e.onBlur)&&this.component._on.onBlur(t)}onChange(t){var e;const n=t.target.value;this.setFormAssociatedValue(n),this.valueChangeListeners.forEach((t=>t(n))),"function"==typeof(null===(e=this.component._on)||void 0===e?void 0:e.onChange)&&this.component._on.onChange(t,n)}onClick(t){var e;"function"==typeof(null===(e=this.component._on)||void 0===e?void 0:e.onClick)&&this.component._on.onClick(t)}onFocus(t){var e;this.component._alert=!0,"function"==typeof(null===(e=this.component._on)||void 0===e?void 0:e.onFocus)&&this.component._on.onFocus(t)}setValue(t,e){var n;this.setFormAssociatedValue(e),"function"==typeof(null===(n=this.component._on)||void 0===n?void 0:n.onChange)&&this.component._on.onChange(t,e)}addValueChangeListener(t){this.valueChangeListeners.push(t)}}export{InputController as I,getRenderStates as g};
+import{l as watchBoolean,v as getExperimalMode,w as watchString,B as a11yHintDisabled,d as devHint,q as setState,o as objectObjectHandler,e as parseJson}from"./prop.validators.js";import{v as validateTabIndex}from"./tab-index.js";import{c as validateLabel}from"./component3.js";const getRenderStates=t=>{const e="string"==typeof t._error&&t._error.length>0&&!0===t._touched,n="string"==typeof t._hint&&t._hint.length>0,o=[];return!0===e&&o.push(`${t._id}-error`),!0===n&&o.push(`${t._id}-hint`),{hasError:e,hasHint:n,ariaDescribedBy:o}},EXPERIMENTAL_MODE=getExperimalMode();function syncElementAttribute(t,e,n){EXPERIMENTAL_MODE&&("boolean"==typeof n||"number"==typeof n||"string"==typeof n?null==e||e.setAttribute(t,`${n}`):null==e||e.removeAttribute(t))}class ControlledInputController{constructor(t,e,n){var o,i,s,a,h;if(this.syncFormAssociatedName=()=>{syncElementAttribute("id",this.formAssociated,this.component.state._id),syncElementAttribute("name",this.formAssociated,this.component.state._name),syncElementAttribute("value",this.formAssociated,this.component.state._value)},this.setFormAssociatedValue=(t=null)=>{syncElementAttribute("value",this.formAssociated,t)},this.component=t,this.name=e,this.host=n,EXPERIMENTAL_MODE){this.formAssociated=document.createElement("input"),this.formAssociated.setAttribute("type","hidden");const t=(null===(o=this.host)||void 0===o?void 0:o.children)||[];for(let e=0;e<t.length;e++)"INPUT"===(null===(i=this.host)||void 0===i?void 0:i.children[e].tagName)&&(null===(s=this.host)||void 0===s||s.removeChild(null===(a=this.host)||void 0===a?void 0:a.children[e]));null===(h=this.host)||void 0===h||h.appendChild(this.formAssociated)}}validateAlert(t){watchBoolean(this.component,"_alert",t)}validateTouched(t){watchBoolean(this.component,"_touched",t)}componentWillLoad(){this.validateAlert(this.component._alert),this.validateTouched(this.component._touched)}}class InputController extends ControlledInputController{constructor(t,e,n){super(t,e,n),this.hideLabel=!1,this.valueChangeListeners=[],this.onFacade={onBlur:this.onBlur.bind(this),onChange:this.onChange.bind(this),onClick:this.onClick.bind(this),onFocus:this.onFocus.bind(this)},this.component=t}validateAccessKey(t){watchString(this.component,"_accessKey",t)}validateAdjustHeight(t){watchBoolean(this.component,"_adjustHeight",t)}validateDisabled(t){watchBoolean(this.component,"_disabled",t),!0===t&&a11yHintDisabled()}validateError(t){watchString(this.component,"_error",t)}validateHideLabel(t){watchBoolean(this.component,"_hideLabel",t)}validateHint(t){watchString(this.component,"_hint",t)}validateId(t){watchString(this.component,"_id",t,{hooks:{afterPatch:this.syncFormAssociatedName},minLength:1}),""!==t&&void 0!==t||devHint("Eine eindeutige ID an den Eingabefeldern ist nicht zwingend erforderlich, könnte aber für die E2E-Tests relevant sein.")}validateLabel(t){validateLabel(this.component,t)}validateName(t){watchString(this.component,"_name",t,{hooks:{afterPatch:this.syncFormAssociatedName}}),void 0===t&&devHint("Ein Name an den Eingabefeldern ist nicht zwingend erforderlich, kann aber für die Autocomplete-Funktion und für das statische Versenden des Eingabefeldes relevant sein.")}validateOn(t){"object"==typeof t&&setState(this.component,"_on",t)}validateSmartButton(t){objectObjectHandler(t,(()=>{try{t=parseJson(t)}catch(t){}setState(this.component,"_smartButton",t)}))}validateTabIndex(t){validateTabIndex(this.component,t)}componentWillLoad(){super.componentWillLoad(),this.validateAccessKey(this.component._accessKey),this.validateAdjustHeight(this.component._adjustHeight),this.validateError(this.component._error),this.validateDisabled(this.component._disabled),this.validateHideLabel(this.component._hideLabel),this.validateHint(this.component._hint),this.validateId(this.component._id),this.validateLabel(this.component._label),this.validateName(this.component._name),this.validateSmartButton(this.component._smartButton),this.validateOn(this.component._on),this.validateTabIndex(this.component._tabIndex),this.syncFormAssociatedName()}onBlur(t){var e;this.component._alert=!0,this.component._touched=!0,"function"==typeof(null===(e=this.component._on)||void 0===e?void 0:e.onBlur)&&this.component._on.onBlur(t)}onChange(t){var e;const n=t.target.value;this.setFormAssociatedValue(n),this.valueChangeListeners.forEach((t=>t(n))),"function"==typeof(null===(e=this.component._on)||void 0===e?void 0:e.onChange)&&this.component._on.onChange(t,n)}onClick(t){var e;"function"==typeof(null===(e=this.component._on)||void 0===e?void 0:e.onClick)&&this.component._on.onClick(t)}onFocus(t){var e;this.component._alert=!0,"function"==typeof(null===(e=this.component._on)||void 0===e?void 0:e.onFocus)&&this.component._on.onFocus(t)}setValue(t,e){var n;this.setFormAssociatedValue(e),"function"==typeof(null===(n=this.component._on)||void 0===n?void 0:n.onChange)&&this.component._on.onChange(t,e)}addValueChangeListener(t){this.valueChangeListeners.push(t)}}export{InputController as I,getRenderStates as g};

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

	@@ -1 +1 @@
1	- {"file":"controller.js","mappings":"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","names":[],"sources":["./src/components/input/controller.ts","./src/components/input-adapter-leanup/controller.ts","./src/components/@deprecated/input/controller.ts"],"sourcesContent":["/*\n Berechnet in Abhängigkeit des Component-State, wie die\n * aria-describedby-Attributs gesetzt werden sollen.\n \n @param state State der Component\n * @returns Render-States\n /\nexport const getRenderStates = (state: {\n\t_error?: string;\n\t_hint?: string;\n\t_id: string;\n\t_touched?: boolean;\n}): {\n\thasError: boolean;\n\thasHint: boolean;\n\tariaDescribedBy: string[];\n} => {\n\tconst hasError = typeof state._error === 'string' && state._error.length > 0 && state._touched === true;\n\tconst hasHint = typeof state._hint === 'string' && state._hint.length > 0;\n\n\tconst ariaDescribedBy: string[] = [];\n\tif (hasError === true) {\n\t\tariaDescribedBy.push(`${state._id}-error`);\n\t}\n\tif (hasHint === true) {\n\t\tariaDescribedBy.push(`${state._id}-hint`);\n\t}\n\treturn { hasError, hasHint, ariaDescribedBy };\n};\n","import { Generic } from '@a11y-ui/core';\nimport { getExperimalMode } from '../../utils/dev.utils';\nimport { watchBoolean } from '../../utils/prop.validators';\nimport { Props, Watches } from './types';\n\nconst EXPERIMENTAL_MODE = getExperimalMode();\n\nexport class ControlledInputController implements Watches {\n\tprotected readonly component: Generic.Element.Component & Props;\n\tprotected readonly name: string;\n\tprotected readonly host?: HTMLElement;\n\n\tpublic readonly formAssociated?: HTMLInputElement;\n\n\tpublic constructor(component: Generic.Element.Component & Props, name: string, host?: HTMLElement) {\n\t\tthis.component = component;\n\t\tthis.name = name;\n\t\tthis.host = host;\n\t\tif (EXPERIMENTAL_MODE) {\n\t\t\tthis.formAssociated = document.createElement('input');\n\t\t\tthis.formAssociated.setAttribute('type', 'hidden');\n\t\t\tconst children = this.host?.children \|\| [];\n\t\t\tfor (let i = 0; i < children.length; i++) {\n\t\t\t\tif (this.host?.children[i].tagName === 'INPUT') {\n\t\t\t\t\tthis.host?.removeChild(this.host?.children[i]);\n\t\t\t\t}\n\t\t\t}\n\t\t\tthis.host?.appendChild(this.formAssociated);\n\t\t}\n\t}\n\n\t/\n\t We try to support native form-associated custom elements.\n\t \n\t @see https://github.com/public-ui/kolibri/discussions/2821\n\t /\n\tprotected readonly syncFormAssociatedName = () => {\n\t\tif (EXPERIMENTAL_MODE) {\n\t\t\tthis.formAssociated?.setAttribute('id', this.component.state._id as string);\n\t\t\tthis.formAssociated?.setAttribute('name', this.component.state._name as string);\n\t\t\tthis.formAssociated?.setAttribute('value', this.component.state._value as string);\n\t\t}\n\t};\n\n\tpublic readonly setFormAssociatedValue = (value: string \| null = null) => {\n\t\tif (EXPERIMENTAL_MODE) {\n\t\t\tthis.formAssociated?.setAttribute('value', value as string);\n\t\t}\n\t};\n\n\tpublic validateAlert(value?: boolean): void {\n\t\twatchBoolean(this.component, '_alert', value);\n\t}\n\n\tpublic validateTouched(value?: boolean): void {\n\t\twatchBoolean(this.component, '_touched', value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAlert(this.component._alert);\n\t\tthis.validateTouched(this.component._touched);\n\t}\n}\n","import { Generic } from '@a11y-ui/core';\nimport { ButtonProps } from '../../../types/button-link';\nimport { InputTypeOnDefault } from '../../../types/input/types';\nimport { a11yHintDisabled, devHint } from '../../../utils/a11y.tipps';\nimport { objectObjectHandler, parseJson, setState, watchBoolean, watchString } from '../../../utils/prop.validators';\nimport { validateTabIndex } from '../../../utils/validators/tab-index';\nimport { ControlledInputController } from '../../input-adapter-leanup/controller';\nimport { Props as AdapterProps } from '../../input-adapter-leanup/types';\nimport { Props, Watches } from './types';\nimport { validateLabel } from '../../../types/props';\n\ntype ValueChangeListener = (value: string) => void;\n\nexport class InputController extends ControlledInputController implements Watches {\n\tprotected readonly component: Generic.Element.Component & Props & AdapterProps;\n\n\tpublic hideLabel = false;\n\n\tprivate readonly valueChangeListeners: ValueChangeListener[] = [];\n\n\tpublic constructor(component: Generic.Element.Component & Props, name: string, host?: HTMLElement) {\n\t\tsuper(component, name, host);\n\t\tthis.component = component;\n\t}\n\n\tpublic validateAccessKey(value?: string): void {\n\t\twatchString(this.component, '_accessKey', value);\n\t}\n\n\tpublic validateAdjustHeight(value?: boolean): void {\n\t\twatchBoolean(this.component, '_adjustHeight', value);\n\t}\n\n\tpublic validateDisabled(value?: boolean): void {\n\t\twatchBoolean(this.component, '_disabled', value);\n\t\tif (value === true) {\n\t\t\ta11yHintDisabled();\n\t\t}\n\t}\n\n\tpublic validateError(value?: string): void {\n\t\twatchString(this.component, '_error', value);\n\t}\n\n\tpublic validateHideLabel(value?: boolean): void {\n\t\twatchBoolean(this.component, '_hideLabel', value);\n\t}\n\n\tpublic validateHint(value?: string): void {\n\t\twatchString(this.component, '_hint', value);\n\t}\n\n\tpublic validateId(value?: string): void {\n\t\twatchString(this.component, '_id', value, {\n\t\t\thooks: {\n\t\t\t\tafterPatch: this.syncFormAssociatedName,\n\t\t\t},\n\t\t\tminLength: 1,\n\t\t});\n\t\tif (value === '' \|\| typeof value === 'undefined') {\n\t\t\tdevHint(`Eine eindeutige ID an den Eingabefeldern ist nicht zwingend erforderlich, könnte aber für die E2E-Tests relevant sein.`);\n\t\t}\n\t}\n\n\tpublic validateLabel(value?: string): void {\n\t\tvalidateLabel(this.component, value);\n\t}\n\n\tpublic validateName(value?: string): void {\n\t\twatchString(this.component, '_name', value, {\n\t\t\thooks: {\n\t\t\t\tafterPatch: this.syncFormAssociatedName,\n\t\t\t},\n\t\t});\n\t\tif (typeof value === 'undefined') {\n\t\t\tdevHint(\n\t\t\t\t`Ein Name an den Eingabefeldern ist nicht zwingend erforderlich, kann aber für die Autocomplete-Funktion und für das statische Versenden des Eingabefeldes relevant sein.`\n\t\t\t);\n\t\t}\n\t}\n\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tif (typeof value === 'object') {\n\t\t\tsetState(this.component, '_on', value);\n\t\t}\n\t}\n\n\tpublic validateSmartButton(value?: ButtonProps \| string): void {\n\t\tobjectObjectHandler(value, () => {\n\t\t\ttry {\n\t\t\t\tvalue = parseJson<ButtonProps>(value as string);\n\t\t\t\t// eslint-disable-next-line no-empty\n\t\t\t} catch (e) {\n\t\t\t\t// value behält den ursprünglichen Wert\n\t\t\t}\n\t\t\tsetState(this.component, '_smartButton', value);\n\t\t});\n\t}\n\n\tpublic validateTabIndex(value?: number): void {\n\t\tvalidateTabIndex(this.component, value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tsuper.componentWillLoad();\n\t\tthis.validateAccessKey(this.component._accessKey);\n\t\tthis.validateAdjustHeight(this.component._adjustHeight);\n\t\tthis.validateError(this.component._error);\n\t\tthis.validateDisabled(this.component._disabled);\n\t\tthis.validateHideLabel(this.component._hideLabel);\n\t\tthis.validateHint(this.component._hint);\n\t\tthis.validateId(this.component._id);\n\t\tthis.validateLabel(this.component._label);\n\t\tthis.validateName(this.component._name);\n\t\tthis.validateSmartButton(this.component._smartButton);\n\t\tthis.validateOn(this.component._on);\n\t\tthis.validateTabIndex(this.component._tabIndex);\n\t\tthis.syncFormAssociatedName();\n\t}\n\n\tprotected onBlur(event: Event): void {\n\t\tthis.component._alert = true;\n\t\tthis.component._touched = true;\n\t\tif (typeof this.component._on?.onBlur === 'function') {\n\t\t\tthis.component._on.onBlur(event);\n\t\t}\n\t}\n\n\tprotected onChange(event: Event): void {\n\t\tconst value = (event.target as HTMLInputElement).value;\n\t\tthis.setFormAssociatedValue(value);\n\t\tthis.valueChangeListeners.forEach((listener) => listener(value));\n\t\tif (typeof this.component._on?.onChange === 'function') {\n\t\t\t/\n\t\t\t TODO\n\t\t\t * Value-Handling muss für InputDate und InputNumber optimiert werden\n\t\t\t * - value\n\t\t\t * - valueAsNumber\n\t\t\t * - valueAsDate\n\t\t\t /\n\t\t\tthis.component._on.onChange(event, value);\n\t\t}\n\t}\n\n\tprotected onClick(event: Event): void {\n\t\tif (typeof this.component._on?.onClick === 'function') {\n\t\t\tthis.component._on.onClick(event);\n\t\t}\n\t}\n\n\tprotected onFocus(event: Event): void {\n\t\tthis.component._alert = true;\n\t\tif (typeof this.component._on?.onFocus === 'function') {\n\t\t\tthis.component._on.onFocus(event);\n\t\t}\n\t}\n\n\tpublic setValue(event: Event, value: string \| number \| boolean): void {\n\t\tthis.setFormAssociatedValue(value as string);\n\t\tif (typeof this.component._on?.onChange === 'function') {\n\t\t\tthis.component._on.onChange(event, value);\n\t\t}\n\t}\n\n\tpublic addValueChangeListener(listener: ValueChangeListener) {\n\t\tthis.valueChangeListeners.push(listener);\n\t}\n\n\t/\n\t Hinweis: In der Subklasse 'InputPasswordController'\n\t * werden die Methoden onBlur und onFocus\n\t * überschrieben.\n\t * Es werden somit zunächst die Methoden der\n\t * Subklasse ausgeführt und danach die der\n\t * Oberklassen.\n\t */\n\tpublic readonly onFacade = {\n\t\tonBlur: this.onBlur.bind(this),\n\t\tonChange: this.onChange.bind(this),\n\t\tonClick: this.onClick.bind(this),\n\t\tonFocus: this.onFocus.bind(this),\n\t};\n}\n"],"version":3}
1	+ {"file":"controller.js","mappings":"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","names":[],"sources":["./src/components/input/controller.ts","./src/components/input-adapter-leanup/controller.ts","./src/components/@deprecated/input/controller.ts"],"sourcesContent":["/*\n Berechnet in Abhängigkeit des Component-State, wie die\n * aria-describedby-Attributs gesetzt werden sollen.\n \n @param state State der Component\n * @returns Render-States\n /\nexport const getRenderStates = (state: {\n\t_error?: string;\n\t_hint?: string;\n\t_id: string;\n\t_touched?: boolean;\n}): {\n\thasError: boolean;\n\thasHint: boolean;\n\tariaDescribedBy: string[];\n} => {\n\tconst hasError = typeof state._error === 'string' && state._error.length > 0 && state._touched === true;\n\tconst hasHint = typeof state._hint === 'string' && state._hint.length > 0;\n\n\tconst ariaDescribedBy: string[] = [];\n\tif (hasError === true) {\n\t\tariaDescribedBy.push(`${state._id}-error`);\n\t}\n\tif (hasHint === true) {\n\t\tariaDescribedBy.push(`${state._id}-hint`);\n\t}\n\treturn { hasError, hasHint, ariaDescribedBy };\n};\n","import { Generic } from '@a11y-ui/core';\nimport { getExperimalMode } from '../../utils/dev.utils';\nimport { watchBoolean } from '../../utils/prop.validators';\nimport { Props, Watches } from './types';\n\nconst EXPERIMENTAL_MODE = getExperimalMode();\n\nfunction syncElementAttribute(qualifiedName: string, element?: HTMLElement, value?: string \| number \| boolean) {\n\tif (EXPERIMENTAL_MODE) {\n\t\tif (typeof value === 'boolean' \|\| typeof value === 'number' \|\| typeof value === 'string') {\n\t\t\telement?.setAttribute(qualifiedName, `${value as string}`);\n\t\t} else {\n\t\t\telement?.removeAttribute(qualifiedName);\n\t\t}\n\t}\n}\n\nexport class ControlledInputController implements Watches {\n\tprotected readonly component: Generic.Element.Component & Props;\n\tprotected readonly name: string;\n\tprotected readonly host?: HTMLElement;\n\n\tpublic readonly formAssociated?: HTMLInputElement;\n\n\tpublic constructor(component: Generic.Element.Component & Props, name: string, host?: HTMLElement) {\n\t\tthis.component = component;\n\t\tthis.name = name;\n\t\tthis.host = host;\n\t\tif (EXPERIMENTAL_MODE) {\n\t\t\tthis.formAssociated = document.createElement('input');\n\t\t\tthis.formAssociated.setAttribute('type', 'hidden');\n\t\t\tconst children = this.host?.children \|\| [];\n\t\t\tfor (let i = 0; i < children.length; i++) {\n\t\t\t\tif (this.host?.children[i].tagName === 'INPUT') {\n\t\t\t\t\tthis.host?.removeChild(this.host?.children[i]);\n\t\t\t\t}\n\t\t\t}\n\t\t\tthis.host?.appendChild(this.formAssociated);\n\t\t}\n\t}\n\n\t/\n\t We try to support native form-associated custom elements.\n\t \n\t @see https://github.com/public-ui/kolibri/discussions/2821\n\t /\n\tprotected readonly syncFormAssociatedName = () => {\n\t\tsyncElementAttribute('id', this.formAssociated, this.component.state._id as string);\n\t\tsyncElementAttribute('name', this.formAssociated, this.component.state._name as string);\n\t\tsyncElementAttribute('value', this.formAssociated, this.component.state._value as string);\n\t};\n\n\tpublic readonly setFormAssociatedValue = (value: string \| null = null) => {\n\t\tsyncElementAttribute('value', this.formAssociated, value as string);\n\t};\n\n\tpublic validateAlert(value?: boolean): void {\n\t\twatchBoolean(this.component, '_alert', value);\n\t}\n\n\tpublic validateTouched(value?: boolean): void {\n\t\twatchBoolean(this.component, '_touched', value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAlert(this.component._alert);\n\t\tthis.validateTouched(this.component._touched);\n\t}\n}\n","import { Generic } from '@a11y-ui/core';\nimport { ButtonProps } from '../../../types/button-link';\nimport { InputTypeOnDefault } from '../../../types/input/types';\nimport { a11yHintDisabled, devHint } from '../../../utils/a11y.tipps';\nimport { objectObjectHandler, parseJson, setState, watchBoolean, watchString } from '../../../utils/prop.validators';\nimport { validateTabIndex } from '../../../utils/validators/tab-index';\nimport { ControlledInputController } from '../../input-adapter-leanup/controller';\nimport { Props as AdapterProps } from '../../input-adapter-leanup/types';\nimport { Props, Watches } from './types';\nimport { validateLabel } from '../../../types/props';\n\ntype ValueChangeListener = (value: string) => void;\n\nexport class InputController extends ControlledInputController implements Watches {\n\tprotected readonly component: Generic.Element.Component & Props & AdapterProps;\n\n\tpublic hideLabel = false;\n\n\tprivate readonly valueChangeListeners: ValueChangeListener[] = [];\n\n\tpublic constructor(component: Generic.Element.Component & Props, name: string, host?: HTMLElement) {\n\t\tsuper(component, name, host);\n\t\tthis.component = component;\n\t}\n\n\tpublic validateAccessKey(value?: string): void {\n\t\twatchString(this.component, '_accessKey', value);\n\t}\n\n\tpublic validateAdjustHeight(value?: boolean): void {\n\t\twatchBoolean(this.component, '_adjustHeight', value);\n\t}\n\n\tpublic validateDisabled(value?: boolean): void {\n\t\twatchBoolean(this.component, '_disabled', value);\n\t\tif (value === true) {\n\t\t\ta11yHintDisabled();\n\t\t}\n\t}\n\n\tpublic validateError(value?: string): void {\n\t\twatchString(this.component, '_error', value);\n\t}\n\n\tpublic validateHideLabel(value?: boolean): void {\n\t\twatchBoolean(this.component, '_hideLabel', value);\n\t}\n\n\tpublic validateHint(value?: string): void {\n\t\twatchString(this.component, '_hint', value);\n\t}\n\n\tpublic validateId(value?: string): void {\n\t\twatchString(this.component, '_id', value, {\n\t\t\thooks: {\n\t\t\t\tafterPatch: this.syncFormAssociatedName,\n\t\t\t},\n\t\t\tminLength: 1,\n\t\t});\n\t\tif (value === '' \|\| typeof value === 'undefined') {\n\t\t\tdevHint(`Eine eindeutige ID an den Eingabefeldern ist nicht zwingend erforderlich, könnte aber für die E2E-Tests relevant sein.`);\n\t\t}\n\t}\n\n\tpublic validateLabel(value?: string): void {\n\t\tvalidateLabel(this.component, value);\n\t}\n\n\tpublic validateName(value?: string): void {\n\t\twatchString(this.component, '_name', value, {\n\t\t\thooks: {\n\t\t\t\tafterPatch: this.syncFormAssociatedName,\n\t\t\t},\n\t\t});\n\t\tif (typeof value === 'undefined') {\n\t\t\tdevHint(\n\t\t\t\t`Ein Name an den Eingabefeldern ist nicht zwingend erforderlich, kann aber für die Autocomplete-Funktion und für das statische Versenden des Eingabefeldes relevant sein.`\n\t\t\t);\n\t\t}\n\t}\n\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tif (typeof value === 'object') {\n\t\t\tsetState(this.component, '_on', value);\n\t\t}\n\t}\n\n\tpublic validateSmartButton(value?: ButtonProps \| string): void {\n\t\tobjectObjectHandler(value, () => {\n\t\t\ttry {\n\t\t\t\tvalue = parseJson<ButtonProps>(value as string);\n\t\t\t\t// eslint-disable-next-line no-empty\n\t\t\t} catch (e) {\n\t\t\t\t// value behält den ursprünglichen Wert\n\t\t\t}\n\t\t\tsetState(this.component, '_smartButton', value);\n\t\t});\n\t}\n\n\tpublic validateTabIndex(value?: number): void {\n\t\tvalidateTabIndex(this.component, value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tsuper.componentWillLoad();\n\t\tthis.validateAccessKey(this.component._accessKey);\n\t\tthis.validateAdjustHeight(this.component._adjustHeight);\n\t\tthis.validateError(this.component._error);\n\t\tthis.validateDisabled(this.component._disabled);\n\t\tthis.validateHideLabel(this.component._hideLabel);\n\t\tthis.validateHint(this.component._hint);\n\t\tthis.validateId(this.component._id);\n\t\tthis.validateLabel(this.component._label);\n\t\tthis.validateName(this.component._name);\n\t\tthis.validateSmartButton(this.component._smartButton);\n\t\tthis.validateOn(this.component._on);\n\t\tthis.validateTabIndex(this.component._tabIndex);\n\t\tthis.syncFormAssociatedName();\n\t}\n\n\tprotected onBlur(event: Event): void {\n\t\tthis.component._alert = true;\n\t\tthis.component._touched = true;\n\t\tif (typeof this.component._on?.onBlur === 'function') {\n\t\t\tthis.component._on.onBlur(event);\n\t\t}\n\t}\n\n\tprotected onChange(event: Event): void {\n\t\tconst value = (event.target as HTMLInputElement).value;\n\t\tthis.setFormAssociatedValue(value);\n\t\tthis.valueChangeListeners.forEach((listener) => listener(value));\n\t\tif (typeof this.component._on?.onChange === 'function') {\n\t\t\t/\n\t\t\t TODO\n\t\t\t * Value-Handling muss für InputDate und InputNumber optimiert werden\n\t\t\t * - value\n\t\t\t * - valueAsNumber\n\t\t\t * - valueAsDate\n\t\t\t /\n\t\t\tthis.component._on.onChange(event, value);\n\t\t}\n\t}\n\n\tprotected onClick(event: Event): void {\n\t\tif (typeof this.component._on?.onClick === 'function') {\n\t\t\tthis.component._on.onClick(event);\n\t\t}\n\t}\n\n\tprotected onFocus(event: Event): void {\n\t\tthis.component._alert = true;\n\t\tif (typeof this.component._on?.onFocus === 'function') {\n\t\t\tthis.component._on.onFocus(event);\n\t\t}\n\t}\n\n\tpublic setValue(event: Event, value: string \| number \| boolean): void {\n\t\tthis.setFormAssociatedValue(value as string);\n\t\tif (typeof this.component._on?.onChange === 'function') {\n\t\t\tthis.component._on.onChange(event, value);\n\t\t}\n\t}\n\n\tpublic addValueChangeListener(listener: ValueChangeListener) {\n\t\tthis.valueChangeListeners.push(listener);\n\t}\n\n\t/\n\t Hinweis: In der Subklasse 'InputPasswordController'\n\t * werden die Methoden onBlur und onFocus\n\t * überschrieben.\n\t * Es werden somit zunächst die Methoden der\n\t * Subklasse ausgeführt und danach die der\n\t * Oberklassen.\n\t */\n\tpublic readonly onFacade = {\n\t\tonBlur: this.onBlur.bind(this),\n\t\tonChange: this.onChange.bind(this),\n\t\tonClick: this.onClick.bind(this),\n\t\tonFocus: this.onFocus.bind(this),\n\t};\n}\n"],"version":3}

package/dist/components/controller4.js CHANGED Viewed

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{d as devHint,a as watchValidator,l as watchBoolean,C as watchNumber,w as watchString}from"./prop.validators.js";import{I as InputIconController}from"./controller-icon.js";class InputPasswordController extends InputIconController{constructor(e,t,a){super(e,t,a),this.handleHiddenLabelAndRequired=()=>{!0===this.component.state._hideLabel&&!0===this.component.state._required?(devHint("[KolInput*] Wenn man das Label ausblendet, dann kann der sehende Nutzer:in nicht mehr erkennen, ob die Eingabe erforderlich ist."),this.hideLabel=!1):this.hideLabel=!0===this.component.state._hideLabel},this.component=e}validateAutoComplete(e){watchValidator(this.component,"_autoComplete",(e=>"string"==typeof e&&("on"===e||"off"===e)),new Set(["on | off"]),e)}validateHideLabel(e){watchBoolean(this.component,"_hideLabel",e,{hooks:{afterPatch:this.handleHiddenLabelAndRequired}})}validateMaxLength(e){watchNumber(this.component,"_maxLength",e,{min:0})}validatePattern(e){watchString(this.component,"_pattern",e)}validatePlaceholder(e){watchString(this.component,"_placeholder",e)}validateReadOnly(e){watchBoolean(this.component,"_readOnly",e)}validateRequired(e){watchBoolean(this.component,"_required",e,{hooks:{afterPatch:this.handleHiddenLabelAndRequired}})}validateSize(e){watchNumber(this.component,"_size",e,{min:1})}validateValue(e){watchString(this.component,"_value",e)}componentWillLoad(){super.componentWillLoad(),this.validateAutoComplete(this.component._autoComplete),this.validateMaxLength(this.component._maxLength),this.validatePattern(this.component._pattern),this.validatePlaceholder(this.component._placeholder),this.validateReadOnly(this.component._readOnly),this.validateRequired(this.component._required),this.validateSize(this.component._size),this.validateValue(this.component._value)}onBlur(e){this.component.state=Object.assign(Object.assign({},this.component.state),{_placeholder:this.placeholderCache}),this.placeholderCache=void 0,super.onBlur(e)}onFocus(e){this.placeholderCache=this.component.state._placeholder,this.component.state=Object.assign(Object.assign({},this.component.state),{_placeholder:void 0}),super.onFocus(e)}}export{InputPasswordController as I};
+import{d as devHint,a as watchValidator,l as watchBoolean,C as watchNumber,w as watchString}from"./prop.validators.js";import{I as InputIconController}from"./controller-icon.js";class InputPasswordController extends InputIconController{constructor(e,t,a){super(e,t,a),this.handleHiddenLabelAndRequired=()=>{!0===this.component.state._hideLabel&&!0===this.component.state._required?(devHint("[KolInput*] Wenn man das Label ausblendet, dann kann der sehende Nutzer:in nicht mehr erkennen, ob die Eingabe erforderlich ist."),this.hideLabel=!1):this.hideLabel=!0===this.component.state._hideLabel},this.component=e}validateAutoComplete(e){watchValidator(this.component,"_autoComplete",(e=>"string"==typeof e&&("on"===e||"off"===e)),new Set(["on | off"]),e)}validateHideLabel(e){watchBoolean(this.component,"_hideLabel",e,{hooks:{afterPatch:this.handleHiddenLabelAndRequired}})}validateMaxLength(e){watchNumber(this.component,"_maxLength",e,{min:0})}validatePattern(e){watchString(this.component,"_pattern",e)}validatePlaceholder(e){watchString(this.component,"_placeholder",e)}validateReadOnly(e){watchBoolean(this.component,"_readOnly",e)}validateRequired(e){watchBoolean(this.component,"_required",e,{hooks:{afterPatch:this.handleHiddenLabelAndRequired}})}validateSize(e){watchNumber(this.component,"_size",e,{min:1})}validateValue(e){watchString(this.component,"_value",e),this.setFormAssociatedValue(this.component.state._value)}componentWillLoad(){super.componentWillLoad(),this.validateAutoComplete(this.component._autoComplete),this.validateMaxLength(this.component._maxLength),this.validatePattern(this.component._pattern),this.validatePlaceholder(this.component._placeholder),this.validateReadOnly(this.component._readOnly),this.validateRequired(this.component._required),this.validateSize(this.component._size),this.validateValue(this.component._value)}onBlur(e){this.component.state=Object.assign(Object.assign({},this.component.state),{_placeholder:this.placeholderCache}),this.placeholderCache=void 0,super.onBlur(e)}onFocus(e){this.placeholderCache=this.component.state._placeholder,this.component.state=Object.assign(Object.assign({},this.component.state),{_placeholder:void 0}),super.onFocus(e)}}export{InputPasswordController as I};

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

	@@ -1 +1 @@
1	- {"file":"controller4.js","mappings":";;;;;;MAOa,uBAAwB,SAAQ,mBAAmB;EAI/D,YAAmB,SAA4C,EAAE,IAAY,EAAE,IAAkB;IAChG,KAAK,CAAC,SAAS,EAAE,IAAI,EAAE,IAAI,CAAC,CAAC;IAItB,iCAA4B,GAAG;MACtC,IAAI,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,UAAU,KAAK,IAAI,IAAI,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,SAAS,KAAK,IAAI,EAAE;QACxF,OAAO,CAAC,kIAAkI,CAAC,CAAC;QAC5I,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;OACvB;WAAM;QACN,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;OAC1D;KACD,CAAC;IAVD,IAAI,CAAC,SAAS,GAAG,SAAS,CAAC;GAC3B;EAWM,oBAAoB,CAAC,KAAsB;IACjD,cAAc,CACb,IAAI,CAAC,SAAS,EACd,eAAe,EACf,CAAC,KAAK,KAAc,OAAO,KAAK,KAAK,QAAQ,KAAK,KAAK,KAAK,IAAI,IAAI,KAAK,KAAK,KAAK,CAAC,EACpF,IAAI,GAAG,CAAC,CAAC,UAAU,CAAC,CAAC,EACrB,KAAK,CACL,CAAC;GACF;EAEM,iBAAiB,CAAC,KAAe;IACvC,YAAY,CAAC,IAAI,CAAC,SAAS,EAAE,YAAY,EAAE,KAAK,EAAE;MACjD,KAAK,EAAE;QACN,UAAU,EAAE,IAAI,CAAC,4BAA4B;OAC7C;KACD,CAAC,CAAC;GACH;EAEM,iBAAiB,CAAC,KAAc;IACtC,WAAW,CAAC,IAAI,CAAC,SAAS,EAAE,YAAY,EAAE,KAAK,EAAE;MAChD,GAAG,EAAE,CAAC;KACN,CAAC,CAAC;GACH;EAEM,eAAe,CAAC,KAAc;IACpC,WAAW,CAAC,IAAI,CAAC,SAAS,EAAE,UAAU,EAAE,KAAK,CAAC,CAAC;GAC/C;EAEM,mBAAmB,CAAC,KAAc;IACxC,WAAW,CAAC,IAAI,CAAC,SAAS,EAAE,cAAc,EAAE,KAAK,CAAC,CAAC;GACnD;EAEM,gBAAgB,CAAC,KAAe;IACtC,YAAY,CAAC,IAAI,CAAC,SAAS,EAAE,WAAW,EAAE,KAAK,CAAC,CAAC;GACjD;EAEM,gBAAgB,CAAC,KAAe;IACtC,YAAY,CAAC,IAAI,CAAC,SAAS,EAAE,WAAW,EAAE,KAAK,EAAE;MAChD,KAAK,EAAE;QACN,UAAU,EAAE,IAAI,CAAC,4BAA4B;OAC7C;KACD,CAAC,CAAC;GACH;EAEM,YAAY,CAAC,KAAc;IACjC,WAAW,CAAC,IAAI,CAAC,SAAS,EAAE,OAAO,EAAE,KAAK,EAAE;MAC3C,GAAG,EAAE,CAAC;KACN,CAAC,CAAC;GACH;EAEM,aAAa,CAAC,KAAc;IAClC,WAAW,CAAC,IAAI,CAAC,SAAS,EAAE,QAAQ,EAAE,KAAK,CAAC,CAAC;~~GAC7C~~;EAEM,iBAAiB;IACvB,KAAK,CAAC,iBAAiB,EAAE,CAAC;IAC1B,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,SAAS,CAAC,aAAa,CAAC,CAAC;IACxD,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC;IAClD,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC;IAC9C,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,CAAC;IACtD,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC;IAChD,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC;IAChD,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;IACxC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC;GAC1C;EAES,MAAM,CAAC,KAAY;IAoB5B,IAAI,CAAC,SAAS,CAAC,KAAK,mCAChB,IAAI,CAAC,SAAS,CAAC,KAAK,KACvB,YAAY,EAAE,IAAI,CAAC,gBAAgB,GACnC,CAAC;IACF,IAAI,CAAC,gBAAgB,GAAG,SAAS,CAAC;IAClC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;GACpB;EAES,OAAO,CAAC,KAAY;IAC7B,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,YAAsB,CAAC;IACpE,IAAI,CAAC,SAAS,CAAC,KAAK,mCAChB,IAAI,CAAC,SAAS,CAAC,KAAK,KACvB,YAAY,EAAE,SAAS,GACvB,CAAC;IACF,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;GACrB;;;;;","names":[],"sources":["./src/components/input-password/controller.ts"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { InputTypeOnOff } from '../../types/input/types';\nimport { devHint } from '../../utils/a11y.tipps';\nimport { watchBoolean, watchNumber, watchString, watchValidator } from '../../utils/prop.validators';\nimport { InputIconController } from '../@deprecated/input/controller-icon';\nimport { Props, Watches } from './types';\n\nexport class InputPasswordController extends InputIconController implements Watches {\n\tprotected readonly component: Generic.Element.Component & Props;\n\tprivate placeholderCache?: string;\n\n\tpublic constructor(component: Generic.Element.Component & Props, name: string, host?: HTMLElement) {\n\t\tsuper(component, name, host);\n\t\tthis.component = component;\n\t}\n\n\tprivate handleHiddenLabelAndRequired = (): void => {\n\t\tif (this.component.state._hideLabel === true && this.component.state._required === true) {\n\t\t\tdevHint(`[KolInput] Wenn man das Label ausblendet, dann kann der sehende Nutzer:in nicht mehr erkennen, ob die Eingabe erforderlich ist.`);\n\t\t\tthis.hideLabel = false;\n\t\t} else {\n\t\t\tthis.hideLabel = this.component.state._hideLabel === true;\n\t\t}\n\t};\n\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\twatchValidator(\n\t\t\tthis.component,\n\t\t\t'_autoComplete',\n\t\t\t(value): boolean => typeof value === 'string' && (value === 'on' \|\| value === 'off'),\n\t\t\tnew Set(['on \| off']),\n\t\t\tvalue\n\t\t);\n\t}\n\n\tpublic validateHideLabel(value?: boolean): void {\n\t\twatchBoolean(this.component, '_hideLabel', value, {\n\t\t\thooks: {\n\t\t\t\tafterPatch: this.handleHiddenLabelAndRequired,\n\t\t\t},\n\t\t});\n\t}\n\n\tpublic validateMaxLength(value?: number): void {\n\t\twatchNumber(this.component, '_maxLength', value, {\n\t\t\tmin: 0,\n\t\t});\n\t}\n\n\tpublic validatePattern(value?: string): void {\n\t\twatchString(this.component, '_pattern', value);\n\t}\n\n\tpublic validatePlaceholder(value?: string): void {\n\t\twatchString(this.component, '_placeholder', value);\n\t}\n\n\tpublic validateReadOnly(value?: boolean): void {\n\t\twatchBoolean(this.component, '_readOnly', value);\n\t}\n\n\tpublic validateRequired(value?: boolean): void {\n\t\twatchBoolean(this.component, '_required', value, {\n\t\t\thooks: {\n\t\t\t\tafterPatch: this.handleHiddenLabelAndRequired,\n\t\t\t},\n\t\t});\n\t}\n\n\tpublic validateSize(value?: number): void {\n\t\twatchNumber(this.component, '_size', value, {\n\t\t\tmin: 1,\n\t\t});\n\t}\n\n\tpublic validateValue(value?: string): void {\n\t\twatchString(this.component, '_value', value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tsuper.componentWillLoad();\n\t\tthis.validateAutoComplete(this.component._autoComplete);\n\t\tthis.validateMaxLength(this.component._maxLength);\n\t\tthis.validatePattern(this.component._pattern);\n\t\tthis.validatePlaceholder(this.component._placeholder);\n\t\tthis.validateReadOnly(this.component._readOnly);\n\t\tthis.validateRequired(this.component._required);\n\t\tthis.validateSize(this.component._size);\n\t\tthis.validateValue(this.component._value);\n\t}\n\n\tprotected onBlur(event: Event): void {\n\t\t/\n\t\t Beim Screenreader NVDA wird der Placeholder mit\n\t\t * vorgelesen. Somit kann es vorkommen, dass das\n\t\t * Label und der Placeholder vorgelesen werden.\n\t\t \n\t\t Aufgrund dessen, dass das Label immer vorgelesen\n\t\t * werden muss, kann das zusätzliche Vorlesen des\n\t\t * Placeholders störend sein.\n\t\t \n\t\t Damit beim Fokussieren das \"doppelte\" vorlesen\n\t\t * vermieden werden kann, wird der Placeholder für\n\t\t * den fokussierten Feldstatus entfernt.\n\t\t \n\t\t Hinweis: Für alle Nutzenden müssen die all dar-\n\t\t * gestellten Inhalte, also auch der Place-\n\t\t * holder, gleichermaßen zugänglich sein.\n\t\t * Das oben beschriebene Handling erfüllt\n\t\t * diese Anforderung nicht.\n\t\t */\n\t\tthis.component.state = {\n\t\t\t...this.component.state,\n\t\t\t_placeholder: this.placeholderCache,\n\t\t};\n\t\tthis.placeholderCache = undefined;\n\t\tsuper.onBlur(event);\n\t}\n\n\tprotected onFocus(event: Event): void {\n\t\tthis.placeholderCache = this.component.state._placeholder as string;\n\t\tthis.component.state = {\n\t\t\t...this.component.state,\n\t\t\t_placeholder: undefined,\n\t\t};\n\t\tsuper.onFocus(event);\n\t}\n}\n"],"version":3}
1	+ {"file":"controller4.js","mappings":"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","names":[],"sources":["./src/components/input-password/controller.ts"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { InputTypeOnOff } from '../../types/input/types';\nimport { devHint } from '../../utils/a11y.tipps';\nimport { watchBoolean, watchNumber, watchString, watchValidator } from '../../utils/prop.validators';\nimport { InputIconController } from '../@deprecated/input/controller-icon';\nimport { Props, Watches } from './types';\n\nexport class InputPasswordController extends InputIconController implements Watches {\n\tprotected readonly component: Generic.Element.Component & Props;\n\tprivate placeholderCache?: string;\n\n\tpublic constructor(component: Generic.Element.Component & Props, name: string, host?: HTMLElement) {\n\t\tsuper(component, name, host);\n\t\tthis.component = component;\n\t}\n\n\tprivate handleHiddenLabelAndRequired = (): void => {\n\t\tif (this.component.state._hideLabel === true && this.component.state._required === true) {\n\t\t\tdevHint(`[KolInput] Wenn man das Label ausblendet, dann kann der sehende Nutzer:in nicht mehr erkennen, ob die Eingabe erforderlich ist.`);\n\t\t\tthis.hideLabel = false;\n\t\t} else {\n\t\t\tthis.hideLabel = this.component.state._hideLabel === true;\n\t\t}\n\t};\n\n\tpublic validateAutoComplete(value?: InputTypeOnOff): void {\n\t\twatchValidator(\n\t\t\tthis.component,\n\t\t\t'_autoComplete',\n\t\t\t(value): boolean => typeof value === 'string' && (value === 'on' \|\| value === 'off'),\n\t\t\tnew Set(['on \| off']),\n\t\t\tvalue\n\t\t);\n\t}\n\n\tpublic validateHideLabel(value?: boolean): void {\n\t\twatchBoolean(this.component, '_hideLabel', value, {\n\t\t\thooks: {\n\t\t\t\tafterPatch: this.handleHiddenLabelAndRequired,\n\t\t\t},\n\t\t});\n\t}\n\n\tpublic validateMaxLength(value?: number): void {\n\t\twatchNumber(this.component, '_maxLength', value, {\n\t\t\tmin: 0,\n\t\t});\n\t}\n\n\tpublic validatePattern(value?: string): void {\n\t\twatchString(this.component, '_pattern', value);\n\t}\n\n\tpublic validatePlaceholder(value?: string): void {\n\t\twatchString(this.component, '_placeholder', value);\n\t}\n\n\tpublic validateReadOnly(value?: boolean): void {\n\t\twatchBoolean(this.component, '_readOnly', value);\n\t}\n\n\tpublic validateRequired(value?: boolean): void {\n\t\twatchBoolean(this.component, '_required', value, {\n\t\t\thooks: {\n\t\t\t\tafterPatch: this.handleHiddenLabelAndRequired,\n\t\t\t},\n\t\t});\n\t}\n\n\tpublic validateSize(value?: number): void {\n\t\twatchNumber(this.component, '_size', value, {\n\t\t\tmin: 1,\n\t\t});\n\t}\n\n\tpublic validateValue(value?: string): void {\n\t\twatchString(this.component, '_value', value);\n\t\tthis.setFormAssociatedValue(this.component.state._value as string);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tsuper.componentWillLoad();\n\t\tthis.validateAutoComplete(this.component._autoComplete);\n\t\tthis.validateMaxLength(this.component._maxLength);\n\t\tthis.validatePattern(this.component._pattern);\n\t\tthis.validatePlaceholder(this.component._placeholder);\n\t\tthis.validateReadOnly(this.component._readOnly);\n\t\tthis.validateRequired(this.component._required);\n\t\tthis.validateSize(this.component._size);\n\t\tthis.validateValue(this.component._value);\n\t}\n\n\tprotected onBlur(event: Event): void {\n\t\t/\n\t\t Beim Screenreader NVDA wird der Placeholder mit\n\t\t * vorgelesen. Somit kann es vorkommen, dass das\n\t\t * Label und der Placeholder vorgelesen werden.\n\t\t \n\t\t Aufgrund dessen, dass das Label immer vorgelesen\n\t\t * werden muss, kann das zusätzliche Vorlesen des\n\t\t * Placeholders störend sein.\n\t\t \n\t\t Damit beim Fokussieren das \"doppelte\" vorlesen\n\t\t * vermieden werden kann, wird der Placeholder für\n\t\t * den fokussierten Feldstatus entfernt.\n\t\t \n\t\t Hinweis: Für alle Nutzenden müssen die all dar-\n\t\t * gestellten Inhalte, also auch der Place-\n\t\t * holder, gleichermaßen zugänglich sein.\n\t\t * Das oben beschriebene Handling erfüllt\n\t\t * diese Anforderung nicht.\n\t\t */\n\t\tthis.component.state = {\n\t\t\t...this.component.state,\n\t\t\t_placeholder: this.placeholderCache,\n\t\t};\n\t\tthis.placeholderCache = undefined;\n\t\tsuper.onBlur(event);\n\t}\n\n\tprotected onFocus(event: Event): void {\n\t\tthis.placeholderCache = this.component.state._placeholder as string;\n\t\tthis.component.state = {\n\t\t\t...this.component.state,\n\t\t\t_placeholder: undefined,\n\t\t};\n\t\tsuper.onFocus(event);\n\t}\n}\n"],"version":3}

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

	@@ -1 +1 @@
1	- {"file":"kol-abbr.js","mappings":";;;;;;;;;AAAA,MAAM,eAAe,GAAG,6sBAA6sB;;MCkBxtBA,SAAO;;;;;IACF,UAAK,GAAG,KAAK,EAAE,CAAC;~~yBAmBU~~,KAAK;;~~iBAahB~~;MAC/B,MAAM,EAAE,GAAG;MACX,aAAa,EAAE,KAAK;KACpB;;EAjCM,MAAM;IACZ,QACC,EAAC,IAAI,QAEJ,+BAAuB,IAAI,CAAC,KAAK,EAAE,IAAI,EAAC,YAAY,EAAC,QAAQ,EAAC,GAAG,EAAC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,IACzF,YAAM,KAAK,EAAC,EAAE,IACb,eAAQ,CACF,CACD,EACP,mBAAa,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,aAAa,EAAE,GAAG,EAAE,IAAI,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,GAAgB,CACnG,EACN;GACF;EAgCM,aAAa,CAAC,KAAc;IAClC,WAAW,CAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE;MAClC,QAAQ,EAAE,IAAI;KACd,CAAC,CAAC;GACH;EAGM,oBAAoB,CAAC,~~KAAiB~~;~~IAC5C~~,qBAAqB,CAAC,IAAI,EAAE,eAAe,EAAE,KAAK,CAAC,CAAC;GACpD;EAEM,iBAAiB;IACvB,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IAChC,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;GAC9C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["KolAbbr"],"sources":["./src/components/abbr/style.css?tag=kol-abbr&mode=default&encapsulation=shadow","./src/components/abbr/component.tsx"],"sourcesContent":["@import url(../style.css);\n:host > abbr {\n\tcursor: help;\n}\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { watchTooltipAlignment } from '../../types/button-link';\nimport { ~~Alignment~~ } from '../../types/props';\nimport { nonce } from '../../utils/dev.utils';\nimport { watchString } from '../../utils/prop.validators';\nimport { API, States } from './types';\n\n/*\n @slot - Der Begriff, der erläutert werden soll.\n /\n@Component({\n\ttag: 'kol-abbr',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolAbbr implements API {\n\tprivate readonly nonce = nonce();\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t{/ eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex /}\n\t\t\t\t<abbr aria-labelledby={this.nonce} role=\"definition\" tabindex=\"0\" title={this.state._title}>\n\t\t\t\t\t<span title=\"\">\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</span>\n\t\t\t\t</abbr>\n\t\t\t\t<kol-tooltip _align={this.state._tooltipAlign} _id={this.nonce} _label={this.state._title}></kol-tooltip>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/\n\t Gibt an, ob der Tooltip entweder oben, rechts, unten oder links angezeigt werden soll.\n\t /\n\t@Prop() public _tooltipAlign?: ~~Alignment~~ = 'top';\n\n\t/\n\t Dieses Property gibt die Beschreibung oder Erläuterung der Abkürzung an.\n\t /\n\t@Prop() public _title!: string;\n\n\t/\n\t Die State-Parameter repräsentieren den inneren State\n\t * einer Komponente.\n\t \n\t @see: https://stenciljs.com/docs/state\n\t /\n\t@State() public state: States = {\n\t\t_title: '…', // ⚠ required\n\t\t_tooltipAlign: 'top',\n\t};\n\n\t/\n\t Die Watch-Methoden dienen der Möglichkeit zur\n\t * Validierung der Werte eines Properties und\n\t * dem Mapping dessen auf einen anderen internen\n\t * State-Typ.\n\t \n\t @see: https://stenciljs.com/docs/properties#prop-validation\n\t */\n\t@Watch('_title')\n\tpublic validateTitle(value?: string): void {\n\t\twatchString(this, '_title', value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\t@Watch('_tooltipAlign')\n\tpublic validateTooltipAlign(value?: ~~Alignment~~): void {\n\t\twatchTooltipAlignment(this, '_tooltipAlign', value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateTitle(this._title);\n\t\tthis.validateTooltipAlign(this._tooltipAlign);\n\t}\n}\n"],"version":3}
1	+ {"file":"kol-abbr.js","mappings":";;;;;;;;;AAAA,MAAM,eAAe,GAAG,6sBAA6sB;;MCkBxtBA,SAAO;;;;;IACF,UAAK,GAAG,KAAK,EAAE,CAAC;yBAmBM,KAAK;;iBAaZ;MAC/B,MAAM,EAAE,GAAG;MACX,aAAa,EAAE,KAAK;KACpB;;EAjCM,MAAM;IACZ,QACC,EAAC,IAAI,QAEJ,+BAAuB,IAAI,CAAC,KAAK,EAAE,IAAI,EAAC,YAAY,EAAC,QAAQ,EAAC,GAAG,EAAC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,IACzF,YAAM,KAAK,EAAC,EAAE,IACb,eAAQ,CACF,CACD,EACP,mBAAa,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,aAAa,EAAE,GAAG,EAAE,IAAI,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,GAAgB,CACnG,EACN;GACF;EAgCM,aAAa,CAAC,KAAc;IAClC,WAAW,CAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE;MAClC,QAAQ,EAAE,IAAI;KACd,CAAC,CAAC;GACH;EAGM,oBAAoB,CAAC,KAAa;IACxC,qBAAqB,CAAC,IAAI,EAAE,eAAe,EAAE,KAAK,CAAC,CAAC;GACpD;EAEM,iBAAiB;IACvB,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IAChC,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;GAC9C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["KolAbbr"],"sources":["./src/components/abbr/style.css?tag=kol-abbr&mode=default&encapsulation=shadow","./src/components/abbr/component.tsx"],"sourcesContent":["@import url(../style.css);\n:host > abbr {\n\tcursor: help;\n}\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { watchTooltipAlignment } from '../../types/button-link';\nimport { Align } from '../../types/props';\nimport { nonce } from '../../utils/dev.utils';\nimport { watchString } from '../../utils/prop.validators';\nimport { API, States } from './types';\n\n/*\n @slot - Der Begriff, der erläutert werden soll.\n /\n@Component({\n\ttag: 'kol-abbr',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolAbbr implements API {\n\tprivate readonly nonce = nonce();\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t{/ eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex /}\n\t\t\t\t<abbr aria-labelledby={this.nonce} role=\"definition\" tabindex=\"0\" title={this.state._title}>\n\t\t\t\t\t<span title=\"\">\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</span>\n\t\t\t\t</abbr>\n\t\t\t\t<kol-tooltip _align={this.state._tooltipAlign} _id={this.nonce} _label={this.state._title}></kol-tooltip>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/\n\t Gibt an, ob der Tooltip bevorzugt entweder oben, rechts, unten oder links angezeigt werden soll.\n\t /\n\t@Prop() public _tooltipAlign?: Align = 'top';\n\n\t/\n\t Dieses Property gibt die Beschreibung oder Erläuterung der Abkürzung an.\n\t /\n\t@Prop() public _title!: string;\n\n\t/\n\t Die State-Parameter repräsentieren den inneren State\n\t * einer Komponente.\n\t \n\t @see: https://stenciljs.com/docs/state\n\t /\n\t@State() public state: States = {\n\t\t_title: '…', // ⚠ required\n\t\t_tooltipAlign: 'top',\n\t};\n\n\t/\n\t Die Watch-Methoden dienen der Möglichkeit zur\n\t * Validierung der Werte eines Properties und\n\t * dem Mapping dessen auf einen anderen internen\n\t * State-Typ.\n\t \n\t @see: https://stenciljs.com/docs/properties#prop-validation\n\t */\n\t@Watch('_title')\n\tpublic validateTitle(value?: string): void {\n\t\twatchString(this, '_title', value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\t@Watch('_tooltipAlign')\n\tpublic validateTooltipAlign(value?: Align): void {\n\t\twatchTooltipAlignment(this, '_tooltipAlign', value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateTitle(this._title);\n\t\tthis.validateTooltipAlign(this._tooltipAlign);\n\t}\n}\n"],"version":3}

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

	@@ -1 +1 @@
1	- {"file":"kol-accordion.js","mappings":"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","names":["KolAccordion"],"sources":["./src/types/props/open.ts","./src/components/accordion/style.css?tag=kol-accordion&mode=default&encapsulation=shadow","./src/components/accordion/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { watchBoolean } from '../../utils/prop.validators';\n\n/* types /\n/* de\n * Klappt das Element auf sofern gesetzt (oder true) und klappt es zu sofern nicht gesetzt (oder false).\n /\n/* en\n * If set (to true) opens/expands the element, closes if not set (or set to false).\n /\nexport type PropOpen = {\n\topen: boolean;\n};\n\n/ validator /\nexport const validateOpen = (component: Generic.Element.Component, value?: boolean): void => {\n\twatchBoolean(component, '_open', value);\n};\n","@import url(../style.css);\n@import url(../host-display-block.css);\n/\n * Inside a button the label text ist always centered.\n * So we need text align left.\n /\n.accordion kol-heading-wc kol-button-wc button kol-span-wc {\n\tjustify-items: start;\n}\n.wrapper {\n\tposition: relative;\n}\n.transition {\n\ttransition: height 0.3s ease-in-out;\n}\n.content {\n\tinset: 0 0 auto 0;\n\tposition: absolute;\n\twidth: 100%;\n}\n","// https://codepen.io/mbxtr/pen/OJPOYg?html-preprocessor=haml\n\nimport { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { HeadingLevel } from '../../types/heading-level';\nimport { validateOpen } from '../../types/props';\nimport { featureHint } from '../../utils/a11y.tipps';\nimport { nonce } from '../../utils/dev.utils';\nimport { setState, watchString } from '../../utils/prop.validators';\nimport { watchHeadingLevel } from '../heading/validation';\nimport { API, KoliBriAccordionCallbacks, States } from './types';\nimport { processEnv } from '../../utils/reuse';\n\nfeatureHint(`[KolAccordion] Anfrage nach einer KolAccordionGroup bei dem immer nur ein Accordion geöffnet ist.\n\n- onClick auf der KolAccordion anwenden\n- Click-Event prüft den _open-Status der Accordions\n- Logik Öffnet und Schließt entsprechend`);\nfeatureHint(`[KolAccordion] Tab-Sperre des Inhalts im geschlossenen Zustand.`);\n\n/\n \n * @slot - Ermöglicht das Einfügen beliebigen HTML's in den Inhaltsbereich des Accordions.\n * @slot content - Ermöglicht das Einfügen beliebigen HTML's in den Inhaltsbereich des Accordions.\n * @slot header - Deprecated für Version 2: Ermöglicht das Einfügen beliebigen HTML's in den Kopfbereich des Accordions.\n /\n@Component({\n\ttag: 'kol-accordion',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolAccordion implements API {\n\tprivate readonly nonce = nonce();\n\tprivate contentElement: HTMLElement \| null = null;\n\tprivate contentWrapperElement: HTMLElement \| null = null;\n\tprivate contentObserver: ResizeObserver \| null = null;\n\tprivate transition = false;\n\n\tprivate readonly catchContentElement = (element?: HTMLElement) => {\n\t\tif (element) this.contentElement = element;\n\t};\n\tprivate readonly catchContentWrapperElement = (element?: HTMLElement) => {\n\t\tif (element) this.contentWrapperElement = element;\n\t};\n\n\tresizeWrapper(list?: ResizeObserverEntry[]) {\n\t\tconst content = this.contentElement;\n\t\tconst wrapper = this.contentWrapperElement;\n\t\tconst observer = this.contentObserver;\n\t\tif (content && wrapper && observer) {\n\t\t\tif (this._open) {\n\t\t\t\twrapper.style.display = 'block';\n\t\t\t\tsetTimeout(() => {\n\t\t\t\t\twrapper.style.height = `${content?.clientHeight ?? 0}px`;\n\t\t\t\t});\n\t\t\t\tif (!list) observer.observe(content);\n\t\t\t\twrapper.addEventListener(\n\t\t\t\t\t'transitionend',\n\t\t\t\t\t() => {\n\t\t\t\t\t\twrapper.style.overflow = '';\n\t\t\t\t\t},\n\t\t\t\t\t{ once: true }\n\t\t\t\t);\n\t\t\t} else {\n\t\t\t\twrapper.style.overflow = 'hidden';\n\t\t\t\tobserver.unobserve(content);\n\t\t\t\twrapper.style.height = '0';\n\t\t\t\tif (this.transition) {\n\t\t\t\t\twrapper.addEventListener(\n\t\t\t\t\t\t'transitionend',\n\t\t\t\t\t\t() => {\n\t\t\t\t\t\t\twrapper.style.display = 'none';\n\t\t\t\t\t\t},\n\t\t\t\t\t\t{ once: true }\n\t\t\t\t\t);\n\t\t\t\t} else {\n\t\t\t\t\twrapper.style.display = 'none';\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<div\n\t\t\t\t\tclass={{\n\t\t\t\t\t\taccordion: true,\n\t\t\t\t\t\topen: this.state._open === true,\n\t\t\t\t\t\tclose: this.state._open !== true,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<kol-heading-wc _label=\"\" _level={this.state._level}>\n\t\t\t\t\t\t<kol-button-wc\n\t\t\t\t\t\t\t// slot=\"expert\"\n\t\t\t\t\t\t\t_ariaControls={this.nonce}\n\t\t\t\t\t\t\t_ariaExpanded={this.state._open}\n\t\t\t\t\t\t\t_icon={this.state._open ? 'codicon codicon-remove' : 'codicon codicon-add'}\n\t\t\t\t\t\t\t_label={this.state._heading}\n\t\t\t\t\t\t\t_on={{ onClick: this.onClick }}\n\t\t\t\t\t\t></kol-button-wc>\n\t\t\t\t\t</kol-heading-wc>\n\t\t\t\t\t<div class=\"header\">\n\t\t\t\t\t\t<slot name=\"header\"></slot>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div ref={this.catchContentWrapperElement} class={{ wrapper: true, transition: this.transition }}>\n\t\t\t\t\t\t<div ref={this.catchContentElement} aria-hidden={this.state._open === false ? 'true' : undefined} class=\"content\" id={this.nonce}>\n\t\t\t\t\t\t\t<slot name=\"content\"></slot> {/ Deprecated for version 2 /}\n\t\t\t\t\t\t\t<slot />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/\n\t Gibt die Überschrift des Accordions an.\n\t /\n\t@Prop() public _heading!: string;\n\n\t/\n\t Setzt den H-Level, von 1 bis 6, der Überschrift.\n\t /\n\t@Prop() public _level?: HeadingLevel = 1;\n\n\t/\n\t Gibt die EventCallback-Funktionen an.\n\t /\n\t@Prop() public _on?: KoliBriAccordionCallbacks;\n\n\t/\n\t Gibt an, ob das Accordion geöffnet ist.\n\t /\n\t@Prop({ mutable: true, reflect: true }) public _open?: boolean = false;\n\n\t@State() public state: States = {\n\t\t_heading: '…', // ⚠ required\n\t\t_level: 1,\n\t};\n\n\t@Watch('_heading')\n\tpublic validateHeading(value?: string): void {\n\t\twatchString(this, '_heading', value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\t@Watch('_level')\n\tpublic validateLevel(value?: HeadingLevel): void {\n\t\twatchHeadingLevel(this, value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: KoliBriAccordionCallbacks): void {\n\t\tif (typeof value === 'object' && value !== null && typeof value.onClick === 'function') {\n\t\t\tsetState(this, '_on', value);\n\t\t}\n\t}\n\n\t@Watch('_open')\n\tpublic validateOpen(value?: boolean): void {\n\t\tvalidateOpen(this, value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateHeading(this._heading);\n\t\tthis.validateLevel(this._level);\n\t\tthis.validateOn(this._on);\n\t\tthis.validateOpen(this._open);\n\t\tif (processEnv !== 'test') this.contentObserver = new ResizeObserver(this.resizeWrapper.bind(this));\n\t\tsetTimeout(() => {\n\t\t\tif (this.contentObserver && this.contentElement) this.contentObserver.observe(this.contentElement);\n\t\t});\n\t\t// So it does not transition if it is set to open from the start.\n\t\tsetTimeout(() => {\n\t\t\tthis.transition = true;\n\t\t}, 200);\n\t}\n\n\tprivate onClick = (event: Event) => {\n\t\tthis._open = !this._open;\n\t\tthis.resizeWrapper();\n\n\t\t/\n\t\t Der Timeout wird benötigt, damit das Event\n\t\t * vom Button- auf das Accordion-Event wechselt.\n\t\t * So ist es dem Anwendenden möglich das _open-\n\t\t * Attribute abzufragen.\n\t\t */\n\t\tsetTimeout(() => {\n\t\t\tif (typeof this.state._on?.onClick === 'function') {\n\t\t\t\tthis.state._on.onClick(event, this._open === true);\n\t\t\t}\n\t\t});\n\t};\n}\n"],"version":3}
1	+ {"file":"kol-accordion.js","mappings":"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","names":["KolAccordion"],"sources":["./src/types/props/open.ts","./src/components/accordion/style.css?tag=kol-accordion&mode=default&encapsulation=shadow","./src/components/accordion/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { watchBoolean } from '../../utils/prop.validators';\n\n/* types /\n/* de\n * Klappt das Element auf sofern gesetzt (oder true) und klappt es zu sofern nicht gesetzt (oder false).\n /\n/* en\n * If set (to true) opens/expands the element, closes if not set (or set to false).\n /\nexport type PropOpen = {\n\topen: boolean;\n};\n\n/ validator /\nexport const validateOpen = (component: Generic.Element.Component, value?: boolean): void => {\n\twatchBoolean(component, '_open', value);\n};\n","@import url(../style.css);\n@import url(../host-display-block.css);\n/\n * Inside a button the label text ist always centered.\n * So we need text align left.\n /\n.accordion kol-heading-wc kol-button-wc button kol-span-wc {\n\tjustify-items: start;\n}\n.wrapper {\n\tposition: relative;\n}\n.transition {\n\ttransition: height 0.3s ease-in-out;\n}\n.content {\n\tinset: 0 0 auto 0;\n\tposition: absolute;\n\twidth: 100%;\n}\n","// https://codepen.io/mbxtr/pen/OJPOYg?html-preprocessor=haml\n\nimport { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { HeadingLevel } from '../../types/heading-level';\nimport { validateOpen } from '../../types/props';\nimport { featureHint } from '../../utils/a11y.tipps';\nimport { nonce } from '../../utils/dev.utils';\nimport { setState, watchString } from '../../utils/prop.validators';\nimport { watchHeadingLevel } from '../heading/validation';\nimport { API, KoliBriAccordionCallbacks, States } from './types';\nimport { processEnv } from '../../utils/reuse';\n\nfeatureHint(`[KolAccordion] Anfrage nach einer KolAccordionGroup bei dem immer nur ein Accordion geöffnet ist.\n\n- onClick auf der KolAccordion anwenden\n- Click-Event prüft den _open-Status der Accordions\n- Logik Öffnet und Schließt entsprechend`);\nfeatureHint(`[KolAccordion] Tab-Sperre des Inhalts im geschlossenen Zustand.`);\n\n/\n \n * @slot - Ermöglicht das Einfügen beliebigen HTML's in den Inhaltsbereich des Accordions.\n * @slot content - Ermöglicht das Einfügen beliebigen HTML's in den Inhaltsbereich des Accordions.\n * @slot header - Deprecated für Version 2: Ermöglicht das Einfügen beliebigen HTML's in den Kopfbereich des Accordions.\n /\n@Component({\n\ttag: 'kol-accordion',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolAccordion implements API {\n\tprivate readonly nonce = nonce();\n\tprivate contentElement: HTMLElement \| null = null;\n\tprivate contentWrapperElement: HTMLElement \| null = null;\n\tprivate contentObserver: ResizeObserver \| null = null;\n\tprivate transition = false;\n\n\tprivate readonly catchContentElement = (element?: HTMLElement) => {\n\t\tif (element) this.contentElement = element;\n\t};\n\tprivate readonly catchContentWrapperElement = (element?: HTMLElement) => {\n\t\tif (element) this.contentWrapperElement = element;\n\t};\n\n\tresizeWrapper(list?: ResizeObserverEntry[]) {\n\t\tconst content = this.contentElement;\n\t\tconst wrapper = this.contentWrapperElement;\n\t\tconst observer = this.contentObserver;\n\t\tif (content && wrapper && observer) {\n\t\t\tif (this._open) {\n\t\t\t\twrapper.style.display = 'block';\n\t\t\t\tsetTimeout(() => {\n\t\t\t\t\twrapper.style.height = `${content?.clientHeight ?? 0}px`;\n\t\t\t\t});\n\t\t\t\tif (!list) observer.observe(content);\n\t\t\t\twrapper.addEventListener(\n\t\t\t\t\t'transitionend',\n\t\t\t\t\t() => {\n\t\t\t\t\t\twrapper.style.overflow = '';\n\t\t\t\t\t},\n\t\t\t\t\t{ once: true }\n\t\t\t\t);\n\t\t\t} else {\n\t\t\t\twrapper.style.overflow = 'hidden';\n\t\t\t\tobserver.unobserve(content);\n\t\t\t\twrapper.style.height = '0';\n\t\t\t\tif (this.transition) {\n\t\t\t\t\twrapper.addEventListener(\n\t\t\t\t\t\t'transitionend',\n\t\t\t\t\t\t() => {\n\t\t\t\t\t\t\twrapper.style.display = 'none';\n\t\t\t\t\t\t},\n\t\t\t\t\t\t{ once: true }\n\t\t\t\t\t);\n\t\t\t\t} else {\n\t\t\t\t\twrapper.style.display = 'none';\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<div\n\t\t\t\t\tclass={{\n\t\t\t\t\t\taccordion: true,\n\t\t\t\t\t\topen: this.state._open === true,\n\t\t\t\t\t\tclose: this.state._open !== true,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<kol-heading-wc _label=\"\" _level={this.state._level}>\n\t\t\t\t\t\t<kol-button-wc\n\t\t\t\t\t\t\t// slot=\"expert\"\n\t\t\t\t\t\t\t_ariaControls={this.nonce}\n\t\t\t\t\t\t\t_ariaExpanded={this.state._open}\n\t\t\t\t\t\t\t_icon={this.state._open ? 'codicon codicon-remove' : 'codicon codicon-add'}\n\t\t\t\t\t\t\t_label={this.state._heading}\n\t\t\t\t\t\t\t_on={{ onClick: this.onClick }}\n\t\t\t\t\t\t></kol-button-wc>\n\t\t\t\t\t</kol-heading-wc>\n\t\t\t\t\t<div class=\"header\">\n\t\t\t\t\t\t<slot name=\"header\"></slot>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div ref={this.catchContentWrapperElement} class={{ wrapper: true, transition: this.transition }}>\n\t\t\t\t\t\t<div ref={this.catchContentElement} aria-hidden={this.state._open === false ? 'true' : undefined} class=\"content\" id={this.nonce}>\n\t\t\t\t\t\t\t<slot name=\"content\"></slot> {/ Deprecated for version 2 /}\n\t\t\t\t\t\t\t<slot />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/\n\t Gibt die Beschriftung der Komponente an.\n\t /\n\t@Prop() public _heading!: string;\n\n\t/\n\t Gibt an, welchen H-Level von 1 bis 6 die Überschrift hat. Oder bei 0, ob es keine Überschrift ist und als fett gedruckter Text angezeigt werden soll.\n\t /\n\t@Prop() public _level?: HeadingLevel = 1;\n\n\t/\n\t Gibt die EventCallback-Funktionen an.\n\t /\n\t@Prop() public _on?: KoliBriAccordionCallbacks;\n\n\t/\n\t Gibt an, ob die Komponente entweder geöffnet oder geschlossen ist.\n\t /\n\t@Prop({ mutable: true, reflect: true }) public _open?: boolean = false;\n\n\t@State() public state: States = {\n\t\t_heading: '…', // ⚠ required\n\t\t_level: 1,\n\t};\n\n\t@Watch('_heading')\n\tpublic validateHeading(value?: string): void {\n\t\twatchString(this, '_heading', value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\t@Watch('_level')\n\tpublic validateLevel(value?: HeadingLevel): void {\n\t\twatchHeadingLevel(this, value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: KoliBriAccordionCallbacks): void {\n\t\tif (typeof value === 'object' && value !== null && typeof value.onClick === 'function') {\n\t\t\tsetState(this, '_on', value);\n\t\t}\n\t}\n\n\t@Watch('_open')\n\tpublic validateOpen(value?: boolean): void {\n\t\tvalidateOpen(this, value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateHeading(this._heading);\n\t\tthis.validateLevel(this._level);\n\t\tthis.validateOn(this._on);\n\t\tthis.validateOpen(this._open);\n\t\tif (processEnv !== 'test') this.contentObserver = new ResizeObserver(this.resizeWrapper.bind(this));\n\t\tsetTimeout(() => {\n\t\t\tif (this.contentObserver && this.contentElement) this.contentObserver.observe(this.contentElement);\n\t\t});\n\t\t// So it does not transition if it is set to open from the start.\n\t\tsetTimeout(() => {\n\t\t\tthis.transition = true;\n\t\t}, 200);\n\t}\n\n\tprivate onClick = (event: Event) => {\n\t\tthis._open = !this._open;\n\t\tthis.resizeWrapper();\n\n\t\t/\n\t\t Der Timeout wird benötigt, damit das Event\n\t\t * vom Button- auf das Accordion-Event wechselt.\n\t\t * So ist es dem Anwendenden möglich das _open-\n\t\t * Attribute abzufragen.\n\t\t */\n\t\tsetTimeout(() => {\n\t\t\tif (typeof this.state._on?.onClick === 'function') {\n\t\t\t\tthis.state._on.onClick(event, this._open === true);\n\t\t\t}\n\t\t});\n\t};\n}\n"],"version":3}

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

	@@ -1 +1 @@
1	- {"file":"kol-breadcrumb.js","mappings":";;;;;;;;;;;;AAAA,MAAM,eAAe,GAAG,s6BAAs6B;;MC8Bj7BA,eAAa;;;;;;;iBAgDO;MAC/B,UAAU,EAAE,GAAG;MACf,MAAM,EAAE,EAAE;KACV;;EAlDM,MAAM;IACZ,MAAM,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC;IAC/C,QACC,EAAC,IAAI,QACJ,yBAAiB,IAAI,CAAC,KAAK,CAAC,UAAU,IACrC,cACE,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,MAAM,KAAK,CAAC,KAC9B,cACC,gBAAU,UAAU,EAAC,EAAE,EAAC,KAAK,EAAC,sBAAsB,GAAG,WACnD,CACL,EACA,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAa;MAC1C,QACC,UAAI,GAAG,EAAE,KAAK,IACZ,KAAK,KAAK,CAAC,IAAI,gBAAU,UAAU,EAAC,EAAE,EAAC,KAAK,EAAC,+BAA+B,GAAG,EAC/E,KAAK,KAAK,SAAS,IACnB,gBACE,IAAI,CAAC,SAAS,IACd,gBAAU,UAAU,EAAE,IAAI,CAAC,MAAM,EAAE,KAAK,EAAE,OAAO,IAAI,CAAC,KAAK,KAAK,QAAQ,GAAG,IAAI,CAAC,KAAK,GAAG,8BAA8B,GAAI,KAE1H,EAAC,QAAQ,QAAE,IAAI,CAAC,MAAM,CAAY,CAClC,CACK,KAEP,8BAAU,QAAQ,EAAC,KAAK,IAAK,IAAI,IAAE,UAAU,EAAE,IAAI,CAAC,MAAM,KACxD,IAAI,CAAC,MAAM,CACF,CACX,CACG,EACJ;KACF,CAAC,CACE,CACA,CACA,EACN;GACF;EAkBM,iBAAiB,CAAC,KAAc;IACtC,WAAW,CAAC,IAAI,EAAE,YAAY,EAAE,KAAK,EAAE;MACtC,QAAQ,EAAE,IAAI;KACd,CAAC,CAAC;IACH,yBAAyB,CAAC,KAAK,CAAC,CAAC;GACjC;EAGM,aAAa,CAAC,KAAgC;IACpD,aAAa,CAAC,eAAe,EAAE,IAAI,EAAE,KAAK,CAAC,CAAC;GAC5C;EAEM,iBAAiB;IACvB,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;IACxC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;GAChC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["KolBreadcrumb"],"sources":["./src/components/breadcrumb/style.css?tag=kol-breadcrumb&mode=default&encapsulation=shadow","./src/components/breadcrumb/component.tsx"],"sourcesContent":["@import url(../style.css);\nli,\nul {\n\tmargin: 0;\n\tpadding: 0;\n\tlist-style: none;\n\tdisplay: flex;\n\tgap: 0.5em;\n\tflex-wrap: wrap;\n\tplace-items: center;\n}\nkol-icon::part(separator) {\n\tfont-weight: 900;\n\tfont-size: 0.7em;\n}\nkol-icon::part(separator):before {\n\tcontent: '\\f054';\n\tfont-family: 'Font Awesome 6 Free';\n}\n","import { Component, Fragment, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { LinkProps } from '../../types/button-link';\nimport { Stringified } from '../../types/common';\nimport { a11yHintLabelingLandmarks } from '../../utils/a11y.tipps';\nimport { watchString } from '../../utils/prop.validators';\nimport { watchNavLinks } from '../nav/validation';\n\ntype RequiredProps = {\n\tariaLabel: string;\n\tlinks: Stringified<LinkProps[]>;\n};\ntype OptionalProps = unknown;\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = {\n\tariaLabel: string;\n\tlinks: LinkProps[];\n};\ntype OptionalStates = OptionalProps;\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n@Component({\n\ttag: 'kol-breadcrumb',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolBreadcrumb implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\tpublic render(): JSX.Element {\n\t\tconst lastIndex = this.state._links.length - 1;\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<nav aria-label={this.state._ariaLabel}>\n\t\t\t\t\t<ul>\n\t\t\t\t\t\t{this.state._links.length === 0 && (\n\t\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t\t<kol-icon _ariaLabel=\"\" _icon=\"codicon codicon-home\" />…\n\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{this.state._links.map((link, index: number) => {\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<li key={index}>\n\t\t\t\t\t\t\t\t\t{index !== 0 && <kol-icon _ariaLabel=\"\" _icon=\"codicon codicon-chevron-right\" />}\n\t\t\t\t\t\t\t\t\t{index === lastIndex ? (\n\t\t\t\t\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t\t\t\t\t{link._iconOnly ? (\n\t\t\t\t\t\t\t\t\t\t\t\t<kol-icon _ariaLabel={link._label} _icon={typeof link._icon === 'string' ? link._icon : '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\t<Fragment>{link._label}</Fragment>\n\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t<kol-link _useCase=\"nav\" {...link} _ariaLabel={link._label}>\n\t\t\t\t\t\t\t\t\t\t\t{link._label}\n\t\t\t\t\t\t\t\t\t\t</kol-link>\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t})}\n\t\t\t\t\t</ul>\n\t\t\t\t</nav>\n\t\t\t</Host>\n\t\t);\n\t}\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 ~~Setzt~~ die Liste der darzustellenden Links.\n\t */\n\t@Prop() public _links!: Stringified<LinkProps[]>;\n\n\t@State() public state: States = {\n\t\t_ariaLabel: '…', // '⚠'\n\t\t_links: [],\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\ta11yHintLabelingLandmarks(value);\n\t}\n\n\t@Watch('_links')\n\tpublic validateLinks(value?: Stringified<LinkProps[]>): void {\n\t\twatchNavLinks('KolBreadcrumb', this, value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAriaLabel(this._ariaLabel);\n\t\tthis.validateLinks(this._links);\n\t}\n}\n"],"version":3}
1	+ {"file":"kol-breadcrumb.js","mappings":";;;;;;;;;;;;AAAA,MAAM,eAAe,GAAG,s6BAAs6B;;MC8Bj7BA,eAAa;;;;;;;iBAgDO;MAC/B,UAAU,EAAE,GAAG;MACf,MAAM,EAAE,EAAE;KACV;;EAlDM,MAAM;IACZ,MAAM,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC;IAC/C,QACC,EAAC,IAAI,QACJ,yBAAiB,IAAI,CAAC,KAAK,CAAC,UAAU,IACrC,cACE,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,MAAM,KAAK,CAAC,KAC9B,cACC,gBAAU,UAAU,EAAC,EAAE,EAAC,KAAK,EAAC,sBAAsB,GAAG,WACnD,CACL,EACA,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAa;MAC1C,QACC,UAAI,GAAG,EAAE,KAAK,IACZ,KAAK,KAAK,CAAC,IAAI,gBAAU,UAAU,EAAC,EAAE,EAAC,KAAK,EAAC,+BAA+B,GAAG,EAC/E,KAAK,KAAK,SAAS,IACnB,gBACE,IAAI,CAAC,SAAS,IACd,gBAAU,UAAU,EAAE,IAAI,CAAC,MAAM,EAAE,KAAK,EAAE,OAAO,IAAI,CAAC,KAAK,KAAK,QAAQ,GAAG,IAAI,CAAC,KAAK,GAAG,8BAA8B,GAAI,KAE1H,EAAC,QAAQ,QAAE,IAAI,CAAC,MAAM,CAAY,CAClC,CACK,KAEP,8BAAU,QAAQ,EAAC,KAAK,IAAK,IAAI,IAAE,UAAU,EAAE,IAAI,CAAC,MAAM,KACxD,IAAI,CAAC,MAAM,CACF,CACX,CACG,EACJ;KACF,CAAC,CACE,CACA,CACA,EACN;GACF;EAkBM,iBAAiB,CAAC,KAAc;IACtC,WAAW,CAAC,IAAI,EAAE,YAAY,EAAE,KAAK,EAAE;MACtC,QAAQ,EAAE,IAAI;KACd,CAAC,CAAC;IACH,yBAAyB,CAAC,KAAK,CAAC,CAAC;GACjC;EAGM,aAAa,CAAC,KAAgC;IACpD,aAAa,CAAC,eAAe,EAAE,IAAI,EAAE,KAAK,CAAC,CAAC;GAC5C;EAEM,iBAAiB;IACvB,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;IACxC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;GAChC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["KolBreadcrumb"],"sources":["./src/components/breadcrumb/style.css?tag=kol-breadcrumb&mode=default&encapsulation=shadow","./src/components/breadcrumb/component.tsx"],"sourcesContent":["@import url(../style.css);\nli,\nul {\n\tmargin: 0;\n\tpadding: 0;\n\tlist-style: none;\n\tdisplay: flex;\n\tgap: 0.5em;\n\tflex-wrap: wrap;\n\tplace-items: center;\n}\nkol-icon::part(separator) {\n\tfont-weight: 900;\n\tfont-size: 0.7em;\n}\nkol-icon::part(separator):before {\n\tcontent: '\\f054';\n\tfont-family: 'Font Awesome 6 Free';\n}\n","import { Component, Fragment, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { LinkProps } from '../../types/button-link';\nimport { Stringified } from '../../types/common';\nimport { a11yHintLabelingLandmarks } from '../../utils/a11y.tipps';\nimport { watchString } from '../../utils/prop.validators';\nimport { watchNavLinks } from '../nav/validation';\n\ntype RequiredProps = {\n\tariaLabel: string;\n\tlinks: Stringified<LinkProps[]>;\n};\ntype OptionalProps = unknown;\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = {\n\tariaLabel: string;\n\tlinks: LinkProps[];\n};\ntype OptionalStates = OptionalProps;\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n@Component({\n\ttag: 'kol-breadcrumb',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolBreadcrumb implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\tpublic render(): JSX.Element {\n\t\tconst lastIndex = this.state._links.length - 1;\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<nav aria-label={this.state._ariaLabel}>\n\t\t\t\t\t<ul>\n\t\t\t\t\t\t{this.state._links.length === 0 && (\n\t\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t\t<kol-icon _ariaLabel=\"\" _icon=\"codicon codicon-home\" />…\n\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{this.state._links.map((link, index: number) => {\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<li key={index}>\n\t\t\t\t\t\t\t\t\t{index !== 0 && <kol-icon _ariaLabel=\"\" _icon=\"codicon codicon-chevron-right\" />}\n\t\t\t\t\t\t\t\t\t{index === lastIndex ? (\n\t\t\t\t\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t\t\t\t\t{link._iconOnly ? (\n\t\t\t\t\t\t\t\t\t\t\t\t<kol-icon _ariaLabel={link._label} _icon={typeof link._icon === 'string' ? link._icon : '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\t<Fragment>{link._label}</Fragment>\n\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t<kol-link _useCase=\"nav\" {...link} _ariaLabel={link._label}>\n\t\t\t\t\t\t\t\t\t\t\t{link._label}\n\t\t\t\t\t\t\t\t\t\t</kol-link>\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t})}\n\t\t\t\t\t</ul>\n\t\t\t\t</nav>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/*\n\t Setzt die sichtbare oder semantische Beschriftung der Komponente (z.B. Aria-Label, Label, Headline, Caption, Summary usw.).\n\t /\n\t@Prop() public _ariaLabel!: string;\n\n\t/\n\t Gibt die Liste der darzustellenden Button, Links oder Texte an.\n\t */\n\t@Prop() public _links!: Stringified<LinkProps[]>;\n\n\t@State() public state: States = {\n\t\t_ariaLabel: '…', // '⚠'\n\t\t_links: [],\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\ta11yHintLabelingLandmarks(value);\n\t}\n\n\t@Watch('_links')\n\tpublic validateLinks(value?: Stringified<LinkProps[]>): void {\n\t\twatchNavLinks('KolBreadcrumb', this, value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAriaLabel(this._ariaLabel);\n\t\tthis.validateLinks(this._links);\n\t}\n}\n"],"version":3}

package/dist/components/kol-button-link.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"kol-button-link.js","mappings":";;;;;;;;;;AAAA,MAAM,eAAe,GAAG,+nCAA+nC;;MCgB1oCA,eAAa;;;;;IAIR,aAAQ,GAAG,CAAC,GAA4B;MACxD,IAAI,CAAC,GAAG,GAAG,GAAG,CAAC;MACf,cAAc,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC;KACpC,CAAC;;;;;;;~~qBAoEoD~~,KAAK;;qBAUL,KAAK;;;;;;~~yBA8BhB~~,KAAK;~~iBAKL~~,QAAQ;;;~~EA/G5C~~,MAAM;IACZ,QACC,EAAC,IAAI,QACJ,qBACC,GAAG,EAAE,IAAI,CAAC,QAAQ,EAClB,UAAU,EAAE,IAAI,CAAC,UAAU,EAC3B,aAAa,EAAE,IAAI,CAAC,aAAa,EACjC,YAAY,EAAE,IAAI,CAAC,YAAY,EAC/B,aAAa,EAAE,IAAI,CAAC,aAAa,EACjC,UAAU,EAAE,IAAI,CAAC,UAAU,EAC3B,aAAa,EAAE,IAAI,CAAC,aAAa,EACjC,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,KAAK,EAAC,MAAM,EACZ,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,aAAa,EAAE,IAAI,CAAC,aAAa,EACjC,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,MAAM,IAEnB,YAAM,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAC,QAAQ,GAAQ,CAC1B,CACV,EACN;GACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["KolButtonLink"],"sources":["./src/components/button-link/style.css?tag=kol-button-link&mode=default&encapsulation=shadow","./src/components/button-link/component.tsx"],"sourcesContent":["@import url(../link.css);\n","import { Component, Element, h, Host, JSX, Prop } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { AlternativButtonLinkRole, KoliBriButtonCallbacks, KoliBriButtonType, OptionalButtonLinkProps, RequiredButtonLinkProps } from '../../types/button-link';\nimport { Stringified } from '../../types/common';\nimport { KoliBriIconProp } from '../../types/icon';\nimport { propagateFocus } from '../../utils/reuse';\nimport { AriaCurrent, ~~Alignment~~ } from '../../types/props';\n\n@Component({\n\ttag: 'kol-button-link',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolButtonLink implements Generic.Element.Members<RequiredButtonLinkProps, OptionalButtonLinkProps> {\n\t@Element() private readonly host?: HTMLKolButtonLinkElement;\n\tprivate ref?: HTMLKolButtonWcElement;\n\n\tprivate readonly catchRef = (ref?: HTMLKolButtonWcElement) => {\n\t\tthis.ref = ref;\n\t\tpropagateFocus(this.host, this.ref);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<kol-button-wc\n\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t_accessKey={this._accessKey}\n\t\t\t\t\t_ariaControls={this._ariaControls}\n\t\t\t\t\t_ariaCurrent={this._ariaCurrent}\n\t\t\t\t\t_ariaExpanded={this._ariaExpanded}\n\t\t\t\t\t_ariaLabel={this._ariaLabel}\n\t\t\t\t\t_ariaSelected={this._ariaSelected}\n\t\t\t\t\t_disabled={this._disabled}\n\t\t\t\t\t_icon={this._icon}\n\t\t\t\t\t_iconOnly={this._iconOnly}\n\t\t\t\t\t_id={this._id}\n\t\t\t\t\t_label={this._label}\n\t\t\t\t\t_on={this._on}\n\t\t\t\t\t_role=\"link\"\n\t\t\t\t\t_tabIndex={this._tabIndex}\n\t\t\t\t\t_tooltipAlign={this._tooltipAlign}\n\t\t\t\t\t_type={this._type}\n\t\t\t\t\t_value={this._value}\n\t\t\t\t>\n\t\t\t\t\t<slot name=\"expert\" slot=\"expert\"></slot>\n\t\t\t\t</kol-button-wc>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/*\n\t Gibt an, mit welcher Tastenkombination man ~~den~~ ~~Button~~ auslösen oder fokussieren kann.\n\t /\n\t@Prop() public _accessKey?: string;\n\n\t/\n\t Gibt an, welche Elemente kontrolliert werden. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls)\n\t /\n\t@Prop() public _ariaControls?: string;\n\n\t/\n\t Gibt an, welchen aktuellen Auswahlstatus der ~~Button~~ hat. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current)\n\t /\n\t@Prop() public _ariaCurrent?: AriaCurrent;\n\n\t/\n\t Gibt an, ob durch ~~den~~ ~~Button~~ etwas aufgeklappt wurde. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded)\n\t /\n\t@Prop({ reflect: true }) public _ariaExpanded?: boolean;\n\n\t/\n\t ~~Gibt~~ ~~einen beschreibenden Text für den Screenreader an. Damit~~ die~~\n\t~~ * ~~Sprachsteuerung~~ ~~von~~ ~~interaktiven~~ ~~Elementen~~ ~~funktioniert,~~ ~~muss~~ der\n\t * Aria-Label~~-Text~~ ~~mit dem~~ Label~~-Text~~ ~~des~~ ~~Buttons~~ ~~beginnen.\n\t~~ \n\t - https://developer.~~mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label\~~n\t /\n\t@Prop({ mutable: true, reflect: false }) public _ariaLabel?: string;\n\n\t/\n\t Gibt an, ob Element ausgewählt ist (role=tab). (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected)\n\t /\n\t@Prop({ reflect: true }) public _ariaSelected?: boolean;\n\n\t/\n\t ~~Gibt~~ ~~an,~~ ob der ~~Button~~ ~~deaktiviert~~ ~~ist~~.\n\t /\n\t@Prop({ reflect: true }) public _disabled?: boolean = false;\n\n\t/\n\t Iconklasse (z.B.: \"codicon codicon-home\")\n\t /\n\t@Prop() public _icon?: Stringified<KoliBriIconProp>;\n\n\t/\n\t ~~Gibt~~ ~~an,~~ ob ~~nur~~ ~~das~~ ~~Icon~~ ~~angezeigt~~ ~~wird~~.\n\t /\n\t@Prop({ reflect: true }) public _iconOnly?: boolean = false;\n\n\t/\n\t Gibt die ID der ~~Schaltfläche~~ an~~. (Selection, Testing)\~~n\t /\n\t@Prop() public _id?: string;\n\n\t/\n\t Setzt ~~den~~ ~~sichtbaren~~ ~~Text~~ ~~des~~ ~~Elements~~.\n\t /\n\t@Prop() public _label!: string;\n\n\t/\n\t Gibt die EventCallback-Funktionen für die Button-Events an.\n\t /\n\t@Prop() public _on?: KoliBriButtonCallbacks<unknown>;\n\n\t/\n\t Gibt ~~an,~~ ~~welche~~ ~~Role~~ der ~~Schalter~~ ~~hat~~.\n\t /\n\t@Prop() public _role?: AlternativButtonLinkRole;\n\n\t/\n\t Gibt an, welchen Tab-Index der ~~Button~~ hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)\n\t /\n\t@Prop() public _tabIndex?: number;\n\n\t/\n\t Gibt an, ob der Tooltip oben, rechts, unten oder links angezeigt werden soll.\n\t /\n\t@Prop() public _tooltipAlign?: ~~Alignment~~ = 'top';\n\n\t/\n\t ~~Gibt~~ ~~an,~~ ~~welche~~ Typ der ~~Button~~ ~~hat~~.\n\t /\n\t@Prop() public _type?: KoliBriButtonType = 'button';\n\n\t/\n\t Gibt einen Wert an, den der Schalter bei einem Klick zurückgibt.\n\t */\n\t@Prop() public _value?: Stringified<unknown>;\n}\n"],"version":3}
1	+ {"file":"kol-button-link.js","mappings":";;;;;;;;;;AAAA,MAAM,eAAe,GAAG,+nCAA+nC;;MCgB1oCA,eAAa;;;;;IAIR,aAAQ,GAAG,CAAC,GAA4B;MACxD,IAAI,CAAC,GAAG,GAAG,GAAG,CAAC;MACf,cAAc,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC;KACpC,CAAC;;;;;;;qBAgEoD,KAAK;;qBAUL,KAAK;;;;;;yBA8BpB,KAAK;iBAKD,QAAQ;;;EA3G5C,MAAM;IACZ,QACC,EAAC,IAAI,QACJ,qBACC,GAAG,EAAE,IAAI,CAAC,QAAQ,EAClB,UAAU,EAAE,IAAI,CAAC,UAAU,EAC3B,aAAa,EAAE,IAAI,CAAC,aAAa,EACjC,YAAY,EAAE,IAAI,CAAC,YAAY,EAC/B,aAAa,EAAE,IAAI,CAAC,aAAa,EACjC,UAAU,EAAE,IAAI,CAAC,UAAU,EAC3B,aAAa,EAAE,IAAI,CAAC,aAAa,EACjC,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,KAAK,EAAC,MAAM,EACZ,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,aAAa,EAAE,IAAI,CAAC,aAAa,EACjC,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,MAAM,IAEnB,YAAM,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAC,QAAQ,GAAQ,CAC1B,CACV,EACN;GACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["KolButtonLink"],"sources":["./src/components/button-link/style.css?tag=kol-button-link&mode=default&encapsulation=shadow","./src/components/button-link/component.tsx"],"sourcesContent":["@import url(../link.css);\n","import { Component, Element, h, Host, JSX, Prop } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { AlternativButtonLinkRole, KoliBriButtonCallbacks, KoliBriButtonType, OptionalButtonLinkProps, RequiredButtonLinkProps } from '../../types/button-link';\nimport { Stringified } from '../../types/common';\nimport { KoliBriIconProp } from '../../types/icon';\nimport { propagateFocus } from '../../utils/reuse';\nimport { AriaCurrent, Align } from '../../types/props';\n\n@Component({\n\ttag: 'kol-button-link',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolButtonLink implements Generic.Element.Members<RequiredButtonLinkProps, OptionalButtonLinkProps> {\n\t@Element() private readonly host?: HTMLKolButtonLinkElement;\n\tprivate ref?: HTMLKolButtonWcElement;\n\n\tprivate readonly catchRef = (ref?: HTMLKolButtonWcElement) => {\n\t\tthis.ref = ref;\n\t\tpropagateFocus(this.host, this.ref);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<kol-button-wc\n\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t_accessKey={this._accessKey}\n\t\t\t\t\t_ariaControls={this._ariaControls}\n\t\t\t\t\t_ariaCurrent={this._ariaCurrent}\n\t\t\t\t\t_ariaExpanded={this._ariaExpanded}\n\t\t\t\t\t_ariaLabel={this._ariaLabel}\n\t\t\t\t\t_ariaSelected={this._ariaSelected}\n\t\t\t\t\t_disabled={this._disabled}\n\t\t\t\t\t_icon={this._icon}\n\t\t\t\t\t_iconOnly={this._iconOnly}\n\t\t\t\t\t_id={this._id}\n\t\t\t\t\t_label={this._label}\n\t\t\t\t\t_on={this._on}\n\t\t\t\t\t_role=\"link\"\n\t\t\t\t\t_tabIndex={this._tabIndex}\n\t\t\t\t\t_tooltipAlign={this._tooltipAlign}\n\t\t\t\t\t_type={this._type}\n\t\t\t\t\t_value={this._value}\n\t\t\t\t>\n\t\t\t\t\t<slot name=\"expert\" slot=\"expert\"></slot>\n\t\t\t\t</kol-button-wc>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/*\n\t Gibt an, mit welcher Tastenkombination man das interaktive Element der Komponente auslösen oder fokussieren kann.\n\t /\n\t@Prop() public _accessKey?: string;\n\n\t/\n\t Gibt an, welche Elemente kontrolliert werden. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls)\n\t /\n\t@Prop() public _ariaControls?: string;\n\n\t/\n\t Gibt an, welchen aktuellen Auswahlstatus das interaktive Element der Komponente hat. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current)\n\t /\n\t@Prop() public _ariaCurrent?: AriaCurrent;\n\n\t/\n\t Gibt an, ob durch das interaktive Element in der Komponente etwas aufgeklappt wurde. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded)\n\t /\n\t@Prop({ reflect: true }) public _ariaExpanded?: boolean;\n\n\t/\n\t Setzt die sichtbare oder semantische Beschriftung der Komponente (z.B. Aria-Label, Label, Headline, Caption, Summary usw.).\n\t /\n\t@Prop({ mutable: true, reflect: false }) public _ariaLabel?: string;\n\n\t/\n\t Gibt an, ob interaktive Element in der Komponente ausgewählt ist (z.B. role=tab). (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected)\n\t /\n\t@Prop({ reflect: true }) public _ariaSelected?: boolean;\n\n\t/\n\t Deaktiviert das interaktive Element in der Komponente und erlaubt keine Interaktion mehr damit.\n\t /\n\t@Prop({ reflect: true }) public _disabled?: boolean = false;\n\n\t/\n\t Setzt die Iconklasse (z.B.: `_icon=\"codicon codicon-home`).\n\t /\n\t@Prop() public _icon?: Stringified<KoliBriIconProp>;\n\n\t/\n\t Blendet die Beschriftung (Label) aus und zeigt sie stattdessen mittels eines Tooltips an.\n\t /\n\t@Prop({ reflect: true }) public _iconOnly?: boolean = false;\n\n\t/\n\t Gibt die interne ID des primären Elements in der Komponente an.\n\t /\n\t@Prop() public _id?: string;\n\n\t/\n\t Setzt die sichtbare oder semantische Beschriftung der Komponente (z.B. Aria-Label, Label, Headline, Caption, Summary usw.).\n\t /\n\t@Prop() public _label!: string;\n\n\t/\n\t Gibt die EventCallback-Funktionen für die Button-Events an.\n\t /\n\t@Prop() public _on?: KoliBriButtonCallbacks<unknown>;\n\n\t/\n\t Gibt die Rolle des primären Elements in der Komponente an.\n\t /\n\t@Prop() public _role?: AlternativButtonLinkRole;\n\n\t/\n\t Gibt an, welchen Tab-Index das primäre Element in der Komponente hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)\n\t /\n\t@Prop() public _tabIndex?: number;\n\n\t/\n\t Gibt an, ob der Tooltip bevorzugt entweder oben, rechts, unten oder links angezeigt werden soll.\n\t /\n\t@Prop() public _tooltipAlign?: Align = 'top';\n\n\t/\n\t Setzt den Typ der Komponente oder des interaktiven Elements in der Komponente an.\n\t /\n\t@Prop() public _type?: KoliBriButtonType = 'button';\n\n\t/\n\t Gibt einen Wert an, den der Schalter bei einem Klick zurückgibt.\n\t */\n\t@Prop() public _value?: Stringified<unknown>;\n}\n"],"version":3}

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

	@@ -1 +1 @@
1	- {"file":"kol-card.js","mappings":";;;;;;;AAeO,MAAM,iBAAiB,GAAG,CAAC,SAAoC,EAAE,KAAe;EACtF,YAAY,CAAC,SAAS,EAAE,YAAY,EAAE,KAAK,CAAC,CAAC;AAC9C,CAAC;;ACjBD,MAAM,eAAe,GAAG,itBAAitB;;MCqC5tBA,SAAO;;;;;sBA0BoC,KAAK;;;kBAiBrB,CAAC;iBAER;MAC/B,QAAQ,EAAE,GAAG;KACb;;EA9CM,MAAM;IACZ,QACC,EAAC,IAAI,QACJ,WAAK,KAAK,EAAC,MAAM,IAChB,WAAK,KAAK,EAAC,QAAQ,IAClB,sBAAgB,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,GAAmB,EACzF,YAAM,IAAI,EAAC,QAAQ,GAAQ,CACtB,EACN,WAAK,KAAK,EAAC,SAAS,IACnB,YAAM,IAAI,EAAC,SAAS,GAAQ,OAC5B,eAAQ,CACH,EACL,IAAI,CAAC,KAAK,CAAC,UAAU,KACrB,WAAK,KAAK,EAAC,QAAQ,IAClB,YAAM,IAAI,EAAC,QAAQ,GAAQ,CACtB,CACN,CACI,CACA,EACN;GACF;EA6BM,iBAAiB,CAAC,KAAe;IACvC,iBAAiB,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;GAC/B;EAGM,eAAe,CAAC,KAAc;IACpC,WAAW,CAAC,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE;MACpC,QAAQ,EAAE,IAAI;KACd,CAAC,CAAC;GACH;EAOM,gBAAgB,CAAC,KAAc;IACrC,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC;GAC5B;EAGM,aAAa,CAAC,KAAoB;IACxC,iBAAiB,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;GAC/B;EAEM,iBAAiB;IACvB,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;IACxC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,SAAS,CAAC,CAAC;IACtD,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;GAChC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["KolCard"],"sources":["./src/types/props/has-footer.ts","./src/components/card/style.css?tag=kol-card&mode=default&encapsulation=shadow","./src/components/card/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { watchBoolean } from '../../utils/prop.validators';\n\n/* types /\n/* de\n * Zeigt den slot=\"footer\" an.\n /\n/* en\n * Shows the slot=\"footer\".\n /\nexport type PropHasFooter = {\n\thasFooter: boolean;\n};\n\n/ validator /\nexport const validateHasFooter = (component: Generic.Element.Component, value?: boolean): void => {\n\twatchBoolean(component, '_hasFooter', value);\n};\n","@import url(../style.css);\n:host > div.card {\n\theight: 100%;\n}\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { HeadingLevel } from '../../types/heading-level';\nimport { watchString } from '../../utils/prop.validators';\nimport { watchHeadingLevel } from '../heading/validation';\nimport { PropHasFooter, validateHasFooter } from '../../types/props';\n\ntype RequiredProps = {\n\theading: string;\n};\ntype OptionalProps = {\n\t/\n\t @deprecated Use _headline instead\n\t /\n\theadline: string;\n\tlevel: HeadingLevel;\n} & PropHasFooter;\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = RequiredProps;\ntype OptionalStates = OptionalProps;\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n/\n @slot - Ermöglicht das Einfügen beliebigen HTML's in den Inhaltsbereich der Card.\n * @slot content - Ermöglicht das Einfügen beliebigen HTML's in den Inhaltsbereich der Card.\n * @slot header - Deprecated für Version 2: Ermöglicht das Einfügen beliebigen HTML's in den Kopfbereich unterhalb der Überschrift der Card.\n * @slot footer - Deprecated für Version 2: Ermöglicht das Einfügen beliebigen HTML's in den Fußbereich der Card.\n /\n@Component({\n\ttag: 'kol-card',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolCard implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<div class=\"card\">\n\t\t\t\t\t<div class=\"header\">\n\t\t\t\t\t\t<kol-heading-wc _label={this.state._heading} _level={this.state._level}></kol-heading-wc>\n\t\t\t\t\t\t<slot name=\"header\"></slot>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div class=\"content\">\n\t\t\t\t\t\t<slot name=\"content\"></slot> {/ Deprecated for version 2 /}\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</div>\n\t\t\t\t\t{this.state._hasFooter && (\n\t\t\t\t\t\t<div class=\"footer\">\n\t\t\t\t\t\t\t<slot name=\"footer\"></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 Macht den Footerbereich der Card sichtbar.\n\t /\n\t@Prop({ reflect: true }) public _hasFooter?: boolean = false;\n\n\t/\n\t Gibt die ~~Überschrift~~ der ~~Card~~ an.\n\t /\n\t@Prop() public _heading!: string;\n\n\t/\n\t Gibt die ~~Überschrift~~ der ~~Card~~ an.\n\t \n\t @deprecated Verwende stattdessen das Property _heading.\n\t /\n\t@Prop() public _headline?: string;\n\n\t/\n\t ~~Setzt~~ ~~den~~ H-Level, von 1 bis 6, ~~der~~ Überschrift.\n\t /\n\t@Prop() public _level?: HeadingLevel = 1;\n\n\t@State() public state: States = {\n\t\t_heading: '…', // '⚠'\n\t};\n\n\t@Watch('_hasFooter')\n\tpublic validateHasFooter(value?: boolean): void {\n\t\tvalidateHasFooter(this, value);\n\t}\n\n\t@Watch('_heading')\n\tpublic validateHeading(value?: string): void {\n\t\twatchString(this, '_heading', value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t * @deprecated\n\t */\n\t@Watch('_headline')\n\tpublic validateHeadline(value?: string): void {\n\t\tthis.validateHeading(value);\n\t}\n\n\t@Watch('_level')\n\tpublic validateLevel(value?: HeadingLevel): void {\n\t\twatchHeadingLevel(this, value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateHasFooter(this._hasFooter);\n\t\tthis.validateHeading(this._heading \|\| this._headline);\n\t\tthis.validateLevel(this._level);\n\t}\n}\n"],"version":3}
1	+ {"file":"kol-card.js","mappings":";;;;;;;AAeO,MAAM,iBAAiB,GAAG,CAAC,SAAoC,EAAE,KAAe;EACtF,YAAY,CAAC,SAAS,EAAE,YAAY,EAAE,KAAK,CAAC,CAAC;AAC9C,CAAC;;ACjBD,MAAM,eAAe,GAAG,itBAAitB;;MCqC5tBA,SAAO;;;;;sBA0BoC,KAAK;;;kBAiBrB,CAAC;iBAER;MAC/B,QAAQ,EAAE,GAAG;KACb;;EA9CM,MAAM;IACZ,QACC,EAAC,IAAI,QACJ,WAAK,KAAK,EAAC,MAAM,IAChB,WAAK,KAAK,EAAC,QAAQ,IAClB,sBAAgB,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,GAAmB,EACzF,YAAM,IAAI,EAAC,QAAQ,GAAQ,CACtB,EACN,WAAK,KAAK,EAAC,SAAS,IACnB,YAAM,IAAI,EAAC,SAAS,GAAQ,OAC5B,eAAQ,CACH,EACL,IAAI,CAAC,KAAK,CAAC,UAAU,KACrB,WAAK,KAAK,EAAC,QAAQ,IAClB,YAAM,IAAI,EAAC,QAAQ,GAAQ,CACtB,CACN,CACI,CACA,EACN;GACF;EA6BM,iBAAiB,CAAC,KAAe;IACvC,iBAAiB,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;GAC/B;EAGM,eAAe,CAAC,KAAc;IACpC,WAAW,CAAC,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE;MACpC,QAAQ,EAAE,IAAI;KACd,CAAC,CAAC;GACH;EAOM,gBAAgB,CAAC,KAAc;IACrC,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC;GAC5B;EAGM,aAAa,CAAC,KAAoB;IACxC,iBAAiB,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;GAC/B;EAEM,iBAAiB;IACvB,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;IACxC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,SAAS,CAAC,CAAC;IACtD,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;GAChC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["KolCard"],"sources":["./src/types/props/has-footer.ts","./src/components/card/style.css?tag=kol-card&mode=default&encapsulation=shadow","./src/components/card/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { watchBoolean } from '../../utils/prop.validators';\n\n/* types /\n/* de\n * Zeigt den slot=\"footer\" an.\n /\n/* en\n * Shows the slot=\"footer\".\n /\nexport type PropHasFooter = {\n\thasFooter: boolean;\n};\n\n/ validator /\nexport const validateHasFooter = (component: Generic.Element.Component, value?: boolean): void => {\n\twatchBoolean(component, '_hasFooter', value);\n};\n","@import url(../style.css);\n:host > div.card {\n\theight: 100%;\n}\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { HeadingLevel } from '../../types/heading-level';\nimport { watchString } from '../../utils/prop.validators';\nimport { watchHeadingLevel } from '../heading/validation';\nimport { PropHasFooter, validateHasFooter } from '../../types/props';\n\ntype RequiredProps = {\n\theading: string;\n};\ntype OptionalProps = {\n\t/\n\t @deprecated Use _headline instead\n\t /\n\theadline: string;\n\tlevel: HeadingLevel;\n} & PropHasFooter;\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = RequiredProps;\ntype OptionalStates = OptionalProps;\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n/\n @slot - Ermöglicht das Einfügen beliebigen HTML's in den Inhaltsbereich der Card.\n * @slot content - Ermöglicht das Einfügen beliebigen HTML's in den Inhaltsbereich der Card.\n * @slot header - Deprecated für Version 2: Ermöglicht das Einfügen beliebigen HTML's in den Kopfbereich unterhalb der Überschrift der Card.\n * @slot footer - Deprecated für Version 2: Ermöglicht das Einfügen beliebigen HTML's in den Fußbereich der Card.\n /\n@Component({\n\ttag: 'kol-card',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolCard implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<div class=\"card\">\n\t\t\t\t\t<div class=\"header\">\n\t\t\t\t\t\t<kol-heading-wc _label={this.state._heading} _level={this.state._level}></kol-heading-wc>\n\t\t\t\t\t\t<slot name=\"header\"></slot>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div class=\"content\">\n\t\t\t\t\t\t<slot name=\"content\"></slot> {/ Deprecated for version 2 /}\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</div>\n\t\t\t\t\t{this.state._hasFooter && (\n\t\t\t\t\t\t<div class=\"footer\">\n\t\t\t\t\t\t\t<slot name=\"footer\"></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 Macht den Footerbereich der Card sichtbar.\n\t /\n\t@Prop({ reflect: true }) public _hasFooter?: boolean = false;\n\n\t/\n\t Gibt die Beschriftung der Komponente an.\n\t /\n\t@Prop() public _heading!: string;\n\n\t/\n\t Gibt die Beschriftung der Komponente an.\n\t \n\t @deprecated Verwende stattdessen das Property _heading.\n\t /\n\t@Prop() public _headline?: string;\n\n\t/\n\t Gibt an, welchen H-Level von 1 bis 6 die Überschrift hat. Oder bei 0, ob es keine Überschrift ist und als fett gedruckter Text angezeigt werden soll.\n\t /\n\t@Prop() public _level?: HeadingLevel = 1;\n\n\t@State() public state: States = {\n\t\t_heading: '…', // '⚠'\n\t};\n\n\t@Watch('_hasFooter')\n\tpublic validateHasFooter(value?: boolean): void {\n\t\tvalidateHasFooter(this, value);\n\t}\n\n\t@Watch('_heading')\n\tpublic validateHeading(value?: string): void {\n\t\twatchString(this, '_heading', value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\t/\n\t @see: components/abbr/component.tsx (@Watch)\n\t * @deprecated\n\t */\n\t@Watch('_headline')\n\tpublic validateHeadline(value?: string): void {\n\t\tthis.validateHeading(value);\n\t}\n\n\t@Watch('_level')\n\tpublic validateLevel(value?: HeadingLevel): void {\n\t\twatchHeadingLevel(this, value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateHasFooter(this._hasFooter);\n\t\tthis.validateHeading(this._heading \|\| this._headline);\n\t\tthis.validateLevel(this._level);\n\t}\n}\n"],"version":3}

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

	@@ -1 +1 @@
1	- {"file":"kol-details.js","mappings":";;;;;;;;AAAA,MAAM,eAAe,GAAG,2qCAA2qC;;MC2BtrCA,YAAU;;;;;IA6Dd,YAAO,GAAG;MACjB,UAAU,CAAC;;QACV,IAAI,CAAC,KAAK,GAAG,MAAA,IAAI,CAAC,kBAAkB,0CAAE,IAAI,CAAC;OAC3C,EAAE,EAAE,CAAC,CAAC;KACP,CAAC;iBAhC+D,KAAK;;iBAOtC;MAC/B,QAAQ,EAAE,GAAG;KACb;;EAvCM,MAAM;IACZ,QACC,EAAC,IAAI,QACJ,eACC,GAAG,EAAE,CAAC,EAAE;QACP,IAAI,CAAC,kBAAkB,GAAG,EAAwB,CAAC;OACnD,EACD,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,IAEtB,eAAS,OAAO,EAAE,IAAI,CAAC,OAAO,IAC5B,IAAI,CAAC,KAAK,CAAC,KAAK,IAChB,gBAAU,UAAU,EAAC,EAAE,EAAC,KAAK,EAAC,8BAA8B,GAAG,KAE/D,gBAAU,UAAU,EAAC,EAAE,EAAC,KAAK,EAAC,+BAA+B,GAAG,CAChE,EACD,gBAAO,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAQ,CACzB,EACV,WAAK,KAAK,EAAC,SAAS,IACnB,6BACC,eAAQ,CACW,CACf,CACG,CACJ,EACN;GACF;EAiBM,YAAY,CAAC,KAAe;IAClC,YAAY,CAAC,IAAI,EAAE,OAAO,EAAE,KAAK,CAAC,CAAC;GACnC;EAGM,eAAe,CAAC,KAAc;IACpC,WAAW,CAAC,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE;MACpC,QAAQ,EAAE,IAAI;KACd,CAAC,CAAC;GACH;EAEM,iBAAiB;IACvB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC9B,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;GACpC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["KolDetails"],"sources":["./src/components/details/style.css?tag=kol-details&mode=default&encapsulation=shadow","./src/components/details/component.tsx"],"sourcesContent":["@import url(../style.css);\n@import url(../host-display-block.css);\ndetails {\n\tdisplay: grid;\n}\ndetails > summary {\n\tcursor: pointer;\n\tdisplay: flex;\n\tplace-items: center;\n}\ndetails > summary > span {\n\tborder-bottom-color: grey;\n\tborder-bottom-style: solid;\n}\ndetails > summary:focus > span,\ndetails > summary:hover > span,\ndetails[open] > summary > span {\n\tborder-bottom-color: #000;\n}\ndetails > kol-indented-text {\n\tmargin: 0.25em 0 0 0.5em;\n}\n@keyframes details-show {\n\tto {\n\t\topacity: 1;\n\t\tscale: 1;\n\t}\n}\n.content {\n\topacity: 0;\n\tscale: 1 0;\n\ttransform-origin: top;\n}\ndetails[open] > .content {\n\tanimation: 250ms ease-in-out forwards details-show;\n}\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { watchBoolean, watchString } from '../../utils/prop.validators';\n\ntype RequiredProps = {\n\tsummary: string;\n};\ntype OptionalProps = {\n\topen: boolean;\n};\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = RequiredProps;\ntype OptionalStates = OptionalProps;\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n/*\n @slot - Der Inhalt, der in der Detailbeschreibung angezeigt wird.\n /\n@Component({\n\ttag: 'kol-details',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolDetails implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\tprivate htmlDetailsElement?: HTMLDetailsElement;\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<details\n\t\t\t\t\tref={(el) => {\n\t\t\t\t\t\tthis.htmlDetailsElement = el as HTMLDetailsElement;\n\t\t\t\t\t}}\n\t\t\t\t\topen={this.state._open}\n\t\t\t\t>\n\t\t\t\t\t<summary onClick={this.onClick}>\n\t\t\t\t\t\t{this.state._open ? (\n\t\t\t\t\t\t\t<kol-icon _ariaLabel=\"\" _icon=\"codicon codicon-chevron-down\" />\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<kol-icon _ariaLabel=\"\" _icon=\"codicon codicon-chevron-right\" />\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<span>{this.state._summary}</span>\n\t\t\t\t\t</summary>\n\t\t\t\t\t<div class=\"content\">\n\t\t\t\t\t\t<kol-indented-text>\n\t\t\t\t\t\t\t<slot />\n\t\t\t\t\t\t</kol-indented-text>\n\t\t\t\t\t</div>\n\t\t\t\t</details>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/\n\t Gibt an, ob die ~~Detailbeschreibung~~ geöffnet oder geschlossen ist.\n\t /\n\t@Prop({ mutable: true, reflect: true }) public _open?: boolean = false;\n\n\t/\n\t Gibt die Zusammenfassung der Detailbeschreibung an.\n\t */\n\t@Prop() public _summary!: string;\n\n\t@State() public state: States = {\n\t\t_summary: '…', // '⚠'\n\t};\n\n\t@Watch('_open')\n\tpublic validateOpen(value?: boolean): void {\n\t\twatchBoolean(this, '_open', value);\n\t}\n\n\t@Watch('_summary')\n\tpublic validateSummary(value?: string): void {\n\t\twatchString(this, '_summary', value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateOpen(this._open);\n\t\tthis.validateSummary(this._summary);\n\t}\n\n\tprivate onClick = () => {\n\t\tsetTimeout(() => {\n\t\t\tthis._open = this.htmlDetailsElement?.open;\n\t\t}, 25);\n\t};\n}\n"],"version":3}
1	+ {"file":"kol-details.js","mappings":";;;;;;;;AAAA,MAAM,eAAe,GAAG,2qCAA2qC;;MC2BtrCA,YAAU;;;;;IA6Dd,YAAO,GAAG;MACjB,UAAU,CAAC;;QACV,IAAI,CAAC,KAAK,GAAG,MAAA,IAAI,CAAC,kBAAkB,0CAAE,IAAI,CAAC;OAC3C,EAAE,EAAE,CAAC,CAAC;KACP,CAAC;iBAhC+D,KAAK;;iBAOtC;MAC/B,QAAQ,EAAE,GAAG;KACb;;EAvCM,MAAM;IACZ,QACC,EAAC,IAAI,QACJ,eACC,GAAG,EAAE,CAAC,EAAE;QACP,IAAI,CAAC,kBAAkB,GAAG,EAAwB,CAAC;OACnD,EACD,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,IAEtB,eAAS,OAAO,EAAE,IAAI,CAAC,OAAO,IAC5B,IAAI,CAAC,KAAK,CAAC,KAAK,IAChB,gBAAU,UAAU,EAAC,EAAE,EAAC,KAAK,EAAC,8BAA8B,GAAG,KAE/D,gBAAU,UAAU,EAAC,EAAE,EAAC,KAAK,EAAC,+BAA+B,GAAG,CAChE,EACD,gBAAO,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAQ,CACzB,EACV,WAAK,KAAK,EAAC,SAAS,IACnB,6BACC,eAAQ,CACW,CACf,CACG,CACJ,EACN;GACF;EAiBM,YAAY,CAAC,KAAe;IAClC,YAAY,CAAC,IAAI,EAAE,OAAO,EAAE,KAAK,CAAC,CAAC;GACnC;EAGM,eAAe,CAAC,KAAc;IACpC,WAAW,CAAC,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE;MACpC,QAAQ,EAAE,IAAI;KACd,CAAC,CAAC;GACH;EAEM,iBAAiB;IACvB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC9B,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;GACpC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["KolDetails"],"sources":["./src/components/details/style.css?tag=kol-details&mode=default&encapsulation=shadow","./src/components/details/component.tsx"],"sourcesContent":["@import url(../style.css);\n@import url(../host-display-block.css);\ndetails {\n\tdisplay: grid;\n}\ndetails > summary {\n\tcursor: pointer;\n\tdisplay: flex;\n\tplace-items: center;\n}\ndetails > summary > span {\n\tborder-bottom-color: grey;\n\tborder-bottom-style: solid;\n}\ndetails > summary:focus > span,\ndetails > summary:hover > span,\ndetails[open] > summary > span {\n\tborder-bottom-color: #000;\n}\ndetails > kol-indented-text {\n\tmargin: 0.25em 0 0 0.5em;\n}\n@keyframes details-show {\n\tto {\n\t\topacity: 1;\n\t\tscale: 1;\n\t}\n}\n.content {\n\topacity: 0;\n\tscale: 1 0;\n\ttransform-origin: top;\n}\ndetails[open] > .content {\n\tanimation: 250ms ease-in-out forwards details-show;\n}\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { watchBoolean, watchString } from '../../utils/prop.validators';\n\ntype RequiredProps = {\n\tsummary: string;\n};\ntype OptionalProps = {\n\topen: boolean;\n};\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = RequiredProps;\ntype OptionalStates = OptionalProps;\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n/*\n @slot - Der Inhalt, der in der Detailbeschreibung angezeigt wird.\n /\n@Component({\n\ttag: 'kol-details',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolDetails implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\tprivate htmlDetailsElement?: HTMLDetailsElement;\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<details\n\t\t\t\t\tref={(el) => {\n\t\t\t\t\t\tthis.htmlDetailsElement = el as HTMLDetailsElement;\n\t\t\t\t\t}}\n\t\t\t\t\topen={this.state._open}\n\t\t\t\t>\n\t\t\t\t\t<summary onClick={this.onClick}>\n\t\t\t\t\t\t{this.state._open ? (\n\t\t\t\t\t\t\t<kol-icon _ariaLabel=\"\" _icon=\"codicon codicon-chevron-down\" />\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<kol-icon _ariaLabel=\"\" _icon=\"codicon codicon-chevron-right\" />\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<span>{this.state._summary}</span>\n\t\t\t\t\t</summary>\n\t\t\t\t\t<div class=\"content\">\n\t\t\t\t\t\t<kol-indented-text>\n\t\t\t\t\t\t\t<slot />\n\t\t\t\t\t\t</kol-indented-text>\n\t\t\t\t\t</div>\n\t\t\t\t</details>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/\n\t Gibt an, ob die Komponente entweder geöffnet oder geschlossen ist.\n\t /\n\t@Prop({ mutable: true, reflect: true }) public _open?: boolean = false;\n\n\t/\n\t Gibt die Zusammenfassung der Detailbeschreibung an.\n\t */\n\t@Prop() public _summary!: string;\n\n\t@State() public state: States = {\n\t\t_summary: '…', // '⚠'\n\t};\n\n\t@Watch('_open')\n\tpublic validateOpen(value?: boolean): void {\n\t\twatchBoolean(this, '_open', value);\n\t}\n\n\t@Watch('_summary')\n\tpublic validateSummary(value?: string): void {\n\t\twatchString(this, '_summary', value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateOpen(this._open);\n\t\tthis.validateSummary(this._summary);\n\t}\n\n\tprivate onClick = () => {\n\t\tsetTimeout(() => {\n\t\t\tthis._open = this.htmlDetailsElement?.open;\n\t\t}, 25);\n\t};\n}\n"],"version":3}

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

	@@ -1 +1 @@
1	- {"file":"kol-heading.js","mappings":";;;;;;AAAA,MAAM,eAAe,GAAG,syBAAsyB;;MCejzBA,YAAU;;;;;;;;;EACf,MAAM;IACZ,QACC,sBAAgB,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,kBAAkB,EAAE,IAAI,CAAC,kBAAkB,IACpG,eAAQ,CACQ,EAChB;GACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["KolHeading"],"sources":["./src/components/heading/style.css?tag=kol-heading&mode=default&encapsulation=shadow","./src/components/heading/shadow.tsx"],"sourcesContent":["@import url(../style.css);\n:host > kol-heading-wc {\n\tdisplay: grid;\n}\n:host > kol-heading-wc > .overline {\n\torder: 1;\n}\n:host > kol-heading-wc > .headline {\n\torder: 2;\n}\n","import { Component, h, JSX, Prop } from '@stencil/core';\n\nimport { HeadingLevel } from '../../types/heading-level';\nimport { Props } from './component';\n\n/*\n @slot - Inhalt der Überschrift.\n /\n@Component({\n\ttag: 'kol-heading',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolHeading implements Props {\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<kol-heading-wc _label={this._label} _level={this._level} _secondaryHeadline={this._secondaryHeadline}>\n\t\t\t\t<slot />\n\t\t\t</kol-heading-wc>\n\t\t);\n\t}\n\t/\n\t ~~Gibt~~ ~~den~~ ~~Text~~ der ~~Überschrift~~ an.\n\t /\n\t@Prop() public _label!: string;\n\n\t/\n\t Gibt an, welchen H-Level von 1 bis 6 die Überschrift hat. Oder ob es keine Überschrift ist, ~~sondern~~ ~~nur~~ fett ~~gedruckt~~.\n\t /\n\t@Prop() public _level?: HeadingLevel;\n\n\t/\n\t Gibt den Text der zusätzlichen Überschrift an.\n\t */\n\t@Prop() public _secondaryHeadline?: string;\n}\n"],"version":3}
1	+ {"file":"kol-heading.js","mappings":";;;;;;AAAA,MAAM,eAAe,GAAG,syBAAsyB;;MCejzBA,YAAU;;;;;;;;;EACf,MAAM;IACZ,QACC,sBAAgB,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,kBAAkB,EAAE,IAAI,CAAC,kBAAkB,IACpG,eAAQ,CACQ,EAChB;GACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["KolHeading"],"sources":["./src/components/heading/style.css?tag=kol-heading&mode=default&encapsulation=shadow","./src/components/heading/shadow.tsx"],"sourcesContent":["@import url(../style.css);\n:host > kol-heading-wc {\n\tdisplay: grid;\n}\n:host > kol-heading-wc > .overline {\n\torder: 1;\n}\n:host > kol-heading-wc > .headline {\n\torder: 2;\n}\n","import { Component, h, JSX, Prop } from '@stencil/core';\n\nimport { HeadingLevel } from '../../types/heading-level';\nimport { Props } from './component';\n\n/*\n @slot - Inhalt der Überschrift.\n /\n@Component({\n\ttag: 'kol-heading',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolHeading implements Props {\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<kol-heading-wc _label={this._label} _level={this._level} _secondaryHeadline={this._secondaryHeadline}>\n\t\t\t\t<slot />\n\t\t\t</kol-heading-wc>\n\t\t);\n\t}\n\t/\n\t Setzt die sichtbare oder semantische Beschriftung der Komponente (z.B. Aria-Label, Label, Headline, Caption, Summary usw.).\n\t /\n\t@Prop() public _label!: string;\n\n\t/\n\t Gibt an, welchen H-Level von 1 bis 6 die Überschrift hat. Oder bei 0, ob es keine Überschrift ist und als fett gedruckter Text angezeigt werden soll.\n\t /\n\t@Prop() public _level?: HeadingLevel;\n\n\t/\n\t Gibt den Text der zusätzlichen Überschrift an.\n\t */\n\t@Prop() public _secondaryHeadline?: string;\n}\n"],"version":3}

package/dist/components/kol-icon-font-awesome.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"kol-icon-font-awesome.js","mappings":";;;;;;MAsBaA,oBAAkB;;;;;;;;;EACvB,MAAM;IACZ,QACC,gBACC,WAAW,EAAE,OAAO,OAAO,IAAI,CAAC,KAAK,KAAK,QAAQ,GAAG,IAAI,IAAI,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE,EAC5E,UAAU,EAAE,IAAI,CAAC,UAAU,EAC3B,KAAK,EAAE,OAAO,IAAI,CAAC,OAAO,KAAK,QAAQ,IAAI,OAAO,IAAI,CAAC,KAAK,KAAK,QAAQ,GAAG,GAAG,IAAI,CAAC,OAAO,OAAO,IAAI,CAAC,KAAK,EAAE,GAAI,SAA+B,EACjJ,KAAK,EAAE,IAAI,CAAC,KAAK,GAChB,EACD;GACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["KolIconFontAwesome"],"sources":["./src/components/icon-font-awesome/component.tsx"],"sourcesContent":["import { Component, h, JSX, Prop } from '@stencil/core';\nimport { FontAwesome, FontAwesomeOssPrefix } from '../../enums/font-awesome';\n\nimport { Generic } from '@a11y-ui/core';\nimport { AriaLabel } from '../../types/aria-label';\n\ntype RequiredProps = AriaLabel & {\n\ticon: FontAwesome;\n\tprefix: FontAwesomeOssPrefix;\n};\ntype OptionalProps = {\n\tpart: string;\n};\n// type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\n/*\n @deprecated Wir empfehlen die flexiblere KolIcon-Komponente zu verwenden.\n /\n@Component({\n\ttag: 'kol-icon-font-awesome',\n\tshadow: false,\n})\nexport class KolIconFontAwesome implements Generic.Element.Members<RequiredProps, OptionalProps> {\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<kol-icon\n\t\t\t\texportparts={`icon${typeof this._part === 'string' ? `,${this._part}` : ''}`}\n\t\t\t\t_ariaLabel={this._ariaLabel}\n\t\t\t\t_icon={typeof this._prefix === 'string' && typeof this._icon === 'string' ? `${this._prefix} fa-${this._icon}` : (undefined as unknown as string)}\n\t\t\t\t_part={this._part}\n\t\t\t/>\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 Font Awesome Icons an. (https://fontawesome.com/v5.15/icons)\n\t /\n\t@Prop() public _icon!: FontAwesome;\n\n\t/\n\t Gibt den Prefix der Font Awesome Icons an. (https://fontawesome.com/v5.15/how-to-use/on-the-web/referencing-icons/basic-use)\n\t /\n\t@Prop() public _prefix!: FontAwesomeOssPrefix;\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"],"version":3}
1	+ {"file":"kol-icon-font-awesome.js","mappings":";;;;;;MAsBaA,oBAAkB;;;;;;;;;EACvB,MAAM;IACZ,QACC,gBACC,WAAW,EAAE,OAAO,OAAO,IAAI,CAAC,KAAK,KAAK,QAAQ,GAAG,IAAI,IAAI,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE,EAC5E,UAAU,EAAE,IAAI,CAAC,UAAU,EAC3B,KAAK,EAAE,OAAO,IAAI,CAAC,OAAO,KAAK,QAAQ,IAAI,OAAO,IAAI,CAAC,KAAK,KAAK,QAAQ,GAAG,GAAG,IAAI,CAAC,OAAO,OAAO,IAAI,CAAC,KAAK,EAAE,GAAI,SAA+B,EACjJ,KAAK,EAAE,IAAI,CAAC,KAAK,GAChB,EACD;GACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["KolIconFontAwesome"],"sources":["./src/components/icon-font-awesome/component.tsx"],"sourcesContent":["import { Component, h, JSX, Prop } from '@stencil/core';\nimport { FontAwesome, FontAwesomeOssPrefix } from '../../enums/font-awesome';\n\nimport { Generic } from '@a11y-ui/core';\nimport { AriaLabel } from '../../types/aria-label';\n\ntype RequiredProps = AriaLabel & {\n\ticon: FontAwesome;\n\tprefix: FontAwesomeOssPrefix;\n};\ntype OptionalProps = {\n\tpart: string;\n};\n// type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\n/*\n @deprecated Wir empfehlen die flexiblere KolIcon-Komponente zu verwenden.\n /\n@Component({\n\ttag: 'kol-icon-font-awesome',\n\tshadow: false,\n})\nexport class KolIconFontAwesome implements Generic.Element.Members<RequiredProps, OptionalProps> {\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<kol-icon\n\t\t\t\texportparts={`icon${typeof this._part === 'string' ? `,${this._part}` : ''}`}\n\t\t\t\t_ariaLabel={this._ariaLabel}\n\t\t\t\t_icon={typeof this._prefix === 'string' && typeof this._icon === 'string' ? `${this._prefix} fa-${this._icon}` : (undefined as unknown as string)}\n\t\t\t\t_part={this._part}\n\t\t\t/>\n\t\t);\n\t}\n\n\t/\n\t Setzt die sichtbare oder semantische Beschriftung der Komponente (z.B. Aria-Label, Label, Headline, Caption, Summary usw.).\n\t /\n\t@Prop() public _ariaLabel!: string;\n\n\t/\n\t Gibt einen Identifier eines Font Awesome Icons an. (https://fontawesome.com/v5.15/icons)\n\t /\n\t@Prop() public _icon!: FontAwesome;\n\n\t/\n\t Gibt den Prefix der Font Awesome Icons an. (https://fontawesome.com/v5.15/how-to-use/on-the-web/referencing-icons/basic-use)\n\t /\n\t@Prop() public _prefix!: FontAwesomeOssPrefix;\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"],"version":3}