@public-ui/components 3.0.0-rc.5 → 3.0.0-rc.7

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

@@ -1 +1 @@
-{"version":3,"names":["paginationPositionPropTypeOptions","validatePaginationPosition","component","value","watchValidator","includes","Set","join","defaultValue","defaultStyleCss","KolTableStatefulDefaultStyle0","PAGINATION_OPTIONS","paginationValidator","KolTableStateful","this","catchRef","ref","tableWcRef","sortData","showPagination","pageStartSlice","pageEndSlice","disableSort","handlePagination","onClick","event","page","_a","state","_pagination","_on","setState","Object","assign","_page","onChangePage","onChangePageSize","pageSize","_pageSize","onSelectionChange","stopPropagation","updateSortedData","_data","sortedData","length","sort","a","b","index","data","result","compareFn","direction","_allowMultiSort","_dataFoot","_headers","horizontal","vertical","_label","_minWidth","_max","_sortedData","_paginationPosition","validateAllowMultiSort","validateData","validateTableData","afterPatch","setTimeout","validateDataFoot","validateTableDataFoot","changeCellSort","headerCell","key","findIndex","settings","splice","push","label","validateHeaders","emptyStringByArrayHandler","objectObjectHandler","parseJson","e","hooks","beforePatch","nextValue","applySort","headers","hasSortedCells","forEach","cell","sortDirection","_b","_c","_d","devHint","validateLabel","required","validateMinWidth","watchString","undefined","validateSelection","validateTableSelection","validateOn","validateTableStatefulCallbacks","validatePagination","componentDidLoad","addEventListener","KolEvent","selectionChange","disconnectedCallback","removeEventListener","componentWillLoad","_selection","selectDisplayedData","slice","renderPagination","h","class","translate","placeholders","start","toString","end","total","Array","isArray","KolPaginationTag","_boundaryCount","_customClass","_pageSizeOptions","_siblingCount","_tooltipAlign","getHeaderCellSortState","find","handleSort","flat","getSelectedData","selectedKeys","selection","keyPropertyName","filter","item","multiple","handleSelectionChange","selectedData","Callback","host","dispatchDomEvent","getSelection","render","displayedData","paginationTop","paginationBottom","headerCells","map","row","column","Host","KolTableStatelessWcTag","_headerCells","onSort","_","payload"],"sources":["src/schema/props/pagination-position.ts","src/components/table-stateful/style.scss?tag=kol-table-stateful&mode=default&encapsulation=shadow","src/components/table-stateful/shadow.tsx"],"sourcesContent":["/* types */\nimport type { Generic } from 'adopted-style-sheets';\nimport { watchValidator } from '../utils/prop.validators';\n\nconst paginationPositionPropTypeOptions = ['top', 'bottom', 'both'] as const;\nexport type PaginationPositionPropType = (typeof paginationPositionPropTypeOptions)[number];\n\n/**\n * Defines which position should be used for presentation.\n */\nexport type PropPaginationPosition = {\n\tpaginationPosition: PaginationPositionPropType;\n};\n\n/* validator */\nexport const validatePaginationPosition = (component: Generic.Element.Component, value?: PaginationPositionPropType): void => {\n\twatchValidator(\n\t\tcomponent,\n\t\t`_paginationPosition`,\n\t\t(value) => typeof value === 'string' && paginationPositionPropTypeOptions.includes(value),\n\t\tnew Set([`PaginationPositionPropType {${paginationPositionPropTypeOptions.join(', ')}`]),\n\t\tvalue,\n\t\t{\n\t\t\tdefaultValue: 'bottom',\n\t\t},\n\t);\n};\n","@import '../@shared/mixins';\n@import '../../styles/global';\n@import '../@shared/kol-table-stateless-mixin';\n\n@include kol-table-stateless-styles;\n\n@layer kol-component {\n\t:host {\n\t\tfont-size: rem(16);\n\t}\n\n\t.kol-table-stateful {\n\t\t&__pagination,\n\t\t&__pagination-wrapper {\n\t\t\tdisplay: grid;\n\t\t\tplace-items: center;\n\t\t\t@media (min-width: 1024px) {\n\t\t\t\tgrid-auto-flow: column;\n\t\t\t}\n\t\t}\n\t}\n\n\t.kol-pagination {\n\t\tdisplay: flex;\n\t\tflex-wrap: wrap;\n\t\t@media (min-width: 1024px) {\n\t\t\tdisplay: flex;\n\t\t}\n\n\t\t@media (max-width: 1024px) {\n\t\t\tflex-direction: column;\n\t\t}\n\t}\n}\n","/* eslint-disable jsx-a11y/no-noninteractive-tabindex */\nimport type { JSX } from '@stencil/core';\nimport { Component, Element, h, Host, Method, Prop, State, Watch } from '@stencil/core';\nimport { KolPaginationTag, KolTableStatelessWcTag } from '../../core/component-names';\nimport { translate } from '../../i18n';\nimport type {\n\tKoliBriDataCompareFn,\n\tKoliBriPaginationButtonCallbacks,\n\tKoliBriSortDirection,\n\tKoliBriTableDataType,\n\tKoliBriTableHeaderCellWithLogic,\n\tKoliBriTableHeaders,\n\tKoliBriTablePaginationProps,\n\tLabelPropType,\n\tPaginationPositionPropType,\n\tSortEventPayload,\n\tStringified,\n\tTableAPI,\n\tTableDataFootPropType,\n\tTableDataPropType,\n\tTableHeaderCells,\n\tTableSelectionPropType,\n\tTableStatefulCallbacksPropType,\n\tTableStates,\n} from '../../schema';\nimport {\n\tdevHint,\n\temptyStringByArrayHandler,\n\tobjectObjectHandler,\n\tparseJson,\n\tsetState,\n\tvalidateLabel,\n\tvalidatePaginationPosition,\n\tvalidateTableData,\n\tvalidateTableDataFoot,\n\tvalidateTableSelection,\n\tvalidateTableStatefulCallbacks,\n\twatchString,\n\twatchValidator,\n} from '../../schema';\nimport { Callback } from '../../schema/enums';\nimport type { MinWidthPropType } from '../../schema/props/min-width';\nimport { dispatchDomEvent, KolEvent } from '../../utils/events';\n\nconst PAGINATION_OPTIONS = [10, 20, 50, 100];\n\nconst paginationValidator = (value: unknown) => value === true || value === '' /* true */ || (typeof value === 'object' && value !== null);\n\ntype SortData = {\n\tlabel: string;\n\tkey: string;\n\tcompareFn: KoliBriDataCompareFn;\n\tdirection: KoliBriSortDirection;\n};\n\n@Component({\n\ttag: 'kol-table-stateful',\n\tstyleUrls: {\n\t\tdefault: './style.scss',\n\t},\n\tshadow: true,\n})\nexport class KolTableStateful implements TableAPI {\n\t@Element() private readonly host?: HTMLKolTableStatelessWcElement;\n\tprivate tableWcRef?: HTMLKolTableStatelessWcElement;\n\n\tprivate readonly catchRef = (ref?: HTMLKolTableStatelessWcElement) => {\n\t\tthis.tableWcRef = ref;\n\t};\n\n\tprivate sortData: SortData[] = [];\n\tprivate showPagination = false;\n\tprivate pageStartSlice = 0;\n\tprivate pageEndSlice = 10;\n\tprivate disableSort = false;\n\n\t/**\n\t * Defines whether to allow multi sort.\n\t */\n\t@Prop() public _allowMultiSort?: boolean;\n\n\t/**\n\t * Defines the primary table data.\n\t */\n\t@Prop() public _data!: Stringified<KoliBriTableDataType[]>;\n\n\t/**\n\t * Defines the data for the table footer.\n\t */\n\t@Prop() public _dataFoot?: Stringified<KoliBriTableDataType[]>;\n\n\t/**\n\t * Defines the horizontal and vertical table headers.\n\t */\n\t@Prop() public _headers!: Stringified<KoliBriTableHeaders>;\n\n\t/**\n\t * Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.).\n\t */\n\t@Prop() public _label!: string;\n\n\t/**\n\t * Defines the table min-width (CSS width values).\n\t */\n\t@Prop() public _minWidth!: MinWidthPropType;\n\n\t/**\n\t * Defines whether to show the data distributed over multiple pages.\n\t */\n\t@Prop() public _pagination?: boolean | Stringified<KoliBriTablePaginationProps>;\n\t/**\n\t * Controls the position of the pagination.\n\t */\n\t@Prop() public _paginationPosition?: PaginationPositionPropType = 'bottom';\n\t/**\n\t * Defines how rows can be selected and the current selection.\n\t */\n\t@Prop() public _selection?: TableSelectionPropType;\n\t/**\n\t * Defines the callback functions for table events.\n\t */\n\t@Prop() public _on?: TableStatefulCallbacksPropType;\n\n\t@State() public state: TableStates = {\n\t\t_allowMultiSort: false,\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_label: '', // ⚠ required\n\t\t_minWidth: 'auto',\n\t\t_pagination: {\n\t\t\t_page: 1,\n\t\t\t_pageSize: 10,\n\t\t\t_max: 0,\n\t\t},\n\t\t_sortedData: [],\n\t\t_paginationPosition: 'bottom',\n\t};\n\n\t@Watch('_allowMultiSort')\n\tpublic validateAllowMultiSort(value?: boolean): void {\n\t\twatchValidator(this, '_allowMultiSort', () => true, new Set(['boolean']), value, {\n\t\t\tdefaultValue: false,\n\t\t});\n\t}\n\n\t@Watch('_data')\n\tpublic validateData(value?: TableDataPropType): void {\n\t\tvalidateTableData(this, value, {\n\t\t\tafterPatch: () => {\n\t\t\t\t// TODO: kein guter Hack (endless loop)\n\t\t\t\tsetTimeout(this.updateSortedData);\n\t\t\t},\n\t\t});\n\t}\n\n\t@Watch('_dataFoot')\n\tpublic validateDataFoot(value?: TableDataFootPropType): void {\n\t\tvalidateTableDataFoot(this, value, {\n\t\t\tafterPatch: () => {\n\t\t\t\tsetTimeout(this.updateSortedData);\n\t\t\t},\n\t\t});\n\t}\n\n\t@Watch('_paginationPosition')\n\tpublic validatePaginationPosition(value?: PaginationPositionPropType): void {\n\t\tvalidatePaginationPosition(this, value);\n\t}\n\n\t/**\n\t * Handles sorting logic for table columns.\n\t * If multi-sort is enabled (`_allowMultiSort`), multiple columns can be sorted at once.\n\t * Otherwise, sorting is cleared when switching between columns.\n\t */\n\tprivate changeCellSort(headerCell: KoliBriTableHeaderCellWithLogic) {\n\t\tif (typeof headerCell.compareFn === 'function') {\n\t\t\tif (!this.state._allowMultiSort && headerCell.key != this.sortData[0]?.key) {\n\t\t\t\t// clear when another column is sorted and multi sort is not allowed\n\t\t\t\tthis.sortData = [];\n\t\t\t}\n\n\t\t\tconst index = this.sortData.findIndex((value) => value.key === headerCell.key);\n\t\t\tif (index >= 0) {\n\t\t\t\tconst settings = this.sortData[index];\n\t\t\t\tswitch (settings.direction) {\n\t\t\t\t\tcase 'ASC':\n\t\t\t\t\t\tsettings.direction = 'DESC';\n\t\t\t\t\t\tbreak;\n\t\t\t\t\tcase 'DESC':\n\t\t\t\t\t\tthis.sortData.splice(index, 1);\n\t\t\t\t\t\tbreak;\n\t\t\t\t\tdefault:\n\t\t\t\t\t\tsettings.direction = 'ASC';\n\t\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t} else if (headerCell.key) {\n\t\t\t\tthis.sortData.push({\n\t\t\t\t\tlabel: headerCell.label,\n\t\t\t\t\tkey: headerCell.key,\n\t\t\t\t\tcompareFn: headerCell.compareFn,\n\t\t\t\t\tdirection: 'ASC',\n\t\t\t\t});\n\t\t\t}\n\n\t\t\tthis.updateSortedData();\n\t\t}\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 applySort = (headers: KoliBriTableHeaderCellWithLogic[]) => {\n\t\t\t\t\t\t\t\tlet hasSortedCells = false;\n\t\t\t\t\t\t\t\theaders.forEach((cell) => {\n\t\t\t\t\t\t\t\t\tconst key = cell.key;\n\t\t\t\t\t\t\t\t\tif (!key) {\n\t\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tconst sortDirection = cell.sortDirection;\n\t\t\t\t\t\t\t\t\tif (sortDirection === 'ASC' || sortDirection === 'DESC') {\n\t\t\t\t\t\t\t\t\t\tif (typeof cell.compareFn === 'function') {\n\t\t\t\t\t\t\t\t\t\t\tif (this.state._allowMultiSort || this.sortData.length === 0) {\n\t\t\t\t\t\t\t\t\t\t\t\tthis.sortData.push({ label: cell.label, key, compareFn: cell.compareFn, direction: sortDirection });\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\thasSortedCells = true;\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t\tif (hasSortedCells) {\n\t\t\t\t\t\t\t\t\tsetTimeout(() => this.updateSortedData());\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t};\n\n\t\t\t\t\t\t\tconst headers: KoliBriTableHeaders = nextValue as KoliBriTableHeaders;\n\t\t\t\t\t\t\theaders.horizontal?.forEach(applySort);\n\t\t\t\t\t\t\theaders.vertical?.forEach(applySort);\n\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('_label')\n\tpublic validateLabel(value?: LabelPropType): void {\n\t\tvalidateLabel(this, value, {\n\t\t\trequired: true,\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\t@Watch('_selection')\n\tpublic validateSelection(value?: TableSelectionPropType): void {\n\t\tvalidateTableSelection(this, value);\n\t}\n\t@Watch('_on')\n\tpublic validateOn(value?: TableStatefulCallbacksPropType): void {\n\t\tvalidateTableStatefulCallbacks(this, value);\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\t@Watch('_pagination')\n\tpublic validatePagination(value?: boolean | Stringified<KoliBriTablePaginationProps>): void {\n\t\ttry {\n\t\t\tvalue = parseJson<boolean | 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\n\t\tthis.showPagination = paginationValidator(value);\n\n\t\twatchValidator<boolean | Stringified<KoliBriTablePaginationProps>>(\n\t\t\tthis,\n\t\t\t'_pagination',\n\t\t\tpaginationValidator,\n\t\t\tnew Set(['boolean', 'KoliBriTablePagination']),\n\t\t\tvalue,\n\t\t\t{\n\t\t\t\tdefaultValue: {\n\t\t\t\t\t_page: 1,\n\t\t\t\t\t_pageSize: 10,\n\t\t\t\t\t_max: 0,\n\t\t\t\t},\n\t\t\t},\n\t\t);\n\t}\n\n\tprivate onSelectionChange = (event: Event): void => {\n\t\t/* Stop propagation for selectionChange event from table-stateless component because table-stateful emits its own selectionChange event. */\n\t\tevent.stopPropagation();\n\t};\n\n\tpublic componentDidLoad(): void {\n\t\tthis.tableWcRef?.addEventListener(KolEvent.selectionChange, this.onSelectionChange);\n\t}\n\n\tpublic disconnectedCallback(): void {\n\t\tthis.tableWcRef?.removeEventListener(KolEvent.selectionChange, this.onSelectionChange);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAllowMultiSort(this._allowMultiSort);\n\t\tthis.validateData(this._data);\n\t\tthis.validateDataFoot(this._dataFoot);\n\t\tthis.validateHeaders(this._headers);\n\t\tthis.validateLabel(this._label);\n\t\tthis.validateMinWidth(this._minWidth);\n\t\tthis.validatePagination(this._pagination);\n\t\tthis.validatePaginationPosition(this._paginationPosition);\n\t\tthis.validateSelection(this._selection);\n\t\tthis.validateOn(this._on);\n\t}\n\n\tprivate selectDisplayedData(data: KoliBriTableDataType[], pageSize: number, page: number): KoliBriTableDataType[] {\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 updateSortedData = () => {\n\t\tif (this.disableSort) {\n\t\t\tsetState(this, '_sortedData', this.state._data);\n\t\t\treturn;\n\t\t}\n\n\t\tlet sortedData: KoliBriTableDataType[] = this.state._data;\n\t\tif (this.sortData.length > 0) {\n\t\t\tsortedData = this.state._data.sort((a: KoliBriTableDataType, b: KoliBriTableDataType) => {\n\t\t\t\tfor (let index = 0; index < this.sortData.length; index++) {\n\t\t\t\t\tconst data = this.sortData[index];\n\t\t\t\t\tconst result = data.compareFn(a, b);\n\t\t\t\t\tif (result !== 0) {\n\t\t\t\t\t\treturn data.direction === 'ASC' ? result : -result;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\treturn 0;\n\t\t\t});\n\t\t}\n\t\tsetState(this, '_sortedData', sortedData);\n\t};\n\n\t/**\n\t * Renders the pagination controls for the table, showing the current visible data range\n\t * and providing navigation between different pages.\n\t *\n\t * @returns {JSX.Element} The rendered pagination controls including page range and navigation.\n\t */\n\tprivate renderPagination(): JSX.Element {\n\t\treturn (\n\t\t\t<div class={`kol-table-stateful__pagination kol-table-stateful__pagination--${this.state._paginationPosition}`}>\n\t\t\t\t<span>\n\t\t\t\t\t{translate('kol-table-visible-range', {\n\t\t\t\t\t\tplaceholders: {\n\t\t\t\t\t\t\tstart: this.pageEndSlice > 0 ? (this.pageStartSlice + 1).toString() : '0',\n\t\t\t\t\t\t\tend: this.pageEndSlice.toString(),\n\t\t\t\t\t\t\ttotal:\n\t\t\t\t\t\t\t\tthis.state._pagination && this.state._pagination._max > 0\n\t\t\t\t\t\t\t\t\t? this.state._pagination._max.toString()\n\t\t\t\t\t\t\t\t\t: Array.isArray(this.state._data)\n\t\t\t\t\t\t\t\t\t\t? this.state._data.length.toString()\n\t\t\t\t\t\t\t\t\t\t: '0',\n\t\t\t\t\t\t},\n\t\t\t\t\t})}\n\t\t\t\t</span>\n\t\t\t\t<div class=\"kol-table-stateful__pagination-wrapper\">\n\t\t\t\t\t<KolPaginationTag\n\t\t\t\t\t\tclass=\"test\"\n\t\t\t\t\t\t_boundaryCount={this.state._pagination._boundaryCount}\n\t\t\t\t\t\t_customClass={this.state._pagination._customClass}\n\t\t\t\t\t\t_on={this.handlePagination}\n\t\t\t\t\t\t_page={this.state._pagination._page}\n\t\t\t\t\t\t_pageSize={this.state._pagination._pageSize}\n\t\t\t\t\t\t_pageSizeOptions={this.state._pagination._pageSizeOptions || PAGINATION_OPTIONS}\n\t\t\t\t\t\t_siblingCount={this.state._pagination._siblingCount}\n\t\t\t\t\t\t_tooltipAlign=\"bottom\"\n\t\t\t\t\t\t_max={this.state._pagination._max || this.state._pagination._max || this.state._data.length}\n\t\t\t\t\t\t_label={translate('kol-table-pagination-label', { placeholders: { label: this.state._label } })}\n\t\t\t\t\t></KolPaginationTag>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t);\n\t}\n\n\tprivate getHeaderCellSortState(headerCell: KoliBriTableHeaderCellWithLogic): KoliBriSortDirection | undefined {\n\t\tif (!this.disableSort && typeof headerCell.compareFn === 'function') {\n\t\t\tif (headerCell.key) {\n\t\t\t\tconst data = this.sortData.find((value) => value.key === headerCell.key);\n\t\t\t\tif (data?.direction) {\n\t\t\t\t\treturn data.direction;\n\t\t\t\t}\n\t\t\t}\n\t\t\treturn 'NOS';\n\t\t}\n\t}\n\n\tprivate handleSort({ key }: SortEventPayload) {\n\t\tconst headerCell = [...(this.state._headers.horizontal || []).flat(), ...(this.state._headers.vertical || []).flat()].find((cell) => cell.key === key);\n\t\tif (headerCell) {\n\t\t\tthis.changeCellSort(headerCell);\n\t\t}\n\t}\n\n\tprivate getSelectedData(selectedKeys: string[] | string): null | KoliBriTableDataType | KoliBriTableDataType[] {\n\t\tconst selection = this.state._selection;\n\t\tif (selection) {\n\t\t\tconst keyPropertyName = selection.keyPropertyName ?? 'id';\n\t\t\tconst data = this.state._sortedData.filter((item) => selectedKeys.includes(item[keyPropertyName] as string));\n\t\t\tif (selection?.multiple === false) {\n\t\t\t\treturn data[0];\n\t\t\t}\n\n\t\t\tif (keyPropertyName) return data;\n\t\t}\n\t\treturn null;\n\t}\n\tprivate handleSelectionChange(event: Event, value: string[] | string): void {\n\t\tconst selection = this.state._selection;\n\t\tif (selection)\n\t\t\tthis.state = {\n\t\t\t\t...this.state,\n\t\t\t\t_selection: {\n\t\t\t\t\t...selection,\n\t\t\t\t\tselectedKeys: typeof value === 'object' ? value : [value],\n\t\t\t\t},\n\t\t\t};\n\t\tconst selectedData = this.getSelectedData(value);\n\n\t\tif (typeof this.state._on?.[Callback.onSelectionChange] === 'function') {\n\t\t\tthis.state._on[Callback.onSelectionChange](event, selectedData);\n\t\t}\n\t\tif (this.host) {\n\t\t\tdispatchDomEvent(this.host, KolEvent.selectionChange, selectedData);\n\t\t}\n\t}\n\n\t@Method()\n\t// eslint-disable-next-line @typescript-eslint/require-await\n\tpublic async getSelection(): Promise<KoliBriTableDataType[] | KoliBriTableDataType | null> {\n\t\tconst selectedKeys: string[] = this.state._selection?.selectedKeys || [];\n\t\treturn this.getSelectedData(selectedKeys);\n\t}\n\n\tpublic render(): JSX.Element {\n\t\tconst displayedData: KoliBriTableDataType[] = 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 paginationTop = this._paginationPosition === 'top' || this._paginationPosition === 'both' ? this.renderPagination() : null;\n\t\tconst paginationBottom = this._paginationPosition === 'bottom' || this._paginationPosition === 'both' ? this.renderPagination() : null;\n\n\t\tconst headerCells: TableHeaderCells = {\n\t\t\thorizontal: this.state._headers.horizontal?.map((row) => row.map((cell) => ({ ...cell, sortDirection: this.getHeaderCellSortState(cell) }))),\n\t\t\tvertical: this.state._headers.vertical?.map((column) => column.map((cell) => ({ ...cell, sortDirection: this.getHeaderCellSortState(cell) }))),\n\t\t};\n\t\treturn (\n\t\t\t<Host class=\"kol-table-stateful\">\n\t\t\t\t{this.pageEndSlice > 0 && this.showPagination && paginationTop}\n\t\t\t\t<KolTableStatelessWcTag\n\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t_data={displayedData}\n\t\t\t\t\t_headerCells={headerCells}\n\t\t\t\t\t_label={this.state._label}\n\t\t\t\t\t_dataFoot={this.state._dataFoot}\n\t\t\t\t\t_minWidth={this.state._minWidth}\n\t\t\t\t\t_on={{\n\t\t\t\t\t\tonSort: (_: MouseEvent, payload: SortEventPayload) => {\n\t\t\t\t\t\t\tthis.handleSort(payload);\n\t\t\t\t\t\t},\n\t\t\t\t\t\tonSelectionChange: (event: Event, value: string[] | string) => {\n\t\t\t\t\t\t\tthis.handleSelectionChange(event, value);\n\t\t\t\t\t\t},\n\t\t\t\t\t}}\n\t\t\t\t\t_selection={this.state._selection}\n\t\t\t\t/>\n\t\t\t\t{this.pageEndSlice > 0 && this.showPagination && paginationBottom}\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["paginationPositionPropTypeOptions","validatePaginationPosition","component","value","watchValidator","includes","Set","join","defaultValue","defaultStyleCss","KolTableStatefulDefaultStyle0","PAGINATION_OPTIONS","paginationValidator","KolTableStateful","this","catchRef","ref","tableWcRef","sortData","showPagination","pageStartSlice","pageEndSlice","disableSort","handlePagination","onClick","event","page","_a","state","_pagination","_on","setState","Object","assign","_page","onChangePage","onChangePageSize","pageSize","_pageSize","onSelectionChange","stopPropagation","updateSortedData","_data","sortedData","length","sort","a","b","index","data","result","compareFn","direction","_allowMultiSort","_dataFoot","_headers","horizontal","vertical","_label","_minWidth","_max","_sortedData","_paginationPosition","validateAllowMultiSort","validateData","validateTableData","afterPatch","setTimeout","validateDataFoot","validateTableDataFoot","changeCellSort","headerCell","key","findIndex","settings","splice","push","label","validateHeaders","emptyStringByArrayHandler","objectObjectHandler","parseJson","e","hooks","beforePatch","nextValue","applySort","headers","hasSortedCells","forEach","cell","sortDirection","_b","_c","_d","devHint","validateLabel","required","validateMinWidth","watchString","undefined","validateSelection","validateTableSelection","validateOn","validateTableStatefulCallbacks","validatePagination","componentDidLoad","addEventListener","KolEvent","selectionChange","disconnectedCallback","removeEventListener","componentWillLoad","_selection","selectDisplayedData","slice","renderPagination","h","class","translate","placeholders","start","toString","end","total","Array","isArray","KolPaginationTag","_boundaryCount","_customClass","_pageSizeOptions","_siblingCount","_tooltipAlign","getHeaderCellSortState","find","handleSort","flat","getSelectedData","selectedKeys","selection","keyPropertyName","filter","item","multiple","handleSelectionChange","selectedData","Callback","host","dispatchDomEvent","getSelection","render","displayedData","paginationTop","paginationBottom","headerCells","map","row","column","Host","KolTableStatelessWcTag","_headerCells","onSort","_","payload"],"sources":["src/schema/props/pagination-position.ts","src/components/table-stateful/style.scss?tag=kol-table-stateful&mode=default&encapsulation=shadow","src/components/table-stateful/shadow.tsx"],"sourcesContent":["/* types */\nimport type { Generic } from 'adopted-style-sheets';\nimport { watchValidator } from '../utils/prop.validators';\n\nconst paginationPositionPropTypeOptions = ['top', 'bottom', 'both'] as const;\nexport type PaginationPositionPropType = (typeof paginationPositionPropTypeOptions)[number];\n\n/**\n * Defines which position should be used for presentation.\n */\nexport type PropPaginationPosition = {\n\tpaginationPosition: PaginationPositionPropType;\n};\n\n/* validator */\nexport const validatePaginationPosition = (component: Generic.Element.Component, value?: PaginationPositionPropType): void => {\n\twatchValidator(\n\t\tcomponent,\n\t\t`_paginationPosition`,\n\t\t(value) => typeof value === 'string' && paginationPositionPropTypeOptions.includes(value),\n\t\tnew Set([`PaginationPositionPropType {${paginationPositionPropTypeOptions.join(', ')}`]),\n\t\tvalue,\n\t\t{\n\t\t\tdefaultValue: 'bottom',\n\t\t},\n\t);\n};\n","@use '../@shared/mixins' as *;\n@use '../../styles/global' as *;\n@use '../@shared/kol-table-stateless-mixin' as *;\n\n@include kol-table-stateless-styles;\n\n@layer kol-component {\n\t:host {\n\t\tfont-size: rem(16);\n\t}\n\n\t.kol-table-stateful {\n\t\t&__pagination,\n\t\t&__pagination-wrapper {\n\t\t\tdisplay: grid;\n\t\t\tplace-items: center;\n\n\t\t\t@media (min-width: 1024px) {\n\t\t\t\tgrid-auto-flow: column;\n\t\t\t}\n\t\t}\n\t}\n\n\t.kol-pagination {\n\t\tdisplay: flex;\n\t\tflex-wrap: wrap;\n\n\t\t@media (min-width: 1024px) {\n\t\t\tdisplay: flex;\n\t\t}\n\n\t\t@media (max-width: 1024px) {\n\t\t\tflex-direction: column;\n\t\t}\n\t}\n}\n","/* eslint-disable jsx-a11y/no-noninteractive-tabindex */\nimport type { JSX } from '@stencil/core';\nimport { Component, Element, h, Host, Method, Prop, State, Watch } from '@stencil/core';\nimport { KolPaginationTag, KolTableStatelessWcTag } from '../../core/component-names';\nimport { translate } from '../../i18n';\nimport type {\n\tKoliBriDataCompareFn,\n\tKoliBriPaginationButtonCallbacks,\n\tKoliBriSortDirection,\n\tKoliBriTableDataType,\n\tKoliBriTableHeaderCellWithLogic,\n\tKoliBriTableHeaders,\n\tKoliBriTablePaginationProps,\n\tLabelPropType,\n\tPaginationPositionPropType,\n\tSortEventPayload,\n\tStringified,\n\tTableAPI,\n\tTableDataFootPropType,\n\tTableDataPropType,\n\tTableHeaderCells,\n\tTableSelectionPropType,\n\tTableStatefulCallbacksPropType,\n\tTableStates,\n} from '../../schema';\nimport {\n\tdevHint,\n\temptyStringByArrayHandler,\n\tobjectObjectHandler,\n\tparseJson,\n\tsetState,\n\tvalidateLabel,\n\tvalidatePaginationPosition,\n\tvalidateTableData,\n\tvalidateTableDataFoot,\n\tvalidateTableSelection,\n\tvalidateTableStatefulCallbacks,\n\twatchString,\n\twatchValidator,\n} from '../../schema';\nimport { Callback } from '../../schema/enums';\nimport type { MinWidthPropType } from '../../schema/props/min-width';\nimport { dispatchDomEvent, KolEvent } from '../../utils/events';\n\nconst PAGINATION_OPTIONS = [10, 20, 50, 100];\n\nconst paginationValidator = (value: unknown) => value === true || value === '' /* true */ || (typeof value === 'object' && value !== null);\n\ntype SortData = {\n\tlabel: string;\n\tkey: string;\n\tcompareFn: KoliBriDataCompareFn;\n\tdirection: KoliBriSortDirection;\n};\n\n@Component({\n\ttag: 'kol-table-stateful',\n\tstyleUrls: {\n\t\tdefault: './style.scss',\n\t},\n\tshadow: true,\n})\nexport class KolTableStateful implements TableAPI {\n\t@Element() private readonly host?: HTMLKolTableStatelessWcElement;\n\tprivate tableWcRef?: HTMLKolTableStatelessWcElement;\n\n\tprivate readonly catchRef = (ref?: HTMLKolTableStatelessWcElement) => {\n\t\tthis.tableWcRef = ref;\n\t};\n\n\tprivate sortData: SortData[] = [];\n\tprivate showPagination = false;\n\tprivate pageStartSlice = 0;\n\tprivate pageEndSlice = 10;\n\tprivate disableSort = false;\n\n\t/**\n\t * Defines whether to allow multi sort.\n\t */\n\t@Prop() public _allowMultiSort?: boolean;\n\n\t/**\n\t * Defines the primary table data.\n\t */\n\t@Prop() public _data!: Stringified<KoliBriTableDataType[]>;\n\n\t/**\n\t * Defines the data for the table footer.\n\t */\n\t@Prop() public _dataFoot?: Stringified<KoliBriTableDataType[]>;\n\n\t/**\n\t * Defines the horizontal and vertical table headers.\n\t */\n\t@Prop() public _headers!: Stringified<KoliBriTableHeaders>;\n\n\t/**\n\t * Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.).\n\t */\n\t@Prop() public _label!: string;\n\n\t/**\n\t * Defines the table min-width (CSS width values).\n\t */\n\t@Prop() public _minWidth!: MinWidthPropType;\n\n\t/**\n\t * Defines whether to show the data distributed over multiple pages.\n\t */\n\t@Prop() public _pagination?: boolean | Stringified<KoliBriTablePaginationProps>;\n\t/**\n\t * Controls the position of the pagination.\n\t */\n\t@Prop() public _paginationPosition?: PaginationPositionPropType = 'bottom';\n\t/**\n\t * Defines how rows can be selected and the current selection.\n\t */\n\t@Prop() public _selection?: TableSelectionPropType;\n\t/**\n\t * Defines the callback functions for table events.\n\t */\n\t@Prop() public _on?: TableStatefulCallbacksPropType;\n\n\t@State() public state: TableStates = {\n\t\t_allowMultiSort: false,\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_label: '', // ⚠ required\n\t\t_minWidth: 'auto',\n\t\t_pagination: {\n\t\t\t_page: 1,\n\t\t\t_pageSize: 10,\n\t\t\t_max: 0,\n\t\t},\n\t\t_sortedData: [],\n\t\t_paginationPosition: 'bottom',\n\t};\n\n\t@Watch('_allowMultiSort')\n\tpublic validateAllowMultiSort(value?: boolean): void {\n\t\twatchValidator(this, '_allowMultiSort', () => true, new Set(['boolean']), value, {\n\t\t\tdefaultValue: false,\n\t\t});\n\t}\n\n\t@Watch('_data')\n\tpublic validateData(value?: TableDataPropType): void {\n\t\tvalidateTableData(this, value, {\n\t\t\tafterPatch: () => {\n\t\t\t\t// TODO: kein guter Hack (endless loop)\n\t\t\t\tsetTimeout(this.updateSortedData);\n\t\t\t},\n\t\t});\n\t}\n\n\t@Watch('_dataFoot')\n\tpublic validateDataFoot(value?: TableDataFootPropType): void {\n\t\tvalidateTableDataFoot(this, value, {\n\t\t\tafterPatch: () => {\n\t\t\t\tsetTimeout(this.updateSortedData);\n\t\t\t},\n\t\t});\n\t}\n\n\t@Watch('_paginationPosition')\n\tpublic validatePaginationPosition(value?: PaginationPositionPropType): void {\n\t\tvalidatePaginationPosition(this, value);\n\t}\n\n\t/**\n\t * Handles sorting logic for table columns.\n\t * If multi-sort is enabled (`_allowMultiSort`), multiple columns can be sorted at once.\n\t * Otherwise, sorting is cleared when switching between columns.\n\t */\n\tprivate changeCellSort(headerCell: KoliBriTableHeaderCellWithLogic) {\n\t\tif (typeof headerCell.compareFn === 'function') {\n\t\t\tif (!this.state._allowMultiSort && headerCell.key != this.sortData[0]?.key) {\n\t\t\t\t// clear when another column is sorted and multi sort is not allowed\n\t\t\t\tthis.sortData = [];\n\t\t\t}\n\n\t\t\tconst index = this.sortData.findIndex((value) => value.key === headerCell.key);\n\t\t\tif (index >= 0) {\n\t\t\t\tconst settings = this.sortData[index];\n\t\t\t\tswitch (settings.direction) {\n\t\t\t\t\tcase 'ASC':\n\t\t\t\t\t\tsettings.direction = 'DESC';\n\t\t\t\t\t\tbreak;\n\t\t\t\t\tcase 'DESC':\n\t\t\t\t\t\tthis.sortData.splice(index, 1);\n\t\t\t\t\t\tbreak;\n\t\t\t\t\tdefault:\n\t\t\t\t\t\tsettings.direction = 'ASC';\n\t\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t} else if (headerCell.key) {\n\t\t\t\tthis.sortData.push({\n\t\t\t\t\tlabel: headerCell.label,\n\t\t\t\t\tkey: headerCell.key,\n\t\t\t\t\tcompareFn: headerCell.compareFn,\n\t\t\t\t\tdirection: 'ASC',\n\t\t\t\t});\n\t\t\t}\n\n\t\t\tthis.updateSortedData();\n\t\t}\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 applySort = (headers: KoliBriTableHeaderCellWithLogic[]) => {\n\t\t\t\t\t\t\t\tlet hasSortedCells = false;\n\t\t\t\t\t\t\t\theaders.forEach((cell) => {\n\t\t\t\t\t\t\t\t\tconst key = cell.key;\n\t\t\t\t\t\t\t\t\tif (!key) {\n\t\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tconst sortDirection = cell.sortDirection;\n\t\t\t\t\t\t\t\t\tif (sortDirection === 'ASC' || sortDirection === 'DESC') {\n\t\t\t\t\t\t\t\t\t\tif (typeof cell.compareFn === 'function') {\n\t\t\t\t\t\t\t\t\t\t\tif (this.state._allowMultiSort || this.sortData.length === 0) {\n\t\t\t\t\t\t\t\t\t\t\t\tthis.sortData.push({ label: cell.label, key, compareFn: cell.compareFn, direction: sortDirection });\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\thasSortedCells = true;\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t\tif (hasSortedCells) {\n\t\t\t\t\t\t\t\t\tsetTimeout(() => this.updateSortedData());\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t};\n\n\t\t\t\t\t\t\tconst headers: KoliBriTableHeaders = nextValue as KoliBriTableHeaders;\n\t\t\t\t\t\t\theaders.horizontal?.forEach(applySort);\n\t\t\t\t\t\t\theaders.vertical?.forEach(applySort);\n\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('_label')\n\tpublic validateLabel(value?: LabelPropType): void {\n\t\tvalidateLabel(this, value, {\n\t\t\trequired: true,\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\t@Watch('_selection')\n\tpublic validateSelection(value?: TableSelectionPropType): void {\n\t\tvalidateTableSelection(this, value);\n\t}\n\t@Watch('_on')\n\tpublic validateOn(value?: TableStatefulCallbacksPropType): void {\n\t\tvalidateTableStatefulCallbacks(this, value);\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\t@Watch('_pagination')\n\tpublic validatePagination(value?: boolean | Stringified<KoliBriTablePaginationProps>): void {\n\t\ttry {\n\t\t\tvalue = parseJson<boolean | 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\n\t\tthis.showPagination = paginationValidator(value);\n\n\t\twatchValidator<boolean | Stringified<KoliBriTablePaginationProps>>(\n\t\t\tthis,\n\t\t\t'_pagination',\n\t\t\tpaginationValidator,\n\t\t\tnew Set(['boolean', 'KoliBriTablePagination']),\n\t\t\tvalue,\n\t\t\t{\n\t\t\t\tdefaultValue: {\n\t\t\t\t\t_page: 1,\n\t\t\t\t\t_pageSize: 10,\n\t\t\t\t\t_max: 0,\n\t\t\t\t},\n\t\t\t},\n\t\t);\n\t}\n\n\tprivate onSelectionChange = (event: Event): void => {\n\t\t/* Stop propagation for selectionChange event from table-stateless component because table-stateful emits its own selectionChange event. */\n\t\tevent.stopPropagation();\n\t};\n\n\tpublic componentDidLoad(): void {\n\t\tthis.tableWcRef?.addEventListener(KolEvent.selectionChange, this.onSelectionChange);\n\t}\n\n\tpublic disconnectedCallback(): void {\n\t\tthis.tableWcRef?.removeEventListener(KolEvent.selectionChange, this.onSelectionChange);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAllowMultiSort(this._allowMultiSort);\n\t\tthis.validateData(this._data);\n\t\tthis.validateDataFoot(this._dataFoot);\n\t\tthis.validateHeaders(this._headers);\n\t\tthis.validateLabel(this._label);\n\t\tthis.validateMinWidth(this._minWidth);\n\t\tthis.validatePagination(this._pagination);\n\t\tthis.validatePaginationPosition(this._paginationPosition);\n\t\tthis.validateSelection(this._selection);\n\t\tthis.validateOn(this._on);\n\t}\n\n\tprivate selectDisplayedData(data: KoliBriTableDataType[], pageSize: number, page: number): KoliBriTableDataType[] {\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 updateSortedData = () => {\n\t\tif (this.disableSort) {\n\t\t\tsetState(this, '_sortedData', this.state._data);\n\t\t\treturn;\n\t\t}\n\n\t\tlet sortedData: KoliBriTableDataType[] = this.state._data;\n\t\tif (this.sortData.length > 0) {\n\t\t\tsortedData = this.state._data.sort((a: KoliBriTableDataType, b: KoliBriTableDataType) => {\n\t\t\t\tfor (let index = 0; index < this.sortData.length; index++) {\n\t\t\t\t\tconst data = this.sortData[index];\n\t\t\t\t\tconst result = data.compareFn(a, b);\n\t\t\t\t\tif (result !== 0) {\n\t\t\t\t\t\treturn data.direction === 'ASC' ? result : -result;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\treturn 0;\n\t\t\t});\n\t\t}\n\t\tsetState(this, '_sortedData', sortedData);\n\t};\n\n\t/**\n\t * Renders the pagination controls for the table, showing the current visible data range\n\t * and providing navigation between different pages.\n\t *\n\t * @returns {JSX.Element} The rendered pagination controls including page range and navigation.\n\t */\n\tprivate renderPagination(): JSX.Element {\n\t\treturn (\n\t\t\t<div class={`kol-table-stateful__pagination kol-table-stateful__pagination--${this.state._paginationPosition}`}>\n\t\t\t\t<span>\n\t\t\t\t\t{translate('kol-table-visible-range', {\n\t\t\t\t\t\tplaceholders: {\n\t\t\t\t\t\t\tstart: this.pageEndSlice > 0 ? (this.pageStartSlice + 1).toString() : '0',\n\t\t\t\t\t\t\tend: this.pageEndSlice.toString(),\n\t\t\t\t\t\t\ttotal:\n\t\t\t\t\t\t\t\tthis.state._pagination && this.state._pagination._max > 0\n\t\t\t\t\t\t\t\t\t? this.state._pagination._max.toString()\n\t\t\t\t\t\t\t\t\t: Array.isArray(this.state._data)\n\t\t\t\t\t\t\t\t\t\t? this.state._data.length.toString()\n\t\t\t\t\t\t\t\t\t\t: '0',\n\t\t\t\t\t\t},\n\t\t\t\t\t})}\n\t\t\t\t</span>\n\t\t\t\t<div class=\"kol-table-stateful__pagination-wrapper\">\n\t\t\t\t\t<KolPaginationTag\n\t\t\t\t\t\tclass=\"test\"\n\t\t\t\t\t\t_boundaryCount={this.state._pagination._boundaryCount}\n\t\t\t\t\t\t_customClass={this.state._pagination._customClass}\n\t\t\t\t\t\t_on={this.handlePagination}\n\t\t\t\t\t\t_page={this.state._pagination._page}\n\t\t\t\t\t\t_pageSize={this.state._pagination._pageSize}\n\t\t\t\t\t\t_pageSizeOptions={this.state._pagination._pageSizeOptions || PAGINATION_OPTIONS}\n\t\t\t\t\t\t_siblingCount={this.state._pagination._siblingCount}\n\t\t\t\t\t\t_tooltipAlign=\"bottom\"\n\t\t\t\t\t\t_max={this.state._pagination._max || this.state._pagination._max || this.state._data.length}\n\t\t\t\t\t\t_label={translate('kol-table-pagination-label', { placeholders: { label: this.state._label } })}\n\t\t\t\t\t></KolPaginationTag>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t);\n\t}\n\n\tprivate getHeaderCellSortState(headerCell: KoliBriTableHeaderCellWithLogic): KoliBriSortDirection | undefined {\n\t\tif (!this.disableSort && typeof headerCell.compareFn === 'function') {\n\t\t\tif (headerCell.key) {\n\t\t\t\tconst data = this.sortData.find((value) => value.key === headerCell.key);\n\t\t\t\tif (data?.direction) {\n\t\t\t\t\treturn data.direction;\n\t\t\t\t}\n\t\t\t}\n\t\t\treturn 'NOS';\n\t\t}\n\t}\n\n\tprivate handleSort({ key }: SortEventPayload) {\n\t\tconst headerCell = [...(this.state._headers.horizontal || []).flat(), ...(this.state._headers.vertical || []).flat()].find((cell) => cell.key === key);\n\t\tif (headerCell) {\n\t\t\tthis.changeCellSort(headerCell);\n\t\t}\n\t}\n\n\tprivate getSelectedData(selectedKeys: string[] | string): null | KoliBriTableDataType | KoliBriTableDataType[] {\n\t\tconst selection = this.state._selection;\n\t\tif (selection) {\n\t\t\tconst keyPropertyName = selection.keyPropertyName ?? 'id';\n\t\t\tconst data = this.state._sortedData.filter((item) => selectedKeys.includes(item[keyPropertyName] as string));\n\t\t\tif (selection?.multiple === false) {\n\t\t\t\treturn data[0];\n\t\t\t}\n\n\t\t\tif (keyPropertyName) return data;\n\t\t}\n\t\treturn null;\n\t}\n\tprivate handleSelectionChange(event: Event, value: string[] | string): void {\n\t\tconst selection = this.state._selection;\n\t\tif (selection)\n\t\t\tthis.state = {\n\t\t\t\t...this.state,\n\t\t\t\t_selection: {\n\t\t\t\t\t...selection,\n\t\t\t\t\tselectedKeys: typeof value === 'object' ? value : [value],\n\t\t\t\t},\n\t\t\t};\n\t\tconst selectedData = this.getSelectedData(value);\n\n\t\tif (typeof this.state._on?.[Callback.onSelectionChange] === 'function') {\n\t\t\tthis.state._on[Callback.onSelectionChange](event, selectedData);\n\t\t}\n\t\tif (this.host) {\n\t\t\tdispatchDomEvent(this.host, KolEvent.selectionChange, selectedData);\n\t\t}\n\t}\n\n\t@Method()\n\t// eslint-disable-next-line @typescript-eslint/require-await\n\tpublic async getSelection(): Promise<KoliBriTableDataType[] | KoliBriTableDataType | null> {\n\t\tconst selectedKeys: string[] = this.state._selection?.selectedKeys || [];\n\t\treturn this.getSelectedData(selectedKeys);\n\t}\n\n\tpublic render(): JSX.Element {\n\t\tconst displayedData: KoliBriTableDataType[] = 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 paginationTop = this._paginationPosition === 'top' || this._paginationPosition === 'both' ? this.renderPagination() : null;\n\t\tconst paginationBottom = this._paginationPosition === 'bottom' || this._paginationPosition === 'both' ? this.renderPagination() : null;\n\n\t\tconst headerCells: TableHeaderCells = {\n\t\t\thorizontal: this.state._headers.horizontal?.map((row) => row.map((cell) => ({ ...cell, sortDirection: this.getHeaderCellSortState(cell) }))),\n\t\t\tvertical: this.state._headers.vertical?.map((column) => column.map((cell) => ({ ...cell, sortDirection: this.getHeaderCellSortState(cell) }))),\n\t\t};\n\t\treturn (\n\t\t\t<Host class=\"kol-table-stateful\">\n\t\t\t\t{this.pageEndSlice > 0 && this.showPagination && paginationTop}\n\t\t\t\t<KolTableStatelessWcTag\n\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t_data={displayedData}\n\t\t\t\t\t_headerCells={headerCells}\n\t\t\t\t\t_label={this.state._label}\n\t\t\t\t\t_dataFoot={this.state._dataFoot}\n\t\t\t\t\t_minWidth={this.state._minWidth}\n\t\t\t\t\t_on={{\n\t\t\t\t\t\tonSort: (_: MouseEvent, payload: SortEventPayload) => {\n\t\t\t\t\t\t\tthis.handleSort(payload);\n\t\t\t\t\t\t},\n\t\t\t\t\t\tonSelectionChange: (event: Event, value: string[] | string) => {\n\t\t\t\t\t\t\tthis.handleSelectionChange(event, value);\n\t\t\t\t\t\t},\n\t\t\t\t\t}}\n\t\t\t\t\t_selection={this.state._selection}\n\t\t\t\t/>\n\t\t\t\t{this.pageEndSlice > 0 && this.showPagination && paginationBottom}\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"mappings":"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","ignoreList":[]}

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

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{r as e,h as t,F as i,g as l}from"./index-2ae1c631.js";import{c as o}from"./clsx-09a06a12.js";import{d as s,g as a,a as n}from"./component-names-a18a51c8.js";import{t as r}from"./i18n-5fe08f1c.js";import{t as c,o as d,p as h,w as f}from"./prop.validators-9feb1d92.js";import{n as b}from"./dev.utils-8b31e10a.js";import{d as u,K as _}from"./events-5adf6b62.js";import{v as p,a as v,d as k,b as y,C as m}from"./callback-fd6ab619.js";import{v as w}from"./label-d0315384.js";import"./i18n-7ea9f137.js";import"./reuse-32931294.js";import"./index-da3e0c00.js";import"./dev.utils-fab45cbc.js";import"./common-54bf85ba.js";const g=(e,t)=>{c(t,(()=>{d(t,(()=>{try{t=h(t)}catch(e){}f(e,"_headerCells",(e=>"object"==typeof e&&null!==e&&(void 0===e.horizontal||Array.isArray(e.horizontal)&&void 0===e.horizontal.find((e=>!Array.isArray(e))))&&(void 0===e.vertical||Array.isArray(e.vertical)&&void 0===e.vertical.find((e=>!Array.isArray(e))))&&!0),new Set(["TableHeaderCellsPropType"]),t)}))}))},j=/^\d+(\.\d+)?([a-z]+|%)?$/,S=(e,t,a)=>{f(e,"_minWidth",(e=>"string"==typeof e&&j.test(e)),new Set(["String","/^\\d+(\\.\\d+)?([a-z]+|%)?$/"]),t,a)},$=class{constructor(a){e(this,a),this.horizontal=!0,this.cellsToRenderTimeouts=new Map,this.dataToKeyMap=new Map,this.checkboxRefs=[],this.renderTableRow=(e,a,l,i=!1)=>{var s,r;let n=String(a);return this.horizontal&&(null===(s=e[0])||void 0===s?void 0:s.data)&&(n=null!==(r=this.getDataKey(e[0].data))&&void 0!==r?r:n),t("tr",{class:o("kol-table__row",{"kol-table__row--body":!i,"kol-table__row--footer":i}),key:`row-${n}`},this.renderSelectionCell(e,a),e.map(((e,t)=>this.renderTableCell(e,a,t,l))))},this.renderTableCell=(e,a,l,i)=>{let s=`${a}-${l}-${e.label}`;if(e.data){const t=this.getDataKey(e.data);s=t?`${t}-${this.horizontal?l:a}`:s}return e.headerCell?this.renderHeadingCell(e,a,l,i):t("td",{key:`cell-${s}`,class:o("kol-table__cell kol-table__cell--body",{[`kol-table__cell--align-${e.textAlign}`]:e.textAlign}),colSpan:e.colSpan,rowSpan:e.rowSpan,style:{textAlign:e.textAlign,width:e.width},ref:"function"==typeof e.render?t=>{this.cellRender(e,t)}:void 0},"function"!=typeof e.render?e.label:"")},this.state={_data:[],_headerCells:{horizontal:[],vertical:[]},_label:"",_minWidth:"auto"},this.tableDivElementHasScrollbar=!1,this._data=void 0,this._dataFoot=void 0,this._headerCells=void 0,this._label=void 0,this._minWidth=void 0,this._on=void 0,this._selection=void 0}validateData(e){p(this,e,{beforePatch:e=>{this.updateDataToKeyMap(e)}})}validateDataFoot(e){v(this,e)}validateHeaderCells(e){g(this,e)}validateLabel(e){w(this,e,{required:!0})}validateMinWidth(e){S(this,e)}validateOn(e){k(this,e)}validateSelection(e){y(this,e)}handleKeyDown(e){var t;if("ArrowUp"===e.key||"ArrowDown"===e.key){const a=null===(t=this.tableDivElement)||void 0===t?void 0:t.querySelector(":focus");let l=this.checkboxRefs.indexOf(a);l>-1&&(e.preventDefault(),"ArrowDown"===e.key?(l=(l+1)%this.checkboxRefs.length,this.checkboxRefs[l].focus()):"ArrowUp"===e.key&&(e.preventDefault(),l=(l+this.checkboxRefs.length-1)%this.checkboxRefs.length,this.checkboxRefs[l].focus()))}}componentDidRender(){this.checkDivElementScrollbar()}componentDidLoad(){this.tableDivElement&&ResizeObserver&&(this.tableDivElementResizeObserver=new ResizeObserver(this.checkDivElementScrollbar.bind(this)),this.tableDivElementResizeObserver.observe(this.tableDivElement))}disconnectedCallback(){var e;null===(e=this.tableDivElementResizeObserver)||void 0===e||e.disconnect()}checkDivElementScrollbar(){this.tableDivElement&&(this.tableDivElementHasScrollbar=this.tableDivElement.scrollWidth>this.tableDivElement.clientWidth)}updateDataToKeyMap(e){e.forEach((e=>{this.dataToKeyMap.has(e)||this.dataToKeyMap.set(e,b())})),this.dataToKeyMap.forEach(((t,a)=>{e.includes(a)||this.dataToKeyMap.delete(a)}))}getDataKey(e){return this.dataToKeyMap.get(e)}cellRender(e,t){t&&(clearTimeout(this.cellsToRenderTimeouts.get(t)),this.cellsToRenderTimeouts.set(t,setTimeout((()=>{if("function"==typeof e.render){const a=e.render(t,e,e.data,this.state._data);"string"==typeof a&&(t.textContent=a)}}))))}getNumberOfCols(e,t){let a=0;return e.forEach((e=>{let t=0;Array.isArray(e)&&e.forEach((e=>{var a;return t+=null!==(a=e.colSpan)&&void 0!==a?a:1})),a<t&&(a=t)})),0===a&&(a=t.length),a}getNumberOfRows(e,t){var a;let l=0;return e.forEach((e=>{let t=0;Array.isArray(e)&&e.forEach((e=>{var a;return t+=null!==(a=e.rowSpan)&&void 0!==a?a:1})),l<t&&(l=t)})),0===l?l=t.length:l-=(null===(a=this.state._dataFoot)||void 0===a?void 0:a.length)||0,l}getThePrimaryHeadersWithKeysIfExists(e){const t=[];return e.forEach((e=>{e.forEach((e=>{"string"==typeof e.key&&t.push(e)}))})),t}getPrimaryHeaders(e){var t,a;let l=this.getThePrimaryHeadersWithKeysIfExists(null!==(t=e.horizontal)&&void 0!==t?t:[]);return this.horizontal=!0,0===l.length&&(l=this.getThePrimaryHeadersWithKeysIfExists(null!==(a=e.vertical)&&void 0!==a?a:[]),l.length>0&&(this.horizontal=!1)),l}createDataField(e,t,a){var l;t.horizontal=Array.isArray(null==t?void 0:t.horizontal)?t.horizontal:[],t.vertical=Array.isArray(null==t?void 0:t.vertical)?t.vertical:[];const i=this.getPrimaryHeaders(t),o=this.getNumberOfCols(t.horizontal,e);let s=this.getNumberOfRows(t.vertical,e),n=0;a&&(n=s,s+=(null===(l=this.state._dataFoot)||void 0===l?void 0:l.length)||0);const c=[],d=[],h=[];t.vertical.forEach(((e,t)=>{d[t]=0,h[t]=[]}));for(let l=n;l<s;l++){const s=[];t.vertical.forEach(((e,t)=>{let a=0;if(h[t].forEach((e=>a+=e)),a<=l){const i=e[l-a+d[t]];if("object"==typeof i){s.push(Object.assign(Object.assign({},i),{headerCell:!0,data:{}}));let e=1;if("number"==typeof i.rowSpan&&i.rowSpan>1&&(e=i.rowSpan),h[t].push(e),"number"==typeof i.colSpan&&i.colSpan>1)for(let a=1;a<i.colSpan;a++)h[t+a].push(e);d[t]++}}}));for(let t=0;t<o;t++)if(!0===this.horizontal){const o=a&&this.state._dataFoot?this.state._dataFoot[l-n]:e[l];"object"==typeof i[t]&&null!==i[t]&&"string"==typeof i[t].key&&"object"==typeof o&&null!==o&&s.push(Object.assign(Object.assign({},i[t]),{colSpan:void 0,data:o,label:o[i[t].key],rowSpan:void 0}))}else"object"==typeof i[l]&&null!==i[l]&&"string"==typeof i[l].key&&"object"==typeof e[t]&&null!==e[t]&&s.push(Object.assign(Object.assign({},i[l]),{colSpan:void 0,data:e[t],label:e[t][i[l].key],rowSpan:void 0}));c.push(s)}if(0===e.length){let e=0,a=0;Array.isArray(t.horizontal)&&t.horizontal.length>0&&t.horizontal[0].forEach((t=>{e+=t.colSpan||1})),Array.isArray(t.vertical)&&t.vertical.length>0&&(e-=t.vertical.length,t.vertical[0].forEach((e=>{a+=e.rowSpan||1})));const l={colSpan:e,label:r("kol-no-entries"),render:void 0,rowSpan:Math.max(a,1)};0===c.length?c.push([l]):c[0].push(l)}return c}handleSelectionChangeCallbackAndEvent(e,t){var a;"function"==typeof(null===(a=this.state._on)||void 0===a?void 0:a[m.onSelectionChange])&&this.state._on[m.onSelectionChange](e,t),this.host&&u(this.host,_.selectionChange,t)}componentWillLoad(){this.validateData(this._data),this.validateDataFoot(this._dataFoot),this.validateHeaderCells(this._headerCells),this.validateLabel(this._label),this.validateMinWidth(this._minWidth),this.validateOn(this._on),this.validateSelection(this._selection)}renderSelectionCell(e,l){var i,r,n;const c=this.state._selection;if(!c)return"";const d=null!==(i=c.keyPropertyName)&&void 0!==i?i:"id",h=null===(r=e[0])||void 0===r?void 0:r.data;if(!h)return"";const b=h[d],_=c.multiple||void 0===c.multiple,v=null===(n=null==c?void 0:c.selectedKeys)||void 0===n?void 0:n.includes(b),p=c.label(h),u={name:"selection",checked:v,id:b,"aria-label":p};return t("td",{key:`tbody-${l}-selection`,class:"kol-table__cell kol-table__cell--selection"},t("div",{class:o("kol-table__selection",{"kol-table__selection--checked":v})},_?t("label",{class:"kol-table__selection-label"},t(s,{class:"kol-table__selection-icon",_icons:"codicon "+(v?"codicon-check":""),_label:""}),t("input",Object.assign({class:o("kol-table__selection-input kol-table__selection-input--checkbox"),ref:e=>e&&this.checkboxRefs.push(e)},u,{type:"checkbox",onInput:e=>{var t,a;const l=v?null===(a=null==c?void 0:c.selectedKeys)||void 0===a?void 0:a.filter((e=>e!==b)):[...null!==(t=null==c?void 0:c.selectedKeys)&&void 0!==t?t:[],b];this.handleSelectionChangeCallbackAndEvent(e,null!=l?l:[])}}))):t("label",{class:"kol-table__selection-label"},t("input",Object.assign({class:o("kol-table__selection-input kol-table__selection-input--radio")},u,{type:"radio",onInput:e=>{this.handleSelectionChangeCallbackAndEvent(e,b)}}))),t(a,{"aria-hidden":"true",class:"kol-table__selection-input-tooltip",_align:"right",_id:`${b}-label`,_label:p})))}renderHeadingSelectionCell(){var e,l;const i=this.state._selection;if(!i||!i.multiple&&void 0!==i.multiple)return t("th",{class:"kol-table__cell kol-table__cell--header",key:"thead-0"});const n=null!==(e=i.keyPropertyName)&&void 0!==e?e:"id",c=null===(l=i.selectedKeys)||void 0===l?void 0:l.length,d=c===this.state._data.length,h=0!==c&&!d;let b="kol-table-selection-indeterminate";d&&!h&&(b="kol-table-selection-none"),0===c&&(b="kol-table-selection-all");const _=r(b);return t("th",{key:"thead-0-selection",class:"kol-table__cell kol-table__cell--header"},t("div",{class:o("kol-table__selection",{"kol-table__selection--indeterminate":h,"kol-table__selection--checked":d})},t("label",{class:"kol-table__selection-label"},t(s,{class:"kol-table__selection-icon",_icons:"codicon "+(h?"codicon-remove":d?"codicon-check":""),_label:""}),t("input",{class:o("kol-table__selection-input kol-table__selection-input--checkbox"),ref:e=>e&&this.checkboxRefs.push(e),name:"selection",checked:d&&!h,"aria-label":_,type:"checkbox",onInput:e=>{const t=d?[]:this.state._data.map((e=>null==e?void 0:e[n]));this.handleSelectionChangeCallbackAndEvent(e,t)}})),t(a,{"aria-hidden":"true",class:"kol-table__selection-input-tooltip",_align:"right",_id:`${b}-label`,_label:_})))}renderHeaderTdCell(){return t(i,null,Array.isArray(this.state._headerCells.horizontal)&&this.state._headerCells.horizontal.length>0&&Array.isArray(this.state._headerCells.vertical)&&this.state._headerCells.vertical.length>0&&Array.isArray(this.state._headerCells.horizontal)&&t("td",{"aria-hidden":"true",colSpan:this.state._headerCells.vertical.length,rowSpan:this.state._headerCells.horizontal.length}))}renderHeadingCell(e,a,l,i){let s,r="codicon codicon-fold";if(e.sortDirection)switch(e.sortDirection){case"ASC":r="codicon codicon-chevron-up",s="ascending";break;case"DESC":r="codicon codicon-chevron-down",s="descending"}const c=i?"row":"number"==typeof e.colSpan&&e.colSpan>1?"colgroup":"col";return t("th",{key:`${a}-${l}-${e.label}`,class:o("kol-table__cell kol-table__cell--header",{[`kol-table__cell--align-${e.textAlign}`]:e.textAlign,[`kol-table__cell--${s}`]:s}),scope:c,colSpan:e.colSpan,rowSpan:e.rowSpan,style:{width:e.width},"aria-sort":s,"data-sort":`sort-${e.sortDirection}`},e.sortDirection?t(n,{class:"kol-table__sort-button",exportparts:"icon",_icons:{right:r},_label:e.label,_on:{onClick:t=>{var a;"function"==typeof(null===(a=this.state._on)||void 0===a?void 0:a.onSort)&&e.key&&e.sortDirection&&this.state._on.onSort(t,{key:e.key,currentSortDirection:e.sortDirection}),this.host&&u(this.host,_.sort,{key:e.key,currentSortDirection:e.sortDirection})}}}):e.label)}renderSpacer(e,a){var l,i;const s=(null===(l=this.state._headerCells.vertical)||void 0===l?void 0:l.length)||0,r=null===(i=null==a?void 0:a[0])||void 0===i?void 0:i.reduce(((e,t)=>e+(t.colSpan||1)),0),n=this.state._selection?1:0;return t("tr",{"aria-hidden":"true",class:o("kol-table__spacer",`kol-table__spacer--${e}`)},t("td",{class:o(`kol-table__spacer-line kol-table__spacer-line--${e}`),colSpan:s+r+n}))}renderFoot(){if(!this.state._dataFoot||0===this.state._dataFoot.length)return null;const e=this.createDataField(this.state._dataFoot,this.state._headerCells,!0);return t("tfoot",{class:"kol-table__footer"},[this.renderSpacer("foot",e),e.map(((e,t)=>this.renderTableRow(e,t,!0,!0)))])}render(){const e=this.createDataField(this.state._data,this.state._headerCells);return this.checkboxRefs=[],t("div",{key:"3a3e95a3993c3a10dc7342da4534249ee014979f",ref:e=>this.tableDivElement=e,class:"kol-table",tabindex:this.tableDivElementHasScrollbar?"-1":void 0},t("table",{key:"a576fe89e8549a7686cec0af5cc9f9d064870768",class:"kol-table__table",style:{minWidth:this.state._minWidth}},t("div",{key:"1440b0c066cbff9b3e007d0a3a29f908e498c7b5",class:"kol-table__focus-element",tabindex:this.tableDivElementHasScrollbar?"0":void 0,"aria-describedby":"caption"}," "),t("caption",{key:"0e0ed2a572adf7576f854f0aa524cf5184d8c089",class:"kol-table__caption",id:"caption"},this.state._label),Array.isArray(this.state._headerCells.horizontal)&&t("thead",{key:"ca8178d06124396db66ec7acb990152e4cd64976",class:"kol-table__head"},[this.state._headerCells.horizontal.map(((e,a)=>t("tr",{class:"kol-table__head-row",key:`thead-${a}`},this.state._selection&&this.renderHeadingSelectionCell(),0===a&&this.renderHeaderTdCell(),Array.isArray(e)&&e.map(((e,t)=>this.renderHeadingCell(e,a,t,!1)))))),this.renderSpacer("head",this.state._headerCells.horizontal)]),t("tbody",{key:"945142452f85ef86c130b3cc7863a2532eb40f6f",class:"kol-table__body"},e.map(((e,t)=>this.renderTableRow(e,t,!0)))),this.renderFoot()))}get host(){return l(this)}static get watchers(){return{_data:["validateData"],_dataFoot:["validateDataFoot"],_headerCells:["validateHeaderCells"],_label:["validateLabel"],_minWidth:["validateMinWidth"],_on:["validateOn"],_selection:["validateSelection"]}}};export{$ as kol_table_stateless_wc};
+import{r as e,h as t,F as i,g as l}from"./index-dd9ee649.js";import{c as o}from"./clsx-09a06a12.js";import{d as s,g as a,a as n}from"./component-names-545d6582.js";import{t as r}from"./i18n-005310a7.js";import{q as d,o as c,p as h,w as u}from"./prop.validators-17aec743.js";import{n as b}from"./dev.utils-9a52bd27.js";import{d as f,K as v}from"./events-5adf6b62.js";import{v as _,a as p,d as k,b as y,C as m}from"./callback-a11cae1c.js";import{v as g}from"./label-90c13388.js";import"./i18n-c120df5c.js";import"./reuse-f46e7e35.js";import"./index-6d801dad.js";import"./dev.utils-fab45cbc.js";import"./common-54bf85ba.js";const S=(e,t)=>{d(t,(()=>{c(t,(()=>{try{t=h(t)}catch(e){}u(e,"_headerCells",(e=>"object"==typeof e&&null!==e&&(void 0===e.horizontal||Array.isArray(e.horizontal)&&void 0===e.horizontal.find((e=>!Array.isArray(e))))&&(void 0===e.vertical||Array.isArray(e.vertical)&&void 0===e.vertical.find((e=>!Array.isArray(e))))&&!0),new Set(["TableHeaderCellsPropType"]),t)}))}))},w=/^\d+(\.\d+)?([a-z]+|%)?$/,j=(e,t,l)=>{u(e,"_minWidth",(e=>"string"==typeof e&&w.test(e)),new Set(["String","/^\\d+(\\.\\d+)?([a-z]+|%)?$/"]),t,l)},$=class{constructor(l){e(this,l),this.horizontal=!0,this.cellsToRenderTimeouts=new Map,this.dataToKeyMap=new Map,this.checkboxRefs=[],this.renderTableRow=(e,l,a,i=!1)=>{var s,n;let r=String(l);return this.horizontal&&(null===(s=e[0])||void 0===s?void 0:s.data)&&(r=null!==(n=this.getDataKey(e[0].data))&&void 0!==n?n:r),t("tr",{class:o("kol-table__row",{"kol-table__row--body":!i,"kol-table__row--footer":i}),key:`row-${r}`},this.renderSelectionCell(e,l),e.map(((e,t)=>this.renderTableCell(e,l,t,a))))},this.renderTableCell=(e,l,a,i)=>{let s=`${l}-${a}-${e.label}`;if(e.data){const t=this.getDataKey(e.data);s=t?`${t}-${this.horizontal?a:l}`:s}return e.headerCell?this.renderHeadingCell(e,l,a,i):t("td",{key:`cell-${s}`,class:o("kol-table__cell kol-table__cell--body",{[`kol-table__cell--align-${e.textAlign}`]:e.textAlign}),colSpan:e.colSpan,rowSpan:e.rowSpan,style:{textAlign:e.textAlign,width:e.width},ref:"function"==typeof e.render?t=>{this.cellRender(e,t)}:void 0},"function"!=typeof e.render?e.label:"")},this.state={_data:[],_headerCells:{horizontal:[],vertical:[]},_label:"",_minWidth:"auto"},this.tableDivElementHasScrollbar=!1,this._data=void 0,this._dataFoot=void 0,this._headerCells=void 0,this._label=void 0,this._minWidth=void 0,this._on=void 0,this._selection=void 0}validateData(e){_(this,e,{beforePatch:e=>{this.updateDataToKeyMap(e)}})}validateDataFoot(e){p(this,e)}validateHeaderCells(e){S(this,e)}validateLabel(e){g(this,e,{required:!0})}validateMinWidth(e){j(this,e)}validateOn(e){k(this,e)}validateSelection(e){y(this,e)}handleKeyDown(e){var t;if("ArrowUp"===e.key||"ArrowDown"===e.key){const l=null===(t=this.tableDivElement)||void 0===t?void 0:t.querySelector(":focus");let a=this.checkboxRefs.indexOf(l);a>-1&&(e.preventDefault(),"ArrowDown"===e.key?(a=(a+1)%this.checkboxRefs.length,this.checkboxRefs[a].focus()):"ArrowUp"===e.key&&(e.preventDefault(),a=(a+this.checkboxRefs.length-1)%this.checkboxRefs.length,this.checkboxRefs[a].focus()))}}componentDidRender(){this.checkDivElementScrollbar()}componentDidLoad(){this.tableDivElement&&ResizeObserver&&(this.tableDivElementResizeObserver=new ResizeObserver(this.checkDivElementScrollbar.bind(this)),this.tableDivElementResizeObserver.observe(this.tableDivElement))}disconnectedCallback(){var e;null===(e=this.tableDivElementResizeObserver)||void 0===e||e.disconnect()}checkDivElementScrollbar(){this.tableDivElement&&(this.tableDivElementHasScrollbar=this.tableDivElement.scrollWidth>this.tableDivElement.clientWidth)}updateDataToKeyMap(e){e.forEach((e=>{this.dataToKeyMap.has(e)||this.dataToKeyMap.set(e,b())})),this.dataToKeyMap.forEach(((t,l)=>{e.includes(l)||this.dataToKeyMap.delete(l)}))}getDataKey(e){return this.dataToKeyMap.get(e)}cellRender(e,t){t&&(clearTimeout(this.cellsToRenderTimeouts.get(t)),this.cellsToRenderTimeouts.set(t,setTimeout((()=>{if("function"==typeof e.render){const l=e.render(t,e,e.data,this.state._data);"string"==typeof l&&(t.textContent=l)}}))))}getNumberOfCols(e,t){let l=0;return e.forEach((e=>{let t=0;Array.isArray(e)&&e.forEach((e=>{var l;return t+=null!==(l=e.colSpan)&&void 0!==l?l:1})),l<t&&(l=t)})),0===l&&(l=t.length),l}getNumberOfRows(e,t){var l;let a=0;return e.forEach((e=>{let t=0;Array.isArray(e)&&e.forEach((e=>{var l;return t+=null!==(l=e.rowSpan)&&void 0!==l?l:1})),a<t&&(a=t)})),0===a?a=t.length:a-=(null===(l=this.state._dataFoot)||void 0===l?void 0:l.length)||0,a}getThePrimaryHeadersWithKeysIfExists(e){const t=[];return e.forEach((e=>{e.forEach((e=>{"string"==typeof e.key&&t.push(e)}))})),t}getPrimaryHeaders(e){var t,l;let a=this.getThePrimaryHeadersWithKeysIfExists(null!==(t=e.horizontal)&&void 0!==t?t:[]);return this.horizontal=!0,0===a.length&&(a=this.getThePrimaryHeadersWithKeysIfExists(null!==(l=e.vertical)&&void 0!==l?l:[]),a.length>0&&(this.horizontal=!1)),a}createDataField(e,t,l){var a;t.horizontal=Array.isArray(null==t?void 0:t.horizontal)?t.horizontal:[],t.vertical=Array.isArray(null==t?void 0:t.vertical)?t.vertical:[];const i=this.getPrimaryHeaders(t),o=this.getNumberOfCols(t.horizontal,e);let s=this.getNumberOfRows(t.vertical,e),n=0;l&&(n=s,s+=(null===(a=this.state._dataFoot)||void 0===a?void 0:a.length)||0);const c=[],d=[],h=[];t.vertical.forEach(((e,t)=>{d[t]=0,h[t]=[]}));for(let a=n;a<s;a++){const s=[];t.vertical.forEach(((e,t)=>{let l=0;if(h[t].forEach((e=>l+=e)),l<=a){const i=e[a-l+d[t]];if("object"==typeof i){s.push(Object.assign(Object.assign({},i),{headerCell:!0,data:{}}));let e=1;if("number"==typeof i.rowSpan&&i.rowSpan>1&&(e=i.rowSpan),h[t].push(e),"number"==typeof i.colSpan&&i.colSpan>1)for(let l=1;l<i.colSpan;l++)h[t+l].push(e);d[t]++}}}));for(let t=0;t<o;t++)if(!0===this.horizontal){const o=l&&this.state._dataFoot?this.state._dataFoot[a-n]:e[a];"object"==typeof i[t]&&null!==i[t]&&"string"==typeof i[t].key&&"object"==typeof o&&null!==o&&s.push(Object.assign(Object.assign({},i[t]),{colSpan:void 0,data:o,label:o[i[t].key],rowSpan:void 0}))}else"object"==typeof i[a]&&null!==i[a]&&"string"==typeof i[a].key&&"object"==typeof e[t]&&null!==e[t]&&s.push(Object.assign(Object.assign({},i[a]),{colSpan:void 0,data:e[t],label:e[t][i[a].key],rowSpan:void 0}));c.push(s)}if(0===e.length){let e=0,l=0;Array.isArray(t.horizontal)&&t.horizontal.length>0&&t.horizontal[0].forEach((t=>{e+=t.colSpan||1})),Array.isArray(t.vertical)&&t.vertical.length>0&&(e-=t.vertical.length,t.vertical[0].forEach((e=>{l+=e.rowSpan||1})));const a={colSpan:e,label:r("kol-no-entries"),render:void 0,rowSpan:Math.max(l,1)};0===c.length?c.push([a]):c[0].push(a)}return c}handleSelectionChangeCallbackAndEvent(e,t){var l;"function"==typeof(null===(l=this.state._on)||void 0===l?void 0:l[m.onSelectionChange])&&this.state._on[m.onSelectionChange](e,t),this.host&&f(this.host,v.selectionChange,t)}componentWillLoad(){this.validateData(this._data),this.validateDataFoot(this._dataFoot),this.validateHeaderCells(this._headerCells),this.validateLabel(this._label),this.validateMinWidth(this._minWidth),this.validateOn(this._on),this.validateSelection(this._selection)}renderSelectionCell(e,l){var i,n,r;const c=this.state._selection;if(!c)return"";const d=this.getSelectionKeyPropertyName(),h=null===(i=e[0])||void 0===i?void 0:i.data;if(!h)return"";const b=h[d],v=c.multiple||void 0===c.multiple,_=null===(n=null==c?void 0:c.selectedKeys)||void 0===n?void 0:n.includes(b),u=null===(r=null==c?void 0:c.disabledKeys)||void 0===r?void 0:r.includes(b),p=c.label(h),y={name:"selection",checked:_,disabled:u,id:b,"aria-label":p};return t("td",{key:`tbody-${l}-selection`,class:"kol-table__cell kol-table__cell--selection"},t("div",{class:o("kol-table__selection",{"kol-table__selection--checked":_})},v?t("label",{class:o("kol-table__selection-label",{"kol-table__selection-label--disabled":u})},t(s,{class:"kol-table__selection-icon",_icons:"codicon "+(_?"codicon-check":""),_label:""}),t("input",Object.assign({class:o("kol-table__selection-input kol-table__selection-input--checkbox"),ref:e=>e&&this.checkboxRefs.push(e)},y,{type:"checkbox",onInput:e=>{var t,l;const a=_?null===(l=null==c?void 0:c.selectedKeys)||void 0===l?void 0:l.filter((e=>e!==b)):[...null!==(t=null==c?void 0:c.selectedKeys)&&void 0!==t?t:[],b];this.handleSelectionChangeCallbackAndEvent(e,null!=a?a:[])}}))):t("label",{class:"kol-table__selection-label"},t("input",Object.assign({class:o("kol-table__selection-input kol-table__selection-input--radio")},y,{type:"radio",onInput:e=>{this.handleSelectionChangeCallbackAndEvent(e,b)}}))),t(a,{"aria-hidden":"true",class:"kol-table__selection-input-tooltip",_align:"right",_id:`${b}-label`,_label:p})))}getSelectionKeyPropertyName(){var e,t;return null!==(t=null===(e=this.state._selection)||void 0===e?void 0:e.keyPropertyName)&&void 0!==t?t:"id"}getDataWithSelectionEnabled(){const e=this.getSelectionKeyPropertyName();return this.state._data.filter((t=>{var l,a;return!(null===(a=null===(l=this.state._selection)||void 0===l?void 0:l.disabledKeys)||void 0===a?void 0:a.includes(t[e]))}))}getSelectedKeysWithoutDisabledKeys(){var e,t;return null===(t=null===(e=this.state._selection)||void 0===e?void 0:e.selectedKeys)||void 0===t?void 0:t.filter((e=>{var t,l;return!(null===(l=null===(t=this.state._selection)||void 0===t?void 0:t.disabledKeys)||void 0===l?void 0:l.includes(e))}))}getSelectedKeysWithDisabledKeysOnly(){var e,t;return null===(t=null===(e=this.state._selection)||void 0===e?void 0:e.selectedKeys)||void 0===t?void 0:t.filter((e=>{var t,l;return null===(l=null===(t=this.state._selection)||void 0===t?void 0:t.disabledKeys)||void 0===l?void 0:l.includes(e)}))}getRevertedSelection(e){var t;const l=this.getSelectionKeyPropertyName(),a=null!==(t=this.getSelectedKeysWithDisabledKeysOnly())&&void 0!==t?t:[];return e&&a.push(...this.getDataWithSelectionEnabled().map((e=>null==e?void 0:e[l]))),a}renderHeadingSelectionCell(){var e,l;const i=this.state._selection;if(!i||!i.multiple&&void 0!==i.multiple)return t("th",{class:"kol-table__cell kol-table__cell--header",key:"thead-0"});const n=null!==(l=null===(e=this.getSelectedKeysWithoutDisabledKeys())||void 0===e?void 0:e.length)&&void 0!==l?l:0,c=n===this.getDataWithSelectionEnabled().length,d=0!==n&&!c;let h="kol-table-selection-indeterminate";c&&!d&&(h="kol-table-selection-none"),0===n&&(h="kol-table-selection-all");const b=r(h);return t("th",{key:"thead-0-selection",class:"kol-table__cell kol-table__cell--header"},t("div",{class:o("kol-table__selection",{"kol-table__selection--indeterminate":d,"kol-table__selection--checked":c})},t("label",{class:"kol-table__selection-label"},t(s,{class:"kol-table__selection-icon",_icons:"codicon "+(d?"codicon-remove":c?"codicon-check":""),_label:""}),t("input",{class:o("kol-table__selection-input kol-table__selection-input--checkbox"),"data-testid":"selection-checkbox-all",ref:e=>e&&this.checkboxRefs.push(e),name:"selection",checked:c&&!d,indeterminate:d,"aria-label":b,type:"checkbox",onInput:e=>{this.handleSelectionChangeCallbackAndEvent(e,this.getRevertedSelection(!c))}})),t(a,{"aria-hidden":"true",class:"kol-table__selection-input-tooltip",_align:"right",_id:`${h}-label`,_label:b})))}renderHeaderTdCell(){return t(i,null,Array.isArray(this.state._headerCells.horizontal)&&this.state._headerCells.horizontal.length>0&&Array.isArray(this.state._headerCells.vertical)&&this.state._headerCells.vertical.length>0&&Array.isArray(this.state._headerCells.horizontal)&&t("td",{"aria-hidden":"true",colSpan:this.state._headerCells.vertical.length,rowSpan:this.state._headerCells.horizontal.length}))}renderHeadingCell(e,l,a,i){let s,r="codicon codicon-fold";if(e.sortDirection)switch(e.sortDirection){case"ASC":r="codicon codicon-chevron-up",s="ascending";break;case"DESC":r="codicon codicon-chevron-down",s="descending"}const c=i?"row":"number"==typeof e.colSpan&&e.colSpan>1?"colgroup":"col";return t("th",{key:`${l}-${a}-${e.label}`,class:o("kol-table__cell kol-table__cell--header",{[`kol-table__cell--align-${e.textAlign}`]:e.textAlign,[`kol-table__cell--${s}`]:s}),scope:c,colSpan:e.colSpan,rowSpan:e.rowSpan,style:{width:e.width},"aria-sort":s,"data-sort":`sort-${e.sortDirection}`},e.sortDirection?t(n,{class:"kol-table__sort-button",exportparts:"icon",_icons:{right:r},_label:e.label,_on:{onClick:t=>{var l;"function"==typeof(null===(l=this.state._on)||void 0===l?void 0:l.onSort)&&e.key&&e.sortDirection&&this.state._on.onSort(t,{key:e.key,currentSortDirection:e.sortDirection}),this.host&&f(this.host,v.sort,{key:e.key,currentSortDirection:e.sortDirection})}}}):e.label)}renderSpacer(e,l){var a,i;const s=(null===(a=this.state._headerCells.vertical)||void 0===a?void 0:a.length)||0,n=null===(i=null==l?void 0:l[0])||void 0===i?void 0:i.reduce(((e,t)=>e+(t.colSpan||1)),0),r=this.state._selection?1:0;return t("tr",{"aria-hidden":"true",class:o("kol-table__spacer",`kol-table__spacer--${e}`)},t("td",{class:o(`kol-table__spacer-line kol-table__spacer-line--${e}`),colSpan:s+n+r}))}renderFoot(){if(!this.state._dataFoot||0===this.state._dataFoot.length)return null;const e=this.createDataField(this.state._dataFoot,this.state._headerCells,!0);return t("tfoot",{class:"kol-table__footer"},[this.renderSpacer("foot",e),e.map(((e,t)=>this.renderTableRow(e,t,!0,!0)))])}render(){const e=this.createDataField(this.state._data,this.state._headerCells);return this.checkboxRefs=[],t("div",{key:"1ac04635486fff8f0456beb99c6b96654248f9e4",ref:e=>this.tableDivElement=e,class:"kol-table",tabindex:this.tableDivElementHasScrollbar?"-1":void 0},t("table",{key:"e4457e9e80dd358d4caffcbcc6f7990bbf36ca20",class:"kol-table__table",style:{minWidth:this.state._minWidth}},t("div",{key:"905b4322a63f51170cfcdb0b458c6b6cb129d4ad",class:"kol-table__focus-element",tabindex:this.tableDivElementHasScrollbar?"0":void 0,"aria-describedby":"caption"}," "),t("caption",{key:"4003583d910f3471e6d3d5bc585e83d3a2e0ec9a",class:"kol-table__caption",id:"caption"},this.state._label),Array.isArray(this.state._headerCells.horizontal)&&t("thead",{key:"cf7cb9cb892f50e4ba149a4c7b1c0695d23c1d62",class:"kol-table__head"},[this.state._headerCells.horizontal.map(((e,l)=>t("tr",{class:"kol-table__head-row",key:`thead-${l}`},this.state._selection&&this.renderHeadingSelectionCell(),0===l&&this.renderHeaderTdCell(),Array.isArray(e)&&e.map(((e,t)=>this.renderHeadingCell(e,l,t,!1)))))),this.renderSpacer("head",this.state._headerCells.horizontal)]),t("tbody",{key:"d83f3334e830da14222a9e44ce1682005171d755",class:"kol-table__body"},e.map(((e,t)=>this.renderTableRow(e,t,!0)))),this.renderFoot()))}get host(){return l(this)}static get watchers(){return{_data:["validateData"],_dataFoot:["validateDataFoot"],_headerCells:["validateHeaderCells"],_label:["validateLabel"],_minWidth:["validateMinWidth"],_on:["validateOn"],_selection:["validateSelection"]}}};export{$ as kol_table_stateless_wc};

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

@@ -1 +1 @@
-{"version":3,"names":["validateTableHeaderCells","component","value","emptyStringByArrayHandler","objectObjectHandler","parseJson","e","watchValidator","horizontal","undefined","Array","isArray","find","headerRow","vertical","headerCol","Set","HEADER_CELL_WIDTH_VALIDATOR","validateMinWidth","options","v","test","KolTableStateless","this","cellsToRenderTimeouts","Map","dataToKeyMap","checkboxRefs","renderTableRow","row","rowIndex","isVertical","isFooter","key","String","_a","data","_b","getDataKey","h","class","clsx","renderSelectionCell","map","cell","colIndex","renderTableCell","label","dataKey","headerCell","renderHeadingCell","textAlign","colSpan","rowSpan","style","width","ref","render","el","cellRender","_data","_headerCells","_label","_minWidth","validateData","validateTableData","beforePatch","nextValue","updateDataToKeyMap","validateDataFoot","validateTableDataFoot","validateHeaderCells","validateLabel","required","validateOn","validateTableCallbacks","validateSelection","validateTableSelection","handleKeyDown","event","focusedElement","tableDivElement","querySelector","index","indexOf","preventDefault","length","focus","componentDidRender","checkDivElementScrollbar","componentDidLoad","ResizeObserver","tableDivElementResizeObserver","bind","observe","disconnectedCallback","disconnect","tableDivElementHasScrollbar","scrollWidth","clientWidth","forEach","has","set","nonce","_","includes","delete","get","clearTimeout","setTimeout","renderContent","state","textContent","getNumberOfCols","horizontalHeaders","max","count","col","getNumberOfRows","verticalHeaders","_dataFoot","getThePrimaryHeadersWithKeysIfExists","headers","primaryHeadersWithKeys","cells","push","getPrimaryHeaders","createDataField","isFoot","primaryHeader","maxCols","maxRows","startRow","dataField","rowCount","rowSpans","_row","i","dataRow","headerCells","rowsTotal","rows","Object","assign","k","j","colspan","rowspan","emptyCell","translate","Math","handleSelectionChangeCallbackAndEvent","payload","_on","Callback","onSelectionChange","host","dispatchDomEvent","KolEvent","selectionChange","componentWillLoad","_selection","selection","keyPropertyName","firstCellData","keyProperty","isMultiple","multiple","selected","_c","selectedKeys","props","name","checked","id","KolIconTag","_icons","type","onInput","updatedSelectedKeys","filter","KolTooltipWcTag","_align","_id","renderHeadingSelectionCell","selectedKeyLength","dataLength","isChecked","indeterminate","translationKey","selections","renderHeaderTdCell","Fragment","ariaSort","sortButtonIcon","sortDirection","scope","KolButtonWcTag","exportparts","right","onClick","onSort","currentSortDirection","sort","renderSpacer","variant","cellDefs","verticalHeaderColpan","reduce","acc","selectionCell","renderFoot","element","tabindex","minWidth","cols"],"sources":["src/schema/props/table-header-cells.ts","src/schema/props/min-width.ts","src/components/table-stateless/component.tsx"],"sourcesContent":["import type { Generic } from 'adopted-style-sheets';\nimport type { KoliBriTableHeaderCell, Stringified } from '../types';\nimport { emptyStringByArrayHandler, objectObjectHandler, parseJson, watchValidator } from '../utils';\n\n/* types */\nexport type TableHeaderCells = {\n\thorizontal?: KoliBriTableHeaderCell[][];\n\tvertical?: KoliBriTableHeaderCell[][];\n};\n\nexport type TableHeaderCellsPropType = Stringified<TableHeaderCells>;\n\n/**\n * Defines the horizontal and vertical table header cells.\n */\nexport type PropTableHeaderCells = {\n\theaderCells: TableHeaderCellsPropType;\n};\n\n/* validator */\nexport const validateTableHeaderCells = (component: Generic.Element.Component, value?: TableHeaderCellsPropType): void => {\n\temptyStringByArrayHandler(value, () => {\n\t\tobjectObjectHandler(value, () => {\n\t\t\ttry {\n\t\t\t\tvalue = parseJson<TableHeaderCells>(value);\n\t\t\t} catch (e) {\n\t\t\t\tvoid e;\n\t\t\t}\n\t\t\twatchValidator(\n\t\t\t\tcomponent,\n\t\t\t\t'_headerCells',\n\t\t\t\t(value): boolean =>\n\t\t\t\t\ttypeof value === 'object' &&\n\t\t\t\t\tvalue !== null &&\n\t\t\t\t\t(value.horizontal === undefined ||\n\t\t\t\t\t\t(Array.isArray(value.horizontal) && value.horizontal.find((headerRow) => !Array.isArray(headerRow)) === undefined)) &&\n\t\t\t\t\t(value.vertical === undefined || (Array.isArray(value.vertical) && value.vertical.find((headerCol) => !Array.isArray(headerCol)) === undefined)) &&\n\t\t\t\t\ttrue,\n\t\t\t\tnew Set(['TableHeaderCellsPropType']),\n\t\t\t\tvalue,\n\t\t\t);\n\t\t});\n\t});\n};\n","import type { Generic } from 'adopted-style-sheets';\nimport type { WatchStringOptions } from '../utils';\nimport { watchValidator } from '../utils';\n\n/* types */\nexport type MinWidthPropType = string;\n\n/**\n * Defines the technical name of an input field.\n */\nexport type PropMinWidth = {\n\tminWidth: MinWidthPropType;\n};\n\n/* constants */\n/**\n * Regular expression to validate the width of a header cell.\n */\nconst HEADER_CELL_WIDTH_VALIDATOR = /^\\d+(\\.\\d+)?([a-z]+|%)?$/;\n\n/* validator */\nexport const validateMinWidth = (component: Generic.Element.Component, value?: MinWidthPropType, options?: WatchStringOptions): void => {\n\twatchValidator<MinWidthPropType>(\n\t\tcomponent,\n\t\t'_minWidth',\n\t\t(v) => typeof v === 'string' && HEADER_CELL_WIDTH_VALIDATOR.test(v),\n\t\tnew Set(['String', '/^\\\\d+(\\\\.\\\\d+)?([a-z]+|%)?$/']),\n\t\tvalue,\n\t\toptions,\n\t);\n};\n","import type { JSX } from '@stencil/core';\nimport { Component, Element, Fragment, h, Listen, Prop, State, Watch } from '@stencil/core';\n\nimport clsx from 'clsx';\nimport { KolButtonWcTag, KolIconTag, KolTooltipWcTag } from '../../core/component-names';\nimport type { TranslationKey } from '../../i18n';\nimport { translate } from '../../i18n';\nimport type {\n\tKoliBriTableCell,\n\tKoliBriTableDataType,\n\tKoliBriTableHeaderCell,\n\tKoliBriTableHeaderCellWithLogic,\n\tKoliBriTableHeaders,\n\tKoliBriTableRender,\n\tLabelPropType,\n\tSelectionChangeEventPayload,\n\tTableCallbacksPropType,\n\tTableDataFootPropType,\n\tTableDataPropType,\n\tTableHeaderCellsPropType,\n\tTableSelectionPropType,\n\tTableStatelessAPI,\n\tTableStatelessStates,\n} from '../../schema';\nimport {\n\tvalidateLabel,\n\tvalidateTableCallbacks,\n\tvalidateTableData,\n\tvalidateTableDataFoot,\n\tvalidateTableHeaderCells,\n\tvalidateTableSelection,\n} from '../../schema';\nimport { Callback } from '../../schema/enums';\nimport type { MinWidthPropType } from '../../schema/props/min-width';\nimport { validateMinWidth } from '../../schema/props/min-width';\nimport { nonce } from '../../utils/dev.utils';\nimport { dispatchDomEvent, KolEvent } from '../../utils/events';\n\n/**\n * @internal\n */\n@Component({\n\ttag: 'kol-table-stateless-wc',\n\tshadow: false,\n})\nexport class KolTableStateless implements TableStatelessAPI {\n\t@Element() private readonly host?: HTMLKolTableStatelessWcElement;\n\n\t@State() public state: TableStatelessStates = {\n\t\t_data: [],\n\t\t_headerCells: {\n\t\t\thorizontal: [],\n\t\t\tvertical: [],\n\t\t},\n\t\t_label: '',\n\t\t_minWidth: 'auto',\n\t};\n\n\tprivate tableDivElement?: HTMLDivElement;\n\tprivate tableDivElementResizeObserver?: ResizeObserver;\n\tprivate horizontal = true;\n\tprivate cellsToRenderTimeouts = new Map<HTMLElement, ReturnType<typeof setTimeout>>();\n\tprivate dataToKeyMap = new Map<KoliBriTableDataType, string>();\n\n\tprivate checkboxRefs: HTMLInputElement[] = [];\n\n\t@State()\n\tprivate tableDivElementHasScrollbar = false;\n\n\t/**\n\t * Defines the primary table data.\n\t */\n\t@Prop() public _data!: TableDataPropType;\n\n\t/**\n\t * Defines the data for the table footer.\n\t */\n\t@Prop() public _dataFoot?: TableDataFootPropType;\n\n\t/**\n\t * Defines the horizontal and vertical table headers.\n\t */\n\t@Prop() public _headerCells!: TableHeaderCellsPropType;\n\n\t/**\n\t * Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.).\n\t */\n\t@Prop() public _label!: string;\n\n\t/**\n\t * Defines the table min-width (CSS width values).\n\t */\n\t@Prop() public _minWidth!: MinWidthPropType;\n\n\t/**\n\t * Defines the callback functions for table events.\n\t */\n\t@Prop() public _on?: TableCallbacksPropType;\n\n\t/**\n\t * Defines how rows can be selected and the current selection.\n\t */\n\t@Prop() public _selection?: TableSelectionPropType;\n\n\t@Watch('_data')\n\tpublic validateData(value?: TableDataPropType) {\n\t\tvalidateTableData(this, value, {\n\t\t\tbeforePatch: (nextValue) => {\n\t\t\t\tthis.updateDataToKeyMap(nextValue as KoliBriTableDataType[]);\n\t\t\t},\n\t\t});\n\t}\n\n\t@Watch('_dataFoot')\n\tpublic validateDataFoot(value?: TableDataFootPropType) {\n\t\tvalidateTableDataFoot(this, value);\n\t}\n\n\t@Watch('_headerCells')\n\tpublic validateHeaderCells(value?: TableHeaderCellsPropType) {\n\t\tvalidateTableHeaderCells(this, value);\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: LabelPropType): void {\n\t\tvalidateLabel(this, value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\t@Watch('_minWidth')\n\tpublic validateMinWidth(value?: MinWidthPropType): void {\n\t\tvalidateMinWidth(this, value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: TableCallbacksPropType): void {\n\t\tvalidateTableCallbacks(this, value);\n\t}\n\n\t@Watch('_selection')\n\tpublic validateSelection(value?: TableSelectionPropType): void {\n\t\tvalidateTableSelection(this, value);\n\t}\n\n\t@Listen('keydown')\n\tpublic handleKeyDown(event: KeyboardEvent) {\n\t\tif (event.key === 'ArrowUp' || event.key === 'ArrowDown') {\n\t\t\tconst focusedElement = this.tableDivElement?.querySelector(':focus') as HTMLInputElement;\n\t\t\tlet index = this.checkboxRefs.indexOf(focusedElement);\n\n\t\t\tif (index > -1) {\n\t\t\t\tevent.preventDefault();\n\n\t\t\t\tif (event.key === 'ArrowDown') {\n\t\t\t\t\tindex = (index + 1) % this.checkboxRefs.length;\n\t\t\t\t\tthis.checkboxRefs[index].focus();\n\t\t\t\t} else if (event.key === 'ArrowUp') {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tindex = (index + this.checkboxRefs.length - 1) % this.checkboxRefs.length;\n\t\t\t\t\tthis.checkboxRefs[index].focus();\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\tpublic componentDidRender(): void {\n\t\tthis.checkDivElementScrollbar();\n\t}\n\n\tpublic componentDidLoad() {\n\t\tif (this.tableDivElement && ResizeObserver) {\n\t\t\tthis.tableDivElementResizeObserver = new ResizeObserver(this.checkDivElementScrollbar.bind(this));\n\t\t\tthis.tableDivElementResizeObserver.observe(this.tableDivElement);\n\t\t}\n\t}\n\n\tpublic disconnectedCallback() {\n\t\tthis.tableDivElementResizeObserver?.disconnect();\n\t}\n\n\tprivate checkDivElementScrollbar() {\n\t\tif (this.tableDivElement) {\n\t\t\tthis.tableDivElementHasScrollbar = this.tableDivElement.scrollWidth > this.tableDivElement.clientWidth;\n\t\t}\n\t}\n\n\tprivate updateDataToKeyMap(data: KoliBriTableDataType[]) {\n\t\tdata.forEach((data) => {\n\t\t\tif (!this.dataToKeyMap.has(data)) {\n\t\t\t\tthis.dataToKeyMap.set(data, nonce());\n\t\t\t}\n\t\t});\n\n\t\t/* Cleanup old values from map */\n\t\tthis.dataToKeyMap.forEach((_, key) => {\n\t\t\tif (!data.includes(key)) {\n\t\t\t\tthis.dataToKeyMap.delete(key);\n\t\t\t}\n\t\t});\n\t}\n\n\tprivate getDataKey(data: KoliBriTableDataType) {\n\t\treturn this.dataToKeyMap.get(data);\n\t}\n\n\t/**\n\t * Applies a custom render function to a specific table cell if provided.\n\t * Ensures that the content is updated after a delay to avoid excessive re-renders.\n\t *\n\t * @param {KoliBriTableCell} cell The cell to be rendered, with a possible custom `render` function.\n\t * @param {HTMLElement} el The HTML element where the cell is rendered.\n\t */\n\tprivate cellRender(cell: KoliBriTableCell, el?: HTMLElement): void {\n\t\tif (el) {\n\t\t\tclearTimeout(this.cellsToRenderTimeouts.get(el));\n\t\t\tthis.cellsToRenderTimeouts.set(\n\t\t\t\tel,\n\t\t\t\tsetTimeout(() => {\n\t\t\t\t\tif (typeof cell.render === 'function') {\n\t\t\t\t\t\tconst renderContent = cell.render(el, cell, cell.data, this.state._data);\n\t\t\t\t\t\tif (typeof renderContent === 'string') {\n\t\t\t\t\t\t\tel.textContent = renderContent;\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 getNumberOfCols(horizontalHeaders: KoliBriTableHeaderCell[][], data: KoliBriTableDataType[]): number {\n\t\tlet max = 0;\n\t\thorizontalHeaders.forEach((row) => {\n\t\t\tlet count = 0;\n\t\t\tArray.isArray(row) && row.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: KoliBriTableDataType[]): number {\n\t\tlet max = 0;\n\t\tverticalHeaders.forEach((col) => {\n\t\t\tlet count = 0;\n\t\t\tArray.isArray(col) && col.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 || 0;\n\t\t}\n\t\treturn max;\n\t}\n\n\tprivate getThePrimaryHeadersWithKeysIfExists(headers: KoliBriTableHeaderCell[][]): KoliBriTableHeaderCell[] {\n\t\tconst primaryHeadersWithKeys: KoliBriTableHeaderCell[] = [];\n\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\tprimaryHeadersWithKeys.push(cell);\n\t\t\t\t}\n\t\t\t});\n\t\t});\n\n\t\treturn primaryHeadersWithKeys;\n\t}\n\n\tprivate getPrimaryHeaders(headers: KoliBriTableHeaders): KoliBriTableHeaderCell[] {\n\t\tlet primaryHeadersWithKeys: KoliBriTableHeaderCell[] = this.getThePrimaryHeadersWithKeysIfExists(headers.horizontal ?? []);\n\n\t\t/**\n\t\t * It is important to note that the rendering direction of the data is implicitly set,\n\t\t * if either the horizontal or vertical header cells have keys.\n\t\t */\n\t\tthis.horizontal = true;\n\t\tif (primaryHeadersWithKeys.length === 0) {\n\t\t\tprimaryHeadersWithKeys = this.getThePrimaryHeadersWithKeysIfExists(headers.vertical ?? []);\n\t\t\tif (primaryHeadersWithKeys.length > 0) {\n\t\t\t\tthis.horizontal = false;\n\t\t\t}\n\t\t}\n\t\treturn primaryHeadersWithKeys;\n\t}\n\n\tprivate createDataField(data: KoliBriTableDataType[], headers: KoliBriTableHeaders, isFoot?: boolean): (KoliBriTableCell & KoliBriTableDataType)[][] {\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.getPrimaryHeaders(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 || 0;\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: KoliBriTableHeaderCellWithLogic[] = [];\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\theaderCell: true,\n\t\t\t\t\t\t\tdata: {},\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 ? 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\tdata: row,\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\tdata: data[j],\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\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 handleSelectionChangeCallbackAndEvent(event: Event, payload: SelectionChangeEventPayload) {\n\t\tif (typeof this.state._on?.[Callback.onSelectionChange] === 'function') {\n\t\t\tthis.state._on[Callback.onSelectionChange](event, payload);\n\t\t}\n\t\tif (this.host) {\n\t\t\tdispatchDomEvent(this.host, KolEvent.selectionChange, payload);\n\t\t}\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateData(this._data);\n\t\tthis.validateDataFoot(this._dataFoot);\n\t\tthis.validateHeaderCells(this._headerCells);\n\t\tthis.validateLabel(this._label);\n\t\tthis.validateMinWidth(this._minWidth);\n\t\tthis.validateOn(this._on);\n\t\tthis.validateSelection(this._selection);\n\t}\n\n\t/**\n\t * Renders the selection cell for a row, either as a checkbox (for multiple selection)\n\t * or as a radio button (for single selection). It handles selection states and dispatches\n\t * events for selection changes.\n\t *\n\t * @param {KoliBriTableCell[]} row  The row data containing the cell with selection properties.\n\t * @param {number} rowIndex  The index of the row.\n\t * @returns {JSX.Element}  The rendered selection cell, either with a checkbox or radio input.\n\t */\n\tprivate renderSelectionCell(row: (KoliBriTableCell & KoliBriTableDataType)[], rowIndex: number): JSX.Element {\n\t\tconst selection = this.state._selection;\n\t\tif (!selection) return '';\n\t\tconst keyPropertyName = selection.keyPropertyName ?? 'id';\n\t\tconst firstCellData = row[0]?.data;\n\n\t\tif (!firstCellData) return '';\n\t\tconst keyProperty = firstCellData[keyPropertyName] as string;\n\t\tconst isMultiple = selection.multiple || selection.multiple === undefined;\n\t\tconst selected = selection?.selectedKeys?.includes(keyProperty);\n\t\tconst label = selection.label(firstCellData);\n\t\tconst props = {\n\t\t\tname: 'selection',\n\t\t\tchecked: selected,\n\t\t\tid: keyProperty,\n\t\t\t['aria-label']: label,\n\t\t};\n\t\treturn (\n\t\t\t<td key={`tbody-${rowIndex}-selection`} class=\"kol-table__cell kol-table__cell--selection\">\n\t\t\t\t<div class={clsx('kol-table__selection', { 'kol-table__selection--checked': selected })}>\n\t\t\t\t\t{isMultiple ? (\n\t\t\t\t\t\t<label class=\"kol-table__selection-label\">\n\t\t\t\t\t\t\t<KolIconTag class=\"kol-table__selection-icon\" _icons={`codicon ${selected ? 'codicon-check' : ''}`} _label=\"\" />\n\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\tclass={clsx('kol-table__selection-input kol-table__selection-input--checkbox')}\n\t\t\t\t\t\t\t\tref={(el) => el && this.checkboxRefs.push(el)}\n\t\t\t\t\t\t\t\t{...props}\n\t\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\t\tonInput={(event: Event) => {\n\t\t\t\t\t\t\t\t\tconst updatedSelectedKeys = !selected\n\t\t\t\t\t\t\t\t\t\t? [...(selection?.selectedKeys ?? []), keyProperty]\n\t\t\t\t\t\t\t\t\t\t: selection?.selectedKeys?.filter((key) => key !== keyProperty);\n\t\t\t\t\t\t\t\t\tthis.handleSelectionChangeCallbackAndEvent(event, updatedSelectedKeys ?? []);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</label>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<label class=\"kol-table__selection-label\">\n\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\tclass={clsx('kol-table__selection-input kol-table__selection-input--radio')}\n\t\t\t\t\t\t\t\t{...props}\n\t\t\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\t\t\tonInput={(event: Event) => {\n\t\t\t\t\t\t\t\t\tthis.handleSelectionChangeCallbackAndEvent(event, keyProperty);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</label>\n\t\t\t\t\t)}\n\t\t\t\t\t<KolTooltipWcTag\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\tclass=\"kol-table__selection-input-tooltip\"\n\t\t\t\t\t\t_align=\"right\"\n\t\t\t\t\t\t_id={`${keyProperty}-label`}\n\t\t\t\t\t\t_label={label}\n\t\t\t\t\t></KolTooltipWcTag>\n\t\t\t\t</div>\n\t\t\t</td>\n\t\t);\n\t}\n\n\t/**\n\t * Renders a full table row by mapping over each cell and calling `renderTableCell`.\n\t * It also handles the row's unique key generation and selection functionality.\n\t *\n\t * @param {KoliBriTableCell[]} row  The data for the current row.\n\t * @param {number} rowIndex  The index of the current row being rendered.\n\t * @param isVertical\n\t * @param isFooter\n\t * @returns {JSX.Element}  The rendered row with its cells.\n\t */\n\tprivate readonly renderTableRow = (\n\t\trow: (KoliBriTableCell & KoliBriTableDataType)[],\n\t\trowIndex: number,\n\t\tisVertical: boolean,\n\t\tisFooter: boolean = false,\n\t): JSX.Element => {\n\t\tlet key = String(rowIndex);\n\t\tif (this.horizontal && row[0]?.data) {\n\t\t\tkey = this.getDataKey(row[0].data) ?? key;\n\t\t}\n\n\t\treturn (\n\t\t\t<tr\n\t\t\t\tclass={clsx('kol-table__row', {\n\t\t\t\t\t'kol-table__row--body': !isFooter,\n\t\t\t\t\t'kol-table__row--footer': isFooter,\n\t\t\t\t})}\n\t\t\t\tkey={`row-${key}`}\n\t\t\t>\n\t\t\t\t{this.renderSelectionCell(row, rowIndex)}\n\t\t\t\t{row.map((cell, colIndex) => this.renderTableCell(cell, rowIndex, colIndex, isVertical))}\n\t\t\t</tr>\n\t\t);\n\t};\n\n\t/**\n\t * Renders a table cell, either as a data cell (`<td>`) or a header cell (`<th>`).\n\t * If a custom `render` function is provided in the cell, it will be used to display content.\n\t *\n\t * @param {KoliBriTableCell} cell The cell data, containing label, colSpan, rowSpan, and potential render function.\n\t * @param {number} rowIndex  The current row index.\n\t * @param {number} colIndex  The current column index.\n\t * @returns {JSX.Element}  The rendered table cell (either `<td>` or `<th>`).\n\t */\n\tprivate readonly renderTableCell = (cell: KoliBriTableCell, rowIndex: number, colIndex: number, isVertical: boolean): JSX.Element => {\n\t\tlet key = `${rowIndex}-${colIndex}-${cell.label}`;\n\t\tif (cell.data) {\n\t\t\tconst dataKey = this.getDataKey(cell.data);\n\t\t\tkey = dataKey ? `${dataKey}-${this.horizontal ? colIndex : rowIndex}` : key;\n\t\t}\n\n\t\tif ((cell as KoliBriTableHeaderCellWithLogic).headerCell) {\n\t\t\treturn this.renderHeadingCell(cell, rowIndex, colIndex, isVertical);\n\t\t} else {\n\t\t\treturn (\n\t\t\t\t<td\n\t\t\t\t\tkey={`cell-${key}`}\n\t\t\t\t\tclass={clsx('kol-table__cell kol-table__cell--body', {\n\t\t\t\t\t\t[`kol-table__cell--align-${cell.textAlign}`]: cell.textAlign,\n\t\t\t\t\t})}\n\t\t\t\t\tcolSpan={cell.colSpan}\n\t\t\t\t\trowSpan={cell.rowSpan}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\ttextAlign: cell.textAlign,\n\t\t\t\t\t\twidth: cell.width,\n\t\t\t\t\t}}\n\t\t\t\t\tref={\n\t\t\t\t\t\ttypeof cell.render === 'function'\n\t\t\t\t\t\t\t? (el) => {\n\t\t\t\t\t\t\t\t\tthis.cellRender(cell as KoliBriTableHeaderCellWithLogic & { render: KoliBriTableRender }, el);\n\t\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>\n\t\t\t\t\t{typeof cell.render !== 'function' ? cell.label : ''}\n\t\t\t\t</td>\n\t\t\t);\n\t\t}\n\t};\n\n\t/**\n\t * Renders the header cell for row selection. This cell contains a checkbox for selecting\n\t * all rows when selection is enabled. If multiple selection is allowed, the checkbox allows\n\t * selecting/deselecting all rows at once. It also supports an indeterminate state\n\t * if only some rows are selected.\n\t *\n\t * @returns {JSX.Element} - The rendered header cell containing the selection checkbox.\n\t */\n\tprivate renderHeadingSelectionCell(): JSX.Element {\n\t\tconst selection = this.state._selection;\n\t\tif (!selection || (!selection.multiple && selection.multiple !== undefined))\n\t\t\treturn <th class=\"kol-table__cell kol-table__cell--header\" key={`thead-0`}></th>;\n\t\tconst keyPropertyName = selection.keyPropertyName ?? 'id';\n\t\tconst selectedKeyLength = selection.selectedKeys?.length;\n\t\tconst dataLength = this.state._data.length;\n\t\tconst isChecked = selectedKeyLength === dataLength;\n\t\tconst indeterminate = selectedKeyLength !== 0 && !isChecked;\n\t\tlet translationKey = 'kol-table-selection-indeterminate' as TranslationKey;\n\t\tif (isChecked && !indeterminate) {\n\t\t\ttranslationKey = 'kol-table-selection-none';\n\t\t}\n\t\tif (selectedKeyLength === 0) {\n\t\t\ttranslationKey = 'kol-table-selection-all';\n\t\t}\n\t\tconst label = translate(translationKey);\n\t\treturn (\n\t\t\t<th key={`thead-0-selection`} class=\"kol-table__cell kol-table__cell--header\">\n\t\t\t\t<div\n\t\t\t\t\tclass={clsx('kol-table__selection', {\n\t\t\t\t\t\t'kol-table__selection--indeterminate': indeterminate,\n\t\t\t\t\t\t'kol-table__selection--checked': isChecked,\n\t\t\t\t\t})}\n\t\t\t\t>\n\t\t\t\t\t<label class=\"kol-table__selection-label\">\n\t\t\t\t\t\t<KolIconTag class=\"kol-table__selection-icon\" _icons={`codicon ${indeterminate ? 'codicon-remove' : isChecked ? 'codicon-check' : ''}`} _label=\"\" />\n\t\t\t\t\t\t<input\n\t\t\t\t\t\t\tclass={clsx('kol-table__selection-input kol-table__selection-input--checkbox')}\n\t\t\t\t\t\t\tref={(el) => el && this.checkboxRefs.push(el)}\n\t\t\t\t\t\t\tname=\"selection\"\n\t\t\t\t\t\t\tchecked={isChecked && !indeterminate}\n\t\t\t\t\t\t\taria-label={label}\n\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\tonInput={(event: Event) => {\n\t\t\t\t\t\t\t\tconst selections = !isChecked ? this.state._data.map((el) => el?.[keyPropertyName] as string) : [];\n\t\t\t\t\t\t\t\tthis.handleSelectionChangeCallbackAndEvent(event, selections);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</label>\n\t\t\t\t\t<KolTooltipWcTag\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\tclass=\"kol-table__selection-input-tooltip\"\n\t\t\t\t\t\t_align=\"right\"\n\t\t\t\t\t\t_id={`${translationKey}-label`}\n\t\t\t\t\t\t_label={label}\n\t\t\t\t\t></KolTooltipWcTag>\n\t\t\t\t</div>\n\t\t\t</th>\n\t\t);\n\t}\n\n\t/**\n\t * This header cell is rendered as a TD element when in addition to the horizontal header rows\n\t * there are also vertical header columns. In this case, the cell is rendered blank above the\n\t * vertical header columns.\n\t */\n\tprivate renderHeaderTdCell(): JSX.Element {\n\t\treturn (\n\t\t\t<Fragment>\n\t\t\t\t{Array.isArray(this.state._headerCells.horizontal) &&\n\t\t\t\t\tthis.state._headerCells.horizontal.length > 0 &&\n\t\t\t\t\tArray.isArray(this.state._headerCells.vertical) &&\n\t\t\t\t\tthis.state._headerCells.vertical.length > 0 &&\n\t\t\t\t\tArray.isArray(this.state._headerCells.horizontal) && (\n\t\t\t\t\t\t<td aria-hidden=\"true\" colSpan={this.state._headerCells.vertical.length} rowSpan={this.state._headerCells.horizontal.length}></td>\n\t\t\t\t\t)}\n\t\t\t</Fragment>\n\t\t);\n\t}\n\n\t/**\n\t *  Renders a table header cell (`<th>`), with optional sorting functionality.\n\t *  If the cell has a `sortDirection` property, a sort button is rendered within the header.\n\t *\n\t * @param {KoliBriTableHeaderCell} cell  The header cell data, containing label, colSpan, rowSpan, and possible sort direction.\n\t * @param {number} rowIndex  The index of the current row in the table.\n\t * @param {number} colIndex  The index of the current column in the row.\n\t * @returns {JSX.Element}  The rendered header cell with possible sorting controls.\n\t */\n\tprivate renderHeadingCell(cell: KoliBriTableHeaderCell, rowIndex: number, colIndex: number, isVertical: boolean): JSX.Element {\n\t\tlet ariaSort = undefined;\n\t\tlet sortButtonIcon = 'codicon codicon-fold';\n\n\t\tif (cell.sortDirection) {\n\t\t\tswitch (cell.sortDirection) {\n\t\t\t\tcase 'ASC':\n\t\t\t\t\tsortButtonIcon = 'codicon codicon-chevron-up';\n\t\t\t\t\tariaSort = 'ascending';\n\t\t\t\t\tbreak;\n\t\t\t\tcase 'DESC':\n\t\t\t\t\tsortButtonIcon = 'codicon codicon-chevron-down';\n\t\t\t\t\tariaSort = 'descending';\n\t\t\t\t\tbreak;\n\t\t\t}\n\t\t}\n\n\t\tconst scope = isVertical ? 'row' : typeof cell.colSpan === 'number' && cell.colSpan > 1 ? 'colgroup' : 'col';\n\n\t\treturn (\n\t\t\t<th\n\t\t\t\tkey={`${rowIndex}-${colIndex}-${cell.label}`}\n\t\t\t\tclass={clsx('kol-table__cell kol-table__cell--header', {\n\t\t\t\t\t[`kol-table__cell--align-${cell.textAlign}`]: cell.textAlign,\n\t\t\t\t\t[`kol-table__cell--${ariaSort}`]: ariaSort,\n\t\t\t\t})}\n\t\t\t\tscope={scope}\n\t\t\t\tcolSpan={cell.colSpan}\n\t\t\t\trowSpan={cell.rowSpan}\n\t\t\t\tstyle={{\n\t\t\t\t\twidth: cell.width,\n\t\t\t\t}}\n\t\t\t\taria-sort={ariaSort}\n\t\t\t\tdata-sort={`sort-${cell.sortDirection}`}\n\t\t\t>\n\t\t\t\t{cell.sortDirection ? (\n\t\t\t\t\t<KolButtonWcTag\n\t\t\t\t\t\tclass=\"kol-table__sort-button\"\n\t\t\t\t\t\texportparts=\"icon\"\n\t\t\t\t\t\t_icons={{ right: sortButtonIcon }}\n\t\t\t\t\t\t_label={cell.label}\n\t\t\t\t\t\t_on={{\n\t\t\t\t\t\t\tonClick: (event: MouseEvent) => {\n\t\t\t\t\t\t\t\tif (typeof this.state._on?.onSort === 'function' && cell.key && cell.sortDirection) {\n\t\t\t\t\t\t\t\t\tthis.state._on.onSort(event, {\n\t\t\t\t\t\t\t\t\t\tkey: cell.key,\n\t\t\t\t\t\t\t\t\t\tcurrentSortDirection: 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\tif (this.host) {\n\t\t\t\t\t\t\t\t\tdispatchDomEvent(this.host, KolEvent.sort, {\n\t\t\t\t\t\t\t\t\t\tkey: cell.key,\n\t\t\t\t\t\t\t\t\t\tcurrentSortDirection: 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}}\n\t\t\t\t\t></KolButtonWcTag>\n\t\t\t\t) : (\n\t\t\t\t\tcell.label\n\t\t\t\t)}\n\t\t\t</th>\n\t\t);\n\t}\n\n\tprivate renderSpacer(variant: 'foot' | 'head', cellDefs: KoliBriTableHeaderCell[][] | KoliBriTableCell[][]): JSX.Element {\n\t\tconst verticalHeaderColpan = this.state._headerCells.vertical?.length || 0;\n\t\tconst colspan = cellDefs?.[0]?.reduce((acc, row) => acc + (row.colSpan || 1), 0);\n\t\tconst selectionCell = this.state._selection ? 1 : 0;\n\n\t\treturn (\n\t\t\t<tr aria-hidden=\"true\" class={clsx('kol-table__spacer', `kol-table__spacer--${variant}`)}>\n\t\t\t\t<td class={clsx(`kol-table__spacer-line kol-table__spacer-line--${variant}`)} colSpan={verticalHeaderColpan + colspan + selectionCell}></td>\n\t\t\t</tr>\n\t\t);\n\t}\n\n\tprivate renderFoot(): JSX.Element[] | null {\n\t\tif (!this.state._dataFoot || this.state._dataFoot.length === 0) {\n\t\t\treturn null;\n\t\t}\n\n\t\tconst rows: KoliBriTableCell[][] = this.createDataField(this.state._dataFoot, this.state._headerCells, true);\n\t\treturn (\n\t\t\t<tfoot class=\"kol-table__footer\">\n\t\t\t\t{[\n\t\t\t\t\tthis.renderSpacer('foot', rows),\n\t\t\t\t\trows.map((row: (KoliBriTableCell & KoliBriTableDataType)[], rowIndex: number) => this.renderTableRow(row, rowIndex, true, true)),\n\t\t\t\t]}\n\t\t\t</tfoot>\n\t\t);\n\t}\n\n\tpublic render(): JSX.Element {\n\t\tconst dataField = this.createDataField(this.state._data, this.state._headerCells);\n\t\tthis.checkboxRefs = [];\n\n\t\treturn (\n\t\t\t/* Firefox automatically makes the following div focusable when it has a scrollbar. We implement a similar behavior cross-browser by allowing the\n\t\t\t * <div class=\"focus-element\"> to receive focus. Hence, we disable focus for the div to avoid having two focusable elements by setting `tabindex=\"-1\"`\n\t\t\t */\n\t\t\t/* eslint-disable-next-line jsx-a11y/no-static-element-interactions */\n\t\t\t<div ref={(element) => (this.tableDivElement = element)} class=\"kol-table\" tabindex={this.tableDivElementHasScrollbar ? '-1' : undefined}>\n\t\t\t\t<table\n\t\t\t\t\tclass=\"kol-table__table\"\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tminWidth: this.state._minWidth,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{/*\n\t\t\t\t\t * The following element allows the table to receive focus without providing redundant content to screen readers.\n\t\t\t\t\t * The `div` is technically not allowed here. But any allowed element would mutate the table semantics. Additionally, the `&nbsp;` is necessary to\n\t\t\t\t\t * prevent screen readers from just reading \"blank\".\n\t\t\t\t\t */}\n\t\t\t\t\t{/* eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex */}\n\t\t\t\t\t<div class=\"kol-table__focus-element\" tabindex={this.tableDivElementHasScrollbar ? '0' : undefined} aria-describedby=\"caption\">\n\t\t\t\t\t\t&nbsp;\n\t\t\t\t\t</div>\n\n\t\t\t\t\t<caption class=\"kol-table__caption\" id=\"caption\">\n\t\t\t\t\t\t{this.state._label}\n\t\t\t\t\t</caption>\n\n\t\t\t\t\t{Array.isArray(this.state._headerCells.horizontal) && (\n\t\t\t\t\t\t<thead class=\"kol-table__head\">\n\t\t\t\t\t\t\t{[\n\t\t\t\t\t\t\t\tthis.state._headerCells.horizontal.map((cols, rowIndex) => (\n\t\t\t\t\t\t\t\t\t<tr class=\"kol-table__head-row\" key={`thead-${rowIndex}`}>\n\t\t\t\t\t\t\t\t\t\t{this.state._selection && this.renderHeadingSelectionCell()}\n\t\t\t\t\t\t\t\t\t\t{rowIndex === 0 && this.renderHeaderTdCell()}\n\t\t\t\t\t\t\t\t\t\t{Array.isArray(cols) && cols.map((cell, colIndex) => this.renderHeadingCell(cell, rowIndex, colIndex, false))}\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\tthis.renderSpacer('head', this.state._headerCells.horizontal),\n\t\t\t\t\t\t\t]}\n\t\t\t\t\t\t</thead>\n\t\t\t\t\t)}\n\t\t\t\t\t<tbody class=\"kol-table__body\">\n\t\t\t\t\t\t{dataField.map((row: (KoliBriTableCell & KoliBriTableDataType)[], rowIndex: number) => this.renderTableRow(row, rowIndex, true))}\n\t\t\t\t\t</tbody>\n\t\t\t\t\t{this.renderFoot()}\n\t\t\t\t</table>\n\t\t\t</div>\n\t\t);\n\t}\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["validateTableHeaderCells","component","value","emptyStringByArrayHandler","objectObjectHandler","parseJson","e","watchValidator","horizontal","undefined","Array","isArray","find","headerRow","vertical","headerCol","Set","HEADER_CELL_WIDTH_VALIDATOR","validateMinWidth","options","v","test","KolTableStateless","this","cellsToRenderTimeouts","Map","dataToKeyMap","checkboxRefs","renderTableRow","row","rowIndex","isVertical","isFooter","key","String","_a","data","_b","getDataKey","h","class","clsx","renderSelectionCell","map","cell","colIndex","renderTableCell","label","dataKey","headerCell","renderHeadingCell","textAlign","colSpan","rowSpan","style","width","ref","render","el","cellRender","_data","_headerCells","_label","_minWidth","validateData","validateTableData","beforePatch","nextValue","updateDataToKeyMap","validateDataFoot","validateTableDataFoot","validateHeaderCells","validateLabel","required","validateOn","validateTableCallbacks","validateSelection","validateTableSelection","handleKeyDown","event","focusedElement","tableDivElement","querySelector","index","indexOf","preventDefault","length","focus","componentDidRender","checkDivElementScrollbar","componentDidLoad","ResizeObserver","tableDivElementResizeObserver","bind","observe","disconnectedCallback","disconnect","tableDivElementHasScrollbar","scrollWidth","clientWidth","forEach","has","set","nonce","_","includes","delete","get","clearTimeout","setTimeout","renderContent","state","textContent","getNumberOfCols","horizontalHeaders","max","count","col","getNumberOfRows","verticalHeaders","_dataFoot","getThePrimaryHeadersWithKeysIfExists","headers","primaryHeadersWithKeys","cells","push","getPrimaryHeaders","createDataField","isFoot","primaryHeader","maxCols","maxRows","startRow","dataField","rowCount","rowSpans","_row","i","dataRow","headerCells","rowsTotal","rows","Object","assign","k","j","colspan","rowspan","emptyCell","translate","Math","handleSelectionChangeCallbackAndEvent","payload","_on","Callback","onSelectionChange","host","dispatchDomEvent","KolEvent","selectionChange","componentWillLoad","_selection","selection","keyPropertyName","getSelectionKeyPropertyName","firstCellData","keyProperty","isMultiple","multiple","selected","selectedKeys","disabled","_c","disabledKeys","props","name","checked","id","KolIconTag","_icons","type","onInput","updatedSelectedKeys","filter","KolTooltipWcTag","_align","_id","getDataWithSelectionEnabled","item","getSelectedKeysWithoutDisabledKeys","getSelectedKeysWithDisabledKeysOnly","getRevertedSelection","selectAll","renderHeadingSelectionCell","selectedKeyLength","dataLength","isChecked","indeterminate","translationKey","renderHeaderTdCell","Fragment","ariaSort","sortButtonIcon","sortDirection","scope","KolButtonWcTag","exportparts","right","onClick","onSort","currentSortDirection","sort","renderSpacer","variant","cellDefs","verticalHeaderColpan","reduce","acc","selectionCell","renderFoot","element","tabindex","minWidth","cols"],"sources":["src/schema/props/table-header-cells.ts","src/schema/props/min-width.ts","src/components/table-stateless/component.tsx"],"sourcesContent":["import type { Generic } from 'adopted-style-sheets';\nimport type { KoliBriTableHeaderCell, Stringified } from '../types';\nimport { emptyStringByArrayHandler, objectObjectHandler, parseJson, watchValidator } from '../utils';\n\n/* types */\nexport type TableHeaderCells = {\n\thorizontal?: KoliBriTableHeaderCell[][];\n\tvertical?: KoliBriTableHeaderCell[][];\n};\n\nexport type TableHeaderCellsPropType = Stringified<TableHeaderCells>;\n\n/**\n * Defines the horizontal and vertical table header cells.\n */\nexport type PropTableHeaderCells = {\n\theaderCells: TableHeaderCellsPropType;\n};\n\n/* validator */\nexport const validateTableHeaderCells = (component: Generic.Element.Component, value?: TableHeaderCellsPropType): void => {\n\temptyStringByArrayHandler(value, () => {\n\t\tobjectObjectHandler(value, () => {\n\t\t\ttry {\n\t\t\t\tvalue = parseJson<TableHeaderCells>(value);\n\t\t\t} catch (e) {\n\t\t\t\tvoid e;\n\t\t\t}\n\t\t\twatchValidator(\n\t\t\t\tcomponent,\n\t\t\t\t'_headerCells',\n\t\t\t\t(value): boolean =>\n\t\t\t\t\ttypeof value === 'object' &&\n\t\t\t\t\tvalue !== null &&\n\t\t\t\t\t(value.horizontal === undefined ||\n\t\t\t\t\t\t(Array.isArray(value.horizontal) && value.horizontal.find((headerRow) => !Array.isArray(headerRow)) === undefined)) &&\n\t\t\t\t\t(value.vertical === undefined || (Array.isArray(value.vertical) && value.vertical.find((headerCol) => !Array.isArray(headerCol)) === undefined)) &&\n\t\t\t\t\ttrue,\n\t\t\t\tnew Set(['TableHeaderCellsPropType']),\n\t\t\t\tvalue,\n\t\t\t);\n\t\t});\n\t});\n};\n","import type { Generic } from 'adopted-style-sheets';\nimport type { WatchStringOptions } from '../utils';\nimport { watchValidator } from '../utils';\n\n/* types */\nexport type MinWidthPropType = string;\n\n/**\n * Defines the technical name of an input field.\n */\nexport type PropMinWidth = {\n\tminWidth: MinWidthPropType;\n};\n\n/* constants */\n/**\n * Regular expression to validate the width of a header cell.\n */\nconst HEADER_CELL_WIDTH_VALIDATOR = /^\\d+(\\.\\d+)?([a-z]+|%)?$/;\n\n/* validator */\nexport const validateMinWidth = (component: Generic.Element.Component, value?: MinWidthPropType, options?: WatchStringOptions): void => {\n\twatchValidator<MinWidthPropType>(\n\t\tcomponent,\n\t\t'_minWidth',\n\t\t(v) => typeof v === 'string' && HEADER_CELL_WIDTH_VALIDATOR.test(v),\n\t\tnew Set(['String', '/^\\\\d+(\\\\.\\\\d+)?([a-z]+|%)?$/']),\n\t\tvalue,\n\t\toptions,\n\t);\n};\n","import type { JSX } from '@stencil/core';\nimport { Component, Element, Fragment, h, Listen, Prop, State, Watch } from '@stencil/core';\n\nimport clsx from 'clsx';\nimport { KolButtonWcTag, KolIconTag, KolTooltipWcTag } from '../../core/component-names';\nimport type { TranslationKey } from '../../i18n';\nimport { translate } from '../../i18n';\nimport type {\n\tKoliBriTableCell,\n\tKoliBriTableDataType,\n\tKoliBriTableHeaderCell,\n\tKoliBriTableHeaderCellWithLogic,\n\tKoliBriTableHeaders,\n\tKoliBriTableRender,\n\tLabelPropType,\n\tSelectionChangeEventPayload,\n\tTableCallbacksPropType,\n\tTableDataFootPropType,\n\tTableDataPropType,\n\tTableHeaderCellsPropType,\n\tTableSelectionPropType,\n\tTableStatelessAPI,\n\tTableStatelessStates,\n} from '../../schema';\nimport {\n\tvalidateLabel,\n\tvalidateTableCallbacks,\n\tvalidateTableData,\n\tvalidateTableDataFoot,\n\tvalidateTableHeaderCells,\n\tvalidateTableSelection,\n} from '../../schema';\nimport { Callback } from '../../schema/enums';\nimport type { MinWidthPropType } from '../../schema/props/min-width';\nimport { validateMinWidth } from '../../schema/props/min-width';\nimport { nonce } from '../../utils/dev.utils';\nimport { dispatchDomEvent, KolEvent } from '../../utils/events';\n\n/**\n * @internal\n */\n@Component({\n\ttag: 'kol-table-stateless-wc',\n\tshadow: false,\n})\nexport class KolTableStateless implements TableStatelessAPI {\n\t@Element() private readonly host?: HTMLKolTableStatelessWcElement;\n\n\t@State() public state: TableStatelessStates = {\n\t\t_data: [],\n\t\t_headerCells: {\n\t\t\thorizontal: [],\n\t\t\tvertical: [],\n\t\t},\n\t\t_label: '',\n\t\t_minWidth: 'auto',\n\t};\n\n\tprivate tableDivElement?: HTMLDivElement;\n\tprivate tableDivElementResizeObserver?: ResizeObserver;\n\tprivate horizontal = true;\n\tprivate cellsToRenderTimeouts = new Map<HTMLElement, ReturnType<typeof setTimeout>>();\n\tprivate dataToKeyMap = new Map<KoliBriTableDataType, string>();\n\n\tprivate checkboxRefs: HTMLInputElement[] = [];\n\n\t@State()\n\tprivate tableDivElementHasScrollbar = false;\n\n\t/**\n\t * Defines the primary table data.\n\t */\n\t@Prop() public _data!: TableDataPropType;\n\n\t/**\n\t * Defines the data for the table footer.\n\t */\n\t@Prop() public _dataFoot?: TableDataFootPropType;\n\n\t/**\n\t * Defines the horizontal and vertical table headers.\n\t */\n\t@Prop() public _headerCells!: TableHeaderCellsPropType;\n\n\t/**\n\t * Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.).\n\t */\n\t@Prop() public _label!: string;\n\n\t/**\n\t * Defines the table min-width (CSS width values).\n\t */\n\t@Prop() public _minWidth!: MinWidthPropType;\n\n\t/**\n\t * Defines the callback functions for table events.\n\t */\n\t@Prop() public _on?: TableCallbacksPropType;\n\n\t/**\n\t * Defines how rows can be selected and the current selection.\n\t */\n\t@Prop() public _selection?: TableSelectionPropType;\n\n\t@Watch('_data')\n\tpublic validateData(value?: TableDataPropType) {\n\t\tvalidateTableData(this, value, {\n\t\t\tbeforePatch: (nextValue) => {\n\t\t\t\tthis.updateDataToKeyMap(nextValue as KoliBriTableDataType[]);\n\t\t\t},\n\t\t});\n\t}\n\n\t@Watch('_dataFoot')\n\tpublic validateDataFoot(value?: TableDataFootPropType) {\n\t\tvalidateTableDataFoot(this, value);\n\t}\n\n\t@Watch('_headerCells')\n\tpublic validateHeaderCells(value?: TableHeaderCellsPropType) {\n\t\tvalidateTableHeaderCells(this, value);\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: LabelPropType): void {\n\t\tvalidateLabel(this, value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\t@Watch('_minWidth')\n\tpublic validateMinWidth(value?: MinWidthPropType): void {\n\t\tvalidateMinWidth(this, value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: TableCallbacksPropType): void {\n\t\tvalidateTableCallbacks(this, value);\n\t}\n\n\t@Watch('_selection')\n\tpublic validateSelection(value?: TableSelectionPropType): void {\n\t\tvalidateTableSelection(this, value);\n\t}\n\n\t@Listen('keydown')\n\tpublic handleKeyDown(event: KeyboardEvent) {\n\t\tif (event.key === 'ArrowUp' || event.key === 'ArrowDown') {\n\t\t\tconst focusedElement = this.tableDivElement?.querySelector(':focus') as HTMLInputElement;\n\t\t\tlet index = this.checkboxRefs.indexOf(focusedElement);\n\n\t\t\tif (index > -1) {\n\t\t\t\tevent.preventDefault();\n\n\t\t\t\tif (event.key === 'ArrowDown') {\n\t\t\t\t\tindex = (index + 1) % this.checkboxRefs.length;\n\t\t\t\t\tthis.checkboxRefs[index].focus();\n\t\t\t\t} else if (event.key === 'ArrowUp') {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tindex = (index + this.checkboxRefs.length - 1) % this.checkboxRefs.length;\n\t\t\t\t\tthis.checkboxRefs[index].focus();\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\tpublic componentDidRender(): void {\n\t\tthis.checkDivElementScrollbar();\n\t}\n\n\tpublic componentDidLoad() {\n\t\tif (this.tableDivElement && ResizeObserver) {\n\t\t\tthis.tableDivElementResizeObserver = new ResizeObserver(this.checkDivElementScrollbar.bind(this));\n\t\t\tthis.tableDivElementResizeObserver.observe(this.tableDivElement);\n\t\t}\n\t}\n\n\tpublic disconnectedCallback() {\n\t\tthis.tableDivElementResizeObserver?.disconnect();\n\t}\n\n\tprivate checkDivElementScrollbar() {\n\t\tif (this.tableDivElement) {\n\t\t\tthis.tableDivElementHasScrollbar = this.tableDivElement.scrollWidth > this.tableDivElement.clientWidth;\n\t\t}\n\t}\n\n\tprivate updateDataToKeyMap(data: KoliBriTableDataType[]) {\n\t\tdata.forEach((data) => {\n\t\t\tif (!this.dataToKeyMap.has(data)) {\n\t\t\t\tthis.dataToKeyMap.set(data, nonce());\n\t\t\t}\n\t\t});\n\n\t\t/* Cleanup old values from map */\n\t\tthis.dataToKeyMap.forEach((_, key) => {\n\t\t\tif (!data.includes(key)) {\n\t\t\t\tthis.dataToKeyMap.delete(key);\n\t\t\t}\n\t\t});\n\t}\n\n\tprivate getDataKey(data: KoliBriTableDataType) {\n\t\treturn this.dataToKeyMap.get(data);\n\t}\n\n\t/**\n\t * Applies a custom render function to a specific table cell if provided.\n\t * Ensures that the content is updated after a delay to avoid excessive re-renders.\n\t *\n\t * @param {KoliBriTableCell} cell The cell to be rendered, with a possible custom `render` function.\n\t * @param {HTMLElement} el The HTML element where the cell is rendered.\n\t */\n\tprivate cellRender(cell: KoliBriTableCell, el?: HTMLElement): void {\n\t\tif (el) {\n\t\t\tclearTimeout(this.cellsToRenderTimeouts.get(el));\n\t\t\tthis.cellsToRenderTimeouts.set(\n\t\t\t\tel,\n\t\t\t\tsetTimeout(() => {\n\t\t\t\t\tif (typeof cell.render === 'function') {\n\t\t\t\t\t\tconst renderContent = cell.render(el, cell, cell.data, this.state._data);\n\t\t\t\t\t\tif (typeof renderContent === 'string') {\n\t\t\t\t\t\t\tel.textContent = renderContent;\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 getNumberOfCols(horizontalHeaders: KoliBriTableHeaderCell[][], data: KoliBriTableDataType[]): number {\n\t\tlet max = 0;\n\t\thorizontalHeaders.forEach((row) => {\n\t\t\tlet count = 0;\n\t\t\tArray.isArray(row) && row.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: KoliBriTableDataType[]): number {\n\t\tlet max = 0;\n\t\tverticalHeaders.forEach((col) => {\n\t\t\tlet count = 0;\n\t\t\tArray.isArray(col) && col.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 || 0;\n\t\t}\n\t\treturn max;\n\t}\n\n\tprivate getThePrimaryHeadersWithKeysIfExists(headers: KoliBriTableHeaderCell[][]): KoliBriTableHeaderCell[] {\n\t\tconst primaryHeadersWithKeys: KoliBriTableHeaderCell[] = [];\n\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\tprimaryHeadersWithKeys.push(cell);\n\t\t\t\t}\n\t\t\t});\n\t\t});\n\n\t\treturn primaryHeadersWithKeys;\n\t}\n\n\tprivate getPrimaryHeaders(headers: KoliBriTableHeaders): KoliBriTableHeaderCell[] {\n\t\tlet primaryHeadersWithKeys: KoliBriTableHeaderCell[] = this.getThePrimaryHeadersWithKeysIfExists(headers.horizontal ?? []);\n\n\t\t/**\n\t\t * It is important to note that the rendering direction of the data is implicitly set,\n\t\t * if either the horizontal or vertical header cells have keys.\n\t\t */\n\t\tthis.horizontal = true;\n\t\tif (primaryHeadersWithKeys.length === 0) {\n\t\t\tprimaryHeadersWithKeys = this.getThePrimaryHeadersWithKeysIfExists(headers.vertical ?? []);\n\t\t\tif (primaryHeadersWithKeys.length > 0) {\n\t\t\t\tthis.horizontal = false;\n\t\t\t}\n\t\t}\n\t\treturn primaryHeadersWithKeys;\n\t}\n\n\tprivate createDataField(data: KoliBriTableDataType[], headers: KoliBriTableHeaders, isFoot?: boolean): (KoliBriTableCell & KoliBriTableDataType)[][] {\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.getPrimaryHeaders(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 || 0;\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: KoliBriTableHeaderCellWithLogic[] = [];\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\theaderCell: true,\n\t\t\t\t\t\t\tdata: {},\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 ? 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\tdata: row,\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\tdata: data[j],\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\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 handleSelectionChangeCallbackAndEvent(event: Event, payload: SelectionChangeEventPayload) {\n\t\tif (typeof this.state._on?.[Callback.onSelectionChange] === 'function') {\n\t\t\tthis.state._on[Callback.onSelectionChange](event, payload);\n\t\t}\n\t\tif (this.host) {\n\t\t\tdispatchDomEvent(this.host, KolEvent.selectionChange, payload);\n\t\t}\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateData(this._data);\n\t\tthis.validateDataFoot(this._dataFoot);\n\t\tthis.validateHeaderCells(this._headerCells);\n\t\tthis.validateLabel(this._label);\n\t\tthis.validateMinWidth(this._minWidth);\n\t\tthis.validateOn(this._on);\n\t\tthis.validateSelection(this._selection);\n\t}\n\n\t/**\n\t * Renders the selection cell for a row, either as a checkbox (for multiple selection)\n\t * or as a radio button (for single selection). It handles selection states and dispatches\n\t * events for selection changes.\n\t *\n\t * @param {KoliBriTableCell[]} row  The row data containing the cell with selection properties.\n\t * @param {number} rowIndex  The index of the row.\n\t * @returns {JSX.Element}  The rendered selection cell, either with a checkbox or radio input.\n\t */\n\tprivate renderSelectionCell(row: (KoliBriTableCell & KoliBriTableDataType)[], rowIndex: number): JSX.Element {\n\t\tconst selection = this.state._selection;\n\t\tif (!selection) return '';\n\t\tconst keyPropertyName = this.getSelectionKeyPropertyName();\n\t\tconst firstCellData = row[0]?.data;\n\n\t\tif (!firstCellData) return '';\n\t\tconst keyProperty = firstCellData[keyPropertyName] as string;\n\t\tconst isMultiple = selection.multiple || selection.multiple === undefined;\n\t\tconst selected = selection?.selectedKeys?.includes(keyProperty);\n\t\tconst disabled = selection?.disabledKeys?.includes(keyProperty);\n\t\tconst label = selection.label(firstCellData);\n\t\tconst props = {\n\t\t\tname: 'selection',\n\t\t\tchecked: selected,\n\t\t\tdisabled,\n\t\t\tid: keyProperty,\n\t\t\t['aria-label']: label,\n\t\t};\n\t\treturn (\n\t\t\t<td key={`tbody-${rowIndex}-selection`} class=\"kol-table__cell kol-table__cell--selection\">\n\t\t\t\t<div class={clsx('kol-table__selection', { 'kol-table__selection--checked': selected })}>\n\t\t\t\t\t{isMultiple ? (\n\t\t\t\t\t\t<label\n\t\t\t\t\t\t\tclass={clsx('kol-table__selection-label', {\n\t\t\t\t\t\t\t\t'kol-table__selection-label--disabled': disabled,\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<KolIconTag class=\"kol-table__selection-icon\" _icons={`codicon ${selected ? 'codicon-check' : ''}`} _label=\"\" />\n\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\tclass={clsx('kol-table__selection-input kol-table__selection-input--checkbox')}\n\t\t\t\t\t\t\t\tref={(el) => el && this.checkboxRefs.push(el)}\n\t\t\t\t\t\t\t\t{...props}\n\t\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\t\tonInput={(event: Event) => {\n\t\t\t\t\t\t\t\t\tconst updatedSelectedKeys = !selected\n\t\t\t\t\t\t\t\t\t\t? [...(selection?.selectedKeys ?? []), keyProperty]\n\t\t\t\t\t\t\t\t\t\t: selection?.selectedKeys?.filter((key) => key !== keyProperty);\n\t\t\t\t\t\t\t\t\tthis.handleSelectionChangeCallbackAndEvent(event, updatedSelectedKeys ?? []);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</label>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<label class=\"kol-table__selection-label\">\n\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\tclass={clsx('kol-table__selection-input kol-table__selection-input--radio')}\n\t\t\t\t\t\t\t\t{...props}\n\t\t\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\t\t\tonInput={(event: Event) => {\n\t\t\t\t\t\t\t\t\tthis.handleSelectionChangeCallbackAndEvent(event, keyProperty);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</label>\n\t\t\t\t\t)}\n\t\t\t\t\t<KolTooltipWcTag\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\tclass=\"kol-table__selection-input-tooltip\"\n\t\t\t\t\t\t_align=\"right\"\n\t\t\t\t\t\t_id={`${keyProperty}-label`}\n\t\t\t\t\t\t_label={label}\n\t\t\t\t\t></KolTooltipWcTag>\n\t\t\t\t</div>\n\t\t\t</td>\n\t\t);\n\t}\n\n\t/**\n\t * Renders a full table row by mapping over each cell and calling `renderTableCell`.\n\t * It also handles the row's unique key generation and selection functionality.\n\t *\n\t * @param {KoliBriTableCell[]} row  The data for the current row.\n\t * @param {number} rowIndex  The index of the current row being rendered.\n\t * @param isVertical\n\t * @param isFooter\n\t * @returns {JSX.Element}  The rendered row with its cells.\n\t */\n\tprivate readonly renderTableRow = (\n\t\trow: (KoliBriTableCell & KoliBriTableDataType)[],\n\t\trowIndex: number,\n\t\tisVertical: boolean,\n\t\tisFooter: boolean = false,\n\t): JSX.Element => {\n\t\tlet key = String(rowIndex);\n\t\tif (this.horizontal && row[0]?.data) {\n\t\t\tkey = this.getDataKey(row[0].data) ?? key;\n\t\t}\n\n\t\treturn (\n\t\t\t<tr\n\t\t\t\tclass={clsx('kol-table__row', {\n\t\t\t\t\t'kol-table__row--body': !isFooter,\n\t\t\t\t\t'kol-table__row--footer': isFooter,\n\t\t\t\t})}\n\t\t\t\tkey={`row-${key}`}\n\t\t\t>\n\t\t\t\t{this.renderSelectionCell(row, rowIndex)}\n\t\t\t\t{row.map((cell, colIndex) => this.renderTableCell(cell, rowIndex, colIndex, isVertical))}\n\t\t\t</tr>\n\t\t);\n\t};\n\n\t/**\n\t * Renders a table cell, either as a data cell (`<td>`) or a header cell (`<th>`).\n\t * If a custom `render` function is provided in the cell, it will be used to display content.\n\t *\n\t * @param {KoliBriTableCell} cell The cell data, containing label, colSpan, rowSpan, and potential render function.\n\t * @param {number} rowIndex  The current row index.\n\t * @param {number} colIndex  The current column index.\n\t * @returns {JSX.Element}  The rendered table cell (either `<td>` or `<th>`).\n\t */\n\tprivate readonly renderTableCell = (cell: KoliBriTableCell, rowIndex: number, colIndex: number, isVertical: boolean): JSX.Element => {\n\t\tlet key = `${rowIndex}-${colIndex}-${cell.label}`;\n\t\tif (cell.data) {\n\t\t\tconst dataKey = this.getDataKey(cell.data);\n\t\t\tkey = dataKey ? `${dataKey}-${this.horizontal ? colIndex : rowIndex}` : key;\n\t\t}\n\n\t\tif ((cell as KoliBriTableHeaderCellWithLogic).headerCell) {\n\t\t\treturn this.renderHeadingCell(cell, rowIndex, colIndex, isVertical);\n\t\t} else {\n\t\t\treturn (\n\t\t\t\t<td\n\t\t\t\t\tkey={`cell-${key}`}\n\t\t\t\t\tclass={clsx('kol-table__cell kol-table__cell--body', {\n\t\t\t\t\t\t[`kol-table__cell--align-${cell.textAlign}`]: cell.textAlign,\n\t\t\t\t\t})}\n\t\t\t\t\tcolSpan={cell.colSpan}\n\t\t\t\t\trowSpan={cell.rowSpan}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\ttextAlign: cell.textAlign,\n\t\t\t\t\t\twidth: cell.width,\n\t\t\t\t\t}}\n\t\t\t\t\tref={\n\t\t\t\t\t\ttypeof cell.render === 'function'\n\t\t\t\t\t\t\t? (el) => {\n\t\t\t\t\t\t\t\t\tthis.cellRender(cell as KoliBriTableHeaderCellWithLogic & { render: KoliBriTableRender }, el);\n\t\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>\n\t\t\t\t\t{typeof cell.render !== 'function' ? cell.label : ''}\n\t\t\t\t</td>\n\t\t\t);\n\t\t}\n\t};\n\n\tprivate getSelectionKeyPropertyName(): string {\n\t\treturn this.state._selection?.keyPropertyName ?? 'id';\n\t}\n\n\tprivate getDataWithSelectionEnabled() {\n\t\tconst keyPropertyName = this.getSelectionKeyPropertyName();\n\t\treturn this.state._data.filter((item) => !this.state._selection?.disabledKeys?.includes(item[keyPropertyName] as string));\n\t}\n\n\tprivate getSelectedKeysWithoutDisabledKeys() {\n\t\treturn this.state._selection?.selectedKeys?.filter((key) => !this.state._selection?.disabledKeys?.includes(key));\n\t}\n\n\tprivate getSelectedKeysWithDisabledKeysOnly() {\n\t\treturn this.state._selection?.selectedKeys?.filter((key) => this.state._selection?.disabledKeys?.includes(key));\n\t}\n\n\tprivate getRevertedSelection(selectAll: boolean) {\n\t\tconst keyPropertyName = this.getSelectionKeyPropertyName();\n\t\tconst selection = this.getSelectedKeysWithDisabledKeysOnly() ?? []; // Always include already selected, but disabled, rows.\n\n\t\tif (selectAll) {\n\t\t\tselection.push(...this.getDataWithSelectionEnabled().map((el) => el?.[keyPropertyName] as string)); // add all enabled rows\n\t\t}\n\n\t\treturn selection;\n\t}\n\n\t/**\n\t * Renders the header cell for row selection. This cell contains a checkbox for selecting\n\t * all rows when selection is enabled. If multiple selection is allowed, the checkbox allows\n\t * selecting/deselecting all rows at once. It also supports an indeterminate state\n\t * if only some rows are selected.\n\t *\n\t * @returns {JSX.Element} - The rendered header cell containing the selection checkbox.\n\t */\n\tprivate renderHeadingSelectionCell(): JSX.Element {\n\t\tconst selection = this.state._selection;\n\t\tif (!selection || (!selection.multiple && selection.multiple !== undefined))\n\t\t\treturn <th class=\"kol-table__cell kol-table__cell--header\" key={`thead-0`}></th>;\n\t\tconst selectedKeyLength = this.getSelectedKeysWithoutDisabledKeys()?.length ?? 0;\n\t\tconst dataLength = this.getDataWithSelectionEnabled().length;\n\t\tconst isChecked = selectedKeyLength === dataLength;\n\t\tconst indeterminate = selectedKeyLength !== 0 && !isChecked;\n\t\tlet translationKey = 'kol-table-selection-indeterminate' as TranslationKey;\n\t\tif (isChecked && !indeterminate) {\n\t\t\ttranslationKey = 'kol-table-selection-none';\n\t\t}\n\t\tif (selectedKeyLength === 0) {\n\t\t\ttranslationKey = 'kol-table-selection-all';\n\t\t}\n\t\tconst label = translate(translationKey);\n\t\treturn (\n\t\t\t<th key={`thead-0-selection`} class=\"kol-table__cell kol-table__cell--header\">\n\t\t\t\t<div\n\t\t\t\t\tclass={clsx('kol-table__selection', {\n\t\t\t\t\t\t'kol-table__selection--indeterminate': indeterminate,\n\t\t\t\t\t\t'kol-table__selection--checked': isChecked,\n\t\t\t\t\t})}\n\t\t\t\t>\n\t\t\t\t\t<label class=\"kol-table__selection-label\">\n\t\t\t\t\t\t<KolIconTag class=\"kol-table__selection-icon\" _icons={`codicon ${indeterminate ? 'codicon-remove' : isChecked ? 'codicon-check' : ''}`} _label=\"\" />\n\t\t\t\t\t\t<input\n\t\t\t\t\t\t\tclass={clsx('kol-table__selection-input kol-table__selection-input--checkbox')}\n\t\t\t\t\t\t\tdata-testid=\"selection-checkbox-all\"\n\t\t\t\t\t\t\tref={(el) => el && this.checkboxRefs.push(el)}\n\t\t\t\t\t\t\tname=\"selection\"\n\t\t\t\t\t\t\tchecked={isChecked && !indeterminate}\n\t\t\t\t\t\t\tindeterminate={indeterminate}\n\t\t\t\t\t\t\taria-label={label}\n\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\tonInput={(event: Event) => {\n\t\t\t\t\t\t\t\tthis.handleSelectionChangeCallbackAndEvent(event, this.getRevertedSelection(!isChecked));\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</label>\n\t\t\t\t\t<KolTooltipWcTag\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\tclass=\"kol-table__selection-input-tooltip\"\n\t\t\t\t\t\t_align=\"right\"\n\t\t\t\t\t\t_id={`${translationKey}-label`}\n\t\t\t\t\t\t_label={label}\n\t\t\t\t\t></KolTooltipWcTag>\n\t\t\t\t</div>\n\t\t\t</th>\n\t\t);\n\t}\n\n\t/**\n\t * This header cell is rendered as a TD element when in addition to the horizontal header rows\n\t * there are also vertical header columns. In this case, the cell is rendered blank above the\n\t * vertical header columns.\n\t */\n\tprivate renderHeaderTdCell(): JSX.Element {\n\t\treturn (\n\t\t\t<Fragment>\n\t\t\t\t{Array.isArray(this.state._headerCells.horizontal) &&\n\t\t\t\t\tthis.state._headerCells.horizontal.length > 0 &&\n\t\t\t\t\tArray.isArray(this.state._headerCells.vertical) &&\n\t\t\t\t\tthis.state._headerCells.vertical.length > 0 &&\n\t\t\t\t\tArray.isArray(this.state._headerCells.horizontal) && (\n\t\t\t\t\t\t<td aria-hidden=\"true\" colSpan={this.state._headerCells.vertical.length} rowSpan={this.state._headerCells.horizontal.length}></td>\n\t\t\t\t\t)}\n\t\t\t</Fragment>\n\t\t);\n\t}\n\n\t/**\n\t *  Renders a table header cell (`<th>`), with optional sorting functionality.\n\t *  If the cell has a `sortDirection` property, a sort button is rendered within the header.\n\t *\n\t * @param {KoliBriTableHeaderCell} cell  The header cell data, containing label, colSpan, rowSpan, and possible sort direction.\n\t * @param {number} rowIndex  The index of the current row in the table.\n\t * @param {number} colIndex  The index of the current column in the row.\n\t * @returns {JSX.Element}  The rendered header cell with possible sorting controls.\n\t */\n\tprivate renderHeadingCell(cell: KoliBriTableHeaderCell, rowIndex: number, colIndex: number, isVertical: boolean): JSX.Element {\n\t\tlet ariaSort = undefined;\n\t\tlet sortButtonIcon = 'codicon codicon-fold';\n\n\t\tif (cell.sortDirection) {\n\t\t\tswitch (cell.sortDirection) {\n\t\t\t\tcase 'ASC':\n\t\t\t\t\tsortButtonIcon = 'codicon codicon-chevron-up';\n\t\t\t\t\tariaSort = 'ascending';\n\t\t\t\t\tbreak;\n\t\t\t\tcase 'DESC':\n\t\t\t\t\tsortButtonIcon = 'codicon codicon-chevron-down';\n\t\t\t\t\tariaSort = 'descending';\n\t\t\t\t\tbreak;\n\t\t\t}\n\t\t}\n\n\t\tconst scope = isVertical ? 'row' : typeof cell.colSpan === 'number' && cell.colSpan > 1 ? 'colgroup' : 'col';\n\n\t\treturn (\n\t\t\t<th\n\t\t\t\tkey={`${rowIndex}-${colIndex}-${cell.label}`}\n\t\t\t\tclass={clsx('kol-table__cell kol-table__cell--header', {\n\t\t\t\t\t[`kol-table__cell--align-${cell.textAlign}`]: cell.textAlign,\n\t\t\t\t\t[`kol-table__cell--${ariaSort}`]: ariaSort,\n\t\t\t\t})}\n\t\t\t\tscope={scope}\n\t\t\t\tcolSpan={cell.colSpan}\n\t\t\t\trowSpan={cell.rowSpan}\n\t\t\t\tstyle={{\n\t\t\t\t\twidth: cell.width,\n\t\t\t\t}}\n\t\t\t\taria-sort={ariaSort}\n\t\t\t\tdata-sort={`sort-${cell.sortDirection}`}\n\t\t\t>\n\t\t\t\t{cell.sortDirection ? (\n\t\t\t\t\t<KolButtonWcTag\n\t\t\t\t\t\tclass=\"kol-table__sort-button\"\n\t\t\t\t\t\texportparts=\"icon\"\n\t\t\t\t\t\t_icons={{ right: sortButtonIcon }}\n\t\t\t\t\t\t_label={cell.label}\n\t\t\t\t\t\t_on={{\n\t\t\t\t\t\t\tonClick: (event: MouseEvent) => {\n\t\t\t\t\t\t\t\tif (typeof this.state._on?.onSort === 'function' && cell.key && cell.sortDirection) {\n\t\t\t\t\t\t\t\t\tthis.state._on.onSort(event, {\n\t\t\t\t\t\t\t\t\t\tkey: cell.key,\n\t\t\t\t\t\t\t\t\t\tcurrentSortDirection: 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\tif (this.host) {\n\t\t\t\t\t\t\t\t\tdispatchDomEvent(this.host, KolEvent.sort, {\n\t\t\t\t\t\t\t\t\t\tkey: cell.key,\n\t\t\t\t\t\t\t\t\t\tcurrentSortDirection: 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}}\n\t\t\t\t\t></KolButtonWcTag>\n\t\t\t\t) : (\n\t\t\t\t\tcell.label\n\t\t\t\t)}\n\t\t\t</th>\n\t\t);\n\t}\n\n\tprivate renderSpacer(variant: 'foot' | 'head', cellDefs: KoliBriTableHeaderCell[][] | KoliBriTableCell[][]): JSX.Element {\n\t\tconst verticalHeaderColpan = this.state._headerCells.vertical?.length || 0;\n\t\tconst colspan = cellDefs?.[0]?.reduce((acc, row) => acc + (row.colSpan || 1), 0);\n\t\tconst selectionCell = this.state._selection ? 1 : 0;\n\n\t\treturn (\n\t\t\t<tr aria-hidden=\"true\" class={clsx('kol-table__spacer', `kol-table__spacer--${variant}`)}>\n\t\t\t\t<td class={clsx(`kol-table__spacer-line kol-table__spacer-line--${variant}`)} colSpan={verticalHeaderColpan + colspan + selectionCell}></td>\n\t\t\t</tr>\n\t\t);\n\t}\n\n\tprivate renderFoot(): JSX.Element[] | null {\n\t\tif (!this.state._dataFoot || this.state._dataFoot.length === 0) {\n\t\t\treturn null;\n\t\t}\n\n\t\tconst rows: KoliBriTableCell[][] = this.createDataField(this.state._dataFoot, this.state._headerCells, true);\n\t\treturn (\n\t\t\t<tfoot class=\"kol-table__footer\">\n\t\t\t\t{[\n\t\t\t\t\tthis.renderSpacer('foot', rows),\n\t\t\t\t\trows.map((row: (KoliBriTableCell & KoliBriTableDataType)[], rowIndex: number) => this.renderTableRow(row, rowIndex, true, true)),\n\t\t\t\t]}\n\t\t\t</tfoot>\n\t\t);\n\t}\n\n\tpublic render(): JSX.Element {\n\t\tconst dataField = this.createDataField(this.state._data, this.state._headerCells);\n\t\tthis.checkboxRefs = [];\n\n\t\treturn (\n\t\t\t/* Firefox automatically makes the following div focusable when it has a scrollbar. We implement a similar behavior cross-browser by allowing the\n\t\t\t * <div class=\"focus-element\"> to receive focus. Hence, we disable focus for the div to avoid having two focusable elements by setting `tabindex=\"-1\"`\n\t\t\t */\n\t\t\t/* eslint-disable-next-line jsx-a11y/no-static-element-interactions */\n\t\t\t<div ref={(element) => (this.tableDivElement = element)} class=\"kol-table\" tabindex={this.tableDivElementHasScrollbar ? '-1' : undefined}>\n\t\t\t\t<table\n\t\t\t\t\tclass=\"kol-table__table\"\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tminWidth: this.state._minWidth,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{/*\n\t\t\t\t\t * The following element allows the table to receive focus without providing redundant content to screen readers.\n\t\t\t\t\t * The `div` is technically not allowed here. But any allowed element would mutate the table semantics. Additionally, the `&nbsp;` is necessary to\n\t\t\t\t\t * prevent screen readers from just reading \"blank\".\n\t\t\t\t\t */}\n\t\t\t\t\t{/* eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex */}\n\t\t\t\t\t<div class=\"kol-table__focus-element\" tabindex={this.tableDivElementHasScrollbar ? '0' : undefined} aria-describedby=\"caption\">\n\t\t\t\t\t\t&nbsp;\n\t\t\t\t\t</div>\n\n\t\t\t\t\t<caption class=\"kol-table__caption\" id=\"caption\">\n\t\t\t\t\t\t{this.state._label}\n\t\t\t\t\t</caption>\n\n\t\t\t\t\t{Array.isArray(this.state._headerCells.horizontal) && (\n\t\t\t\t\t\t<thead class=\"kol-table__head\">\n\t\t\t\t\t\t\t{[\n\t\t\t\t\t\t\t\tthis.state._headerCells.horizontal.map((cols, rowIndex) => (\n\t\t\t\t\t\t\t\t\t<tr class=\"kol-table__head-row\" key={`thead-${rowIndex}`}>\n\t\t\t\t\t\t\t\t\t\t{this.state._selection && this.renderHeadingSelectionCell()}\n\t\t\t\t\t\t\t\t\t\t{rowIndex === 0 && this.renderHeaderTdCell()}\n\t\t\t\t\t\t\t\t\t\t{Array.isArray(cols) && cols.map((cell, colIndex) => this.renderHeadingCell(cell, rowIndex, colIndex, false))}\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\tthis.renderSpacer('head', this.state._headerCells.horizontal),\n\t\t\t\t\t\t\t]}\n\t\t\t\t\t\t</thead>\n\t\t\t\t\t)}\n\t\t\t\t\t<tbody class=\"kol-table__body\">\n\t\t\t\t\t\t{dataField.map((row: (KoliBriTableCell & KoliBriTableDataType)[], rowIndex: number) => this.renderTableRow(row, rowIndex, true))}\n\t\t\t\t\t</tbody>\n\t\t\t\t\t{this.renderFoot()}\n\t\t\t\t</table>\n\t\t\t</div>\n\t\t);\n\t}\n}\n"],"mappings":"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","ignoreList":[]}

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

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{r as n,h as e}from"./index-2ae1c631.js";import{l as t}from"./component-names-a18a51c8.js";const o="/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n  :host {\n    /*\n     * Minimum size of interactive elements.\n     */\n    --a11y-min-size: calc(44rem / var(--kolibri-root-font-size, 16));\n    /*\n     * No element should be used without a background and font color whose contrast ratio has\n     * not been checked. By initially setting the background color to white and the font color\n     * to black, the contrast ratio is ensured and explicit adjustment is forced.\n     */\n    background-color: white;\n    color: black;\n    /*\n     * Verdana is an accessible font that can be used without requiring additional loading time.\n     */\n    font-family: Verdana;\n  }\n  * {\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    hyphens: auto;\n    /*\n     * Letter spacing is required for all texts.\n     */\n    letter-spacing: inherit;\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    word-break: break-word;\n    /*\n     * Word spacing is required for all texts.\n     */\n    word-spacing: inherit;\n  }\n  /*\n   * All interactive elements should have a minimum size of rem(44).\n   */\n  /* input:not([type='checkbox'], [type='radio'], [type='range']), */\n  /* option, */\n  /* select, */\n  /* textarea, */\n  [role=button],\n  button:not([role=link]) {\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\n  }\n}\n/**\n * Sometimes we need the semantic element for accessibility reasons,\n * but we don't want to show it.\n *\n * - https://www.a11yproject.com/posts/how-to-hide-content/\n */\n.visually-hidden {\n  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  height: calc(1rem / var(--kolibri-root-font-size, 16));\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: calc(1rem / var(--kolibri-root-font-size, 16));\n}\n\n@layer kol-global {\n  /*\n   * Dieses CSS stellt sicher, dass der Standard-Style\n   * von A und Button resettet werden.\n   */\n  :is(a, button) {\n    background-color: transparent;\n    border: none;\n    margin: 0;\n    padding: 0;\n    width: 100%; /* 100% needed for custom width from outside */\n  }\n  /*\n   * Ensure elements with hidden attribute to be actually not visible\n   * @see https://meowni.ca/hidden.is.a.lie.html\n   */\n  [hidden] {\n    display: none !important;\n  }\n}\n@layer kol-global {\n  :host {\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: grid;\n    place-items: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\n    display: none;\n  }\n  /* Reset browser agent style. */\n  button:disabled {\n    color: unset;\n  }\n  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled],\n  [disabled]:focus {\n    cursor: not-allowed;\n    opacity: 0.5;\n    outline: none;\n  }\n  [aria-disabled=true]:focus .kol-span,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n}\n@layer kol-component {\n  :host {\n    display: block;\n  }\n}\n@layer kol-component {\n  :host {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-tooltip {\n    display: contents;\n  }\n  .kol-tooltip__floating {\n    animation-duration: 0.5s;\n    animation-iteration-count: 1;\n    animation-name: fadeInOpacity;\n    animation-timing-function: ease-in;\n    box-sizing: border-box;\n    display: none;\n    position: fixed;\n    visibility: hidden;\n    /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */\n    top: 0;\n    left: 0;\n    max-width: 90vw;\n    max-height: 90vh;\n    /* Can be used to specify the tooltip-width from the outside. Unset by default.  */\n    width: var(--kol-tooltip-width);\n  }\n  .kol-tooltip__arrow {\n    background-color: #fff;\n    color: #000;\n    height: calc(10rem / var(--kolibri-root-font-size, 16));\n    position: absolute;\n    transform: rotate(45deg);\n    width: calc(10rem / var(--kolibri-root-font-size, 16));\n    z-index: 999;\n  }\n  .kol-tooltip__content {\n    background-color: #fff;\n    color: #000;\n    position: relative;\n    z-index: 1000;\n  }\n  @keyframes fadeInOpacity {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n}\n@layer kol-component {\n  :host {\n    display: block;\n  }\n}\n@layer kol-component {\n  .kol-table {\n    display: block;\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n    max-width: 100%;\n    overflow-x: auto;\n    overflow-y: hidden;\n  }\n  .kol-table__table {\n    width: 100%;\n  }\n  .kol-table__caption {\n    text-align: start;\n  }\n  .kol-table__focus-element {\n    font-size: 0;\n  }\n  .kol-table__focus-element:focus {\n    outline: 0 !important;\n    /* @see https://remysharp.com/til/css/focus-ring-default-styles */\n    outline: calc(5rem / var(--kolibri-root-font-size, 16)) auto Highlight;\n    outline: calc(5rem / var(--kolibri-root-font-size, 16)) auto -webkit-focus-ring-color;\n    outline-offset: calc(2rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-table__sort-button .kol-button {\n    color: inherit;\n  }\n  .kol-table__body {\n    text-align: left;\n  }\n  .kol-table__body .kol-button__text {\n    justify-items: start;\n  }\n  .kol-table__cell--align-left {\n    text-align: left;\n  }\n  .kol-table__cell--align-left .kol-button__text {\n    justify-items: start;\n  }\n  .kol-table__cell--align-center {\n    text-align: center;\n  }\n  .kol-table__cell--align-center .kol-button__text {\n    justify-items: center;\n  }\n  .kol-table__cell--align-right {\n    text-align: right;\n  }\n  .kol-table__cell--align-right .kol-button__text {\n    justify-items: end;\n  }\n  .kol-table__cell--selection {\n    width: var(--a11y-min-size);\n    height: var(--a11y-min-size);\n    white-space: nowrap;\n  }\n  .kol-table__spacer {\n    display: none;\n  }\n  .kol-table__selection-label {\n    align-items: center;\n    cursor: pointer;\n    display: flex;\n    height: var(--a11y-min-size);\n    justify-content: center;\n    position: relative;\n    width: var(--a11y-min-size);\n  }\n  .kol-table__selection-icon {\n    display: block;\n    inset: auto;\n    position: absolute;\n    z-index: 1;\n  }\n  .kol-table__selection-input {\n    appearance: none;\n    border-style: solid;\n    cursor: pointer;\n    margin: 0;\n  }\n  .kol-table__selection-input:before {\n    content: \"\";\n  }\n  .kol-table__selection-input--checkbox {\n    position: relative;\n    display: flex;\n    height: calc(var(--a11y-min-size) / 2);\n    width: calc(var(--a11y-min-size) / 2);\n    align-items: center;\n    justify-content: center;\n    background-color: rgb(255, 255, 255);\n    border-width: calc(2rem / var(--kolibri-root-font-size, 16));\n    line-height: 1.5;\n    transition: all 0.5s ease 0s;\n  }\n  .kol-table__selection-input--radio {\n    display: flex;\n    border-width: calc(2rem / var(--kolibri-root-font-size, 16));\n    border-radius: 100%;\n    height: 1.5em;\n    min-height: 1.5em;\n    min-width: 1.5em;\n    padding: 0;\n    width: 1.5em;\n  }\n  .kol-table__selection-input--radio:before {\n    border-radius: 100%;\n    margin: auto;\n    height: 0.75em;\n    width: 0.75em;\n  }\n  .kol-table__selection-input--radio:checked:before {\n    background-color: #000;\n  }\n  @media (forced-colors: active) {\n    .kol-table__selection-input--radio:checked:before {\n      /* Give it a visible background in forced colors mode */\n      background-color: selectedItem !important;\n    }\n  }\n}",i=o,l=class{constructor(e){n(this,e),this._data=void 0,this._dataFoot=void 0,this._headerCells=void 0,this._label=void 0,this._minWidth=void 0,this._on=void 0,this._selection=void 0}render(){return e(t,{key:"048855cd40a5b65261de66ea0ef42be89f37557e",_data:this._data,_dataFoot:this._dataFoot,_headerCells:this._headerCells,_label:this._label,_minWidth:this._minWidth,_on:this._on,_selection:this._selection})}};l.style={default:i};export{l as kol_table_stateless};
+import{r as n,h as e}from"./index-dd9ee649.js";import{m as t}from"./component-names-545d6582.js";const o="/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n  :host {\n    /*\n     * Minimum size of interactive elements.\n     */\n    --a11y-min-size: calc(44rem / var(--kolibri-root-font-size, 16));\n    /*\n     * No element should be used without a background and font color whose contrast ratio has\n     * not been checked. By initially setting the background color to white and the font color\n     * to black, the contrast ratio is ensured and explicit adjustment is forced.\n     */\n    background-color: white;\n    color: black;\n    /*\n     * Verdana is an accessible font that can be used without requiring additional loading time.\n     */\n    font-family: Verdana;\n  }\n  * {\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    hyphens: auto;\n    /*\n     * Letter spacing is required for all texts.\n     */\n    letter-spacing: inherit;\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    word-break: break-word;\n    /*\n     * Word spacing is required for all texts.\n     */\n    word-spacing: inherit;\n  }\n  /*\n   * All interactive elements should have a minimum size of rem(44).\n   */\n  /* input:not([type='checkbox'], [type='radio'], [type='range']), */\n  /* option, */\n  /* select, */\n  /* textarea, */\n  [role=button],\n  button:not([role=link]) {\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\n  }\n}\n/**\n * Sometimes we need the semantic element for accessibility reasons,\n * but we don't want to show it.\n *\n * - https://www.a11yproject.com/posts/how-to-hide-content/\n */\n.visually-hidden {\n  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  height: calc(1rem / var(--kolibri-root-font-size, 16));\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: calc(1rem / var(--kolibri-root-font-size, 16));\n}\n\n@layer kol-global {\n  /*\n   * Dieses CSS stellt sicher, dass der Standard-Style\n   * von A und Button resettet werden.\n   */\n  :is(a, button) {\n    background-color: transparent;\n    border: none;\n    margin: 0;\n    padding: 0;\n    width: 100%; /* 100% needed for custom width from outside */\n  }\n  /*\n   * Ensure elements with hidden attribute to be actually not visible\n   * @see https://meowni.ca/hidden.is.a.lie.html\n   */\n  [hidden] {\n    display: none !important;\n  }\n}\n@layer kol-global {\n  :host {\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: grid;\n    place-items: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\n    display: none;\n  }\n  /* Reset browser agent style. */\n  button:disabled {\n    color: unset;\n  }\n  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled],\n  [disabled]:focus {\n    cursor: not-allowed;\n    opacity: 0.5;\n    outline: none;\n  }\n  [aria-disabled=true]:focus .kol-span,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n}\n@layer kol-component {\n  :host {\n    display: block;\n  }\n}\n@layer kol-component {\n  :host {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-tooltip {\n    display: contents;\n  }\n  .kol-tooltip__floating {\n    animation-duration: 0.25s;\n    animation-iteration-count: 1;\n    animation-name: fadeInOpacity;\n    animation-timing-function: ease-in;\n    box-sizing: border-box;\n    display: none;\n    position: fixed;\n    visibility: hidden;\n    /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */\n    top: 0;\n    left: 0;\n    max-width: 90vw;\n    max-height: 90vh;\n    /* Can be used to specify the tooltip-width from the outside. Unset by default.  */\n    width: var(--kol-tooltip-width);\n  }\n  .kol-tooltip__arrow {\n    background-color: #fff;\n    color: #000;\n    height: calc(10rem / var(--kolibri-root-font-size, 16));\n    position: absolute;\n    transform: rotate(45deg);\n    width: calc(10rem / var(--kolibri-root-font-size, 16));\n    z-index: 999;\n  }\n  .kol-tooltip__content {\n    background-color: #fff;\n    color: #000;\n    position: relative;\n    z-index: 1000;\n  }\n  @keyframes fadeInOpacity {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n}\n@layer kol-component {\n  .kol-table {\n    display: block;\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n    max-width: 100%;\n    overflow-x: auto;\n    overflow-y: hidden;\n  }\n  .kol-table__table {\n    width: 100%;\n  }\n  .kol-table__caption {\n    text-align: start;\n  }\n  .kol-table__focus-element {\n    font-size: 0;\n  }\n  .kol-table__focus-element:focus {\n    outline: 0 !important;\n    /* @see https://remysharp.com/til/css/focus-ring-default-styles */\n    outline: 5px auto Highlight;\n    outline: 5px auto -webkit-focus-ring-color;\n    outline-offset: 2px;\n  }\n  .kol-table__sort-button .kol-button {\n    color: inherit;\n  }\n  .kol-table__body {\n    text-align: left;\n  }\n  .kol-table__body .kol-button__text {\n    justify-items: start;\n  }\n  .kol-table__cell--align-left {\n    text-align: left;\n  }\n  .kol-table__cell--align-left .kol-button__text {\n    justify-items: start;\n  }\n  .kol-table__cell--align-center {\n    text-align: center;\n  }\n  .kol-table__cell--align-center .kol-button__text {\n    justify-items: center;\n  }\n  .kol-table__cell--align-right {\n    text-align: right;\n  }\n  .kol-table__cell--align-right .kol-button__text {\n    justify-items: end;\n  }\n  .kol-table__cell--selection {\n    width: var(--a11y-min-size);\n    height: var(--a11y-min-size);\n    white-space: nowrap;\n  }\n  .kol-table__spacer {\n    display: none;\n  }\n  .kol-table__selection-label {\n    align-items: center;\n    cursor: pointer;\n    display: flex;\n    height: var(--a11y-min-size);\n    justify-content: center;\n    position: relative;\n    width: var(--a11y-min-size);\n  }\n  .kol-table__selection-label--disabled {\n    cursor: not-allowed;\n  }\n  .kol-table__selection-icon {\n    display: block;\n    inset: auto;\n    position: absolute;\n    z-index: 1;\n  }\n  .kol-table__selection-input {\n    appearance: none;\n    border-style: solid;\n    cursor: pointer;\n    margin: 0;\n  }\n  .kol-table__selection-input:disabled {\n    cursor: not-allowed;\n  }\n  .kol-table__selection-input:before {\n    content: \"\";\n  }\n  .kol-table__selection-input--checkbox {\n    position: relative;\n    display: flex;\n    height: calc(var(--a11y-min-size) / 2);\n    width: calc(var(--a11y-min-size) / 2);\n    align-items: center;\n    justify-content: center;\n    background-color: rgb(255, 255, 255);\n    border-width: 2px;\n    line-height: 1.5;\n    transition: all 0.5s ease 0s;\n  }\n  .kol-table__selection-input--radio {\n    display: flex;\n    border-width: 2px;\n    border-radius: 100%;\n    height: 1.5em;\n    min-height: 1.5em;\n    min-width: 1.5em;\n    padding: 0;\n    width: 1.5em;\n  }\n  .kol-table__selection-input--radio:before {\n    border-radius: 100%;\n    margin: auto;\n    height: 0.75em;\n    width: 0.75em;\n  }\n  .kol-table__selection-input--radio:checked:before {\n    background-color: #000;\n  }\n  @media (forced-colors: active) {\n    .kol-table__selection-input--radio:checked:before {\n      /* Give it a visible background in forced colors mode */\n      background-color: selectedItem !important;\n    }\n  }\n}",i=o,l=class{constructor(e){n(this,e),this._data=void 0,this._dataFoot=void 0,this._headerCells=void 0,this._label=void 0,this._minWidth=void 0,this._on=void 0,this._selection=void 0}render(){return e(t,{key:"eb182937b833b381bd5bcdaa991456dd13d1e1a7",_data:this._data,_dataFoot:this._dataFoot,_headerCells:this._headerCells,_label:this._label,_minWidth:this._minWidth,_on:this._on,_selection:this._selection})}};l.style={default:i};export{l as kol_table_stateless};

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

@@ -1 +1 @@
-{"version":3,"names":["defaultStyleCss","KolTableStatelessDefaultStyle0","KolTableStateless","render","h","KolTableStatelessWcTag","key","_data","this","_dataFoot","_headerCells","_label","_minWidth","_on","_selection"],"sources":["src/components/table-stateless/style.scss?tag=kol-table-stateless&mode=default&encapsulation=shadow","src/components/table-stateless/shadow.tsx"],"sourcesContent":["@import '../@shared/mixins';\n@import '../../styles/global';\n@import '../@shared/kol-table-stateless-mixin';\n@import '../host-display-block';\n\n@include kol-table-stateless-styles;\n","import type { JSX } from '@stencil/core';\nimport { Component, h, Prop } from '@stencil/core';\nimport { KolTableStatelessWcTag } from '../../core/component-names';\nimport type {\n\tTableCallbacksPropType,\n\tTableDataFootPropType,\n\tTableDataPropType,\n\tTableHeaderCellsPropType,\n\tTableSelectionPropType,\n\tTableStatelessProps,\n} from '../../schema';\nimport type { MinWidthPropType } from '../../schema/props/min-width';\n\n@Component({\n\ttag: 'kol-table-stateless',\n\tstyleUrls: {\n\t\tdefault: './style.scss',\n\t},\n\tshadow: true,\n})\nexport class KolTableStateless implements TableStatelessProps {\n\t/**\n\t * Defines the primary table data.\n\t */\n\t@Prop() public _data!: TableDataPropType;\n\n\t/**\n\t * Defines the data for the table footer.\n\t */\n\t@Prop() public _dataFoot?: TableDataFootPropType;\n\n\t/**\n\t * Defines the horizontal and vertical table headers.\n\t */\n\t@Prop() public _headerCells!: TableHeaderCellsPropType;\n\n\t/**\n\t * Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.).\n\t */\n\t@Prop() public _label!: string;\n\n\t/**\n\t * Defines the table min-width (CSS width values).\n\t */\n\t@Prop() public _minWidth!: MinWidthPropType;\n\n\t/**\n\t * Defines the callback functions for table events.\n\t */\n\t@Prop() public _on?: TableCallbacksPropType;\n\n\t/**\n\t * Defines how rows can be selected and the current selection.\n\t */\n\t@Prop() public _selection?: TableSelectionPropType;\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<KolTableStatelessWcTag\n\t\t\t\t_data={this._data}\n\t\t\t\t_dataFoot={this._dataFoot}\n\t\t\t\t_headerCells={this._headerCells}\n\t\t\t\t_label={this._label}\n\t\t\t\t_minWidth={this._minWidth}\n\t\t\t\t_on={this._on}\n\t\t\t\t_selection={this._selection}\n\t\t\t/>\n\t\t);\n\t}\n}\n"],"mappings":";;;iGAAA,MAAMA,EAAkB,qgRACxB,MAAAC,EAAeD,E,MCmBFE,EAAiB,M,+LAoCtB,MAAAC,GACN,OACCC,EAACC,EAAsB,CAAAC,IAAA,2CACtBC,MAAOC,KAAKD,MACZE,UAAWD,KAAKC,UAChBC,aAAcF,KAAKE,aACnBC,OAAQH,KAAKG,OACbC,UAAWJ,KAAKI,UAChBC,IAAKL,KAAKK,IACVC,WAAYN,KAAKM,Y","ignoreList":[]}
+{"version":3,"names":["defaultStyleCss","KolTableStatelessDefaultStyle0","KolTableStateless","render","h","KolTableStatelessWcTag","key","_data","this","_dataFoot","_headerCells","_label","_minWidth","_on","_selection"],"sources":["src/components/table-stateless/style.scss?tag=kol-table-stateless&mode=default&encapsulation=shadow","src/components/table-stateless/shadow.tsx"],"sourcesContent":["@use '../@shared/mixins' as *;\n@use '../../styles/global' as *;\n@use '../@shared/kol-table-stateless-mixin' as *;\n@use '../host-display-block' as *;\n\n@include kol-table-stateless-styles;\n","import type { JSX } from '@stencil/core';\nimport { Component, h, Prop } from '@stencil/core';\nimport { KolTableStatelessWcTag } from '../../core/component-names';\nimport type {\n\tTableCallbacksPropType,\n\tTableDataFootPropType,\n\tTableDataPropType,\n\tTableHeaderCellsPropType,\n\tTableSelectionPropType,\n\tTableStatelessProps,\n} from '../../schema';\nimport type { MinWidthPropType } from '../../schema/props/min-width';\n\n@Component({\n\ttag: 'kol-table-stateless',\n\tstyleUrls: {\n\t\tdefault: './style.scss',\n\t},\n\tshadow: true,\n})\nexport class KolTableStateless implements TableStatelessProps {\n\t/**\n\t * Defines the primary table data.\n\t */\n\t@Prop() public _data!: TableDataPropType;\n\n\t/**\n\t * Defines the data for the table footer.\n\t */\n\t@Prop() public _dataFoot?: TableDataFootPropType;\n\n\t/**\n\t * Defines the horizontal and vertical table headers.\n\t */\n\t@Prop() public _headerCells!: TableHeaderCellsPropType;\n\n\t/**\n\t * Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.).\n\t */\n\t@Prop() public _label!: string;\n\n\t/**\n\t * Defines the table min-width (CSS width values).\n\t */\n\t@Prop() public _minWidth!: MinWidthPropType;\n\n\t/**\n\t * Defines the callback functions for table events.\n\t */\n\t@Prop() public _on?: TableCallbacksPropType;\n\n\t/**\n\t * Defines how rows can be selected and the current selection.\n\t */\n\t@Prop() public _selection?: TableSelectionPropType;\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<KolTableStatelessWcTag\n\t\t\t\t_data={this._data}\n\t\t\t\t_dataFoot={this._dataFoot}\n\t\t\t\t_headerCells={this._headerCells}\n\t\t\t\t_label={this._label}\n\t\t\t\t_minWidth={this._minWidth}\n\t\t\t\t_on={this._on}\n\t\t\t\t_selection={this._selection}\n\t\t\t/>\n\t\t);\n\t}\n}\n"],"mappings":";;;iGAAA,MAAMA,EAAkB,k4QACxB,MAAAC,EAAeD,E,MCmBFE,EAAiB,M,+LAoCtB,MAAAC,GACN,OACCC,EAACC,EAAsB,CAAAC,IAAA,2CACtBC,MAAOC,KAAKD,MACZE,UAAWD,KAAKC,UAChBC,aAAcF,KAAKE,aACnBC,OAAQH,KAAKG,OACbC,UAAWJ,KAAKI,UAChBC,IAAKL,KAAKK,IACVC,WAAYN,KAAKM,Y","ignoreList":[]}