@public-ui/components 2.0.0-rc.1 → 2.0.0-rc.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/custom-elements.json +34 -27
- package/dist/cjs/{a11y.tipps-7bc295a0.js → a11y.tipps-286e2184.js} +1 -1
- package/dist/cjs/{a11y.tipps-7bc295a0.js.map → a11y.tipps-286e2184.js.map} +1 -1
- package/dist/cjs/{align-5cb0bd50.js → align-38fe7d4a.js} +1 -1
- package/dist/cjs/{align-5cb0bd50.js.map → align-38fe7d4a.js.map} +1 -1
- package/dist/cjs/{alignment-160829a3.js → alignment-05ab4f60.js} +1 -1
- package/dist/cjs/{alignment-160829a3.js.map → alignment-05ab4f60.js.map} +1 -1
- package/dist/cjs/alternative-button-link-role-e29e79ed.js +4 -0
- package/dist/cjs/{alternative-button-link-role-9e647514.js.map → alternative-button-link-role-e29e79ed.js.map} +1 -1
- package/dist/cjs/{app-globals-f651a39e.js → app-globals-70ba97cd.js} +1 -1
- package/dist/cjs/{app-globals-f651a39e.js.map → app-globals-70ba97cd.js.map} +1 -1
- package/dist/cjs/{associated.controller-8913f766.js → associated.controller-1273e17d.js} +1 -1
- package/dist/cjs/{associated.controller-8913f766.js.map → associated.controller-1273e17d.js.map} +1 -1
- package/dist/cjs/{color-7556424a.js → color-885864c9.js} +1 -1
- package/dist/cjs/{color-7556424a.js.map → color-885864c9.js.map} +1 -1
- package/dist/cjs/{controller-98eb942a.js → controller-6607a35d.js} +1 -1
- package/dist/cjs/{controller-98eb942a.js.map → controller-6607a35d.js.map} +1 -1
- package/dist/cjs/{controller-e89fd046.js → controller-7156433c.js} +1 -1
- package/dist/cjs/{controller-e89fd046.js.map → controller-7156433c.js.map} +1 -1
- package/dist/cjs/{controller-5e9f8d56.js → controller-95e49b07.js} +1 -1
- package/dist/cjs/{controller-5e9f8d56.js.map → controller-95e49b07.js.map} +1 -1
- package/dist/cjs/{controller-2bc3135f.js → controller-f472b120.js} +1 -1
- package/dist/cjs/{controller-2bc3135f.js.map → controller-f472b120.js.map} +1 -1
- package/dist/cjs/{controller-722157ec.js → controller-ff3d2189.js} +1 -1
- package/dist/cjs/{controller-722157ec.js.map → controller-ff3d2189.js.map} +1 -1
- package/dist/cjs/{controller-icon-e7aae6e1.js → controller-icon-1add536b.js} +1 -1
- package/dist/cjs/{controller-icon-e7aae6e1.js.map → controller-icon-1add536b.js.map} +1 -1
- package/dist/cjs/{custom-class-c6c03255.js → custom-class-d0dc1465.js} +1 -1
- package/dist/cjs/{custom-class-c6c03255.js.map → custom-class-d0dc1465.js.map} +1 -1
- package/dist/cjs/{dev.utils-8c7f47e6.js → dev.utils-6caf7368.js} +1 -1
- package/dist/cjs/{dev.utils-8c7f47e6.js.map → dev.utils-6caf7368.js.map} +1 -1
- package/dist/cjs/{devtools-646843d0.js → devtools-dd717900.js} +1 -1
- package/dist/cjs/{devtools-646843d0.js.map → devtools-dd717900.js.map} +1 -1
- package/dist/cjs/has-closer-309ad54b.js +4 -0
- package/dist/cjs/{has-closer-941dcb50.js.map → has-closer-309ad54b.js.map} +1 -1
- package/dist/cjs/hide-label-37731a74.js +4 -0
- package/dist/cjs/{hide-label-e6f15383.js.map → hide-label-37731a74.js.map} +1 -1
- package/dist/cjs/i18n-d033fd25.js +4 -0
- package/dist/cjs/i18n-d033fd25.js.map +1 -0
- package/dist/cjs/{icons-a50a5cb6.js → icons-8afa4b8a.js} +1 -1
- package/dist/cjs/{icons-a50a5cb6.js.map → icons-8afa4b8a.js.map} +1 -1
- package/dist/cjs/image-source-299d8eab.js +4 -0
- package/dist/cjs/{image-source-be51f603.js.map → image-source-299d8eab.js.map} +1 -1
- package/dist/cjs/{index-65ced40c.js → index-8f2f5b90.js} +1 -1
- package/dist/cjs/{index-65ced40c.js.map → index-8f2f5b90.js.map} +1 -1
- package/dist/cjs/index.cjs.js +1 -1
- package/dist/cjs/kol-abbr.cjs.entry.js +1 -1
- package/dist/cjs/kol-accordion.cjs.entry.js +1 -1
- package/dist/cjs/kol-alert-wc_3.cjs.entry.js +1 -1
- package/dist/cjs/kol-avatar-wc.cjs.entry.js +1 -1
- package/dist/cjs/kol-badge.cjs.entry.js +1 -1
- package/dist/cjs/kol-breadcrumb.cjs.entry.js +1 -1
- package/dist/cjs/kol-button-link-text-switch.cjs.entry.js +1 -1
- package/dist/cjs/kol-button-link-text-switch.cjs.entry.js.map +1 -1
- package/dist/cjs/kol-card.cjs.entry.js +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-form.cjs.entry.js +1 -1
- package/dist/cjs/kol-icon.cjs.entry.js +1 -1
- package/dist/cjs/kol-image.cjs.entry.js +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-input.cjs.entry.js +1 -1
- package/dist/cjs/kol-kolibri.cjs.entry.js +1 -1
- package/dist/cjs/kol-link-button.cjs.entry.js +1 -1
- package/dist/cjs/kol-link-group.cjs.entry.js +1 -1
- package/dist/cjs/kol-link-wc.cjs.entry.js +1 -1
- package/dist/cjs/kol-link-wc.cjs.entry.js.map +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-modal.cjs.entry.js +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-popover.cjs.entry.js +1 -1
- package/dist/cjs/kol-progress.cjs.entry.js +1 -1
- package/dist/cjs/kol-quote.cjs.entry.js +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-span-wc_2.cjs.entry.js +1 -1
- package/dist/cjs/kol-spin.cjs.entry.js +1 -1
- package/dist/cjs/kol-symbol.cjs.entry.js +1 -1
- package/dist/cjs/kol-table.cjs.entry.js +1 -1
- package/dist/cjs/kol-tabs.cjs.entry.js +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-container.cjs.entry.js +1 -1
- package/dist/cjs/kol-toast.cjs.entry.js +1 -1
- package/dist/cjs/kol-version.cjs.entry.js +1 -1
- package/dist/cjs/kolibri.cjs.js +1 -1
- package/dist/cjs/{label-1aedd7c9.js → label-6a66b6c1.js} +1 -1
- package/dist/cjs/{label-1aedd7c9.js.map → label-6a66b6c1.js.map} +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/open-c63a5e3f.js +4 -0
- package/dist/cjs/{open-fb457a4f.js.map → open-c63a5e3f.js.map} +1 -1
- package/dist/cjs/{prop.validators-d9e8f5a9.js → prop.validators-074b54c5.js} +1 -1
- package/dist/cjs/{prop.validators-d9e8f5a9.js.map → prop.validators-074b54c5.js.map} +1 -1
- package/dist/cjs/rows-1e373b35.js +4 -0
- package/dist/cjs/{rows-9e57680f.js.map → rows-1e373b35.js.map} +1 -1
- package/dist/cjs/show-98976820.js +4 -0
- package/dist/cjs/{show-9060efee.js.map → show-98976820.js.map} +1 -1
- package/dist/cjs/{suggestions-97bfee0c.js → suggestions-6959d65d.js} +1 -1
- package/dist/cjs/{suggestions-97bfee0c.js.map → suggestions-6959d65d.js.map} +1 -1
- package/dist/cjs/{tab-index-70de06c1.js → tab-index-ad2bed16.js} +1 -1
- package/dist/cjs/{tab-index-70de06c1.js.map → tab-index-ad2bed16.js.map} +1 -1
- package/dist/cjs/{tooltip-align-5d4d8eef.js → tooltip-align-4f53863a.js} +1 -1
- package/dist/cjs/{tooltip-align-5d4d8eef.js.map → tooltip-align-4f53863a.js.map} +1 -1
- package/dist/cjs/{validation-aa68e6ae.js → validation-90762185.js} +1 -1
- package/dist/cjs/{validation-aa68e6ae.js.map → validation-90762185.js.map} +1 -1
- package/dist/cjs/validation-bd015251.js +4 -0
- package/dist/cjs/{validation-8f74bfb8.js.map → validation-bd015251.js.map} +1 -1
- package/dist/components/component11.js +1 -1
- package/dist/components/component11.js.map +1 -1
- package/dist/components/component15.js.map +1 -1
- package/dist/components/component9.js.map +1 -1
- package/dist/components/i18n.js +1 -1
- package/dist/components/i18n.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-input-checkbox.js.map +1 -1
- package/dist/components/kol-input-color.js.map +1 -1
- package/dist/components/kol-input-date.js.map +1 -1
- package/dist/components/kol-input-email.js.map +1 -1
- package/dist/components/kol-input-file.js.map +1 -1
- package/dist/components/kol-input-number.js.map +1 -1
- package/dist/components/kol-input-password.js.map +1 -1
- package/dist/components/kol-input-radio.js.map +1 -1
- package/dist/components/kol-input-range.js.map +1 -1
- package/dist/components/kol-input-text.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-textarea.js.map +1 -1
- package/dist/components/prop.validators.js +1 -1
- package/dist/components/prop.validators.js.map +1 -1
- package/dist/components/shadow2.js.map +1 -1
- package/dist/esm/{a11y.tipps-583a2096.js → a11y.tipps-348ca42a.js} +1 -1
- package/dist/esm/{a11y.tipps-583a2096.js.map → a11y.tipps-348ca42a.js.map} +1 -1
- package/dist/esm/{align-0c96facf.js → align-11b69892.js} +1 -1
- package/dist/esm/{align-0c96facf.js.map → align-11b69892.js.map} +1 -1
- package/dist/esm/{alignment-84fc6207.js → alignment-1bffdb6e.js} +1 -1
- package/dist/esm/{alignment-84fc6207.js.map → alignment-1bffdb6e.js.map} +1 -1
- package/dist/esm/alternative-button-link-role-1ace1f6f.js +4 -0
- package/dist/esm/{alternative-button-link-role-1b39949c.js.map → alternative-button-link-role-1ace1f6f.js.map} +1 -1
- package/dist/esm/{app-globals-fa8bbebf.js → app-globals-d408fcae.js} +1 -1
- package/dist/esm/{app-globals-fa8bbebf.js.map → app-globals-d408fcae.js.map} +1 -1
- package/dist/esm/{associated.controller-103e6fb9.js → associated.controller-a395cef5.js} +1 -1
- package/dist/esm/{associated.controller-103e6fb9.js.map → associated.controller-a395cef5.js.map} +1 -1
- package/dist/esm/{color-3932ac07.js → color-a3271610.js} +1 -1
- package/dist/esm/{color-3932ac07.js.map → color-a3271610.js.map} +1 -1
- package/dist/esm/{controller-75d286de.js → controller-2743a0d8.js} +1 -1
- package/dist/esm/{controller-75d286de.js.map → controller-2743a0d8.js.map} +1 -1
- package/dist/esm/{controller-eb162f21.js → controller-417ec2ab.js} +1 -1
- package/dist/esm/{controller-eb162f21.js.map → controller-417ec2ab.js.map} +1 -1
- package/dist/esm/{controller-cdba1088.js → controller-46e6bd0b.js} +1 -1
- package/dist/esm/{controller-cdba1088.js.map → controller-46e6bd0b.js.map} +1 -1
- package/dist/esm/{controller-b19ee0de.js → controller-64f30149.js} +1 -1
- package/dist/esm/{controller-b19ee0de.js.map → controller-64f30149.js.map} +1 -1
- package/dist/esm/{controller-a13b8955.js → controller-a1e48719.js} +1 -1
- package/dist/esm/{controller-a13b8955.js.map → controller-a1e48719.js.map} +1 -1
- package/dist/esm/{controller-icon-fb1feb61.js → controller-icon-c621ff81.js} +1 -1
- package/dist/esm/{controller-icon-fb1feb61.js.map → controller-icon-c621ff81.js.map} +1 -1
- package/dist/esm/{custom-class-44d7cc63.js → custom-class-87071d99.js} +1 -1
- package/dist/esm/{custom-class-44d7cc63.js.map → custom-class-87071d99.js.map} +1 -1
- package/dist/esm/{dev.utils-2a853234.js → dev.utils-9b878520.js} +1 -1
- package/dist/esm/{dev.utils-2a853234.js.map → dev.utils-9b878520.js.map} +1 -1
- package/dist/esm/{devtools-496ae358.js → devtools-fa2d0662.js} +1 -1
- package/dist/esm/{devtools-496ae358.js.map → devtools-fa2d0662.js.map} +1 -1
- package/dist/esm/{has-closer-fd2d8642.js → has-closer-f3547f42.js} +1 -1
- package/dist/esm/{has-closer-fd2d8642.js.map → has-closer-f3547f42.js.map} +1 -1
- package/dist/esm/{hide-label-2c0bf25c.js → hide-label-ff12ad0b.js} +1 -1
- package/dist/esm/{hide-label-2c0bf25c.js.map → hide-label-ff12ad0b.js.map} +1 -1
- package/dist/esm/i18n-9c7e636f.js +4 -0
- package/dist/esm/i18n-9c7e636f.js.map +1 -0
- package/dist/esm/{icons-ad8a28c6.js → icons-da3b61ae.js} +1 -1
- package/dist/esm/{icons-ad8a28c6.js.map → icons-da3b61ae.js.map} +1 -1
- package/dist/esm/{image-source-58a1cae6.js → image-source-5494399d.js} +1 -1
- package/dist/esm/{image-source-58a1cae6.js.map → image-source-5494399d.js.map} +1 -1
- package/dist/esm/{index-947d3173.js → index-5d267931.js} +1 -1
- package/dist/esm/{index-947d3173.js.map → index-5d267931.js.map} +1 -1
- package/dist/esm/index.js +1 -1
- package/dist/esm/kol-abbr.entry.js +1 -1
- package/dist/esm/kol-accordion.entry.js +1 -1
- package/dist/esm/kol-alert-wc_3.entry.js +1 -1
- package/dist/esm/kol-avatar-wc.entry.js +1 -1
- package/dist/esm/kol-badge.entry.js +1 -1
- package/dist/esm/kol-breadcrumb.entry.js +1 -1
- package/dist/esm/kol-button-link-text-switch.entry.js +1 -1
- package/dist/esm/kol-button-link-text-switch.entry.js.map +1 -1
- package/dist/esm/kol-card.entry.js +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-form.entry.js +1 -1
- package/dist/esm/kol-icon.entry.js +1 -1
- package/dist/esm/kol-image.entry.js +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-input.entry.js +1 -1
- package/dist/esm/kol-kolibri.entry.js +1 -1
- package/dist/esm/kol-link-button.entry.js +1 -1
- package/dist/esm/kol-link-group.entry.js +1 -1
- package/dist/esm/kol-link-wc.entry.js +1 -1
- package/dist/esm/kol-link-wc.entry.js.map +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-modal.entry.js +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-popover.entry.js +1 -1
- package/dist/esm/kol-progress.entry.js +1 -1
- package/dist/esm/kol-quote.entry.js +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-span-wc_2.entry.js +1 -1
- package/dist/esm/kol-spin.entry.js +1 -1
- package/dist/esm/kol-symbol.entry.js +1 -1
- package/dist/esm/kol-table.entry.js +1 -1
- package/dist/esm/kol-tabs.entry.js +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-container.entry.js +1 -1
- package/dist/esm/kol-toast.entry.js +1 -1
- package/dist/esm/kol-version.entry.js +1 -1
- package/dist/esm/kolibri.js +1 -1
- package/dist/esm/{label-0d258cd5.js → label-c130b72e.js} +1 -1
- package/dist/esm/{label-0d258cd5.js.map → label-c130b72e.js.map} +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/{open-713ddcdc.js → open-fac63e17.js} +1 -1
- package/dist/esm/{open-713ddcdc.js.map → open-fac63e17.js.map} +1 -1
- package/dist/esm/{prop.validators-125a3282.js → prop.validators-e40c3380.js} +1 -1
- package/dist/esm/{prop.validators-125a3282.js.map → prop.validators-e40c3380.js.map} +1 -1
- package/dist/esm/{rows-d5112a2e.js → rows-f8671a72.js} +1 -1
- package/dist/esm/{rows-d5112a2e.js.map → rows-f8671a72.js.map} +1 -1
- package/dist/esm/{show-9951ecef.js → show-40a56e1f.js} +1 -1
- package/dist/esm/{show-9951ecef.js.map → show-40a56e1f.js.map} +1 -1
- package/dist/esm/{suggestions-50a767be.js → suggestions-871adfaf.js} +1 -1
- package/dist/esm/{suggestions-50a767be.js.map → suggestions-871adfaf.js.map} +1 -1
- package/dist/esm/{tab-index-5e7494f0.js → tab-index-9c6b6a46.js} +1 -1
- package/dist/esm/{tab-index-5e7494f0.js.map → tab-index-9c6b6a46.js.map} +1 -1
- package/dist/esm/{tooltip-align-fe8fbb60.js → tooltip-align-88b82267.js} +1 -1
- package/dist/esm/{tooltip-align-fe8fbb60.js.map → tooltip-align-88b82267.js.map} +1 -1
- package/dist/esm/{validation-33f3aa23.js → validation-36d55135.js} +1 -1
- package/dist/esm/{validation-33f3aa23.js.map → validation-36d55135.js.map} +1 -1
- package/dist/esm/validation-3a52d0f0.js +4 -0
- package/dist/esm/{validation-61e035d7.js.map → validation-3a52d0f0.js.map} +1 -1
- package/dist/kolibri/{a11y.tipps-583a2096.js → a11y.tipps-348ca42a.js} +1 -1
- package/dist/kolibri/align-11b69892.js +4 -0
- package/dist/kolibri/alignment-1bffdb6e.js +4 -0
- package/dist/kolibri/alternative-button-link-role-1ace1f6f.js +4 -0
- package/dist/kolibri/{app-globals-fa8bbebf.js → app-globals-d408fcae.js} +1 -1
- package/dist/kolibri/{associated.controller-103e6fb9.js → associated.controller-a395cef5.js} +1 -1
- package/dist/kolibri/{color-3932ac07.js → color-a3271610.js} +1 -1
- package/dist/kolibri/{controller-75d286de.js → controller-2743a0d8.js} +1 -1
- package/dist/kolibri/{controller-eb162f21.js → controller-417ec2ab.js} +1 -1
- package/dist/kolibri/{controller-cdba1088.js → controller-46e6bd0b.js} +1 -1
- package/dist/kolibri/{controller-b19ee0de.js → controller-64f30149.js} +1 -1
- package/dist/kolibri/{controller-a13b8955.js → controller-a1e48719.js} +1 -1
- package/dist/kolibri/controller-icon-c621ff81.js +4 -0
- package/dist/kolibri/{custom-class-44d7cc63.js → custom-class-87071d99.js} +1 -1
- package/dist/kolibri/{dev.utils-2a853234.js → dev.utils-9b878520.js} +1 -1
- package/dist/kolibri/{dev.utils-2a853234.js.map → dev.utils-9b878520.js.map} +1 -1
- package/dist/kolibri/devtools-fa2d0662.js +4 -0
- package/dist/kolibri/{devtools-496ae358.js.map → devtools-fa2d0662.js.map} +1 -1
- package/dist/kolibri/has-closer-f3547f42.js +4 -0
- package/dist/kolibri/{has-closer-fd2d8642.js.map → has-closer-f3547f42.js.map} +1 -1
- package/dist/kolibri/hide-label-ff12ad0b.js +4 -0
- package/dist/kolibri/i18n-9c7e636f.js +4 -0
- package/dist/kolibri/i18n-9c7e636f.js.map +1 -0
- package/dist/kolibri/icons-da3b61ae.js +4 -0
- package/dist/kolibri/{icons-ad8a28c6.js.map → icons-da3b61ae.js.map} +1 -1
- package/dist/kolibri/image-source-5494399d.js +4 -0
- package/dist/kolibri/{index-947d3173.js → index-5d267931.js} +1 -1
- package/dist/kolibri/index.esm.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-alert-wc_3.entry.js +1 -1
- package/dist/kolibri/kol-avatar-wc.entry.js +1 -1
- package/dist/kolibri/kol-badge.entry.js +1 -1
- package/dist/kolibri/kol-breadcrumb.entry.js +1 -1
- package/dist/kolibri/kol-button-link-text-switch.entry.js +1 -1
- package/dist/kolibri/kol-button-link-text-switch.entry.js.map +1 -1
- package/dist/kolibri/kol-card.entry.js +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-form.entry.js +1 -1
- package/dist/kolibri/kol-icon.entry.js +1 -1
- package/dist/kolibri/kol-image.entry.js +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-input.entry.js +1 -1
- package/dist/kolibri/kol-kolibri.entry.js +1 -1
- package/dist/kolibri/kol-link-button.entry.js +1 -1
- package/dist/kolibri/kol-link-group.entry.js +1 -1
- package/dist/kolibri/kol-link-wc.entry.js +1 -1
- package/dist/kolibri/kol-link-wc.entry.js.map +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-modal.entry.js +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-popover.entry.js +1 -1
- package/dist/kolibri/kol-progress.entry.js +1 -1
- package/dist/kolibri/kol-quote.entry.js +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-span-wc_2.entry.js +1 -1
- package/dist/kolibri/kol-spin.entry.js +1 -1
- package/dist/kolibri/kol-symbol.entry.js +1 -1
- package/dist/kolibri/kol-symbol.entry.js.map +1 -1
- package/dist/kolibri/kol-table.entry.js +1 -1
- package/dist/kolibri/kol-tabs.entry.js +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-container.entry.js +1 -1
- package/dist/kolibri/kol-toast.entry.js +1 -1
- package/dist/kolibri/kol-version.entry.js +1 -1
- package/dist/kolibri/kolibri.esm.js +1 -1
- package/dist/kolibri/kolibri.esm.js.map +1 -1
- package/dist/kolibri/{label-0d258cd5.js → label-c130b72e.js} +1 -1
- package/dist/kolibri/open-fac63e17.js +4 -0
- package/dist/kolibri/{prop.validators-125a3282.js → prop.validators-e40c3380.js} +1 -1
- package/dist/kolibri/rows-f8671a72.js +4 -0
- package/dist/kolibri/show-40a56e1f.js +4 -0
- package/dist/kolibri/{suggestions-50a767be.js → suggestions-871adfaf.js} +1 -1
- package/dist/kolibri/tab-index-9c6b6a46.js +4 -0
- package/dist/kolibri/tooltip-align-88b82267.js +4 -0
- package/dist/kolibri/validation-36d55135.js +4 -0
- package/dist/kolibri/validation-3a52d0f0.js +4 -0
- package/dist/types/components/input-checkbox/component.d.ts +1 -1
- package/dist/types/components/input-color/component.d.ts +1 -1
- package/dist/types/components/input-date/component.d.ts +1 -1
- package/dist/types/components/input-email/component.d.ts +1 -1
- package/dist/types/components/input-file/component.d.ts +1 -1
- package/dist/types/components/input-number/component.d.ts +1 -1
- package/dist/types/components/input-password/component.d.ts +1 -1
- package/dist/types/components/input-radio/component.d.ts +1 -1
- package/dist/types/components/input-range/component.d.ts +1 -1
- package/dist/types/components/input-text/component.d.ts +1 -1
- package/dist/types/components/link/component.d.ts +1 -1
- package/dist/types/components/link/shadow.d.ts +1 -1
- package/dist/types/components/link/types.d.ts +2 -2
- package/dist/types/components/nav/component.d.ts +2 -0
- package/dist/types/components/nav/types.d.ts +3 -2
- package/dist/types/components/select/component.d.ts +1 -1
- package/dist/types/components/textarea/component.d.ts +1 -1
- package/dist/types/components.d.ts +36 -28
- package/dist/types/i18n.d.ts +1 -1
- package/dist/types/locales/de.d.ts +2 -0
- package/dist/types/locales/en.d.ts +2 -0
- package/dist/types/types/props/has-compact-button.d.ts +7 -0
- package/doc/button.md +2 -0
- package/doc/input-checkbox.md +22 -22
- package/doc/input-color.md +21 -21
- package/doc/input-date.md +27 -27
- package/doc/input-email.md +29 -29
- package/doc/input-file.md +22 -22
- package/doc/input-number.md +27 -27
- package/doc/input-password.md +26 -26
- package/doc/input-radio.md +20 -20
- package/doc/input-range.md +23 -23
- package/doc/input-text.md +28 -28
- package/doc/link.md +14 -14
- package/doc/nav.md +4 -0
- package/doc/select.md +22 -22
- package/doc/textarea.md +25 -25
- package/package.json +1 -1
- package/vscode-custom-data.json +4 -0
- package/dist/cjs/alternative-button-link-role-9e647514.js +0 -4
- package/dist/cjs/has-closer-941dcb50.js +0 -4
- package/dist/cjs/hide-label-e6f15383.js +0 -4
- package/dist/cjs/i18n-6dea3266.js +0 -4
- package/dist/cjs/i18n-6dea3266.js.map +0 -1
- package/dist/cjs/image-source-be51f603.js +0 -4
- package/dist/cjs/open-fb457a4f.js +0 -4
- package/dist/cjs/rows-9e57680f.js +0 -4
- package/dist/cjs/show-9060efee.js +0 -4
- package/dist/cjs/validation-8f74bfb8.js +0 -4
- package/dist/esm/alternative-button-link-role-1b39949c.js +0 -4
- package/dist/esm/i18n-d0bb1d99.js +0 -4
- package/dist/esm/i18n-d0bb1d99.js.map +0 -1
- package/dist/esm/validation-61e035d7.js +0 -4
- package/dist/kolibri/align-0c96facf.js +0 -4
- package/dist/kolibri/alignment-84fc6207.js +0 -4
- package/dist/kolibri/alternative-button-link-role-1b39949c.js +0 -4
- package/dist/kolibri/controller-icon-fb1feb61.js +0 -4
- package/dist/kolibri/devtools-496ae358.js +0 -4
- package/dist/kolibri/has-closer-fd2d8642.js +0 -4
- package/dist/kolibri/hide-label-2c0bf25c.js +0 -4
- package/dist/kolibri/i18n-d0bb1d99.js +0 -4
- package/dist/kolibri/i18n-d0bb1d99.js.map +0 -1
- package/dist/kolibri/icons-ad8a28c6.js +0 -4
- package/dist/kolibri/image-source-58a1cae6.js +0 -4
- package/dist/kolibri/open-713ddcdc.js +0 -4
- package/dist/kolibri/rows-d5112a2e.js +0 -4
- package/dist/kolibri/show-9951ecef.js +0 -4
- package/dist/kolibri/tab-index-5e7494f0.js +0 -4
- package/dist/kolibri/tooltip-align-fe8fbb60.js +0 -4
- package/dist/kolibri/validation-33f3aa23.js +0 -4
- package/dist/kolibri/validation-61e035d7.js +0 -4
- /package/dist/kolibri/{a11y.tipps-583a2096.js.map → a11y.tipps-348ca42a.js.map} +0 -0
- /package/dist/kolibri/{align-0c96facf.js.map → align-11b69892.js.map} +0 -0
- /package/dist/kolibri/{alignment-84fc6207.js.map → alignment-1bffdb6e.js.map} +0 -0
- /package/dist/kolibri/{alternative-button-link-role-1b39949c.js.map → alternative-button-link-role-1ace1f6f.js.map} +0 -0
- /package/dist/kolibri/{app-globals-fa8bbebf.js.map → app-globals-d408fcae.js.map} +0 -0
- /package/dist/kolibri/{associated.controller-103e6fb9.js.map → associated.controller-a395cef5.js.map} +0 -0
- /package/dist/kolibri/{color-3932ac07.js.map → color-a3271610.js.map} +0 -0
- /package/dist/kolibri/{controller-75d286de.js.map → controller-2743a0d8.js.map} +0 -0
- /package/dist/kolibri/{controller-eb162f21.js.map → controller-417ec2ab.js.map} +0 -0
- /package/dist/kolibri/{controller-cdba1088.js.map → controller-46e6bd0b.js.map} +0 -0
- /package/dist/kolibri/{controller-b19ee0de.js.map → controller-64f30149.js.map} +0 -0
- /package/dist/kolibri/{controller-a13b8955.js.map → controller-a1e48719.js.map} +0 -0
- /package/dist/kolibri/{controller-icon-fb1feb61.js.map → controller-icon-c621ff81.js.map} +0 -0
- /package/dist/kolibri/{custom-class-44d7cc63.js.map → custom-class-87071d99.js.map} +0 -0
- /package/dist/kolibri/{hide-label-2c0bf25c.js.map → hide-label-ff12ad0b.js.map} +0 -0
- /package/dist/kolibri/{image-source-58a1cae6.js.map → image-source-5494399d.js.map} +0 -0
- /package/dist/kolibri/{index-947d3173.js.map → index-5d267931.js.map} +0 -0
- /package/dist/kolibri/{label-0d258cd5.js.map → label-c130b72e.js.map} +0 -0
- /package/dist/kolibri/{open-713ddcdc.js.map → open-fac63e17.js.map} +0 -0
- /package/dist/kolibri/{prop.validators-125a3282.js.map → prop.validators-e40c3380.js.map} +0 -0
- /package/dist/kolibri/{rows-d5112a2e.js.map → rows-f8671a72.js.map} +0 -0
- /package/dist/kolibri/{show-9951ecef.js.map → show-40a56e1f.js.map} +0 -0
- /package/dist/kolibri/{suggestions-50a767be.js.map → suggestions-871adfaf.js.map} +0 -0
- /package/dist/kolibri/{tab-index-5e7494f0.js.map → tab-index-9c6b6a46.js.map} +0 -0
- /package/dist/kolibri/{tooltip-align-fe8fbb60.js.map → tooltip-align-88b82267.js.map} +0 -0
- /package/dist/kolibri/{validation-33f3aa23.js.map → validation-36d55135.js.map} +0 -0
- /package/dist/kolibri/{validation-61e035d7.js.map → validation-3a52d0f0.js.map} +0 -0
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* KoliBri - The accessible HTML-Standard
|
|
3
3
|
*/
|
|
4
|
-
import{r as c,h as n}from"./index-d0c806ea.js";import{d as t,B as e,b as i,f as o}from"./bund-056aa89a.js";import{a as r}from"./i18n-
|
|
4
|
+
import{r as c,h as n}from"./index-d0c806ea.js";import{d as t,B as e,b as i,f as o}from"./bund-056aa89a.js";import{a as r}from"./i18n-9c7e636f.js";import{d as s}from"./a11y.tipps-348ca42a.js";import{s as l}from"./prop.validators-e40c3380.js";import"./index-5d267931.js";import"./dev.utils-9b878520.js";import"./reuse-b3566e4c.js";const a=":host{--a11y-min-size:44px;font-size:inherit}*{font-family:Verdana;hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}:host{display:inline-block}text{font-size:16px;letter-spacing:normal;word-spacing:normal}svg{max-height:100%}";function h(c,n=new Map){return Object.entries(c).map((([c,t])=>{n.set(t,c)})),n}const d=h(i,h(t,h(e)));function p(c){return d.has(c)?d.get(c):""}const g=()=>n("path",{d:"M21.72,12.77c0.04-0.33,0.06-0.67,0.06-1c0-0.2,0-0.43,0-0.69c3.06,0,5.74-2.25,5.74-4.78\nc-0.09-1.07-0.56-2.08-1.32-2.84l0.32-0.07c1,0.89,1.61,2.14,1.7,3.48c0,3-3,5.85-6.5,5.92 M18.64,2.21\nc-0.05-0.33-0.19-0.64-0.39-0.91c0-0.31,0.14-0.61,0.64-0.36c-0.27,0.27-0.06,0.76-0.06,0.76s0.55-0.26,0.44-0.62\nC20.09,1.28,19.5,2.38,18.64,2.21 M17.93,3.77c-0.12-0.47-0.34-0.9-0.64-1.27c-0.3-0.42-0.77-0.69-1.29-0.73\nc-0.34,0.03-0.68,0.12-1,0.25c-0.16-0.28-0.27-0.58-0.32-0.9c0-0.22,0.38-0.44,1.1-0.44c1.58,0,2.52,0.71,2.52,1.91\nC18.26,3.01,18.14,3.41,17.93,3.77 M22,24.16c0.13,0,0.26,0.02,0.38,0.07c0.64,1.3,1.4,2.53,2.29,3.68l0,0l0,0\nc0.81-0.14,1.63-0.22,2.45-0.24l0,0c0.1-0.01,0.2,0.01,0.28,0.07c0.07,0.09,0.1,0.2,0.09,0.31c-0.01,0.28-0.08,0.55-0.21,0.79\nc-0.46-0.4-1.07-0.59-1.68-0.51c-0.24,0.01-0.48,0.05-0.71,0.12h-0.07h-0.07l0.48,0.49c0.77,0.83,1.44,1.43,1.44,1.83\nc-0.04,0.31-0.22,0.58-0.48,0.74c-0.22-0.98-0.8-1.84-1.62-2.42h-0.06v0.27c0,0.19,0,0.47,0,0.77c0,1.49-0.15,1.72-0.67,1.72\nc-0.09,0.01-0.19,0.01-0.28,0c0.33-0.49,0.48-1.08,0.41-1.67v-0.7c0-0.27,0.03-0.53,0.06-0.8v-0.11h-0.08\nc-0.33-0.05-0.67-0.09-1-0.1c-0.57-0.07-1.14,0.07-1.6,0.41c-0.24-0.18-0.41-0.44-0.48-0.73c0-0.32,0.19-0.34,0.45-0.34\nc0.14-0.01,0.27-0.01,0.41,0c0.59,0.09,1.18,0.13,1.78,0.12h0.06v-0.06c-0.5-1.13-1.18-2.17-2-3.09c0.1-0.35,0.2-0.59,0.54-0.59\nM12.64,27.87v0.06h0.06c0.55-0.01,1.1-0.06,1.64-0.16c0.14-0.01,0.27-0.01,0.41,0c0.26,0,0.45,0,0.45,0.34\nc-0.07,0.29-0.24,0.55-0.48,0.73c-0.46-0.34-1.03-0.49-1.6-0.41c-0.33,0.01-0.67,0.05-1,0.1H12v0.11\nc0.03,0.27,0.06,0.53,0.06,0.8v0.7c-0.05,0.58,0.1,1.15,0.42,1.63c-0.09,0.01-0.19,0.01-0.28,0c-0.52,0-0.67-0.23-0.67-1.72\nc0-0.3,0-0.58,0-0.77V29l-0.06,0.05c-0.82,0.58-1.39,1.44-1.61,2.42c-0.28-0.14-0.47-0.4-0.53-0.7c0-0.43,0.65-1.07,1.39-1.81\nl0.43-0.43v-0.06h-0.14c-0.23-0.07-0.47-0.11-0.71-0.12c-0.61-0.08-1.22,0.11-1.68,0.51c-0.13-0.24-0.2-0.51-0.21-0.79\nc0.01-0.11,0.06-0.22,0.14-0.3c0.08-0.06,0.18-0.08,0.28-0.07l0,0c0.82,0.02,1.64,0.1,2.45,0.24l0,0l0,0\nc0.88-1.15,1.64-2.38,2.28-3.68c0.12-0.05,0.25-0.07,0.38-0.07c0.35,0,0.44,0.24,0.54,0.59c-0.82,0.92-1.5,1.96-2,3.09\nM7.78,6.87c0.08-1.36,0.7-2.62,1.72-3.52l0.32,0.07C9.06,4.19,8.6,5.19,8.51,6.26c0,2.56,2.73,4.78,5.82,4.78\nc0,0.22,0,0.45,0,0.69c-0.01,0.35,0,0.69,0.03,1.04c-3.5,0-6.58-2.86-6.58-5.92 M31.25,12.23c1.57,2.49,2.8,2.45,4.66,2.45\nc-1.19-0.97-2.21-2.14-3-3.46L30,6.65c-0.29-1.44-1.03-2.75-2.12-3.73c0.31-0.1,0.6-0.24,0.87-0.42c-1.88,0-3.73-1-4.75-1\nc-0.55-0.05-1.03,0.36-1.08,0.91c0,0.58,0.63,1.16,1.73,1.16c0.31,0,0.62-0.04,0.92-0.09c0.65,0.74,1.03,1.67,1.08,2.65\nc0,2-2.41,3.58-4.83,3.58h-0.41c-0.5-0.67-0.84-1.45-1-2.28c0-1.6,1.05-2.9,1.05-4.48c0-0.68-0.24-1.33-0.67-1.85\nc0.29-0.23,0.53-0.52,0.7-0.85c-0.22,0.08-0.45,0.11-0.68,0.09c-1.16,0-2.11-0.3-3-0.3c-0.53,0-0.67,0.16-0.67,0.31\nc-0.01,0.05-0.01,0.1,0,0.15c-0.19-0.08-0.39-0.13-0.59-0.17c-0.29-0.05-0.58-0.08-0.88-0.08c-1.13,0-1.52,0.47-1.52,0.87\nc0.07,0.52,0.27,1.01,0.57,1.44c0.4-0.2,0.84-0.31,1.28-0.34c0.6,0,1.13,0.57,1.41,1.24c-0.29,0.05-0.59,0.07-0.88,0.07\nc-0.68-0.03-1.36-0.16-2-0.39l0,0c0,0,0.31,0.56,0.92,0.78c0.72,0.22,1.46,0.37,2.21,0.45c-0.08,0.21-0.23,0.38-0.43,0.49\nc-0.05,0.02-0.09,0.02-0.14,0c-0.74-0.14-1.45-0.35-2.14-0.65H14.9c0,0.42,1.09,1.35,2.07,1.71c-1.06,1.1-1.87,2.41-2.39,3.85\nh-0.41c-2.42,0-4.82-1.57-4.82-3.58c0.05-0.98,0.43-1.91,1.07-2.65c0.3,0.05,0.61,0.09,0.92,0.09c1.1,0,1.69-0.58,1.74-1.16\nc-0.04-0.55-0.52-0.96-1.07-0.92c0,0,0,0-0.01,0c-1,0-2.88,1-4.76,1C7.51,2.73,7.8,2.87,8.11,2.97C7.03,3.94,6.29,5.23,6,6.65\nl-2.87,4.59c-0.79,1.32-1.81,2.49-3,3.46c1.86,0,3.09,0,4.66-2.45L6.26,9.9c0.11,0.31,0.24,0.61,0.4,0.9l-2.97,4.67\nc-0.79,1.32-1.8,2.49-3,3.46c1.85,0,3.08,0,4.65-2.44l2.52-4c0.19,0.2,0.39,0.4,0.6,0.58l-3.59,5.7c-0.79,1.32-1.8,2.49-3,3.45\nc1.85,0,3.08,0.05,4.65-2.44L10,14.2c0.22,0.14,0.46,0.28,0.7,0.41l-4.27,6.77c-0.79,1.31-1.81,2.48-3,3.45\nc1.85,0,3.08,0,4.65-2.44l4.36-7c0.25,0.1,0.51,0.2,0.78,0.28l-4.95,7.9c-0.79,1.31-1.81,2.48-3,3.45c1.85,0,3.08,0.05,4.65-2.43\nl5.24-8.39h0.16c0.14,0.42,0.22,0.86,0.24,1.3c0,2.64-1.73,5-3.8,6.76c0.19,0.06,0.38,0.09,0.58,0.08c0.3,0.01,0.6-0.01,0.9-0.05\nc-0.57,1.13-1.24,2.21-2,3.23c-0.77-0.13-1.54-0.2-2.32-0.22c-0.67,0-0.75,0.4-0.75,0.75c-0.01,0.53,0.22,1.03,0.62,1.38\nc0.13-0.31,0.38-0.73,1.63-0.73h0.13C10.11,29.13,9,30.06,9,30.77c0.06,0.66,0.59,1.18,1.25,1.24c-0.02-0.14-0.02-0.28,0-0.42\nc0.13-0.69,0.48-1.33,1-1.8c-0.01,0.1-0.01,0.2,0,0.3c0,1.43,0.13,2.08,1,2.08c0.31-0.01,0.61-0.12,0.86-0.31\nc-0.5-0.44-0.73-1.11-0.62-1.77c0-0.21,0-0.41,0-0.69c0.02-0.2,0.02-0.41,0-0.61c0.24-0.02,0.47-0.02,0.71,0\nc0,0,1.29-0.1,1.6,0.57c0.35-0.32,0.86-0.78,0.86-1.27c0-0.33-0.16-0.71-0.83-0.71c-0.25,0-1,0.16-1.7,0.16\nc0.48-0.84,1.04-1.64,1.66-2.39c0.1,0.39,0.31,0.74,0.62,1c0.12-1.17,0.54-2.28,1.21-3.24c0.16,0.93,0.24,1.87,0.23,2.82\nc0,3.55-0.85,6.17-2.66,6.67c0.26,0.46,0.73,0.75,1.25,0.78c0.66,0,1-0.75,1.39-1.46c0.19,0.53,0.72,1.8,1.25,1.8\ns1.06-1.27,1.25-1.8c0.37,0.71,0.73,1.46,1.39,1.46c0.52-0.03,1-0.33,1.26-0.78c-1.82-0.5-2.67-3.12-2.67-6.67\nc-0.01-0.95,0.07-1.89,0.23-2.82c0.68,0.96,1.1,2.07,1.21,3.24c0.31-0.26,0.53-0.61,0.63-1c0.61,0.75,1.15,1.54,1.62,2.38\nc-0.66,0-1.45-0.16-1.7-0.16c-0.67,0-0.82,0.38-0.82,0.71c0,0.49,0.51,1,0.86,1.27c0.3-0.67,1.59-0.57,1.59-0.57\nc0.24-0.02,0.47-0.02,0.71,0c-0.02,0.2-0.02,0.41,0,0.61v0.69c0.11,0.66-0.12,1.33-0.62,1.77c0.25,0.19,0.55,0.3,0.86,0.31\nc0.91,0,1-0.65,1-2.08c0.01-0.1,0.01-0.2,0-0.3c0.52,0.47,0.87,1.11,1,1.8c0.02,0.14,0.02,0.28,0,0.42\nc0.61-0.11,1.06-0.62,1.12-1.23c0-0.74-1.15-1.67-1.52-2.08h0.13c1.25,0,1.5,0.42,1.63,0.73c0.4-0.35,0.63-0.85,0.62-1.38\nc0-0.35-0.07-0.75-0.75-0.75c-0.78,0.02-1.55,0.09-2.32,0.22c-0.76-1.02-1.43-2.1-2-3.23c0.3,0.04,0.6,0.06,0.9,0.05\nc0.19,0.01,0.39-0.02,0.57-0.08c-2.07-1.79-3.8-4.12-3.8-6.76c0.02-0.44,0.1-0.88,0.24-1.3h0.16l5.24,8.39\nc1.57,2.48,2.8,2.43,4.65,2.43c-1.19-0.97-2.21-2.14-3-3.45l-4.92-7.87c0.27-0.08,0.53-0.18,0.79-0.28l4.35,7\nc1.57,2.48,2.8,2.44,4.65,2.44c-1.19-0.97-2.21-2.14-3-3.45l-4.23-6.77c0.24-0.13,0.48-0.27,0.7-0.41l3.42,5.55\nc1.57,2.49,2.8,2.44,4.65,2.44c-1.19-0.97-2.21-2.13-3-3.45l-3.55-5.69c0.2-0.18,0.4-0.38,0.59-0.58l2.52,4\nc1.57,2.48,2.8,2.44,4.65,2.44c-1.2-0.97-2.21-2.14-3-3.46l-2.99-4.7c0.16-0.29,0.29-0.59,0.4-0.9L31.25,12.23z"}),m=class{constructor(n){c(this,n),this._org=void 0,this.state={_org:t["Informationstechnikzentrum Bund"]}}validateOrg(c){"string"==typeof c&&d.has(c)?l(this,"_org",c):s(`Die verwendete Abkürzung (${c}) ist nicht definiert!`)}componentWillLoad(){this.validateOrg(this._org)}render(){var c;return n("svg",{"aria-label":r("kol-logo-description",{placeholders:{orgShort:this.state._org,orgLong:p(this.state._org)}}),role:"img",viewBox:"0 0 225 100"},n("rect",{width:"100%",height:"100%",fill:"white"}),n("svg",{x:"0",y:"4",height:"75"},n(g,null)),n("svg",{x:"40.5",y:"3.5",height:"100"},n("rect",{width:"5",height:"30"}),n("rect",{y:"30",width:"5",height:"30",fill:"red"}),n("rect",{y:"60",width:"5",height:"30",fill:"#fc0"})),n("svg",{x:"50",y:"0"},n("text",{x:"0",y:"-0.05em","font-family":"BundesSans Web",style:{backgroundColor:"white",color:"black"}},o.has(this.state._org)?n("tspan",null,null===(c=o.get(this.state._org))||void 0===c?void 0:c.map(((c,t)=>n("tspan",{x:"0",dy:"1.1em",key:`kol-logo-text-${t}`},c)))):n("tspan",{fill:"red"},n("tspan",{x:"0",dy:"1.1em"},"Der Schlüsselwert"),n("tspan",{x:"0",dy:"1.1em","font-weight":"bold"},"'",this.state._org,"'"),n("tspan",{x:"0",dy:"1.1em"},"ist nicht definiert."),n("tspan",{x:"0",dy:"1.1em"},"oder freigegeben.")))))}static get watchers(){return{_org:["validateOrg"]}}};m.style={default:a};export{m as kol_logo};
|
|
@@ -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 e}from"./index-d0c806ea.js";import{v as a}from"./label-
|
|
4
|
+
import{r as t,h as i,H as e}from"./index-d0c806ea.js";import{v as a}from"./label-c130b72e.js";import{f as n}from"./a11y.tipps-348ca42a.js";import{d as s}from"./dev.utils-9b878520.js";import{w as o,s as l,d as r}from"./prop.validators-e40c3380.js";import"./reuse-b3566e4c.js";const h=":host{--a11y-min-size:44px;font-size:inherit}*{font-family:Verdana;hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.overlay{background-color:rgba(0, 0, 0, 0.33);display:flex;height:100%;inset:0;position:fixed;width:100%;z-index:100}.modal{margin:auto;max-height:100%;max-width:100%}",d=class{constructor(e){t(this,e),this.onKeyDown=t=>{t&&"Escape"===t.code&&(this._activeElement=null)},this._activeElement=void 0,this._label=void 0,this._on=void 0,this._width="100%",this.state={_activeElement:null,_label:"…",_width:"100%"}}componentDidRender(){this.hostElement&&(this.state._activeElement?s().Modal.openModal(this.hostElement,this.state._activeElement):s().Modal.closeModal(this.hostElement))}disconnectedCallback(){this.hostElement&&s().Modal.closeModal(this.hostElement)}render(){return i(e,{ref:t=>{this.hostElement=t}},this.state._activeElement&&i("div",{class:"overlay"},i("div",{class:"modal",style:{width:this.state._width},"aria-label":this.state._label,"aria-modal":"true",role:"dialog",onKeyDown:this.onKeyDown,ref:t=>{t&&(t.setAttribute("tabindex","0"),setTimeout((()=>t.focus()),250))}},i("slot",null))))}validateActiveElement(t){o(this,"_activeElement",(t=>"object"==typeof t||null===t),new Set(["HTMLElement","null"]),t,{defaultValue:null,hooks:{afterPatch:()=>{var t;null===this._activeElement&&(null===(t=this.state._on)||void 0===t?void 0:t.onClose)&&this.state._on.onClose()}}})}validateLabel(t){a(this,t)}validateOn(t){if("object"==typeof t&&null!==t){n("[KolTabs] Prüfen, wie man auch einen EventCallback einzeln ändern kann.");const e={};"function"!=typeof t.onClose&&!0!==t.onClose||(e.onClose=t.onClose),l(this,"_on",e)}}validateWidth(t){r(this,"_width",t,{defaultValue:"100%"})}componentWillLoad(){this.validateActiveElement(this._activeElement),this.validateLabel(this._label),this.validateOn(this._on),this.validateWidth(this._width)}static get watchers(){return{_activeElement:["validateActiveElement"],_label:["validateLabel"],_on:["validateOn"],_width:["validateWidth"]}}};d.style={default:h};export{d as kol_modal};
|
|
@@ -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 e}from"./index-d0c806ea.js";import{a,w as
|
|
4
|
+
import{r as t,h as i,H as e}from"./index-d0c806ea.js";import{a}from"./i18n-9c7e636f.js";import{a as n,w as s}from"./prop.validators-e40c3380.js";import{v as l}from"./hide-label-ff12ad0b.js";import{v as o}from"./label-c130b72e.js";import{g as r,b as h,d as c}from"./a11y.tipps-348ca42a.js";import{r as d,a as p}from"./unique-nav-labels-c6750f60.js";import{w as u}from"./validation-3a52d0f0.js";import"./index-5d267931.js";import"./dev.utils-9b878520.js";import"./reuse-b3566e4c.js";const b=(t,i)=>{n(t,"_collapsible",i)},v=(t,i)=>{n(t,"_hasCompactButton",i)},m=":host{--a11y-min-size:44px;font-size:inherit}*{font-family:Verdana;hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}:host>div{display:grid;place-items:center}nav{width:100%}.list{display:flex;list-style:none;margin:0;padding:0}.list.vertical{flex-direction:column}.entry{display:flex}.entry kol-button-wc:first-child,.entry kol-link-wc,.entry kol-span-wc{flex-grow:1}.entry kol-span-wc{justify-items:start}",f=class{constructor(a){t(this,a),this.onClick=t=>{t._active=!t._active,this.state=Object.assign({},this.state)},this.hasActiveChild=t=>!!(Array.isArray(t._children)&&t._children.length>0)&&t._children.some(this.hasActiveChild),this.linkList=t=>i("ul",{class:"list "+(0===t.deep&&"horizontal"===t.orientation?" horizontal":" vertical"),"data-deep":t.deep},t.links.map(((i,a)=>this.li(t.collapsible,t.hideLabel,t.deep,a,i,t.orientation)))),this._ariaCurrentValue=!1,this._collapsible=!0,this._hasCompactButton=!1,this._hideLabel=!1,this._label=void 0,this._links=void 0,this._orientation="vertical",this.state={_ariaCurrentValue:!1,_collapsible:!0,_hasCompactButton:!1,_hideLabel:!1,_label:"…",_links:[],_orientation:"vertical"}}entry(t,a,e,n,l){return i("div",{class:{entry:!0,"hide-label":a}},i("kol-button-link-text-switch",{_link:Object.assign(Object.assign({},n),{_hideLabel:a})}),e?this.expandButton(t,n,l):"")}expandButton(t,a,e){return i("kol-button-wc",{class:"expand-button",_ariaExpanded:e,_disabled:!t,_icons:"codicon codicon-"+(e?"remove":"add"),_hideLabel:!0,_label:`Untermenü zu ${a._label} ${e?"schließen":"öffnen"}`,_on:{onClick:()=>this.onClick(a)}})}li(t,a,e,n,l,s){const o=!!l._active,r=Array.isArray(l._children)&&l._children.length>0,h=r&&o;return i("li",{class:{active:o,expanded:h,"has-children":r},key:n},this.entry(t,a,r,l,o),h?i(this.linkList,{collapsible:t,hideLabel:a,deep:e+1,links:l._children||[],orientation:s}):"")}render(){let t=this.state._hasCompactButton;"horizontal"===this.state._orientation&&!0===this.state._hasCompactButton&&(t=!1,r("[KolNav] Wenn eine horizontale Navigation verwendet wird, kann die Option _hasCompactButton nicht aktiviert werden."));const n=!0===this.state._collapsible,l=!0===this.state._hideLabel,s=this.state._orientation;return i(e,null,i("div",{class:{[s]:!0}},i("nav",{"aria-label":this.state._label,id:"nav"},i(this.linkList,{collapsible:n,hideLabel:l,deep:0,links:this.state._links,orientation:s})),t&&i("div",{class:"compact"},i("kol-button",{_ariaControls:"nav",_ariaExpanded:!l,_icons:l?"codicon codicon-chevron-right":"codicon codicon-chevron-left",_hideLabel:!0,_label:a(l?"kol-nav-maximize":"kol-nav-minimize"),_on:{onClick:()=>{this.state=Object.assign(Object.assign({},this.state),{_hideLabel:!1===this.state._hideLabel})}},_tooltipAlign:"right",_variant:"ghost"}))))}validateAriaCurrentValue(t){s(this,"_ariaCurrentValue",(t=>!0===t||"date"===t||"location"===t||"page"===t||"step"===t||"time"===t),new Set(["boolean","String {data, location, page, step, time}"]),t)}validateCollapsible(t){b(this,t)}validateHasCompactButton(t){v(this,t)}validateHideLabel(t){l(this,t)}validateLabel(t,i,a=!1){a||d(this.state._label),o(this,t),h(t),p(this.state._label)}validateLinks(t){u("KolNav",this,t),c("[KolNav] Die Navigationsstruktur wird noch nicht rekursiv validiert.")}validateOrientation(t){s(this,"_orientation",(t=>"horizontal"===t||"vertical"===t),new Set(["Orientation {horizontal, vertical}"]),t,{defaultValue:"vertical"})}componentWillLoad(){this.validateAriaCurrentValue(this._ariaCurrentValue),this.validateCollapsible(this._collapsible),this.validateHideLabel(this._hideLabel),this.validateHasCompactButton(this._hasCompactButton),this.validateLabel(this._label,void 0,!0),this.validateLinks(this._links),this.validateOrientation(this._orientation)}disconnectedCallback(){d(this.state._label)}static get watchers(){return{_ariaCurrentValue:["validateAriaCurrentValue"],_collapsible:["validateCollapsible"],_hasCompactButton:["validateHasCompactButton"],_hideLabel:["validateHideLabel"],_label:["validateLabel"],_links:["validateLinks"],_orientation:["validateOrientation"]}}};f.style={default:m};export{f as kol_nav};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["validateCollapsible","component","value","watchBoolean","defaultStyleCss","KolNav","this","onClick","link","_active","state","Object","assign","hasActiveChild","Array","isArray","_children","length","some","linkList","props","h","class","deep","orientation","links","map","index","li","collapsible","hideLabel","_ariaCurrentValue","_collapsible","_hideLabel","_label","_links","_orientation","entry","hasChildren","expanded","_link","expandButton","_ariaExpanded","_disabled","_icons","_on","active","key","render","Host","id","validateAriaCurrentValue","watchValidator","Set","validateHideLabel","validateLabel","_oldValue","initial","removeNavLabel","a11yHintLabelingLandmarks","addNavLabel","validateLinks","watchNavLinks","devHint","validateOrientation","defaultValue","componentWillLoad","undefined","disconnectedCallback"],"sources":["src/types/props/collapsible.ts","src/components/nav/style.css?tag=kol-nav&mode=default&encapsulation=shadow","src/components/nav/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\n\nimport { watchBoolean } from '../../utils/prop.validators';\n\n/* types */\nexport type CollapsiblePropType = boolean;\n\n/**\n * Defines if navigation nodes can be collapsed or not.\n */\nexport type PropCollapsible = {\n\tcollapsible: CollapsiblePropType;\n};\n\n/* validator */\nexport const validateCollapsible = (component: Generic.Element.Component, value?: CollapsiblePropType): void => {\n\twatchBoolean(component, '_collapsible', value);\n};\n","@import url(../style.css);\n:host > div {\n\tdisplay: grid;\n\tplace-items: center;\n}\nnav {\n\twidth: 100%;\n}\n.list {\n\tdisplay: flex;\n\tlist-style: none;\n\tmargin: 0;\n\tpadding: 0;\n}\n.list.vertical {\n\tflex-direction: column;\n}\n.entry {\n\tdisplay: flex;\n}\n.entry kol-button-wc:first-child,\n.entry kol-link-wc,\n.entry kol-span-wc {\n\tflex-grow: 1;\n}\n.entry kol-span-wc {\n\tjustify-items: start;\n}\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\nimport { ButtonOrLinkOrTextWithChildrenProps, ButtonWithChildrenProps } from '../../types/button-link-text';\nimport { Stringified } from '../../types/common';\nimport { Orientation } from '../../types/orientation';\nimport { AriaCurrentPropType } from '../../types/props/aria-current';\nimport { CollapsiblePropType, validateCollapsible } from '../../types/props/collapsible';\nimport { HideLabelPropType, validateHideLabel } from '../../types/props/hide-label';\nimport { LabelPropType, validateLabel } from '../../types/props/label';\nimport { a11yHintLabelingLandmarks, devHint } from '../../utils/a11y.tipps';\nimport { watchValidator } from '../../utils/prop.validators';\nimport { addNavLabel, removeNavLabel } from '../../utils/unique-nav-labels';\nimport { API, States } from './types';\nimport { watchNavLinks } from './validation';\n\nconst linkValidator = (link: ButtonOrLinkOrTextWithChildrenProps): boolean => {\n\tif (typeof link === 'object' && typeof link._label === 'string' /* && typeof newLink._href === 'string' */) {\n\t\tif (Array.isArray(link._children)) {\n\t\t\treturn linksValidator(link._children);\n\t\t}\n\t\treturn false;\n\t}\n\treturn true;\n};\n\nconst linksValidator = (links: ButtonOrLinkOrTextWithChildrenProps[]): boolean => {\n\tif (Array.isArray(links)) {\n\t\treturn links.find(linkValidator) !== undefined;\n\t}\n\treturn true;\n};\n\n@Component({\n\ttag: 'kol-nav',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolNav implements API {\n\tprivate readonly onClick = (link: ButtonOrLinkOrTextWithChildrenProps): void => {\n\t\tlink._active = !link._active;\n\t\tthis.state = {\n\t\t\t...this.state,\n\t\t};\n\t};\n\n\tprivate readonly hasActiveChild = (link: ButtonOrLinkOrTextWithChildrenProps): boolean => {\n\t\tif (Array.isArray(link._children) && link._children.length > 0) {\n\t\t\treturn link._children.some(this.hasActiveChild);\n\t\t}\n\n\t\treturn false;\n\t};\n\n\tprivate entry(\n\t\tcollapsible: boolean,\n\t\thideLabel: HideLabelPropType,\n\t\thasChildren: boolean,\n\t\tlink: ButtonOrLinkOrTextWithChildrenProps,\n\t\texpanded: boolean\n\t): JSX.Element {\n\t\treturn (\n\t\t\t<div class={{ entry: true, 'hide-label': hideLabel }}>\n\t\t\t\t<kol-button-link-text-switch\n\t\t\t\t\t_link={{\n\t\t\t\t\t\t...link,\n\t\t\t\t\t\t_hideLabel: hideLabel,\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t{hasChildren ? this.expandButton(collapsible, link as ButtonWithChildrenProps, expanded) : ''}\n\t\t\t</div>\n\t\t);\n\t}\n\n\tprivate expandButton(collapsible: boolean, link: ButtonWithChildrenProps, expanded: boolean): JSX.Element {\n\t\treturn (\n\t\t\t<kol-button-wc\n\t\t\t\tclass=\"expand-button\"\n\t\t\t\t_ariaExpanded={expanded}\n\t\t\t\t_disabled={!collapsible}\n\t\t\t\t_icons={'codicon codicon-' + (expanded ? 'remove' : 'add')}\n\t\t\t\t_hideLabel\n\t\t\t\t_label={`Untermenü zu ${link._label} ${expanded ? 'schließen' : 'öffnen'}`}\n\t\t\t\t_on={{ onClick: () => this.onClick(link) }}\n\t\t\t></kol-button-wc>\n\t\t);\n\t}\n\n\tprivate li(\n\t\tcollapsible: boolean,\n\t\thideLabel: HideLabelPropType,\n\t\tdeep: number,\n\t\tindex: number,\n\t\tlink: ButtonOrLinkOrTextWithChildrenProps,\n\t\torientation: Orientation\n\t): JSX.Element {\n\t\tconst active = !!link._active;\n\t\tconst hasChildren = Array.isArray(link._children) && link._children.length > 0;\n\t\tconst expanded = hasChildren && active;\n\t\treturn (\n\t\t\t<li\n\t\t\t\tclass={{\n\t\t\t\t\tactive,\n\t\t\t\t\texpanded,\n\t\t\t\t\t'has-children': hasChildren,\n\t\t\t\t}}\n\t\t\t\tkey={index}\n\t\t\t>\n\t\t\t\t{this.entry(collapsible, hideLabel, hasChildren, link, active)}\n\t\t\t\t{expanded ? (\n\t\t\t\t\t<this.linkList collapsible={collapsible} hideLabel={hideLabel} deep={deep + 1} links={link._children || []} orientation={orientation} />\n\t\t\t\t) : (\n\t\t\t\t\t''\n\t\t\t\t)}\n\t\t\t</li>\n\t\t);\n\t}\n\n\tprivate linkList = (props: {\n\t\tcollapsible: boolean;\n\t\thideLabel: HideLabelPropType;\n\t\tdeep: number;\n\t\tlinks: ButtonOrLinkOrTextWithChildrenProps[];\n\t\torientation: Orientation;\n\t}): JSX.Element => {\n\t\treturn (\n\t\t\t<ul class={`list ${props.deep === 0 && props.orientation === 'horizontal' ? ' horizontal' : ' vertical'}`} data-deep={props.deep}>\n\t\t\t\t{props.links.map((link, index: number) => {\n\t\t\t\t\treturn this.li(props.collapsible, props.hideLabel, props.deep, index, link, props.orientation);\n\t\t\t\t})}\n\t\t\t</ul>\n\t\t);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst collapsible = this.state._collapsible === true;\n\t\tconst hideLabel = this.state._hideLabel === true;\n\t\tconst orientation = this.state._orientation;\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<div\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t[orientation]: true,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<nav aria-label={this.state._label} id=\"nav\">\n\t\t\t\t\t\t<this.linkList collapsible={collapsible} hideLabel={hideLabel} deep={0} links={this.state._links} orientation={orientation}></this.linkList>\n\t\t\t\t\t</nav>\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Defines the value of aria-current to be used with the current context within the navigation.\n\t */\n\t@Prop() public _ariaCurrentValue: AriaCurrentPropType = false;\n\n\t/**\n\t * Defines if navigation nodes can be collapsed or not. Enabled by default.\n\t * @TODO: Change type back to `CollapsiblePropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _collapsible?: boolean = true;\n\n\t/**\n\t * Hides the caption by default and displays the caption text with a tooltip when the\n\t * interactive element is focused or the mouse is over it.\n\t * @TODO: Change type back to `HideLabelPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _hideLabel?: boolean = false;\n\n\t/**\n\t * Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.).\n\t */\n\t@Prop() public _label!: LabelPropType;\n\n\t/**\n\t * Defines the list of links, buttons or texts to render.\n\t */\n\t@Prop() public _links!: Stringified<ButtonOrLinkOrTextWithChildrenProps[]>;\n\n\t/**\n\t * Defines whether the orientation of the component is horizontal or vertical.\n\t */\n\t@Prop() public _orientation?: Orientation = 'vertical';\n\n\t@State() public state: States = {\n\t\t_ariaCurrentValue: false,\n\t\t_collapsible: true,\n\t\t_hideLabel: false,\n\t\t_label: '…', // ⚠ required\n\t\t_links: [],\n\t\t_orientation: 'vertical',\n\t};\n\n\t@Watch('_ariaCurrentValue')\n\tpublic validateAriaCurrentValue(value?: AriaCurrentPropType): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_ariaCurrentValue',\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('_collapsible')\n\tpublic validateCollapsible(value?: CollapsiblePropType): void {\n\t\tvalidateCollapsible(this, value);\n\t}\n\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: HideLabelPropType) {\n\t\tvalidateHideLabel(this, value);\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: LabelPropType, _oldValue?: LabelPropType, initial = false): void {\n\t\tif (!initial) {\n\t\t\tremoveNavLabel(this.state._label); // remove the current\n\t\t}\n\t\tvalidateLabel(this, value);\n\t\ta11yHintLabelingLandmarks(value);\n\t\taddNavLabel(this.state._label); // add the state instead of prop, because the prop could be invalid and not set as new label\n\t}\n\n\t@Watch('_links')\n\tpublic validateLinks(value?: Stringified<ButtonOrLinkOrTextWithChildrenProps[]>): void {\n\t\twatchNavLinks('KolNav', this, value);\n\t\tdevHint(`[KolNav] Die Navigationsstruktur wird noch nicht rekursiv validiert.`);\n\t}\n\n\t@Watch('_orientation')\n\tpublic validateOrientation(value?: Orientation): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_orientation',\n\t\t\t(value): boolean => value === 'horizontal' || value === 'vertical',\n\t\t\tnew Set(['Orientation {horizontal, vertical}']),\n\t\t\tvalue,\n\t\t\t{\n\t\t\t\tdefaultValue: 'vertical',\n\t\t\t}\n\t\t);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAriaCurrentValue(this._ariaCurrentValue);\n\t\tthis.validateCollapsible(this._collapsible);\n\t\tthis.validateHideLabel(this._hideLabel);\n\t\tthis.validateLabel(this._label, undefined, true);\n\t\tthis.validateLinks(this._links);\n\t\tthis.validateOrientation(this._orientation);\n\t}\n\n\tpublic disconnectedCallback(): void {\n\t\tremoveNavLabel(this.state._label);\n\t}\n}\n\n// console.log(\n// stringifyJson([\n// { _label: '1 Navigationspunkt', _href: '#abc', _icons: 'codicon codicon-folder-closed', _target: 'asdasd' },\n// { _label: '2 Navigationspunkt', _href: '#abc', _icons: 'codicon codicon-folder-closed' },\n// {\n// _active: true,\n// _label: '3 Navigationspunkt',\n// _href: '#abc',\n// _icons: 'codicon codicon-folder-closed',\n// _children: [\n// { _label: '3.1 Navigationspunkt', _href: '#abc', _icons: 'codicon codicon-folder-closed' },\n// { _label: '3.2 Navigationspunkt', _href: '#abc', _icons: 'codicon codicon-folder-closed', _target: 'asdasd' },\n// {\n// _active: true,\n// _label: '3.3 Navigationspunkt',\n// _href: '#abc',\n// _children: [\n// { _active: true, _label: '3.3.1 Navigationspunkt (aktiv)', _href: '#abc' },\n// { _label: '3.3.2 Navigationspunkt', _href: '#abc' },\n// ],\n// },\n// {\n// _label: '3.4 Navigationspunkt',\n// _href: '#abc',\n// _children: [\n// { _label: '3.4.1 Navigationspunkt', _href: '#abc' },\n// { _label: '3.4.2 Navigationspunkt', _href: '#abc' },\n// ],\n// },\n// { _label: '3.5 Navigationspunkt', _href: '#abc' },\n// ],\n// },\n// { _label: '4 Navigationspunkt', _href: '#abc' },\n// ])\n// );\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"names":["validateCollapsible","component","value","watchBoolean","validateHasCompactButton","defaultStyleCss","KolNav","this","onClick","link","_active","state","Object","assign","hasActiveChild","Array","isArray","_children","length","some","linkList","props","h","class","deep","orientation","links","map","index","li","collapsible","hideLabel","_ariaCurrentValue","_collapsible","_hasCompactButton","_hideLabel","_label","_links","_orientation","entry","hasChildren","expanded","_link","expandButton","_ariaExpanded","_disabled","_icons","_on","active","key","render","hasCompactButton","devWarning","Host","id","_ariaControls","translate","_tooltipAlign","_variant","validateAriaCurrentValue","watchValidator","Set","validateHideLabel","validateLabel","_oldValue","initial","removeNavLabel","a11yHintLabelingLandmarks","addNavLabel","validateLinks","watchNavLinks","devHint","validateOrientation","defaultValue","componentWillLoad","undefined","disconnectedCallback"],"sources":["src/types/props/collapsible.ts","src/types/props/has-compact-button.ts","src/components/nav/style.css?tag=kol-nav&mode=default&encapsulation=shadow","src/components/nav/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\n\nimport { watchBoolean } from '../../utils/prop.validators';\n\n/* types */\nexport type CollapsiblePropType = boolean;\n\n/**\n * Defines if navigation nodes can be collapsed or not.\n */\nexport type PropCollapsible = {\n\tcollapsible: CollapsiblePropType;\n};\n\n/* validator */\nexport const validateCollapsible = (component: Generic.Element.Component, value?: CollapsiblePropType): void => {\n\twatchBoolean(component, '_collapsible', value);\n};\n","import { Generic } from '@a11y-ui/core';\n\nimport { watchBoolean } from '../../utils/prop.validators';\n\ntype HasCompactButtonPropType = boolean;\n\n/**\n * Creates a button below the navigation, that toggles _collapsible. Only available for _orientation=\"vertical\".\n */\nexport type PropHasCompactButton = {\n\thasCompactButton: HasCompactButtonPropType;\n};\n\n/* validator */\nexport const validateHasCompactButton = (component: Generic.Element.Component, value?: HasCompactButtonPropType): void => {\n\twatchBoolean(component, '_hasCompactButton', value);\n};\n","@import url(../style.css);\n:host > div {\n\tdisplay: grid;\n\tplace-items: center;\n}\nnav {\n\twidth: 100%;\n}\n.list {\n\tdisplay: flex;\n\tlist-style: none;\n\tmargin: 0;\n\tpadding: 0;\n}\n.list.vertical {\n\tflex-direction: column;\n}\n.entry {\n\tdisplay: flex;\n}\n.entry kol-button-wc:first-child,\n.entry kol-link-wc,\n.entry kol-span-wc {\n\tflex-grow: 1;\n}\n.entry kol-span-wc {\n\tjustify-items: start;\n}\n","import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { translate } from '../../i18n';\nimport { ButtonOrLinkOrTextWithChildrenProps, ButtonWithChildrenProps } from '../../types/button-link-text';\nimport { Stringified } from '../../types/common';\nimport { Orientation } from '../../types/orientation';\nimport { AriaCurrentPropType } from '../../types/props/aria-current';\nimport { CollapsiblePropType, validateCollapsible } from '../../types/props/collapsible';\nimport { validateHasCompactButton } from '../../types/props/has-compact-button';\nimport { HideLabelPropType, validateHideLabel } from '../../types/props/hide-label';\nimport { LabelPropType, validateLabel } from '../../types/props/label';\nimport { a11yHintLabelingLandmarks, devHint, devWarning } from '../../utils/a11y.tipps';\nimport { watchValidator } from '../../utils/prop.validators';\nimport { addNavLabel, removeNavLabel } from '../../utils/unique-nav-labels';\nimport { API, States } from './types';\nimport { watchNavLinks } from './validation';\n\nconst linkValidator = (link: ButtonOrLinkOrTextWithChildrenProps): boolean => {\n\tif (typeof link === 'object' && typeof link._label === 'string' /* && typeof newLink._href === 'string' */) {\n\t\tif (Array.isArray(link._children)) {\n\t\t\treturn linksValidator(link._children);\n\t\t}\n\t\treturn false;\n\t}\n\treturn true;\n};\n\nconst linksValidator = (links: ButtonOrLinkOrTextWithChildrenProps[]): boolean => {\n\tif (Array.isArray(links)) {\n\t\treturn links.find(linkValidator) !== undefined;\n\t}\n\treturn true;\n};\n\n@Component({\n\ttag: 'kol-nav',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolNav implements API {\n\tprivate readonly onClick = (link: ButtonOrLinkOrTextWithChildrenProps): void => {\n\t\tlink._active = !link._active;\n\t\tthis.state = {\n\t\t\t...this.state,\n\t\t};\n\t};\n\n\tprivate readonly hasActiveChild = (link: ButtonOrLinkOrTextWithChildrenProps): boolean => {\n\t\tif (Array.isArray(link._children) && link._children.length > 0) {\n\t\t\treturn link._children.some(this.hasActiveChild);\n\t\t}\n\n\t\treturn false;\n\t};\n\n\tprivate entry(\n\t\tcollapsible: boolean,\n\t\thideLabel: HideLabelPropType,\n\t\thasChildren: boolean,\n\t\tlink: ButtonOrLinkOrTextWithChildrenProps,\n\t\texpanded: boolean\n\t): JSX.Element {\n\t\treturn (\n\t\t\t<div class={{ entry: true, 'hide-label': hideLabel }}>\n\t\t\t\t<kol-button-link-text-switch\n\t\t\t\t\t_link={{\n\t\t\t\t\t\t...link,\n\t\t\t\t\t\t_hideLabel: hideLabel,\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t{hasChildren ? this.expandButton(collapsible, link as ButtonWithChildrenProps, expanded) : ''}\n\t\t\t</div>\n\t\t);\n\t}\n\n\tprivate expandButton(collapsible: boolean, link: ButtonWithChildrenProps, expanded: boolean): JSX.Element {\n\t\treturn (\n\t\t\t<kol-button-wc\n\t\t\t\tclass=\"expand-button\"\n\t\t\t\t_ariaExpanded={expanded}\n\t\t\t\t_disabled={!collapsible}\n\t\t\t\t_icons={'codicon codicon-' + (expanded ? 'remove' : 'add')}\n\t\t\t\t_hideLabel\n\t\t\t\t_label={`Untermenü zu ${link._label} ${expanded ? 'schließen' : 'öffnen'}`}\n\t\t\t\t_on={{ onClick: () => this.onClick(link) }}\n\t\t\t></kol-button-wc>\n\t\t);\n\t}\n\n\tprivate li(\n\t\tcollapsible: boolean,\n\t\thideLabel: HideLabelPropType,\n\t\tdeep: number,\n\t\tindex: number,\n\t\tlink: ButtonOrLinkOrTextWithChildrenProps,\n\t\torientation: Orientation\n\t): JSX.Element {\n\t\tconst active = !!link._active;\n\t\tconst hasChildren = Array.isArray(link._children) && link._children.length > 0;\n\t\tconst expanded = hasChildren && active;\n\t\treturn (\n\t\t\t<li\n\t\t\t\tclass={{\n\t\t\t\t\tactive,\n\t\t\t\t\texpanded,\n\t\t\t\t\t'has-children': hasChildren,\n\t\t\t\t}}\n\t\t\t\tkey={index}\n\t\t\t>\n\t\t\t\t{this.entry(collapsible, hideLabel, hasChildren, link, active)}\n\t\t\t\t{expanded ? (\n\t\t\t\t\t<this.linkList collapsible={collapsible} hideLabel={hideLabel} deep={deep + 1} links={link._children || []} orientation={orientation} />\n\t\t\t\t) : (\n\t\t\t\t\t''\n\t\t\t\t)}\n\t\t\t</li>\n\t\t);\n\t}\n\n\tprivate linkList = (props: {\n\t\tcollapsible: boolean;\n\t\thideLabel: HideLabelPropType;\n\t\tdeep: number;\n\t\tlinks: ButtonOrLinkOrTextWithChildrenProps[];\n\t\torientation: Orientation;\n\t}): JSX.Element => {\n\t\treturn (\n\t\t\t<ul class={`list ${props.deep === 0 && props.orientation === 'horizontal' ? ' horizontal' : ' vertical'}`} data-deep={props.deep}>\n\t\t\t\t{props.links.map((link, index: number) => {\n\t\t\t\t\treturn this.li(props.collapsible, props.hideLabel, props.deep, index, link, props.orientation);\n\t\t\t\t})}\n\t\t\t</ul>\n\t\t);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tlet hasCompactButton = this.state._hasCompactButton;\n\t\tif (this.state._orientation === 'horizontal' && this.state._hasCompactButton === true) {\n\t\t\thasCompactButton = false;\n\t\t\tdevWarning(`[KolNav] Wenn eine horizontale Navigation verwendet wird, kann die Option _hasCompactButton nicht aktiviert werden.`);\n\t\t}\n\t\tconst collapsible = this.state._collapsible === true;\n\t\tconst hideLabel = this.state._hideLabel === true;\n\t\tconst orientation = this.state._orientation;\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<div\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t[orientation]: true,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<nav aria-label={this.state._label} id=\"nav\">\n\t\t\t\t\t\t<this.linkList collapsible={collapsible} hideLabel={hideLabel} deep={0} links={this.state._links} orientation={orientation}></this.linkList>\n\t\t\t\t\t</nav>\n\t\t\t\t\t{hasCompactButton && (\n\t\t\t\t\t\t<div class=\"compact\">\n\t\t\t\t\t\t\t<kol-button\n\t\t\t\t\t\t\t\t_ariaControls=\"nav\"\n\t\t\t\t\t\t\t\t_ariaExpanded={!hideLabel}\n\t\t\t\t\t\t\t\t_icons={hideLabel ? 'codicon codicon-chevron-right' : 'codicon codicon-chevron-left'}\n\t\t\t\t\t\t\t\t_hideLabel\n\t\t\t\t\t\t\t\t_label={translate(hideLabel ? 'kol-nav-maximize' : 'kol-nav-minimize')}\n\t\t\t\t\t\t\t\t_on={{\n\t\t\t\t\t\t\t\t\tonClick: (): void => {\n\t\t\t\t\t\t\t\t\t\tthis.state = {\n\t\t\t\t\t\t\t\t\t\t\t...this.state,\n\t\t\t\t\t\t\t\t\t\t\t_hideLabel: this.state._hideLabel === false,\n\t\t\t\t\t\t\t\t\t\t};\n\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t_tooltipAlign=\"right\"\n\t\t\t\t\t\t\t\t_variant=\"ghost\"\n\t\t\t\t\t\t\t></kol-button>\n\t\t\t\t\t\t</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 * Defines the value of aria-current to be used with the current context within the navigation.\n\t */\n\t@Prop() public _ariaCurrentValue: AriaCurrentPropType = false;\n\n\t/**\n\t * Defines if navigation nodes can be collapsed or not. Enabled by default.\n\t * @TODO: Change type back to `CollapsiblePropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _collapsible?: boolean = true;\n\n\t/**\n\t * Gibt an, ob die Navigation eine zusätzliche Schaltfläche zum Aus- und Einklappen der Navigation anzeigen soll.\n\t */\n\t@Prop() public _hasCompactButton?: boolean = false;\n\n\t/**\n\t * Hides the caption by default and displays the caption text with a tooltip when the\n\t * interactive element is focused or the mouse is over it.\n\t * @TODO: Change type back to `HideLabelPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _hideLabel?: boolean = false;\n\n\t/**\n\t * Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.).\n\t */\n\t@Prop() public _label!: LabelPropType;\n\n\t/**\n\t * Defines the list of links, buttons or texts to render.\n\t */\n\t@Prop() public _links!: Stringified<ButtonOrLinkOrTextWithChildrenProps[]>;\n\n\t/**\n\t * Defines whether the orientation of the component is horizontal or vertical.\n\t */\n\t@Prop() public _orientation?: Orientation = 'vertical';\n\n\t@State() public state: States = {\n\t\t_ariaCurrentValue: false,\n\t\t_collapsible: true,\n\t\t_hasCompactButton: false,\n\t\t_hideLabel: false,\n\t\t_label: '…', // ⚠ required\n\t\t_links: [],\n\t\t_orientation: 'vertical',\n\t};\n\n\t@Watch('_ariaCurrentValue')\n\tpublic validateAriaCurrentValue(value?: AriaCurrentPropType): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_ariaCurrentValue',\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('_collapsible')\n\tpublic validateCollapsible(value?: CollapsiblePropType): void {\n\t\tvalidateCollapsible(this, value);\n\t}\n\n\t@Watch('_hasCompactButton')\n\tpublic validateHasCompactButton(value?: boolean): void {\n\t\tvalidateHasCompactButton(this, value);\n\t}\n\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: HideLabelPropType) {\n\t\tvalidateHideLabel(this, value);\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: LabelPropType, _oldValue?: LabelPropType, initial = false): void {\n\t\tif (!initial) {\n\t\t\tremoveNavLabel(this.state._label); // remove the current\n\t\t}\n\t\tvalidateLabel(this, value);\n\t\ta11yHintLabelingLandmarks(value);\n\t\taddNavLabel(this.state._label); // add the state instead of prop, because the prop could be invalid and not set as new label\n\t}\n\n\t@Watch('_links')\n\tpublic validateLinks(value?: Stringified<ButtonOrLinkOrTextWithChildrenProps[]>): void {\n\t\twatchNavLinks('KolNav', this, value);\n\t\tdevHint(`[KolNav] Die Navigationsstruktur wird noch nicht rekursiv validiert.`);\n\t}\n\n\t@Watch('_orientation')\n\tpublic validateOrientation(value?: Orientation): void {\n\t\twatchValidator(\n\t\t\tthis,\n\t\t\t'_orientation',\n\t\t\t(value): boolean => value === 'horizontal' || value === 'vertical',\n\t\t\tnew Set(['Orientation {horizontal, vertical}']),\n\t\t\tvalue,\n\t\t\t{\n\t\t\t\tdefaultValue: 'vertical',\n\t\t\t}\n\t\t);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAriaCurrentValue(this._ariaCurrentValue);\n\t\tthis.validateCollapsible(this._collapsible);\n\t\tthis.validateHideLabel(this._hideLabel);\n\t\tthis.validateHasCompactButton(this._hasCompactButton);\n\t\tthis.validateLabel(this._label, undefined, true);\n\t\tthis.validateLinks(this._links);\n\t\tthis.validateOrientation(this._orientation);\n\t}\n\n\tpublic disconnectedCallback(): void {\n\t\tremoveNavLabel(this.state._label);\n\t}\n}\n\n// console.log(\n// stringifyJson([\n// { _label: '1 Navigationspunkt', _href: '#abc', _icons: 'codicon codicon-folder-closed', _target: 'asdasd' },\n// { _label: '2 Navigationspunkt', _href: '#abc', _icons: 'codicon codicon-folder-closed' },\n// {\n// _active: true,\n// _label: '3 Navigationspunkt',\n// _href: '#abc',\n// _icons: 'codicon codicon-folder-closed',\n// _children: [\n// { _label: '3.1 Navigationspunkt', _href: '#abc', _icons: 'codicon codicon-folder-closed' },\n// { _label: '3.2 Navigationspunkt', _href: '#abc', _icons: 'codicon codicon-folder-closed', _target: 'asdasd' },\n// {\n// _active: true,\n// _label: '3.3 Navigationspunkt',\n// _href: '#abc',\n// _children: [\n// { _active: true, _label: '3.3.1 Navigationspunkt (aktiv)', _href: '#abc' },\n// { _label: '3.3.2 Navigationspunkt', _href: '#abc' },\n// ],\n// },\n// {\n// _label: '3.4 Navigationspunkt',\n// _href: '#abc',\n// _children: [\n// { _label: '3.4.1 Navigationspunkt', _href: '#abc' },\n// { _label: '3.4.2 Navigationspunkt', _href: '#abc' },\n// ],\n// },\n// { _label: '3.5 Navigationspunkt', _href: '#abc' },\n// ],\n// },\n// { _label: '4 Navigationspunkt', _href: '#abc' },\n// ])\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 s}from"./index-d0c806ea.js";import{a as e}from"./i18n-
|
|
4
|
+
import{r as t,h as i,H as s}from"./index-d0c806ea.js";import{a as e}from"./i18n-9c7e636f.js";import{v as a,a as o}from"./custom-class-87071d99.js";import{v as n}from"./label-c130b72e.js";import{v as l}from"./tooltip-align-88b82267.js";import{n as h}from"./dev.utils-9b878520.js";import{e as r,w as c,c as p,p as u}from"./prop.validators-e40c3380.js";import{r as d,a as _}from"./unique-nav-labels-c6750f60.js";import{S as f}from"./reuse-b3566e4c.js";import"./index-5d267931.js";import"./a11y.tipps-348ca42a.js";import"./alignment-1bffdb6e.js";const b=(t,a,e)=>{r(t,"_max",a,e)},g=":host{--a11y-min-size:44px;font-size:inherit}*{font-family:Verdana;hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.navigation-list{list-style:none}.separator:before{content:'•••'}",m={left:"codicon codicon-debug-reverse-continue"},v={left:"codicon codicon-chevron-left"},y={right:"codicon codicon-chevron-right"},k={right:"codicon codicon-debug-continue"},x=class{constructor(a){t(this,a),this.nonce=h(),this.calcCount=(t,a=1)=>Math.ceil(t/a),this.getCount=()=>this.calcCount(this.state._max,this.state._pageSize),this.onClick=(t,a)=>{"function"==typeof this.state._on.onClick&&this.state._on.onClick(t,a),this.onChangePage(t,a)},this.onChangePage=(t,a)=>{const e=setTimeout((()=>{clearTimeout(e),"function"==typeof this.state._on.onChangePage&&this.state._on.onChangePage(t,a)}))},this.onChangePageSize=(t,a)=>{if("number"==typeof(a=parseInt(a[0]))&&a>0&&this._pageSize!==a){this._pageSize=a;const e=setTimeout((()=>{clearTimeout(e),"function"==typeof this.state._on.onChangePageSize&&this.state._on.onChangePageSize(t,this._pageSize)}))}},this.onGoToFirst={onClick:t=>{this.onClick(t,1)}},this.onGoToEnd={onClick:t=>{this.onClick(t,this.getCount())}},this.onGoBackward={onClick:t=>{this.onClick(t,this.state._page-1)}},this.onGoForward={onClick:t=>{this.onClick(t,this.state._page+1)}},this.beforePageSize=(t,a)=>{let e=a.has("_pageSize")?a.get("_pageSize"):this.state._pageSize;const i=a.has("_pageSizeOptions")?a.get("_pageSizeOptions"):this.state._pageSizeOptions;if(Array.isArray(i)&&i.length>0){const t=i.find((t=>t.value===e));e=void 0===t?i[0].value:t.value,a.set("_pageSize",e)}const s=a.has("_page")?a.get("_page"):this.state._page,o=a.has("_max")?a.get("_max"):this.state._max;this.syncPage(a,s,a.get("_pageSize"),o)},this.syncPage=(t,a,e,i)=>{if(i>0){const s=this.calcCount(i,e);s>0&&(a>s?(t.set("_page",s),this.onChangePage(f,s)):a<1&&(t.set("_page",1),this.onChangePage(f,1)))}},this.beforePageSizeOptions=(t,a)=>{const i=[];if(Array.isArray(t))for(const a of t)"number"==typeof a&&i.push({label:e("kol-page-per-site",{placeholders:{entries:`${a}`}}),value:a});a.set("_pageSizeOptions",i),this.beforePageSize(i,a)},this._boundaryCount=1,this._customClass=void 0,this._label=void 0,this._hasButtons=!0,this._page=void 0,this._pageSize=1,this._pageSizeOptions=[],this._on=void 0,this._siblingCount=1,this._tooltipAlign="top",this._max=void 0,this._variant="normal",this.state={_boundaryCount:1,_label:e("kol-pagination"),_hasButtons:{first:!0,last:!0,next:!0,previous:!0},_on:{onClick:()=>null},_page:0,_pageSize:1,_pageSizeOptions:[],_siblingCount:1,_max:0,_variant:"normal"}}render(){var t;let a=!1;const o=this.getCount(),n=Array.from(Array(o).keys()).map((t=>t+1)).map((t=>t<=this.state._boundaryCount||t>o-this.state._boundaryCount||t>=this.state._page-this.state._siblingCount&&t<=this.state._page+this.state._siblingCount?(a=!0,this.state._page===t?this.getSelectedPageButton(t):this.getUnselectedPageButton(t)):!0===a?(a=!1,i("li",null,i("span",{class:"separator",key:`${this.nonce}-el-${t}`,"aria-hidden":"true"}))):null));return i(s,null,i("nav",{"aria-label":this.state._label},i("ul",{class:"navigation-list"},this.state._hasButtons.first&&i("li",null,i("kol-button",{class:"first",exportparts:"icon",_customClass:this.state._customClass,_disabled:this.state._page<=1,_icons:m,_hideLabel:!0,_label:e("kol-page-first"),_on:this.onGoToFirst,_variant:this.state._variant,_tooltipAlign:this.state._tooltipAlign})),this.state._hasButtons.previous&&i("li",null,i("kol-button",{class:"previous",exportparts:"icon",_customClass:this.state._customClass,_disabled:this.state._page<=1,_icons:v,_hideLabel:!0,_label:e("kol-page-back"),_on:this.onGoBackward,_variant:this.state._variant,_tooltipAlign:this.state._tooltipAlign})),n,this.state._hasButtons.next&&i("li",null,i("kol-button",{class:"next",exportparts:"icon",_customClass:this.state._customClass,_disabled:o<=this.state._page,_icons:y,_hideLabel:!0,_label:e("kol-page-next"),_on:this.onGoForward,_variant:this.state._variant,_tooltipAlign:this.state._tooltipAlign})),this.state._hasButtons.last&&i("li",null,i("kol-button",{class:"last",exportparts:"icon",_customClass:this.state._customClass,_disabled:o<=this.state._page,_icons:k,_hideLabel:!0,_label:e("kol-page-last"),_on:this.onGoToEnd,_variant:this.state._variant,_tooltipAlign:this.state._tooltipAlign})))),(null===(t=this.state._pageSizeOptions)||void 0===t?void 0:t.length)>0&&i("kol-select",{_hideLabel:!0,_id:`pagination-size-${this.nonce}`,_label:e("kol-entries-per-site"),_options:this.state._pageSizeOptions,_on:{onChange:this.onChangePageSize},_value:[this.state._pageSize]}))}getUnselectedPageButton(t){return i("li",null,i("kol-button",{exportparts:"icon",key:`${this.nonce}-${t}`,_customClass:this.state._customClass,_label:`${t}`,_on:{onClick:a=>{this.onClick(a,t)}},_variant:this.state._variant}))}getSelectedPageButton(t){return i("li",null,i("kol-button-wc",{class:"selected",key:`${this.nonce}-selected`,_customClass:this.state._customClass,_disabled:!0,_label:`${t}`,_variant:this.state._variant}))}validateBoundaryCount(t){r(this,"_boundaryCount",Math.max(0,null!=t?t:1))}validateCustomClass(t){a(this,t)}validateLabel(t,a,e=!1){e||d(this.state._label),n(this,t),_(this.state._label)}validateHasButtons(t){c(this,"_hasButtons",(t=>"boolean"==typeof t||"string"==typeof t||"object"==typeof t&&null!==t),new Set(["Boolean","PaginationHasButton"]),t,{hooks:{beforePatch:(t,a)=>{if("boolean"==typeof t)a.set("_hasButtons",{first:t,last:t,next:t,previous:t});else{if("string"==typeof t)try{t=u(t)}catch(t){a.delete("_hasButtons")}"object"==typeof t&&null!==t&&a.set("_hasButtons",Object.assign(Object.assign({},this.state._hasButtons),{first:"boolean"==typeof t.first?!0===t.first:this.state._hasButtons.first,last:"boolean"==typeof t.last?!0===t.last:this.state._hasButtons.last,next:"boolean"==typeof t.next?!0===t.next:this.state._hasButtons.next,previous:"boolean"==typeof t.previous?!0===t.previous:this.state._hasButtons.previous}))}}}})}validateOn(t){"object"==typeof t&&null!==t&&(this.state=Object.assign(Object.assign({},this.state),{_on:t}))}validatePage(t){r(this,"_page",t,{hooks:{beforePatch:(t,a)=>{const e=a.has("_pageSize")?a.get("_pageSize"):this.state._pageSize,i=a.has("_max")?a.get("_max"):this.state._max;this.syncPage(a,t,e,i)}}})}validatePageSize(t){r(this,"_pageSize",t,{hooks:{beforePatch:this.beforePageSize}})}validatePageSizeOptions(t){p(this,"_pageSizeOptions",(t=>"number"==typeof t),t,void 0,{hooks:{beforePatch:this.beforePageSizeOptions}})}validateSiblingCount(t){r(this,"_siblingCount",Math.max(0,null!=t?t:1))}validateMax(t){b(this,t,{hooks:{beforePatch:(t,a)=>{const e=a.has("_page")?a.get("_page"):this.state._page,i=a.has("_pageSize")?a.get("_pageSize"):this.state._pageSize;this.syncPage(a,e,i,t)}}})}validateTooltipAlign(t){l(this,t)}validateVariant(t){o(this,t)}componentWillLoad(){this.validateBoundaryCount(this._boundaryCount),this.validateCustomClass(this._customClass),this.validateHasButtons(this._hasButtons),this.validateLabel(this._label,void 0,!0),this.validateOn(this._on),this.validatePage(this._page),this.validatePageSize(this._pageSize),this.validatePageSizeOptions(this._pageSizeOptions),this.validateSiblingCount(this._siblingCount),this.validateTooltipAlign(this._tooltipAlign),this.validateMax(this._max),this.validateVariant(this._variant),this.validatePage(this._page)}disconnectedCallback(){d(this.state._label)}static get watchers(){return{_boundaryCount:["validateBoundaryCount"],_customClass:["validateCustomClass"],_label:["validateLabel"],_hasButtons:["validateHasButtons"],_on:["validateOn"],_page:["validatePage"],_pageSize:["validatePageSize"],_pageSizeOptions:["validatePageSizeOptions"],_siblingCount:["validateSiblingCount"],_max:["validateMax"],_tooltipAlign:["validateTooltipAlign"],_variant:["validateVariant"]}}};x.style={default:g};export{x as kol_pagination};
|
|
@@ -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}from"./index-d0c806ea.js";import{c as o,o as e,f as a,s as n,a as h}from"./floating-ui.dom.esm-e435ab9f.js";import{v as r}from"./align-
|
|
4
|
+
import{r as t,h as i,H as s}from"./index-d0c806ea.js";import{c as o,o as e,f as a,s as n,a as h}from"./floating-ui.dom.esm-e435ab9f.js";import{v as r}from"./align-11b69892.js";import{v as p}from"./show-40a56e1f.js";import{a as l}from"./dev.utils-9b878520.js";import{p as c}from"./reuse-b3566e4c.js";import"./alignment-1bffdb6e.js";import"./prop.validators-e40c3380.js";import"./a11y.tipps-348ca42a.js";const d=":host{--a11y-min-size:44px;font-size:inherit}*{font-family:Verdana;hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}kol-popover{height:0;position:absolute}kol-popover .popover{background-color:#fff;min-height:max-content;min-width:max-content;opacity:0;position:absolute}kol-popover .hidden{display:none}kol-popover .show{animation:0.3s ease-in forwards fadeInOpacity}kol-popover .disappear{animation:0.3s ease-in backwards fadeInOpacity}kol-popover .arrow{background-color:inherit;height:var(--font-size);position:absolute;rotate:0.125turn;width:var(--font-size);z-index:-1}@keyframes fadeInOpacity{0%{opacity:0}100%{opacity:1}}",f=class{constructor(i){t(this,i),this.alignPopover=t=>{setTimeout((()=>{var i;if("test"!==c&&this.triggerElement&&this.popoverElement){const s=this.triggerElement,r=this.popoverElement,l=this.arrowElement,p=[e(null!==(i=null==l?void 0:l.offsetHeight)&&void 0!==i?i:10),a(),n()];l&&p.push(h({element:l})),o(s,r,{placement:this.state._align,middleware:p}).then((({x:e,y:o,middlewareData:i,placement:s})=>{this.setPosition(e,o,i,s,t)}))}}))},this.showPopover=()=>{this.addListenersToBody(),this.alignPopover((()=>{this.state=Object.assign(Object.assign({},this.state),{_visible:!0})}))},this.hidePopoverByEscape=t=>{"Escape"===t.key&&this.hidePopover()},this.hidePopoverByClickOutside=t=>{this.host&&!this.host.contains(t.target)&&this.hidePopover()},this.catchHostAndTriggerElement=t=>{t&&(this.host=t,this.triggerElement=t.previousElementSibling)},this.catchPopoverElement=t=>{this.popoverElement=t},this.catchArrowElement=t=>{this.arrowElement=t},this._align="top",this._show=!1,this.state={_align:"top",_show:!1,_visible:!1}}setPosition(t,e,o,i,s){if(this.popoverElement){const a={left:this.popoverElement.style.left,top:this.popoverElement.style.top};if(Object.assign(this.popoverElement.style,{left:`${t}px`,top:`${e}px`}),this.arrowElement&&o.arrow)switch(i){case"top":this.arrowElement.style.inset=`100% auto auto ${o.arrow.x||0}px`,this.arrowElement.style.translate="0 -50%";break;case"right":this.arrowElement.style.inset=`${o.arrow.y||0}px 100% auto auto`,this.arrowElement.style.translate="50% 0";break;case"bottom":this.arrowElement.style.inset=`auto auto 100% ${o.arrow.x||0}px`,this.arrowElement.style.translate="0 50%";break;case"left":this.arrowElement.style.inset=`${o.arrow.y||0}px auto auto 100%`,this.arrowElement.style.translate="-50% 0"}a.left!==this.popoverElement.style.left||a.top!==this.popoverElement.style.top?this.alignPopover(s):"function"==typeof s&&s()}}hidePopover(){var t;this.state=Object.assign(Object.assign({},this.state),{_visible:!1}),this._show=!1,null===(t=this.triggerElement)||void 0===t||t.focus(),this.removeListenersToBody()}addListenersToBody(){var t;const e=l().body;e.addEventListener("keyup",this.hidePopoverByEscape),e.addEventListener("click",this.hidePopoverByClickOutside),null===(t=document.scrollingElement)||void 0===t||t.addEventListener("scroll",this.showPopover,{passive:!0})}removeListenersToBody(){var t;const e=l().body;e.removeEventListener("keyup",this.hidePopoverByEscape),e.removeEventListener("click",this.hidePopoverByClickOutside),null===(t=document.scrollingElement)||void 0===t||t.removeEventListener("scroll",this.showPopover)}render(){return i(s,{ref:this.catchHostAndTriggerElement},i("div",{class:{popover:!0,hidden:!this.state._show,show:this.state._visible},ref:this.catchPopoverElement},i("div",{class:`arrow ${this.state._align}`,ref:this.catchArrowElement}),i("slot",null)))}validateAlign(t){r(this,t)}validateShow(t){p(this,t),t&&this.showPopover()}componentWillLoad(){this.validateAlign(this._align),this.validateShow(this._show)}static get watchers(){return{_align:["validateAlign"],_show:["validateShow"]}}};f.style=d;export{f as kol_popover};
|
|
@@ -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 r}from"./index-d0c806ea.js";import{v as i}from"./label-
|
|
4
|
+
import{r as t,h as e,H as r}from"./index-d0c806ea.js";import{v as i}from"./label-c130b72e.js";import{e as a,d as s,w as l}from"./prop.validators-e40c3380.js";import"./a11y.tipps-348ca42a.js";import"./dev.utils-9b878520.js";import"./reuse-b3566e4c.js";var o;!function(e){e.bar="bar",e.cycle="cycle",e["cycle-value-label"]="cycle-value-label",e["cycle-label-value"]="cycle-label-value"}(o||(o={}));const n=":host{--a11y-min-size:44px;font-size:inherit}*{font-family:Verdana;hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}progress{display:block;height:0;overflow:hidden;width:0}.bar .border{fill:transparent;stroke:black}.bar .background{fill:lightgray;stroke:white}.bar .progress{fill:#0075ff;stroke:transparent;transition:250ms ease-in-out 50ms}.cycle .background{fill:transparent;stroke:lightgray}.cycle .border{fill:transparent;stroke:black}.cycle .whitespace{fill:transparent;stroke:white}.cycle .progress{fill:transparent;stroke:#0075ff;transform-origin:50% 50%;transform:rotate(-90deg);transition:250ms ease-in-out 50ms}@media (prefers-reduced-motion){.progress{transition-duration:0s;transition-delay:0s}}",c=Object.keys(o),h=t=>{let r="43%",a=t._label?"57%":"50%";switch(t._variant){case"cycle-value-label":t._label&&(r="57%",a="43%");case"cycle":case"cycle-label-value":return e("svg",{class:"cycle",width:"100",viewBox:"0 0 120 120",xmlns:"http://www.w3.org/2000/svg"},e("circle",{class:"background",cx:"60",cy:"60",r:"54.5",fill:"currentColor",stroke:"currentColor","stroke-width":"8"}),e("circle",{class:"whitespace",cx:"60",cy:"60",r:"59",fill:"currentColor",stroke:"currentColor","stroke-width":"3"}),e("circle",{class:"border",cx:"60",cy:"60",r:"59",fill:"currentColor",stroke:"currentColor","stroke-width":"1"}),e("circle",{class:"whitespace",cx:"60",cy:"60",r:"51",fill:"currentColor",stroke:"currentColor","stroke-width":"1"}),e("circle",{class:"border",cx:"60",cy:"60",r:"50",fill:"currentColor",stroke:"currentColor","stroke-width":"1"}),e("circle",{class:"progress",fill:"currentColor",stroke:"currentColor","stroke-linecap":"round","stroke-dasharray":`${Math.round(t._value/t._max*342)}px 342px`,"stroke-width":"6",cx:"60",cy:"60",r:"54.5"}),t._label&&e("text",{"aria-hidden":"true",x:"50%",y:r,"text-anchor":"middle",fill:"currentColor"},t._label),e("text",{"aria-hidden":"true",x:"50%",y:a,"text-anchor":"middle",fill:"currentColor"},t._value,t._unit));default:return e("div",{class:"bar"},t._label&&e("div",null,t._label),e("div",{style:{display:"flex",gap:"0.3em"}},e("svg",{width:"100",viewBox:"0 0 102 8",xmlns:"http://www.w3.org/2000/svg"},e("rect",{class:"background",x:"1",y:"1",height:"10",rx:"5",fill:"currentColor",stroke:"currentColor","stroke-width":"3",width:"100"}),e("rect",{class:"progress",x:"2.5",y:"2.5",height:"7",rx:"3.5",fill:"currentColor",stroke:"currentColor","stroke-width":"3",width:t._value/t._max*95}),e("rect",{class:"border",x:"1",y:"1",height:"10",rx:"5",fill:"currentColor",stroke:"currentColor","stroke-width":"1",width:"100"})),e("text",{"aria-hidden":"true","text-anchor":"middle","dominant-baseline":"central",fill:"currentColor"},t._value,t._unit)))}},d=class{constructor(e){t(this,e),this._label=void 0,this._max=void 0,this._unit="%",this._value=void 0,this._variant=void 0,this.state={_max:100,_unit:"%",_value:0,_variant:"bar",_liveValue:0}}render(){return e(r,null,h(this.state),e("progress",{"aria-busy":this.state._value<this.state._max?"true":"false",max:this.state._max,value:this.state._value}),e("span",{"aria-live":"polite","aria-relevant":"removals text",hidden:!0},this.state._liveValue," von ",this.state._max," ",this.state._unit))}validateLabel(e){i(this,e)}validateMax(e){"number"!=typeof e&&(e=100),a(this,"_max",e,{required:!0})}validateUnit(e){s(this,"_unit",e)}validateValue(e){"number"!=typeof e&&(e=0),a(this,"_value",e,{required:!0})}validateVariant(e){l(this,"_variant",(e=>"string"==typeof e&&c.includes(e)),new Set(c),e)}componentWillLoad(){this.validateLabel(this._label),this.validateMax(this._max),this.validateUnit(this._unit),this.validateValue(this._value),this.validateVariant(this._variant),this.interval=setInterval((()=>{this.state._liveValue!==this.state._value&&(this.state=Object.assign(Object.assign({},this.state),{_liveValue:this.state._value}))}),5e3)}disconnectedCallback(){clearInterval(this.interval)}static get watchers(){return{_label:["validateLabel"],_max:["validateMax"],_unit:["validateUnit"],_value:["validateValue"],_variant:["validateVariant"]}}};d.style={default:n};export{d as kol_progress};
|
|
@@ -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-d0c806ea.js";import{v as n}from"./label-
|
|
4
|
+
import{r as t,h as e,H as i}from"./index-d0c806ea.js";import{v as n}from"./label-c130b72e.js";import{d as a,w as o}from"./prop.validators-e40c3380.js";import{s as r}from"./reuse-b3566e4c.js";import"./a11y.tipps-348ca42a.js";import"./dev.utils-9b878520.js";const s=":host{--a11y-min-size:44px;font-size:inherit}*{font-family:Verdana;hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}cite,figure,q+figcaption{display:inline;margin:0;padding:0}blockquote:before{content:open-quote}blockquote::after{content:close-quote}cite:before{content:'—'}.block cite:before{padding-right:0.5em}.inline cite:before{padding:0.5em}",l=class{constructor(e){t(this,e),this._label=void 0,this._href=void 0,this._quote=void 0,this._variant="inline",this.state={_href:"…",_quote:"…",_variant:"inline"}}validateLabel(t){n(this,t)}validateHref(t){a(this,"_href",t,{required:!0})}validateQuote(t){a(this,"_quote",t,{required:!0})}validateVariant(t){o(this,"_variant",(t=>"block"===t||"inline"===t),new Set(["block","inline"]),t)}componentWillLoad(){this.validateHref(this._href),this.validateLabel(this._label),this.validateQuote(this._quote),this.validateVariant(this._variant)}render(){const t=r(this.state._quote);return e(i,null,e("figure",{class:{[this.state._variant]:!0}},"block"===this.state._variant?e("blockquote",{cite:this.state._href},this.state._quote,e("span",{"aria-hidden":t?void 0:"true",hidden:!t},e("slot",{name:"expert"}))):e("q",{cite:this.state._href},this.state._quote,e("span",{"aria-hidden":t?void 0:"true",hidden:!t},e("slot",{name:"expert"}))),"string"==typeof this.state._label&&this.state._label.length>0&&e("figcaption",null,e("cite",null,e("kol-link",{_href:this.state._href,_label:this.state._label,_target:"_blank"})))))}static get watchers(){return{_label:["validateLabel"],_href:["validateHref"],_quote:["validateQuote"],_variant:["validateVariant"]}}};l.style={default:s};export{l as kol_quote};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* KoliBri - The accessible HTML-Standard
|
|
3
3
|
*/
|
|
4
|
-
import{h as t,H as i,r as e,g as s}from"./index-d0c806ea.js";import{n as a}from"./dev.utils-
|
|
4
|
+
import{h as t,H as i,r as e,g as s}from"./index-d0c806ea.js";import{n as a}from"./dev.utils-9b878520.js";import{s as l,t as o}from"./events-2bb1065b.js";import{S as n,a as r,s as h}from"./reuse-b3566e4c.js";import{v as d,g as p}from"./controller-2743a0d8.js";import{f as u,v as c}from"./controller-64f30149.js";import{v as f}from"./rows-f8671a72.js";import{a as v}from"./a11y.tipps-348ca42a.js";import{a as m,c as y}from"./prop.validators-e40c3380.js";import{I as b}from"./controller-icon-c621ff81.js";import"./hide-label-ff12ad0b.js";import"./label-c130b72e.js";import"./tab-index-9c6b6a46.js";import"./associated.controller-a395cef5.js";import"./icons-da3b61ae.js";class _ extends b{constructor(t,e,i){super(t,e,i),this.keyOptionMap=new Map,this.getOptionByKey=t=>this.keyOptionMap.get(t),this.isValueInOptions=(t,e)=>void 0!==e.find((e=>"string"==typeof e.value?e.value===t:!!Array.isArray(e.options)&&this.isValueInOptions(t,e.options))),this.filterValuesInOptions=(t,e)=>t.filter((t=>void 0!==this.isValueInOptions(t,e))),this.beforePatchOptions=(t,e)=>{const i=e.has("_options")?e.get("_options"):this.component.state._options;if(Array.isArray(i)&&i.length>0){this.keyOptionMap.clear(),u(this.keyOptionMap,i);const t=e.has("_value")?e.get("_value"):this.component.state._value,a=this.filterValuesInOptions(Array.isArray(t)&&t.length>0?t:[],i);!1===this.component._multiple&&0===a.length?(e.set("_value",[i[0].value]),this.onStateChange()):Array.isArray(t)&&a.length<t.length&&(e.set("_value",a),this.onStateChange())}},this.component=t}validateHideError(t){d(this.component,t,{hooks:{afterPatch:()=>{this.component.state._hideError&&v("Property hide-error for inputs: Only use when the error message is shown outside of the input component.")}}})}validateOptions(t){c(this.component,t,{hooks:{beforePatch:this.beforePatchOptions}})}validateMultiple(t){m(this.component,"_multiple",t,{hooks:{beforePatch:this.beforePatchOptions}})}validateRequired(t){m(this.component,"_required",t)}validateRows(t){f(this.component,t)}validateValue(t){y(this.component,"_value",(()=>!0),t,void 0,{hooks:{beforePatch:this.beforePatchOptions}}),this.setFormAssociatedValue(this.component._value)}componentWillLoad(t){super.componentWillLoad(),this.onStateChange=()=>{if("function"==typeof t){const e=setTimeout((()=>{clearTimeout(e),t(n)}))}},this.validateHideError(this.component._hideError),this.validateOptions(this.component._options),this.validateMultiple(this.component._multiple),this.validateRequired(this.component._required),this.validateRows(this.component._rows),this.validateValue(this.component._value)}}const g=":host{--a11y-min-size:44px;font-size:inherit}*{font-family:Verdana;hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.required label>span::after,.required legend>span::after{content:'*'}:host{display:block}input,textarea{cursor:text}input[type='checkbox'],input[type='color'],input[type='file'],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,select[multiple] option,textarea{font-size:1rem;width:100%}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}kol-input{display:grid}kol-input .input-slot{flex-grow:1}input:not([type='checkbox'],[type='radio']),select:not([multiple],[size]){height:2.75em}input:focus,option:focus,select:focus,textarea:focus{outline:0}.input{display:flex;align-items:center}.input>kol-icon{display:grid;height:var(--a11y-min-size);place-items:center}kol-input.required .input-tooltip .span-label::after{content:'*'}.error.hidden{display:none}",k=(t,e)=>Array.isArray(t)&&t.includes(e),x=class{renderOptgroup(e,i){var a;return t("optgroup",{disabled:e.disabled,label:e.label},null===(a=e.options)||void 0===a?void 0:a.map(((e,a)=>{const o=`${i}-${a}`;return Array.isArray(e.options)?this.renderOptgroup(e,o):t("option",{disabled:e.disabled,key:o,selected:k(this.state._value,e.value),value:o},e.label)})))}render(){const{ariaDescribedBy:e}=p(this.state),a=h(this.state._label);return t(i,{class:{"has-value":this.state._hasValue}},t("kol-input",{class:{"hide-label":!!this.state._hideLabel,select:!0},_disabled:this.state._disabled,_error:this.state._error,_hideError:this.state._hideError,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icons:this.state._icons,_id:this.state._id,_label:this.state._label,_required:this.state._required,_tooltipAlign:this._tooltipAlign,_touched:this.state._touched,onClick:()=>{var t;return null===(t=this.ref)||void 0===t?void 0:t.focus()}},t("span",{slot:"label"},a?t("slot",{name:"expert"}):this.state._label),t("div",{slot:"input"},t("select",{ref:this.catchRef,title:"",accessKey:this.state._accessKey,"aria-describedby":e.length>0?e.join(" "):void 0,"aria-label":this.state._hideLabel&&"string"==typeof this.state._label?this.state._label:void 0,autoCapitalize:"off",autoCorrect:"off",disabled:this.state._disabled,id:this.state._id,multiple:this.state._multiple,name:this.state._name,required:this.state._required,size:this.state._rows,spellcheck:"false",onClick:this.controller.onFacade.onClick,onBlur:this.controller.onFacade.onBlur,onFocus:this.controller.onFacade.onFocus,onChange:this.onChange},this.state._options.map(((e,i)=>{const a=`-${i}`;return Array.isArray(e.options)?this.renderOptgroup(e,a):t("option",{disabled:e.disabled,key:a,selected:k(this.state._value,e.value),value:a},e.label)}))))))}constructor(t){e(this,t),this.catchRef=t=>{this.ref=t,r(this.host,this.ref)},this.onChange=t=>{var e,i;this._value=Array.from((null===(e=this.ref)||void 0===e?void 0:e.options)||[]).filter((t=>!0===t.selected)).map((t=>{var e;return null===(e=this.controller.getOptionByKey(t.value))||void 0===e?void 0:e.value})),l(t),o("change",this.host,this._value),this.controller.setFormAssociatedValue(this._value),"function"==typeof(null===(i=this.state._on)||void 0===i?void 0:i.onChange)&&this.state._on.onChange(t,this._value)},this._accessKey=void 0,this._alert=!0,this._disabled=!1,this._error=void 0,this._hideError=!1,this._hideLabel=!1,this._hint="",this._icons=void 0,this._id=void 0,this._label=void 0,this._multiple=!1,this._name=void 0,this._on=void 0,this._options=void 0,this._required=!1,this._rows=void 0,this._syncValueBySelector=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._touched=!1,this._value=void 0,this.state={_hasValue:!1,_hideError:!1,_id:`id-${a()}`,_label:"",_multiple:!1,_options:[],_value:[]},this.controller=new _(this,"select",this.host)}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAlert(t){this.controller.validateAlert(t)}validateDisabled(t){this.controller.validateDisabled(t)}validateError(t){this.controller.validateError(t)}validateHideError(t){this.controller.validateHideError(t)}validateHideLabel(t){this.controller.validateHideLabel(t)}validateHint(t){this.controller.validateHint(t)}validateIcons(t){this.controller.validateIcons(t)}validateId(t){this.controller.validateId(t)}validateLabel(t){this.controller.validateLabel(t)}validateMultiple(t){this.controller.validateMultiple(t)}validateName(t){this.controller.validateName(t)}validateOn(t){this.controller.validateOn(t)}validateOptions(t){this.controller.validateOptions(t)}validateRequired(t){this.controller.validateRequired(t)}validateRows(t){this.controller.validateRows(t)}validateSyncValueBySelector(t){this.controller.validateSyncValueBySelector(t)}validateTabIndex(t){this.controller.validateTabIndex(t)}validateTouched(t){this.controller.validateTouched(t)}validateValue(t){this.controller.validateValue(t)}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.controller.componentWillLoad(this.onChange),this.state._hasValue=!!this.state._value,this.controller.addValueChangeListener((t=>this.state._hasValue=!!t))}get host(){return s(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_disabled:["validateDisabled"],_error:["validateError"],_hideError:["validateHideError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icons:["validateIcons"],_id:["validateId"],_label:["validateLabel"],_multiple:["validateMultiple"],_name:["validateName"],_on:["validateOn"],_options:["validateOptions"],_required:["validateRequired"],_rows:["validateRows"],_syncValueBySelector:["validateSyncValueBySelector"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};x.style={default:g};export{x as kol_select};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["SelectController","InputIconController","constructor","component","name","host","super","this","keyOptionMap","Map","getOptionByKey","key","get","isValueInOptions","value","options","find","option","Array","isArray","undefined","filterValuesInOptions","values","filter","beforePatchOptions","_value","nextState","has","state","_options","length","clear","fillKeyOptionMap","selected","_multiple","set","onStateChange","validateHideError","hooks","afterPatch","_hideError","a11yHint","validateOptions","validateOptionsWithOptgroup","beforePatch","validateMultiple","watchBoolean","validateRequired","validateRows","validateValue","watchJsonArrayString","setFormAssociatedValue","componentWillLoad","onChange","timeout","setTimeout","clearTimeout","STATE_CHANGE_EVENT","_required","_rows","defaultStyleCss","isSelected","valueList","optionValue","includes","KolSelect","renderOptgroup","optgroup","preKey","h","disabled","label","_a","map","index","render","ariaDescribedBy","getRenderStates","hasExpertSlot","showExpertSlot","_label","Host","class","_hasValue","_hideLabel","select","_disabled","_error","_hint","_icons","_id","_tooltipAlign","_touched","onClick","ref","focus","slot","catchRef","title","accessKey","_accessKey","join","autoCapitalize","autoCorrect","id","multiple","_name","required","size","spellcheck","controller","onFacade","onBlur","onFocus","hostRef","propagateFocus","event","from","stopPropagation","tryToDispatchKoliBriEvent","_b","_on","nonce","validateAccessKey","validateAlert","validateDisabled","validateError","validateHideLabel","validateHint","validateIcons","validateId","validateLabel","validateName","validateOn","validateSyncValueBySelector","validateTabIndex","validateTouched","_alert","addValueChangeListener","v"],"sources":["src/components/select/controller.ts","src/components/select/style.css?tag=kol-select&mode=default&encapsulation=shadow","src/components/select/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\n\nimport { Stringified } from '../../types/common';\nimport { Optgroup, Option, SelectOption } from '../../types/input/types';\nimport { HideErrorPropType, validateHideError } from '../../types/props/hide-error';\nimport { OptionsWithOptgroupPropType, validateOptionsWithOptgroup } from '../../types/props/options';\nimport { RowsPropType, validateRows } from '../../types/props/rows';\nimport { W3CInputValue } from '../../types/w3c';\nimport { a11yHint } from '../../utils/a11y.tipps';\nimport { watchBoolean, watchJsonArrayString } from '../../utils/prop.validators';\nimport { STATE_CHANGE_EVENT } from '../../utils/validator';\nimport { InputIconController } from '../@deprecated/input/controller-icon';\nimport { fillKeyOptionMap } from '../input-radio/controller';\nimport { Props, Watches } from './types';\n\nexport class SelectController extends InputIconController implements Watches {\n\tprotected readonly component: Generic.Element.Component & Props;\n\tprivate onStateChange!: () => void;\n\tprivate readonly keyOptionMap = new Map<string, Option<W3CInputValue>>();\n\n\tpublic constructor(component: Generic.Element.Component & Props, name: string, host?: HTMLElement) {\n\t\tsuper(component, name, host);\n\t\tthis.component = component;\n\t}\n\n\tpublic readonly getOptionByKey = (key: string): Option<W3CInputValue> | undefined => this.keyOptionMap.get(key);\n\n\tprivate readonly isValueInOptions = (value: string, options: SelectOption<W3CInputValue>[]): boolean => {\n\t\treturn (\n\t\t\toptions.find((option) =>\n\t\t\t\ttypeof (option as Option<W3CInputValue>).value === 'string'\n\t\t\t\t\t? (option as Option<W3CInputValue>).value === value\n\t\t\t\t\t: Array.isArray((option as Optgroup<string>).options)\n\t\t\t\t\t? this.isValueInOptions(value, (option as Optgroup<string>).options)\n\t\t\t\t\t: false\n\t\t\t) !== undefined\n\t\t);\n\t};\n\n\tprivate readonly filterValuesInOptions = (values: string[], options: SelectOption<W3CInputValue>[]): string[] => {\n\t\treturn values.filter((value) => this.isValueInOptions(value, options) !== undefined);\n\t};\n\n\tprivate readonly beforePatchOptions = (_value: unknown, nextState: Map<string, unknown>): void => {\n\t\tconst options = nextState.has('_options') ? nextState.get('_options') : this.component.state._options;\n\t\tif (Array.isArray(options) && options.length > 0) {\n\t\t\tthis.keyOptionMap.clear();\n\t\t\tfillKeyOptionMap(this.keyOptionMap, options as SelectOption<W3CInputValue>[]);\n\t\t\tconst value = nextState.has('_value') ? nextState.get('_value') : this.component.state._value;\n\t\t\tconst selected = this.filterValuesInOptions(\n\t\t\t\tArray.isArray(value) && value.length > 0 ? (value as string[]) : [],\n\t\t\t\toptions as SelectOption<W3CInputValue>[]\n\t\t\t);\n\t\t\tif (this.component._multiple === false && selected.length === 0) {\n\t\t\t\tnextState.set('_value', [\n\t\t\t\t\t(\n\t\t\t\t\t\toptions[0] as {\n\t\t\t\t\t\t\tvalue: string;\n\t\t\t\t\t\t}\n\t\t\t\t\t).value,\n\t\t\t\t]);\n\t\t\t\tthis.onStateChange();\n\t\t\t} else if (Array.isArray(value) && selected.length < value.length) {\n\t\t\t\tnextState.set('_value', selected);\n\t\t\t\tthis.onStateChange();\n\t\t\t}\n\t\t}\n\t};\n\n\tpublic validateHideError(value?: HideErrorPropType): void {\n\t\tvalidateHideError(this.component, value, {\n\t\t\thooks: {\n\t\t\t\tafterPatch: () => {\n\t\t\t\t\tif (this.component.state._hideError) {\n\t\t\t\t\t\ta11yHint('Property hide-error for inputs: Only use when the error message is shown outside of the input component.');\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t},\n\t\t});\n\t}\n\n\tpublic validateOptions(value?: OptionsWithOptgroupPropType): void {\n\t\tvalidateOptionsWithOptgroup(this.component, value, {\n\t\t\thooks: {\n\t\t\t\tbeforePatch: this.beforePatchOptions,\n\t\t\t},\n\t\t});\n\t}\n\n\tpublic validateMultiple(value?: boolean): void {\n\t\twatchBoolean(this.component, '_multiple', value, {\n\t\t\thooks: {\n\t\t\t\tbeforePatch: this.beforePatchOptions,\n\t\t\t},\n\t\t});\n\t\t// if (value === true) {\n\t\t// \tdevHint(\n\t\t// \t\t'[KolSelect] Aktuell wird die Mehrfachauswahl noch nicht unterstützt. Wir sind dran die Mehrfachauswahl funktionsfähig zu implementieren, da der Browser-Standard hier ein paar Lücken hat.'\n\t\t// \t);\n\t\t// \tdevHint('[KolSelect] Bei der Mehrfachauswahl sollte zusätzlich auch die Listenlänge (size) gesetzt werden.');\n\t\t// }\n\t}\n\n\tpublic validateRequired(value?: boolean): void {\n\t\twatchBoolean(this.component, '_required', value);\n\t}\n\n\tpublic validateRows(value?: RowsPropType) {\n\t\tvalidateRows(this.component, value);\n\t}\n\n\tpublic validateValue(value?: Stringified<W3CInputValue[]>): void {\n\t\twatchJsonArrayString(this.component, '_value', () => true, value, undefined, {\n\t\t\thooks: {\n\t\t\t\tbeforePatch: this.beforePatchOptions,\n\t\t\t},\n\t\t});\n\t\tthis.setFormAssociatedValue(this.component._value as string);\n\t}\n\n\tpublic componentWillLoad(onChange?: (event: Event) => void): void {\n\t\tsuper.componentWillLoad();\n\n\t\tthis.onStateChange = () => {\n\t\t\tif (typeof onChange === 'function') {\n\t\t\t\tconst timeout = setTimeout(() => {\n\t\t\t\t\tclearTimeout(timeout);\n\t\t\t\t\tonChange(STATE_CHANGE_EVENT);\n\t\t\t\t});\n\t\t\t}\n\t\t};\n\n\t\tthis.validateHideError(this.component._hideError);\n\t\tthis.validateOptions(this.component._options);\n\t\tthis.validateMultiple(this.component._multiple);\n\t\tthis.validateRequired(this.component._required);\n\t\tthis.validateRows(this.component._rows);\n\t\tthis.validateValue(this.component._value);\n\t}\n}\n","@import url(../input-line.css);\n.error.hidden {\n\tdisplay: none;\n}\n","import { Component, Element, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Stringified } from '../../types/common';\nimport { KoliBriHorizontalIcons } from '../../types/icons';\nimport { InputTypeOnDefault, Optgroup, Option, SelectOption } from '../../types/input/types';\nimport { HideErrorPropType } from '../../types/props/hide-error';\nimport { IdPropType } from '../../types/props/id';\nimport { LabelWithExpertSlotPropType } from '../../types/props/label';\nimport { NamePropType } from '../../types/props/name';\nimport { OptionsWithOptgroupPropType } from '../../types/props/options';\nimport { RowsPropType } from '../../types/props/rows';\nimport { SyncValueBySelectorPropType } from '../../types/props/sync-value-by-selector';\nimport { TooltipAlignPropType } from '../../types/props/tooltip-align';\nimport { W3CInputValue } from '../../types/w3c';\nimport { nonce } from '../../utils/dev.utils';\nimport { stopPropagation, tryToDispatchKoliBriEvent } from '../../utils/events';\nimport { propagateFocus, showExpertSlot } from '../../utils/reuse';\nimport { getRenderStates } from '../input/controller';\nimport { SelectController } from './controller';\nimport { API, States } from './types';\n\nconst isSelected = (valueList: unknown[] | null, optionValue: unknown): boolean => {\n\treturn Array.isArray(valueList) && valueList.includes(optionValue);\n};\n\n/**\n * @slot - Die Beschriftung des Eingabefeldes.\n */\n@Component({\n\ttag: 'kol-select',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolSelect implements API {\n\t@Element() private readonly host?: HTMLKolSelectElement;\n\tprivate ref?: HTMLSelectElement;\n\n\tprivate readonly catchRef = (ref?: HTMLSelectElement) => {\n\t\tthis.ref = ref;\n\t\tpropagateFocus(this.host, this.ref);\n\t};\n\n\tprivate renderOptgroup(optgroup: Optgroup<string>, preKey: string): JSX.Element {\n\t\treturn (\n\t\t\t<optgroup disabled={optgroup.disabled} label={optgroup.label}>\n\t\t\t\t{optgroup.options?.map((option: SelectOption<W3CInputValue>, index: number) => {\n\t\t\t\t\tconst key = `${preKey}-${index}`;\n\t\t\t\t\tif (Array.isArray((option as Optgroup<string>).options)) {\n\t\t\t\t\t\treturn this.renderOptgroup(option as Optgroup<string>, key);\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<option\n\t\t\t\t\t\t\t\tdisabled={option.disabled}\n\t\t\t\t\t\t\t\tkey={key}\n\t\t\t\t\t\t\t\t// label={option.label}\n\t\t\t\t\t\t\t\tselected={isSelected(this.state._value, (option as Option<W3CInputValue>).value)}\n\t\t\t\t\t\t\t\tvalue={key}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{option.label}\n\t\t\t\t\t\t\t</option>\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t})}\n\t\t\t</optgroup>\n\t\t);\n\t}\n\n\tpublic render(): JSX.Element {\n\t\tconst { ariaDescribedBy } = getRenderStates(this.state);\n\t\tconst hasExpertSlot = showExpertSlot(this.state._label);\n\n\t\treturn (\n\t\t\t<Host class={{ 'has-value': this.state._hasValue }}>\n\t\t\t\t<kol-input\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t'hide-label': !!this.state._hideLabel,\n\t\t\t\t\t\tselect: true,\n\t\t\t\t\t}}\n\t\t\t\t\t_disabled={this.state._disabled}\n\t\t\t\t\t_error={this.state._error}\n\t\t\t\t\t_hideError={this.state._hideError}\n\t\t\t\t\t_hideLabel={this.state._hideLabel}\n\t\t\t\t\t_hint={this.state._hint}\n\t\t\t\t\t_icons={this.state._icons}\n\t\t\t\t\t_id={this.state._id}\n\t\t\t\t\t_label={this.state._label}\n\t\t\t\t\t_required={this.state._required}\n\t\t\t\t\t_tooltipAlign={this._tooltipAlign}\n\t\t\t\t\t_touched={this.state._touched}\n\t\t\t\t\tonClick={() => this.ref?.focus()}\n\t\t\t\t>\n\t\t\t\t\t<span slot=\"label\">{hasExpertSlot ? <slot name=\"expert\"></slot> : this.state._label}</span>\n\t\t\t\t\t<div slot=\"input\">\n\t\t\t\t\t\t<select\n\t\t\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t\t\ttitle=\"\"\n\t\t\t\t\t\t\taccessKey={this.state._accessKey}\n\t\t\t\t\t\t\taria-describedby={ariaDescribedBy.length > 0 ? ariaDescribedBy.join(' ') : undefined}\n\t\t\t\t\t\t\taria-label={this.state._hideLabel && typeof this.state._label === 'string' ? this.state._label : undefined}\n\t\t\t\t\t\t\tautoCapitalize=\"off\"\n\t\t\t\t\t\t\tautoCorrect=\"off\"\n\t\t\t\t\t\t\tdisabled={this.state._disabled}\n\t\t\t\t\t\t\tid={this.state._id}\n\t\t\t\t\t\t\tmultiple={this.state._multiple}\n\t\t\t\t\t\t\tname={this.state._name}\n\t\t\t\t\t\t\trequired={this.state._required}\n\t\t\t\t\t\t\tsize={this.state._rows}\n\t\t\t\t\t\t\tspellcheck=\"false\"\n\t\t\t\t\t\t\t{...{\n\t\t\t\t\t\t\t\tonClick: this.controller.onFacade.onClick,\n\t\t\t\t\t\t\t\tonBlur: this.controller.onFacade.onBlur,\n\t\t\t\t\t\t\t\tonFocus: this.controller.onFacade.onFocus,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tonChange={this.onChange}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{this.state._options.map((option, index) => {\n\t\t\t\t\t\t\t\t/**\n\t\t\t\t\t\t\t\t * Damit der Value einer Option ein beliebigen Typ haben kann\n\t\t\t\t\t\t\t\t * muss man auf HTML-Ebene den Value auf einen String-Wert\n\t\t\t\t\t\t\t\t * mappen. Das tun wir mittels der Map.\n\t\t\t\t\t\t\t\t */\n\t\t\t\t\t\t\t\tconst key = `-${index}`;\n\t\t\t\t\t\t\t\tif (Array.isArray((option as unknown as Optgroup<string>).options)) {\n\t\t\t\t\t\t\t\t\treturn this.renderOptgroup(option as unknown as Optgroup<string>, key);\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t<option\n\t\t\t\t\t\t\t\t\t\t\tdisabled={option.disabled}\n\t\t\t\t\t\t\t\t\t\t\tkey={key}\n\t\t\t\t\t\t\t\t\t\t\t// label={option.label}\n\t\t\t\t\t\t\t\t\t\t\tselected={isSelected(this.state._value, (option as unknown as Option<W3CInputValue>).value)}\n\t\t\t\t\t\t\t\t\t\t\tvalue={key}\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{option.label}\n\t\t\t\t\t\t\t\t\t\t</option>\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t</select>\n\t\t\t\t\t</div>\n\t\t\t\t</kol-input>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate readonly controller: SelectController;\n\n\t/**\n\t * Defines which key combination can be used to trigger or focus the interactive element of the component.\n\t */\n\t@Prop() public _accessKey?: string;\n\n\t/**\n\t * Defines whether the screen-readers should read out the notification.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _alert?: boolean = true;\n\n\t/**\n\t * Makes the element not focusable and ignore all events.\n\t * @TODO: Change type back to `DisabledPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _disabled?: boolean = false;\n\n\t/**\n\t * Defines the error message text.\n\t */\n\t@Prop() public _error?: string;\n\n\t/**\n\t * Hides the error message but leaves it in the DOM for the input's aria-describedby.\n\t * @TODO: Change type back to `HideErrorPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _hideError?: boolean = false;\n\n\t/**\n\t * Hides the caption by default and displays the caption text with a tooltip when the\n\t * interactive element is focused or the mouse is over it.\n\t * @TODO: Change type back to `HideLabelPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _hideLabel?: boolean = false;\n\n\t/**\n\t * Defines the hint text.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * Defines the icon classnames (e.g. `_icons=\"fa-solid fa-user\"`).\n\t */\n\t@Prop() public _icons?: Stringified<KoliBriHorizontalIcons>;\n\n\t/**\n\t * Defines the internal ID of the primary component element.\n\t */\n\t@Prop() public _id?: IdPropType;\n\n\t/**\n\t * Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot.\n\t */\n\t@Prop() public _label?: LabelWithExpertSlotPropType;\n\n\t/**\n\t * Makes the input accept multiple inputs.\n\t * @TODO: Change type back to `MultiplePropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _multiple?: boolean = false;\n\n\t/**\n\t * Defines the technical name of an input field.\n\t */\n\t@Prop() public _name?: NamePropType;\n\n\t/**\n\t * Gibt die EventCallback-Funktionen für das Input-Event an.\n\t */\n\t@Prop() public _on?: InputTypeOnDefault;\n\n\t/**\n\t * Options the user can choose from, also supporting Optgroup.\n\t */\n\t@Prop() public _options?: OptionsWithOptgroupPropType;\n\n\t/**\n\t * Makes the input element required.\n\t * @TODO: Change type back to `RequiredPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _required?: boolean = false;\n\n\t/**\n\t * Defines how many rows of options should be visible at the same time.\n\t */\n\t@Prop() public _rows?: RowsPropType;\n\n\t/**\n\t * Selector for synchronizing the value with another input element.\n\t * @internal\n\t */\n\t@Prop() public _syncValueBySelector?: SyncValueBySelectorPropType;\n\n\t/**\n\t * Defines which tab-index the primary element of the component has. (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 * Defines where to show the Tooltip preferably: top, right, bottom or left.\n\t */\n\t@Prop() public _tooltipAlign?: TooltipAlignPropType = 'top';\n\n\t/**\n\t * Shows if the input was touched by a user.\n\t * @TODO: Change type back to `TouchedPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _touched?: boolean = false;\n\n\t/**\n\t * Defines the value of the input.\n\t */\n\t@Prop({ mutable: true }) public _value?: Stringified<W3CInputValue[]>;\n\n\t@State() public state: States = {\n\t\t_hasValue: false,\n\t\t_hideError: false,\n\t\t_id: `id-${nonce()}`, // ⚠ required\n\t\t_label: '', // ⚠ required\n\t\t_multiple: false,\n\t\t_options: [],\n\t\t_value: [],\n\t};\n\n\tpublic constructor() {\n\t\tthis.controller = new SelectController(this, 'select', this.host);\n\t}\n\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\tthis.controller.validateAlert(value);\n\t}\n\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t@Watch('_error')\n\tpublic validateError(value?: string): void {\n\t\tthis.controller.validateError(value);\n\t}\n\n\t@Watch('_hideError')\n\tpublic validateHideError(value?: HideErrorPropType): void {\n\t\tthis.controller.validateHideError(value);\n\t}\n\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t@Watch('_icons')\n\tpublic validateIcons(value?: Stringified<KoliBriHorizontalIcons>): void {\n\t\tthis.controller.validateIcons(value);\n\t}\n\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: LabelWithExpertSlotPropType): void {\n\t\tthis.controller.validateLabel(value);\n\t}\n\n\t@Watch('_multiple')\n\tpublic validateMultiple(value?: boolean): void {\n\t\tthis.controller.validateMultiple(value);\n\t}\n\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t@Watch('_options')\n\tpublic validateOptions(value?: OptionsWithOptgroupPropType): void {\n\t\tthis.controller.validateOptions(value);\n\t}\n\n\t@Watch('_required')\n\tpublic validateRequired(value?: boolean): void {\n\t\tthis.controller.validateRequired(value);\n\t}\n\n\t@Watch('_rows')\n\tpublic validateRows(value?: RowsPropType): void {\n\t\tthis.controller.validateRows(value);\n\t}\n\n\t@Watch('_syncValueBySelector')\n\tpublic validateSyncValueBySelector(value?: SyncValueBySelectorPropType): void {\n\t\tthis.controller.validateSyncValueBySelector(value);\n\t}\n\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tthis.controller.validateTabIndex(value);\n\t}\n\n\t@Watch('_touched')\n\tpublic validateTouched(value?: boolean): void {\n\t\tthis.controller.validateTouched(value);\n\t}\n\n\t@Watch('_value')\n\tpublic validateValue(value?: Stringified<W3CInputValue[]>): void {\n\t\tthis.controller.validateValue(value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis._alert = this._alert === true;\n\t\tthis._touched = this._touched === true;\n\t\tthis.controller.componentWillLoad(this.onChange);\n\n\t\tthis.state._hasValue = !!this.state._value;\n\t\tthis.controller.addValueChangeListener((v) => (this.state._hasValue = !!v));\n\t}\n\n\tprivate onChange = (event: Event): void => {\n\t\tthis._value = Array.from(this.ref?.options || [])\n\t\t\t.filter((option) => option.selected === true)\n\t\t\t.map((option) => this.controller.getOptionByKey(option.value)?.value as string);\n\n\t\t// Event handling\n\t\tstopPropagation(event);\n\t\ttryToDispatchKoliBriEvent('change', this.host, this._value);\n\n\t\t// Static form handling\n\t\tthis.controller.setFormAssociatedValue(this._value as unknown as string);\n\n\t\t// Callback\n\t\tif (typeof this.state._on?.onChange === 'function') {\n\t\t\tthis.state._on.onChange(event, this._value);\n\t\t}\n\t};\n}\n"],"mappings":";;;iqBAeaA,UAAyBC,EAKrC,WAAAC,CAAmBC,EAA8CC,EAAcC,GAC9EC,MAAMH,EAAWC,EAAMC,GAHPE,KAAAC,aAAe,IAAIC,IAOpBF,KAAAG,eAAkBC,GAAmDJ,KAAKC,aAAaI,IAAID,GAE1FJ,KAAAM,iBAAmB,CAACC,EAAeC,IAElDA,EAAQC,MAAMC,UACLA,EAAiCH,QAAU,SAC/CG,EAAiCH,QAAUA,EAC5CI,MAAMC,QAASF,EAA4BF,SAC3CR,KAAKM,iBAAiBC,EAAQG,EAA4BF,SAC1D,UACEK,UAISb,KAAAc,sBAAwB,CAACC,EAAkBP,IACpDO,EAAOC,QAAQT,GAAUP,KAAKM,iBAAiBC,EAAOC,KAAaK,YAG1Db,KAAAiB,mBAAqB,CAACC,EAAiBC,KACvD,MAAMX,EAAUW,EAAUC,IAAI,YAAcD,EAAUd,IAAI,YAAcL,KAAKJ,UAAUyB,MAAMC,SAC7F,GAAIX,MAAMC,QAAQJ,IAAYA,EAAQe,OAAS,EAAG,CACjDvB,KAAKC,aAAauB,QAClBC,EAAiBzB,KAAKC,aAAcO,GACpC,MAAMD,EAAQY,EAAUC,IAAI,UAAYD,EAAUd,IAAI,UAAYL,KAAKJ,UAAUyB,MAAMH,OACvF,MAAMQ,EAAW1B,KAAKc,sBACrBH,MAAMC,QAAQL,IAAUA,EAAMgB,OAAS,EAAKhB,EAAqB,GACjEC,GAED,GAAIR,KAAKJ,UAAU+B,YAAc,OAASD,EAASH,SAAW,EAAG,CAChEJ,EAAUS,IAAI,SAAU,CAEtBpB,EAAQ,GAGPD,QAEHP,KAAK6B,e,MACC,GAAIlB,MAAMC,QAAQL,IAAUmB,EAASH,OAAShB,EAAMgB,OAAQ,CAClEJ,EAAUS,IAAI,SAAUF,GACxB1B,KAAK6B,e,IA1CP7B,KAAKJ,UAAYA,C,CA+CX,iBAAAkC,CAAkBvB,GACxBuB,EAAkB9B,KAAKJ,UAAWW,EAAO,CACxCwB,MAAO,CACNC,WAAY,KACX,GAAIhC,KAAKJ,UAAUyB,MAAMY,WAAY,CACpCC,EAAS,2G,MAOP,eAAAC,CAAgB5B,GACtB6B,EAA4BpC,KAAKJ,UAAWW,EAAO,CAClDwB,MAAO,CACNM,YAAarC,KAAKiB,qB,CAKd,gBAAAqB,CAAiB/B,GACvBgC,EAAavC,KAAKJ,UAAW,YAAaW,EAAO,CAChDwB,MAAO,CACNM,YAAarC,KAAKiB,qB,CAWd,gBAAAuB,CAAiBjC,GACvBgC,EAAavC,KAAKJ,UAAW,YAAaW,E,CAGpC,YAAAkC,CAAalC,GACnBkC,EAAazC,KAAKJ,UAAWW,E,CAGvB,aAAAmC,CAAcnC,GACpBoC,EAAqB3C,KAAKJ,UAAW,UAAU,IAAM,MAAMW,EAAOM,UAAW,CAC5EkB,MAAO,CACNM,YAAarC,KAAKiB,sBAGpBjB,KAAK4C,uBAAuB5C,KAAKJ,UAAUsB,O,CAGrC,iBAAA2B,CAAkBC,GACxB/C,MAAM8C,oBAEN7C,KAAK6B,cAAgB,KACpB,UAAWiB,IAAa,WAAY,CACnC,MAAMC,EAAUC,YAAW,KAC1BC,aAAaF,GACbD,EAASI,EAAmB,G,GAK/BlD,KAAK8B,kBAAkB9B,KAAKJ,UAAUqC,YACtCjC,KAAKmC,gBAAgBnC,KAAKJ,UAAU0B,UACpCtB,KAAKsC,iBAAiBtC,KAAKJ,UAAU+B,WACrC3B,KAAKwC,iBAAiBxC,KAAKJ,UAAUuD,WACrCnD,KAAKyC,aAAazC,KAAKJ,UAAUwD,OACjCpD,KAAK0C,cAAc1C,KAAKJ,UAAUsB,O,ECzIpC,MAAMmC,EAAkB,+7DCqBxB,MAAMC,EAAa,CAACC,EAA6BC,IACzC7C,MAAMC,QAAQ2C,IAAcA,EAAUE,SAASD,G,MAa1CE,EAAS,MASb,cAAAC,CAAeC,EAA4BC,G,MAClD,OACCC,EAAA,YAAUC,SAAUH,EAASG,SAAUC,MAAOJ,EAASI,QACrDC,EAAAL,EAASpD,WAAO,MAAAyD,SAAA,SAAAA,EAAEC,KAAI,CAACxD,EAAqCyD,KAC5D,MAAM/D,EAAM,GAAGyD,KAAUM,IACzB,GAAIxD,MAAMC,QAASF,EAA4BF,SAAU,CACxD,OAAOR,KAAK2D,eAAejD,EAA4BN,E,KACjD,CACN,OACC0D,EAAA,UACCC,SAAUrD,EAAOqD,SACjB3D,IAAKA,EAELsB,SAAU4B,EAAWtD,KAAKqB,MAAMH,OAASR,EAAiCH,OAC1EA,MAAOH,GAENM,EAAOsD,M,MASR,MAAAI,GACN,MAAMC,gBAAEA,GAAoBC,EAAgBtE,KAAKqB,OACjD,MAAMkD,EAAgBC,EAAexE,KAAKqB,MAAMoD,QAEhD,OACCX,EAACY,EAAI,CAACC,MAAO,CAAE,YAAa3E,KAAKqB,MAAMuD,YACtCd,EAAA,aACCa,MAAO,CACN,eAAgB3E,KAAKqB,MAAMwD,WAC3BC,OAAQ,MAETC,UAAW/E,KAAKqB,MAAM0D,UACtBC,OAAQhF,KAAKqB,MAAM2D,OACnB/C,WAAYjC,KAAKqB,MAAMY,WACvB4C,WAAY7E,KAAKqB,MAAMwD,WACvBI,MAAOjF,KAAKqB,MAAM4D,MAClBC,OAAQlF,KAAKqB,MAAM6D,OACnBC,IAAKnF,KAAKqB,MAAM8D,IAChBV,OAAQzE,KAAKqB,MAAMoD,OACnBtB,UAAWnD,KAAKqB,MAAM8B,UACtBiC,cAAepF,KAAKoF,cACpBC,SAAUrF,KAAKqB,MAAMgE,SACrBC,QAAS,SAAArB,EAAM,OAAAA,EAAAjE,KAAKuF,OAAG,MAAAtB,SAAA,SAAAA,EAAEuB,OAAO,GAEhC1B,EAAA,QAAM2B,KAAK,SAASlB,EAAgBT,EAAA,QAAMjE,KAAK,WAAmBG,KAAKqB,MAAMoD,QAC7EX,EAAA,OAAK2B,KAAK,SACT3B,EAAA,UACCyB,IAAKvF,KAAK0F,SACVC,MAAM,GACNC,UAAW5F,KAAKqB,MAAMwE,WAAU,mBACdxB,EAAgB9C,OAAS,EAAI8C,EAAgByB,KAAK,KAAOjF,UAAS,aACxEb,KAAKqB,MAAMwD,mBAAqB7E,KAAKqB,MAAMoD,SAAW,SAAWzE,KAAKqB,MAAMoD,OAAS5D,UACjGkF,eAAe,MACfC,YAAY,MACZjC,SAAU/D,KAAKqB,MAAM0D,UACrBkB,GAAIjG,KAAKqB,MAAM8D,IACfe,SAAUlG,KAAKqB,MAAMM,UACrB9B,KAAMG,KAAKqB,MAAM8E,MACjBC,SAAUpG,KAAKqB,MAAM8B,UACrBkD,KAAMrG,KAAKqB,MAAM+B,MACjBkD,WAAW,QAEVhB,QAAStF,KAAKuG,WAAWC,SAASlB,QAClCmB,OAAQzG,KAAKuG,WAAWC,SAASC,OACjCC,QAAS1G,KAAKuG,WAAWC,SAASE,QAEnC5D,SAAU9C,KAAK8C,UAEd9C,KAAKqB,MAAMC,SAAS4C,KAAI,CAACxD,EAAQyD,KAMjC,MAAM/D,EAAM,IAAI+D,IAChB,GAAIxD,MAAMC,QAASF,EAAuCF,SAAU,CACnE,OAAOR,KAAK2D,eAAejD,EAAuCN,E,KAC5D,CACN,OACC0D,EAAA,UACCC,SAAUrD,EAAOqD,SACjB3D,IAAKA,EAELsB,SAAU4B,EAAWtD,KAAKqB,MAAMH,OAASR,EAA4CH,OACrFA,MAAOH,GAENM,EAAOsD,M,SAyIlB,WAAArE,CAAAgH,G,UAzOiB3G,KAAA0F,SAAYH,IAC5BvF,KAAKuF,IAAMA,EACXqB,EAAe5G,KAAKF,KAAME,KAAKuF,IAAI,EAwV5BvF,KAAA8C,SAAY+D,I,QACnB7G,KAAKkB,OAASP,MAAMmG,OAAK7C,EAAAjE,KAAKuF,OAAG,MAAAtB,SAAA,SAAAA,EAAEzD,UAAW,IAC5CQ,QAAQN,GAAWA,EAAOgB,WAAa,OACvCwC,KAAKxD,IAAM,IAAAuD,EAAK,OAAAA,EAAAjE,KAAKuG,WAAWpG,eAAeO,EAAOH,UAAM,MAAA0D,SAAA,SAAAA,EAAE1D,KAAe,IAG/EwG,EAAgBF,GAChBG,EAA0B,SAAUhH,KAAKF,KAAME,KAAKkB,QAGpDlB,KAAKuG,WAAW3D,uBAAuB5C,KAAKkB,QAG5C,WAAW+F,EAAAjH,KAAKqB,MAAM6F,OAAG,MAAAD,SAAA,SAAAA,EAAEnE,YAAa,WAAY,CACnD9C,KAAKqB,MAAM6F,IAAIpE,SAAS+D,EAAO7G,KAAKkB,O,yCAlP4B,K,eAM7B,M,sCAWiC,M,gBAOhC,M,WAKN,G,8EAqBK,M,+EAqBA,M,qGAqBiB,M,cAMc,M,iCAOpC,CAC/B0D,UAAW,MACX3C,WAAY,MACZkD,IAAK,MAAMgC,MACX1C,OAAQ,GACR9C,UAAW,MACXL,SAAU,GACVJ,OAAQ,IAIRlB,KAAKuG,WAAa,IAAI9G,EAAiBO,KAAM,SAAUA,KAAKF,K,CAItD,iBAAAsH,CAAkB7G,GACxBP,KAAKuG,WAAWa,kBAAkB7G,E,CAI5B,aAAA8G,CAAc9G,GACpBP,KAAKuG,WAAWc,cAAc9G,E,CAIxB,gBAAA+G,CAAiB/G,GACvBP,KAAKuG,WAAWe,iBAAiB/G,E,CAI3B,aAAAgH,CAAchH,GACpBP,KAAKuG,WAAWgB,cAAchH,E,CAIxB,iBAAAuB,CAAkBvB,GACxBP,KAAKuG,WAAWzE,kBAAkBvB,E,CAI5B,iBAAAiH,CAAkBjH,GACxBP,KAAKuG,WAAWiB,kBAAkBjH,E,CAI5B,YAAAkH,CAAalH,GACnBP,KAAKuG,WAAWkB,aAAalH,E,CAIvB,aAAAmH,CAAcnH,GACpBP,KAAKuG,WAAWmB,cAAcnH,E,CAIxB,UAAAoH,CAAWpH,GACjBP,KAAKuG,WAAWoB,WAAWpH,E,CAIrB,aAAAqH,CAAcrH,GACpBP,KAAKuG,WAAWqB,cAAcrH,E,CAIxB,gBAAA+B,CAAiB/B,GACvBP,KAAKuG,WAAWjE,iBAAiB/B,E,CAI3B,YAAAsH,CAAatH,GACnBP,KAAKuG,WAAWsB,aAAatH,E,CAIvB,UAAAuH,CAAWvH,GACjBP,KAAKuG,WAAWuB,WAAWvH,E,CAIrB,eAAA4B,CAAgB5B,GACtBP,KAAKuG,WAAWpE,gBAAgB5B,E,CAI1B,gBAAAiC,CAAiBjC,GACvBP,KAAKuG,WAAW/D,iBAAiBjC,E,CAI3B,YAAAkC,CAAalC,GACnBP,KAAKuG,WAAW9D,aAAalC,E,CAIvB,2BAAAwH,CAA4BxH,GAClCP,KAAKuG,WAAWwB,4BAA4BxH,E,CAItC,gBAAAyH,CAAiBzH,GACvBP,KAAKuG,WAAWyB,iBAAiBzH,E,CAI3B,eAAA0H,CAAgB1H,GACtBP,KAAKuG,WAAW0B,gBAAgB1H,E,CAI1B,aAAAmC,CAAcnC,GACpBP,KAAKuG,WAAW7D,cAAcnC,E,CAGxB,iBAAAsC,GACN7C,KAAKkI,OAASlI,KAAKkI,SAAW,KAC9BlI,KAAKqF,SAAWrF,KAAKqF,WAAa,KAClCrF,KAAKuG,WAAW1D,kBAAkB7C,KAAK8C,UAEvC9C,KAAKqB,MAAMuD,YAAc5E,KAAKqB,MAAMH,OACpClB,KAAKuG,WAAW4B,wBAAwBC,GAAOpI,KAAKqB,MAAMuD,YAAcwD,G"}
|
|
1
|
+
{"version":3,"names":["SelectController","InputIconController","constructor","component","name","host","super","this","keyOptionMap","Map","getOptionByKey","key","get","isValueInOptions","value","options","find","option","Array","isArray","undefined","filterValuesInOptions","values","filter","beforePatchOptions","_value","nextState","has","state","_options","length","clear","fillKeyOptionMap","selected","_multiple","set","onStateChange","validateHideError","hooks","afterPatch","_hideError","a11yHint","validateOptions","validateOptionsWithOptgroup","beforePatch","validateMultiple","watchBoolean","validateRequired","validateRows","validateValue","watchJsonArrayString","setFormAssociatedValue","componentWillLoad","onChange","timeout","setTimeout","clearTimeout","STATE_CHANGE_EVENT","_required","_rows","defaultStyleCss","isSelected","valueList","optionValue","includes","KolSelect","renderOptgroup","optgroup","preKey","h","disabled","label","_a","map","index","render","ariaDescribedBy","getRenderStates","hasExpertSlot","showExpertSlot","_label","Host","class","_hasValue","_hideLabel","select","_disabled","_error","_hint","_icons","_id","_tooltipAlign","_touched","onClick","ref","focus","slot","catchRef","title","accessKey","_accessKey","join","autoCapitalize","autoCorrect","id","multiple","_name","required","size","spellcheck","controller","onFacade","onBlur","onFocus","hostRef","propagateFocus","event","from","stopPropagation","tryToDispatchKoliBriEvent","_b","_on","nonce","validateAccessKey","validateAlert","validateDisabled","validateError","validateHideLabel","validateHint","validateIcons","validateId","validateLabel","validateName","validateOn","validateSyncValueBySelector","validateTabIndex","validateTouched","_alert","addValueChangeListener","v"],"sources":["src/components/select/controller.ts","src/components/select/style.css?tag=kol-select&mode=default&encapsulation=shadow","src/components/select/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\n\nimport { Stringified } from '../../types/common';\nimport { Optgroup, Option, SelectOption } from '../../types/input/types';\nimport { HideErrorPropType, validateHideError } from '../../types/props/hide-error';\nimport { OptionsWithOptgroupPropType, validateOptionsWithOptgroup } from '../../types/props/options';\nimport { RowsPropType, validateRows } from '../../types/props/rows';\nimport { W3CInputValue } from '../../types/w3c';\nimport { a11yHint } from '../../utils/a11y.tipps';\nimport { watchBoolean, watchJsonArrayString } from '../../utils/prop.validators';\nimport { STATE_CHANGE_EVENT } from '../../utils/validator';\nimport { InputIconController } from '../@deprecated/input/controller-icon';\nimport { fillKeyOptionMap } from '../input-radio/controller';\nimport { Props, Watches } from './types';\n\nexport class SelectController extends InputIconController implements Watches {\n\tprotected readonly component: Generic.Element.Component & Props;\n\tprivate onStateChange!: () => void;\n\tprivate readonly keyOptionMap = new Map<string, Option<W3CInputValue>>();\n\n\tpublic constructor(component: Generic.Element.Component & Props, name: string, host?: HTMLElement) {\n\t\tsuper(component, name, host);\n\t\tthis.component = component;\n\t}\n\n\tpublic readonly getOptionByKey = (key: string): Option<W3CInputValue> | undefined => this.keyOptionMap.get(key);\n\n\tprivate readonly isValueInOptions = (value: string, options: SelectOption<W3CInputValue>[]): boolean => {\n\t\treturn (\n\t\t\toptions.find((option) =>\n\t\t\t\ttypeof (option as Option<W3CInputValue>).value === 'string'\n\t\t\t\t\t? (option as Option<W3CInputValue>).value === value\n\t\t\t\t\t: Array.isArray((option as Optgroup<string>).options)\n\t\t\t\t\t? this.isValueInOptions(value, (option as Optgroup<string>).options)\n\t\t\t\t\t: false\n\t\t\t) !== undefined\n\t\t);\n\t};\n\n\tprivate readonly filterValuesInOptions = (values: string[], options: SelectOption<W3CInputValue>[]): string[] => {\n\t\treturn values.filter((value) => this.isValueInOptions(value, options) !== undefined);\n\t};\n\n\tprivate readonly beforePatchOptions = (_value: unknown, nextState: Map<string, unknown>): void => {\n\t\tconst options = nextState.has('_options') ? nextState.get('_options') : this.component.state._options;\n\t\tif (Array.isArray(options) && options.length > 0) {\n\t\t\tthis.keyOptionMap.clear();\n\t\t\tfillKeyOptionMap(this.keyOptionMap, options as SelectOption<W3CInputValue>[]);\n\t\t\tconst value = nextState.has('_value') ? nextState.get('_value') : this.component.state._value;\n\t\t\tconst selected = this.filterValuesInOptions(\n\t\t\t\tArray.isArray(value) && value.length > 0 ? (value as string[]) : [],\n\t\t\t\toptions as SelectOption<W3CInputValue>[]\n\t\t\t);\n\t\t\tif (this.component._multiple === false && selected.length === 0) {\n\t\t\t\tnextState.set('_value', [\n\t\t\t\t\t(\n\t\t\t\t\t\toptions[0] as {\n\t\t\t\t\t\t\tvalue: string;\n\t\t\t\t\t\t}\n\t\t\t\t\t).value,\n\t\t\t\t]);\n\t\t\t\tthis.onStateChange();\n\t\t\t} else if (Array.isArray(value) && selected.length < value.length) {\n\t\t\t\tnextState.set('_value', selected);\n\t\t\t\tthis.onStateChange();\n\t\t\t}\n\t\t}\n\t};\n\n\tpublic validateHideError(value?: HideErrorPropType): void {\n\t\tvalidateHideError(this.component, value, {\n\t\t\thooks: {\n\t\t\t\tafterPatch: () => {\n\t\t\t\t\tif (this.component.state._hideError) {\n\t\t\t\t\t\ta11yHint('Property hide-error for inputs: Only use when the error message is shown outside of the input component.');\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t},\n\t\t});\n\t}\n\n\tpublic validateOptions(value?: OptionsWithOptgroupPropType): void {\n\t\tvalidateOptionsWithOptgroup(this.component, value, {\n\t\t\thooks: {\n\t\t\t\tbeforePatch: this.beforePatchOptions,\n\t\t\t},\n\t\t});\n\t}\n\n\tpublic validateMultiple(value?: boolean): void {\n\t\twatchBoolean(this.component, '_multiple', value, {\n\t\t\thooks: {\n\t\t\t\tbeforePatch: this.beforePatchOptions,\n\t\t\t},\n\t\t});\n\t\t// if (value === true) {\n\t\t// \tdevHint(\n\t\t// \t\t'[KolSelect] Aktuell wird die Mehrfachauswahl noch nicht unterstützt. Wir sind dran die Mehrfachauswahl funktionsfähig zu implementieren, da der Browser-Standard hier ein paar Lücken hat.'\n\t\t// \t);\n\t\t// \tdevHint('[KolSelect] Bei der Mehrfachauswahl sollte zusätzlich auch die Listenlänge (size) gesetzt werden.');\n\t\t// }\n\t}\n\n\tpublic validateRequired(value?: boolean): void {\n\t\twatchBoolean(this.component, '_required', value);\n\t}\n\n\tpublic validateRows(value?: RowsPropType) {\n\t\tvalidateRows(this.component, value);\n\t}\n\n\tpublic validateValue(value?: Stringified<W3CInputValue[]>): void {\n\t\twatchJsonArrayString(this.component, '_value', () => true, value, undefined, {\n\t\t\thooks: {\n\t\t\t\tbeforePatch: this.beforePatchOptions,\n\t\t\t},\n\t\t});\n\t\tthis.setFormAssociatedValue(this.component._value as string);\n\t}\n\n\tpublic componentWillLoad(onChange?: (event: Event) => void): void {\n\t\tsuper.componentWillLoad();\n\n\t\tthis.onStateChange = () => {\n\t\t\tif (typeof onChange === 'function') {\n\t\t\t\tconst timeout = setTimeout(() => {\n\t\t\t\t\tclearTimeout(timeout);\n\t\t\t\t\tonChange(STATE_CHANGE_EVENT);\n\t\t\t\t});\n\t\t\t}\n\t\t};\n\n\t\tthis.validateHideError(this.component._hideError);\n\t\tthis.validateOptions(this.component._options);\n\t\tthis.validateMultiple(this.component._multiple);\n\t\tthis.validateRequired(this.component._required);\n\t\tthis.validateRows(this.component._rows);\n\t\tthis.validateValue(this.component._value);\n\t}\n}\n","@import url(../input-line.css);\n.error.hidden {\n\tdisplay: none;\n}\n","import { Component, Element, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { Stringified } from '../../types/common';\nimport { KoliBriHorizontalIcons } from '../../types/icons';\nimport { InputTypeOnDefault, Optgroup, Option, SelectOption } from '../../types/input/types';\nimport { HideErrorPropType } from '../../types/props/hide-error';\nimport { IdPropType } from '../../types/props/id';\nimport { LabelWithExpertSlotPropType } from '../../types/props/label';\nimport { NamePropType } from '../../types/props/name';\nimport { OptionsWithOptgroupPropType } from '../../types/props/options';\nimport { RowsPropType } from '../../types/props/rows';\nimport { SyncValueBySelectorPropType } from '../../types/props/sync-value-by-selector';\nimport { TooltipAlignPropType } from '../../types/props/tooltip-align';\nimport { W3CInputValue } from '../../types/w3c';\nimport { nonce } from '../../utils/dev.utils';\nimport { stopPropagation, tryToDispatchKoliBriEvent } from '../../utils/events';\nimport { propagateFocus, showExpertSlot } from '../../utils/reuse';\nimport { getRenderStates } from '../input/controller';\nimport { SelectController } from './controller';\nimport { API, States } from './types';\n\nconst isSelected = (valueList: unknown[] | null, optionValue: unknown): boolean => {\n\treturn Array.isArray(valueList) && valueList.includes(optionValue);\n};\n\n/**\n * @slot - Die Beschriftung des Eingabefeldes.\n */\n@Component({\n\ttag: 'kol-select',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolSelect implements API {\n\t@Element() private readonly host?: HTMLKolSelectElement;\n\tprivate ref?: HTMLSelectElement;\n\n\tprivate readonly catchRef = (ref?: HTMLSelectElement) => {\n\t\tthis.ref = ref;\n\t\tpropagateFocus(this.host, this.ref);\n\t};\n\n\tprivate renderOptgroup(optgroup: Optgroup<string>, preKey: string): JSX.Element {\n\t\treturn (\n\t\t\t<optgroup disabled={optgroup.disabled} label={optgroup.label}>\n\t\t\t\t{optgroup.options?.map((option: SelectOption<W3CInputValue>, index: number) => {\n\t\t\t\t\tconst key = `${preKey}-${index}`;\n\t\t\t\t\tif (Array.isArray((option as Optgroup<string>).options)) {\n\t\t\t\t\t\treturn this.renderOptgroup(option as Optgroup<string>, key);\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<option\n\t\t\t\t\t\t\t\tdisabled={option.disabled}\n\t\t\t\t\t\t\t\tkey={key}\n\t\t\t\t\t\t\t\t// label={option.label}\n\t\t\t\t\t\t\t\tselected={isSelected(this.state._value, (option as Option<W3CInputValue>).value)}\n\t\t\t\t\t\t\t\tvalue={key}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{option.label}\n\t\t\t\t\t\t\t</option>\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t})}\n\t\t\t</optgroup>\n\t\t);\n\t}\n\n\tpublic render(): JSX.Element {\n\t\tconst { ariaDescribedBy } = getRenderStates(this.state);\n\t\tconst hasExpertSlot = showExpertSlot(this.state._label);\n\n\t\treturn (\n\t\t\t<Host class={{ 'has-value': this.state._hasValue }}>\n\t\t\t\t<kol-input\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t'hide-label': !!this.state._hideLabel,\n\t\t\t\t\t\tselect: true,\n\t\t\t\t\t}}\n\t\t\t\t\t_disabled={this.state._disabled}\n\t\t\t\t\t_error={this.state._error}\n\t\t\t\t\t_hideError={this.state._hideError}\n\t\t\t\t\t_hideLabel={this.state._hideLabel}\n\t\t\t\t\t_hint={this.state._hint}\n\t\t\t\t\t_icons={this.state._icons}\n\t\t\t\t\t_id={this.state._id}\n\t\t\t\t\t_label={this.state._label}\n\t\t\t\t\t_required={this.state._required}\n\t\t\t\t\t_tooltipAlign={this._tooltipAlign}\n\t\t\t\t\t_touched={this.state._touched}\n\t\t\t\t\tonClick={() => this.ref?.focus()}\n\t\t\t\t>\n\t\t\t\t\t<span slot=\"label\">{hasExpertSlot ? <slot name=\"expert\"></slot> : this.state._label}</span>\n\t\t\t\t\t<div slot=\"input\">\n\t\t\t\t\t\t<select\n\t\t\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\t\t\ttitle=\"\"\n\t\t\t\t\t\t\taccessKey={this.state._accessKey}\n\t\t\t\t\t\t\taria-describedby={ariaDescribedBy.length > 0 ? ariaDescribedBy.join(' ') : undefined}\n\t\t\t\t\t\t\taria-label={this.state._hideLabel && typeof this.state._label === 'string' ? this.state._label : undefined}\n\t\t\t\t\t\t\tautoCapitalize=\"off\"\n\t\t\t\t\t\t\tautoCorrect=\"off\"\n\t\t\t\t\t\t\tdisabled={this.state._disabled}\n\t\t\t\t\t\t\tid={this.state._id}\n\t\t\t\t\t\t\tmultiple={this.state._multiple}\n\t\t\t\t\t\t\tname={this.state._name}\n\t\t\t\t\t\t\trequired={this.state._required}\n\t\t\t\t\t\t\tsize={this.state._rows}\n\t\t\t\t\t\t\tspellcheck=\"false\"\n\t\t\t\t\t\t\t{...{\n\t\t\t\t\t\t\t\tonClick: this.controller.onFacade.onClick,\n\t\t\t\t\t\t\t\tonBlur: this.controller.onFacade.onBlur,\n\t\t\t\t\t\t\t\tonFocus: this.controller.onFacade.onFocus,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tonChange={this.onChange}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{this.state._options.map((option, index) => {\n\t\t\t\t\t\t\t\t/**\n\t\t\t\t\t\t\t\t * Damit der Value einer Option ein beliebigen Typ haben kann\n\t\t\t\t\t\t\t\t * muss man auf HTML-Ebene den Value auf einen String-Wert\n\t\t\t\t\t\t\t\t * mappen. Das tun wir mittels der Map.\n\t\t\t\t\t\t\t\t */\n\t\t\t\t\t\t\t\tconst key = `-${index}`;\n\t\t\t\t\t\t\t\tif (Array.isArray((option as unknown as Optgroup<string>).options)) {\n\t\t\t\t\t\t\t\t\treturn this.renderOptgroup(option as unknown as Optgroup<string>, key);\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t<option\n\t\t\t\t\t\t\t\t\t\t\tdisabled={option.disabled}\n\t\t\t\t\t\t\t\t\t\t\tkey={key}\n\t\t\t\t\t\t\t\t\t\t\t// label={option.label}\n\t\t\t\t\t\t\t\t\t\t\tselected={isSelected(this.state._value, (option as unknown as Option<W3CInputValue>).value)}\n\t\t\t\t\t\t\t\t\t\t\tvalue={key}\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{option.label}\n\t\t\t\t\t\t\t\t\t\t</option>\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t</select>\n\t\t\t\t\t</div>\n\t\t\t\t</kol-input>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate readonly controller: SelectController;\n\n\t/**\n\t * Defines which key combination can be used to trigger or focus the interactive element of the component.\n\t */\n\t@Prop() public _accessKey?: string;\n\n\t/**\n\t * Defines whether the screen-readers should read out the notification.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _alert?: boolean = true;\n\n\t/**\n\t * Makes the element not focusable and ignore all events.\n\t * @TODO: Change type back to `DisabledPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _disabled?: boolean = false;\n\n\t/**\n\t * Defines the error message text.\n\t */\n\t@Prop() public _error?: string;\n\n\t/**\n\t * Hides the error message but leaves it in the DOM for the input's aria-describedby.\n\t * @TODO: Change type back to `HideErrorPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _hideError?: boolean = false;\n\n\t/**\n\t * Hides the caption by default and displays the caption text with a tooltip when the\n\t * interactive element is focused or the mouse is over it.\n\t * @TODO: Change type back to `HideLabelPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _hideLabel?: boolean = false;\n\n\t/**\n\t * Defines the hint text.\n\t */\n\t@Prop() public _hint?: string = '';\n\n\t/**\n\t * Defines the icon classnames (e.g. `_icons=\"fa-solid fa-user\"`).\n\t */\n\t@Prop() public _icons?: Stringified<KoliBriHorizontalIcons>;\n\n\t/**\n\t * Defines the internal ID of the primary component element.\n\t */\n\t@Prop() public _id?: IdPropType;\n\n\t/**\n\t * Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot.\n\t */\n\t@Prop() public _label!: LabelWithExpertSlotPropType;\n\n\t/**\n\t * Makes the input accept multiple inputs.\n\t * @TODO: Change type back to `MultiplePropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _multiple?: boolean = false;\n\n\t/**\n\t * Defines the technical name of an input field.\n\t */\n\t@Prop() public _name?: NamePropType;\n\n\t/**\n\t * Gibt die EventCallback-Funktionen für das Input-Event an.\n\t */\n\t@Prop() public _on?: InputTypeOnDefault;\n\n\t/**\n\t * Options the user can choose from, also supporting Optgroup.\n\t */\n\t@Prop() public _options?: OptionsWithOptgroupPropType;\n\n\t/**\n\t * Makes the input element required.\n\t * @TODO: Change type back to `RequiredPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _required?: boolean = false;\n\n\t/**\n\t * Defines how many rows of options should be visible at the same time.\n\t */\n\t@Prop() public _rows?: RowsPropType;\n\n\t/**\n\t * Selector for synchronizing the value with another input element.\n\t * @internal\n\t */\n\t@Prop() public _syncValueBySelector?: SyncValueBySelectorPropType;\n\n\t/**\n\t * Defines which tab-index the primary element of the component has. (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 * Defines where to show the Tooltip preferably: top, right, bottom or left.\n\t */\n\t@Prop() public _tooltipAlign?: TooltipAlignPropType = 'top';\n\n\t/**\n\t * Shows if the input was touched by a user.\n\t * @TODO: Change type back to `TouchedPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _touched?: boolean = false;\n\n\t/**\n\t * Defines the value of the input.\n\t */\n\t@Prop({ mutable: true }) public _value?: Stringified<W3CInputValue[]>;\n\n\t@State() public state: States = {\n\t\t_hasValue: false,\n\t\t_hideError: false,\n\t\t_id: `id-${nonce()}`, // ⚠ required\n\t\t_label: '', // ⚠ required\n\t\t_multiple: false,\n\t\t_options: [],\n\t\t_value: [],\n\t};\n\n\tpublic constructor() {\n\t\tthis.controller = new SelectController(this, 'select', this.host);\n\t}\n\n\t@Watch('_accessKey')\n\tpublic validateAccessKey(value?: string): void {\n\t\tthis.controller.validateAccessKey(value);\n\t}\n\n\t@Watch('_alert')\n\tpublic validateAlert(value?: boolean): void {\n\t\tthis.controller.validateAlert(value);\n\t}\n\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: boolean): void {\n\t\tthis.controller.validateDisabled(value);\n\t}\n\n\t@Watch('_error')\n\tpublic validateError(value?: string): void {\n\t\tthis.controller.validateError(value);\n\t}\n\n\t@Watch('_hideError')\n\tpublic validateHideError(value?: HideErrorPropType): void {\n\t\tthis.controller.validateHideError(value);\n\t}\n\n\t@Watch('_hideLabel')\n\tpublic validateHideLabel(value?: boolean): void {\n\t\tthis.controller.validateHideLabel(value);\n\t}\n\n\t@Watch('_hint')\n\tpublic validateHint(value?: string): void {\n\t\tthis.controller.validateHint(value);\n\t}\n\n\t@Watch('_icons')\n\tpublic validateIcons(value?: Stringified<KoliBriHorizontalIcons>): void {\n\t\tthis.controller.validateIcons(value);\n\t}\n\n\t@Watch('_id')\n\tpublic validateId(value?: string): void {\n\t\tthis.controller.validateId(value);\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: LabelWithExpertSlotPropType): void {\n\t\tthis.controller.validateLabel(value);\n\t}\n\n\t@Watch('_multiple')\n\tpublic validateMultiple(value?: boolean): void {\n\t\tthis.controller.validateMultiple(value);\n\t}\n\n\t@Watch('_name')\n\tpublic validateName(value?: string): void {\n\t\tthis.controller.validateName(value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: InputTypeOnDefault): void {\n\t\tthis.controller.validateOn(value);\n\t}\n\n\t@Watch('_options')\n\tpublic validateOptions(value?: OptionsWithOptgroupPropType): void {\n\t\tthis.controller.validateOptions(value);\n\t}\n\n\t@Watch('_required')\n\tpublic validateRequired(value?: boolean): void {\n\t\tthis.controller.validateRequired(value);\n\t}\n\n\t@Watch('_rows')\n\tpublic validateRows(value?: RowsPropType): void {\n\t\tthis.controller.validateRows(value);\n\t}\n\n\t@Watch('_syncValueBySelector')\n\tpublic validateSyncValueBySelector(value?: SyncValueBySelectorPropType): void {\n\t\tthis.controller.validateSyncValueBySelector(value);\n\t}\n\n\t@Watch('_tabIndex')\n\tpublic validateTabIndex(value?: number): void {\n\t\tthis.controller.validateTabIndex(value);\n\t}\n\n\t@Watch('_touched')\n\tpublic validateTouched(value?: boolean): void {\n\t\tthis.controller.validateTouched(value);\n\t}\n\n\t@Watch('_value')\n\tpublic validateValue(value?: Stringified<W3CInputValue[]>): void {\n\t\tthis.controller.validateValue(value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis._alert = this._alert === true;\n\t\tthis._touched = this._touched === true;\n\t\tthis.controller.componentWillLoad(this.onChange);\n\n\t\tthis.state._hasValue = !!this.state._value;\n\t\tthis.controller.addValueChangeListener((v) => (this.state._hasValue = !!v));\n\t}\n\n\tprivate onChange = (event: Event): void => {\n\t\tthis._value = Array.from(this.ref?.options || [])\n\t\t\t.filter((option) => option.selected === true)\n\t\t\t.map((option) => this.controller.getOptionByKey(option.value)?.value as string);\n\n\t\t// Event handling\n\t\tstopPropagation(event);\n\t\ttryToDispatchKoliBriEvent('change', this.host, this._value);\n\n\t\t// Static form handling\n\t\tthis.controller.setFormAssociatedValue(this._value as unknown as string);\n\n\t\t// Callback\n\t\tif (typeof this.state._on?.onChange === 'function') {\n\t\t\tthis.state._on.onChange(event, this._value);\n\t\t}\n\t};\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 i,h as t}from"./index-d0c806ea.js";import{v as e}from"./label-
|
|
4
|
+
import{r as i,h as t}from"./index-d0c806ea.js";import{v as e}from"./label-c130b72e.js";import{r as n,a}from"./unique-nav-labels-c6750f60.js";import{w as s}from"./validation-3a52d0f0.js";import"./a11y.tipps-348ca42a.js";import"./dev.utils-9b878520.js";import"./reuse-b3566e4c.js";import"./prop.validators-e40c3380.js";const o=":host{--a11y-min-size:44px;font-size:inherit}*{font-family:Verdana;hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}ul{display:grid;list-style:none;place-items:center}ul li{height:0}kol-link-wc a{left:-99999px;overflow:hidden;position:absolute;z-index:9999999;line-height:1em}kol-link-wc a:focus{background-color:#fff;left:unset;position:unset}",l=class{constructor(t){i(this,t),this._label=void 0,this._links=void 0,this.state={_label:"…",_links:[]}}render(){return t("nav",{"aria-label":this.state._label},t("ul",null,this.state._links.map(((i,e)=>t("li",{key:e},t("kol-link-wc",Object.assign({},i)))))))}validateLabel(t,i,s=!1){s||n(this.state._label),e(this,t),a(this.state._label)}validateLinks(t){s("KolSkipNav",this,t)}componentWillLoad(){this.validateLabel(this._label,void 0,!0),this.validateLinks(this._links)}disconnectedCallback(){n(this.state._label)}static get watchers(){return{_label:["validateLabel"],_links:["validateLinks"]}}};l.style={default:o};export{l as kol_skip_nav};
|