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

package/dist/kolibri/kol-split-button.entry.js.map

@@ -1 +1 @@
-{"version":3,"names":["defaultStyleCss","KolSplitButton","this","clickHandler","e","state","_on","onClick","toggleDropdown","openDropdown","dropdown","dropdownContent","style","height","clientHeight","Object","assign","_showDropdown","closeDropdown","value","openIt","forceCounter","forceOpenDropdown","_a","setTimeout","catchDropdownElements","firstChild","_icon","_label","render","h","Host","class","button","_variant","_customClass","length","_accessKey","_ariaControls","_ariaCurrent","_ariaExpanded","_ariaLabel","_ariaSelected","_disabled","_iconOnly","_hideLabel","_role","_tabIndex","_tooltipAlign","_type","_value","ref","validateAccessKey","watchString","validateAriaControls","validateAriaCurrent","validateAriaExpanded","validateAriaLabel","validateAriaLabelWithLabel","validateAriaSelected","validateCustomClass","defaultValue","undefined","validateDisabled","a11yHintDisabled","validateHideLabel","validateIcon","validateIconOnly","validateLabel","validateLabelWithAriaLabel","validateOn","validateRole","validateShowDropdown","watchBoolean","validateTabIndex","validateTooltipAlign","watchTooltipAlignment","validateType","watchButtonType","validateValue","setState","validateVariant","watchButtonVariant","componentWillLoad"],"sources":["./src/components/split-button/style.css?tag=kol-split-button&mode=default&encapsulation=shadow","./src/components/split-button/component.tsx"],"sourcesContent":["@import url(../style.css);\n:host {\n\tdisplay: flex;\n\tposition: relative;\n}\n.main-button {\n\tflex-grow: 1;\n\ttext-align: left;\n}\n.main-button kol-span-wc {\n\tplace-items: start;\n}\n.secondary-button button {\n\theight: 100%;\n}\n.horizontal-line {\n\tbackground-color: rgba(0, 0, 0, 0.2);\n\tborder-radius: 2px;\n\theight: 70%;\n\tmargin-block: auto;\n\twidth: 1px;\n}\n/* popover */\n.popover {\n\theight: 0;\n\tleft: 0;\n\tmin-width: 100%;\n\toverflow: hidden;\n\tposition: absolute;\n\ttop: 100%;\n\ttransition: height 0.3s ease-in-out;\n}\n.popover-content {\n\tinset: 0 0 auto 0;\n\tmin-width: 100%;\n\tposition: absolute;\n}\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { API, KoliBriSplitButtonCallback, States } from './types';\nimport { setState, watchBoolean, watchString } from '../../utils/prop.validators';\nimport { Align, AriaCurrent, validateAriaCurrent, validateAriaExpanded, validateAriaSelected, validateDisabled, validateHideLabel } from '../../types/props';\nimport { validateAriaLabelWithLabel, validateLabelWithAriaLabel } from '../../types/props/label';\nimport { a11yHintDisabled } from '../../utils/a11y.tipps';\nimport { validateTabIndex } from '../../utils/validators/tab-index';\nimport { AlternativButtonLinkRole, KoliBriButtonType, KoliBriButtonVariant, watchTooltipAlignment } from '../../types/button-link';\nimport { watchButtonType, watchButtonVariant } from '../button/controller';\nimport { Stringified } from '../../types/common';\n\n/**\n * @slot - Ermöglicht das Einfügen beliebigen HTML's in das dropdown.\n */\n@Component({\n\ttag: 'kol-split-button',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolSplitButton implements API {\n\tprivate dropdown: HTMLDivElement | undefined;\n\tprivate dropdownContent: HTMLDivElement | undefined;\n\n\tprivate readonly clickHandler = (e: Event) => {\n\t\tif (typeof this.state._on.onClick === 'function') this.state._on.onClick(e);\n\t\telse this.toggleDropdown();\n\t};\n\n\tprivate readonly openDropdown = () => {\n\t\tif (this.dropdown && this.dropdownContent) {\n\t\t\tthis.dropdown.style.height = `${this.dropdownContent.clientHeight}px`;\n\t\t\tthis.state = { ...this.state, _showDropdown: true };\n\t\t}\n\t};\n\tprivate readonly closeDropdown = () => {\n\t\tif (this.dropdown && this.dropdownContent) {\n\t\t\tthis.dropdown.style.height = ``;\n\t\t\tthis.state = { ...this.state, _showDropdown: false };\n\t\t}\n\t};\n\tprivate readonly toggleDropdown = (value?: boolean) => {\n\t\tconst openIt = typeof value === 'boolean' ? value : !this.state._showDropdown;\n\t\tif (openIt) this.openDropdown();\n\t\telse this.closeDropdown();\n\t};\n\tprivate forceCounter = 100; // because the dropdown could be empty\n\tprivate readonly forceOpenDropdown = () => {\n\t\tif (this.forceCounter > 0) {\n\t\t\tif (this.dropdownContent?.clientHeight) this.openDropdown();\n\t\t\telse setTimeout(this.forceOpenDropdown, 10);\n\t\t\tthis.forceCounter--;\n\t\t}\n\t};\n\n\tprivate readonly catchDropdownElements = (e?: HTMLDivElement | null) => {\n\t\tif (e) {\n\t\t\tthis.dropdown = e;\n\t\t\tsetTimeout(() => {\n\t\t\t\tthis.dropdownContent = e.firstChild as HTMLDivElement;\n\t\t\t\tif (this._showDropdown) this.forceOpenDropdown();\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<kol-button-wc\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t'main-button': true,\n\t\t\t\t\t\tbutton: true,\n\t\t\t\t\t\t[this._variant as string]: this._variant !== 'custom',\n\t\t\t\t\t\t[this._customClass as string]: this._variant === 'custom' && typeof this._customClass === 'string' && this._customClass.length > 0,\n\t\t\t\t\t}}\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_customClass={this._customClass}\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._hideLabel}\n\t\t\t\t\t_label={this._label}\n\t\t\t\t\t_on={{ onClick: this.clickHandler }}\n\t\t\t\t\t_role={this._role}\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\t_variant={this._variant}\n\t\t\t\t></kol-button-wc>\n\t\t\t\t<div class=\"horizontal-line\"></div>\n\t\t\t\t<kol-button-wc\n\t\t\t\t\tclass=\"secondary-button\"\n\t\t\t\t\t_disabled={this._disabled}\n\t\t\t\t\t_icon-only\n\t\t\t\t\t_icon=\"codicon codicon-triangle-down\"\n\t\t\t\t\t_label={`dropdown ${this.state._showDropdown ? 'schließen' : 'öffnen'}`}\n\t\t\t\t\t_on={{ onClick: () => this.toggleDropdown() }}\n\t\t\t\t></kol-button-wc>\n\t\t\t\t<div class=\"popover\" ref={this.catchDropdownElements}>\n\t\t\t\t\t<div class=\"popover-content\">\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Gibt an, 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 * Gibt an, welche Custom-Class übergeben werden soll, wenn _variant=\"custom\" gesetzt ist.\n\t */\n\t@Prop() public _customClass?: string;\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 * Blendet die Beschriftung (Label) aus und zeigt sie stattdessen mittels eines Tooltips an.\n\t */\n\t@Prop({ reflect: true }) public _hideLabel?: boolean = false;\n\n\t/**\n\t * Setzt die Iconklasse (z.B.: `_icon=\"codicon codicon-home`).\n\t */\n\t@Prop() public _icon?: string;\n\n\t/**\n\t * Blendet die Beschriftung (Label) aus und zeigt sie stattdessen mittels eines Tooltips an.\n\t * @deprecated use _hide-label\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({ mutable: true, reflect: false }) 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?: { onClick: KoliBriSplitButtonCallback };\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 Rolle des primären Elements in der Komponente an.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _showDropdown?: 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, 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\t/**\n\t * Gibt an, welche Variante der Darstellung genutzt werden soll.\n\t */\n\t@Prop() public _variant?: KoliBriButtonVariant = 'normal';\n\n\t@State() public state: States = {\n\t\t_icon: '',\n\t\t_label: '',\n\t\t_on: {},\n\t\t_showDropdown: false,\n\t};\n\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\twatchString(this, '_accessKey', value);\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\tvalidateAriaExpanded(this, 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@Watch('_customClass')\n\tpublic validateCustomClass(value?: string): void {\n\t\twatchString(this, '_customClass', value, { defaultValue: undefined });\n\t}\n\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tvalidateDisabled(this, value);\n\t\tif (value) a11yHintDisabled();\n\t}\n\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tvalidateHideLabel(this, value);\n\t}\n\n\t@Watch('_icon')\n\tpublic validateIcon(value?: string): void {\n\t\twatchString(this, '_icon', value);\n\t}\n\n\t@Watch('_iconOnly')\n\tpublic validateIconOnly(value?: boolean): void {\n\t\tvalidateHideLabel(this, value);\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: string): void {\n\t\tvalidateLabelWithAriaLabel(this, value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: { onClick: KoliBriSplitButtonCallback }): void {\n\t\tif (typeof value === 'object' && value !== null) {\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('_showDropdown')\n\tpublic validateShowDropdown(value?: boolean): void {\n\t\twatchBoolean(this, '_showDropdown', value);\n\t\tthis.toggleDropdown(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('_tooltipAlign')\n\tpublic validateTooltipAlign(value?: Align): void {\n\t\twatchTooltipAlignment(this, '_tooltipAlign', value);\n\t}\n\n\t@Watch('_type')\n\tpublic validateType(value?: KoliBriButtonType): void {\n\t\twatchButtonType(this, '_type', value);\n\t}\n\n\t@Watch('_value')\n\tpublic validateValue(value?: Stringified<unknown>): void {\n\t\tsetState(this, '_value', value);\n\t}\n\n\t@Watch('_variant')\n\tpublic validateVariant(value?: KoliBriButtonVariant): void {\n\t\twatchButtonVariant(this, '_variant', value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAccessKey(this._accessKey);\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.validateCustomClass(this._customClass);\n\t\tthis.validateDisabled(this._disabled);\n\t\tthis.validateHideLabel(this._hideLabel);\n\t\tthis.validateIcon(this._icon);\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.validateShowDropdown(this._showDropdown);\n\t\tthis.validateTabIndex(this._tabIndex);\n\t\tthis.validateTooltipAlign(this._tooltipAlign);\n\t\tthis.validateType(this._type);\n\t\tthis.validateValue(this._value);\n\t\tthis.validateVariant(this._variant);\n\t}\n}\n"],"mappings":"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"}
+{"version":3,"names":["defaultStyleCss","KolSplitButton","this","clickHandler","e","state","_on","onClick","toggleDropdown","openDropdown","dropdown","dropdownContent","style","height","clientHeight","Object","assign","_showDropdown","closeDropdown","value","openIt","forceCounter","forceOpenDropdown","_a","setTimeout","catchDropdownElements","firstChild","_icon","_label","render","h","Host","class","button","_variant","_customClass","length","_accessKey","_ariaControls","_ariaCurrent","_ariaExpanded","_ariaLabel","_ariaSelected","_disabled","_hideLabel","_role","_tabIndex","_tooltipAlign","_type","_value","ref","validateAccessKey","watchString","validateAriaControls","validateAriaCurrent","validateAriaExpanded","validateAriaLabel","validateAriaLabelWithLabel","validateAriaSelected","validateCustomClass","defaultValue","undefined","validateDisabled","a11yHintDisabled","validateHideLabel","validateIcon","validateIconOnly","validateLabel","validateLabelWithAriaLabel","validateOn","validateRole","validateShowDropdown","watchBoolean","validateTabIndex","validateTooltipAlign","watchTooltipAlignment","validateType","watchButtonType","validateValue","setState","validateVariant","watchButtonVariant","componentWillLoad","_iconOnly"],"sources":["./src/components/split-button/style.css?tag=kol-split-button&mode=default&encapsulation=shadow","./src/components/split-button/component.tsx"],"sourcesContent":["@import url(../style.css);\n:host {\n\tdisplay: flex;\n\tposition: relative;\n}\n.main-button {\n\tflex-grow: 1;\n\ttext-align: left;\n}\n.main-button kol-span-wc {\n\tplace-items: start;\n}\n.secondary-button button {\n\theight: 100%;\n}\n.horizontal-line {\n\tbackground-color: rgba(0, 0, 0, 0.2);\n\tborder-radius: 2px;\n\theight: 70%;\n\tmargin-block: auto;\n\twidth: 1px;\n}\n/* popover */\n.popover {\n\theight: 0;\n\tleft: 0;\n\tmin-width: 100%;\n\toverflow: hidden;\n\tposition: absolute;\n\ttop: 100%;\n\ttransition: height 0.3s ease-in-out;\n}\n.popover-content {\n\tinset: 0 0 auto 0;\n\tmin-width: 100%;\n\tposition: absolute;\n}\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { API, KoliBriSplitButtonCallback, States } from './types';\nimport { setState, watchBoolean, watchString } from '../../utils/prop.validators';\nimport { Align, AriaCurrent, validateAriaCurrent, validateAriaExpanded, validateAriaSelected, validateDisabled, validateHideLabel } from '../../types/props';\nimport { validateAriaLabelWithLabel, validateLabelWithAriaLabel } from '../../types/props/label';\nimport { a11yHintDisabled } from '../../utils/a11y.tipps';\nimport { validateTabIndex } from '../../utils/validators/tab-index';\nimport { AlternativButtonLinkRole, KoliBriButtonType, KoliBriButtonVariant, watchTooltipAlignment } from '../../types/button-link';\nimport { watchButtonType, watchButtonVariant } from '../button/controller';\nimport { Stringified } from '../../types/common';\n\n/**\n * @slot - Ermöglicht das Einfügen beliebigen HTML's in das dropdown.\n */\n@Component({\n\ttag: 'kol-split-button',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolSplitButton implements API {\n\tprivate dropdown: HTMLDivElement | undefined;\n\tprivate dropdownContent: HTMLDivElement | undefined;\n\n\tprivate readonly clickHandler = (e: Event) => {\n\t\tif (typeof this.state._on.onClick === 'function') this.state._on.onClick(e);\n\t\telse this.toggleDropdown();\n\t};\n\n\tprivate readonly openDropdown = () => {\n\t\tif (this.dropdown && this.dropdownContent) {\n\t\t\tthis.dropdown.style.height = `${this.dropdownContent.clientHeight}px`;\n\t\t\tthis.state = { ...this.state, _showDropdown: true };\n\t\t}\n\t};\n\tprivate readonly closeDropdown = () => {\n\t\tif (this.dropdown && this.dropdownContent) {\n\t\t\tthis.dropdown.style.height = ``;\n\t\t\tthis.state = { ...this.state, _showDropdown: false };\n\t\t}\n\t};\n\tprivate readonly toggleDropdown = (value?: boolean) => {\n\t\tconst openIt = typeof value === 'boolean' ? value : !this.state._showDropdown;\n\t\tif (openIt) this.openDropdown();\n\t\telse this.closeDropdown();\n\t};\n\tprivate forceCounter = 100; // because the dropdown could be empty\n\tprivate readonly forceOpenDropdown = () => {\n\t\tif (this.forceCounter > 0) {\n\t\t\tif (this.dropdownContent?.clientHeight) this.openDropdown();\n\t\t\telse setTimeout(this.forceOpenDropdown, 10);\n\t\t\tthis.forceCounter--;\n\t\t}\n\t};\n\n\tprivate readonly catchDropdownElements = (e?: HTMLDivElement | null) => {\n\t\tif (e) {\n\t\t\tthis.dropdown = e;\n\t\t\tsetTimeout(() => {\n\t\t\t\tthis.dropdownContent = e.firstChild as HTMLDivElement;\n\t\t\t\tif (this._showDropdown) this.forceOpenDropdown();\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<kol-button-wc\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t'main-button': true,\n\t\t\t\t\t\tbutton: true,\n\t\t\t\t\t\t[this._variant as string]: this._variant !== 'custom',\n\t\t\t\t\t\t[this._customClass as string]: this._variant === 'custom' && typeof this._customClass === 'string' && this._customClass.length > 0,\n\t\t\t\t\t}}\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_customClass={this._customClass}\n\t\t\t\t\t_disabled={this._disabled}\n\t\t\t\t\t_icon={this._icon}\n\t\t\t\t\t_hideLabel={this._hideLabel}\n\t\t\t\t\t_label={this._label}\n\t\t\t\t\t_on={{ onClick: this.clickHandler }}\n\t\t\t\t\t_role={this._role}\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\t_variant={this._variant}\n\t\t\t\t></kol-button-wc>\n\t\t\t\t<div class=\"horizontal-line\"></div>\n\t\t\t\t<kol-button-wc\n\t\t\t\t\tclass=\"secondary-button\"\n\t\t\t\t\t_disabled={this._disabled}\n\t\t\t\t\t_hideLabel\n\t\t\t\t\t_icon=\"codicon codicon-triangle-down\"\n\t\t\t\t\t_label={`dropdown ${this.state._showDropdown ? 'schließen' : 'öffnen'}`}\n\t\t\t\t\t_on={{ onClick: () => this.toggleDropdown() }}\n\t\t\t\t></kol-button-wc>\n\t\t\t\t<div class=\"popover\" ref={this.catchDropdownElements}>\n\t\t\t\t\t<div class=\"popover-content\">\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Gibt an, 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 * Gibt an, welche Custom-Class übergeben werden soll, wenn _variant=\"custom\" gesetzt ist.\n\t */\n\t@Prop() public _customClass?: string;\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 * Blendet die Beschriftung (Label) aus und zeigt sie stattdessen mittels eines Tooltips an.\n\t */\n\t@Prop({ reflect: true }) public _hideLabel?: boolean = false;\n\n\t/**\n\t * Setzt die Iconklasse (z.B.: `_icon=\"codicon codicon-home`).\n\t */\n\t@Prop() public _icon?: string;\n\n\t/**\n\t * Blendet die Beschriftung (Label) aus und zeigt sie stattdessen mittels eines Tooltips an.\n\t * @deprecated use _hide-label\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({ mutable: true, reflect: false }) 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?: { onClick: KoliBriSplitButtonCallback };\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 Rolle des primären Elements in der Komponente an.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _showDropdown?: 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, 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\t/**\n\t * Gibt an, welche Variante der Darstellung genutzt werden soll.\n\t */\n\t@Prop() public _variant?: KoliBriButtonVariant = 'normal';\n\n\t@State() public state: States = {\n\t\t_icon: '',\n\t\t_label: '',\n\t\t_on: {},\n\t\t_showDropdown: false,\n\t};\n\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\twatchString(this, '_accessKey', value);\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\tvalidateAriaExpanded(this, 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@Watch('_customClass')\n\tpublic validateCustomClass(value?: string): void {\n\t\twatchString(this, '_customClass', value, { defaultValue: undefined });\n\t}\n\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tvalidateDisabled(this, value);\n\t\tif (value) a11yHintDisabled();\n\t}\n\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tvalidateHideLabel(this, value);\n\t}\n\n\t@Watch('_icon')\n\tpublic validateIcon(value?: string): void {\n\t\twatchString(this, '_icon', value);\n\t}\n\n\t@Watch('_iconOnly')\n\tpublic validateIconOnly(value?: boolean): void {\n\t\tthis.validateHideLabel(value);\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: string): void {\n\t\tvalidateLabelWithAriaLabel(this, value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: { onClick: KoliBriSplitButtonCallback }): void {\n\t\tif (typeof value === 'object' && value !== null) {\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('_showDropdown')\n\tpublic validateShowDropdown(value?: boolean): void {\n\t\twatchBoolean(this, '_showDropdown', value);\n\t\tthis.toggleDropdown(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('_tooltipAlign')\n\tpublic validateTooltipAlign(value?: Align): void {\n\t\twatchTooltipAlignment(this, '_tooltipAlign', value);\n\t}\n\n\t@Watch('_type')\n\tpublic validateType(value?: KoliBriButtonType): void {\n\t\twatchButtonType(this, '_type', value);\n\t}\n\n\t@Watch('_value')\n\tpublic validateValue(value?: Stringified<unknown>): void {\n\t\tsetState(this, '_value', value);\n\t}\n\n\t@Watch('_variant')\n\tpublic validateVariant(value?: KoliBriButtonVariant): void {\n\t\twatchButtonVariant(this, '_variant', value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAccessKey(this._accessKey);\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.validateCustomClass(this._customClass);\n\t\tthis.validateDisabled(this._disabled);\n\t\tthis.validateHideLabel(this._hideLabel || this._iconOnly);\n\t\tthis.validateIcon(this._icon);\n\t\tthis.validateLabel(this._label);\n\t\tthis.validateOn(this._on);\n\t\tthis.validateRole(this._role);\n\t\tthis.validateShowDropdown(this._showDropdown);\n\t\tthis.validateTabIndex(this._tabIndex);\n\t\tthis.validateTooltipAlign(this._tooltipAlign);\n\t\tthis.validateType(this._type);\n\t\tthis.validateValue(this._value);\n\t\tthis.validateVariant(this._variant);\n\t}\n}\n"],"mappings":"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"}

package/dist/kolibri/kol-symbol.entry.js

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{r as a,h as i,H as t}from"./index-34c3d6f8.js";import{w as e}from"./prop.validators-f81af56e.js";import{a as r}from"./i18n-87a7ecb7.js";import"./a11y.tipps-2e27f8e6.js";import"./dev.utils-157f0499.js";import"./reuse-3a02afb9.js";import"./index-ff788b4b.js";import"./index-bacdc4cb.js";const s=class{constructor(i){a(this,i),this._ariaLabel=void 0,this._symbol=void 0,this.state={_ariaLabel:r("kol-warning"),_symbol:"…"}}render(){return i(t,null,i("span",{"aria-label":this.state._ariaLabel,role:"term"},this.state._symbol))}validateAriaLabel(a){e(this,"_ariaLabel",a,{required:!0})}validateSymbol(a){e(this,"_symbol",a,{required:!0})}componentWillLoad(){this.validateAriaLabel(this._ariaLabel),this.validateSymbol(this._symbol)}static get watchers(){return{_ariaLabel:["validateAriaLabel"],_symbol:["validateSymbol"]}}};export{s as kol_symbol};
+import{r as a,h as i,H as e}from"./index-6ad587d0.js";import{w as t}from"./prop.validators-f81af56e.js";import{a as r}from"./i18n-3ed8125e.js";import"./a11y.tipps-2e27f8e6.js";import"./dev.utils-157f0499.js";import"./reuse-3a02afb9.js";import"./index-ff788b4b.js";import"./index-ebb14eab.js";const s=class{constructor(i){a(this,i),this._ariaLabel=void 0,this._symbol=void 0,this.state={_ariaLabel:r("kol-warning"),_symbol:"…"}}render(){return i(e,null,i("span",{"aria-label":this.state._ariaLabel,role:"term"},this.state._symbol))}validateAriaLabel(a){t(this,"_ariaLabel",a,{required:!0})}validateSymbol(a){t(this,"_symbol",a,{required:!0})}componentWillLoad(){this.validateAriaLabel(this._ariaLabel),this.validateSymbol(this._symbol)}static get watchers(){return{_ariaLabel:["validateAriaLabel"],_symbol:["validateSymbol"]}}};export{s as kol_symbol};

package/dist/kolibri/kol-table.entry.js

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{r as t,h as i,H as e}from"./index-34c3d6f8.js";import{s as n,w as o,g as s,p as a,a as l,o as r}from"./prop.validators-f81af56e.js";import{a as h}from"./i18n-87a7ecb7.js";import{d}from"./a11y.tipps-2e27f8e6.js";import"./dev.utils-157f0499.js";import"./reuse-3a02afb9.js";import"./index-ff788b4b.js";import"./index-bacdc4cb.js";const c=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}:host{display:block}:host{display:grid}:host>div.table{max-width:100%;order:1;overflow-x:auto;overflow-y:hidden}:host>div.table table{width:100%}th>div{display:grid;grid-template-columns:1fr auto;place-items:center}div.pagination{order:2}div.pagination,div.pagination>div:last-child{display:grid;place-items:center}@media (min-width: 1024px){div.pagination,div.pagination>div:last-child{grid-auto-flow:column}div.pagination kol-pagination{display:flex}}",f=[10,20,50,100],p=new Map,u=class{constructor(i){t(this,i),this.horizontal=!0,this.sortDirections=new Map,this.showPagination=!1,this.pageStartSlice=0,this.pageEndSlice=10,this.disableSort=!1,this.setSortDirection=(t,i)=>{this.sortDirections.clear(),this.sortDirections.set(t,i),this.sortFunction=t},this.handlePagination={onClick:(t,i)=>{var e;"function"==typeof(null===(e=this.state._pagination._on)||void 0===e?void 0:e.onClick)&&this.state._pagination._on.onClick(t,i),n(this,"_pagination",Object.assign(Object.assign({},this.state._pagination),{_page:i}))},onChangePage:(t,i)=>{var e;"function"==typeof(null===(e=this.state._pagination._on)||void 0===e?void 0:e.onChangePage)&&this.state._pagination._on.onChangePage(t,i),n(this,"_pagination",Object.assign(Object.assign({},this.state._pagination),{_page:i}))},onChangePageSize:(t,i)=>{var e;"function"==typeof(null===(e=this.state._pagination._on)||void 0===e?void 0:e.onChangePageSize)&&this.state._pagination._on.onChangePageSize(t,i),n(this,"_pagination",Object.assign(Object.assign({},this.state._pagination),{_pageSize:i})),n(this,"_pageSize",i)}},this.beforePatchPagination=(t,i,e,a)=>{"_pagination"===a&&(this.showPagination=!0===t||""===t||"object"==typeof t&&null!==t)},this.updateSortedData=()=>{let t=this.state._data;if("function"==typeof this.sortFunction)switch(this.sortDirections.get(this.sortFunction)){case"NOS":t=[...this.state._data];break;case"ASC":t=this.sortFunction([...this.state._data]);break;default:t=this.sortFunction([...this.state._data]).reverse()}n(this,"_sortedData",t)},this._caption=void 0,this._data=void 0,this._headers=void 0,this._minWidth=void 0,this._pagination=void 0,this.state={_caption:"…",_data:[],_headers:{horizontal:[],vertical:[]},_pagination:{_page:1,_pageSize:10,_total:0},_sortedData:[]}}validateCaption(t){o(this,"_caption",t,{required:!0})}validateData(t){s(t,(()=>{r(t,(()=>{void 0===t&&(t=[]);try{t=a(t)}catch(t){}Array.isArray(t)&&void 0===t.find((t=>!("object"==typeof t&&null!==t)))&&n(this,"_data",t,{afterPatch:()=>{const t=setTimeout((()=>{clearTimeout(t),this.updateSortedData()}))}})}))}))}validateHeaders(t){s(t,(()=>{r(t,(()=>{try{t=a(t)}catch(t){}l(this,"_headers",(t=>"object"==typeof t&&null!==t),new Set(["KoliBriTableHeaders"]),t,{hooks:{beforePatch:t=>{var i,e,a,o;const n=t;null===(i=n.horizontal)||void 0===i||i.forEach((t=>{t.forEach((t=>{"function"==typeof t.sort&&"string"==typeof t.sortDirection&&this.setSortDirection(t.sort,t.sortDirection)}))})),null===(e=n.vertical)||void 0===e||e.forEach((t=>{t.forEach((t=>{"function"==typeof t.sort&&"string"==typeof t.sortDirection&&this.setSortDirection(t.sort,t.sortDirection)}))})),n.horizontal&&n.vertical&&(null===(a=n.horizontal)||void 0===a?void 0:a.length)>0&&(null===(o=n.vertical)||void 0===o?void 0:o.length)>0&&(this.disableSort=!0,d("Table: You can not sort the table data, if horizontal and vertical headers are defined at the same time. (https://github.com/public-ui/kolibri/issues/2372)"))}}})}))}))}validateMinWidth(t){o(this,"_minWidth",t,{defaultValue:void 0})}validatePagination(t){try{t=a(t)}catch(t){}l(this,"_pagination",(()=>!0),new Set(["boolean","KoliBriTablePagination"]),t,{hooks:{beforePatch:this.beforePatchPagination}})}componentWillLoad(){this.validateCaption(this._caption),this.validateData(this._data),this.validateHeaders(this._headers),this.validateMinWidth(this._minWidth),this.validatePagination(this._pagination)}getNumberOfCols(t,i){let e=0;return t.forEach((t=>{let i=0;t.forEach((t=>{var e;return i+=null!==(e=t.colSpan)&&void 0!==e?e:1})),e<i&&(e=i)})),0===e&&(e=i.length),e}getNumberOfRows(t,i){let e=0;return t.forEach((t=>{let i=0;t.forEach((t=>{var e;return i+=null!==(e=t.rowSpan)&&void 0!==e?e:1})),e<i&&(e=i)})),0===e&&(e=i.length),e}filterHeaderKeys(t){const i=[];return t.forEach((t=>{t.forEach((t=>{"string"==typeof t.key&&i.push(t)}))})),i}getPrimaryHeader(t){var i,e;let a=this.filterHeaderKeys(null!==(i=t.horizontal)&&void 0!==i?i:[]);return this.horizontal=!0,0===a.length&&(a=this.filterHeaderKeys(null!==(e=t.vertical)&&void 0!==e?e:[]),a.length>0&&(this.horizontal=!1)),a}createDataField(t,i){i.horizontal=Array.isArray(null==i?void 0:i.horizontal)?i.horizontal:[],i.vertical=Array.isArray(null==i?void 0:i.vertical)?i.vertical:[];const e=this.getPrimaryHeader(i),a=this.getNumberOfCols(i.horizontal,t),o=this.getNumberOfRows(i.vertical,t),n=[],s=[],r=[];i.vertical.forEach(((t,i)=>{s[i]=0,r[i]=[]}));for(let l=0;l<o;l++){const o=[];i.vertical.forEach(((t,i)=>{let e=0;if(r[i].forEach((t=>e+=t)),e<=l){const a=t[l-e+s[i]];if("object"==typeof a){o.push(Object.assign(Object.assign({},a),{asTd:!1,data:{}}));let t=1;if("number"==typeof a.rowSpan&&a.rowSpan>1&&(t=a.rowSpan),r[i].push(t),"number"==typeof a.colSpan&&a.colSpan>1)for(let e=1;e<a.colSpan;e++)r[i+e].push(t);s[i]++}}}));for(let i=0;i<a;i++)!0===this.horizontal?"object"==typeof e[i]&&null!==e[i]&&"string"==typeof e[i].key&&"object"==typeof t[l]&&null!==t[l]&&o.push(Object.assign(Object.assign({},e[i]),{colSpan:void 0,data:t[l],label:t[l][e[i].key],rowSpan:void 0})):"object"==typeof e[l]&&null!==e[l]&&"string"==typeof e[l].key&&"object"==typeof t[i]&&null!==t[i]&&o.push(Object.assign(Object.assign({},e[l]),{colSpan:void 0,data:t[i],label:t[i][e[l].key],rowSpan:void 0}));n.push(o)}if(0===t.length){let t=0,e=0;Array.isArray(i.horizontal)&&i.horizontal.length>0&&i.horizontal[0].forEach((i=>{t+=i.colSpan||1})),Array.isArray(i.vertical)&&i.vertical.length>0&&(t-=i.vertical.length,i.vertical[0].forEach((t=>{e+=t.rowSpan||1})));const a={colSpan:t,label:h("kol-no-entries"),render:void 0,rowSpan:Math.max(e,1)};0===n.length?n.push([a]):n[0].push(a)}return n}selectDisplayedData(t,i,e){return"number"==typeof i&&i>0&&"number"==typeof e&&e>0?(this.pageStartSlice=i*(e-1),this.pageEndSlice=i*e>t.length?t.length:i*e,t.slice(this.pageStartSlice,this.pageEndSlice)):(this.pageStartSlice=0,this.pageEndSlice=t.length,t)}cellRender(t,i){i&&(clearTimeout(p.get(i)),p.set(i,setTimeout((()=>{if(clearTimeout(p.get(i)),"function"==typeof t.render){const e=t.render(i,{asTd:t.asTd,label:t.label,textAlign:t.textAlign,width:t.width},t.data,this.state._data);"string"==typeof e&&(i.innerHTML=e)}}))))}render(){var t,a;const o=this.selectDisplayedData(this.state._sortedData,this.showPagination?null!==(a=null===(t=this.state._pagination)||void 0===t?void 0:t._pageSize)&&void 0!==a?a:10:this.state._sortedData.length,this.state._pagination._page||1),n=this.createDataField(o,this.state._headers);return i(e,null,this.pageEndSlice>0&&this.showPagination&&i("div",{class:"pagination"},i("span",null,"Einträge ",this.pageEndSlice>0?this.pageStartSlice+1:0," bis ",this.pageEndSlice," von"," ",this.state._pagination._total||(Array.isArray(this.state._data)?this.state._data.length:0)," angezeigt"),i("div",null,i("kol-pagination",{_boundaryCount:this.state._pagination._boundaryCount,_customClass:this.state._pagination._customClass,_on:this.handlePagination,_page:this.state._pagination._page,_pageSize:this.state._pagination._pageSize,_pageSizeOptions:this.state._pagination._pageSizeOptions||f,_siblingCount:this.state._pagination._siblingCount,_tooltipAlign:"bottom",_total:this.state._pagination._total||this.state._data.length}))),i("div",{class:"table",tabindex:"0"},i("table",{style:{minWidth:this.state._minWidth}},i("caption",null,this.state._caption),Array.isArray(this.state._headers.horizontal)&&i("thead",null,this.state._headers.horizontal.map(((t,e)=>i("tr",{key:`thead-${e}`},t.map(((t,a)=>!0===t.asTd?i("td",{key:`thead-${e}-${a}-${t.label}`,class:{[t.textAlign]:"string"==typeof t.textAlign&&t.textAlign.length>0},colSpan:t.colSpan,rowSpan:t.rowSpan,style:{textAlign:t.textAlign,width:t.width},ref:"function"==typeof t.render?i=>{this.cellRender(t,i)}:void 0,innerHTML:"function"!=typeof t.render?t.label:""}):i("th",{key:`thead-${e}-${a}-${t.label}`,scope:"number"==typeof t.colSpan&&t.colSpan>1?"colgroup":"col",colSpan:t.colSpan,rowSpan:t.rowSpan,style:{textAlign:t.textAlign,width:t.width},"aria-sort":this.disableSort||"function"!=typeof t.sort?void 0:t.sort!==this.sortFunction||"NOS"===this.sortDirections.get(t.sort)||void 0===this.sortDirections.get(t.sort)?"none":"ASC"===this.sortDirections.get(t.sort)?"ascending":"descending","data-sort":`sort-${this.sortDirections.get(t.sort)}`},i("div",{class:"w-full flex gap-1 items-center"},i("div",{class:{"w-full":!0,[t.textAlign]:"string"==typeof t.textAlign&&t.textAlign.length>0},innerHTML:t.label,style:{textAlign:t.textAlign}}),!this.disableSort&&"function"==typeof t.sort&&i("kol-button",{exportparts:"icon",_ariaLabel:h("kol-change-order",{placeholders:{colLabel:t.label}}),_icon:t.sort!==this.sortFunction||"NOS"===this.sortDirections.get(t.sort)||void 0===this.sortDirections.get(t.sort)?"codicon codicon-fold":"ASC"===this.sortDirections.get(t.sort)?"codicon codicon-chevron-up":"codicon codicon-chevron-down",_iconOnly:!0,_label:h("kol-change-order",{placeholders:{colLabel:t.label}}),_on:{onClick:()=>{if("function"==typeof t.sort){switch(this.sortFunction=t.sort,this.sortDirections.get(this.sortFunction)){case"ASC":this.setSortDirection(this.sortFunction,"DESC");break;case"DESC":this.setSortDirection(this.sortFunction,"NOS");break;default:this.setSortDirection(this.sortFunction,"ASC")}this.updateSortedData()}}},_variant:"ghost"}))))))))),i("tbody",null,n.map(((t,e)=>i("tr",{key:`tbody-${e}`},t.map(((t,a)=>!1===t.asTd?i("th",{key:`tbody-${e}-${a}-${t.label}`,scope:"number"==typeof t.rowSpan&&t.rowSpan>1?"rowgroup":"row",colSpan:t.colSpan,rowSpan:t.rowSpan,style:{textAlign:t.textAlign,width:t.width},"aria-sort":this.disableSort||"function"!=typeof t.sort?void 0:t.sort!==this.sortFunction||"NOS"===this.sortDirections.get(t.sort)||void 0===this.sortDirections.get(t.sort)?"none":"ASC"===this.sortDirections.get(t.sort)?"ascending":"descending","data-sort":`sort-${this.sortDirections.get(t.sort)}`},i("div",{class:"w-full flex gap-1 items-center"},i("div",{class:{"w-full":!0,[t.textAlign]:"string"==typeof t.textAlign&&t.textAlign.length>0},innerHTML:t.label,style:{textAlign:t.textAlign}}),!this.disableSort&&"function"==typeof t.sort&&i("kol-button",{exportparts:"icon",_ariaLabel:h("kol-change-order",{placeholders:{colLabel:t.label}}),_icon:t.sort!==this.sortFunction||"NOS"===this.sortDirections.get(t.sort)||void 0===this.sortDirections.get(t.sort)?"codicon codicon-fold":"ASC"===this.sortDirections.get(t.sort)?"codicon codicon-chevron-up":"codicon codicon-chevron-down",_iconOnly:!0,_label:h("kol-change-order",{placeholders:{colLabel:t.label}}),_on:{onClick:()=>{if("function"==typeof t.sort){switch(this.sortFunction=t.sort,this.sortDirections.get(this.sortFunction)){case"ASC":this.setSortDirection(this.sortFunction,"DESC");break;case"DESC":this.setSortDirection(this.sortFunction,"NOS");break;default:this.setSortDirection(this.sortFunction,"ASC")}this.updateSortedData()}}},_variant:"ghost"}))):i("td",{key:`tbody-${e}-${a}-${t.label}`,class:{[t.textAlign]:"string"==typeof t.textAlign&&t.textAlign.length>0},colSpan:t.colSpan,rowSpan:t.rowSpan,style:{textAlign:t.textAlign,width:t.width},ref:"function"==typeof t.render?i=>{this.cellRender(t,i)}:void 0,innerHTML:"function"!=typeof t.render?t.label:""}))))))))))}static get watchers(){return{_caption:["validateCaption"],_data:["validateData"],_headers:["validateHeaders"],_minWidth:["validateMinWidth"],_pagination:["validatePagination"]}}};u.style={default:c};export{u as kol_table};
+import{r as t,h as i,H as e}from"./index-6ad587d0.js";import{s as n,w as o,g as s,p as a,a as l,o as h}from"./prop.validators-f81af56e.js";import{a as r}from"./i18n-3ed8125e.js";import{d}from"./a11y.tipps-2e27f8e6.js";import"./dev.utils-157f0499.js";import"./reuse-3a02afb9.js";import"./index-ff788b4b.js";import"./index-ebb14eab.js";const c=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}:host{display:block}:host{display:grid}:host>div.table{max-width:100%;order:1;overflow-x:auto;overflow-y:hidden}:host>div.table table{width:100%}th>div{display:grid;grid-template-columns:1fr auto;place-items:center}div.pagination{order:2}div.pagination,div.pagination>div:last-child{display:grid;place-items:center}@media (min-width: 1024px){div.pagination,div.pagination>div:last-child{grid-auto-flow:column}div.pagination kol-pagination{display:flex}}",f=[10,20,50,100],p=new Map,u=class{constructor(e){t(this,e),this.horizontal=!0,this.sortDirections=new Map,this.showPagination=!1,this.pageStartSlice=0,this.pageEndSlice=10,this.disableSort=!1,this.setSortDirection=(t,i)=>{this.sortDirections.clear(),this.sortDirections.set(t,i),this.sortFunction=t},this.handlePagination={onClick:(t,i)=>{var e;"function"==typeof(null===(e=this.state._pagination._on)||void 0===e?void 0:e.onClick)&&this.state._pagination._on.onClick(t,i),n(this,"_pagination",Object.assign(Object.assign({},this.state._pagination),{_page:i}))},onChangePage:(t,i)=>{var e;"function"==typeof(null===(e=this.state._pagination._on)||void 0===e?void 0:e.onChangePage)&&this.state._pagination._on.onChangePage(t,i),n(this,"_pagination",Object.assign(Object.assign({},this.state._pagination),{_page:i}))},onChangePageSize:(t,i)=>{var e;"function"==typeof(null===(e=this.state._pagination._on)||void 0===e?void 0:e.onChangePageSize)&&this.state._pagination._on.onChangePageSize(t,i),n(this,"_pagination",Object.assign(Object.assign({},this.state._pagination),{_pageSize:i})),n(this,"_pageSize",i)}},this.beforePatchPagination=(t,i,e,a)=>{"_pagination"===a&&(this.showPagination=!0===t||""===t||"object"==typeof t&&null!==t)},this.updateSortedData=()=>{let t=this.state._data;if("function"==typeof this.sortFunction)switch(this.sortDirections.get(this.sortFunction)){case"NOS":t=[...this.state._data];break;case"ASC":t=this.sortFunction([...this.state._data]);break;default:t=this.sortFunction([...this.state._data]).reverse()}n(this,"_sortedData",t)},this.renderTableRow=(t,e)=>i("tr",{key:`tbody-${e}`},t.map(((t,i)=>this.renderTableCell(t,e,i)))),this.renderTableCell=(t,e,a)=>!1===t.asTd?i("th",{key:`tbody-${e}-${a}-${t.label}`,scope:"number"==typeof t.rowSpan&&t.rowSpan>1?"rowgroup":"row",colSpan:t.colSpan,rowSpan:t.rowSpan,style:{textAlign:t.textAlign,width:t.width},"aria-sort":this.disableSort||"function"!=typeof t.sort?void 0:t.sort!==this.sortFunction||"NOS"===this.sortDirections.get(t.sort)||void 0===this.sortDirections.get(t.sort)?"none":"ASC"===this.sortDirections.get(t.sort)?"ascending":"descending","data-sort":`sort-${this.sortDirections.get(t.sort)}`},i("div",{class:"w-full flex gap-1 items-center"},i("div",{class:{"w-full":!0,[t.textAlign]:"string"==typeof t.textAlign&&t.textAlign.length>0},innerHTML:t.label,style:{textAlign:t.textAlign}}),!this.disableSort&&"function"==typeof t.sort&&i("kol-button",{exportparts:"icon",_ariaLabel:r("kol-change-order",{placeholders:{colLabel:t.label}}),_icon:t.sort!==this.sortFunction||"NOS"===this.sortDirections.get(t.sort)||void 0===this.sortDirections.get(t.sort)?"codicon codicon-fold":"ASC"===this.sortDirections.get(t.sort)?"codicon codicon-chevron-up":"codicon codicon-chevron-down",_hideLabel:!0,_label:r("kol-change-order",{placeholders:{colLabel:t.label}}),_on:{onClick:()=>{if("function"==typeof t.sort){switch(this.sortFunction=t.sort,this.sortDirections.get(this.sortFunction)){case"ASC":this.setSortDirection(this.sortFunction,"DESC");break;case"DESC":this.setSortDirection(this.sortFunction,"NOS");break;default:this.setSortDirection(this.sortFunction,"ASC")}this.updateSortedData()}}},_variant:"ghost"}))):i("td",{key:`tbody-${e}-${a}-${t.label}`,class:{[t.textAlign]:"string"==typeof t.textAlign&&t.textAlign.length>0},colSpan:t.colSpan,rowSpan:t.rowSpan,style:{textAlign:t.textAlign,width:t.width},ref:"function"==typeof t.render?i=>{this.cellRender(t,i)}:void 0,innerHTML:"function"!=typeof t.render?t.label:""}),this.renderFoot=()=>{const t=this.createDataField(this.state._dataFoot,this.state._headers,!0);return i("tfoot",null,t.map(this.renderTableRow))},this._caption=void 0,this._data=void 0,this._dataFoot=void 0,this._headers=void 0,this._minWidth=void 0,this._pagination=void 0,this.state={_caption:"…",_data:[],_dataFoot:[],_headers:{horizontal:[],vertical:[]},_pagination:{_page:1,_pageSize:10,_total:0},_sortedData:[]}}validateCaption(t){o(this,"_caption",t,{required:!0})}validateData(t){s(t,(()=>{h(t,(()=>{void 0===t&&(t=[]);try{t=a(t)}catch(t){}Array.isArray(t)&&void 0===t.find((t=>!("object"==typeof t&&null!==t)))&&n(this,"_data",t,{afterPatch:()=>{setTimeout(this.updateSortedData)}})}))}))}validateDataFoot(t){s(t,(()=>{h(t,(()=>{void 0===t&&(t=[]);try{t=a(t)}catch(t){}Array.isArray(t)&&void 0===t.find((t=>!("object"==typeof t&&null!==t)))&&n(this,"_dataFoot",t,{afterPatch:()=>{setTimeout(this.updateSortedData)}})}))}))}validateHeaders(t){s(t,(()=>{h(t,(()=>{try{t=a(t)}catch(t){}l(this,"_headers",(t=>"object"==typeof t&&null!==t),new Set(["KoliBriTableHeaders"]),t,{hooks:{beforePatch:t=>{var i,e,a,o;const n=t;null===(i=n.horizontal)||void 0===i||i.forEach((t=>{t.forEach((t=>{"function"==typeof t.sort&&"string"==typeof t.sortDirection&&this.setSortDirection(t.sort,t.sortDirection)}))})),null===(e=n.vertical)||void 0===e||e.forEach((t=>{t.forEach((t=>{"function"==typeof t.sort&&"string"==typeof t.sortDirection&&this.setSortDirection(t.sort,t.sortDirection)}))})),n.horizontal&&n.vertical&&(null===(a=n.horizontal)||void 0===a?void 0:a.length)>0&&(null===(o=n.vertical)||void 0===o?void 0:o.length)>0&&(this.disableSort=!0,d("Table: You can not sort the table data, if horizontal and vertical headers are defined at the same time. (https://github.com/public-ui/kolibri/issues/2372)"))}}})}))}))}validateMinWidth(t){o(this,"_minWidth",t,{defaultValue:void 0})}validatePagination(t){try{t=a(t)}catch(t){}l(this,"_pagination",(()=>!0),new Set(["boolean","KoliBriTablePagination"]),t,{hooks:{beforePatch:this.beforePatchPagination}})}componentWillLoad(){this.validateCaption(this._caption),this.validateData(this._data),this.validateDataFoot(this._dataFoot),this.validateHeaders(this._headers),this.validateMinWidth(this._minWidth),this.validatePagination(this._pagination)}getNumberOfCols(t,i){let e=0;return t.forEach((t=>{let i=0;t.forEach((t=>{var e;return i+=null!==(e=t.colSpan)&&void 0!==e?e:1})),e<i&&(e=i)})),0===e&&(e=i.length),e}getNumberOfRows(t,i){let e=0;return t.forEach((t=>{let i=0;t.forEach((t=>{var e;return i+=null!==(e=t.rowSpan)&&void 0!==e?e:1})),e<i&&(e=i)})),0===e?e=i.length:e-=this.state._dataFoot.length,e}filterHeaderKeys(t){const i=[];return t.forEach((t=>{t.forEach((t=>{"string"==typeof t.key&&i.push(t)}))})),i}getPrimaryHeader(t){var i,e;let a=this.filterHeaderKeys(null!==(i=t.horizontal)&&void 0!==i?i:[]);return this.horizontal=!0,0===a.length&&(a=this.filterHeaderKeys(null!==(e=t.vertical)&&void 0!==e?e:[]),a.length>0&&(this.horizontal=!1)),a}createDataField(t,i,e){i.horizontal=Array.isArray(null==i?void 0:i.horizontal)?i.horizontal:[],i.vertical=Array.isArray(null==i?void 0:i.vertical)?i.vertical:[];const a=this.getPrimaryHeader(i),o=this.getNumberOfCols(i.horizontal,t);let n=this.getNumberOfRows(i.vertical,t),s=0;e&&(s=n,n+=this.state._dataFoot.length);const l=[],h=[],c=[];i.vertical.forEach(((t,i)=>{h[i]=0,c[i]=[]}));for(let r=s;r<n;r++){const n=[];i.vertical.forEach(((t,i)=>{let e=0;if(c[i].forEach((t=>e+=t)),e<=r){const a=t[r-e+h[i]];if("object"==typeof a){n.push(Object.assign(Object.assign({},a),{asTd:!1,data:{}}));let t=1;if("number"==typeof a.rowSpan&&a.rowSpan>1&&(t=a.rowSpan),c[i].push(t),"number"==typeof a.colSpan&&a.colSpan>1)for(let e=1;e<a.colSpan;e++)c[i+e].push(t);h[i]++}}}));for(let i=0;i<o;i++)if(!0===this.horizontal){const o=e?this.state._dataFoot[r-s]:t[r];"object"==typeof a[i]&&null!==a[i]&&"string"==typeof a[i].key&&"object"==typeof o&&null!==o&&n.push(Object.assign(Object.assign({},a[i]),{colSpan:void 0,data:o,label:o[a[i].key],rowSpan:void 0}))}else"object"==typeof a[r]&&null!==a[r]&&"string"==typeof a[r].key&&"object"==typeof t[i]&&null!==t[i]&&n.push(Object.assign(Object.assign({},a[r]),{colSpan:void 0,data:t[i],label:t[i][a[r].key],rowSpan:void 0}));l.push(n)}if(0===t.length){let t=0,e=0;Array.isArray(i.horizontal)&&i.horizontal.length>0&&i.horizontal[0].forEach((i=>{t+=i.colSpan||1})),Array.isArray(i.vertical)&&i.vertical.length>0&&(t-=i.vertical.length,i.vertical[0].forEach((t=>{e+=t.rowSpan||1})));const a={colSpan:t,label:r("kol-no-entries"),render:void 0,rowSpan:Math.max(e,1)};0===l.length?l.push([a]):l[0].push(a)}return l}selectDisplayedData(t,i,e){return"number"==typeof i&&i>0&&"number"==typeof e&&e>0?(this.pageStartSlice=i*(e-1),this.pageEndSlice=i*e>t.length?t.length:i*e,t.slice(this.pageStartSlice,this.pageEndSlice)):(this.pageStartSlice=0,this.pageEndSlice=t.length,t)}cellRender(t,i){i&&(clearTimeout(p.get(i)),p.set(i,setTimeout((()=>{clearTimeout(p.get(i));const e=t.render(i,{asTd:t.asTd,label:t.label,textAlign:t.textAlign,width:t.width},t.data,this.state._data);"string"==typeof e&&(i.innerHTML=e)}))))}render(){var t,a;const o=this.selectDisplayedData(this.state._sortedData,this.showPagination?null!==(a=null===(t=this.state._pagination)||void 0===t?void 0:t._pageSize)&&void 0!==a?a:10:this.state._sortedData.length,this.state._pagination._page||1),n=this.createDataField(o,this.state._headers);return i(e,null,this.pageEndSlice>0&&this.showPagination&&i("div",{class:"pagination"},i("span",null,"Einträge ",this.pageEndSlice>0?this.pageStartSlice+1:0," bis ",this.pageEndSlice," von"," ",this.state._pagination._total||(Array.isArray(this.state._data)?this.state._data.length:0)," angezeigt"),i("div",null,i("kol-pagination",{_boundaryCount:this.state._pagination._boundaryCount,_customClass:this.state._pagination._customClass,_on:this.handlePagination,_page:this.state._pagination._page,_pageSize:this.state._pagination._pageSize,_pageSizeOptions:this.state._pagination._pageSizeOptions||f,_siblingCount:this.state._pagination._siblingCount,_tooltipAlign:"bottom",_total:this.state._pagination._total||this.state._data.length}))),i("div",{class:"table",tabindex:"0"},i("table",{style:{minWidth:this.state._minWidth}},i("caption",null,this.state._caption),Array.isArray(this.state._headers.horizontal)&&i("thead",null,this.state._headers.horizontal.map(((t,e)=>i("tr",{key:`thead-${e}`},t.map(((t,a)=>!0===t.asTd?i("td",{key:`thead-${e}-${a}-${t.label}`,class:{[t.textAlign]:"string"==typeof t.textAlign&&t.textAlign.length>0},colSpan:t.colSpan,rowSpan:t.rowSpan,style:{textAlign:t.textAlign,width:t.width},ref:"function"==typeof t.render?i=>{this.cellRender(t,i)}:void 0,innerHTML:"function"!=typeof t.render?t.label:""}):i("th",{key:`thead-${e}-${a}-${t.label}`,scope:"number"==typeof t.colSpan&&t.colSpan>1?"colgroup":"col",colSpan:t.colSpan,rowSpan:t.rowSpan,style:{textAlign:t.textAlign,width:t.width},"aria-sort":this.disableSort||"function"!=typeof t.sort?void 0:t.sort!==this.sortFunction||"NOS"===this.sortDirections.get(t.sort)||void 0===this.sortDirections.get(t.sort)?"none":"ASC"===this.sortDirections.get(t.sort)?"ascending":"descending","data-sort":`sort-${this.sortDirections.get(t.sort)}`},i("div",{class:"w-full flex gap-1 items-center"},i("div",{class:{"w-full":!0,[t.textAlign]:"string"==typeof t.textAlign&&t.textAlign.length>0},innerHTML:t.label,style:{textAlign:t.textAlign}}),!this.disableSort&&"function"==typeof t.sort&&i("kol-button",{exportparts:"icon",_ariaLabel:r("kol-change-order",{placeholders:{colLabel:t.label}}),_icon:t.sort!==this.sortFunction||"NOS"===this.sortDirections.get(t.sort)||void 0===this.sortDirections.get(t.sort)?"codicon codicon-fold":"ASC"===this.sortDirections.get(t.sort)?"codicon codicon-chevron-up":"codicon codicon-chevron-down",_hideLabel:!0,_label:r("kol-change-order",{placeholders:{colLabel:t.label}}),_on:{onClick:()=>{if("function"==typeof t.sort){switch(this.sortFunction=t.sort,this.sortDirections.get(this.sortFunction)){case"ASC":this.setSortDirection(this.sortFunction,"DESC");break;case"DESC":this.setSortDirection(this.sortFunction,"NOS");break;default:this.setSortDirection(this.sortFunction,"ASC")}this.updateSortedData()}}},_variant:"ghost"}))))))))),i("tbody",null,n.map(this.renderTableRow)),this.state._dataFoot.length>0?this.renderFoot():"")))}static get watchers(){return{_caption:["validateCaption"],_data:["validateData"],_dataFoot:["validateDataFoot"],_headers:["validateHeaders"],_minWidth:["validateMinWidth"],_pagination:["validatePagination"]}}};u.style={default:c};export{u as kol_table};

package/dist/kolibri/kol-table.entry.js.map

@@ -1 +1 @@
-{"version":3,"names":["defaultStyleCss","PAGINATION_OPTIONS","CELL_REFS","Map","KolTable","this","horizontal","sortDirections","showPagination","pageStartSlice","pageEndSlice","disableSort","setSortDirection","sort","direction","clear","set","sortFunction","handlePagination","onClick","event","page","_a","state","_pagination","_on","setState","Object","assign","_page","onChangePage","onChangePageSize","pageSize","_pageSize","beforePatchPagination","nextValue","_nextState","_component","key","updateSortedData","sortedData","_data","get","reverse","_caption","_headers","vertical","_total","_sortedData","validateCaption","value","watchString","required","validateData","emptyStringByArrayHandler","objectObjectHandler","parseJson","e","Array","isArray","find","dataTupel","undefined","afterPatch","timeout","setTimeout","clearTimeout","validateHeaders","watchValidator","Set","hooks","beforePatch","headers","forEach","header","cell","sortDirection","_b","_c","length","_d","devHint","validateMinWidth","defaultValue","validatePagination","componentWillLoad","_minWidth","getNumberOfCols","horizontalHeaders","data","max","row","count","col","colSpan","getNumberOfRows","verticalHeaders","rowSpan","filterHeaderKeys","primaryHeader","cells","push","getPrimaryHeader","createDataField","maxCols","maxRows","dataField","rowCount","rowSpans","_row","index","i","dataRow","sum","rows","asTd","k","j","label","colspan","rowspan","emptyCell","translate","render","Math","selectDisplayedData","slice","cellRender","el","html","textAlign","width","innerHTML","displayedData","h","Host","class","_boundaryCount","_customClass","_pageSizeOptions","_siblingCount","_tooltipAlign","tabindex","style","minWidth","map","cols","rowIdx","colIdx","ref","scope","exportparts","_ariaLabel","placeholders","colLabel","_icon","_iconOnly","_label","_variant"],"sources":["./src/components/table/style.css?tag=kol-table&mode=default&encapsulation=shadow","./src/components/table/component.tsx"],"sourcesContent":["@import url(../style.css);\n@import url(../host-display-block.css);\n:host {\n\tdisplay: grid;\n}\n:host > div.table {\n\tmax-width: 100%;\n\torder: 1;\n\toverflow-x: auto;\n\toverflow-y: hidden;\n}\n:host > div.table table {\n\twidth: 100%;\n}\nth > div {\n\tdisplay: grid;\n\tgrid-template-columns: 1fr auto;\n\tplace-items: center;\n}\ndiv.pagination {\n\torder: 2;\n}\ndiv.pagination,\ndiv.pagination > div:last-child {\n\tdisplay: grid;\n\tplace-items: center;\n}\n@media (min-width: 1024px) {\n\tdiv.pagination,\n\tdiv.pagination > div:last-child {\n\t\tgrid-auto-flow: column;\n\t}\n\tdiv.pagination kol-pagination {\n\t\tdisplay: flex;\n\t}\n}\n","/* eslint-disable jsx-a11y/no-noninteractive-tabindex */\nimport { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { Stringified } from '../../types/common';\nimport {\n\tKoliBriDataType,\n\tKoliBriSortDirection,\n\tKoliBriSortFunction,\n\tKoliBriTableCell,\n\tKoliBriTableHeaderCell,\n\tKoliBriTableHeaders,\n\tKoliBriTablePaginationProps,\n\tKoliBriTablePaginationStates,\n} from '../../types/table';\nimport { emptyStringByArrayHandler, objectObjectHandler, parseJson, setState, watchString, watchValidator } from '../../utils/prop.validators';\nimport { KoliBriPaginationButtonCallbacks } from '../pagination/types';\nimport { translate } from '../../i18n';\nimport { devHint } from '../../utils/a11y.tipps';\n\ntype KoliBriTableHeaderCellAndData = KoliBriTableHeaderCell & {\n\tdata: KoliBriDataType;\n};\n\ntype RequiredProps = {\n\tcaption: string;\n\tdata: Stringified<KoliBriDataType[]>;\n\theaders: Stringified<KoliBriTableHeaders>;\n};\ntype OptionalProps = {\n\tminWidth: string;\n\tpagination: boolean | Stringified<KoliBriTablePaginationProps>;\n};\n\ntype RequiredStates = {\n\tcaption: string;\n\tdata: KoliBriDataType[];\n\theaders: KoliBriTableHeaders;\n\tpagination: KoliBriTablePaginationStates;\n\tsortedData: KoliBriDataType[];\n};\ntype OptionalStates = {\n\tminWidth: string;\n\tsortDirection: KoliBriSortDirection;\n};\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\nconst PAGINATION_OPTIONS = [10, 20, 50, 100];\n\nconst CELL_REFS = new Map<HTMLElement, ReturnType<typeof setTimeout>>();\n\n@Component({\n\ttag: 'kol-table',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolTable implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\t// https://github.com/ionic-team/stencil/issues/2895 // was ist damit?\n\tprivate horizontal = true;\n\tprivate sortFunction?: KoliBriSortFunction;\n\tprivate sortDirections: Map<KoliBriSortFunction, KoliBriSortDirection> = new Map();\n\tprivate showPagination = false;\n\tprivate pageStartSlice = 0;\n\tprivate pageEndSlice = 10;\n\tprivate disableSort = 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 _caption!: string;\n\n\t/**\n\t * Gibt die Daten an, die für die Erstellung der Tabelle verwendet werden.\n\t */\n\t@Prop() public _data!: Stringified<KoliBriDataType[]>;\n\n\t/**\n\t * Gibt die horizontalen und vertikalen Header für die Tabelle an.\n\t */\n\t@Prop() public _headers!: Stringified<KoliBriTableHeaders>;\n\n\t/**\n\t * Gibt an, die minimale Breite der Tabelle an.\n\t */\n\t@Prop() public _minWidth?: string;\n\n\t/**\n\t * Gibt an, ob die Daten geteilt in Seiten angezeigt wird.\n\t */\n\t@Prop() public _pagination?: boolean | Stringified<KoliBriTablePaginationProps>;\n\n\t@State() public state: States = {\n\t\t_caption: '…', // ⚠ required\n\t\t_data: [],\n\t\t_headers: {\n\t\t\thorizontal: [],\n\t\t\tvertical: [],\n\t\t},\n\t\t_pagination: {\n\t\t\t_page: 1,\n\t\t\t_pageSize: 10,\n\t\t\t_total: 0,\n\t\t},\n\t\t_sortedData: [],\n\t};\n\n\t@Watch('_caption')\n\tpublic validateCaption(value?: string): void {\n\t\twatchString(this, '_caption', value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\t@Watch('_data')\n\tpublic validateData(value?: Stringified<KoliBriDataType[]>): void {\n\t\temptyStringByArrayHandler(value, () => {\n\t\t\tobjectObjectHandler(value, () => {\n\t\t\t\tif (typeof value === 'undefined') {\n\t\t\t\t\tvalue = [];\n\t\t\t\t}\n\t\t\t\ttry {\n\t\t\t\t\tvalue = parseJson<KoliBriDataType[]>(value);\n\t\t\t\t\t// eslint-disable-next-line no-empty\n\t\t\t\t} catch (e) {\n\t\t\t\t\t// value behält den ursprünglichen Wert\n\t\t\t\t}\n\t\t\t\tif (Array.isArray(value) && value.find((dataTupel: KoliBriDataType) => !(typeof dataTupel === 'object' && dataTupel !== null)) === undefined) {\n\t\t\t\t\tsetState(this, '_data', value, {\n\t\t\t\t\t\tafterPatch: () => {\n\t\t\t\t\t\t\t// TODO: kein guter Hack (endless loop)\n\t\t\t\t\t\t\tconst timeout = setTimeout(() => {\n\t\t\t\t\t\t\t\tclearTimeout(timeout);\n\t\t\t\t\t\t\t\tthis.updateSortedData();\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t},\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t});\n\t\t});\n\t}\n\n\tprivate setSortDirection = (sort: KoliBriSortFunction, direction: KoliBriSortDirection) => {\n\t\t/**\n\t\t * Durch des Clearen, ist es nicht möglich eine Mehr-Spalten-Sortierung\n\t\t * darzustellen. Das wäre der Fall, wenn man ggf. Daten in außerhalb der\n\t\t * Komponente sortiert und diese sortiert von außen rein gibt und der\n\t\t * Sortierungsalgorithmus mehrere Spalten zusammen sortierte.\n\t\t *\n\t\t * Beachte auch col.sort !== this.sortFunction\n\t\t */\n\t\tthis.sortDirections.clear();\n\t\tthis.sortDirections.set(sort, direction);\n\t\tthis.sortFunction = sort;\n\t};\n\n\t@Watch('_headers')\n\tpublic validateHeaders(value?: Stringified<KoliBriTableHeaders>): void {\n\t\t/**\n\t\t * - es darf maximal ein Header als primary markiert werden (last win)\n\t\t * - der primary-Header entscheidet implizit über _order und _orientation\n\t\t *   - primary-Headers müssen das key-Property setzen\n\t\t *   - nicht primary-Headers müssen das key-Property nicht setzen (wird ignoriert)\n\t\t *   - _order: wird durch den primary-Header geregelt\n\t\t *   - _orientation: wird durch den primary-Header geregelt\n\t\t * - sobald ein Header sortierbar ist, darf es nur noch entweder horizontale\n\t\t *   oder vertikale Header geben, aber nicht mehr beides\n\t\t */\n\t\temptyStringByArrayHandler(value, () => {\n\t\t\tobjectObjectHandler(value, () => {\n\t\t\t\ttry {\n\t\t\t\t\tvalue = parseJson<KoliBriTableHeaders>(value);\n\t\t\t\t\t// eslint-disable-next-line no-empty\n\t\t\t\t} catch (e) {\n\t\t\t\t\t// value behält den ursprünglichen Wert\n\t\t\t\t}\n\t\t\t\twatchValidator(this, '_headers', (value): boolean => typeof value === 'object' && value !== null, new Set(['KoliBriTableHeaders']), value, {\n\t\t\t\t\thooks: {\n\t\t\t\t\t\tbeforePatch: (nextValue: unknown) => {\n\t\t\t\t\t\t\tconst headers: KoliBriTableHeaders = nextValue as KoliBriTableHeaders;\n\t\t\t\t\t\t\theaders.horizontal?.forEach((header) => {\n\t\t\t\t\t\t\t\theader.forEach((cell) => {\n\t\t\t\t\t\t\t\t\tif (typeof cell.sort === 'function' && typeof cell.sortDirection === 'string') {\n\t\t\t\t\t\t\t\t\t\tthis.setSortDirection(cell.sort, cell.sortDirection);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\theaders.vertical?.forEach((header) => {\n\t\t\t\t\t\t\t\theader.forEach((cell) => {\n\t\t\t\t\t\t\t\t\tif (typeof cell.sort === 'function' && typeof cell.sortDirection === 'string') {\n\t\t\t\t\t\t\t\t\t\tthis.setSortDirection(cell.sort, cell.sortDirection);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\tif (headers.horizontal && headers.vertical && headers.horizontal?.length > 0 && headers.vertical?.length > 0) {\n\t\t\t\t\t\t\t\tthis.disableSort = true;\n\t\t\t\t\t\t\t\tdevHint(\n\t\t\t\t\t\t\t\t\t`Table: You can not sort the table data, if horizontal and vertical headers are defined at the same time. (https://github.com/public-ui/kolibri/issues/2372)`\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t},\n\t\t\t\t\t},\n\t\t\t\t});\n\t\t\t});\n\t\t});\n\t}\n\n\t@Watch('_minWidth')\n\tpublic validateMinWidth(value?: string): void {\n\t\twatchString(this, '_minWidth', value, {\n\t\t\tdefaultValue: undefined,\n\t\t});\n\t}\n\n\tprivate readonly handlePagination: KoliBriPaginationButtonCallbacks = {\n\t\tonClick: (event: Event, page: number) => {\n\t\t\tif (typeof this.state._pagination._on?.onClick === 'function') {\n\t\t\t\tthis.state._pagination._on.onClick(event, page);\n\t\t\t}\n\t\t\tsetState(this, '_pagination', {\n\t\t\t\t...this.state._pagination,\n\t\t\t\t_page: page,\n\t\t\t});\n\t\t},\n\t\tonChangePage: (event: Event, page: number) => {\n\t\t\tif (typeof this.state._pagination._on?.onChangePage === 'function') {\n\t\t\t\tthis.state._pagination._on.onChangePage(event, page);\n\t\t\t}\n\t\t\tsetState(this, '_pagination', {\n\t\t\t\t...this.state._pagination,\n\t\t\t\t_page: page,\n\t\t\t});\n\t\t},\n\t\tonChangePageSize: (event: Event, pageSize: number) => {\n\t\t\tif (typeof this.state._pagination._on?.onChangePageSize === 'function') {\n\t\t\t\tthis.state._pagination._on.onChangePageSize(event, pageSize);\n\t\t\t}\n\t\t\tsetState(this, '_pagination', {\n\t\t\t\t...this.state._pagination,\n\t\t\t\t_pageSize: pageSize,\n\t\t\t});\n\t\t\tsetState(this, '_pageSize', pageSize);\n\t\t},\n\t};\n\n\tprivate readonly beforePatchPagination: Generic.Element.NextStateHooksCallback = (nextValue, _nextState, _component, key): void => {\n\t\tif (key === '_pagination') {\n\t\t\tthis.showPagination = nextValue === true || nextValue === '' /* true */ || (typeof nextValue === 'object' && nextValue !== null);\n\t\t}\n\t};\n\n\t@Watch('_pagination')\n\tpublic validatePagination(value?: boolean | Stringified<KoliBriTablePaginationProps>): void {\n\t\ttry {\n\t\t\tvalue = parseJson<KoliBriTablePaginationProps>(value);\n\t\t\t// eslint-disable-next-line no-empty\n\t\t} catch (e) {\n\t\t\t// value behält den ursprünglichen Wert\n\t\t}\n\t\twatchValidator(this, '_pagination', () => true, new Set(['boolean', 'KoliBriTablePagination']), value, {\n\t\t\thooks: {\n\t\t\t\tbeforePatch: this.beforePatchPagination,\n\t\t\t},\n\t\t});\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateCaption(this._caption);\n\t\tthis.validateData(this._data);\n\t\tthis.validateHeaders(this._headers);\n\t\tthis.validateMinWidth(this._minWidth);\n\t\tthis.validatePagination(this._pagination);\n\t}\n\n\tprivate getNumberOfCols(horizontalHeaders: KoliBriTableHeaderCell[][], data: KoliBriDataType[]): number {\n\t\tlet max = 0;\n\t\thorizontalHeaders.forEach((row) => {\n\t\t\tlet count = 0;\n\t\t\trow.forEach((col) => (count += col.colSpan ?? 1));\n\t\t\tif (max < count) {\n\t\t\t\tmax = count;\n\t\t\t}\n\t\t});\n\t\tif (max === 0) {\n\t\t\tmax = data.length;\n\t\t}\n\t\treturn max;\n\t}\n\n\tprivate getNumberOfRows(verticalHeaders: KoliBriTableHeaderCell[][], data: KoliBriDataType[]): number {\n\t\tlet max = 0;\n\t\tverticalHeaders.forEach((col) => {\n\t\t\tlet count = 0;\n\t\t\tcol.forEach((row) => (count += row.rowSpan ?? 1));\n\t\t\tif (max < count) {\n\t\t\t\tmax = count;\n\t\t\t}\n\t\t});\n\t\tif (max === 0) {\n\t\t\tmax = data.length;\n\t\t}\n\t\treturn max;\n\t}\n\n\t// TODO: hier muss noch die order beachtet werden bei colspan und rowspan\n\tprivate filterHeaderKeys(headers: KoliBriTableHeaderCell[][]): KoliBriTableHeaderCell[] {\n\t\tconst primaryHeader: KoliBriTableHeaderCell[] = [];\n\t\theaders.forEach((cells) => {\n\t\t\tcells.forEach((cell) => {\n\t\t\t\tif (typeof cell.key === 'string') {\n\t\t\t\t\tprimaryHeader.push(cell);\n\t\t\t\t}\n\t\t\t});\n\t\t});\n\t\treturn primaryHeader;\n\t}\n\n\tprivate getPrimaryHeader(headers: KoliBriTableHeaders): KoliBriTableHeaderCell[] {\n\t\tlet primaryHeader: KoliBriTableHeaderCell[] = this.filterHeaderKeys(headers.horizontal ?? []);\n\t\tthis.horizontal = true;\n\t\tif (primaryHeader.length === 0) {\n\t\t\tprimaryHeader = this.filterHeaderKeys(headers.vertical ?? []);\n\t\t\tif (primaryHeader.length > 0) {\n\t\t\t\tthis.horizontal = false;\n\t\t\t}\n\t\t}\n\t\treturn primaryHeader;\n\t}\n\n\tprivate createDataField(data: KoliBriDataType[], headers: KoliBriTableHeaders): KoliBriTableCell[][] {\n\t\theaders.horizontal = Array.isArray(headers?.horizontal) ? headers.horizontal : [];\n\t\theaders.vertical = Array.isArray(headers?.vertical) ? headers.vertical : [];\n\t\tconst primaryHeader = this.getPrimaryHeader(headers);\n\t\tconst maxCols = this.getNumberOfCols(headers.horizontal, data);\n\t\tconst maxRows = this.getNumberOfRows(headers.vertical, data);\n\t\tconst dataField: KoliBriTableCell[][] = [];\n\n\t\tconst rowCount: number[] = [];\n\t\tconst rowSpans: number[][] = [];\n\t\theaders.vertical.forEach((_row, index) => {\n\t\t\trowCount[index] = 0;\n\t\t\trowSpans[index] = [];\n\t\t});\n\n\t\tfor (let i = 0; i < maxRows; i++) {\n\t\t\tconst dataRow: KoliBriTableHeaderCellAndData[] = [];\n\t\t\theaders.vertical.forEach((cells, index) => {\n\t\t\t\tlet sum = 0;\n\t\t\t\trowSpans[index].forEach((value) => (sum += value));\n\t\t\t\tif (sum <= i) {\n\t\t\t\t\tconst rows = cells[i - sum + rowCount[index]];\n\t\t\t\t\tif (typeof rows === 'object') {\n\t\t\t\t\t\tdataRow.push({\n\t\t\t\t\t\t\t...rows,\n\t\t\t\t\t\t\tasTd: false,\n\t\t\t\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n\t\t\t\t\t\t\tdata: {} as KoliBriDataType,\n\t\t\t\t\t\t});\n\t\t\t\t\t\tlet rowSpan = 1;\n\t\t\t\t\t\tif (typeof rows.rowSpan === 'number' && rows.rowSpan > 1) {\n\t\t\t\t\t\t\trowSpan = rows.rowSpan;\n\t\t\t\t\t\t}\n\t\t\t\t\t\trowSpans[index].push(rowSpan);\n\t\t\t\t\t\tif (typeof rows.colSpan === 'number' && rows.colSpan > 1) {\n\t\t\t\t\t\t\tfor (let k = 1; k < rows.colSpan; k++) {\n\t\t\t\t\t\t\t\trowSpans[index + k].push(rowSpan);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t\trowCount[index]++;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t});\n\t\t\tfor (let j = 0; j < maxCols; j++) {\n\t\t\t\tif (this.horizontal === true) {\n\t\t\t\t\tif (\n\t\t\t\t\t\ttypeof primaryHeader[j] === 'object' &&\n\t\t\t\t\t\tprimaryHeader[j] !== null &&\n\t\t\t\t\t\ttypeof primaryHeader[j].key === 'string' &&\n\t\t\t\t\t\ttypeof data[i] === 'object' &&\n\t\t\t\t\t\tdata[i] !== null\n\t\t\t\t\t) {\n\t\t\t\t\t\tdataRow.push({\n\t\t\t\t\t\t\t...primaryHeader[j],\n\t\t\t\t\t\t\tcolSpan: undefined,\n\t\t\t\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n\t\t\t\t\t\t\tdata: data[i],\n\t\t\t\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n\t\t\t\t\t\t\tlabel: data[i][primaryHeader[j].key as unknown as string] as string,\n\t\t\t\t\t\t\trowSpan: undefined,\n\t\t\t\t\t\t});\n\t\t\t\t\t}\n\t\t\t\t} else {\n\t\t\t\t\tif (\n\t\t\t\t\t\ttypeof primaryHeader[i] === 'object' &&\n\t\t\t\t\t\tprimaryHeader[i] !== null &&\n\t\t\t\t\t\ttypeof primaryHeader[i].key === 'string' &&\n\t\t\t\t\t\ttypeof data[j] === 'object' &&\n\t\t\t\t\t\tdata[j] !== null\n\t\t\t\t\t) {\n\t\t\t\t\t\tdataRow.push({\n\t\t\t\t\t\t\t...primaryHeader[i],\n\t\t\t\t\t\t\tcolSpan: undefined,\n\t\t\t\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n\t\t\t\t\t\t\tdata: data[j],\n\t\t\t\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n\t\t\t\t\t\t\tlabel: data[j][primaryHeader[i].key as unknown as number] as string,\n\t\t\t\t\t\t\trowSpan: undefined,\n\t\t\t\t\t\t});\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t\tdataField.push(dataRow);\n\t\t}\n\t\tif (data.length === 0) {\n\t\t\tlet colspan = 0;\n\t\t\tlet rowspan = 0;\n\t\t\tif (Array.isArray(headers.horizontal) && headers.horizontal.length > 0) {\n\t\t\t\theaders.horizontal[0].forEach((col) => {\n\t\t\t\t\tcolspan += col.colSpan || 1;\n\t\t\t\t});\n\t\t\t}\n\t\t\tif (Array.isArray(headers.vertical) && headers.vertical.length > 0) {\n\t\t\t\tcolspan -= headers.vertical.length;\n\t\t\t\theaders.vertical[0].forEach((row) => {\n\t\t\t\t\trowspan += row.rowSpan || 1;\n\t\t\t\t});\n\t\t\t}\n\t\t\tconst emptyCell = {\n\t\t\t\tcolSpan: colspan,\n\t\t\t\tlabel: translate('kol-no-entries'),\n\t\t\t\trender: undefined,\n\t\t\t\trowSpan: Math.max(rowspan, 1),\n\t\t\t};\n\t\t\tif (dataField.length === 0) {\n\t\t\t\tdataField.push([emptyCell]);\n\t\t\t} else {\n\t\t\t\tdataField[0].push(emptyCell);\n\t\t\t}\n\t\t}\n\t\treturn dataField;\n\t}\n\n\tprivate selectDisplayedData(data: KoliBriDataType[], pageSize: number, page: number): KoliBriDataType[] {\n\t\tif (typeof pageSize === 'number' && pageSize > 0 && typeof page === 'number' && page > 0) {\n\t\t\tthis.pageStartSlice = pageSize * (page - 1);\n\t\t\tthis.pageEndSlice = pageSize * page > data.length ? data.length : pageSize * page;\n\t\t\treturn data.slice(this.pageStartSlice, this.pageEndSlice);\n\t\t} else {\n\t\t\tthis.pageStartSlice = 0;\n\t\t\tthis.pageEndSlice = data.length;\n\t\t\treturn data;\n\t\t}\n\t}\n\n\tprivate cellRender(col: KoliBriTableHeaderCellAndData, el?: HTMLElement): void {\n\t\tif (el /* SSR instanceof HTMLElement */) {\n\t\t\tclearTimeout(CELL_REFS.get(el));\n\t\t\tCELL_REFS.set(\n\t\t\t\tel,\n\t\t\t\tsetTimeout(() => {\n\t\t\t\t\tclearTimeout(CELL_REFS.get(el));\n\t\t\t\t\tif (typeof col.render === 'function') {\n\t\t\t\t\t\tconst html = col.render(\n\t\t\t\t\t\t\tel,\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tasTd: col.asTd,\n\t\t\t\t\t\t\t\tlabel: col.label,\n\t\t\t\t\t\t\t\ttextAlign: col.textAlign,\n\t\t\t\t\t\t\t\twidth: col.width,\n\t\t\t\t\t\t\t} as KoliBriTableHeaderCell,\n\t\t\t\t\t\t\tcol.data,\n\t\t\t\t\t\t\tthis.state._data\n\t\t\t\t\t\t);\n\t\t\t\t\t\tif (typeof html === 'string') {\n\t\t\t\t\t\t\tel.innerHTML = html;\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t\t);\n\t\t}\n\t}\n\n\tprivate updateSortedData = () => {\n\t\tlet sortedData: KoliBriDataType[] = this.state._data;\n\t\tif (typeof this.sortFunction === 'function') {\n\t\t\tswitch (this.sortDirections.get(this.sortFunction)) {\n\t\t\t\tcase 'NOS':\n\t\t\t\t\tsortedData = [...this.state._data];\n\t\t\t\t\tbreak;\n\t\t\t\tcase 'ASC':\n\t\t\t\t\tsortedData = this.sortFunction([...this.state._data]);\n\t\t\t\t\tbreak;\n\t\t\t\tdefault:\n\t\t\t\t\tsortedData = this.sortFunction([...this.state._data]).reverse();\n\t\t\t}\n\t\t}\n\t\tsetState(this, '_sortedData', sortedData);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst displayedData: KoliBriDataType[] = this.selectDisplayedData(\n\t\t\tthis.state._sortedData,\n\t\t\tthis.showPagination ? this.state._pagination?._pageSize ?? 10 : this.state._sortedData.length,\n\t\t\tthis.state._pagination._page || 1\n\t\t);\n\t\tconst dataField = this.createDataField(displayedData, this.state._headers);\n\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t{this.pageEndSlice > 0 && this.showPagination && (\n\t\t\t\t\t<div class=\"pagination\">\n\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\tEinträge {this.pageEndSlice > 0 ? this.pageStartSlice + 1 : 0} bis {this.pageEndSlice} von{' '}\n\t\t\t\t\t\t\t{this.state._pagination._total || (Array.isArray(this.state._data) ? this.state._data.length : 0)} angezeigt\n\t\t\t\t\t\t</span>\n\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t<kol-pagination\n\t\t\t\t\t\t\t\t_boundaryCount={this.state._pagination._boundaryCount}\n\t\t\t\t\t\t\t\t_customClass={this.state._pagination._customClass}\n\t\t\t\t\t\t\t\t_on={this.handlePagination}\n\t\t\t\t\t\t\t\t_page={this.state._pagination._page}\n\t\t\t\t\t\t\t\t_pageSize={this.state._pagination._pageSize}\n\t\t\t\t\t\t\t\t_pageSizeOptions={this.state._pagination._pageSizeOptions || PAGINATION_OPTIONS}\n\t\t\t\t\t\t\t\t_siblingCount={this.state._pagination._siblingCount}\n\t\t\t\t\t\t\t\t_tooltipAlign=\"bottom\"\n\t\t\t\t\t\t\t\t_total={this.state._pagination._total || this.state._data.length}\n\t\t\t\t\t\t\t></kol-pagination>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t\t{/*\n\t\t\t\t  - https://dequeuniversity.com/rules/axe/3.5/scrollable-region-focusable\n\t\t\t\t\t- https://www.a11yproject.com/posts/how-to-use-the-tabindex-attribute/\n\t\t\t\t\t- https://ux.stackexchange.com/questions/119952/when-is-it-wrong-to-put-tabindex-0-on-non-interactive-content\n\n\t\t\t\t\tNicht <div tabindex=\"0\">\n\n\t\t\t\t\tDOCH!!!\n\t\t\t\t\thttps://dequeuniversity.com/rules/axe/4.4/scrollable-region-focusable?application=AxeChrome\n\t\t\t\t*/}\n\t\t\t\t<div class=\"table\" tabindex=\"0\">\n\t\t\t\t\t<table\n\t\t\t\t\t\t// role=\"grid\"\n\t\t\t\t\t\t// aria-readonly=\"true\"\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tminWidth: this.state._minWidth,\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<caption>{this.state._caption}</caption>\n\t\t\t\t\t\t{Array.isArray(this.state._headers.horizontal) && (\n\t\t\t\t\t\t\t<thead>\n\t\t\t\t\t\t\t\t{this.state._headers.horizontal.map((cols, rowIdx) => (\n\t\t\t\t\t\t\t\t\t<tr key={`thead-${rowIdx}`}>\n\t\t\t\t\t\t\t\t\t\t{cols.map((col, colIdx) => {\n\t\t\t\t\t\t\t\t\t\t\tif (col.asTd === true) {\n\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<td // role=\"gridcell\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey={`thead-${rowIdx}-${colIdx}-${col.label}`}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t[col.textAlign as string]: typeof col.textAlign === 'string' && col.textAlign.length > 0,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcolSpan={col.colSpan}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\trowSpan={col.rowSpan}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttextAlign: col.textAlign,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\twidth: col.width,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tref={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttypeof col.render === 'function'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? (el) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.cellRender(col as KoliBriTableHeaderCellAndData, el);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t  }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tinnerHTML={typeof col.render !== 'function' ? col.label : ''}\n\t\t\t\t\t\t\t\t\t\t\t\t\t></td>\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<th // role=\"columnheader\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey={`thead-${rowIdx}-${colIdx}-${col.label}`}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tscope={typeof col.colSpan === 'number' && col.colSpan > 1 ? 'colgroup' : 'col'}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcolSpan={col.colSpan}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\trowSpan={col.rowSpan}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttextAlign: col.textAlign,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\twidth: col.width,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\taria-sort={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t!this.disableSort && typeof col.sort === 'function'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? col.sort !== this.sortFunction ||\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t  this.sortDirections.get(col.sort) === 'NOS' ||\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t  this.sortDirections.get(col.sort) === undefined\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 'none'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: this.sortDirections.get(col.sort) === 'ASC'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 'ascending'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: 'descending'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdata-sort={`sort-${this.sortDirections.get(col.sort!) as string}`}\n\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"w-full flex gap-1 items-center\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'w-full': true,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t[col.textAlign as string]: typeof col.textAlign === 'string' && col.textAlign.length > 0,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tinnerHTML={col.label}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttextAlign: col.textAlign,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t></div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{!this.disableSort && typeof col.sort === 'function' && (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<kol-button\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\texportparts=\"icon\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t_ariaLabel={translate('kol-change-order', { placeholders: { colLabel: col.label } })}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t_icon={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcol.sort !== this.sortFunction ||\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.sortDirections.get(col.sort) === 'NOS' ||\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.sortDirections.get(col.sort) === undefined\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 'codicon codicon-fold'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: this.sortDirections.get(col.sort) === 'ASC'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 'codicon codicon-chevron-up'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: 'codicon codicon-chevron-down'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t_iconOnly\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t_label={translate('kol-change-order', { placeholders: { colLabel: col.label } })}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t_on={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tonClick: () => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tif (typeof col.sort === 'function') {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.sortFunction = col.sort;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tswitch (this.sortDirections.get(this.sortFunction)) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcase 'ASC':\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.setSortDirection(this.sortFunction, 'DESC');\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcase 'DESC':\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.setSortDirection(this.sortFunction, 'NOS');\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdefault:\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.setSortDirection(this.sortFunction, 'ASC');\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.updateSortedData();\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t_variant=\"ghost\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t></kol-button>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</th>\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t\t</tr>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</thead>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{/* <tbody aria-atomic=\"true\" aria-live=\"polite\" aria-relevant=\"additions removals\"> */}\n\t\t\t\t\t\t<tbody>\n\t\t\t\t\t\t\t{dataField.map((row, rowIdx) => {\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<tr key={`tbody-${rowIdx}`}>\n\t\t\t\t\t\t\t\t\t\t{row.map((col, colIdx) => {\n\t\t\t\t\t\t\t\t\t\t\tif (col.asTd === false) {\n\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<th // role=\"rowheader\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey={`tbody-${rowIdx}-${colIdx}-${col.label}`}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tscope={typeof col.rowSpan === 'number' && col.rowSpan > 1 ? 'rowgroup' : 'row'}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcolSpan={col.colSpan}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\trowSpan={col.rowSpan}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttextAlign: col.textAlign,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\twidth: col.width,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\taria-sort={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t!this.disableSort && typeof col.sort === 'function'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? col.sort !== this.sortFunction ||\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t  this.sortDirections.get(col.sort) === 'NOS' ||\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t  this.sortDirections.get(col.sort) === undefined\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 'none'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: this.sortDirections.get(col.sort) === 'ASC'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 'ascending'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: 'descending'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdata-sort={`sort-${this.sortDirections.get(col.sort!) as string}`}\n\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"w-full flex gap-1 items-center\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'w-full': true,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t[col.textAlign as string]: typeof col.textAlign === 'string' && col.textAlign.length > 0,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tinnerHTML={col.label}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttextAlign: col.textAlign,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t></div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{!this.disableSort && typeof col.sort === 'function' && (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<kol-button\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\texportparts=\"icon\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t_ariaLabel={translate('kol-change-order', { placeholders: { colLabel: col.label } })}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t_icon={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcol.sort !== this.sortFunction ||\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.sortDirections.get(col.sort) === 'NOS' ||\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.sortDirections.get(col.sort) === undefined\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 'codicon codicon-fold'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: this.sortDirections.get(col.sort) === 'ASC'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 'codicon codicon-chevron-up'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: 'codicon codicon-chevron-down'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t_iconOnly\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t_label={translate('kol-change-order', { placeholders: { colLabel: col.label } })}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t_on={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tonClick: () => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tif (typeof col.sort === 'function') {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.sortFunction = col.sort;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tswitch (this.sortDirections.get(this.sortFunction)) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcase 'ASC':\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.setSortDirection(this.sortFunction, 'DESC');\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcase 'DESC':\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.setSortDirection(this.sortFunction, 'NOS');\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdefault:\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.setSortDirection(this.sortFunction, 'ASC');\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.updateSortedData();\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t_variant=\"ghost\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t></kol-button>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</th>\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<td // role=\"gridcell\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey={`tbody-${rowIdx}-${colIdx}-${col.label}`}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t[col.textAlign as string]: typeof col.textAlign === 'string' && col.textAlign.length > 0,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcolSpan={col.colSpan}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\trowSpan={col.rowSpan}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttextAlign: col.textAlign,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\twidth: col.width,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tref={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttypeof col.render === 'function'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? (el) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.cellRender(col as KoliBriTableHeaderCellAndData, el);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t  }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tinnerHTML={typeof col.render !== 'function' ? col.label : ''}\n\t\t\t\t\t\t\t\t\t\t\t\t\t></td>\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t\t</tr>\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t</tbody>\n\t\t\t\t\t</table>\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"mappings":"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"}
+{"version":3,"names":["defaultStyleCss","PAGINATION_OPTIONS","CELL_REFS","Map","KolTable","this","horizontal","sortDirections","showPagination","pageStartSlice","pageEndSlice","disableSort","setSortDirection","sort","direction","clear","set","sortFunction","handlePagination","onClick","event","page","_a","state","_pagination","_on","setState","Object","assign","_page","onChangePage","onChangePageSize","pageSize","_pageSize","beforePatchPagination","nextValue","_nextState","_component","key","updateSortedData","sortedData","_data","get","reverse","renderTableRow","row","rowIndex","h","map","col","colIndex","renderTableCell","asTd","label","scope","rowSpan","colSpan","style","textAlign","width","undefined","class","length","innerHTML","exportparts","_ariaLabel","translate","placeholders","colLabel","_icon","_hideLabel","_label","_variant","ref","render","el","cellRender","renderFoot","rows","createDataField","_dataFoot","_headers","_caption","vertical","_total","_sortedData","validateCaption","value","watchString","required","validateData","emptyStringByArrayHandler","objectObjectHandler","parseJson","e","Array","isArray","find","dataTupel","afterPatch","setTimeout","validateDataFoot","validateHeaders","watchValidator","Set","hooks","beforePatch","headers","forEach","header","cell","sortDirection","_b","_c","_d","devHint","validateMinWidth","defaultValue","validatePagination","componentWillLoad","_minWidth","getNumberOfCols","horizontalHeaders","data","max","count","getNumberOfRows","verticalHeaders","filterHeaderKeys","primaryHeader","cells","push","getPrimaryHeader","isFoot","maxCols","maxRows","startRow","dataField","rowCount","rowSpans","_row","index","i","dataRow","headerCells","rowsTotal","k","j","colspan","rowspan","emptyCell","Math","selectDisplayedData","slice","clearTimeout","html","displayedData","Host","_boundaryCount","_customClass","_pageSizeOptions","_siblingCount","_tooltipAlign","tabindex","minWidth","cols"],"sources":["./src/components/table/style.css?tag=kol-table&mode=default&encapsulation=shadow","./src/components/table/component.tsx"],"sourcesContent":["@import url(../style.css);\n@import url(../host-display-block.css);\n:host {\n\tdisplay: grid;\n}\n:host > div.table {\n\tmax-width: 100%;\n\torder: 1;\n\toverflow-x: auto;\n\toverflow-y: hidden;\n}\n:host > div.table table {\n\twidth: 100%;\n}\nth > div {\n\tdisplay: grid;\n\tgrid-template-columns: 1fr auto;\n\tplace-items: center;\n}\ndiv.pagination {\n\torder: 2;\n}\ndiv.pagination,\ndiv.pagination > div:last-child {\n\tdisplay: grid;\n\tplace-items: center;\n}\n@media (min-width: 1024px) {\n\tdiv.pagination,\n\tdiv.pagination > div:last-child {\n\t\tgrid-auto-flow: column;\n\t}\n\tdiv.pagination kol-pagination {\n\t\tdisplay: flex;\n\t}\n}\n","/* eslint-disable jsx-a11y/no-noninteractive-tabindex */\nimport { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { Stringified } from '../../types/common';\nimport {\n\tKoliBriDataType,\n\tKoliBriSortDirection,\n\tKoliBriSortFunction,\n\tKoliBriTableCell,\n\tKoliBriTableHeaderCell,\n\tKoliBriTableHeaders,\n\tKoliBriTablePaginationProps,\n\tKoliBriTablePaginationStates,\n\tKoliBriTableRender,\n} from '../../types/table';\nimport { emptyStringByArrayHandler, objectObjectHandler, parseJson, setState, watchString, watchValidator } from '../../utils/prop.validators';\nimport { KoliBriPaginationButtonCallbacks } from '../pagination/types';\nimport { translate } from '../../i18n';\nimport { devHint } from '../../utils/a11y.tipps';\n\ntype KoliBriTableHeaderCellAndData = KoliBriTableHeaderCell & {\n\tdata: KoliBriDataType;\n};\n\ntype RequiredProps = {\n\tcaption: string;\n\tdata: Stringified<KoliBriDataType[]>;\n\theaders: Stringified<KoliBriTableHeaders>;\n};\ntype OptionalProps = {\n\tdataFoot: Stringified<KoliBriDataType[]>;\n\tminWidth: string;\n\tpagination: boolean | Stringified<KoliBriTablePaginationProps>;\n};\n\ntype RequiredStates = {\n\tcaption: string;\n\tdata: KoliBriDataType[];\n\tdataFoot: KoliBriDataType[];\n\theaders: KoliBriTableHeaders;\n\tpagination: KoliBriTablePaginationStates;\n\tsortedData: KoliBriDataType[];\n};\ntype OptionalStates = {\n\tminWidth: string;\n\tsortDirection: KoliBriSortDirection;\n};\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\nconst PAGINATION_OPTIONS = [10, 20, 50, 100];\n\nconst CELL_REFS = new Map<HTMLElement, ReturnType<typeof setTimeout>>();\n\n@Component({\n\ttag: 'kol-table',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolTable implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\tprivate horizontal = true;\n\tprivate sortFunction?: KoliBriSortFunction;\n\tprivate sortDirections: Map<KoliBriSortFunction, KoliBriSortDirection> = new Map();\n\tprivate showPagination = false;\n\tprivate pageStartSlice = 0;\n\tprivate pageEndSlice = 10;\n\tprivate disableSort = 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 _caption!: string;\n\n\t/**\n\t * Gibt die Daten an, die für die Erstellung der Tabelle verwendet werden.\n\t */\n\t@Prop() public _data!: Stringified<KoliBriDataType[]>;\n\n\t/**\n\t * Hier können die Daten für die Fußzeile der Tabelle übergeben werden.\n\t */\n\t@Prop() public _dataFoot?: Stringified<KoliBriDataType[]>;\n\n\t/**\n\t * Gibt die horizontalen und vertikalen Header für die Tabelle an.\n\t */\n\t@Prop() public _headers!: Stringified<KoliBriTableHeaders>;\n\n\t/**\n\t * Gibt an, die minimale Breite der Tabelle an.\n\t */\n\t@Prop() public _minWidth?: string;\n\n\t/**\n\t * Gibt an, ob die Daten geteilt in Seiten angezeigt wird.\n\t */\n\t@Prop() public _pagination?: boolean | Stringified<KoliBriTablePaginationProps>;\n\n\t@State() public state: States = {\n\t\t_caption: '…', // ⚠ required\n\t\t_data: [],\n\t\t_dataFoot: [],\n\t\t_headers: {\n\t\t\thorizontal: [],\n\t\t\tvertical: [],\n\t\t},\n\t\t_pagination: {\n\t\t\t_page: 1,\n\t\t\t_pageSize: 10,\n\t\t\t_total: 0,\n\t\t},\n\t\t_sortedData: [],\n\t};\n\n\t@Watch('_caption')\n\tpublic validateCaption(value?: string): void {\n\t\twatchString(this, '_caption', value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\t@Watch('_data')\n\tpublic validateData(value?: Stringified<KoliBriDataType[]>): void {\n\t\temptyStringByArrayHandler(value, () => {\n\t\t\tobjectObjectHandler(value, () => {\n\t\t\t\tif (typeof value === 'undefined') {\n\t\t\t\t\tvalue = [];\n\t\t\t\t}\n\t\t\t\ttry {\n\t\t\t\t\tvalue = parseJson<KoliBriDataType[]>(value);\n\t\t\t\t\t// eslint-disable-next-line no-empty\n\t\t\t\t} catch (e) {\n\t\t\t\t\t// value behält den ursprünglichen Wert\n\t\t\t\t}\n\t\t\t\tif (Array.isArray(value) && value.find((dataTupel: KoliBriDataType) => !(typeof dataTupel === 'object' && dataTupel !== null)) === undefined) {\n\t\t\t\t\tsetState(this, '_data', value, {\n\t\t\t\t\t\tafterPatch: () => {\n\t\t\t\t\t\t\t// TODO: kein guter Hack (endless loop)\n\t\t\t\t\t\t\tsetTimeout(this.updateSortedData);\n\t\t\t\t\t\t},\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t});\n\t\t});\n\t}\n\n\t@Watch('_dataFoot')\n\tpublic validateDataFoot(value?: Stringified<KoliBriDataType[]>): void {\n\t\temptyStringByArrayHandler(value, () => {\n\t\t\tobjectObjectHandler(value, () => {\n\t\t\t\tif (typeof value === 'undefined') {\n\t\t\t\t\tvalue = [];\n\t\t\t\t}\n\t\t\t\ttry {\n\t\t\t\t\tvalue = parseJson<KoliBriDataType[]>(value);\n\t\t\t\t\t// eslint-disable-next-line no-empty\n\t\t\t\t} catch (e) {\n\t\t\t\t\t// value behält den ursprünglichen Wert\n\t\t\t\t}\n\t\t\t\tif (Array.isArray(value) && value.find((dataTupel: KoliBriDataType) => !(typeof dataTupel === 'object' && dataTupel !== null)) === undefined) {\n\t\t\t\t\tsetState(this, '_dataFoot', value, {\n\t\t\t\t\t\tafterPatch: () => {\n\t\t\t\t\t\t\tsetTimeout(this.updateSortedData);\n\t\t\t\t\t\t},\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t});\n\t\t});\n\t}\n\n\tprivate setSortDirection = (sort: KoliBriSortFunction, direction: KoliBriSortDirection) => {\n\t\t/**\n\t\t * Durch des Clearen, ist es nicht möglich eine Mehr-Spalten-Sortierung\n\t\t * darzustellen. Das wäre der Fall, wenn man ggf. Daten in außerhalb der\n\t\t * Komponente sortiert und diese sortiert von außen rein gibt und der\n\t\t * Sortierungsalgorithmus mehrere Spalten zusammen sortierte.\n\t\t *\n\t\t * Beachte auch col.sort !== this.sortFunction\n\t\t */\n\t\tthis.sortDirections.clear();\n\t\tthis.sortDirections.set(sort, direction);\n\t\tthis.sortFunction = sort;\n\t};\n\n\t@Watch('_headers')\n\tpublic validateHeaders(value?: Stringified<KoliBriTableHeaders>): void {\n\t\t/**\n\t\t * - es darf maximal ein Header als primary markiert werden (last win)\n\t\t * - der primary-Header entscheidet implizit über _order und _orientation\n\t\t *   - primary-Headers müssen das key-Property setzen\n\t\t *   - nicht primary-Headers müssen das key-Property nicht setzen (wird ignoriert)\n\t\t *   - _order: wird durch den primary-Header geregelt\n\t\t *   - _orientation: wird durch den primary-Header geregelt\n\t\t * - sobald ein Header sortierbar ist, darf es nur noch entweder horizontale\n\t\t *   oder vertikale Header geben, aber nicht mehr beides\n\t\t */\n\t\temptyStringByArrayHandler(value, () => {\n\t\t\tobjectObjectHandler(value, () => {\n\t\t\t\ttry {\n\t\t\t\t\tvalue = parseJson<KoliBriTableHeaders>(value);\n\t\t\t\t\t// eslint-disable-next-line no-empty\n\t\t\t\t} catch (e) {\n\t\t\t\t\t// value behält den ursprünglichen Wert\n\t\t\t\t}\n\t\t\t\twatchValidator(this, '_headers', (value): boolean => typeof value === 'object' && value !== null, new Set(['KoliBriTableHeaders']), value, {\n\t\t\t\t\thooks: {\n\t\t\t\t\t\tbeforePatch: (nextValue: unknown) => {\n\t\t\t\t\t\t\tconst headers: KoliBriTableHeaders = nextValue as KoliBriTableHeaders;\n\t\t\t\t\t\t\theaders.horizontal?.forEach((header) => {\n\t\t\t\t\t\t\t\theader.forEach((cell) => {\n\t\t\t\t\t\t\t\t\tif (typeof cell.sort === 'function' && typeof cell.sortDirection === 'string') {\n\t\t\t\t\t\t\t\t\t\tthis.setSortDirection(cell.sort, cell.sortDirection);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\theaders.vertical?.forEach((header) => {\n\t\t\t\t\t\t\t\theader.forEach((cell) => {\n\t\t\t\t\t\t\t\t\tif (typeof cell.sort === 'function' && typeof cell.sortDirection === 'string') {\n\t\t\t\t\t\t\t\t\t\tthis.setSortDirection(cell.sort, cell.sortDirection);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\tif (headers.horizontal && headers.vertical && headers.horizontal?.length > 0 && headers.vertical?.length > 0) {\n\t\t\t\t\t\t\t\tthis.disableSort = true;\n\t\t\t\t\t\t\t\tdevHint(\n\t\t\t\t\t\t\t\t\t`Table: You can not sort the table data, if horizontal and vertical headers are defined at the same time. (https://github.com/public-ui/kolibri/issues/2372)`\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t},\n\t\t\t\t\t},\n\t\t\t\t});\n\t\t\t});\n\t\t});\n\t}\n\n\t@Watch('_minWidth')\n\tpublic validateMinWidth(value?: string): void {\n\t\twatchString(this, '_minWidth', value, {\n\t\t\tdefaultValue: undefined,\n\t\t});\n\t}\n\n\tprivate readonly handlePagination: KoliBriPaginationButtonCallbacks = {\n\t\tonClick: (event: Event, page: number) => {\n\t\t\tif (typeof this.state._pagination._on?.onClick === 'function') {\n\t\t\t\tthis.state._pagination._on.onClick(event, page);\n\t\t\t}\n\t\t\tsetState(this, '_pagination', {\n\t\t\t\t...this.state._pagination,\n\t\t\t\t_page: page,\n\t\t\t});\n\t\t},\n\t\tonChangePage: (event: Event, page: number) => {\n\t\t\tif (typeof this.state._pagination._on?.onChangePage === 'function') {\n\t\t\t\tthis.state._pagination._on.onChangePage(event, page);\n\t\t\t}\n\t\t\tsetState(this, '_pagination', {\n\t\t\t\t...this.state._pagination,\n\t\t\t\t_page: page,\n\t\t\t});\n\t\t},\n\t\tonChangePageSize: (event: Event, pageSize: number) => {\n\t\t\tif (typeof this.state._pagination._on?.onChangePageSize === 'function') {\n\t\t\t\tthis.state._pagination._on.onChangePageSize(event, pageSize);\n\t\t\t}\n\t\t\tsetState(this, '_pagination', {\n\t\t\t\t...this.state._pagination,\n\t\t\t\t_pageSize: pageSize,\n\t\t\t});\n\t\t\tsetState(this, '_pageSize', pageSize);\n\t\t},\n\t};\n\n\tprivate readonly beforePatchPagination: Generic.Element.NextStateHooksCallback = (nextValue, _nextState, _component, key): void => {\n\t\tif (key === '_pagination') {\n\t\t\tthis.showPagination = nextValue === true || nextValue === '' /* true */ || (typeof nextValue === 'object' && nextValue !== null);\n\t\t}\n\t};\n\n\t@Watch('_pagination')\n\tpublic validatePagination(value?: boolean | Stringified<KoliBriTablePaginationProps>): void {\n\t\ttry {\n\t\t\tvalue = parseJson<KoliBriTablePaginationProps>(value);\n\t\t\t// eslint-disable-next-line no-empty\n\t\t} catch (e) {\n\t\t\t// value behält den ursprünglichen Wert\n\t\t}\n\t\twatchValidator(this, '_pagination', () => true, new Set(['boolean', 'KoliBriTablePagination']), value, {\n\t\t\thooks: {\n\t\t\t\tbeforePatch: this.beforePatchPagination,\n\t\t\t},\n\t\t});\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateCaption(this._caption);\n\t\tthis.validateData(this._data);\n\t\tthis.validateDataFoot(this._dataFoot);\n\t\tthis.validateHeaders(this._headers);\n\t\tthis.validateMinWidth(this._minWidth);\n\t\tthis.validatePagination(this._pagination);\n\t}\n\n\tprivate getNumberOfCols(horizontalHeaders: KoliBriTableHeaderCell[][], data: KoliBriDataType[]): number {\n\t\tlet max = 0;\n\t\thorizontalHeaders.forEach((row) => {\n\t\t\tlet count = 0;\n\t\t\trow.forEach((col) => (count += col.colSpan ?? 1));\n\t\t\tif (max < count) {\n\t\t\t\tmax = count;\n\t\t\t}\n\t\t});\n\t\tif (max === 0) {\n\t\t\tmax = data.length;\n\t\t}\n\t\treturn max;\n\t}\n\n\tprivate getNumberOfRows(verticalHeaders: KoliBriTableHeaderCell[][], data: KoliBriDataType[]): number {\n\t\tlet max = 0;\n\t\tverticalHeaders.forEach((col) => {\n\t\t\tlet count = 0;\n\t\t\tcol.forEach((row) => (count += row.rowSpan ?? 1));\n\t\t\tif (max < count) {\n\t\t\t\tmax = count;\n\t\t\t}\n\t\t});\n\t\tif (max === 0) {\n\t\t\tmax = data.length;\n\t\t} else {\n\t\t\tmax -= this.state._dataFoot.length;\n\t\t}\n\t\treturn max;\n\t}\n\n\tprivate filterHeaderKeys(headers: KoliBriTableHeaderCell[][]): KoliBriTableHeaderCell[] {\n\t\tconst primaryHeader: KoliBriTableHeaderCell[] = [];\n\t\theaders.forEach((cells) => {\n\t\t\tcells.forEach((cell) => {\n\t\t\t\tif (typeof cell.key === 'string') {\n\t\t\t\t\tprimaryHeader.push(cell);\n\t\t\t\t}\n\t\t\t});\n\t\t});\n\t\treturn primaryHeader;\n\t}\n\n\tprivate getPrimaryHeader(headers: KoliBriTableHeaders): KoliBriTableHeaderCell[] {\n\t\tlet primaryHeader: KoliBriTableHeaderCell[] = this.filterHeaderKeys(headers.horizontal ?? []);\n\t\tthis.horizontal = true;\n\t\tif (primaryHeader.length === 0) {\n\t\t\tprimaryHeader = this.filterHeaderKeys(headers.vertical ?? []);\n\t\t\tif (primaryHeader.length > 0) {\n\t\t\t\tthis.horizontal = false;\n\t\t\t}\n\t\t}\n\t\treturn primaryHeader;\n\t}\n\n\tprivate createDataField(data: KoliBriDataType[], headers: KoliBriTableHeaders, isFoot?: boolean): KoliBriTableCell[][] {\n\t\theaders.horizontal = Array.isArray(headers?.horizontal) ? headers.horizontal : [];\n\t\theaders.vertical = Array.isArray(headers?.vertical) ? headers.vertical : [];\n\t\tconst primaryHeader = this.getPrimaryHeader(headers);\n\t\tconst maxCols = this.getNumberOfCols(headers.horizontal, data);\n\t\tlet maxRows = this.getNumberOfRows(headers.vertical, data);\n\t\tlet startRow = 0;\n\t\tif (isFoot) {\n\t\t\tstartRow = maxRows;\n\t\t\tmaxRows += this.state._dataFoot.length;\n\t\t}\n\t\tconst dataField: KoliBriTableCell[][] = [];\n\n\t\tconst rowCount: number[] = [];\n\t\tconst rowSpans: number[][] = [];\n\t\theaders.vertical.forEach((_row, index) => {\n\t\t\trowCount[index] = 0;\n\t\t\trowSpans[index] = [];\n\t\t});\n\n\t\tfor (let i = startRow; i < maxRows; i++) {\n\t\t\tconst dataRow: KoliBriTableHeaderCellAndData[] = [];\n\t\t\theaders.vertical.forEach((headerCells, index) => {\n\t\t\t\tlet rowsTotal = 0;\n\t\t\t\trowSpans[index].forEach((value) => (rowsTotal += value));\n\t\t\t\tif (rowsTotal <= i) {\n\t\t\t\t\tconst rows = headerCells[i - rowsTotal + rowCount[index]];\n\t\t\t\t\tif (typeof rows === 'object') {\n\t\t\t\t\t\tdataRow.push({\n\t\t\t\t\t\t\t...rows,\n\t\t\t\t\t\t\tasTd: false,\n\t\t\t\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n\t\t\t\t\t\t\tdata: {} as KoliBriDataType,\n\t\t\t\t\t\t});\n\t\t\t\t\t\tlet rowSpan = 1;\n\t\t\t\t\t\tif (typeof rows.rowSpan === 'number' && rows.rowSpan > 1) {\n\t\t\t\t\t\t\trowSpan = rows.rowSpan;\n\t\t\t\t\t\t}\n\t\t\t\t\t\trowSpans[index].push(rowSpan);\n\t\t\t\t\t\tif (typeof rows.colSpan === 'number' && rows.colSpan > 1) {\n\t\t\t\t\t\t\tfor (let k = 1; k < rows.colSpan; k++) {\n\t\t\t\t\t\t\t\trowSpans[index + k].push(rowSpan);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t\trowCount[index]++;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t});\n\t\t\tfor (let j = 0; j < maxCols; j++) {\n\t\t\t\tif (this.horizontal === true) {\n\t\t\t\t\tconst row = isFoot ? this.state._dataFoot[i - startRow] : data[i];\n\t\t\t\t\tif (\n\t\t\t\t\t\ttypeof primaryHeader[j] === 'object' &&\n\t\t\t\t\t\tprimaryHeader[j] !== null &&\n\t\t\t\t\t\ttypeof primaryHeader[j].key === 'string' &&\n\t\t\t\t\t\ttypeof row === 'object' &&\n\t\t\t\t\t\trow !== null\n\t\t\t\t\t) {\n\t\t\t\t\t\tdataRow.push({\n\t\t\t\t\t\t\t...primaryHeader[j],\n\t\t\t\t\t\t\tcolSpan: undefined,\n\t\t\t\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n\t\t\t\t\t\t\tdata: row,\n\t\t\t\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n\t\t\t\t\t\t\tlabel: row[primaryHeader[j].key as unknown as string] as string,\n\t\t\t\t\t\t\trowSpan: undefined,\n\t\t\t\t\t\t});\n\t\t\t\t\t}\n\t\t\t\t} else {\n\t\t\t\t\tif (\n\t\t\t\t\t\ttypeof primaryHeader[i] === 'object' &&\n\t\t\t\t\t\tprimaryHeader[i] !== null &&\n\t\t\t\t\t\ttypeof primaryHeader[i].key === 'string' &&\n\t\t\t\t\t\ttypeof data[j] === 'object' &&\n\t\t\t\t\t\tdata[j] !== null\n\t\t\t\t\t) {\n\t\t\t\t\t\tdataRow.push({\n\t\t\t\t\t\t\t...primaryHeader[i],\n\t\t\t\t\t\t\tcolSpan: undefined,\n\t\t\t\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n\t\t\t\t\t\t\tdata: data[j],\n\t\t\t\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n\t\t\t\t\t\t\tlabel: data[j][primaryHeader[i].key as unknown as number] as string,\n\t\t\t\t\t\t\trowSpan: undefined,\n\t\t\t\t\t\t});\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t\tdataField.push(dataRow);\n\t\t}\n\t\tif (data.length === 0) {\n\t\t\tlet colspan = 0;\n\t\t\tlet rowspan = 0;\n\t\t\tif (Array.isArray(headers.horizontal) && headers.horizontal.length > 0) {\n\t\t\t\theaders.horizontal[0].forEach((col) => {\n\t\t\t\t\tcolspan += col.colSpan || 1;\n\t\t\t\t});\n\t\t\t}\n\t\t\tif (Array.isArray(headers.vertical) && headers.vertical.length > 0) {\n\t\t\t\tcolspan -= headers.vertical.length;\n\t\t\t\theaders.vertical[0].forEach((row) => {\n\t\t\t\t\trowspan += row.rowSpan || 1;\n\t\t\t\t});\n\t\t\t}\n\t\t\tconst emptyCell = {\n\t\t\t\tcolSpan: colspan,\n\t\t\t\tlabel: translate('kol-no-entries'),\n\t\t\t\trender: undefined,\n\t\t\t\trowSpan: Math.max(rowspan, 1),\n\t\t\t};\n\t\t\tif (dataField.length === 0) {\n\t\t\t\tdataField.push([emptyCell]);\n\t\t\t} else {\n\t\t\t\tdataField[0].push(emptyCell);\n\t\t\t}\n\t\t}\n\t\treturn dataField;\n\t}\n\n\tprivate selectDisplayedData(data: KoliBriDataType[], pageSize: number, page: number): KoliBriDataType[] {\n\t\tif (typeof pageSize === 'number' && pageSize > 0 && typeof page === 'number' && page > 0) {\n\t\t\tthis.pageStartSlice = pageSize * (page - 1);\n\t\t\tthis.pageEndSlice = pageSize * page > data.length ? data.length : pageSize * page;\n\t\t\treturn data.slice(this.pageStartSlice, this.pageEndSlice);\n\t\t} else {\n\t\t\tthis.pageStartSlice = 0;\n\t\t\tthis.pageEndSlice = data.length;\n\t\t\treturn data;\n\t\t}\n\t}\n\n\tprivate cellRender(col: KoliBriTableHeaderCellAndData & { render: KoliBriTableRender }, el?: HTMLElement): void {\n\t\tif (el /* SSR instanceof HTMLElement */) {\n\t\t\tclearTimeout(CELL_REFS.get(el));\n\t\t\tCELL_REFS.set(\n\t\t\t\tel,\n\t\t\t\tsetTimeout(() => {\n\t\t\t\t\tclearTimeout(CELL_REFS.get(el));\n\t\t\t\t\tconst html = col.render(\n\t\t\t\t\t\tel,\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tasTd: col.asTd,\n\t\t\t\t\t\t\tlabel: col.label,\n\t\t\t\t\t\t\ttextAlign: col.textAlign,\n\t\t\t\t\t\t\twidth: col.width,\n\t\t\t\t\t\t} as KoliBriTableHeaderCell,\n\t\t\t\t\t\tcol.data,\n\t\t\t\t\t\tthis.state._data\n\t\t\t\t\t);\n\t\t\t\t\tif (typeof html === 'string') {\n\t\t\t\t\t\tel.innerHTML = html;\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t\t);\n\t\t}\n\t}\n\n\tprivate updateSortedData = () => {\n\t\tlet sortedData: KoliBriDataType[] = this.state._data;\n\t\tif (typeof this.sortFunction === 'function') {\n\t\t\tswitch (this.sortDirections.get(this.sortFunction)) {\n\t\t\t\tcase 'NOS':\n\t\t\t\t\tsortedData = [...this.state._data];\n\t\t\t\t\tbreak;\n\t\t\t\tcase 'ASC':\n\t\t\t\t\tsortedData = this.sortFunction([...this.state._data]);\n\t\t\t\t\tbreak;\n\t\t\t\tdefault:\n\t\t\t\t\tsortedData = this.sortFunction([...this.state._data]).reverse();\n\t\t\t}\n\t\t}\n\t\tsetState(this, '_sortedData', sortedData);\n\t};\n\n\tprivate readonly renderTableRow = (row: KoliBriTableCell[], rowIndex: number): JSX.Element => {\n\t\treturn <tr key={`tbody-${rowIndex}`}>{row.map((col, colIndex) => this.renderTableCell(col, rowIndex, colIndex))}</tr>;\n\t};\n\tprivate readonly renderTableCell = (col: KoliBriTableCell, rowIndex: number, colIndex: number): JSX.Element => {\n\t\tif (col.asTd === false) {\n\t\t\treturn (\n\t\t\t\t<th // role=\"rowheader\"\n\t\t\t\t\tkey={`tbody-${rowIndex}-${colIndex}-${col.label}`}\n\t\t\t\t\tscope={typeof col.rowSpan === 'number' && col.rowSpan > 1 ? 'rowgroup' : 'row'}\n\t\t\t\t\tcolSpan={col.colSpan}\n\t\t\t\t\trowSpan={col.rowSpan}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\ttextAlign: col.textAlign,\n\t\t\t\t\t\twidth: col.width,\n\t\t\t\t\t}}\n\t\t\t\t\taria-sort={\n\t\t\t\t\t\t!this.disableSort && typeof col.sort === 'function'\n\t\t\t\t\t\t\t? col.sort !== this.sortFunction || this.sortDirections.get(col.sort) === 'NOS' || this.sortDirections.get(col.sort) === undefined\n\t\t\t\t\t\t\t\t? 'none'\n\t\t\t\t\t\t\t\t: this.sortDirections.get(col.sort) === 'ASC'\n\t\t\t\t\t\t\t\t? 'ascending'\n\t\t\t\t\t\t\t\t: 'descending'\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n\t\t\t\t\tdata-sort={`sort-${this.sortDirections.get(col.sort!) as string}`}\n\t\t\t\t>\n\t\t\t\t\t<div class=\"w-full flex gap-1 items-center\">\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t'w-full': true,\n\t\t\t\t\t\t\t\t[col.textAlign as string]: typeof col.textAlign === 'string' && col.textAlign.length > 0,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tinnerHTML={col.label}\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\ttextAlign: col.textAlign,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t></div>\n\t\t\t\t\t\t{!this.disableSort && typeof col.sort === 'function' && (\n\t\t\t\t\t\t\t<kol-button\n\t\t\t\t\t\t\t\texportparts=\"icon\"\n\t\t\t\t\t\t\t\t_ariaLabel={translate('kol-change-order', { placeholders: { colLabel: col.label } })}\n\t\t\t\t\t\t\t\t_icon={\n\t\t\t\t\t\t\t\t\tcol.sort !== this.sortFunction || this.sortDirections.get(col.sort) === 'NOS' || this.sortDirections.get(col.sort) === undefined\n\t\t\t\t\t\t\t\t\t\t? 'codicon codicon-fold'\n\t\t\t\t\t\t\t\t\t\t: this.sortDirections.get(col.sort) === 'ASC'\n\t\t\t\t\t\t\t\t\t\t? 'codicon codicon-chevron-up'\n\t\t\t\t\t\t\t\t\t\t: 'codicon codicon-chevron-down'\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t_hideLabel\n\t\t\t\t\t\t\t\t_label={translate('kol-change-order', { placeholders: { colLabel: col.label } })}\n\t\t\t\t\t\t\t\t_on={{\n\t\t\t\t\t\t\t\t\tonClick: () => {\n\t\t\t\t\t\t\t\t\t\tif (typeof col.sort === 'function') {\n\t\t\t\t\t\t\t\t\t\t\tthis.sortFunction = col.sort;\n\t\t\t\t\t\t\t\t\t\t\tswitch (this.sortDirections.get(this.sortFunction)) {\n\t\t\t\t\t\t\t\t\t\t\t\tcase 'ASC':\n\t\t\t\t\t\t\t\t\t\t\t\t\tthis.setSortDirection(this.sortFunction, 'DESC');\n\t\t\t\t\t\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t\t\t\t\t\tcase 'DESC':\n\t\t\t\t\t\t\t\t\t\t\t\t\tthis.setSortDirection(this.sortFunction, 'NOS');\n\t\t\t\t\t\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t\t\t\t\t\tdefault:\n\t\t\t\t\t\t\t\t\t\t\t\t\tthis.setSortDirection(this.sortFunction, 'ASC');\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\tthis.updateSortedData();\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t_variant=\"ghost\"\n\t\t\t\t\t\t\t></kol-button>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</th>\n\t\t\t);\n\t\t} else {\n\t\t\treturn (\n\t\t\t\t<td // role=\"gridcell\"\n\t\t\t\t\tkey={`tbody-${rowIndex}-${colIndex}-${col.label}`}\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t[col.textAlign as string]: typeof col.textAlign === 'string' && col.textAlign.length > 0,\n\t\t\t\t\t}}\n\t\t\t\t\tcolSpan={col.colSpan}\n\t\t\t\t\trowSpan={col.rowSpan}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\ttextAlign: col.textAlign,\n\t\t\t\t\t\twidth: col.width,\n\t\t\t\t\t}}\n\t\t\t\t\tref={\n\t\t\t\t\t\ttypeof col.render === 'function'\n\t\t\t\t\t\t\t? (el) => {\n\t\t\t\t\t\t\t\t\tthis.cellRender(col as KoliBriTableHeaderCellAndData & { render: KoliBriTableRender }, el);\n\t\t\t\t\t\t\t  }\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\tinnerHTML={typeof col.render !== 'function' ? col.label : ''}\n\t\t\t\t></td>\n\t\t\t);\n\t\t}\n\t};\n\n\tprivate readonly renderFoot = (): JSX.Element => {\n\t\tconst rows: KoliBriTableCell[][] = this.createDataField(this.state._dataFoot, this.state._headers, true);\n\t\treturn <tfoot>{rows.map(this.renderTableRow)}</tfoot>;\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst displayedData: KoliBriDataType[] = this.selectDisplayedData(\n\t\t\tthis.state._sortedData,\n\t\t\tthis.showPagination ? this.state._pagination?._pageSize ?? 10 : this.state._sortedData.length,\n\t\t\tthis.state._pagination._page || 1\n\t\t);\n\t\tconst dataField = this.createDataField(displayedData, this.state._headers);\n\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t{this.pageEndSlice > 0 && this.showPagination && (\n\t\t\t\t\t<div class=\"pagination\">\n\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\tEinträge {this.pageEndSlice > 0 ? this.pageStartSlice + 1 : 0} bis {this.pageEndSlice} von{' '}\n\t\t\t\t\t\t\t{this.state._pagination._total || (Array.isArray(this.state._data) ? this.state._data.length : 0)} angezeigt\n\t\t\t\t\t\t</span>\n\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t<kol-pagination\n\t\t\t\t\t\t\t\t_boundaryCount={this.state._pagination._boundaryCount}\n\t\t\t\t\t\t\t\t_customClass={this.state._pagination._customClass}\n\t\t\t\t\t\t\t\t_on={this.handlePagination}\n\t\t\t\t\t\t\t\t_page={this.state._pagination._page}\n\t\t\t\t\t\t\t\t_pageSize={this.state._pagination._pageSize}\n\t\t\t\t\t\t\t\t_pageSizeOptions={this.state._pagination._pageSizeOptions || PAGINATION_OPTIONS}\n\t\t\t\t\t\t\t\t_siblingCount={this.state._pagination._siblingCount}\n\t\t\t\t\t\t\t\t_tooltipAlign=\"bottom\"\n\t\t\t\t\t\t\t\t_total={this.state._pagination._total || this.state._data.length}\n\t\t\t\t\t\t\t></kol-pagination>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t\t<div class=\"table\" tabindex=\"0\">\n\t\t\t\t\t<table\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tminWidth: this.state._minWidth,\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<caption>{this.state._caption}</caption>\n\t\t\t\t\t\t{Array.isArray(this.state._headers.horizontal) && (\n\t\t\t\t\t\t\t<thead>\n\t\t\t\t\t\t\t\t{this.state._headers.horizontal.map((cols, rowIndex) => (\n\t\t\t\t\t\t\t\t\t<tr key={`thead-${rowIndex}`}>\n\t\t\t\t\t\t\t\t\t\t{cols.map((col, colIndex) => {\n\t\t\t\t\t\t\t\t\t\t\tif (col.asTd === true) {\n\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<td // role=\"gridcell\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey={`thead-${rowIndex}-${colIndex}-${col.label}`}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t[col.textAlign as string]: typeof col.textAlign === 'string' && col.textAlign.length > 0,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcolSpan={col.colSpan}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\trowSpan={col.rowSpan}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttextAlign: col.textAlign,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\twidth: col.width,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tref={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttypeof col.render === 'function'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? (el) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.cellRender(col as KoliBriTableHeaderCellAndData & { render: KoliBriTableRender }, el);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t  }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tinnerHTML={typeof col.render !== 'function' ? col.label : ''}\n\t\t\t\t\t\t\t\t\t\t\t\t\t></td>\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<th // role=\"columnheader\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey={`thead-${rowIndex}-${colIndex}-${col.label}`}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tscope={typeof col.colSpan === 'number' && col.colSpan > 1 ? 'colgroup' : 'col'}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcolSpan={col.colSpan}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\trowSpan={col.rowSpan}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttextAlign: col.textAlign,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\twidth: col.width,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\taria-sort={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t!this.disableSort && typeof col.sort === 'function'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? col.sort !== this.sortFunction ||\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t  this.sortDirections.get(col.sort) === 'NOS' ||\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t  this.sortDirections.get(col.sort) === undefined\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 'none'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: this.sortDirections.get(col.sort) === 'ASC'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 'ascending'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: 'descending'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdata-sort={`sort-${this.sortDirections.get(col.sort!) as string}`}\n\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"w-full flex gap-1 items-center\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'w-full': true,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t[col.textAlign as string]: typeof col.textAlign === 'string' && col.textAlign.length > 0,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tinnerHTML={col.label}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttextAlign: col.textAlign,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t></div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{!this.disableSort && typeof col.sort === 'function' && (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<kol-button\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\texportparts=\"icon\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t_ariaLabel={translate('kol-change-order', { placeholders: { colLabel: col.label } })}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t_icon={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcol.sort !== this.sortFunction ||\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.sortDirections.get(col.sort) === 'NOS' ||\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.sortDirections.get(col.sort) === undefined\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 'codicon codicon-fold'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: this.sortDirections.get(col.sort) === 'ASC'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 'codicon codicon-chevron-up'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: 'codicon codicon-chevron-down'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t_hideLabel\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t_label={translate('kol-change-order', { placeholders: { colLabel: col.label } })}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t_on={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tonClick: () => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tif (typeof col.sort === 'function') {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.sortFunction = col.sort;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tswitch (this.sortDirections.get(this.sortFunction)) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcase 'ASC':\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.setSortDirection(this.sortFunction, 'DESC');\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcase 'DESC':\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.setSortDirection(this.sortFunction, 'NOS');\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdefault:\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.setSortDirection(this.sortFunction, 'ASC');\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.updateSortedData();\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t_variant=\"ghost\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t></kol-button>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</th>\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t\t</tr>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</thead>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<tbody>{dataField.map(this.renderTableRow)}</tbody>\n\t\t\t\t\t\t{this.state._dataFoot.length > 0 ? this.renderFoot() : ''}\n\t\t\t\t\t</table>\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"mappings":"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"}

package/dist/kolibri/kol-tabs.entry.js

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{r as t,h as i,H as o,g as e}from"./index-34c3d6f8.js";import{d as s,b as n,f as a,c as l}from"./a11y.tipps-2e27f8e6.js";import{a as r,w as d,s as h,e as b,d as u,k as c}from"./prop.validators-f81af56e.js";import{a as p}from"./i18n-87a7ecb7.js";import{L as f}from"./dev.utils-157f0499.js";import"./index-ff788b4b.js";import"./index-bacdc4cb.js";import"./reuse-3a02afb9.js";const g=new Set(['"left", "right"']),v=new Set(['"bottom", "top"']),m=new Set([...g,...v]),k=(t,e,i)=>{r(t,e,(t=>"bottom"===t||"left"===t||"right"===t||"top"===t),m,i)},w=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}:host{display:block}kol-button-group-wc{display:inline-flex;flex-wrap:wrap}kol-button-group-wc button{border:0;border-bottom-color:transparent;border-bottom-style:solid;display:block}div.grid,div[role='tabpanel']{height:100%}:host>.tabs-align-right{display:grid;grid-template-columns:1fr auto}:host>.tabs-align-right kol-button-group-wc{display:grid;order:2}:host>.tabs-align-left{display:grid;grid-template-columns:auto 1fr}:host>.tabs-align-left kol-button-group-wc{display:grid;order:0}:host>.tabs-align-bottom{display:grid;grid-template-rows:1fr auto}:host>.tabs-align-bottom kol-button-group-wc{order:2}:host>.tabs-align-bottom kol-button-group-wc>div{display:flex}:host>.tabs-align-bottom>kol-button-group-wc>div>div:first-child{margin:0 1em 0 0}:host>.tabs-align-bottom>kol-button-group-wc>div>div{margin:0 1em}:host>.tabs-align-top{display:grid;grid-template-rows:auto 1fr}:host>.tabs-align-top kol-button-group-wc{order:0}:host>.tabs-align-top kol-button-group-wc>div{display:flex}:host>.tabs-align-top>kol-button-group-wc>div>div:first-child{margin:0 1em 0 0}:host>.tabs-align-top>kol-button-group-wc>div>div{margin:0 1em}:host>div{display:grid}:host>.tabs-align-left kol-button-group-wc,:host>.tabs-align-top kol-button-group-wc{order:0}:host>.tabs-align-bottom kol-button-group-wc,:host>.tabs-align-right kol-button-group-wc{order:1}:host>div.tabs-align-left kol-button-group-wc>div,:host>div.tabs-align-left kol-button-group-wc>div>div,:host>div.tabs-align-right kol-button-group-wc>div,:host>div.tabs-align-right kol-button-group-wc>div>div{display:grid}:host>div.tabs-align-left kol-button-group-wc>div>div kol-button-wc,:host>div.tabs-align-right kol-button-group-wc>div>div kol-button-wc{width:100%}:host>div.tabs-align-bottom kol-button-group-wc div,:host>div.tabs-align-top kol-button-group-wc div{display:flex;flex-wrap:wrap}",y=class{constructor(e){t(this,e),this.onCreateLabel=`${p("kol-new")} …`,this.showCreateTab=!1,this.nextPossibleTabIndex=(t,e,i)=>{if(i>0){if(e+i<t.length)return t[e+i]._disabled?this.nextPossibleTabIndex(t,e,i+1):e+i}else if(i<0&&e+i>=0)return t[e+i]._disabled?this.nextPossibleTabIndex(t,e,i-1):e+i;return e},this.onKeyDown=t=>{const e=setTimeout((()=>{clearTimeout(e);let i=null;switch(t.key){case"ArrowRight":i=this.nextPossibleTabIndex(this.state._tabs,this.state._selected,1);break;case"ArrowLeft":i=this.nextPossibleTabIndex(this.state._tabs,this.state._selected,-1)}null!==i&&this.onSelect(t,i,!0)}),250)},this.onClickSelect=(t,e)=>{this.onSelect(t,e,!0)},this.onMouseDown=t=>{t.stopPropagation()},this.callbacks={onClick:this.onClickSelect,onMouseDown:this.onMouseDown},this.catchTabPanelHost=t=>{this.tabPanelHost=t},this.selectNextNotDisabledTab=(t,e,i=!0,a)=>{if(t>e.length-1&&(t=e.length-1),t<0&&(t=0),Array.isArray(e)&&e[t]&&e[t]._disabled){if(!0===i){if(t<e.length-1)return this.selectNextNotDisabledTab(t+1,e,!0,a||t);t=a||t,i=!1}if(!1===i){if(t>0)return this.selectNextNotDisabledTab(t-1,e,!1,a||t);s("[KolTabs] Alle Tabs sind deaktiviert und somit kann kein Tab angezeigt werden.")}}return t},this.syncSelectedAndTabs=(t,e,i,a)=>{let o,s;o="_selected"===a?t:this.state._selected,s="_tabs"===a?t:this.state._tabs,s.length>0&&e.set("_selected",this.selectNextNotDisabledTab(o,s))},this.handleTabPanels=()=>{var t,e,i;if(this.tabPanelHost instanceof HTMLDivElement)for(let a=this.tabPanelHost.children.length;a<this.state._tabs.length;a++){const o=document.createElement("div");o.setAttribute("aria-labelledby",`tab-${a}`),o.setAttribute("id",`tabpanel-${a}`),o.setAttribute("role","tabpanel"),o.setAttribute("hidden","");const s=document.createElement("slot");s.setAttribute("name",`tabpanel-slot-${a}`),o.appendChild(s),this.tabPanelHost.appendChild(o),(null===(t=this.host)||void 0===t?void 0:t.children)instanceof HTMLCollection&&(null===(e=this.host)||void 0===e?void 0:e.children[a])&&(null===(i=this.host)||void 0===i||i.children[a].setAttribute("slot",`tabpanel-slot-${a}`))}},this.onCreate=t=>{var e,i;t.stopPropagation(),"function"==typeof(null===(e=this.state._on)||void 0===e?void 0:e.onCreate)&&(null===(i=this.state._on)||void 0===i||i.onCreate(t))},this._ariaLabel=void 0,this._on=void 0,this._selected=0,this._tabs=void 0,this._tabsAlign="top",this.state={_ariaLabel:"…",_selected:0,_tabs:[],_tabsAlign:"top"}}renderButtonGroup(){return i("kol-button-group-wc",{role:"tablist","aria-label":this.state._ariaLabel,onKeyDown:this.onKeyDown},this.state._tabs.map(((t,e)=>i("kol-button-wc",{_disabled:t._disabled,_icon:t._icon,_iconOnly:t._iconOnly,_label:t._label&&t._label,_on:this.callbacks,_tabIndex:this.state._selected===e?0:-1,_tooltipAlign:t._tooltipAlign,_variant:this.state._selected===e?"custom":void 0,_customClass:this.state._selected===e?"selected":void 0,_ariaControls:`tabpanel-${e}`,_ariaSelected:this.state._selected===e,_id:`tab-${e}`,_role:"tab",_value:e}))),this.showCreateTab&&i("kol-button-wc",{class:"create-button",_label:this.onCreateLabel,_on:{onClick:this.onCreate}}))}render(){return i(o,null,i("div",{ref:t=>{this.tabPanelsElement=t},class:{[`tabs-align-${this.state._tabsAlign}`]:!0}},this.renderButtonGroup(),i("div",{ref:this.catchTabPanelHost})))}validateAriaLabel(t){d(this,"_ariaLabel",t,{required:!0}),n(t)}validateOn(t){if("object"==typeof t&&null!==t){a("[KolTabs] Prüfen, wie man auch einen EventCallback einzeln ändern kann.");const e={};"function"!=typeof t.onCreate&&"object"!=typeof t.onCreate||("object"==typeof t.onCreate?("string"==typeof t.onCreate.label&&t.onCreate.label.length>0?this.onCreateLabel=t.onCreate.label:f.debug("[KolTabs] Der Label-Text für Neu in {\n  onCreate: {\n    label: string (!),\n    callback: Function\n  }\n} ist nicht korrekt gesetzt."),"function"==typeof t.onCreate.callback?e.onCreate=t.onCreate.callback:f.debug("[KolTabs] Die onCreate-Callback-Funktion für Neu in {\n  onCreate: {\n    label: string,\n    callback: Function (!)\n  }\n} ist nicht korrekt gesetzt.")):e.onCreate=t.onCreate,this.showCreateTab="function"==typeof e.onCreate),"function"==typeof t.onSelect&&(e.onSelect=t.onSelect),h(this,"_on",e)}}validateSelected(t){b(this,"_selected",t,{hooks:{beforePatch:this.syncSelectedAndTabs}})}validateTabs(t){u(this,"_tabs",(t=>"object"==typeof t&&null!==t&&"string"==typeof t._label&&t._label.length>0),t,void 0,{hooks:{beforePatch:this.syncSelectedAndTabs}}),l("KolTabs",this.state._tabs.length)}validateTabsAlign(t){k(this,"_tabsAlign",t)}componentWillLoad(){this.validateAriaLabel(this._ariaLabel),this.validateOn(this._on),this.validateSelected(this._selected),this.validateTabs(this._tabs),this.validateTabsAlign(this._tabsAlign)}componentDidRender(){if(this.handleTabPanels(),this.tabPanelHost instanceof HTMLDivElement)for(let t=0;t<this.tabPanelHost.children.length;t++)t!==this.state._selected?this.tabPanelHost.children[t].setAttribute("hidden",""):this.tabPanelHost.children[t].removeAttribute("hidden")}onSelect(t,e,i=!1){var a,o;this._selected=e,"function"==typeof(null===(a=this._on)||void 0===a?void 0:a.onSelect)&&(null===(o=this._on)||void 0===o||o.onSelect(t,e)),!0===i&&(this.selectedTimeout=setTimeout((()=>{if(clearTimeout(this.selectedTimeout),this.tabPanelsElement){const t=c(`button#tab-${e}`,this.tabPanelsElement);null==t||t.focus()}}),250))}get host(){return e(this)}static get watchers(){return{_ariaLabel:["validateAriaLabel"],_on:["validateOn"],_selected:["validateSelected"],_tabs:["validateTabs"],_tabsAlign:["validateTabsAlign"]}}};y.style={default:w};export{y as kol_tabs};
+import{r as t,h as i,H as o,g as e}from"./index-6ad587d0.js";import{d as s,b as n,f as a,c as l}from"./a11y.tipps-2e27f8e6.js";import{a as r,w as d,s as h,e as b,d as u,k as c}from"./prop.validators-f81af56e.js";import{a as p}from"./i18n-3ed8125e.js";import{L as f}from"./dev.utils-157f0499.js";import"./index-ff788b4b.js";import"./index-ebb14eab.js";import"./reuse-3a02afb9.js";const g=new Set(['"left", "right"']),v=new Set(['"bottom", "top"']),m=new Set([...g,...v]),k=(t,e,i)=>{r(t,e,(t=>"bottom"===t||"left"===t||"right"===t||"top"===t),m,i)},w=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}:host{display:block}kol-button-group-wc{display:inline-flex;flex-wrap:wrap}kol-button-group-wc button{border-bottom-color:transparent;border-bottom-style:solid;display:block}div.grid,div[role='tabpanel']{height:100%}:host>.tabs-align-right{display:grid;grid-template-columns:1fr auto}:host>.tabs-align-right kol-button-group-wc{display:grid;order:2}:host>.tabs-align-left{display:grid;grid-template-columns:auto 1fr}:host>.tabs-align-left kol-button-group-wc{display:grid;order:0}:host>.tabs-align-bottom{display:grid;grid-template-rows:1fr auto}:host>.tabs-align-bottom kol-button-group-wc{order:2}:host>.tabs-align-bottom kol-button-group-wc>div{display:flex}:host>.tabs-align-bottom>kol-button-group-wc>div>div:first-child{margin:0 1em 0 0}:host>.tabs-align-bottom>kol-button-group-wc>div>div{margin:0 1em}:host>.tabs-align-top{display:grid;grid-template-rows:auto 1fr}:host>.tabs-align-top kol-button-group-wc{order:0}:host>.tabs-align-top kol-button-group-wc>div{display:flex}:host>.tabs-align-top>kol-button-group-wc>div>div:first-child{margin:0 1em 0 0}:host>.tabs-align-top>kol-button-group-wc>div>div{margin:0 1em}:host>div{display:grid}:host>.tabs-align-left kol-button-group-wc,:host>.tabs-align-top kol-button-group-wc{order:0}:host>.tabs-align-bottom kol-button-group-wc,:host>.tabs-align-right kol-button-group-wc{order:1}:host>div.tabs-align-left kol-button-group-wc>div,:host>div.tabs-align-left kol-button-group-wc>div>div,:host>div.tabs-align-right kol-button-group-wc>div,:host>div.tabs-align-right kol-button-group-wc>div>div{display:grid}:host>div.tabs-align-left kol-button-group-wc>div>div kol-button-wc,:host>div.tabs-align-right kol-button-group-wc>div>div kol-button-wc{width:100%}:host>div.tabs-align-bottom kol-button-group-wc div,:host>div.tabs-align-top kol-button-group-wc div{display:flex;flex-wrap:wrap}",y=class{constructor(e){t(this,e),this.onCreateLabel=`${p("kol-new")} …`,this.showCreateTab=!1,this.nextPossibleTabIndex=(t,e,i)=>{if(i>0){if(e+i<t.length)return t[e+i]._disabled?this.nextPossibleTabIndex(t,e,i+1):e+i}else if(i<0&&e+i>=0)return t[e+i]._disabled?this.nextPossibleTabIndex(t,e,i-1):e+i;return e},this.onKeyDown=t=>{const e=setTimeout((()=>{clearTimeout(e);let i=null;switch(t.key){case"ArrowRight":i=this.nextPossibleTabIndex(this.state._tabs,this.state._selected,1);break;case"ArrowLeft":i=this.nextPossibleTabIndex(this.state._tabs,this.state._selected,-1)}null!==i&&this.onSelect(t,i,!0)}),250)},this.onClickSelect=(t,e)=>{this.onSelect(t,e,!0)},this.onMouseDown=t=>{t.stopPropagation()},this.callbacks={onClick:this.onClickSelect,onMouseDown:this.onMouseDown},this.catchTabPanelHost=t=>{this.tabPanelHost=t},this.selectNextNotDisabledTab=(t,e,i=!0,a)=>{if(t>e.length-1&&(t=e.length-1),t<0&&(t=0),Array.isArray(e)&&e[t]&&e[t]._disabled){if(!0===i){if(t<e.length-1)return this.selectNextNotDisabledTab(t+1,e,!0,a||t);t=a||t,i=!1}if(!1===i){if(t>0)return this.selectNextNotDisabledTab(t-1,e,!1,a||t);s("[KolTabs] Alle Tabs sind deaktiviert und somit kann kein Tab angezeigt werden.")}}return t},this.syncSelectedAndTabs=(t,e,i,a)=>{let o,s;o="_selected"===a?t:this.state._selected,s="_tabs"===a?t:this.state._tabs,s.length>0&&e.set("_selected",this.selectNextNotDisabledTab(o,s))},this.handleTabPanels=()=>{var t,e,i;if(this.tabPanelHost instanceof HTMLDivElement)for(let a=this.tabPanelHost.children.length;a<this.state._tabs.length;a++){const o=document.createElement("div");o.setAttribute("aria-labelledby",`tab-${a}`),o.setAttribute("id",`tabpanel-${a}`),o.setAttribute("role","tabpanel"),o.setAttribute("hidden","");const s=document.createElement("slot");s.setAttribute("name",`tabpanel-slot-${a}`),o.appendChild(s),this.tabPanelHost.appendChild(o),(null===(t=this.host)||void 0===t?void 0:t.children)instanceof HTMLCollection&&(null===(e=this.host)||void 0===e?void 0:e.children[a])&&(null===(i=this.host)||void 0===i||i.children[a].setAttribute("slot",`tabpanel-slot-${a}`))}},this.onCreate=t=>{var e,i;t.stopPropagation(),"function"==typeof(null===(e=this.state._on)||void 0===e?void 0:e.onCreate)&&(null===(i=this.state._on)||void 0===i||i.onCreate(t))},this._ariaLabel=void 0,this._on=void 0,this._selected=0,this._tabs=void 0,this._tabsAlign="top",this.state={_ariaLabel:"…",_selected:0,_tabs:[],_tabsAlign:"top"}}renderButtonGroup(){return i("kol-button-group-wc",{role:"tablist","aria-label":this.state._ariaLabel,onKeyDown:this.onKeyDown},this.state._tabs.map(((t,e)=>i("kol-button-wc",{_disabled:t._disabled,_icon:t._icon,_hideLabel:t._hideLabel||t._iconOnly,_label:t._label&&t._label,_on:this.callbacks,_tabIndex:this.state._selected===e?0:-1,_tooltipAlign:t._tooltipAlign,_variant:this.state._selected===e?"custom":void 0,_customClass:this.state._selected===e?"selected":void 0,_ariaControls:`tabpanel-${e}`,_ariaSelected:this.state._selected===e,_id:`tab-${e}`,_role:"tab",_value:e}))),this.showCreateTab&&i("kol-button-wc",{class:"create-button",_label:this.onCreateLabel,_on:{onClick:this.onCreate}}))}render(){return i(o,null,i("div",{ref:t=>{this.tabPanelsElement=t},class:{[`tabs-align-${this.state._tabsAlign}`]:!0}},this.renderButtonGroup(),i("div",{ref:this.catchTabPanelHost})))}validateAriaLabel(t){d(this,"_ariaLabel",t,{required:!0}),n(t)}validateOn(t){if("object"==typeof t&&null!==t){a("[KolTabs] Prüfen, wie man auch einen EventCallback einzeln ändern kann.");const e={};"function"!=typeof t.onCreate&&"object"!=typeof t.onCreate||("object"==typeof t.onCreate?("string"==typeof t.onCreate.label&&t.onCreate.label.length>0?this.onCreateLabel=t.onCreate.label:f.debug("[KolTabs] Der Label-Text für Neu in {\n  onCreate: {\n    label: string (!),\n    callback: Function\n  }\n} ist nicht korrekt gesetzt."),"function"==typeof t.onCreate.callback?e.onCreate=t.onCreate.callback:f.debug("[KolTabs] Die onCreate-Callback-Funktion für Neu in {\n  onCreate: {\n    label: string,\n    callback: Function (!)\n  }\n} ist nicht korrekt gesetzt.")):e.onCreate=t.onCreate,this.showCreateTab="function"==typeof e.onCreate),"function"==typeof t.onSelect&&(e.onSelect=t.onSelect),h(this,"_on",e)}}validateSelected(t){b(this,"_selected",t,{hooks:{beforePatch:this.syncSelectedAndTabs}})}validateTabs(t){u(this,"_tabs",(t=>"object"==typeof t&&null!==t&&"string"==typeof t._label&&t._label.length>0),t,void 0,{hooks:{beforePatch:this.syncSelectedAndTabs}}),l("KolTabs",this.state._tabs.length)}validateTabsAlign(t){k(this,"_tabsAlign",t)}componentWillLoad(){this.validateAriaLabel(this._ariaLabel),this.validateOn(this._on),this.validateSelected(this._selected),this.validateTabs(this._tabs),this.validateTabsAlign(this._tabsAlign)}componentDidRender(){if(this.handleTabPanels(),this.tabPanelHost instanceof HTMLDivElement)for(let t=0;t<this.tabPanelHost.children.length;t++)t!==this.state._selected?this.tabPanelHost.children[t].setAttribute("hidden",""):this.tabPanelHost.children[t].removeAttribute("hidden")}onSelect(t,e,i=!1){var a,o;this._selected=e,"function"==typeof(null===(a=this._on)||void 0===a?void 0:a.onSelect)&&(null===(o=this._on)||void 0===o||o.onSelect(t,e)),!0===i&&(this.selectedTimeout=setTimeout((()=>{if(clearTimeout(this.selectedTimeout),this.tabPanelsElement){const t=c(`button#tab-${e}`,this.tabPanelsElement);null==t||t.focus()}}),250))}get host(){return e(this)}static get watchers(){return{_ariaLabel:["validateAriaLabel"],_on:["validateOn"],_selected:["validateSelected"],_tabs:["validateTabs"],_tabsAlign:["validateTabsAlign"]}}};y.style={default:w};export{y as kol_tabs};