@public-ui/components 1.5.0-rc.12 → 1.5.0-rc.14
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/assets/codicons/LICENSE +395 -0
- package/assets/codicons/LICENSE-CODE +21 -0
- package/assets/codicons/codicon.css +571 -0
- package/assets/codicons/codicon.csv +421 -0
- package/assets/codicons/codicon.html +3871 -0
- package/assets/codicons/codicon.svg +1 -0
- package/assets/codicons/codicon.ttf +0 -0
- package/assets/kolibri.ico +0 -0
- package/cheat-sheet.html +8 -8
- package/custom-elements.json +7 -7
- package/dist/cjs/color-40b15935.js +4 -0
- package/dist/cjs/color-40b15935.js.map +1 -0
- package/dist/cjs/{controller-ae0aa1fb.js → controller-073aa3b2.js} +1 -1
- package/dist/cjs/{controller-ae0aa1fb.js.map → controller-073aa3b2.js.map} +1 -1
- package/dist/cjs/{controller-34b64835.js → controller-272d14fd.js} +1 -1
- package/dist/cjs/{controller-34b64835.js.map → controller-272d14fd.js.map} +1 -1
- package/dist/cjs/{controller-6dbcc733.js → controller-46148a56.js} +1 -1
- package/dist/cjs/{controller-6dbcc733.js.map → controller-46148a56.js.map} +1 -1
- package/dist/cjs/{controller-a1c1ce64.js → controller-536f457e.js} +1 -1
- package/dist/cjs/controller-536f457e.js.map +1 -0
- package/dist/cjs/{controller-icon-295d3454.js → controller-icon-f01acf97.js} +1 -1
- package/dist/cjs/{controller-icon-295d3454.js.map → controller-icon-f01acf97.js.map} +1 -1
- package/dist/cjs/kol-abbr.cjs.entry.js +1 -1
- package/dist/cjs/kol-abbr.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-accordion.cjs.entry.js +1 -1
- package/dist/cjs/kol-accordion.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-alert.cjs.entry.js +1 -1
- package/dist/cjs/kol-alert.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-badge.cjs.entry.js +1 -1
- package/dist/cjs/kol-badge.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-breadcrumb.cjs.entry.js +1 -1
- package/dist/cjs/kol-breadcrumb.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-button-group.cjs.entry.js +1 -1
- package/dist/cjs/kol-button-group.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-button-link.cjs.entry.js +1 -1
- package/dist/cjs/kol-button-link.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-button-wc_3.cjs.entry.js +1 -1
- package/dist/cjs/kol-button-wc_3.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-button.cjs.entry.js +1 -1
- package/dist/cjs/kol-button.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-card.cjs.entry.js +1 -1
- package/dist/cjs/kol-card.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-details.cjs.entry.js +1 -1
- package/dist/cjs/kol-details.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-heading.cjs.entry.js +1 -1
- package/dist/cjs/kol-heading.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-indented-text.cjs.entry.js +1 -1
- package/dist/cjs/kol-indented-text.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-input-checkbox.cjs.entry.js +1 -1
- package/dist/cjs/kol-input-checkbox.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-input-color.cjs.entry.js +1 -1
- package/dist/cjs/kol-input-color.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-input-date.cjs.entry.js +1 -1
- package/dist/cjs/kol-input-date.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-input-email.cjs.entry.js +1 -1
- package/dist/cjs/kol-input-email.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-input-file.cjs.entry.js +1 -1
- package/dist/cjs/kol-input-file.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-input-number.cjs.entry.js +1 -1
- package/dist/cjs/kol-input-number.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-input-password.cjs.entry.js +1 -1
- package/dist/cjs/kol-input-password.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-input-radio.cjs.entry.js +1 -1
- package/dist/cjs/kol-input-radio.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-input-range.cjs.entry.js +1 -1
- package/dist/cjs/kol-input-range.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-input-text.cjs.entry.js +1 -1
- package/dist/cjs/kol-input-text.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-kolibri.cjs.entry.js +1 -1
- package/dist/cjs/kol-kolibri.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-link-button.cjs.entry.js +1 -1
- package/dist/cjs/kol-link-button.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-link-group.cjs.entry.js +1 -1
- package/dist/cjs/kol-link-group.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-link.cjs.entry.js +1 -1
- package/dist/cjs/kol-link.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-logo.cjs.entry.js +1 -1
- package/dist/cjs/kol-logo.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-modal.cjs.entry.js +1 -1
- package/dist/cjs/kol-modal.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-nav.cjs.entry.js +1 -1
- package/dist/cjs/kol-nav.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-pagination.cjs.entry.js +1 -1
- package/dist/cjs/kol-pagination.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-progress.cjs.entry.js +1 -1
- package/dist/cjs/kol-progress.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-quote.cjs.entry.js +1 -1
- package/dist/cjs/kol-quote.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-select.cjs.entry.js +1 -1
- package/dist/cjs/kol-select.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-skip-nav.cjs.entry.js +1 -1
- package/dist/cjs/kol-skip-nav.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-span.cjs.entry.js +1 -1
- package/dist/cjs/kol-span.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-spin.cjs.entry.js +1 -1
- package/dist/cjs/kol-spin.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-table.cjs.entry.js +1 -1
- package/dist/cjs/kol-table.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-tabs.cjs.entry.js +1 -1
- package/dist/cjs/kol-tabs.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-textarea.cjs.entry.js +1 -1
- package/dist/cjs/kol-textarea.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-toast.cjs.entry.js +1 -1
- package/dist/cjs/kol-toast.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-tooltip.cjs.entry.js +1 -1
- package/dist/cjs/kol-tooltip.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-version.cjs.entry.js +1 -1
- package/dist/cjs/kol-version.cjs.entry.js.map +1 -1
- package/dist/cjs/prop.validators-dd1f7878.js.map +1 -1
- package/dist/cjs/{validation-b38b683c.js → validation-55ae497d.js} +1 -1
- package/dist/cjs/{validation-b38b683c.js.map → validation-55ae497d.js.map} +1 -1
- package/dist/components/color.js +4 -0
- package/dist/components/color.js.map +1 -0
- package/dist/components/component.js +1 -1
- package/dist/components/component.js.map +1 -1
- package/dist/components/component10.js +1 -1
- package/dist/components/component10.js.map +1 -1
- package/dist/components/component11.js +1 -1
- package/dist/components/component11.js.map +1 -1
- package/dist/components/component12.js +1 -1
- package/dist/components/component12.js.map +1 -1
- package/dist/components/component13.js +1 -1
- package/dist/components/component13.js.map +1 -1
- package/dist/components/component14.js +1 -1
- package/dist/components/component14.js.map +1 -1
- package/dist/components/component15.js +1 -1
- package/dist/components/component15.js.map +1 -1
- package/dist/components/component4.js +1 -1
- package/dist/components/component4.js.map +1 -1
- package/dist/components/component6.js +1 -1
- package/dist/components/component6.js.map +1 -1
- package/dist/components/component7.js +1 -1
- package/dist/components/component7.js.map +1 -1
- package/dist/components/controller.js +1 -1
- package/dist/components/controller.js.map +1 -1
- package/dist/components/kol-abbr.js +1 -1
- package/dist/components/kol-abbr.js.map +1 -1
- package/dist/components/kol-accordion.js +1 -1
- package/dist/components/kol-accordion.js.map +1 -1
- package/dist/components/kol-breadcrumb.js +1 -1
- package/dist/components/kol-breadcrumb.js.map +1 -1
- package/dist/components/kol-button-group.js +1 -1
- package/dist/components/kol-button-group.js.map +1 -1
- package/dist/components/kol-button-link.js +1 -1
- package/dist/components/kol-button-link.js.map +1 -1
- package/dist/components/kol-card.js +1 -1
- package/dist/components/kol-card.js.map +1 -1
- package/dist/components/kol-details.js +1 -1
- package/dist/components/kol-details.js.map +1 -1
- package/dist/components/kol-heading.js +1 -1
- package/dist/components/kol-heading.js.map +1 -1
- package/dist/components/kol-input-checkbox.js +1 -1
- package/dist/components/kol-input-checkbox.js.map +1 -1
- package/dist/components/kol-input-color.js +1 -1
- package/dist/components/kol-input-color.js.map +1 -1
- package/dist/components/kol-input-date.js +1 -1
- package/dist/components/kol-input-date.js.map +1 -1
- package/dist/components/kol-input-email.js +1 -1
- package/dist/components/kol-input-email.js.map +1 -1
- package/dist/components/kol-input-file.js +1 -1
- package/dist/components/kol-input-file.js.map +1 -1
- package/dist/components/kol-input-password.js +1 -1
- package/dist/components/kol-input-password.js.map +1 -1
- package/dist/components/kol-input-range.js +1 -1
- package/dist/components/kol-input-range.js.map +1 -1
- package/dist/components/kol-input-text.js +1 -1
- package/dist/components/kol-input-text.js.map +1 -1
- package/dist/components/kol-kolibri.js +1 -1
- package/dist/components/kol-kolibri.js.map +1 -1
- package/dist/components/kol-link-button.js +1 -1
- package/dist/components/kol-link-button.js.map +1 -1
- package/dist/components/kol-link-group.js +1 -1
- package/dist/components/kol-link-group.js.map +1 -1
- package/dist/components/kol-logo.js +1 -1
- package/dist/components/kol-logo.js.map +1 -1
- package/dist/components/kol-modal.js +1 -1
- package/dist/components/kol-modal.js.map +1 -1
- package/dist/components/kol-nav.js +1 -1
- package/dist/components/kol-nav.js.map +1 -1
- package/dist/components/kol-progress.js +1 -1
- package/dist/components/kol-progress.js.map +1 -1
- package/dist/components/kol-quote.js +1 -1
- package/dist/components/kol-quote.js.map +1 -1
- package/dist/components/kol-skip-nav.js +1 -1
- package/dist/components/kol-skip-nav.js.map +1 -1
- package/dist/components/kol-span.js +1 -1
- package/dist/components/kol-span.js.map +1 -1
- package/dist/components/kol-spin.js +1 -1
- package/dist/components/kol-spin.js.map +1 -1
- package/dist/components/kol-table.js +1 -1
- package/dist/components/kol-table.js.map +1 -1
- package/dist/components/kol-tabs.js +1 -1
- package/dist/components/kol-tabs.js.map +1 -1
- package/dist/components/kol-textarea.js +1 -1
- package/dist/components/kol-textarea.js.map +1 -1
- package/dist/components/kol-toast.js +1 -1
- package/dist/components/kol-toast.js.map +1 -1
- package/dist/components/kol-version.js +1 -1
- package/dist/components/kol-version.js.map +1 -1
- package/dist/components/prop.validators.js.map +1 -1
- package/dist/components/shadow.js +1 -1
- package/dist/components/shadow.js.map +1 -1
- package/dist/components/shadow2.js +1 -1
- package/dist/components/shadow2.js.map +1 -1
- package/dist/esm/color-32939623.js +4 -0
- package/dist/esm/color-32939623.js.map +1 -0
- package/dist/esm/{controller-bc7e1fb9.js → controller-0f18a72b.js} +1 -1
- package/dist/esm/{controller-bc7e1fb9.js.map → controller-0f18a72b.js.map} +1 -1
- package/dist/esm/{controller-0bcb86ac.js → controller-22781e1d.js} +1 -1
- package/dist/esm/{controller-0bcb86ac.js.map → controller-22781e1d.js.map} +1 -1
- package/dist/esm/{controller-1827c5e4.js → controller-a9333e53.js} +1 -1
- package/dist/esm/{controller-1827c5e4.js.map → controller-a9333e53.js.map} +1 -1
- package/dist/esm/{controller-fd64aa81.js → controller-cbcb5b86.js} +1 -1
- package/dist/esm/controller-cbcb5b86.js.map +1 -0
- package/dist/esm/{controller-icon-b3feb2a8.js → controller-icon-8695323b.js} +1 -1
- package/dist/esm/{controller-icon-b3feb2a8.js.map → controller-icon-8695323b.js.map} +1 -1
- package/dist/esm/kol-abbr.entry.js +1 -1
- package/dist/esm/kol-abbr.entry.js.map +1 -1
- package/dist/esm/kol-accordion.entry.js +1 -1
- package/dist/esm/kol-accordion.entry.js.map +1 -1
- package/dist/esm/kol-alert.entry.js +1 -1
- package/dist/esm/kol-alert.entry.js.map +1 -1
- package/dist/esm/kol-badge.entry.js +1 -1
- package/dist/esm/kol-badge.entry.js.map +1 -1
- package/dist/esm/kol-breadcrumb.entry.js +1 -1
- package/dist/esm/kol-breadcrumb.entry.js.map +1 -1
- package/dist/esm/kol-button-group.entry.js +1 -1
- package/dist/esm/kol-button-group.entry.js.map +1 -1
- package/dist/esm/kol-button-link.entry.js +1 -1
- package/dist/esm/kol-button-link.entry.js.map +1 -1
- package/dist/esm/kol-button-wc_3.entry.js +1 -1
- package/dist/esm/kol-button-wc_3.entry.js.map +1 -1
- package/dist/esm/kol-button.entry.js +1 -1
- package/dist/esm/kol-button.entry.js.map +1 -1
- package/dist/esm/kol-card.entry.js +1 -1
- package/dist/esm/kol-card.entry.js.map +1 -1
- package/dist/esm/kol-details.entry.js +1 -1
- package/dist/esm/kol-details.entry.js.map +1 -1
- package/dist/esm/kol-heading.entry.js +1 -1
- package/dist/esm/kol-heading.entry.js.map +1 -1
- package/dist/esm/kol-indented-text.entry.js +1 -1
- package/dist/esm/kol-indented-text.entry.js.map +1 -1
- package/dist/esm/kol-input-checkbox.entry.js +1 -1
- package/dist/esm/kol-input-checkbox.entry.js.map +1 -1
- package/dist/esm/kol-input-color.entry.js +1 -1
- package/dist/esm/kol-input-color.entry.js.map +1 -1
- package/dist/esm/kol-input-date.entry.js +1 -1
- package/dist/esm/kol-input-date.entry.js.map +1 -1
- package/dist/esm/kol-input-email.entry.js +1 -1
- package/dist/esm/kol-input-email.entry.js.map +1 -1
- package/dist/esm/kol-input-file.entry.js +1 -1
- package/dist/esm/kol-input-file.entry.js.map +1 -1
- package/dist/esm/kol-input-number.entry.js +1 -1
- package/dist/esm/kol-input-number.entry.js.map +1 -1
- package/dist/esm/kol-input-password.entry.js +1 -1
- package/dist/esm/kol-input-password.entry.js.map +1 -1
- package/dist/esm/kol-input-radio.entry.js +1 -1
- package/dist/esm/kol-input-radio.entry.js.map +1 -1
- package/dist/esm/kol-input-range.entry.js +1 -1
- package/dist/esm/kol-input-range.entry.js.map +1 -1
- package/dist/esm/kol-input-text.entry.js +1 -1
- package/dist/esm/kol-input-text.entry.js.map +1 -1
- package/dist/esm/kol-kolibri.entry.js +1 -1
- package/dist/esm/kol-kolibri.entry.js.map +1 -1
- package/dist/esm/kol-link-button.entry.js +1 -1
- package/dist/esm/kol-link-button.entry.js.map +1 -1
- package/dist/esm/kol-link-group.entry.js +1 -1
- package/dist/esm/kol-link-group.entry.js.map +1 -1
- package/dist/esm/kol-link.entry.js +1 -1
- package/dist/esm/kol-link.entry.js.map +1 -1
- package/dist/esm/kol-logo.entry.js +1 -1
- package/dist/esm/kol-logo.entry.js.map +1 -1
- package/dist/esm/kol-modal.entry.js +1 -1
- package/dist/esm/kol-modal.entry.js.map +1 -1
- package/dist/esm/kol-nav.entry.js +1 -1
- package/dist/esm/kol-nav.entry.js.map +1 -1
- package/dist/esm/kol-pagination.entry.js +1 -1
- package/dist/esm/kol-pagination.entry.js.map +1 -1
- package/dist/esm/kol-progress.entry.js +1 -1
- package/dist/esm/kol-progress.entry.js.map +1 -1
- package/dist/esm/kol-quote.entry.js +1 -1
- package/dist/esm/kol-quote.entry.js.map +1 -1
- package/dist/esm/kol-select.entry.js +1 -1
- package/dist/esm/kol-select.entry.js.map +1 -1
- package/dist/esm/kol-skip-nav.entry.js +1 -1
- package/dist/esm/kol-skip-nav.entry.js.map +1 -1
- package/dist/esm/kol-span.entry.js +1 -1
- package/dist/esm/kol-span.entry.js.map +1 -1
- package/dist/esm/kol-spin.entry.js +1 -1
- package/dist/esm/kol-spin.entry.js.map +1 -1
- package/dist/esm/kol-table.entry.js +1 -1
- package/dist/esm/kol-table.entry.js.map +1 -1
- package/dist/esm/kol-tabs.entry.js +1 -1
- package/dist/esm/kol-tabs.entry.js.map +1 -1
- package/dist/esm/kol-textarea.entry.js +1 -1
- package/dist/esm/kol-textarea.entry.js.map +1 -1
- package/dist/esm/kol-toast.entry.js +1 -1
- package/dist/esm/kol-toast.entry.js.map +1 -1
- package/dist/esm/kol-tooltip.entry.js +1 -1
- package/dist/esm/kol-tooltip.entry.js.map +1 -1
- package/dist/esm/kol-version.entry.js +1 -1
- package/dist/esm/kol-version.entry.js.map +1 -1
- package/dist/esm/prop.validators-e402ad49.js.map +1 -1
- package/dist/esm/{validation-b331e3a7.js → validation-a42d9cc9.js} +1 -1
- package/dist/esm/{validation-b331e3a7.js.map → validation-a42d9cc9.js.map} +1 -1
- package/dist/kolibri/assets/bundes/style.css +4 -4
- package/dist/kolibri/assets/tabler-icons/tabler-icons.css +0 -1
- package/dist/kolibri/assets/tabler-icons/tabler-icons.min.css +1 -1
- package/dist/kolibri/color-32939623.js +4 -0
- package/dist/kolibri/color-32939623.js.map +1 -0
- package/dist/kolibri/{controller-bc7e1fb9.js → controller-0f18a72b.js} +1 -1
- package/dist/kolibri/controller-22781e1d.js +4 -0
- package/dist/kolibri/{controller-1827c5e4.js → controller-a9333e53.js} +1 -1
- package/dist/kolibri/controller-cbcb5b86.js +4 -0
- package/dist/kolibri/controller-cbcb5b86.js.map +1 -0
- package/dist/kolibri/{controller-icon-b3feb2a8.js → controller-icon-8695323b.js} +1 -1
- package/dist/kolibri/kol-abbr.entry.js +1 -1
- package/dist/kolibri/kol-abbr.entry.js.map +1 -1
- package/dist/kolibri/kol-accordion.entry.js +1 -1
- package/dist/kolibri/kol-accordion.entry.js.map +1 -1
- package/dist/kolibri/kol-alert.entry.js +1 -1
- package/dist/kolibri/kol-alert.entry.js.map +1 -1
- package/dist/kolibri/kol-badge.entry.js +1 -1
- package/dist/kolibri/kol-badge.entry.js.map +1 -1
- package/dist/kolibri/kol-breadcrumb.entry.js +1 -1
- package/dist/kolibri/kol-breadcrumb.entry.js.map +1 -1
- package/dist/kolibri/kol-button-group.entry.js +1 -1
- package/dist/kolibri/kol-button-group.entry.js.map +1 -1
- package/dist/kolibri/kol-button-link.entry.js +1 -1
- package/dist/kolibri/kol-button-link.entry.js.map +1 -1
- package/dist/kolibri/kol-button-wc_3.entry.js +1 -1
- package/dist/kolibri/kol-button-wc_3.entry.js.map +1 -1
- package/dist/kolibri/kol-button.entry.js +1 -1
- package/dist/kolibri/kol-button.entry.js.map +1 -1
- package/dist/kolibri/kol-card.entry.js +1 -1
- package/dist/kolibri/kol-card.entry.js.map +1 -1
- package/dist/kolibri/kol-details.entry.js +1 -1
- package/dist/kolibri/kol-details.entry.js.map +1 -1
- package/dist/kolibri/kol-heading.entry.js +1 -1
- package/dist/kolibri/kol-heading.entry.js.map +1 -1
- package/dist/kolibri/kol-indented-text.entry.js +1 -1
- package/dist/kolibri/kol-indented-text.entry.js.map +1 -1
- package/dist/kolibri/kol-input-checkbox.entry.js +1 -1
- package/dist/kolibri/kol-input-checkbox.entry.js.map +1 -1
- package/dist/kolibri/kol-input-color.entry.js +1 -1
- package/dist/kolibri/kol-input-color.entry.js.map +1 -1
- package/dist/kolibri/kol-input-date.entry.js +1 -1
- package/dist/kolibri/kol-input-date.entry.js.map +1 -1
- package/dist/kolibri/kol-input-email.entry.js +1 -1
- package/dist/kolibri/kol-input-email.entry.js.map +1 -1
- package/dist/kolibri/kol-input-file.entry.js +1 -1
- package/dist/kolibri/kol-input-file.entry.js.map +1 -1
- package/dist/kolibri/kol-input-number.entry.js +1 -1
- package/dist/kolibri/kol-input-number.entry.js.map +1 -1
- package/dist/kolibri/kol-input-password.entry.js +1 -1
- package/dist/kolibri/kol-input-password.entry.js.map +1 -1
- package/dist/kolibri/kol-input-radio.entry.js +1 -1
- package/dist/kolibri/kol-input-radio.entry.js.map +1 -1
- package/dist/kolibri/kol-input-range.entry.js +1 -1
- package/dist/kolibri/kol-input-range.entry.js.map +1 -1
- package/dist/kolibri/kol-input-text.entry.js +1 -1
- package/dist/kolibri/kol-input-text.entry.js.map +1 -1
- package/dist/kolibri/kol-kolibri.entry.js +1 -1
- package/dist/kolibri/kol-kolibri.entry.js.map +1 -1
- package/dist/kolibri/kol-link-button.entry.js +1 -1
- package/dist/kolibri/kol-link-button.entry.js.map +1 -1
- package/dist/kolibri/kol-link-group.entry.js +1 -1
- package/dist/kolibri/kol-link-group.entry.js.map +1 -1
- package/dist/kolibri/kol-link.entry.js +1 -1
- package/dist/kolibri/kol-link.entry.js.map +1 -1
- package/dist/kolibri/kol-logo.entry.js +1 -1
- package/dist/kolibri/kol-logo.entry.js.map +1 -1
- package/dist/kolibri/kol-modal.entry.js +1 -1
- package/dist/kolibri/kol-modal.entry.js.map +1 -1
- package/dist/kolibri/kol-nav.entry.js +1 -1
- package/dist/kolibri/kol-nav.entry.js.map +1 -1
- package/dist/kolibri/kol-pagination.entry.js +1 -1
- package/dist/kolibri/kol-pagination.entry.js.map +1 -1
- package/dist/kolibri/kol-progress.entry.js +1 -1
- package/dist/kolibri/kol-progress.entry.js.map +1 -1
- package/dist/kolibri/kol-quote.entry.js +1 -1
- package/dist/kolibri/kol-quote.entry.js.map +1 -1
- package/dist/kolibri/kol-select.entry.js +1 -1
- package/dist/kolibri/kol-select.entry.js.map +1 -1
- package/dist/kolibri/kol-skip-nav.entry.js +1 -1
- package/dist/kolibri/kol-skip-nav.entry.js.map +1 -1
- package/dist/kolibri/kol-span.entry.js +1 -1
- package/dist/kolibri/kol-span.entry.js.map +1 -1
- package/dist/kolibri/kol-spin.entry.js +1 -1
- package/dist/kolibri/kol-spin.entry.js.map +1 -1
- package/dist/kolibri/kol-table.entry.js +1 -1
- package/dist/kolibri/kol-table.entry.js.map +1 -1
- package/dist/kolibri/kol-tabs.entry.js +1 -1
- package/dist/kolibri/kol-tabs.entry.js.map +1 -1
- package/dist/kolibri/kol-textarea.entry.js +1 -1
- package/dist/kolibri/kol-textarea.entry.js.map +1 -1
- package/dist/kolibri/kol-toast.entry.js +1 -1
- package/dist/kolibri/kol-toast.entry.js.map +1 -1
- package/dist/kolibri/kol-tooltip.entry.js +1 -1
- package/dist/kolibri/kol-tooltip.entry.js.map +1 -1
- package/dist/kolibri/kol-version.entry.js +1 -1
- package/dist/kolibri/kol-version.entry.js.map +1 -1
- package/dist/kolibri/prop.validators-e402ad49.js.map +1 -1
- package/dist/kolibri/validation-a42d9cc9.js +4 -0
- package/dist/kolibri/{validation-b331e3a7.js.map → validation-a42d9cc9.js.map} +1 -1
- package/dist/types/components/badge/component.d.ts +5 -8
- package/dist/types/components/kolibri/component.d.ts +5 -3
- package/dist/types/components.d.ts +10 -8
- package/dist/types/types/props/color.d.ts +20 -0
- package/dist/types/utils/prop.validators.d.ts +1 -1
- package/doc/badge.md +2 -2
- package/doc/breadcrumb.md +1 -1
- package/doc/button.md +12 -21
- package/doc/icon-font-awesome.md +1 -1
- package/doc/icon-icofont.md +1 -1
- package/doc/icon.md +1 -1
- package/doc/kolibri.md +5 -5
- package/doc/nav.md +10 -10
- package/jest-test-results.json +1 -1
- package/package.json +3 -2
- package/vscode-custom-data.json +12 -12
- package/dist/cjs/controller-a1c1ce64.js.map +0 -1
- package/dist/cjs/index-1266b30d.js +0 -4
- package/dist/cjs/index-1266b30d.js.map +0 -1
- package/dist/components/index2.js +0 -4
- package/dist/components/index2.js.map +0 -1
- package/dist/esm/controller-fd64aa81.js.map +0 -1
- package/dist/esm/index-d14da386.js +0 -4
- package/dist/esm/index-d14da386.js.map +0 -1
- package/dist/kolibri/controller-0bcb86ac.js +0 -4
- package/dist/kolibri/controller-fd64aa81.js +0 -4
- package/dist/kolibri/controller-fd64aa81.js.map +0 -1
- package/dist/kolibri/index-d14da386.js +0 -4
- package/dist/kolibri/index-d14da386.js.map +0 -1
- package/dist/kolibri/validation-b331e3a7.js +0 -4
- package/dist/types/core/declare.d.ts +0 -10
- /package/dist/kolibri/{controller-bc7e1fb9.js.map → controller-0f18a72b.js.map} +0 -0
- /package/dist/kolibri/{controller-0bcb86ac.js.map → controller-22781e1d.js.map} +0 -0
- /package/dist/kolibri/{controller-1827c5e4.js.map → controller-a9333e53.js.map} +0 -0
- /package/dist/kolibri/{controller-icon-b3feb2a8.js.map → controller-icon-8695323b.js.map} +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["defaultStyleCss","KolButtonGroup","render","h","Host"],"sources":["./src/components/button-group/style.css?tag=kol-button-group&mode=default&encapsulation=shadow","./src/components/button-group/shadow.tsx"],"sourcesContent":["@import '../style.css';\n\n:host > kol-button-group-wc {\n\tdisplay: inline-flex;\n\tflex-wrap: wrap;\n}\n","import { Component, h, Host, JSX } from '@stencil/core';\n\nimport { Props } from './component';\n\n@Component({\n\ttag: 'kol-button-group',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolButtonGroup implements Props {\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<kol-button-group-wc>\n\t\t\t\t\t<slot />\n\t\t\t\t</kol-button-group-wc>\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"mappings":";;;sDAAA,MAAMA,EAAkB,
|
|
1
|
+
{"version":3,"names":["defaultStyleCss","KolButtonGroup","render","h","Host"],"sources":["./src/components/button-group/style.css?tag=kol-button-group&mode=default&encapsulation=shadow","./src/components/button-group/shadow.tsx"],"sourcesContent":["@import '../style.css';\n\n:host > kol-button-group-wc {\n\tdisplay: inline-flex;\n\tflex-wrap: wrap;\n}\n","import { Component, h, Host, JSX } from '@stencil/core';\n\nimport { Props } from './component';\n\n@Component({\n\ttag: 'kol-button-group',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolButtonGroup implements Props {\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<kol-button-group-wc>\n\t\t\t\t\t<slot />\n\t\t\t\t</kol-button-group-wc>\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"mappings":";;;sDAAA,MAAMA,EAAkB,ksB,MCWXC,EAAc,M,yBACnBC,SACN,OACCC,EAACC,EAAI,KACJD,EAAA,2BACCA,EAAA,c"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* KoliBri - The accessible HTML-Standard
|
|
3
3
|
*/
|
|
4
|
-
import{r as
|
|
4
|
+
import{r as i,h as t,H as e,g as n}from"./index-50adf9a0.js";import{a as s}from"./reuse-3a02afb9.js";const o=":host{--a11y-min-size:44px}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}*[role='button'],button:not([role='link']){min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}a,button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}:host{display:inline-block}:is(a,button){align-items:baseline;display:inline-flex;place-items:center;text-align:left;text-decoration-line:underline}:is(a,button):is(:focus,:hover){text-decoration-thickness:0.2em}.hidden{display:none;visibility:hidden}.skip{left:-99999px;overflow:hidden;position:absolute;z-index:9999999;line-height:1em}.skip:focus{background-color:white;left:unset;padding:1em;position:unset}kol-icon.external-link-icon{display:inline-flex}",a=class{constructor(t){i(this,t),this.catchRef=i=>{this.ref=i,s(this.host,this.ref)},this._accessKey=void 0,this._ariaControls=void 0,this._ariaCurrent=void 0,this._ariaExpanded=void 0,this._ariaLabel=void 0,this._ariaSelected=void 0,this._disabled=!1,this._icon=void 0,this._iconOnly=!1,this._id=void 0,this._label=void 0,this._on=void 0,this._role=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._type="button",this._value=void 0}render(){return t(e,null,t("kol-button-wc",{ref:this.catchRef,_accessKey:this._accessKey,_ariaControls:this._ariaControls,_ariaCurrent:this._ariaCurrent,_ariaExpanded:this._ariaExpanded,_ariaLabel:this._ariaLabel,_ariaSelected:this._ariaSelected,_disabled:this._disabled,_icon:this._icon,_iconOnly:this._iconOnly,_id:this._id,_label:this._label,_on:this._on,_role:"link",_tabIndex:this._tabIndex,_tooltipAlign:this._tooltipAlign,_type:this._type,_value:this._value},t("slot",{name:"expert",slot:"expert"})))}get host(){return n(this)}};a.style={default:o};export{a as kol_button_link};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["defaultStyleCss","KolButtonLink","this","catchRef","ref","propagateFocus","host","render","h","Host","_accessKey","_ariaControls","_ariaCurrent","_ariaExpanded","_ariaLabel","_ariaSelected","_disabled","_icon","_iconOnly","_id","_label","_on","_role","_tabIndex","_tooltipAlign","_type","_value","name","slot"],"sources":["./src/components/button-link/style.css?tag=kol-button-link&mode=default&encapsulation=shadow","./src/components/button-link/component.tsx"],"sourcesContent":["@import '../link.css';\n","import { Component, Element, h, Host, JSX, Prop } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { AlternativButtonLinkRole, KoliBriButtonCallbacks, KoliBriButtonType, OptionalButtonLinkProps, RequiredButtonLinkProps } from '../../types/button-link';\nimport { Stringified } from '../../types/common';\nimport { KoliBriIconProp } from '../../types/icon';\nimport { propagateFocus } from '../../utils/reuse';\nimport { AriaCurrent, PropAlignment } from '../../types/props';\n\n@Component({\n\ttag: 'kol-button-link',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolButtonLink implements Generic.Element.Members<RequiredButtonLinkProps, OptionalButtonLinkProps> {\n\t@Element() private readonly host?: HTMLKolButtonLinkElement;\n\tprivate ref?: HTMLKolButtonWcElement;\n\n\tprivate readonly catchRef = (ref?: HTMLKolButtonWcElement) => {\n\t\tthis.ref = ref;\n\t\tpropagateFocus(this.host, this.ref);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<kol-button-wc\n\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t_accessKey={this._accessKey}\n\t\t\t\t\t_ariaControls={this._ariaControls}\n\t\t\t\t\t_ariaCurrent={this._ariaCurrent}\n\t\t\t\t\t_ariaExpanded={this._ariaExpanded}\n\t\t\t\t\t_ariaLabel={this._ariaLabel}\n\t\t\t\t\t_ariaSelected={this._ariaSelected}\n\t\t\t\t\t_disabled={this._disabled}\n\t\t\t\t\t_icon={this._icon}\n\t\t\t\t\t_iconOnly={this._iconOnly}\n\t\t\t\t\t_id={this._id}\n\t\t\t\t\t_label={this._label}\n\t\t\t\t\t_on={this._on}\n\t\t\t\t\t_role=\"link\"\n\t\t\t\t\t_tabIndex={this._tabIndex}\n\t\t\t\t\t_tooltipAlign={this._tooltipAlign}\n\t\t\t\t\t_type={this._type}\n\t\t\t\t\t_value={this._value}\n\t\t\t\t>\n\t\t\t\t\t{/*\n\t\t\t\t\t\tEs ist keine gute Idee hier einen Slot einzufügen, da dadurch ermöglicht wird,\n\t\t\t\t\t\tdie Unterstützung hinsichtlich der Barrierefreiheit der Komponente zu umgehen.\n\t\t\t\t\t*/}\n\t\t\t\t\t<slot name=\"expert\" slot=\"expert\" />\n\t\t\t\t</kol-button-wc>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Gibt an, mit welcher Tastenkombination man den Button auslösen oder fokussieren kann.\n\t */\n\t@Prop() public _accessKey?: string;\n\n\t/**\n\t * Gibt an, welche Elemente kontrolliert werden. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls)\n\t */\n\t@Prop() public _ariaControls?: string;\n\n\t/**\n\t * Gibt an, welchen aktuellen Auswahlstatus der Button hat. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current)\n\t */\n\t@Prop() public _ariaCurrent?: AriaCurrent;\n\n\t/**\n\t * Gibt an, ob durch den Button etwas aufgeklappt wurde. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded)\n\t */\n\t@Prop({ reflect: true }) public _ariaExpanded?: boolean;\n\n\t/**\n\t * Gibt einen beschreibenden Text für den Screenreader an. Damit die\n\t * Sprachsteuerung von interaktiven Elementen funktioniert, muss der\n\t * Aria-Label-Text mit dem Label-Text des Buttons beginnen.\n\t *\n\t * - https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label\n\t */\n\t@Prop({ mutable: true, reflect: false }) public _ariaLabel?: string;\n\n\t/**\n\t * Gibt an, ob Element ausgewählt ist (role=tab). (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected)\n\t */\n\t@Prop({ reflect: true }) public _ariaSelected?: boolean;\n\n\t/**\n\t * Gibt an, ob der Button deaktiviert ist.\n\t */\n\t@Prop({ reflect: true }) public _disabled?: boolean = false;\n\n\t/**\n\t * Iconklasse (z.B.: \"codicon codicon-home\")\n\t */\n\t@Prop() public _icon?: Stringified<KoliBriIconProp>;\n\n\t/**\n\t * Gibt an, ob nur das Icon angezeigt wird.\n\t */\n\t@Prop({ reflect: true }) public _iconOnly?: boolean = false;\n\n\t/**\n\t * Gibt die ID der Schaltfläche an. (Selection, Testing)\n\t */\n\t@Prop() public _id?: string;\n\n\t/**\n\t * Setzt den sichtbaren Text des Elements.\n\t */\n\t@Prop() public _label!: string;\n\n\t/**\n\t * Gibt die EventCallback-Funktionen für die Button-Events an.\n\t */\n\t@Prop() public _on?: KoliBriButtonCallbacks<unknown>;\n\n\t/**\n\t * Gibt an, welche Role der Schalter hat.\n\t */\n\t@Prop() public _role?: AlternativButtonLinkRole;\n\n\t/**\n\t * Gibt an, welchen Tab-Index der Button hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)\n\t */\n\t@Prop() public _tabIndex?: number;\n\n\t/**\n\t * Gibt an, ob der Tooltip oben, rechts, unten oder links angezeigt werden soll.\n\t */\n\t@Prop() public _tooltipAlign?: PropAlignment = 'top';\n\n\t/**\n\t * Gibt an, welche Typ der Button hat.\n\t */\n\t@Prop() public _type?: KoliBriButtonType = 'button';\n\n\t/**\n\t * Gibt einen Wert an, den der Schalter bei einem Klick zurückgibt.\n\t */\n\t@Prop() public _value?: Stringified<unknown>;\n}\n"],"mappings":";;;qGAAA,MAAMA,EAAkB,
|
|
1
|
+
{"version":3,"names":["defaultStyleCss","KolButtonLink","this","catchRef","ref","propagateFocus","host","render","h","Host","_accessKey","_ariaControls","_ariaCurrent","_ariaExpanded","_ariaLabel","_ariaSelected","_disabled","_icon","_iconOnly","_id","_label","_on","_role","_tabIndex","_tooltipAlign","_type","_value","name","slot"],"sources":["./src/components/button-link/style.css?tag=kol-button-link&mode=default&encapsulation=shadow","./src/components/button-link/component.tsx"],"sourcesContent":["@import '../link.css';\n","import { Component, Element, h, Host, JSX, Prop } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { AlternativButtonLinkRole, KoliBriButtonCallbacks, KoliBriButtonType, OptionalButtonLinkProps, RequiredButtonLinkProps } from '../../types/button-link';\nimport { Stringified } from '../../types/common';\nimport { KoliBriIconProp } from '../../types/icon';\nimport { propagateFocus } from '../../utils/reuse';\nimport { AriaCurrent, PropAlignment } from '../../types/props';\n\n@Component({\n\ttag: 'kol-button-link',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolButtonLink implements Generic.Element.Members<RequiredButtonLinkProps, OptionalButtonLinkProps> {\n\t@Element() private readonly host?: HTMLKolButtonLinkElement;\n\tprivate ref?: HTMLKolButtonWcElement;\n\n\tprivate readonly catchRef = (ref?: HTMLKolButtonWcElement) => {\n\t\tthis.ref = ref;\n\t\tpropagateFocus(this.host, this.ref);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<kol-button-wc\n\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t_accessKey={this._accessKey}\n\t\t\t\t\t_ariaControls={this._ariaControls}\n\t\t\t\t\t_ariaCurrent={this._ariaCurrent}\n\t\t\t\t\t_ariaExpanded={this._ariaExpanded}\n\t\t\t\t\t_ariaLabel={this._ariaLabel}\n\t\t\t\t\t_ariaSelected={this._ariaSelected}\n\t\t\t\t\t_disabled={this._disabled}\n\t\t\t\t\t_icon={this._icon}\n\t\t\t\t\t_iconOnly={this._iconOnly}\n\t\t\t\t\t_id={this._id}\n\t\t\t\t\t_label={this._label}\n\t\t\t\t\t_on={this._on}\n\t\t\t\t\t_role=\"link\"\n\t\t\t\t\t_tabIndex={this._tabIndex}\n\t\t\t\t\t_tooltipAlign={this._tooltipAlign}\n\t\t\t\t\t_type={this._type}\n\t\t\t\t\t_value={this._value}\n\t\t\t\t>\n\t\t\t\t\t{/*\n\t\t\t\t\t\tEs ist keine gute Idee hier einen Slot einzufügen, da dadurch ermöglicht wird,\n\t\t\t\t\t\tdie Unterstützung hinsichtlich der Barrierefreiheit der Komponente zu umgehen.\n\t\t\t\t\t*/}\n\t\t\t\t\t<slot name=\"expert\" slot=\"expert\" />\n\t\t\t\t</kol-button-wc>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Gibt an, mit welcher Tastenkombination man den Button auslösen oder fokussieren kann.\n\t */\n\t@Prop() public _accessKey?: string;\n\n\t/**\n\t * Gibt an, welche Elemente kontrolliert werden. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls)\n\t */\n\t@Prop() public _ariaControls?: string;\n\n\t/**\n\t * Gibt an, welchen aktuellen Auswahlstatus der Button hat. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current)\n\t */\n\t@Prop() public _ariaCurrent?: AriaCurrent;\n\n\t/**\n\t * Gibt an, ob durch den Button etwas aufgeklappt wurde. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded)\n\t */\n\t@Prop({ reflect: true }) public _ariaExpanded?: boolean;\n\n\t/**\n\t * Gibt einen beschreibenden Text für den Screenreader an. Damit die\n\t * Sprachsteuerung von interaktiven Elementen funktioniert, muss der\n\t * Aria-Label-Text mit dem Label-Text des Buttons beginnen.\n\t *\n\t * - https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label\n\t */\n\t@Prop({ mutable: true, reflect: false }) public _ariaLabel?: string;\n\n\t/**\n\t * Gibt an, ob Element ausgewählt ist (role=tab). (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected)\n\t */\n\t@Prop({ reflect: true }) public _ariaSelected?: boolean;\n\n\t/**\n\t * Gibt an, ob der Button deaktiviert ist.\n\t */\n\t@Prop({ reflect: true }) public _disabled?: boolean = false;\n\n\t/**\n\t * Iconklasse (z.B.: \"codicon codicon-home\")\n\t */\n\t@Prop() public _icon?: Stringified<KoliBriIconProp>;\n\n\t/**\n\t * Gibt an, ob nur das Icon angezeigt wird.\n\t */\n\t@Prop({ reflect: true }) public _iconOnly?: boolean = false;\n\n\t/**\n\t * Gibt die ID der Schaltfläche an. (Selection, Testing)\n\t */\n\t@Prop() public _id?: string;\n\n\t/**\n\t * Setzt den sichtbaren Text des Elements.\n\t */\n\t@Prop() public _label!: string;\n\n\t/**\n\t * Gibt die EventCallback-Funktionen für die Button-Events an.\n\t */\n\t@Prop() public _on?: KoliBriButtonCallbacks<unknown>;\n\n\t/**\n\t * Gibt an, welche Role der Schalter hat.\n\t */\n\t@Prop() public _role?: AlternativButtonLinkRole;\n\n\t/**\n\t * Gibt an, welchen Tab-Index der Button hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)\n\t */\n\t@Prop() public _tabIndex?: number;\n\n\t/**\n\t * Gibt an, ob der Tooltip oben, rechts, unten oder links angezeigt werden soll.\n\t */\n\t@Prop() public _tooltipAlign?: PropAlignment = 'top';\n\n\t/**\n\t * Gibt an, welche Typ der Button hat.\n\t */\n\t@Prop() public _type?: KoliBriButtonType = 'button';\n\n\t/**\n\t * Gibt einen Wert an, den der Schalter bei einem Klick zurückgibt.\n\t */\n\t@Prop() public _value?: Stringified<unknown>;\n}\n"],"mappings":";;;qGAAA,MAAMA,EAAkB,+kC,MCgBXC,EAAa,M,yBAIRC,KAAAC,SAAYC,IAC5BF,KAAKE,IAAMA,EACXC,EAAeH,KAAKI,KAAMJ,KAAKE,IAAI,E,sLAyEkB,M,oCAUA,M,6HA8BP,M,WAKJ,S,sBAnHpCG,SACN,OACCC,EAACC,EAAI,KACJD,EAAA,iBACCJ,IAAKF,KAAKC,SACVO,WAAYR,KAAKQ,WACjBC,cAAeT,KAAKS,cACpBC,aAAcV,KAAKU,aACnBC,cAAeX,KAAKW,cACpBC,WAAYZ,KAAKY,WACjBC,cAAeb,KAAKa,cACpBC,UAAWd,KAAKc,UAChBC,MAAOf,KAAKe,MACZC,UAAWhB,KAAKgB,UAChBC,IAAKjB,KAAKiB,IACVC,OAAQlB,KAAKkB,OACbC,IAAKnB,KAAKmB,IACVC,MAAM,OACNC,UAAWrB,KAAKqB,UAChBC,cAAetB,KAAKsB,cACpBC,MAAOvB,KAAKuB,MACZC,OAAQxB,KAAKwB,QAMblB,EAAA,QAAMmB,KAAK,SAASC,KAAK,Y"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* KoliBri - The accessible HTML-Standard
|
|
3
3
|
*/
|
|
4
|
-
import{r as t,h as i,H as s,g as e}from"./index-50adf9a0.js";import{w as a}from"./button-link-0f3cba87.js";import{g as l,e as n}from"./a11y.tipps-1cea9822.js";import{n as h}from"./dev.utils-157f0499.js";import{b as d,f as r,j as o,h as c,w as u,a as f,s as v}from"./prop.validators-e402ad49.js";import{a as _}from"./reuse-3a02afb9.js";import{v as p,w as b}from"./icon-00018c54.js";import{a as m,b as y}from"./label-d51b1a57.js";import{v as g}from"./tab-index-63d1379d.js";import{p as j,a as A}from"./controller-873db1b1.js";import{a as C,w}from"./controller-0b0c0e12.js";import{w as x}from"./validation-
|
|
4
|
+
import{r as t,h as i,H as s,g as e}from"./index-50adf9a0.js";import{w as a}from"./button-link-0f3cba87.js";import{g as l,e as n}from"./a11y.tipps-1cea9822.js";import{n as h}from"./dev.utils-157f0499.js";import{b as d,f as r,j as o,h as c,w as u,a as f,s as v}from"./prop.validators-e402ad49.js";import{a as _}from"./reuse-3a02afb9.js";import{v as p,w as b}from"./icon-00018c54.js";import{a as m,b as y}from"./label-d51b1a57.js";import{v as g}from"./tab-index-63d1379d.js";import{p as j,a as A}from"./controller-873db1b1.js";import{a as C,w}from"./controller-0b0c0e12.js";import{w as x}from"./validation-a42d9cc9.js";import"./index-81bd9b41.js";const k=(t,i)=>{d(t,"_ariaExpanded",i)},I=(t,i)=>{d(t,"_disabled",i)},L=class{constructor(i){t(this,i),this.nonce=h(),this.catchRef=t=>{this.ref=t,_(this.host,this.ref)},this.onClick=t=>{var i,a;"submit"===this.state._type?j({form:this.host,ref:this.ref}):"reset"===this.state._type?A({form:this.host,ref:this.ref}):"function"==typeof(null===(i=this.state._on)||void 0===i?void 0:i.onClick)?(t.stopPropagation(),r(t,this.ref),null===(a=this.state._on)||void 0===a||a.onClick(t,this.state._value)):l("It was no button click callback configured!")},this._accessKey=void 0,this._ariaControls=void 0,this._ariaCurrent=void 0,this._ariaExpanded=void 0,this._ariaLabel=void 0,this._ariaSelected=void 0,this._customClass=void 0,this._disabled=!1,this._icon=void 0,this._iconAlign=void 0,this._iconOnly=!1,this._id=void 0,this._label=void 0,this._on=void 0,this._role=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._type="button",this._value=void 0,this._variant="normal",this.state={_icon:{},_label:"…",_on:{},_type:"button",_variant:"normal"}}render(){return i(s,null,i("button",Object.assign({ref:this.catchRef,accessKey:this.state._accessKey,"aria-controls":this.state._ariaControls,"aria-current":o(this.state._ariaCurrent),"aria-expanded":c(this.state._ariaExpanded),"aria-label":!1===this.state._iconOnly?this.state._ariaLabel:void 0,"aria-labelledby":!0===this.state._iconOnly?this.nonce:void 0,"aria-selected":o(this.state._ariaSelected),class:{[this.state._variant]:"custom"!==this.state._variant,[this.state._customClass]:"custom"===this.state._variant&&"string"==typeof this.state._customClass&&this.state._customClass.length>0,"icon-only":!0===this.state._iconOnly},disabled:this.state._disabled,id:this.state._id},this.state._on,{onClick:this.onClick,role:this.state._role,tabIndex:this.state._tabIndex,type:this.state._type}),i("kol-span-wc",{_icon:this._icon,_iconOnly:this._iconOnly,_label:this.state._label},i("slot",{name:"expert",slot:"expert"}))),!0===this.state._iconOnly&&i("kol-tooltip",{"aria-hidden":"true",_align:this.state._tooltipAlign,_id:this.nonce,_label:this.state._ariaLabel||this.state._label}))}validateAccessKey(t){u(this,"_accessKey",t)}validateAriaControls(t){u(this,"_ariaControls",t)}validateAriaCurrent(t){f(this,"_ariaControls",(t=>!0===t||"date"===t||"location"===t||"page"===t||"step"===t||"time"===t),new Set(["boolean","String {data, location, page, step, time}"]),t)}validateAriaExpanded(t){k(this,t)}validateAriaLabel(t){m(this,t)}validateAriaSelected(t){d(this,"_ariaSelected",t)}validateCustomClass(t){u(this,"_customClass",t,{defaultValue:void 0})}validateDisabled(t){I(this,t),!0===t&&n()}validateIcon(t){p(this,t)}validateIconAlign(t){b(this,t)}validateIconOnly(t){d(this,"_iconOnly",t,{defaultValue:!1})}validateId(t){u(this,"_id",t)}validateLabel(t){y(this,t)}validateOn(t){"object"==typeof t&&null!==t&&(this.state=Object.assign(Object.assign({},this.state),{_on:t}))}validateRole(t){u(this,"_role",t)}validateTabIndex(t){g(this,t)}validateTooltipAlign(t){a(this,"_tooltipAlign",t)}validateType(t){C(this,"_type",t)}validateValue(t){v(this,"_value",t)}validateVariant(t){w(this,"_variant",t)}componentWillLoad(){this.validateAccessKey(this._accessKey),this.validateAriaControls(this._ariaControls),this.validateAriaCurrent(this._ariaCurrent),this.validateAriaExpanded(this._ariaExpanded),this.validateAriaLabel(this._ariaLabel),this.validateAriaSelected(this._ariaSelected),this.validateCustomClass(this._customClass),this.validateDisabled(this._disabled),this.validateIcon(this._icon),this.validateIconAlign(this._iconAlign),this.validateIconOnly(this._iconOnly),this.validateId(this._id),this.validateLabel(this._label),this.validateOn(this._on),this.validateRole(this._role),this.validateTabIndex(this._tabIndex),this.validateTooltipAlign(this._tooltipAlign),this.validateType(this._type),this.validateValue(this._value),this.validateVariant(this._variant)}get host(){return e(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_ariaControls:["validateAriaControls"],_ariaCurrent:["validateAriaCurrent"],_ariaExpanded:["validateAriaExpanded"],_ariaLabel:["validateAriaLabel"],_ariaSelected:["validateAriaSelected"],_customClass:["validateCustomClass"],_disabled:["validateDisabled"],_icon:["validateIcon"],_iconAlign:["validateIconAlign"],_iconOnly:["validateIconOnly"],_id:["validateId"],_label:["validateLabel"],_on:["validateOn"],_role:["validateRole"],_tabIndex:["validateTabIndex"],_tooltipAlign:["validateTooltipAlign"],_type:["validateType"],_value:["validateValue"],_variant:["validateVariant"]}}},O=class{constructor(a){t(this,a),this.renderHeadline=(t,a)=>{switch(a){case 1:return i("h1",{class:"headline"},t,i("slot",null));case 2:return i("h2",{class:"headline"},t,i("slot",null));case 3:return i("h3",{class:"headline"},t,i("slot",null));case 4:return i("h4",{class:"headline"},t,i("slot",null));case 5:return i("h5",{class:"headline"},t,i("slot",null));case 6:return i("h6",{class:"headline"},t,i("slot",null));default:return i("strong",{class:"headline"},t,i("slot",null))}},this.renderSecondaryHeadline=(t,a)=>{switch(a){case 1:return i("span",{class:"secondary-headline"},t);case 2:return i("h2",{class:"secondary-headline"},t);case 3:return i("h3",{class:"secondary-headline"},t);case 4:return i("h4",{class:"secondary-headline"},t);case 5:return i("h5",{class:"secondary-headline"},t);case 6:return i("h6",{class:"secondary-headline"},t);default:return i("strong",{class:"secondary-headline"},t)}},this._headline=void 0,this._level=1,this._secondaryHeadline=void 0,this.state={_headline:"…",_level:1}}validateHeadline(t){u(this,"_headline",t)}validateLevel(t){x(this,t)}validateSecondaryHeadline(t){u(this,"_secondaryHeadline",t)}componentWillLoad(){this.validateHeadline(this._headline),this.validateLevel(this._level),this.validateSecondaryHeadline(this._secondaryHeadline)}render(){return i(s,null,"string"==typeof this.state._secondaryHeadline&&this.state._secondaryHeadline.length>0?i("hgroup",null,this.renderHeadline(this.state._headline,this.state._level),this.state._secondaryHeadline&&this.renderSecondaryHeadline(this.state._secondaryHeadline,this.state._level+1)):this.renderHeadline(this.state._headline,this.state._level))}static get watchers(){return{_headline:["validateHeadline"],_level:["validateLevel"],_secondaryHeadline:["validateSecondaryHeadline"]}}},S=class{constructor(i){t(this,i),this._alert=!0,this._disabled=!1,this._error="",this._hideLabel=!1,this._hint="",this._icon=void 0,this._id=void 0,this._list=void 0,this._readOnly=!1,this._renderNoLabel=!1,this._required=!1,this._smartButton=void 0,this._touched=!1}render(){var t,a,e,l;const n="string"==typeof this._error&&this._error.length>0&&!0===this._touched,o="string"==typeof this._hint&&this._hint.length>0,r=!0===this._hideLabel&&!0!==this._required;return i(s,{class:{disabled:!0===this._disabled,error:!0===n,"read-only":!0===this._readOnly,required:!0===this._required,touched:!0===this._touched}},!1===this._renderNoLabel&&i("label",{id:`${this._id}-label`,hidden:r,htmlFor:this._id},i("span",null,i("slot",{name:"label"}))),o&&i("span",{class:"hint",id:`${this._id}-hint`},this._hint),i("div",{class:{input:!0,"icon-left":"object"==typeof(null===(t=this._icon)||void 0===t?void 0:t.left),"icon-right":"object"==typeof(null===(a=this._icon)||void 0===a?void 0:a.right)}},(null===(e=this._icon)||void 0===e?void 0:e.left)&&i("kol-icon",{_ariaLabel:"",_icon:this._icon.left.icon}),i("slot",{name:"input"}),"object"==typeof this._smartButton&&null!==this._smartButton&&i("kol-button-wc",{_ariaLabel:this._smartButton._ariaLabel,_customClass:this._smartButton._customClass,_disabled:this._smartButton._disabled,_icon:this._smartButton._icon,_iconOnly:!0,_id:this._smartButton._id,_label:this._smartButton._label,_on:this._smartButton._on,_tooltipAlign:this._smartButton._tooltipAlign,_variant:this._smartButton._variant}),(null===(l=this._icon)||void 0===l?void 0:l.right)&&i("kol-icon",{_ariaLabel:"",_icon:this._icon.right.icon})),n&&i("kol-alert",{class:"error",id:`${this._id}-error`,_alert:this._alert,_type:"error",_variant:"msg"},this._error),Array.isArray(this._list)&&this._list.length>0&&i("datalist",{id:`${this._id}-list`},this._list.map((t=>i("option",{value:t})))))}};export{L as kol_button_wc,O as kol_heading_wc,S as kol_input};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["validateAriaExpanded","component","value","watchBoolean","validateDisabled","KolButtonWc","this","nonce","catchRef","ref","propagateFocus","host","onClick","event","state","_type","propagateSubmitEventToForm","form","propagateResetEventToForm","_a","_on","stopPropagation","setEventTarget","_b","_value","devWarning","_icon","_label","_variant","render","h","Host","Object","assign","accessKey","_accessKey","_ariaControls","mapStringOrBoolean2String","_ariaCurrent","mapBoolean2String","_ariaExpanded","_iconOnly","_ariaLabel","undefined","_ariaSelected","class","_customClass","length","disabled","_disabled","id","_id","role","_role","tabIndex","_tabIndex","type","name","slot","_align","_tooltipAlign","validateAccessKey","watchString","validateAriaControls","validateAriaCurrent","watchValidator","Set","validateAriaLabel","validateAriaLabelWithLabel","validateAriaSelected","validateCustomClass","defaultValue","a11yHintDisabled","validateIcon","validateIconAlign","watchIconAlign","validateIconOnly","validateId","validateLabel","validateLabelWithAriaLabel","validateOn","validateRole","validateTabIndex","validateTooltipAlign","watchTooltipAlignment","validateType","watchButtonType","validateValue","setState","validateVariant","watchButtonVariant","componentWillLoad","_iconAlign","KolHeadingWc","renderHeadline","headline","level","renderSecondaryHeadline","_headline","_level","validateHeadline","validateLevel","watchHeadingLevel","validateSecondaryHeadline","_secondaryHeadline","KolInput","hasError","_error","_touched","hasHint","_hint","hideLabel","_hideLabel","_required","error","_readOnly","required","touched","_renderNoLabel","hidden","htmlFor","input","left","right","_c","icon","_smartButton","_d","_alert","Array","isArray","_list","map","option"],"sources":["./src/types/props/aria-expanded.ts","./src/types/props/disabled.ts","./src/components/button/component.tsx","./src/components/heading/component.tsx","./src/components/input/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { watchBoolean } from '../../utils/prop.validators';\n\n/* types */\n/** de\n * Markiert dieses Element als geöffnet, oder dass das verknüpfte Element (aria-controls/aria-owns) geöffnet ist.\n * (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded)\n */\n/** en\n * Marks this element as open/expanded, or that the connected element (aria-controls/aria-owns) is open/expanded.\n * (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded)\n */\nexport type PropAriaExpanded = {\n\tariaExpanded: boolean;\n};\n\n/* validator */\nexport const validateAriaExpanded = (component: Generic.Element.Component, value?: boolean): void => {\n\twatchBoolean(component, '_ariaExpanded', value);\n};\n","import { Generic } from '@a11y-ui/core';\nimport { watchBoolean } from '../../utils/prop.validators';\n\n/* types */\n/** de\n * Macht das Element nicht fokussierbar und lässt es alle Events ignorieren.\n */\n/** en\n * Makes the element not focusable and ignore all events.\n */\nexport type PropDisabled = {\n\tdisabled: boolean;\n};\n\n/* validator */\nexport const validateDisabled = (component: Generic.Element.Component, value?: boolean): void => {\n\twatchBoolean(component, '_disabled', value);\n};\n","import { Component, Element, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport {\n\tAlternativButtonLinkRole,\n\tButtonStates,\n\tKoliBriButtonCallbacks,\n\tKoliBriButtonType,\n\tKoliBriButtonVariant,\n\tOptionalButtonProps,\n\tOptionalButtonStates,\n\tRequiredButtonProps,\n\tRequiredButtonStates,\n\twatchTooltipAlignment,\n} from '../../types/button-link';\nimport { Stringified } from '../../types/common';\nimport { KoliBriIconProp } from '../../types/icon';\nimport { AriaCurrent, PropAlignment, validateAriaExpanded, validateDisabled } from '../../types/props';\nimport { a11yHintDisabled, devWarning } from '../../utils/a11y.tipps';\nimport { nonce } from '../../utils/dev.utils';\nimport { mapBoolean2String, mapStringOrBoolean2String, setEventTarget, setState, watchBoolean, watchString, watchValidator } from '../../utils/prop.validators';\nimport { propagateFocus } from '../../utils/reuse';\nimport { validateIcon, watchIconAlign } from '../../types/props/icon';\nimport { validateAriaLabelWithLabel, validateLabelWithAriaLabel } from '../../types/props/label';\nimport { validateTabIndex } from '../../utils/validators/tab-index';\nimport { propagateResetEventToForm, propagateSubmitEventToForm } from '../form/controller';\nimport { watchButtonType, watchButtonVariant } from './controller';\n\n/**\n * @internal\n */\n@Component({\n\ttag: 'kol-button-wc',\n\tshadow: false,\n})\nexport class KolButtonWc implements Generic.Element.ComponentApi<RequiredButtonProps, OptionalButtonProps, RequiredButtonStates, OptionalButtonStates> {\n\t@Element() private readonly host?: HTMLKolButtonWcElement;\n\tprivate readonly nonce = nonce();\n\tprivate ref?: HTMLButtonElement;\n\n\tprivate readonly catchRef = (ref?: HTMLButtonElement) => {\n\t\tthis.ref = ref;\n\t\tpropagateFocus(this.host, this.ref);\n\t};\n\n\tprivate readonly onClick = (event: MouseEvent) => {\n\t\tif (this.state._type === 'submit') {\n\t\t\tpropagateSubmitEventToForm({\n\t\t\t\tform: this.host,\n\t\t\t\tref: this.ref,\n\t\t\t});\n\t\t} else if (this.state._type === 'reset') {\n\t\t\tpropagateResetEventToForm({\n\t\t\t\tform: this.host,\n\t\t\t\tref: this.ref,\n\t\t\t});\n\t\t} else if (typeof this.state._on?.onClick === 'function') {\n\t\t\tevent.stopPropagation();\n\t\t\tsetEventTarget(event, this.ref);\n\t\t\tthis.state._on?.onClick(event, this.state._value);\n\t\t} else {\n\t\t\tdevWarning(`It was no button click callback configured!`);\n\t\t}\n\t};\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<button\n\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\taccessKey={this.state._accessKey}\n\t\t\t\t\taria-controls={this.state._ariaControls}\n\t\t\t\t\taria-current={mapStringOrBoolean2String(this.state._ariaCurrent)}\n\t\t\t\t\taria-expanded={mapBoolean2String(this.state._ariaExpanded)}\n\t\t\t\t\taria-label={this.state._iconOnly === false ? this.state._ariaLabel : undefined}\n\t\t\t\t\taria-labelledby={this.state._iconOnly === true ? this.nonce : undefined}\n\t\t\t\t\taria-selected={mapStringOrBoolean2String(this.state._ariaSelected)}\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t[this.state._variant as string]: this.state._variant !== 'custom',\n\t\t\t\t\t\t[this.state._customClass as string]:\n\t\t\t\t\t\t\tthis.state._variant === 'custom' && typeof this.state._customClass === 'string' && this.state._customClass.length > 0,\n\t\t\t\t\t\t'icon-only': this.state._iconOnly === true,\n\t\t\t\t\t}}\n\t\t\t\t\tdisabled={this.state._disabled}\n\t\t\t\t\tid={this.state._id}\n\t\t\t\t\t{...this.state._on}\n\t\t\t\t\tonClick={this.onClick}\n\t\t\t\t\trole={this.state._role}\n\t\t\t\t\ttabIndex={this.state._tabIndex}\n\t\t\t\t\ttype={this.state._type}\n\t\t\t\t>\n\t\t\t\t\t<kol-span-wc _icon={this._icon} _iconOnly={this._iconOnly} _label={this.state._label}>\n\t\t\t\t\t\t{/*\n\t\t\t\t\t\t\tEs ist keine gute Idee hier einen Slot einzufügen, da dadurch ermöglicht wird,\n\t\t\t\t\t\t\tdie Unterstützung hinsichtlich der Barrierefreiheit der Komponente zu umgehen.\n\t\t\t\t\t\t*/}\n\t\t\t\t\t\t<slot name=\"expert\" slot=\"expert\" />\n\t\t\t\t\t</kol-span-wc>\n\t\t\t\t</button>\n\t\t\t\t{this.state._iconOnly === true && (\n\t\t\t\t\t<kol-tooltip\n\t\t\t\t\t\t/**\n\t\t\t\t\t\t * Dieses Aria-Hidden verhindert das doppelte Vorlesen des Labels,\n\t\t\t\t\t\t * verhindert aber nicht das Aria-Labelledby vorgelesen wird.\n\t\t\t\t\t\t */\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t_align={this.state._tooltipAlign}\n\t\t\t\t\t\t_id={this.nonce}\n\t\t\t\t\t\t_label={this.state._ariaLabel || this.state._label}\n\t\t\t\t\t></kol-tooltip>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Gibt an, mit welcher Tastenkombination man den Button auslösen oder fokussieren kann.\n\t */\n\t@Prop() public _accessKey?: string;\n\n\t/**\n\t * Gibt an, welche Elemente kontrolliert werden. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls)\n\t */\n\t@Prop() public _ariaControls?: string;\n\n\t/**\n\t * Gibt an, welchen aktuellen Auswahlstatus der Button hat. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current)\n\t */\n\t@Prop() public _ariaCurrent?: AriaCurrent;\n\n\t/**\n\t * Gibt an, ob durch den Button etwas aufgeklappt wurde. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded)\n\t */\n\t@Prop({ reflect: true }) public _ariaExpanded?: boolean;\n\n\t/**\n\t * Gibt einen beschreibenden Text für den Screenreader an. Damit die\n\t * Sprachsteuerung von interaktiven Elementen funktioniert, muss der\n\t * Aria-Label-Text mit dem Label-Text des Buttons beginnen.\n\t *\n\t * - https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label\n\t */\n\t@Prop({ mutable: true, reflect: false }) public _ariaLabel?: string;\n\n\t/**\n\t * Gibt an, ob Element ausgewählt ist (role=tab). (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected)\n\t */\n\t@Prop({ reflect: true }) public _ariaSelected?: boolean;\n\n\t/**\n\t * Gibt an, welche Custom-Class übergeben werden soll, wenn _variant=\"custom\" gesetzt ist.\n\t */\n\t@Prop() public _customClass?: string;\n\n\t/**\n\t * Gibt an, ob der Button deaktiviert ist.\n\t */\n\t@Prop({ reflect: true }) public _disabled?: boolean = false;\n\n\t/**\n\t * Iconklasse (z.B.: \"codicon codicon-home\")\n\t */\n\t@Prop() public _icon?: Stringified<KoliBriIconProp>;\n\n\t/**\n\t * Gibt an, ob das Icon links oder rechts dargestellt werden soll.\n\t *\n\t * @deprecated\n\t */\n\t@Prop() public _iconAlign?: PropAlignment;\n\n\t/**\n\t * Blendet den Text aus und zeigt nur das gewählte Icon an, der Text wird in den Tooltip verschoben.\n\t */\n\t@Prop({ reflect: true }) public _iconOnly?: boolean = false;\n\n\t/**\n\t * Gibt die ID der Schaltfläche an. (Selection, Testing)\n\t */\n\t@Prop() public _id?: string;\n\n\t/**\n\t * Setzt den sichtbaren Text des Elements.\n\t */\n\t// - eslint-disable-next-line @stencil/strict-mutable\n\t@Prop({ mutable: true, reflect: false }) public _label!: string;\n\n\t/**\n\t * Gibt die EventCallback-Funktionen für die Button-Events an.\n\t */\n\t@Prop() public _on?: KoliBriButtonCallbacks<unknown>;\n\n\t/**\n\t * Gibt an, welche Rolle der Schalter hat.\n\t */\n\t@Prop() public _role?: AlternativButtonLinkRole;\n\n\t/**\n\t * Gibt an, welchen Tab-Index der Button hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)\n\t */\n\t@Prop() public _tabIndex?: number;\n\n\t/**\n\t * Setzt die gewünschte Ausrichtung des Tooltips (`_icon-only`).\n\t */\n\t@Prop() public _tooltipAlign?: PropAlignment = 'top';\n\n\t/**\n\t * Setzt den Typ der Schaltfläche.\n\t */\n\t@Prop() public _type?: KoliBriButtonType = 'button';\n\n\t/**\n\t * Gibt einen Wert an, den der Schalter bei einem Klick zurückgibt.\n\t */\n\t@Prop() public _value?: Stringified<unknown>;\n\n\t/**\n\t * Gibt an, welche Ausprägung der Button hat.\n\t */\n\t@Prop() public _variant?: KoliBriButtonVariant = 'normal';\n\n\t@State() public state: ButtonStates = {\n\t\t_icon: {},\n\t\t_label: '…', // ⚠ required\n\t\t_on: {},\n\t\t_type: 'button',\n\t\t_variant: 'normal',\n\t};\n\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\twatchString(this, '_accessKey', value);\n\t}\n\n\t@Watch('_ariaControls')\n\tpublic validateAriaControls(value?: string): void {\n\t\twatchString(this, '_ariaControls', value);\n\t}\n\n\t@Watch('_ariaCurrent')\n\tpublic validateAriaCurrent(value?: AriaCurrent): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_ariaControls',\n\t\t\t(value) => value === true || value === 'date' || value === 'location' || value === 'page' || value === 'step' || value === 'time',\n\t\t\tnew Set(['boolean', 'String {data, location, page, step, time}']),\n\t\t\tvalue\n\t\t);\n\t}\n\n\t@Watch('_ariaExpanded')\n\tpublic validateAriaExpanded(value?: boolean): void {\n\t\tvalidateAriaExpanded(this, value);\n\t}\n\n\t@Watch('_ariaLabel')\n\tpublic validateAriaLabel(value?: string): void {\n\t\tvalidateAriaLabelWithLabel(this, value);\n\t}\n\n\t@Watch('_ariaSelected')\n\tpublic validateAriaSelected(value?: boolean): void {\n\t\twatchBoolean(this, '_ariaSelected', value);\n\t}\n\n\t@Watch('_customClass')\n\tpublic validateCustomClass(value?: string): void {\n\t\twatchString(this, '_customClass', value, {\n\t\t\tdefaultValue: undefined,\n\t\t});\n\t}\n\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tvalidateDisabled(this, value);\n\t\tif (value === true) {\n\t\t\ta11yHintDisabled();\n\t\t}\n\t}\n\n\t@Watch('_icon')\n\tpublic validateIcon(value?: KoliBriIconProp): void {\n\t\tvalidateIcon(this, value);\n\t}\n\n\t/**\n\t * @deprecated\n\t */\n\n\t@Watch('_iconAlign')\n\tpublic validateIconAlign(value?: PropAlignment): void {\n\t\twatchIconAlign(this, value);\n\t}\n\n\t@Watch('_iconOnly')\n\tpublic validateIconOnly(value?: boolean): void {\n\t\twatchBoolean(this, '_iconOnly', value, {\n\t\t\tdefaultValue: false,\n\t\t\t// hooks: {\n\t\t\t// beforePatch: (_value, nextState) => {\n\t\t\t// let ariaLabel = this.state._ariaLabel;\n\t\t\t// if (nextState.has('_ariaLabel')) {\n\t\t\t// ariaLabel = nextState.get('_ariaLabel') as string;\n\t\t\t// }\n\t\t\t// if (typeof ariaLabel !== 'string' || ariaLabel.length <= 0) {\n\t\t\t// devHint(`[KolButton]: Bevor Icon-Only aktiviert wird, muss ein Aria-Label bzw. Label gesetzt werden.`);\n\t\t\t// nextState.set('_iconOnly', false);\n\t\t\t// }\n\t\t\t// },\n\t\t\t// },\n\t\t});\n\t}\n\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\twatchString(this, '_id', value);\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: string): void {\n\t\tvalidateLabelWithAriaLabel(this, value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: KoliBriButtonCallbacks<unknown>): void {\n\t\tif (typeof value === 'object' && value !== null) {\n\t\t\tthis.state = {\n\t\t\t\t...this.state,\n\t\t\t\t_on: value,\n\t\t\t};\n\t\t}\n\t}\n\n\t@Watch('_role')\n\tpublic validateRole(value?: AlternativButtonLinkRole): void {\n\t\twatchString(this, '_role', value);\n\t}\n\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tvalidateTabIndex(this, value);\n\t}\n\n\t@Watch('_tooltipAlign')\n\tpublic validateTooltipAlign(value?: PropAlignment): void {\n\t\twatchTooltipAlignment(this, '_tooltipAlign', value);\n\t}\n\n\t@Watch('_type')\n\tpublic validateType(value?: KoliBriButtonType): void {\n\t\twatchButtonType(this, '_type', value);\n\t}\n\n\t@Watch('_value')\n\tpublic validateValue(value?: Stringified<unknown>): void {\n\t\tsetState(this, '_value', value);\n\t}\n\n\t@Watch('_variant')\n\tpublic validateVariant(value?: KoliBriButtonVariant): void {\n\t\twatchButtonVariant(this, '_variant', value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAccessKey(this._accessKey);\n\t\tthis.validateAriaControls(this._ariaControls);\n\t\tthis.validateAriaCurrent(this._ariaCurrent);\n\t\tthis.validateAriaExpanded(this._ariaExpanded);\n\t\tthis.validateAriaLabel(this._ariaLabel);\n\t\tthis.validateAriaSelected(this._ariaSelected);\n\t\tthis.validateCustomClass(this._customClass);\n\t\tthis.validateDisabled(this._disabled);\n\t\tthis.validateIcon(this._icon);\n\t\tthis.validateIconAlign(this._iconAlign);\n\t\tthis.validateIconOnly(this._iconOnly);\n\t\tthis.validateId(this._id);\n\t\tthis.validateLabel(this._label);\n\t\tthis.validateOn(this._on);\n\t\tthis.validateRole(this._role);\n\t\tthis.validateTabIndex(this._tabIndex);\n\t\tthis.validateTooltipAlign(this._tooltipAlign);\n\t\tthis.validateType(this._type);\n\t\tthis.validateValue(this._value);\n\t\tthis.validateVariant(this._variant);\n\t}\n}\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { HeadingLevel } from '../../types/heading-level';\nimport { watchString } from '../../utils/prop.validators';\nimport { watchHeadingLevel } from './validation';\n\ntype RequiredProps = {\n\theadline: string;\n};\ntype OptionalProps = {\n\tsecondaryHeadline: string;\n\tlevel: HeadingLevel;\n};\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = {\n\theadline: string;\n\tlevel: HeadingLevel;\n};\ntype OptionalStates = {\n\tsecondaryHeadline: string;\n};\nexport type States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n@Component({\n\ttag: 'kol-heading-wc',\n\tshadow: false,\n})\nexport class KolHeadingWc implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\t/**\n\t * Gibt den Text der Überschrift an.\n\t */\n\t@Prop() public _headline!: string;\n\n\t/**\n\t * Setzt den H-Level, von 1 bis 6, der Überschrift.\n\t */\n\t@Prop() public _level?: HeadingLevel = 1;\n\n\t/**\n\t * Setzt den Text einer weiteren Überschrift, einen Level kleiner, unter der Ersten.\n\t */\n\t@Prop() public _secondaryHeadline?: string;\n\n\t@State() public state: States = {\n\t\t_headline: '…', // ⚠ required\n\t\t_level: 1,\n\t};\n\n\t@Watch('_headline')\n\tpublic validateHeadline(value?: string): void {\n\t\twatchString(this, '_headline', value);\n\t}\n\n\t@Watch('_level')\n\tpublic validateLevel(value?: HeadingLevel): void {\n\t\twatchHeadingLevel(this, value);\n\t}\n\n\t@Watch('_secondaryHeadline')\n\tpublic validateSecondaryHeadline(value?: string): void {\n\t\twatchString(this, '_secondaryHeadline', value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateHeadline(this._headline);\n\t\tthis.validateLevel(this._level);\n\t\tthis.validateSecondaryHeadline(this._secondaryHeadline);\n\t}\n\n\tprivate readonly renderHeadline = (headline: string, level?: number): JSX.Element => {\n\t\tswitch (level) {\n\t\t\tcase 1:\n\t\t\t\treturn (\n\t\t\t\t\t<h1 class=\"headline\">\n\t\t\t\t\t\t{headline}\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</h1>\n\t\t\t\t);\n\t\t\tcase 2:\n\t\t\t\treturn (\n\t\t\t\t\t<h2 class=\"headline\">\n\t\t\t\t\t\t{headline}\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</h2>\n\t\t\t\t);\n\t\t\tcase 3:\n\t\t\t\treturn (\n\t\t\t\t\t<h3 class=\"headline\">\n\t\t\t\t\t\t{headline}\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</h3>\n\t\t\t\t);\n\t\t\tcase 4:\n\t\t\t\treturn (\n\t\t\t\t\t<h4 class=\"headline\">\n\t\t\t\t\t\t{headline}\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</h4>\n\t\t\t\t);\n\t\t\tcase 5:\n\t\t\t\treturn (\n\t\t\t\t\t<h5 class=\"headline\">\n\t\t\t\t\t\t{headline}\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</h5>\n\t\t\t\t);\n\t\t\tcase 6:\n\t\t\t\treturn (\n\t\t\t\t\t<h6 class=\"headline\">\n\t\t\t\t\t\t{headline}\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</h6>\n\t\t\t\t);\n\t\t\tdefault:\n\t\t\t\treturn (\n\t\t\t\t\t<strong class=\"headline\">\n\t\t\t\t\t\t{headline}\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</strong>\n\t\t\t\t);\n\t\t}\n\t};\n\n\tprivate readonly renderSecondaryHeadline = (headline: string, level?: number): JSX.Element => {\n\t\tswitch (level) {\n\t\t\tcase 1:\n\t\t\t\treturn <h1 class=\"secondary-headline\">{headline}</h1>;\n\t\t\tcase 2:\n\t\t\t\treturn <h2 class=\"secondary-headline\">{headline}</h2>;\n\t\t\tcase 3:\n\t\t\t\treturn <h3 class=\"secondary-headline\">{headline}</h3>;\n\t\t\tcase 4:\n\t\t\t\treturn <h4 class=\"secondary-headline\">{headline}</h4>;\n\t\t\tcase 5:\n\t\t\t\treturn <h5 class=\"secondary-headline\">{headline}</h5>;\n\t\t\tcase 6:\n\t\t\t\treturn <h6 class=\"secondary-headline\">{headline}</h6>;\n\t\t\tdefault:\n\t\t\t\treturn <strong class=\"secondary-headline\">{headline}</strong>;\n\t\t}\n\t};\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t{typeof this.state._secondaryHeadline === 'string' && this.state._secondaryHeadline.length > 0 ? (\n\t\t\t\t\t<hgroup>\n\t\t\t\t\t\t{this.renderHeadline(this.state._headline, this.state._level)}\n\t\t\t\t\t\t{this.state._secondaryHeadline && this.renderSecondaryHeadline(this.state._secondaryHeadline, this.state._level + 1)}\n\t\t\t\t\t</hgroup>\n\t\t\t\t) : (\n\t\t\t\t\tthis.renderHeadline(this.state._headline, this.state._level)\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t);\n\t}\n}\n","/* eslint-disable jsx-a11y/label-has-associated-control */\nimport { Component, h, Host, JSX, Prop } from '@stencil/core';\nimport { ButtonProps } from '../../types/button-link';\nimport { Stringified } from '../../types/common';\nimport { KoliBriCustomIcon } from '../../types/icon';\n\nimport { KoliBriHorizontalIcon } from '../../types/icon';\nimport { Props } from './types';\n\n/**\n * @internal\n */\n@Component({\n\ttag: 'kol-input',\n\tshadow: false,\n})\nexport class KolInput implements Props {\n\tpublic render(): JSX.Element {\n\t\tconst hasError = typeof this._error === 'string' && this._error.length > 0 && this._touched === true;\n\t\tconst hasHint = typeof this._hint === 'string' && this._hint.length > 0;\n\t\tconst hideLabel = this._hideLabel === true && this._required !== true;\n\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tclass={{\n\t\t\t\t\tdisabled: this._disabled === true,\n\t\t\t\t\terror: hasError === true,\n\t\t\t\t\t'read-only': this._readOnly === true,\n\t\t\t\t\trequired: this._required === true,\n\t\t\t\t\ttouched: this._touched === true,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{this._renderNoLabel === false && (\n\t\t\t\t\t<label id={`${this._id}-label`} hidden={hideLabel} htmlFor={this._id}>\n\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t<slot name=\"label\"></slot>\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</label>\n\t\t\t\t)}\n\t\t\t\t{hasHint && (\n\t\t\t\t\t<span class=\"hint\" id={`${this._id}-hint`}>\n\t\t\t\t\t\t{this._hint}\n\t\t\t\t\t</span>\n\t\t\t\t)}\n\t\t\t\t<div\n\t\t\t\t\tclass={{\n\t\t\t\t\t\tinput: true,\n\t\t\t\t\t\t'icon-left': typeof this._icon?.left === 'object',\n\t\t\t\t\t\t'icon-right': typeof this._icon?.right === 'object',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{this._icon?.left ? <kol-icon _ariaLabel=\"\" _icon={(this._icon.left as KoliBriCustomIcon).icon}></kol-icon> : <i />}\n\t\t\t\t\t<slot name=\"input\"></slot>\n\t\t\t\t\t{typeof this._smartButton === 'object' && this._smartButton !== null && (\n\t\t\t\t\t\t<kol-button-wc\n\t\t\t\t\t\t\t_ariaLabel={this._smartButton._ariaLabel}\n\t\t\t\t\t\t\t_customClass={this._smartButton._customClass}\n\t\t\t\t\t\t\t_disabled={this._smartButton._disabled}\n\t\t\t\t\t\t\t_icon={this._smartButton._icon}\n\t\t\t\t\t\t\t_iconOnly={true}\n\t\t\t\t\t\t\t_id={this._smartButton._id}\n\t\t\t\t\t\t\t_label={this._smartButton._label}\n\t\t\t\t\t\t\t_on={this._smartButton._on}\n\t\t\t\t\t\t\t_tooltipAlign={this._smartButton._tooltipAlign}\n\t\t\t\t\t\t\t_variant={this._smartButton._variant}\n\t\t\t\t\t\t></kol-button-wc>\n\t\t\t\t\t)}\n\t\t\t\t\t{this._icon?.right ? <kol-icon _ariaLabel=\"\" _icon={(this._icon.right as KoliBriCustomIcon).icon}></kol-icon> : <i />}\n\t\t\t\t</div>\n\t\t\t\t{hasError && (\n\t\t\t\t\t<kol-alert class=\"error\" id={`${this._id}-error`} _alert={this._alert} _type=\"error\" _variant=\"msg\">\n\t\t\t\t\t\t{this._error}\n\t\t\t\t\t</kol-alert>\n\t\t\t\t)}\n\t\t\t\t{Array.isArray(this._list) && this._list.length > 0 && (\n\t\t\t\t\t<datalist id={`${this._id}-list`}>\n\t\t\t\t\t\t{this._list.map((option: string) => (\n\t\t\t\t\t\t\t<option value={option} />\n\t\t\t\t\t\t))}\n\t\t\t\t\t</datalist>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Gibt an, ob die Fehlermeldung vorgelesen werden soll, wenn es eine gibt.\n\t */\n\t@Prop({ reflect: true }) public _alert?: boolean = true;\n\n\t/**\n\t * Setzt das Feld in einen inaktiven Zustand, in dem es keine Interaktion erlaubt.\n\t */\n\t@Prop({ reflect: true }) public _disabled?: boolean = false;\n\n\t/**\n\t * Gibt den Text für eine Fehlermeldung an.\n\t */\n\t@Prop() public _error?: string = '';\n\n\t/**\n\t * Versteckt das sichtbare Label des Elements.\n\t */\n\t@Prop({ reflect: true }) public _hideLabel?: boolean = false;\n\n\t/**\n\t * Gibt den Hinweistext an.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * Ermöglicht das Anzeigen von Icons links und/oder rechts am Rand des Eingabefeldes.\n\t */\n\t@Prop() public _icon?: KoliBriHorizontalIcon;\n\n\t/**\n\t * Gibt die technische ID des Eingabefeldes an.\n\t */\n\t@Prop() public _id!: string;\n\n\t/**\n\t * Gibt die Liste der Vorschlagswörter an.\n\t */\n\t@Prop() public _list?: Stringified<string[]>;\n\n\t/**\n\t * Gibt an, ob die Eingabefeld nur lesend ist.\n\t */\n\t@Prop({ reflect: true }) public _readOnly?: boolean = false;\n\n\t/**\n\t * Gibt an, ob die Komponente kein Label rendern soll.\n\t */\n\t@Prop({ reflect: true }) public _renderNoLabel?: boolean = false;\n\n\t/**\n\t * Macht das Eingabeelement zu einem Pflichtfeld.\n\t */\n\t@Prop({ reflect: true }) public _required?: boolean = false;\n\n\t/**\n\t * Ermöglicht eine Schaltfläche ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (ohne label).\n\t */\n\t@Prop() public _smartButton?: ButtonProps;\n\n\t/**\n\t * Gibt an, ob dieses Eingabefeld von Nutzer:innen einmal besucht/berührt wurde.\n\t */\n\t@Prop({ reflect: true }) public _touched?: boolean = false;\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"names":["validateAriaExpanded","component","value","watchBoolean","validateDisabled","KolButtonWc","this","nonce","catchRef","ref","propagateFocus","host","onClick","event","state","_type","propagateSubmitEventToForm","form","propagateResetEventToForm","_a","_on","stopPropagation","setEventTarget","_b","_value","devWarning","_icon","_label","_variant","render","h","Host","Object","assign","accessKey","_accessKey","_ariaControls","mapStringOrBoolean2String","_ariaCurrent","mapBoolean2String","_ariaExpanded","_iconOnly","_ariaLabel","undefined","_ariaSelected","class","_customClass","length","disabled","_disabled","id","_id","role","_role","tabIndex","_tabIndex","type","name","slot","_align","_tooltipAlign","validateAccessKey","watchString","validateAriaControls","validateAriaCurrent","watchValidator","Set","validateAriaLabel","validateAriaLabelWithLabel","validateAriaSelected","validateCustomClass","defaultValue","a11yHintDisabled","validateIcon","validateIconAlign","watchIconAlign","validateIconOnly","validateId","validateLabel","validateLabelWithAriaLabel","validateOn","validateRole","validateTabIndex","validateTooltipAlign","watchTooltipAlignment","validateType","watchButtonType","validateValue","setState","validateVariant","watchButtonVariant","componentWillLoad","_iconAlign","KolHeadingWc","renderHeadline","headline","level","renderSecondaryHeadline","_headline","_level","validateHeadline","validateLevel","watchHeadingLevel","validateSecondaryHeadline","_secondaryHeadline","KolInput","hasError","_error","_touched","hasHint","_hint","hideLabel","_hideLabel","_required","error","_readOnly","required","touched","_renderNoLabel","hidden","htmlFor","input","left","right","_c","icon","_smartButton","_d","_alert","Array","isArray","_list","map","option"],"sources":["./src/types/props/aria-expanded.ts","./src/types/props/disabled.ts","./src/components/button/component.tsx","./src/components/heading/component.tsx","./src/components/input/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { watchBoolean } from '../../utils/prop.validators';\n\n/* types */\n/** de\n * Markiert dieses Element als geöffnet, oder dass das verknüpfte Element (aria-controls/aria-owns) geöffnet ist.\n * (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded)\n */\n/** en\n * Marks this element as open/expanded, or that the connected element (aria-controls/aria-owns) is open/expanded.\n * (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded)\n */\nexport type PropAriaExpanded = {\n\tariaExpanded: boolean;\n};\n\n/* validator */\nexport const validateAriaExpanded = (component: Generic.Element.Component, value?: boolean): void => {\n\twatchBoolean(component, '_ariaExpanded', value);\n};\n","import { Generic } from '@a11y-ui/core';\nimport { watchBoolean } from '../../utils/prop.validators';\n\n/* types */\n/** de\n * Macht das Element nicht fokussierbar und lässt es alle Events ignorieren.\n */\n/** en\n * Makes the element not focusable and ignore all events.\n */\nexport type PropDisabled = {\n\tdisabled: boolean;\n};\n\n/* validator */\nexport const validateDisabled = (component: Generic.Element.Component, value?: boolean): void => {\n\twatchBoolean(component, '_disabled', value);\n};\n","import { Component, Element, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport {\n\tAlternativButtonLinkRole,\n\tButtonStates,\n\tKoliBriButtonCallbacks,\n\tKoliBriButtonType,\n\tKoliBriButtonVariant,\n\tOptionalButtonProps,\n\tOptionalButtonStates,\n\tRequiredButtonProps,\n\tRequiredButtonStates,\n\twatchTooltipAlignment,\n} from '../../types/button-link';\nimport { Stringified } from '../../types/common';\nimport { KoliBriIconProp } from '../../types/icon';\nimport { AriaCurrent, PropAlignment, validateAriaExpanded, validateDisabled } from '../../types/props';\nimport { a11yHintDisabled, devWarning } from '../../utils/a11y.tipps';\nimport { nonce } from '../../utils/dev.utils';\nimport { mapBoolean2String, mapStringOrBoolean2String, setEventTarget, setState, watchBoolean, watchString, watchValidator } from '../../utils/prop.validators';\nimport { propagateFocus } from '../../utils/reuse';\nimport { validateIcon, watchIconAlign } from '../../types/props/icon';\nimport { validateAriaLabelWithLabel, validateLabelWithAriaLabel } from '../../types/props/label';\nimport { validateTabIndex } from '../../utils/validators/tab-index';\nimport { propagateResetEventToForm, propagateSubmitEventToForm } from '../form/controller';\nimport { watchButtonType, watchButtonVariant } from './controller';\n\n/**\n * @internal\n */\n@Component({\n\ttag: 'kol-button-wc',\n\tshadow: false,\n})\nexport class KolButtonWc implements Generic.Element.ComponentApi<RequiredButtonProps, OptionalButtonProps, RequiredButtonStates, OptionalButtonStates> {\n\t@Element() private readonly host?: HTMLKolButtonWcElement;\n\tprivate readonly nonce = nonce();\n\tprivate ref?: HTMLButtonElement;\n\n\tprivate readonly catchRef = (ref?: HTMLButtonElement) => {\n\t\tthis.ref = ref;\n\t\tpropagateFocus(this.host, this.ref);\n\t};\n\n\tprivate readonly onClick = (event: MouseEvent) => {\n\t\tif (this.state._type === 'submit') {\n\t\t\tpropagateSubmitEventToForm({\n\t\t\t\tform: this.host,\n\t\t\t\tref: this.ref,\n\t\t\t});\n\t\t} else if (this.state._type === 'reset') {\n\t\t\tpropagateResetEventToForm({\n\t\t\t\tform: this.host,\n\t\t\t\tref: this.ref,\n\t\t\t});\n\t\t} else if (typeof this.state._on?.onClick === 'function') {\n\t\t\tevent.stopPropagation();\n\t\t\tsetEventTarget(event, this.ref);\n\t\t\tthis.state._on?.onClick(event, this.state._value);\n\t\t} else {\n\t\t\tdevWarning(`It was no button click callback configured!`);\n\t\t}\n\t};\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<button\n\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\taccessKey={this.state._accessKey}\n\t\t\t\t\taria-controls={this.state._ariaControls}\n\t\t\t\t\taria-current={mapStringOrBoolean2String(this.state._ariaCurrent)}\n\t\t\t\t\taria-expanded={mapBoolean2String(this.state._ariaExpanded)}\n\t\t\t\t\taria-label={this.state._iconOnly === false ? this.state._ariaLabel : undefined}\n\t\t\t\t\taria-labelledby={this.state._iconOnly === true ? this.nonce : undefined}\n\t\t\t\t\taria-selected={mapStringOrBoolean2String(this.state._ariaSelected)}\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t[this.state._variant as string]: this.state._variant !== 'custom',\n\t\t\t\t\t\t[this.state._customClass as string]:\n\t\t\t\t\t\t\tthis.state._variant === 'custom' && typeof this.state._customClass === 'string' && this.state._customClass.length > 0,\n\t\t\t\t\t\t'icon-only': this.state._iconOnly === true,\n\t\t\t\t\t}}\n\t\t\t\t\tdisabled={this.state._disabled}\n\t\t\t\t\tid={this.state._id}\n\t\t\t\t\t{...this.state._on}\n\t\t\t\t\tonClick={this.onClick}\n\t\t\t\t\trole={this.state._role}\n\t\t\t\t\ttabIndex={this.state._tabIndex}\n\t\t\t\t\ttype={this.state._type}\n\t\t\t\t>\n\t\t\t\t\t<kol-span-wc _icon={this._icon} _iconOnly={this._iconOnly} _label={this.state._label}>\n\t\t\t\t\t\t{/*\n\t\t\t\t\t\t\tEs ist keine gute Idee hier einen Slot einzufügen, da dadurch ermöglicht wird,\n\t\t\t\t\t\t\tdie Unterstützung hinsichtlich der Barrierefreiheit der Komponente zu umgehen.\n\t\t\t\t\t\t*/}\n\t\t\t\t\t\t<slot name=\"expert\" slot=\"expert\" />\n\t\t\t\t\t</kol-span-wc>\n\t\t\t\t</button>\n\t\t\t\t{this.state._iconOnly === true && (\n\t\t\t\t\t<kol-tooltip\n\t\t\t\t\t\t/**\n\t\t\t\t\t\t * Dieses Aria-Hidden verhindert das doppelte Vorlesen des Labels,\n\t\t\t\t\t\t * verhindert aber nicht das Aria-Labelledby vorgelesen wird.\n\t\t\t\t\t\t */\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t_align={this.state._tooltipAlign}\n\t\t\t\t\t\t_id={this.nonce}\n\t\t\t\t\t\t_label={this.state._ariaLabel || this.state._label}\n\t\t\t\t\t></kol-tooltip>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Gibt an, mit welcher Tastenkombination man den Button auslösen oder fokussieren kann.\n\t */\n\t@Prop() public _accessKey?: string;\n\n\t/**\n\t * Gibt an, welche Elemente kontrolliert werden. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls)\n\t */\n\t@Prop() public _ariaControls?: string;\n\n\t/**\n\t * Gibt an, welchen aktuellen Auswahlstatus der Button hat. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current)\n\t */\n\t@Prop() public _ariaCurrent?: AriaCurrent;\n\n\t/**\n\t * Gibt an, ob durch den Button etwas aufgeklappt wurde. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded)\n\t */\n\t@Prop({ reflect: true }) public _ariaExpanded?: boolean;\n\n\t/**\n\t * Gibt einen beschreibenden Text für den Screenreader an. Damit die\n\t * Sprachsteuerung von interaktiven Elementen funktioniert, muss der\n\t * Aria-Label-Text mit dem Label-Text des Buttons beginnen.\n\t *\n\t * - https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label\n\t */\n\t@Prop({ mutable: true, reflect: false }) public _ariaLabel?: string;\n\n\t/**\n\t * Gibt an, ob Element ausgewählt ist (role=tab). (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected)\n\t */\n\t@Prop({ reflect: true }) public _ariaSelected?: boolean;\n\n\t/**\n\t * Gibt an, welche Custom-Class übergeben werden soll, wenn _variant=\"custom\" gesetzt ist.\n\t */\n\t@Prop() public _customClass?: string;\n\n\t/**\n\t * Gibt an, ob der Button deaktiviert ist.\n\t */\n\t@Prop({ reflect: true }) public _disabled?: boolean = false;\n\n\t/**\n\t * Iconklasse (z.B.: \"codicon codicon-home\")\n\t */\n\t@Prop() public _icon?: Stringified<KoliBriIconProp>;\n\n\t/**\n\t * Gibt an, ob das Icon links oder rechts dargestellt werden soll.\n\t *\n\t * @deprecated\n\t */\n\t@Prop() public _iconAlign?: PropAlignment;\n\n\t/**\n\t * Blendet den Text aus und zeigt nur das gewählte Icon an, der Text wird in den Tooltip verschoben.\n\t */\n\t@Prop({ reflect: true }) public _iconOnly?: boolean = false;\n\n\t/**\n\t * Gibt die ID der Schaltfläche an. (Selection, Testing)\n\t */\n\t@Prop() public _id?: string;\n\n\t/**\n\t * Setzt den sichtbaren Text des Elements.\n\t */\n\t// - eslint-disable-next-line @stencil/strict-mutable\n\t@Prop({ mutable: true, reflect: false }) public _label!: string;\n\n\t/**\n\t * Gibt die EventCallback-Funktionen für die Button-Events an.\n\t */\n\t@Prop() public _on?: KoliBriButtonCallbacks<unknown>;\n\n\t/**\n\t * Gibt an, welche Rolle der Schalter hat.\n\t */\n\t@Prop() public _role?: AlternativButtonLinkRole;\n\n\t/**\n\t * Gibt an, welchen Tab-Index der Button hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)\n\t */\n\t@Prop() public _tabIndex?: number;\n\n\t/**\n\t * Setzt die gewünschte Ausrichtung des Tooltips (`_icon-only`).\n\t */\n\t@Prop() public _tooltipAlign?: PropAlignment = 'top';\n\n\t/**\n\t * Setzt den Typ der Schaltfläche.\n\t */\n\t@Prop() public _type?: KoliBriButtonType = 'button';\n\n\t/**\n\t * Gibt einen Wert an, den der Schalter bei einem Klick zurückgibt.\n\t */\n\t@Prop() public _value?: Stringified<unknown>;\n\n\t/**\n\t * Gibt an, welche Ausprägung der Button hat.\n\t */\n\t@Prop() public _variant?: KoliBriButtonVariant = 'normal';\n\n\t@State() public state: ButtonStates = {\n\t\t_icon: {},\n\t\t_label: '…', // ⚠ required\n\t\t_on: {},\n\t\t_type: 'button',\n\t\t_variant: 'normal',\n\t};\n\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\twatchString(this, '_accessKey', value);\n\t}\n\n\t@Watch('_ariaControls')\n\tpublic validateAriaControls(value?: string): void {\n\t\twatchString(this, '_ariaControls', value);\n\t}\n\n\t@Watch('_ariaCurrent')\n\tpublic validateAriaCurrent(value?: AriaCurrent): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_ariaControls',\n\t\t\t(value) => value === true || value === 'date' || value === 'location' || value === 'page' || value === 'step' || value === 'time',\n\t\t\tnew Set(['boolean', 'String {data, location, page, step, time}']),\n\t\t\tvalue\n\t\t);\n\t}\n\n\t@Watch('_ariaExpanded')\n\tpublic validateAriaExpanded(value?: boolean): void {\n\t\tvalidateAriaExpanded(this, value);\n\t}\n\n\t@Watch('_ariaLabel')\n\tpublic validateAriaLabel(value?: string): void {\n\t\tvalidateAriaLabelWithLabel(this, value);\n\t}\n\n\t@Watch('_ariaSelected')\n\tpublic validateAriaSelected(value?: boolean): void {\n\t\twatchBoolean(this, '_ariaSelected', value);\n\t}\n\n\t@Watch('_customClass')\n\tpublic validateCustomClass(value?: string): void {\n\t\twatchString(this, '_customClass', value, {\n\t\t\tdefaultValue: undefined,\n\t\t});\n\t}\n\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tvalidateDisabled(this, value);\n\t\tif (value === true) {\n\t\t\ta11yHintDisabled();\n\t\t}\n\t}\n\n\t@Watch('_icon')\n\tpublic validateIcon(value?: KoliBriIconProp): void {\n\t\tvalidateIcon(this, value);\n\t}\n\n\t/**\n\t * @deprecated\n\t */\n\n\t@Watch('_iconAlign')\n\tpublic validateIconAlign(value?: PropAlignment): void {\n\t\twatchIconAlign(this, value);\n\t}\n\n\t@Watch('_iconOnly')\n\tpublic validateIconOnly(value?: boolean): void {\n\t\twatchBoolean(this, '_iconOnly', value, {\n\t\t\tdefaultValue: false,\n\t\t\t// hooks: {\n\t\t\t// beforePatch: (_value, nextState) => {\n\t\t\t// let ariaLabel = this.state._ariaLabel;\n\t\t\t// if (nextState.has('_ariaLabel')) {\n\t\t\t// ariaLabel = nextState.get('_ariaLabel') as string;\n\t\t\t// }\n\t\t\t// if (typeof ariaLabel !== 'string' || ariaLabel.length <= 0) {\n\t\t\t// devHint(`[KolButton]: Bevor Icon-Only aktiviert wird, muss ein Aria-Label bzw. Label gesetzt werden.`);\n\t\t\t// nextState.set('_iconOnly', false);\n\t\t\t// }\n\t\t\t// },\n\t\t\t// },\n\t\t});\n\t}\n\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\twatchString(this, '_id', value);\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: string): void {\n\t\tvalidateLabelWithAriaLabel(this, value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: KoliBriButtonCallbacks<unknown>): void {\n\t\tif (typeof value === 'object' && value !== null) {\n\t\t\tthis.state = {\n\t\t\t\t...this.state,\n\t\t\t\t_on: value,\n\t\t\t};\n\t\t}\n\t}\n\n\t@Watch('_role')\n\tpublic validateRole(value?: AlternativButtonLinkRole): void {\n\t\twatchString(this, '_role', value);\n\t}\n\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tvalidateTabIndex(this, value);\n\t}\n\n\t@Watch('_tooltipAlign')\n\tpublic validateTooltipAlign(value?: PropAlignment): void {\n\t\twatchTooltipAlignment(this, '_tooltipAlign', value);\n\t}\n\n\t@Watch('_type')\n\tpublic validateType(value?: KoliBriButtonType): void {\n\t\twatchButtonType(this, '_type', value);\n\t}\n\n\t@Watch('_value')\n\tpublic validateValue(value?: Stringified<unknown>): void {\n\t\tsetState(this, '_value', value);\n\t}\n\n\t@Watch('_variant')\n\tpublic validateVariant(value?: KoliBriButtonVariant): void {\n\t\twatchButtonVariant(this, '_variant', value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAccessKey(this._accessKey);\n\t\tthis.validateAriaControls(this._ariaControls);\n\t\tthis.validateAriaCurrent(this._ariaCurrent);\n\t\tthis.validateAriaExpanded(this._ariaExpanded);\n\t\tthis.validateAriaLabel(this._ariaLabel);\n\t\tthis.validateAriaSelected(this._ariaSelected);\n\t\tthis.validateCustomClass(this._customClass);\n\t\tthis.validateDisabled(this._disabled);\n\t\tthis.validateIcon(this._icon);\n\t\tthis.validateIconAlign(this._iconAlign);\n\t\tthis.validateIconOnly(this._iconOnly);\n\t\tthis.validateId(this._id);\n\t\tthis.validateLabel(this._label);\n\t\tthis.validateOn(this._on);\n\t\tthis.validateRole(this._role);\n\t\tthis.validateTabIndex(this._tabIndex);\n\t\tthis.validateTooltipAlign(this._tooltipAlign);\n\t\tthis.validateType(this._type);\n\t\tthis.validateValue(this._value);\n\t\tthis.validateVariant(this._variant);\n\t}\n}\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { HeadingLevel } from '../../types/heading-level';\nimport { watchString } from '../../utils/prop.validators';\nimport { watchHeadingLevel } from './validation';\n\ntype RequiredProps = {\n\theadline: string;\n};\ntype OptionalProps = {\n\tsecondaryHeadline: string;\n\tlevel: HeadingLevel;\n};\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = {\n\theadline: string;\n\tlevel: HeadingLevel;\n};\ntype OptionalStates = {\n\tsecondaryHeadline: string;\n};\nexport type States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n@Component({\n\ttag: 'kol-heading-wc',\n\tshadow: false,\n})\nexport class KolHeadingWc implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\t/**\n\t * Gibt den Text der Überschrift an.\n\t */\n\t@Prop() public _headline!: string;\n\n\t/**\n\t * Setzt den H-Level, von 1 bis 6, der Überschrift.\n\t */\n\t@Prop() public _level?: HeadingLevel = 1;\n\n\t/**\n\t * Setzt den Text einer weiteren Überschrift, einen Level kleiner, unter der Ersten.\n\t */\n\t@Prop() public _secondaryHeadline?: string;\n\n\t@State() public state: States = {\n\t\t_headline: '…', // ⚠ required\n\t\t_level: 1,\n\t};\n\n\t@Watch('_headline')\n\tpublic validateHeadline(value?: string): void {\n\t\twatchString(this, '_headline', value);\n\t}\n\n\t@Watch('_level')\n\tpublic validateLevel(value?: HeadingLevel): void {\n\t\twatchHeadingLevel(this, value);\n\t}\n\n\t@Watch('_secondaryHeadline')\n\tpublic validateSecondaryHeadline(value?: string): void {\n\t\twatchString(this, '_secondaryHeadline', value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateHeadline(this._headline);\n\t\tthis.validateLevel(this._level);\n\t\tthis.validateSecondaryHeadline(this._secondaryHeadline);\n\t}\n\n\tprivate readonly renderHeadline = (headline: string, level?: number): JSX.Element => {\n\t\tswitch (level) {\n\t\t\tcase 1:\n\t\t\t\treturn (\n\t\t\t\t\t<h1 class=\"headline\">\n\t\t\t\t\t\t{headline}\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</h1>\n\t\t\t\t);\n\t\t\tcase 2:\n\t\t\t\treturn (\n\t\t\t\t\t<h2 class=\"headline\">\n\t\t\t\t\t\t{headline}\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</h2>\n\t\t\t\t);\n\t\t\tcase 3:\n\t\t\t\treturn (\n\t\t\t\t\t<h3 class=\"headline\">\n\t\t\t\t\t\t{headline}\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</h3>\n\t\t\t\t);\n\t\t\tcase 4:\n\t\t\t\treturn (\n\t\t\t\t\t<h4 class=\"headline\">\n\t\t\t\t\t\t{headline}\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</h4>\n\t\t\t\t);\n\t\t\tcase 5:\n\t\t\t\treturn (\n\t\t\t\t\t<h5 class=\"headline\">\n\t\t\t\t\t\t{headline}\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</h5>\n\t\t\t\t);\n\t\t\tcase 6:\n\t\t\t\treturn (\n\t\t\t\t\t<h6 class=\"headline\">\n\t\t\t\t\t\t{headline}\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</h6>\n\t\t\t\t);\n\t\t\tdefault:\n\t\t\t\treturn (\n\t\t\t\t\t<strong class=\"headline\">\n\t\t\t\t\t\t{headline}\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</strong>\n\t\t\t\t);\n\t\t}\n\t};\n\n\tprivate readonly renderSecondaryHeadline = (headline: string, level?: number): JSX.Element => {\n\t\tswitch (level) {\n\t\t\tcase 1: // if the headline is only strong\n\t\t\t\treturn <span class=\"secondary-headline\">{headline}</span>;\n\t\t\tcase 2: // if the headline is h1\n\t\t\t\treturn <h2 class=\"secondary-headline\">{headline}</h2>;\n\t\t\tcase 3: // if the headline is h2\n\t\t\t\treturn <h3 class=\"secondary-headline\">{headline}</h3>;\n\t\t\tcase 4: // if the headline is h3\n\t\t\t\treturn <h4 class=\"secondary-headline\">{headline}</h4>;\n\t\t\tcase 5: // if the headline is h4\n\t\t\t\treturn <h5 class=\"secondary-headline\">{headline}</h5>;\n\t\t\tcase 6: // if the headline is h5\n\t\t\t\treturn <h6 class=\"secondary-headline\">{headline}</h6>;\n\t\t\tdefault: // if the headline is h6\n\t\t\t\treturn <strong class=\"secondary-headline\">{headline}</strong>;\n\t\t}\n\t};\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t{typeof this.state._secondaryHeadline === 'string' && this.state._secondaryHeadline.length > 0 ? (\n\t\t\t\t\t<hgroup>\n\t\t\t\t\t\t{this.renderHeadline(this.state._headline, this.state._level)}\n\t\t\t\t\t\t{this.state._secondaryHeadline && this.renderSecondaryHeadline(this.state._secondaryHeadline, this.state._level + 1)}\n\t\t\t\t\t</hgroup>\n\t\t\t\t) : (\n\t\t\t\t\tthis.renderHeadline(this.state._headline, this.state._level)\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t);\n\t}\n}\n","/* eslint-disable jsx-a11y/label-has-associated-control */\nimport { Component, h, Host, JSX, Prop } from '@stencil/core';\nimport { ButtonProps } from '../../types/button-link';\nimport { Stringified } from '../../types/common';\nimport { KoliBriCustomIcon } from '../../types/icon';\n\nimport { KoliBriHorizontalIcon } from '../../types/icon';\nimport { Props } from './types';\n\n/**\n * @internal\n */\n@Component({\n\ttag: 'kol-input',\n\tshadow: false,\n})\nexport class KolInput implements Props {\n\tpublic render(): JSX.Element {\n\t\tconst hasError = typeof this._error === 'string' && this._error.length > 0 && this._touched === true;\n\t\tconst hasHint = typeof this._hint === 'string' && this._hint.length > 0;\n\t\tconst hideLabel = this._hideLabel === true && this._required !== true;\n\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tclass={{\n\t\t\t\t\tdisabled: this._disabled === true,\n\t\t\t\t\terror: hasError === true,\n\t\t\t\t\t'read-only': this._readOnly === true,\n\t\t\t\t\trequired: this._required === true,\n\t\t\t\t\ttouched: this._touched === true,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{this._renderNoLabel === false && (\n\t\t\t\t\t<label id={`${this._id}-label`} hidden={hideLabel} htmlFor={this._id}>\n\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t<slot name=\"label\"></slot>\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</label>\n\t\t\t\t)}\n\t\t\t\t{hasHint && (\n\t\t\t\t\t<span class=\"hint\" id={`${this._id}-hint`}>\n\t\t\t\t\t\t{this._hint}\n\t\t\t\t\t</span>\n\t\t\t\t)}\n\t\t\t\t<div\n\t\t\t\t\tclass={{\n\t\t\t\t\t\tinput: true,\n\t\t\t\t\t\t'icon-left': typeof this._icon?.left === 'object',\n\t\t\t\t\t\t'icon-right': typeof this._icon?.right === 'object',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{this._icon?.left && <kol-icon _ariaLabel=\"\" _icon={(this._icon.left as KoliBriCustomIcon).icon}></kol-icon>}\n\t\t\t\t\t<slot name=\"input\"></slot>\n\t\t\t\t\t{typeof this._smartButton === 'object' && this._smartButton !== null && (\n\t\t\t\t\t\t<kol-button-wc\n\t\t\t\t\t\t\t_ariaLabel={this._smartButton._ariaLabel}\n\t\t\t\t\t\t\t_customClass={this._smartButton._customClass}\n\t\t\t\t\t\t\t_disabled={this._smartButton._disabled}\n\t\t\t\t\t\t\t_icon={this._smartButton._icon}\n\t\t\t\t\t\t\t_iconOnly={true}\n\t\t\t\t\t\t\t_id={this._smartButton._id}\n\t\t\t\t\t\t\t_label={this._smartButton._label}\n\t\t\t\t\t\t\t_on={this._smartButton._on}\n\t\t\t\t\t\t\t_tooltipAlign={this._smartButton._tooltipAlign}\n\t\t\t\t\t\t\t_variant={this._smartButton._variant}\n\t\t\t\t\t\t></kol-button-wc>\n\t\t\t\t\t)}\n\t\t\t\t\t{this._icon?.right && <kol-icon _ariaLabel=\"\" _icon={(this._icon.right as KoliBriCustomIcon).icon}></kol-icon>}\n\t\t\t\t</div>\n\t\t\t\t{hasError && (\n\t\t\t\t\t<kol-alert class=\"error\" id={`${this._id}-error`} _alert={this._alert} _type=\"error\" _variant=\"msg\">\n\t\t\t\t\t\t{this._error}\n\t\t\t\t\t</kol-alert>\n\t\t\t\t)}\n\t\t\t\t{Array.isArray(this._list) && this._list.length > 0 && (\n\t\t\t\t\t<datalist id={`${this._id}-list`}>\n\t\t\t\t\t\t{this._list.map((option: string) => (\n\t\t\t\t\t\t\t<option value={option} />\n\t\t\t\t\t\t))}\n\t\t\t\t\t</datalist>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Gibt an, ob die Fehlermeldung vorgelesen werden soll, wenn es eine gibt.\n\t */\n\t@Prop({ reflect: true }) public _alert?: boolean = true;\n\n\t/**\n\t * Setzt das Feld in einen inaktiven Zustand, in dem es keine Interaktion erlaubt.\n\t */\n\t@Prop({ reflect: true }) public _disabled?: boolean = false;\n\n\t/**\n\t * Gibt den Text für eine Fehlermeldung an.\n\t */\n\t@Prop() public _error?: string = '';\n\n\t/**\n\t * Versteckt das sichtbare Label des Elements.\n\t */\n\t@Prop({ reflect: true }) public _hideLabel?: boolean = false;\n\n\t/**\n\t * Gibt den Hinweistext an.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * Ermöglicht das Anzeigen von Icons links und/oder rechts am Rand des Eingabefeldes.\n\t */\n\t@Prop() public _icon?: KoliBriHorizontalIcon;\n\n\t/**\n\t * Gibt die technische ID des Eingabefeldes an.\n\t */\n\t@Prop() public _id!: string;\n\n\t/**\n\t * Gibt die Liste der Vorschlagswörter an.\n\t */\n\t@Prop() public _list?: Stringified<string[]>;\n\n\t/**\n\t * Gibt an, ob die Eingabefeld nur lesend ist.\n\t */\n\t@Prop({ reflect: true }) public _readOnly?: boolean = false;\n\n\t/**\n\t * Gibt an, ob die Komponente kein Label rendern soll.\n\t */\n\t@Prop({ reflect: true }) public _renderNoLabel?: boolean = false;\n\n\t/**\n\t * Macht das Eingabeelement zu einem Pflichtfeld.\n\t */\n\t@Prop({ reflect: true }) public _required?: boolean = false;\n\n\t/**\n\t * Ermöglicht eine Schaltfläche ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (ohne label).\n\t */\n\t@Prop() public _smartButton?: ButtonProps;\n\n\t/**\n\t * Gibt an, ob dieses Eingabefeld von Nutzer:innen einmal besucht/berührt wurde.\n\t */\n\t@Prop({ reflect: true }) public _touched?: boolean = false;\n}\n"],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* KoliBri - The accessible HTML-Standard
|
|
3
3
|
*/
|
|
4
|
-
import{r as t,h as i,H as
|
|
4
|
+
import{r as t,h as i,H as n,g as e}from"./index-50adf9a0.js";import{a as s}from"./reuse-3a02afb9.js";const a=":host{--a11y-min-size:44px}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}*[role='button'],button:not([role='link']){min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}a,button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}:host{display:inline-block}:is(a,button){display:inline-flex;place-items:center;text-align:center;text-decoration-line:none}:is(a,button)>kol-span-wc{margin:auto;width:100%}:is(button):disabled{cursor:not-allowed;opacity:0.5}",o=class{constructor(i){t(this,i),this.catchRef=t=>{this.ref=t,s(this.host,this.ref)},this._accessKey=void 0,this._ariaControls=void 0,this._ariaCurrent=void 0,this._ariaExpanded=void 0,this._ariaLabel=void 0,this._ariaSelected=void 0,this._customClass=void 0,this._disabled=!1,this._icon=void 0,this._iconAlign=void 0,this._iconOnly=!1,this._id=void 0,this._label=void 0,this._on=void 0,this._role=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._type="button",this._value=void 0,this._variant="normal"}render(){return i(n,null,i("kol-button-wc",{ref:this.catchRef,class:{button:!0,[this._variant]:"custom"!==this._variant,[this._customClass]:"custom"===this._variant&&"string"==typeof this._customClass&&this._customClass.length>0},_accessKey:this._accessKey,_ariaControls:this._ariaControls,_ariaCurrent:this._ariaCurrent,_ariaExpanded:this._ariaExpanded,_ariaLabel:this._ariaLabel,_ariaSelected:this._ariaSelected,_customClass:this._customClass,_disabled:this._disabled,_icon:this._icon,_iconAlign:this._iconAlign,_iconOnly:this._iconOnly,_id:this._id,_label:this._label,_on:this._on,_role:this._role,_tabIndex:this._tabIndex,_tooltipAlign:this._tooltipAlign,_type:this._type,_value:this._value,_variant:this._variant},i("slot",{name:"expert",slot:"expert"})))}get host(){return e(this)}};o.style={default:a};export{o as kol_button};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["defaultStyleCss","KolButton","this","catchRef","ref","propagateFocus","host","render","h","Host","class","button","_variant","_customClass","length","_accessKey","_ariaControls","_ariaCurrent","_ariaExpanded","_ariaLabel","_ariaSelected","_disabled","_icon","_iconAlign","_iconOnly","_id","_label","_on","_role","_tabIndex","_tooltipAlign","_type","_value","name","slot"],"sources":["./src/components/button/style.css?tag=kol-button&mode=default&encapsulation=shadow","./src/components/button/shadow.tsx"],"sourcesContent":["@import '../button.css';\n","import { Component, Element, h, Host, JSX, Prop } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport {\n\tAlternativButtonLinkRole,\n\tKoliBriButtonCallbacks,\n\tKoliBriButtonType,\n\tKoliBriButtonVariant,\n\tOptionalButtonProps,\n\tRequiredButtonProps,\n} from '../../types/button-link';\nimport { Stringified } from '../../types/common';\nimport { KoliBriIconProp } from '../../types/icon';\nimport { AriaCurrent, PropAlignment } from '../../types/props';\nimport { propagateFocus } from '../../utils/reuse';\n\n@Component({\n\ttag: 'kol-button',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolButton implements Generic.Element.Members<RequiredButtonProps, OptionalButtonProps> {\n\t@Element() private readonly host?: HTMLKolButtonElement;\n\tprivate ref?: HTMLKolButtonWcElement;\n\n\tprivate readonly catchRef = (ref?: HTMLKolButtonWcElement) => {\n\t\tthis.ref = ref;\n\t\tpropagateFocus(this.host, this.ref);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<kol-button-wc\n\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\tclass={{\n\t\t\t\t\t\tbutton: true,\n\t\t\t\t\t\t[this._variant as string]: this._variant !== 'custom',\n\t\t\t\t\t\t[this._customClass as string]: this._variant === 'custom' && typeof this._customClass === 'string' && this._customClass.length > 0,\n\t\t\t\t\t}}\n\t\t\t\t\t_accessKey={this._accessKey}\n\t\t\t\t\t_ariaControls={this._ariaControls}\n\t\t\t\t\t_ariaCurrent={this._ariaCurrent}\n\t\t\t\t\t_ariaExpanded={this._ariaExpanded}\n\t\t\t\t\t_ariaLabel={this._ariaLabel}\n\t\t\t\t\t_ariaSelected={this._ariaSelected}\n\t\t\t\t\t_customClass={this._customClass}\n\t\t\t\t\t_disabled={this._disabled}\n\t\t\t\t\t_icon={this._icon}\n\t\t\t\t\t_iconAlign={this._iconAlign}\n\t\t\t\t\t_iconOnly={this._iconOnly}\n\t\t\t\t\t_id={this._id}\n\t\t\t\t\t_label={this._label}\n\t\t\t\t\t_on={this._on}\n\t\t\t\t\t_role={this._role}\n\t\t\t\t\t_tabIndex={this._tabIndex}\n\t\t\t\t\t_tooltipAlign={this._tooltipAlign}\n\t\t\t\t\t_type={this._type}\n\t\t\t\t\t_value={this._value}\n\t\t\t\t\t_variant={this._variant}\n\t\t\t\t>\n\t\t\t\t\t{/*\n\t\t\t\t\t\tEs ist keine gute Idee hier einen Slot einzufügen, da dadurch ermöglicht wird,\n\t\t\t\t\t\tdie Unterstützung hinsichtlich der Barrierefreiheit der Komponente zu umgehen.\n\t\t\t\t\t*/}\n\t\t\t\t\t<slot name=\"expert\" slot=\"expert\" />\n\t\t\t\t</kol-button-wc>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Gibt an, mit welcher Tastenkombination man den Button auslösen oder fokussieren kann.\n\t */\n\t@Prop() public _accessKey?: string;\n\n\t/**\n\t * Gibt an, welche Elemente kontrolliert werden. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls)\n\t */\n\t@Prop() public _ariaControls?: string;\n\n\t/**\n\t * Gibt an, welchen aktuellen Auswahlstatus der Button hat. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current)\n\t */\n\t@Prop() public _ariaCurrent?: AriaCurrent;\n\n\t/**\n\t * Gibt an, ob durch den Button etwas aufgeklappt wurde. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded)\n\t */\n\t@Prop({ reflect: true }) public _ariaExpanded?: boolean;\n\n\t/**\n\t * Gibt einen beschreibenden Text des Buttons an. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label)\n\t */\n\t@Prop() public _ariaLabel?: string;\n\n\t/**\n\t * Gibt an, ob Element ausgewählt ist (role=tab). (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected)\n\t */\n\t@Prop({ reflect: true }) public _ariaSelected?: boolean;\n\n\t/**\n\t * Gibt an, welche Custom-Class übergeben werden soll, wenn _variant=\"custom\" gesetzt ist.\n\t */\n\t@Prop() public _customClass?: string;\n\n\t/**\n\t * Gibt an, ob der Button deaktiviert ist.\n\t */\n\t@Prop({ reflect: true }) public _disabled?: boolean = false;\n\n\t/**\n\t * Iconklasse (z.B.: \"codicon codicon-home\")\n\t */\n\t@Prop() public _icon?: Stringified<KoliBriIconProp>;\n\n\t/**\n\t * Gibt an, ob das Icon links oder rechts dargestellt werden soll.\n\t *\n\t * @deprecated\n\t */\n\t@Prop() public _iconAlign?: PropAlignment;\n\n\t/**\n\t * Gibt an, ob nur das Icon angezeigt wird.\n\t */\n\t@Prop({ reflect: true }) public _iconOnly?: boolean = false;\n\n\t/**\n\t * Gibt die ID der Schaltfläche an.\n\t */\n\t@Prop() public _id?: string;\n\n\t/**\n\t * Setzt den sichtbaren Text des Elements.\n\t */\n\t@Prop() public _label!: string;\n\n\t/**\n\t * Gibt die EventCallback-Funktionen für die Button-Events an.\n\t */\n\t@Prop() public _on?: KoliBriButtonCallbacks<unknown>;\n\n\t/**\n\t * Gibt an, welche Role der Schalter hat.\n\t */\n\t@Prop() public _role?: AlternativButtonLinkRole;\n\n\t/**\n\t * Gibt an, welchen Tab-Index der Button hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)\n\t */\n\t@Prop() public _tabIndex?: number;\n\n\t/**\n\t * Gibt an, ob der Tooltip oben, rechts, unten oder links angezeigt werden soll.\n\t */\n\t@Prop() public _tooltipAlign?: PropAlignment = 'top';\n\n\t/**\n\t * Gibt an, welche Typ der Button hat.\n\t */\n\t@Prop() public _type?: KoliBriButtonType = 'button';\n\n\t/**\n\t * Gibt einen Wert an, den der Schalter bei einem Klick zurückgibt.\n\t */\n\t@Prop() public _value?: Stringified<unknown>;\n\n\t/**\n\t * Gibt an, welche Ausprägung der Button hat.\n\t */\n\t@Prop() public _variant?: KoliBriButtonVariant = 'normal';\n}\n"],"mappings":";;;qGAAA,MAAMA,EAAkB,
|
|
1
|
+
{"version":3,"names":["defaultStyleCss","KolButton","this","catchRef","ref","propagateFocus","host","render","h","Host","class","button","_variant","_customClass","length","_accessKey","_ariaControls","_ariaCurrent","_ariaExpanded","_ariaLabel","_ariaSelected","_disabled","_icon","_iconAlign","_iconOnly","_id","_label","_on","_role","_tabIndex","_tooltipAlign","_type","_value","name","slot"],"sources":["./src/components/button/style.css?tag=kol-button&mode=default&encapsulation=shadow","./src/components/button/shadow.tsx"],"sourcesContent":["@import '../button.css';\n","import { Component, Element, h, Host, JSX, Prop } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport {\n\tAlternativButtonLinkRole,\n\tKoliBriButtonCallbacks,\n\tKoliBriButtonType,\n\tKoliBriButtonVariant,\n\tOptionalButtonProps,\n\tRequiredButtonProps,\n} from '../../types/button-link';\nimport { Stringified } from '../../types/common';\nimport { KoliBriIconProp } from '../../types/icon';\nimport { AriaCurrent, PropAlignment } from '../../types/props';\nimport { propagateFocus } from '../../utils/reuse';\n\n@Component({\n\ttag: 'kol-button',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolButton implements Generic.Element.Members<RequiredButtonProps, OptionalButtonProps> {\n\t@Element() private readonly host?: HTMLKolButtonElement;\n\tprivate ref?: HTMLKolButtonWcElement;\n\n\tprivate readonly catchRef = (ref?: HTMLKolButtonWcElement) => {\n\t\tthis.ref = ref;\n\t\tpropagateFocus(this.host, this.ref);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<kol-button-wc\n\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\tclass={{\n\t\t\t\t\t\tbutton: true,\n\t\t\t\t\t\t[this._variant as string]: this._variant !== 'custom',\n\t\t\t\t\t\t[this._customClass as string]: this._variant === 'custom' && typeof this._customClass === 'string' && this._customClass.length > 0,\n\t\t\t\t\t}}\n\t\t\t\t\t_accessKey={this._accessKey}\n\t\t\t\t\t_ariaControls={this._ariaControls}\n\t\t\t\t\t_ariaCurrent={this._ariaCurrent}\n\t\t\t\t\t_ariaExpanded={this._ariaExpanded}\n\t\t\t\t\t_ariaLabel={this._ariaLabel}\n\t\t\t\t\t_ariaSelected={this._ariaSelected}\n\t\t\t\t\t_customClass={this._customClass}\n\t\t\t\t\t_disabled={this._disabled}\n\t\t\t\t\t_icon={this._icon}\n\t\t\t\t\t_iconAlign={this._iconAlign}\n\t\t\t\t\t_iconOnly={this._iconOnly}\n\t\t\t\t\t_id={this._id}\n\t\t\t\t\t_label={this._label}\n\t\t\t\t\t_on={this._on}\n\t\t\t\t\t_role={this._role}\n\t\t\t\t\t_tabIndex={this._tabIndex}\n\t\t\t\t\t_tooltipAlign={this._tooltipAlign}\n\t\t\t\t\t_type={this._type}\n\t\t\t\t\t_value={this._value}\n\t\t\t\t\t_variant={this._variant}\n\t\t\t\t>\n\t\t\t\t\t{/*\n\t\t\t\t\t\tEs ist keine gute Idee hier einen Slot einzufügen, da dadurch ermöglicht wird,\n\t\t\t\t\t\tdie Unterstützung hinsichtlich der Barrierefreiheit der Komponente zu umgehen.\n\t\t\t\t\t*/}\n\t\t\t\t\t<slot name=\"expert\" slot=\"expert\" />\n\t\t\t\t</kol-button-wc>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Gibt an, mit welcher Tastenkombination man den Button auslösen oder fokussieren kann.\n\t */\n\t@Prop() public _accessKey?: string;\n\n\t/**\n\t * Gibt an, welche Elemente kontrolliert werden. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls)\n\t */\n\t@Prop() public _ariaControls?: string;\n\n\t/**\n\t * Gibt an, welchen aktuellen Auswahlstatus der Button hat. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current)\n\t */\n\t@Prop() public _ariaCurrent?: AriaCurrent;\n\n\t/**\n\t * Gibt an, ob durch den Button etwas aufgeklappt wurde. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded)\n\t */\n\t@Prop({ reflect: true }) public _ariaExpanded?: boolean;\n\n\t/**\n\t * Gibt einen beschreibenden Text des Buttons an. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label)\n\t */\n\t@Prop() public _ariaLabel?: string;\n\n\t/**\n\t * Gibt an, ob Element ausgewählt ist (role=tab). (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected)\n\t */\n\t@Prop({ reflect: true }) public _ariaSelected?: boolean;\n\n\t/**\n\t * Gibt an, welche Custom-Class übergeben werden soll, wenn _variant=\"custom\" gesetzt ist.\n\t */\n\t@Prop() public _customClass?: string;\n\n\t/**\n\t * Gibt an, ob der Button deaktiviert ist.\n\t */\n\t@Prop({ reflect: true }) public _disabled?: boolean = false;\n\n\t/**\n\t * Iconklasse (z.B.: \"codicon codicon-home\")\n\t */\n\t@Prop() public _icon?: Stringified<KoliBriIconProp>;\n\n\t/**\n\t * Gibt an, ob das Icon links oder rechts dargestellt werden soll.\n\t *\n\t * @deprecated\n\t */\n\t@Prop() public _iconAlign?: PropAlignment;\n\n\t/**\n\t * Gibt an, ob nur das Icon angezeigt wird.\n\t */\n\t@Prop({ reflect: true }) public _iconOnly?: boolean = false;\n\n\t/**\n\t * Gibt die ID der Schaltfläche an.\n\t */\n\t@Prop() public _id?: string;\n\n\t/**\n\t * Setzt den sichtbaren Text des Elements.\n\t */\n\t@Prop() public _label!: string;\n\n\t/**\n\t * Gibt die EventCallback-Funktionen für die Button-Events an.\n\t */\n\t@Prop() public _on?: KoliBriButtonCallbacks<unknown>;\n\n\t/**\n\t * Gibt an, welche Role der Schalter hat.\n\t */\n\t@Prop() public _role?: AlternativButtonLinkRole;\n\n\t/**\n\t * Gibt an, welchen Tab-Index der Button hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)\n\t */\n\t@Prop() public _tabIndex?: number;\n\n\t/**\n\t * Gibt an, ob der Tooltip oben, rechts, unten oder links angezeigt werden soll.\n\t */\n\t@Prop() public _tooltipAlign?: PropAlignment = 'top';\n\n\t/**\n\t * Gibt an, welche Typ der Button hat.\n\t */\n\t@Prop() public _type?: KoliBriButtonType = 'button';\n\n\t/**\n\t * Gibt einen Wert an, den der Schalter bei einem Klick zurückgibt.\n\t */\n\t@Prop() public _value?: Stringified<unknown>;\n\n\t/**\n\t * Gibt an, welche Ausprägung der Button hat.\n\t */\n\t@Prop() public _variant?: KoliBriButtonVariant = 'normal';\n}\n"],"mappings":";;;qGAAA,MAAMA,EAAkB,s2B,MCuBXC,EAAS,M,yBAIJC,KAAAC,SAAYC,IAC5BF,KAAKE,IAAMA,EACXC,EAAeH,KAAKI,KAAMJ,KAAKE,IAAI,E,kNAkFkB,M,8DAiBA,M,6HA8BP,M,WAKJ,S,oCAUM,Q,CA7I1CG,SACN,OACCC,EAACC,EAAI,KACJD,EAAA,iBACCJ,IAAKF,KAAKC,SACVO,MAAO,CACNC,OAAQ,KACR,CAACT,KAAKU,UAAqBV,KAAKU,WAAa,SAC7C,CAACV,KAAKW,cAAyBX,KAAKU,WAAa,iBAAmBV,KAAKW,eAAiB,UAAYX,KAAKW,aAAaC,OAAS,GAElIC,WAAYb,KAAKa,WACjBC,cAAed,KAAKc,cACpBC,aAAcf,KAAKe,aACnBC,cAAehB,KAAKgB,cACpBC,WAAYjB,KAAKiB,WACjBC,cAAelB,KAAKkB,cACpBP,aAAcX,KAAKW,aACnBQ,UAAWnB,KAAKmB,UAChBC,MAAOpB,KAAKoB,MACZC,WAAYrB,KAAKqB,WACjBC,UAAWtB,KAAKsB,UAChBC,IAAKvB,KAAKuB,IACVC,OAAQxB,KAAKwB,OACbC,IAAKzB,KAAKyB,IACVC,MAAO1B,KAAK0B,MACZC,UAAW3B,KAAK2B,UAChBC,cAAe5B,KAAK4B,cACpBC,MAAO7B,KAAK6B,MACZC,OAAQ9B,KAAK8B,OACbpB,SAAUV,KAAKU,UAMfJ,EAAA,QAAMyB,KAAK,SAASC,KAAK,Y"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* KoliBri - The accessible HTML-Standard
|
|
3
3
|
*/
|
|
4
|
-
import{r as t,h as e,H as i}from"./index-50adf9a0.js";import{b as a,w as
|
|
4
|
+
import{r as t,h as e,H as i}from"./index-50adf9a0.js";import{b as a,w as s}from"./prop.validators-e402ad49.js";import{w as n}from"./validation-a42d9cc9.js";import"./a11y.tipps-1cea9822.js";import"./dev.utils-157f0499.js";import"./reuse-3a02afb9.js";import"./index-81bd9b41.js";const o=(e,t)=>{a(e,"_hasFooter",t)},r=":host{--a11y-min-size:44px}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}*[role='button'],button:not([role='link']){min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}a,button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}",d=class{constructor(e){t(this,e),this._hasFooter=!1,this._heading=void 0,this._headline=void 0,this._level=1,this.state={_heading:"…"}}render(){return e(i,null,e("div",null,e("div",{class:"header"},e("kol-heading-wc",{_headline:this.state._heading,_level:this.state._level}),e("slot",{name:"header"})),e("div",{class:"content"},e("slot",{name:"content"})),this.state._hasFooter&&e("div",{class:"footer"},e("slot",{name:"footer"}))))}validateHasFooter(e){o(this,e)}validateHeading(e){s(this,"_heading",e,{required:!0})}validateHeadline(e){this.validateHeading(e)}validateLevel(e){n(this,e)}componentWillLoad(){this.validateHasFooter(this._hasFooter),this.validateHeading(this._heading||this._headline),this.validateLevel(this._level)}static get watchers(){return{_hasFooter:["validateHasFooter"],_heading:["validateHeading"],_headline:["validateHeadline"],_level:["validateLevel"]}}};d.style={default:r};export{d as kol_card};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["validateHasFooter","component","value","watchBoolean","defaultStyleCss","KolCard","_heading","render","h","Host","class","_headline","this","state","_level","name","_hasFooter","validateHeading","watchString","required","validateHeadline","validateLevel","watchHeadingLevel","componentWillLoad"],"sources":["./src/types/props/has-footer.ts","./src/components/card/style.css?tag=kol-card&mode=default&encapsulation=shadow","./src/components/card/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { watchBoolean } from '../../utils/prop.validators';\n\n/* types */\n/** de\n * Zeigt den slot=\"footer\" an.\n */\n/** en\n * Shows the slot=\"footer\".\n */\nexport type PropHasFooter = {\n\thasFooter: boolean;\n};\n\n/* validator */\nexport const validateHasFooter = (component: Generic.Element.Component, value?: boolean): void => {\n\twatchBoolean(component, '_hasFooter', value);\n};\n","@import '../style.css';\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { HeadingLevel } from '../../types/heading-level';\nimport { watchString } from '../../utils/prop.validators';\nimport { watchHeadingLevel } from '../heading/validation';\nimport { PropHasFooter, validateHasFooter } from '../../types/props';\n\ntype RequiredProps = {\n\theading: string;\n};\ntype OptionalProps = {\n\t/**\n\t * @deprecated Use _headline instead\n\t */\n\theadline: string;\n\tlevel: HeadingLevel;\n} & PropHasFooter;\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = RequiredProps;\ntype OptionalStates = OptionalProps;\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n/**\n * @slot header - Ermöglicht das Einfügen beliebigen HTML's in den Kopfbereich unterhalb der Überschrift der Card.\n * @slot footer - Ermöglicht das Einfügen beliebigen HTML's in den Fußbereich der Card.\n * @slot content - Ermöglicht das Einfügen beliebigen HTML's in den Inhaltsbereich der Card.\n */\n@Component({\n\ttag: 'kol-card',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolCard implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<div>\n\t\t\t\t\t<div class=\"header\">\n\t\t\t\t\t\t<kol-heading-wc _headline={this.state._heading} _level={this.state._level}></kol-heading-wc>\n\t\t\t\t\t\t<slot name=\"header\" />\n\t\t\t\t\t</div>\n\t\t\t\t\t<div class=\"content\">\n\t\t\t\t\t\t<slot name=\"content\" />\n\t\t\t\t\t</div>\n\t\t\t\t\t{this.state._hasFooter && (\n\t\t\t\t\t\t<div class=\"footer\">\n\t\t\t\t\t\t\t<slot name=\"footer\" />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Macht den Footerbereich der Card sichtbar.\n\t */\n\t@Prop({ reflect: true }) public _hasFooter?: boolean = false;\n\n\t/**\n\t * Gibt die Überschrift der Card an.\n\t */\n\t@Prop() public _heading!: string;\n\n\t/**\n\t * Gibt die Überschrift der Card an.\n\t *\n\t * @deprecated Verwende stattdessen das Property _heading.\n\t */\n\t@Prop() public _headline?: string;\n\n\t/**\n\t * Setzt den H-Level, von 1 bis 6, der Überschrift.\n\t */\n\t@Prop() public _level?: HeadingLevel = 1;\n\n\t@State() public state: States = {\n\t\t_heading: '…', // '⚠'\n\t};\n\n\t@Watch('_hasFooter')\n\tpublic validateHasFooter(value?: boolean): void {\n\t\tvalidateHasFooter(this, value);\n\t}\n\n\t@Watch('_heading')\n\tpublic validateHeading(value?: string): void {\n\t\twatchString(this, '_heading', value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t * @deprecated\n\t */\n\t@Watch('_headline')\n\tpublic validateHeadline(value?: string): void {\n\t\tthis.validateHeading(value);\n\t}\n\n\t@Watch('_level')\n\tpublic validateLevel(value?: HeadingLevel): void {\n\t\twatchHeadingLevel(this, value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateHasFooter(this._hasFooter);\n\t\tthis.validateHeading(this._heading || this._headline);\n\t\tthis.validateLevel(this._level);\n\t}\n}\n"],"mappings":";;;qRAeO,MAAMA,EAAoB,CAACC,EAAsCC,KACvEC,EAAaF,EAAW,aAAcC,EAAM,EChB7C,MAAME,EAAkB,
|
|
1
|
+
{"version":3,"names":["validateHasFooter","component","value","watchBoolean","defaultStyleCss","KolCard","_heading","render","h","Host","class","_headline","this","state","_level","name","_hasFooter","validateHeading","watchString","required","validateHeadline","validateLevel","watchHeadingLevel","componentWillLoad"],"sources":["./src/types/props/has-footer.ts","./src/components/card/style.css?tag=kol-card&mode=default&encapsulation=shadow","./src/components/card/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\nimport { watchBoolean } from '../../utils/prop.validators';\n\n/* types */\n/** de\n * Zeigt den slot=\"footer\" an.\n */\n/** en\n * Shows the slot=\"footer\".\n */\nexport type PropHasFooter = {\n\thasFooter: boolean;\n};\n\n/* validator */\nexport const validateHasFooter = (component: Generic.Element.Component, value?: boolean): void => {\n\twatchBoolean(component, '_hasFooter', value);\n};\n","@import '../style.css';\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { HeadingLevel } from '../../types/heading-level';\nimport { watchString } from '../../utils/prop.validators';\nimport { watchHeadingLevel } from '../heading/validation';\nimport { PropHasFooter, validateHasFooter } from '../../types/props';\n\ntype RequiredProps = {\n\theading: string;\n};\ntype OptionalProps = {\n\t/**\n\t * @deprecated Use _headline instead\n\t */\n\theadline: string;\n\tlevel: HeadingLevel;\n} & PropHasFooter;\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = RequiredProps;\ntype OptionalStates = OptionalProps;\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n/**\n * @slot header - Ermöglicht das Einfügen beliebigen HTML's in den Kopfbereich unterhalb der Überschrift der Card.\n * @slot footer - Ermöglicht das Einfügen beliebigen HTML's in den Fußbereich der Card.\n * @slot content - Ermöglicht das Einfügen beliebigen HTML's in den Inhaltsbereich der Card.\n */\n@Component({\n\ttag: 'kol-card',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolCard implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<div>\n\t\t\t\t\t<div class=\"header\">\n\t\t\t\t\t\t<kol-heading-wc _headline={this.state._heading} _level={this.state._level}></kol-heading-wc>\n\t\t\t\t\t\t<slot name=\"header\" />\n\t\t\t\t\t</div>\n\t\t\t\t\t<div class=\"content\">\n\t\t\t\t\t\t<slot name=\"content\" />\n\t\t\t\t\t</div>\n\t\t\t\t\t{this.state._hasFooter && (\n\t\t\t\t\t\t<div class=\"footer\">\n\t\t\t\t\t\t\t<slot name=\"footer\" />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Macht den Footerbereich der Card sichtbar.\n\t */\n\t@Prop({ reflect: true }) public _hasFooter?: boolean = false;\n\n\t/**\n\t * Gibt die Überschrift der Card an.\n\t */\n\t@Prop() public _heading!: string;\n\n\t/**\n\t * Gibt die Überschrift der Card an.\n\t *\n\t * @deprecated Verwende stattdessen das Property _heading.\n\t */\n\t@Prop() public _headline?: string;\n\n\t/**\n\t * Setzt den H-Level, von 1 bis 6, der Überschrift.\n\t */\n\t@Prop() public _level?: HeadingLevel = 1;\n\n\t@State() public state: States = {\n\t\t_heading: '…', // '⚠'\n\t};\n\n\t@Watch('_hasFooter')\n\tpublic validateHasFooter(value?: boolean): void {\n\t\tvalidateHasFooter(this, value);\n\t}\n\n\t@Watch('_heading')\n\tpublic validateHeading(value?: string): void {\n\t\twatchString(this, '_heading', value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\t/**\n\t * @see: components/abbr/component.tsx (@Watch)\n\t * @deprecated\n\t */\n\t@Watch('_headline')\n\tpublic validateHeadline(value?: string): void {\n\t\tthis.validateHeading(value);\n\t}\n\n\t@Watch('_level')\n\tpublic validateLevel(value?: HeadingLevel): void {\n\t\twatchHeadingLevel(this, value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateHasFooter(this._hasFooter);\n\t\tthis.validateHeading(this._heading || this._headline);\n\t\tthis.validateLevel(this._level);\n\t}\n}\n"],"mappings":";;;qRAeO,MAAMA,EAAoB,CAACC,EAAsCC,KACvEC,EAAaF,EAAW,aAAcC,EAAM,EChB7C,MAAME,EAAkB,qoB,MCoCXC,EAAO,M,yCAyBoC,M,6DAiBhB,E,WAEP,CAC/BC,SAAU,I,CA5CJC,SACN,OACCC,EAACC,EAAI,KACJD,EAAA,WACCA,EAAA,OAAKE,MAAM,UACVF,EAAA,kBAAgBG,UAAWC,KAAKC,MAAMP,SAAUQ,OAAQF,KAAKC,MAAMC,SACnEN,EAAA,QAAMO,KAAK,YAEZP,EAAA,OAAKE,MAAM,WACVF,EAAA,QAAMO,KAAK,aAEXH,KAAKC,MAAMG,YACXR,EAAA,OAAKE,MAAM,UACVF,EAAA,QAAMO,KAAK,a,CAmCVf,kBAAkBE,GACxBF,EAAkBY,KAAMV,E,CAIlBe,gBAAgBf,GACtBgB,EAAYN,KAAM,WAAYV,EAAO,CACpCiB,SAAU,M,CASLC,iBAAiBlB,GACvBU,KAAKK,gBAAgBf,E,CAIfmB,cAAcnB,GACpBoB,EAAkBV,KAAMV,E,CAGlBqB,oBACNX,KAAKZ,kBAAkBY,KAAKI,YAC5BJ,KAAKK,gBAAgBL,KAAKN,UAAYM,KAAKD,WAC3CC,KAAKS,cAAcT,KAAKE,O"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* KoliBri - The accessible HTML-Standard
|
|
3
3
|
*/
|
|
4
|
-
import{r as t,h as
|
|
4
|
+
import{r as t,h as i,H as e}from"./index-50adf9a0.js";import{b as o,w as a}from"./prop.validators-e402ad49.js";import"./a11y.tipps-1cea9822.js";import"./dev.utils-157f0499.js";import"./reuse-3a02afb9.js";import"./index-81bd9b41.js";const s=":host{--a11y-min-size:44px}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}*[role='button'],button:not([role='link']){min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}a,button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}:host{display:block}details{display:grid}details>summary{cursor:pointer;display:flex;place-items:center}details>summary>span{border-bottom-color:grey;border-bottom-style:solid}details[open]>summary>span,details>summary:focus>span,details>summary:hover>span{border-bottom-color:black}details>kol-indented-text{margin:0.25em 0px 0px 0.5em}",n=class{constructor(i){t(this,i),this.onClick=()=>{setTimeout((()=>{var t;this._open=null===(t=this.htmlDetailsElement)||void 0===t?void 0:t.open}),25)},this._open=!1,this._summary=void 0,this.state={_summary:"…"}}render(){return i(e,null,i("details",{ref:t=>{this.htmlDetailsElement=t},open:this.state._open},i("summary",{onClick:this.onClick},this.state._open?i("kol-icon",{_ariaLabel:"",_icon:"codicon codicon-chevron-down"}):i("kol-icon",{_ariaLabel:"",_icon:"codicon codicon-chevron-right"}),i("span",null,this.state._summary)),i("kol-indented-text",null,i("slot",null))))}validateOpen(t){o(this,"_open",t)}validateSummary(t){a(this,"_summary",t,{required:!0})}componentWillLoad(){this.validateOpen(this._open),this.validateSummary(this._summary)}static get watchers(){return{_open:["validateOpen"],_summary:["validateSummary"]}}};n.style={default:s};export{n as kol_details};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["defaultStyleCss","KolDetails","this","onClick","setTimeout","_open","_a","htmlDetailsElement","open","_summary","render","h","Host","ref","el","state","_ariaLabel","_icon","validateOpen","value","watchBoolean","validateSummary","watchString","required","componentWillLoad"],"sources":["./src/components/details/style.css?tag=kol-details&mode=default&encapsulation=shadow","./src/components/details/component.tsx"],"sourcesContent":["@import '../style.css';\n@import '../host-display-block.css';\n\ndetails {\n\tdisplay: grid;\n}\ndetails > summary {\n\tcursor: pointer;\n\tdisplay: flex;\n\tplace-items: center;\n}\ndetails > summary > span {\n\tborder-bottom-color: grey;\n\tborder-bottom-style: solid;\n}\ndetails[open] > summary > span,\ndetails > summary:focus > span,\ndetails > summary:hover > span {\n\tborder-bottom-color: black;\n}\ndetails > kol-indented-text {\n\tmargin: 0.25em 0px 0px 0.5em;\n}\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { watchBoolean, watchString } from '../../utils/prop.validators';\n\ntype RequiredProps = {\n\tsummary: string;\n};\ntype OptionalProps = {\n\topen: boolean;\n};\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = RequiredProps;\ntype OptionalStates = OptionalProps;\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n@Component({\n\ttag: 'kol-details',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolDetails implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\tprivate htmlDetailsElement?: HTMLDetailsElement;\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<details\n\t\t\t\t\tref={(el) => {\n\t\t\t\t\t\tthis.htmlDetailsElement = el as HTMLDetailsElement;\n\t\t\t\t\t}}\n\t\t\t\t\topen={this.state._open}\n\t\t\t\t>\n\t\t\t\t\t<summary onClick={this.onClick}>\n\t\t\t\t\t\t{this.state._open ? (\n\t\t\t\t\t\t\t<kol-icon _ariaLabel=\"\" _icon=\"codicon codicon-chevron-down\" />\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<kol-icon _ariaLabel=\"\" _icon=\"codicon codicon-chevron-right\" />\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<span>{this.state._summary}</span>\n\t\t\t\t\t</summary>\n\t\t\t\t\t<kol-indented-text>\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</kol-indented-text>\n\t\t\t\t</details>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Gibt an, ob die Detailbeschreibung geöffnet oder geschlossen ist.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _open?: boolean = false;\n\n\t/**\n\t * Gibt die Zusammenfassung der Detailbeschreibung an.\n\t */\n\t@Prop() public _summary!: string;\n\n\t@State() public state: States = {\n\t\t_summary: '…', // '⚠'\n\t};\n\n\t@Watch('_open')\n\tpublic validateOpen(value?: boolean): void {\n\t\twatchBoolean(this, '_open', value);\n\t}\n\n\t@Watch('_summary')\n\tpublic validateSummary(value?: string): void {\n\t\twatchString(this, '_summary', value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateOpen(this._open);\n\t\tthis.validateSummary(this._summary);\n\t}\n\n\tprivate onClick = () => {\n\t\tsetTimeout(() => {\n\t\t\tthis._open = this.htmlDetailsElement?.open;\n\t\t}, 25);\n\t};\n}\n"],"mappings":";;;wOAAA,MAAMA,EAAkB,
|
|
1
|
+
{"version":3,"names":["defaultStyleCss","KolDetails","this","onClick","setTimeout","_open","_a","htmlDetailsElement","open","_summary","render","h","Host","ref","el","state","_ariaLabel","_icon","validateOpen","value","watchBoolean","validateSummary","watchString","required","componentWillLoad"],"sources":["./src/components/details/style.css?tag=kol-details&mode=default&encapsulation=shadow","./src/components/details/component.tsx"],"sourcesContent":["@import '../style.css';\n@import '../host-display-block.css';\n\ndetails {\n\tdisplay: grid;\n}\ndetails > summary {\n\tcursor: pointer;\n\tdisplay: flex;\n\tplace-items: center;\n}\ndetails > summary > span {\n\tborder-bottom-color: grey;\n\tborder-bottom-style: solid;\n}\ndetails[open] > summary > span,\ndetails > summary:focus > span,\ndetails > summary:hover > span {\n\tborder-bottom-color: black;\n}\ndetails > kol-indented-text {\n\tmargin: 0.25em 0px 0px 0.5em;\n}\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\nimport { watchBoolean, watchString } from '../../utils/prop.validators';\n\ntype RequiredProps = {\n\tsummary: string;\n};\ntype OptionalProps = {\n\topen: boolean;\n};\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = RequiredProps;\ntype OptionalStates = OptionalProps;\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n@Component({\n\ttag: 'kol-details',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolDetails implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\tprivate htmlDetailsElement?: HTMLDetailsElement;\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<details\n\t\t\t\t\tref={(el) => {\n\t\t\t\t\t\tthis.htmlDetailsElement = el as HTMLDetailsElement;\n\t\t\t\t\t}}\n\t\t\t\t\topen={this.state._open}\n\t\t\t\t>\n\t\t\t\t\t<summary onClick={this.onClick}>\n\t\t\t\t\t\t{this.state._open ? (\n\t\t\t\t\t\t\t<kol-icon _ariaLabel=\"\" _icon=\"codicon codicon-chevron-down\" />\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<kol-icon _ariaLabel=\"\" _icon=\"codicon codicon-chevron-right\" />\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<span>{this.state._summary}</span>\n\t\t\t\t\t</summary>\n\t\t\t\t\t<kol-indented-text>\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</kol-indented-text>\n\t\t\t\t</details>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Gibt an, ob die Detailbeschreibung geöffnet oder geschlossen ist.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _open?: boolean = false;\n\n\t/**\n\t * Gibt die Zusammenfassung der Detailbeschreibung an.\n\t */\n\t@Prop() public _summary!: string;\n\n\t@State() public state: States = {\n\t\t_summary: '…', // '⚠'\n\t};\n\n\t@Watch('_open')\n\tpublic validateOpen(value?: boolean): void {\n\t\twatchBoolean(this, '_open', value);\n\t}\n\n\t@Watch('_summary')\n\tpublic validateSummary(value?: string): void {\n\t\twatchString(this, '_summary', value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateOpen(this._open);\n\t\tthis.validateSummary(this._summary);\n\t}\n\n\tprivate onClick = () => {\n\t\tsetTimeout(() => {\n\t\t\tthis._open = this.htmlDetailsElement?.open;\n\t\t}, 25);\n\t};\n}\n"],"mappings":";;;wOAAA,MAAMA,EAAkB,s9B,MCwBXC,EAAU,M,yBA2DdC,KAAAC,QAAU,KACjBC,YAAW,K,MACVF,KAAKG,OAAQC,EAAAJ,KAAKK,sBAAkB,MAAAD,SAAA,SAAAA,EAAEE,IAAI,GACxC,GAAG,E,WA/B0D,M,mCAOjC,CAC/BC,SAAU,I,CApCJC,SACN,OACCC,EAACC,EAAI,KACJD,EAAA,WACCE,IAAMC,IACLZ,KAAKK,mBAAqBO,CAAwB,EAEnDN,KAAMN,KAAKa,MAAMV,OAEjBM,EAAA,WAASR,QAASD,KAAKC,SACrBD,KAAKa,MAAMV,MACXM,EAAA,YAAUK,WAAW,GAAGC,MAAM,iCAE9BN,EAAA,YAAUK,WAAW,GAAGC,MAAM,kCAE/BN,EAAA,YAAOT,KAAKa,MAAMN,WAEnBE,EAAA,yBACCA,EAAA,e,CAsBEO,aAAaC,GACnBC,EAAalB,KAAM,QAASiB,E,CAItBE,gBAAgBF,GACtBG,EAAYpB,KAAM,WAAYiB,EAAO,CACpCI,SAAU,M,CAILC,oBACNtB,KAAKgB,aAAahB,KAAKG,OACvBH,KAAKmB,gBAAgBnB,KAAKO,S"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* KoliBri - The accessible HTML-Standard
|
|
3
3
|
*/
|
|
4
|
-
import{r as
|
|
4
|
+
import{r as n,h as e}from"./index-50adf9a0.js";const i=":host{--a11y-min-size:44px}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}*[role='button'],button:not([role='link']){min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}a,button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}:host>kol-heading-wc{display:grid}:host>kol-heading-wc>.overline{order:1}:host>kol-heading-wc>.headline{order:2}",t=class{constructor(e){n(this,e),this._headline=void 0,this._level=void 0,this._secondaryHeadline=void 0}render(){return e("kol-heading-wc",{_headline:this._headline,_level:this._level,_secondaryHeadline:this._secondaryHeadline},e("slot",null))}};t.style={default:i};export{t as kol_heading};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["defaultStyleCss","KolHeading","render","h","_headline","this","_level","_secondaryHeadline"],"sources":["./src/components/heading/style.css?tag=kol-heading&mode=default&encapsulation=shadow","./src/components/heading/shadow.tsx"],"sourcesContent":["@import '../style.css';\n\n:host > kol-heading-wc {\n\tdisplay: grid;\n}\n:host > kol-heading-wc > .overline {\n\torder: 1;\n}\n:host > kol-heading-wc > .headline {\n\torder: 2;\n}\n","import { Component, h, JSX, Prop } from '@stencil/core';\n\nimport { HeadingLevel } from '../../types/heading-level';\nimport { Props } from './component';\n\n@Component({\n\ttag: 'kol-heading',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolHeading implements Props {\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<kol-heading-wc _headline={this._headline} _level={this._level} _secondaryHeadline={this._secondaryHeadline}>\n\t\t\t\t<slot />\n\t\t\t</kol-heading-wc>\n\t\t);\n\t}\n\t/**\n\t * Gibt den Text der Überschrift an.\n\t */\n\t@Prop() public _headline!: string;\n\n\t/**\n\t * Gibt an, welchen H-Level von 1 bis 6 die Überschrift hat. Oder ob es keine Überschrift ist, sondern nur fett gedruckt.\n\t */\n\t@Prop() public _level?: HeadingLevel;\n\n\t/**\n\t * Gibt den Text der zusätzlichen Überschrift an.\n\t */\n\t@Prop() public _secondaryHeadline?: string;\n}\n"],"mappings":";;;+CAAA,MAAMA,EAAkB,
|
|
1
|
+
{"version":3,"names":["defaultStyleCss","KolHeading","render","h","_headline","this","_level","_secondaryHeadline"],"sources":["./src/components/heading/style.css?tag=kol-heading&mode=default&encapsulation=shadow","./src/components/heading/shadow.tsx"],"sourcesContent":["@import '../style.css';\n\n:host > kol-heading-wc {\n\tdisplay: grid;\n}\n:host > kol-heading-wc > .overline {\n\torder: 1;\n}\n:host > kol-heading-wc > .headline {\n\torder: 2;\n}\n","import { Component, h, JSX, Prop } from '@stencil/core';\n\nimport { HeadingLevel } from '../../types/heading-level';\nimport { Props } from './component';\n\n@Component({\n\ttag: 'kol-heading',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolHeading implements Props {\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<kol-heading-wc _headline={this._headline} _level={this._level} _secondaryHeadline={this._secondaryHeadline}>\n\t\t\t\t<slot />\n\t\t\t</kol-heading-wc>\n\t\t);\n\t}\n\t/**\n\t * Gibt den Text der Überschrift an.\n\t */\n\t@Prop() public _headline!: string;\n\n\t/**\n\t * Gibt an, welchen H-Level von 1 bis 6 die Überschrift hat. Oder ob es keine Überschrift ist, sondern nur fett gedruckt.\n\t */\n\t@Prop() public _level?: HeadingLevel;\n\n\t/**\n\t * Gibt den Text der zusätzlichen Überschrift an.\n\t */\n\t@Prop() public _secondaryHeadline?: string;\n}\n"],"mappings":";;;+CAAA,MAAMA,EAAkB,qvB,MCYXC,EAAU,M,0GACfC,SACN,OACCC,EAAA,kBAAgBC,UAAWC,KAAKD,UAAWE,OAAQD,KAAKC,OAAQC,mBAAoBF,KAAKE,oBACxFJ,EAAA,a"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* KoliBri - The accessible HTML-Standard
|
|
3
3
|
*/
|
|
4
|
-
import{r as t,h as
|
|
4
|
+
import{r as t,h as n,H as e}from"./index-50adf9a0.js";const i=":host{--a11y-min-size:44px}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}*[role='button'],button:not([role='link']){min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}a,button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}:host{display:block}:host>div{border-left-style:solid;padding-left:0.5em}",o=class{constructor(n){t(this,n),this.state={}}render(){return n(e,null,n("div",null,n("slot",null)))}};o.style={default:i};export{o as kol_indented_text};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["defaultStyleCss","KolIndentedText","render","h","Host"],"sources":["./src/components/indented-text/style.css?tag=kol-indented-text&mode=default&encapsulation=shadow","./src/components/indented-text/component.tsx"],"sourcesContent":["@import '../style.css';\n@import '../host-display-block.css';\n\n:host > div {\n\tborder-left-style: solid;\n\tpadding-left: 0.5em;\n}\n","import { Component, h, Host, JSX, State } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\n\ntype RequiredProps = unknown;\ntype OptionalProps = unknown;\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = RequiredProps;\ntype OptionalStates = OptionalProps;\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n@Component({\n\ttag: 'kol-indented-text',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolIndentedText implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\t@State() public state: States = {};\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<div>\n\t\t\t\t\t<slot />\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"mappings":";;;sDAAA,MAAMA,EAAkB,
|
|
1
|
+
{"version":3,"names":["defaultStyleCss","KolIndentedText","render","h","Host"],"sources":["./src/components/indented-text/style.css?tag=kol-indented-text&mode=default&encapsulation=shadow","./src/components/indented-text/component.tsx"],"sourcesContent":["@import '../style.css';\n@import '../host-display-block.css';\n\n:host > div {\n\tborder-left-style: solid;\n\tpadding-left: 0.5em;\n}\n","import { Component, h, Host, JSX, State } from '@stencil/core';\n\nimport { Generic } from '@a11y-ui/core';\n\ntype RequiredProps = unknown;\ntype OptionalProps = unknown;\nexport type Props = Generic.Element.Members<RequiredProps, OptionalProps>;\n\ntype RequiredStates = RequiredProps;\ntype OptionalStates = OptionalProps;\ntype States = Generic.Element.Members<RequiredStates, OptionalStates>;\n\n@Component({\n\ttag: 'kol-indented-text',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolIndentedText implements Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates> {\n\t@State() public state: States = {};\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<div>\n\t\t\t\t\t<slot />\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"mappings":";;;sDAAA,MAAMA,EAAkB,8sB,MCmBXC,EAAe,M,oCACK,E,CAEzBC,SACN,OACCC,EAACC,EAAI,KACJD,EAAA,WACCA,EAAA,c"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* KoliBri - The accessible HTML-Standard
|
|
3
3
|
*/
|
|
4
|
-
import{h as t,H as e,r as i,g as
|
|
4
|
+
import{h as t,H as e,r as i,g as a}from"./index-50adf9a0.js";import{b as n,a as s}from"./reuse-3a02afb9.js";import{g as o}from"./controller-cbcb5b86.js";import{d as r}from"./a11y.tipps-1cea9822.js";import{b as d,a as l,s as h}from"./prop.validators-e402ad49.js";import{I as c}from"./controller-a9333e53.js";import{n as p}from"./dev.utils-157f0499.js";import"./tab-index-63d1379d.js";import"./index-81bd9b41.js";const u=(t,e)=>{d(t,"_checked",e)},b=(t,e)=>{d(t,"_indeterminate",e)};class m extends c{constructor(t,e,i){super(t,e,i),this.component=t}validateChecked(t){d(this.component,"_checked",t),this.setFormAssociatedValue(this.component.state._checked)}validateIcon(t){l(this.component,"_icons",(t=>"object"==typeof t&&null!==t&&(n(t.checked,1)||n(t.indeterminate,1)||n(t.unchecked,1))),new Set(["InputCheckboxIcons"]),t)}validateIndeterminate(t){d(this.component,"_indeterminate",t)}validateType(t){r('The "_type" prop is deprecated. Use "_variant" instead.'),this.validateVariant(t)}validateValue(t){h(this.component,"_value",t)}validateVariant(t){l(this.component,"_variant",(t=>"string"==typeof t&&("button"===t||"checkbox"===t||"switch"===t)),new Set(["String {button, checkbox, switch}"]),t)}componentWillLoad(){super.componentWillLoad(),this.validateChecked(this.component._checked),this.validateIcon(this.component._icon),this.validateIndeterminate(this.component._indeterminate),this.validateValue(this.component._value),this.validateVariant(this.component._variant||this.component._type)}}const k=":host{--a11y-min-size:44px}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}*[role='button'],button:not([role='link']){min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}a,button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.required label>span::after,.required legend>span::after{content:'*'}:host{display:block}input,textarea{cursor:text}input[type='checkbox'],input[type='radio'],input[type='range'],label,option,select{cursor:pointer}input[type='color'],input[type='date'],input[type='datetime-local'],input[type='email'],input[type='file'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='time'],input[type='url'],input[type='week'],select[multiple] option,select:not([multiple]),textarea{font-size:1rem}input[type='file']{padding:calc((var(--a11y-min-size) - 1rem) / 10) 0.5em}select[multiple] option{padding:calc((var(--a11y-min-size) - 1rem) / 2) 0.5em}kol-input.disabled :is(button,input,label,option,select,textarea){cursor:not-allowed;opacity:0.5}label{cursor:pointer}kol-input{align-items:center;display:grid;justify-items:left;width:100}kol-input.checkbox,kol-input.switch{grid-template-columns:auto 1fr}kol-input .input{display:inline-flex;order:1}kol-input .input div{display:inline-flex}kol-input .input input{margin:0px}kol-input label{order:2}kol-input.error>kol-alert,kol-input .hint{grid-column:span 2}kol-input kol-alert.error{order:3}kol-input .hint{order:4}input{border-width:2px;border-style:solid;line-height:24px}input[type='checkbox']{appearance:none;background-color:white;cursor:pointer;transition:0.5s}input[type='checkbox'].kol-disabled:before{cursor:not-allowed}input[type='checkbox']:before{content:'';cursor:pointer}.checkbox kol-icon,.switch kol-icon{display:none}.button{cursor:pointer;display:inline-flex;width:auto}.button input{display:none}.checkbox input[type='checkbox']{height:1.5em;width:1.5em}.checkbox input[type='checkbox']:before{display:block;height:1.5em;position:relative;width:1.5em}.checkbox input[type='checkbox']:checked:before{border-bottom-width:3px;border-radius:1px;border-right-width:3px;border-style:solid;border-width:0px 3px 3px 0px;height:0.75em;left:calc(0.375em - 2px);transform:rotate(40deg) translate(-50%, -50%);top:calc(0.7125em - 2px);width:0.375em}.checkbox input[type='checkbox']:indeterminate:before{background-color:black;height:0.2em;left:0.24em;top:0.575em;width:0.8em}.switch input[type='checkbox']{display:inline-block;height:1.7em;min-width:3.2em;position:relative;width:3.2em}.switch input[type='checkbox']:before{background-color:black;height:1.2em;left:calc(0.25em - 2px);top:calc(0.25em - 2px);position:absolute;-webkit-transition:0.5s;-moz-transition:0.5s;-ms-transition:0.5s;transition:0.5;width:1.2em}.switch input[type='checkbox']:checked:before{-webkit-transform:translateX(1.5em);-moz-transform:translateX(1.5em);-ms-transform:translateX(1.5em);transform:translateX(1.5em)}.switch input[type='checkbox']:indeterminate:before{transform:translateX(0.75em)}",f=class{render(){const{ariaDiscribedBy:i}=o(this.state);return t(e,null,t("kol-input",{class:{[this.state._variant]:!0},"data-role":"button"===this.state._variant?"button":void 0,onKeyPress:"button"===this.state._variant?this.onChange:void 0,tabIndex:"button"===this.state._variant?0:void 0,_alert:this.state._alert,_disabled:this.state._disabled,_error:this.state._error,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_id:this.state._id,_required:this.state._required,_touched:this.state._touched},t("span",{slot:"label"},t("slot",null)),t("div",{slot:"input"},t("kol-icon",{onClick:this.onChange,_ariaLabel:"",_icon:this.state._indeterminate?this.state._icon.indeterminate:this.state._checked?this.state._icon.checked:this.state._icon.unchecked}),t("input",Object.assign({ref:this.catchRef,accessKey:this.state._accessKey,"aria-describedby":i.length>0?i.join(" "):void 0,"aria-labelledby":`${this.state._id}-label`,checked:!0===this.state._checked,disabled:!0===this.state._disabled,id:this.state._id,indeterminate:!0===this.state._indeterminate,name:this.state._name,required:!0===this.state._required,tabIndex:this.state._tabIndex,title:"",type:"checkbox",value:"string"==typeof this.state._value?this.state._value:""},this.controller.onFacade,{onChange:this.onChange})))))}constructor(t){i(this,t),this.catchRef=t=>{this.ref=t,s(this.host,this.ref)},this.onChange=t=>{this._checked=!1===this._checked,this._indeterminate=!1,this.controller.setValue(t,this._checked)},this._accessKey=void 0,this._alert=!0,this._checked=!1,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._indeterminate=void 0,this._name=void 0,this._on=void 0,this._required=void 0,this._tabIndex=void 0,this._touched=!1,this._type=void 0,this._value=void 0,this._variant=void 0,this.state={_checked:!1,_icon:{checked:"codicon codicon-check",indeterminate:"codicon codicon-remove",unchecked:"codicon codicon-add"},_id:p(),_indeterminate:!1,_variant:"checkbox"},this.controller=new m(this,"checkbox",this.host)}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAlert(t){this.controller.validateAlert(t)}validateChecked(t){u(this,t)}validateDisabled(t){this.controller.validateDisabled(t)}validateError(t){this.controller.validateError(t)}validateHideLabel(t){this.controller.validateHideLabel(t)}validateHint(t){this.controller.validateHint(t)}validateIcon(t){this.controller.validateIcon(t)}validateId(t){this.controller.validateId(t)}validateIndeterminate(t){b(this,t)}validateName(t){this.controller.validateName(t)}validateOn(t){this.controller.validateOn(t)}validateRequired(t){this.controller.validateRequired(t)}validateTabIndex(t){this.controller.validateTabIndex(t)}validateTouched(t){this.controller.validateTouched(t)}validateType(t){this.controller.validateType(t)}validateValue(t){this.controller.validateValue(t)}validateVariant(t){this.controller.validateVariant(t)}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.controller.componentWillLoad()}get host(){return a(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_checked:["validateChecked"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_indeterminate:["validateIndeterminate"],_name:["validateName"],_on:["validateOn"],_required:["validateRequired"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_type:["validateType"],_value:["validateValue"],_variant:["validateVariant"]}}};f.style={default:k};export{f as kol_input_checkbox};
|