@public-ui/components
Version:
Contains all web components that belong to KoliBri - The accessible HTML-Standard.
300 lines (299 loc) • 12.2 kB
JavaScript
/*!
* KoliBri - The accessible HTML-Standard
*/
import { h } from "@stencil/core";
import { KolTableStatelessWcTag } from "../../core/component-names";
import { validateAriaLabelledby } from "../../schema/props/aria-labelledby";
import { attachInternals } from "../../utils/aria-labelledby";
export class KolTableStateless {
constructor() {
this.resolvedElements = [];
}
validateAriaLabelledby(value) {
this.syncExternalLabel(value);
}
syncExternalLabel(value) {
this.resolvedElements = validateAriaLabelledby(this, this.host, this.internals, value);
}
componentWillLoad() {
this.internals = attachInternals(this.host);
this.syncExternalLabel(this._ariaLabelledby);
}
componentDidLoad() {
if (!this.resolvedElements.length) {
this.syncExternalLabel(this._ariaLabelledby);
}
}
render() {
return (h(KolTableStatelessWcTag, { key: '7115f32bb9375fc5d4158bef05eded091fa77091', externalLabelElements: this.resolvedElements, _data: this._data, _dataFoot: this._dataFoot, _fixedCols: this._fixedCols, _headerCells: this._headerCells, _label: this._label, _on: this._on, _selection: this._selection, _hasSettingsMenu: this._hasSettingsMenu, _variant: this._variant }));
}
static get is() { return "kol-table-stateless"; }
static get encapsulation() { return "shadow"; }
static get originalStyleUrls() {
return {
"default": ["./style.scss"]
};
}
static get styleUrls() {
return {
"default": ["style.css"]
};
}
static get properties() {
return {
"_ariaLabelledby": {
"type": "string",
"mutable": false,
"complexType": {
"original": "AriaLabelledbyPropType",
"resolved": "string | undefined",
"references": {
"AriaLabelledbyPropType": {
"location": "import",
"path": "../../schema/props/aria-labelledby",
"id": "src/schema/props/aria-labelledby.ts::AriaLabelledbyPropType"
}
}
},
"required": false,
"optional": true,
"docs": {
"tags": [],
"text": "References an external element by ID that serves as the accessible label for this table.\nUses ElementInternals.ariaLabelledByElements to cross the Shadow DOM boundary.\nSupported by desktop screen readers (NVDA, JAWS with Chrome/Firefox).\nNot yet supported by mobile screen readers (TalkBack, VoiceOver iOS) \u2014 use `_label` instead."
},
"getter": false,
"setter": false,
"reflect": false,
"attribute": "_aria-labelledby"
},
"_data": {
"type": "string",
"mutable": false,
"complexType": {
"original": "TableDataPropType",
"resolved": "KoliBriTableDataType[] | string",
"references": {
"TableDataPropType": {
"location": "import",
"path": "../../schema",
"id": "src/schema/index.ts::TableDataPropType"
}
}
},
"required": true,
"optional": false,
"docs": {
"tags": [],
"text": "Defines the primary table data."
},
"getter": false,
"setter": false,
"reflect": false,
"attribute": "_data"
},
"_dataFoot": {
"type": "string",
"mutable": false,
"complexType": {
"original": "TableDataFootPropType",
"resolved": "KoliBriTableDataType[] | string | undefined",
"references": {
"TableDataFootPropType": {
"location": "import",
"path": "../../schema",
"id": "src/schema/index.ts::TableDataFootPropType"
}
}
},
"required": false,
"optional": true,
"docs": {
"tags": [],
"text": "Defines the data for the table footer."
},
"getter": false,
"setter": false,
"reflect": false,
"attribute": "_data-foot"
},
"_fixedCols": {
"type": "unknown",
"mutable": false,
"complexType": {
"original": "FixedColsPropType",
"resolved": "[number, number] | undefined",
"references": {
"FixedColsPropType": {
"location": "import",
"path": "../../schema",
"id": "src/schema/index.ts::FixedColsPropType"
}
}
},
"required": false,
"optional": true,
"docs": {
"tags": [],
"text": "Defines the fixed number of columns from start and end of the table"
},
"getter": false,
"setter": false
},
"_headerCells": {
"type": "string",
"mutable": false,
"complexType": {
"original": "TableHeaderCellsPropType",
"resolved": "string | { horizontal?: KoliBriTableHeaderCell[][] | undefined; vertical?: KoliBriTableHeaderCell[][] | undefined; }",
"references": {
"TableHeaderCellsPropType": {
"location": "import",
"path": "../../schema",
"id": "src/schema/index.ts::TableHeaderCellsPropType"
}
}
},
"required": true,
"optional": false,
"docs": {
"tags": [],
"text": "Defines the horizontal and vertical table headers."
},
"getter": false,
"setter": false,
"reflect": false,
"attribute": "_header-cells"
},
"_label": {
"type": "string",
"mutable": false,
"complexType": {
"original": "string",
"resolved": "string",
"references": {}
},
"required": true,
"optional": false,
"docs": {
"tags": [],
"text": "Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.)."
},
"getter": false,
"setter": false,
"reflect": false,
"attribute": "_label"
},
"_on": {
"type": "unknown",
"mutable": false,
"complexType": {
"original": "TableCallbacksPropType",
"resolved": "undefined | { onSort?: EventValueOrEventCallback<MouseEvent, SortEventPayload> | undefined; onSelectionChange?: EventValueOrEventCallback<Event, KoliBriTableSelectionKeys> | undefined; onChangeHeaderCells?: EventValueOrEventCallback<Event, TableHeaderCells> | undefined; }",
"references": {
"TableCallbacksPropType": {
"location": "import",
"path": "../../schema",
"id": "src/schema/index.ts::TableCallbacksPropType"
}
}
},
"required": false,
"optional": true,
"docs": {
"tags": [],
"text": "Defines the callback functions for table events."
},
"getter": false,
"setter": false
},
"_selection": {
"type": "string",
"mutable": false,
"complexType": {
"original": "TableSelectionPropType",
"resolved": "string | undefined | ({ disabledKeys?: KoliBriTableSelectionKeys | undefined; keyPropertyName?: string | undefined; label: (row: KoliBriTableDataType) => string; multiple?: boolean | undefined; selectedKeys?: KoliBriTableSelectionKeys | undefined; })",
"references": {
"TableSelectionPropType": {
"location": "import",
"path": "../../schema",
"id": "src/schema/index.ts::TableSelectionPropType"
}
}
},
"required": false,
"optional": true,
"docs": {
"tags": [],
"text": "Defines how rows can be selected and the current selection."
},
"getter": false,
"setter": false,
"reflect": false,
"attribute": "_selection"
},
"_hasSettingsMenu": {
"type": "boolean",
"mutable": false,
"complexType": {
"original": "HasSettingsMenuPropType",
"resolved": "boolean | undefined",
"references": {
"HasSettingsMenuPropType": {
"location": "import",
"path": "../../schema",
"id": "src/schema/index.ts::HasSettingsMenuPropType"
}
}
},
"required": false,
"optional": true,
"docs": {
"tags": [],
"text": "Enables the settings menu if true (default: false)."
},
"getter": false,
"setter": false,
"reflect": false,
"attribute": "_has-settings-menu"
},
"_variant": {
"type": "string",
"mutable": false,
"complexType": {
"original": "VariantClassNamePropType",
"resolved": "string | undefined",
"references": {
"VariantClassNamePropType": {
"location": "import",
"path": "../../schema",
"id": "src/schema/index.ts::VariantClassNamePropType"
}
}
},
"required": false,
"optional": true,
"docs": {
"tags": [],
"text": "Defines which variant should be used for presentation."
},
"getter": false,
"setter": false,
"reflect": false,
"attribute": "_variant"
}
};
}
static get states() {
return {
"resolvedElements": {}
};
}
static get elementRef() { return "host"; }
static get watchers() {
return [{
"propName": "_ariaLabelledby",
"methodName": "validateAriaLabelledby"
}];
}
}
//# sourceMappingURL=shadow.js.map