@public-ui/components 1.7.0-rc.2 → 1.7.0-rc.3
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 +1 -1
- package/dist/cjs/{a11y.tipps-e8db4301.js → a11y.tipps-22551929.js} +1 -1
- package/dist/cjs/{a11y.tipps-e8db4301.js.map → a11y.tipps-22551929.js.map} +1 -1
- package/dist/cjs/align-0ba112a3.js +4 -0
- package/dist/cjs/{align-9e535cd3.js.map → align-0ba112a3.js.map} +1 -1
- package/dist/cjs/{alignment-d4dd9d56.js → alignment-fd6da0f7.js} +1 -1
- package/dist/cjs/{alignment-d4dd9d56.js.map → alignment-fd6da0f7.js.map} +1 -1
- package/dist/cjs/{alternative-button-link-role-0d41e022.js → alternative-button-link-role-a005c66e.js} +1 -1
- package/dist/cjs/{alternative-button-link-role-0d41e022.js.map → alternative-button-link-role-a005c66e.js.map} +1 -1
- package/dist/cjs/{app-globals-c03c57e1.js → app-globals-c86054fe.js} +1 -1
- package/dist/cjs/{app-globals-c03c57e1.js.map → app-globals-c86054fe.js.map} +1 -1
- package/dist/cjs/{associated.controller-5c849c6b.js → associated.controller-4a366c46.js} +1 -1
- package/dist/cjs/{associated.controller-5c849c6b.js.map → associated.controller-4a366c46.js.map} +1 -1
- package/dist/cjs/{color-862cae65.js → color-69313074.js} +1 -1
- package/dist/cjs/{color-862cae65.js.map → color-69313074.js.map} +1 -1
- package/dist/cjs/{controller-e572bee2.js → controller-712318df.js} +1 -1
- package/dist/cjs/{controller-e572bee2.js.map → controller-712318df.js.map} +1 -1
- package/dist/cjs/{controller-c5d6e4a4.js → controller-722dc86d.js} +1 -1
- package/dist/cjs/{controller-c5d6e4a4.js.map → controller-722dc86d.js.map} +1 -1
- package/dist/cjs/{controller-13bfd3a4.js → controller-811b74fc.js} +1 -1
- package/dist/cjs/{controller-13bfd3a4.js.map → controller-811b74fc.js.map} +1 -1
- package/dist/cjs/{controller-127af120.js → controller-8523793b.js} +1 -1
- package/dist/cjs/{controller-127af120.js.map → controller-8523793b.js.map} +1 -1
- package/dist/cjs/{controller-387fa6e7.js → controller-af5a339f.js} +1 -1
- package/dist/cjs/{controller-387fa6e7.js.map → controller-af5a339f.js.map} +1 -1
- package/dist/cjs/{controller-icon-745d6cf5.js → controller-icon-b12ac6e3.js} +1 -1
- package/dist/cjs/{controller-icon-745d6cf5.js.map → controller-icon-b12ac6e3.js.map} +1 -1
- package/dist/cjs/{custom-class-73c0bab5.js → custom-class-c19c348c.js} +1 -1
- package/dist/cjs/{custom-class-73c0bab5.js.map → custom-class-c19c348c.js.map} +1 -1
- package/dist/cjs/{dev.utils-7eab34a4.js → dev.utils-b9f8607d.js} +1 -1
- package/dist/cjs/{dev.utils-7eab34a4.js.map → dev.utils-b9f8607d.js.map} +1 -1
- package/dist/cjs/{devtools-ba0075f3.js → devtools-ca21f0c4.js} +1 -1
- package/dist/cjs/{devtools-ba0075f3.js.map → devtools-ca21f0c4.js.map} +1 -1
- package/dist/cjs/has-closer-163027b9.js +4 -0
- package/dist/cjs/{has-closer-8ef0053a.js.map → has-closer-163027b9.js.map} +1 -1
- package/dist/cjs/hide-label-1c151f2b.js +4 -0
- package/dist/cjs/{hide-label-446ae8ed.js.map → hide-label-1c151f2b.js.map} +1 -1
- package/dist/cjs/{i18n-408350a7.js → i18n-946588f3.js} +1 -1
- package/dist/cjs/{i18n-408350a7.js.map → i18n-946588f3.js.map} +1 -1
- package/dist/cjs/{icon-704abbaa.js → icon-d9e5a774.js} +1 -1
- package/dist/cjs/{icon-704abbaa.js.map → icon-d9e5a774.js.map} +1 -1
- package/dist/cjs/image-source-42d6099a.js +4 -0
- package/dist/cjs/{image-source-46c66acc.js.map → image-source-42d6099a.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-card.cjs.entry.js +1 -1
- package/dist/cjs/kol-details.cjs.entry.js +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-adapter-leanup.cjs.entry.js +1 -1
- package/dist/cjs/kol-input-checkbox.cjs.entry.js +1 -1
- package/dist/cjs/kol-input-color.cjs.entry.js +1 -1
- package/dist/cjs/kol-input-date.cjs.entry.js +1 -1
- package/dist/cjs/kol-input-email.cjs.entry.js +1 -1
- package/dist/cjs/kol-input-file.cjs.entry.js +1 -1
- package/dist/cjs/kol-input-number.cjs.entry.js +1 -1
- package/dist/cjs/kol-input-password.cjs.entry.js +1 -1
- package/dist/cjs/kol-input-radio-group.cjs.entry.js +1 -1
- package/dist/cjs/kol-input-radio.cjs.entry.js +1 -1
- package/dist/cjs/kol-input-range.cjs.entry.js +1 -1
- package/dist/cjs/kol-input-text.cjs.entry.js +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-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-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-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-split-button.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-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-33d596db.js → label-7e879957.js} +1 -1
- package/dist/cjs/{label-33d596db.js.map → label-7e879957.js.map} +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/open-e99f1c74.js +4 -0
- package/dist/cjs/{open-ac9f80a5.js.map → open-e99f1c74.js.map} +1 -1
- package/dist/cjs/{prop.validators-407eb859.js → prop.validators-ec891635.js} +1 -1
- package/dist/cjs/{prop.validators-407eb859.js.map → prop.validators-ec891635.js.map} +1 -1
- package/dist/cjs/rows-a2711bb9.js +4 -0
- package/dist/cjs/{rows-adb589f4.js.map → rows-a2711bb9.js.map} +1 -1
- package/dist/cjs/show-c58db561.js +4 -0
- package/dist/cjs/{show-a96164f1.js.map → show-c58db561.js.map} +1 -1
- package/dist/cjs/{suggestions-c960e06b.js → suggestions-866742ec.js} +1 -1
- package/dist/cjs/{suggestions-c960e06b.js.map → suggestions-866742ec.js.map} +1 -1
- package/dist/cjs/{tab-index-b3b06103.js → tab-index-068e0c27.js} +1 -1
- package/dist/cjs/{tab-index-b3b06103.js.map → tab-index-068e0c27.js.map} +1 -1
- package/dist/cjs/tooltip-align-06a2e16e.js +4 -0
- package/dist/cjs/{tooltip-align-f6084a9c.js.map → tooltip-align-06a2e16e.js.map} +1 -1
- package/dist/cjs/{validation-49285437.js → validation-ab84e2c4.js} +1 -1
- package/dist/cjs/{validation-49285437.js.map → validation-ab84e2c4.js.map} +1 -1
- package/dist/cjs/{validation-f3d777f5.js → validation-b2a7f696.js} +1 -1
- package/dist/cjs/{validation-f3d777f5.js.map → validation-b2a7f696.js.map} +1 -1
- package/dist/components/prop.validators.js +1 -1
- package/dist/components/prop.validators.js.map +1 -1
- package/dist/esm/{a11y.tipps-8ac27a12.js → a11y.tipps-32ec681c.js} +1 -1
- package/dist/esm/{a11y.tipps-8ac27a12.js.map → a11y.tipps-32ec681c.js.map} +1 -1
- package/dist/esm/{align-96c1f990.js → align-91ae6977.js} +1 -1
- package/dist/esm/{align-96c1f990.js.map → align-91ae6977.js.map} +1 -1
- package/dist/esm/{alignment-313f7fef.js → alignment-6e474722.js} +1 -1
- package/dist/esm/{alignment-313f7fef.js.map → alignment-6e474722.js.map} +1 -1
- package/dist/esm/{alternative-button-link-role-2448c7aa.js → alternative-button-link-role-6e251523.js} +1 -1
- package/dist/esm/{alternative-button-link-role-2448c7aa.js.map → alternative-button-link-role-6e251523.js.map} +1 -1
- package/dist/esm/app-globals-f43e7498.js +4 -0
- package/dist/esm/{app-globals-d3c4b38e.js.map → app-globals-f43e7498.js.map} +1 -1
- package/dist/esm/{associated.controller-2e4854aa.js → associated.controller-e8585dfb.js} +1 -1
- package/dist/esm/{associated.controller-2e4854aa.js.map → associated.controller-e8585dfb.js.map} +1 -1
- package/dist/esm/{color-994bf163.js → color-74eac985.js} +1 -1
- package/dist/esm/{color-994bf163.js.map → color-74eac985.js.map} +1 -1
- package/dist/esm/{controller-bc00373d.js → controller-155cfee3.js} +1 -1
- package/dist/esm/{controller-bc00373d.js.map → controller-155cfee3.js.map} +1 -1
- package/dist/esm/{controller-8eb319c8.js → controller-928905f0.js} +1 -1
- package/dist/esm/{controller-8eb319c8.js.map → controller-928905f0.js.map} +1 -1
- package/dist/esm/{controller-68f34456.js → controller-a6ffee27.js} +1 -1
- package/dist/esm/{controller-68f34456.js.map → controller-a6ffee27.js.map} +1 -1
- package/dist/esm/{controller-6853d800.js → controller-ae7d4a77.js} +1 -1
- package/dist/esm/{controller-6853d800.js.map → controller-ae7d4a77.js.map} +1 -1
- package/dist/esm/{controller-6ab1cb06.js → controller-c233edf4.js} +1 -1
- package/dist/esm/{controller-6ab1cb06.js.map → controller-c233edf4.js.map} +1 -1
- package/dist/esm/{controller-icon-5fe19121.js → controller-icon-09e55d92.js} +1 -1
- package/dist/esm/{controller-icon-5fe19121.js.map → controller-icon-09e55d92.js.map} +1 -1
- package/dist/esm/{custom-class-59057e96.js → custom-class-fb88922a.js} +1 -1
- package/dist/esm/{custom-class-59057e96.js.map → custom-class-fb88922a.js.map} +1 -1
- package/dist/esm/{dev.utils-2dfcff1c.js → dev.utils-15468eab.js} +1 -1
- package/dist/esm/{dev.utils-2dfcff1c.js.map → dev.utils-15468eab.js.map} +1 -1
- package/dist/esm/{devtools-3a887392.js → devtools-fe80821d.js} +1 -1
- package/dist/esm/{devtools-3a887392.js.map → devtools-fe80821d.js.map} +1 -1
- package/dist/esm/{has-closer-fd018dc5.js → has-closer-9bb2d802.js} +1 -1
- package/dist/esm/{has-closer-fd018dc5.js.map → has-closer-9bb2d802.js.map} +1 -1
- package/dist/esm/{hide-label-dd9b83d5.js → hide-label-59320a79.js} +1 -1
- package/dist/esm/{hide-label-dd9b83d5.js.map → hide-label-59320a79.js.map} +1 -1
- package/dist/esm/{i18n-4753a22f.js → i18n-2d630bd4.js} +1 -1
- package/dist/esm/{i18n-4753a22f.js.map → i18n-2d630bd4.js.map} +1 -1
- package/dist/esm/{icon-30b99a49.js → icon-e9f19388.js} +1 -1
- package/dist/esm/{icon-30b99a49.js.map → icon-e9f19388.js.map} +1 -1
- package/dist/esm/{image-source-84a695dd.js → image-source-cdcbea01.js} +1 -1
- package/dist/esm/{image-source-84a695dd.js.map → image-source-cdcbea01.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-card.entry.js +1 -1
- package/dist/esm/kol-details.entry.js +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-adapter-leanup.entry.js +1 -1
- package/dist/esm/kol-input-checkbox.entry.js +1 -1
- package/dist/esm/kol-input-color.entry.js +1 -1
- package/dist/esm/kol-input-date.entry.js +1 -1
- package/dist/esm/kol-input-email.entry.js +1 -1
- package/dist/esm/kol-input-file.entry.js +1 -1
- package/dist/esm/kol-input-number.entry.js +1 -1
- package/dist/esm/kol-input-password.entry.js +1 -1
- package/dist/esm/kol-input-radio-group.entry.js +1 -1
- package/dist/esm/kol-input-radio.entry.js +1 -1
- package/dist/esm/kol-input-range.entry.js +1 -1
- package/dist/esm/kol-input-text.entry.js +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-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-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-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-split-button.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-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-cdf2126a.js → label-671155b8.js} +1 -1
- package/dist/esm/{label-cdf2126a.js.map → label-671155b8.js.map} +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/{open-46e62bc3.js → open-23d53249.js} +1 -1
- package/dist/esm/{open-46e62bc3.js.map → open-23d53249.js.map} +1 -1
- package/dist/esm/{prop.validators-e3efc9be.js → prop.validators-e8e7611e.js} +1 -1
- package/dist/esm/{prop.validators-e3efc9be.js.map → prop.validators-e8e7611e.js.map} +1 -1
- package/dist/esm/{rows-8e1f2d42.js → rows-c15196b5.js} +1 -1
- package/dist/esm/{rows-8e1f2d42.js.map → rows-c15196b5.js.map} +1 -1
- package/dist/esm/{show-820a9a22.js → show-8e8d6f73.js} +1 -1
- package/dist/esm/{show-820a9a22.js.map → show-8e8d6f73.js.map} +1 -1
- package/dist/esm/{suggestions-c6fb713f.js → suggestions-748f987c.js} +1 -1
- package/dist/esm/{suggestions-c6fb713f.js.map → suggestions-748f987c.js.map} +1 -1
- package/dist/esm/{tab-index-9c10594d.js → tab-index-a166ca52.js} +1 -1
- package/dist/esm/{tab-index-9c10594d.js.map → tab-index-a166ca52.js.map} +1 -1
- package/dist/esm/{tooltip-align-b91851a6.js → tooltip-align-a1e0f931.js} +1 -1
- package/dist/esm/{tooltip-align-b91851a6.js.map → tooltip-align-a1e0f931.js.map} +1 -1
- package/dist/esm/{validation-506928e9.js → validation-c78bf25b.js} +1 -1
- package/dist/esm/{validation-506928e9.js.map → validation-c78bf25b.js.map} +1 -1
- package/dist/esm/validation-edd7dd57.js +4 -0
- package/dist/esm/{validation-eb464d50.js.map → validation-edd7dd57.js.map} +1 -1
- package/dist/kolibri/{a11y.tipps-8ac27a12.js → a11y.tipps-32ec681c.js} +1 -1
- package/dist/kolibri/align-91ae6977.js +4 -0
- package/dist/kolibri/{alignment-313f7fef.js → alignment-6e474722.js} +1 -1
- package/dist/kolibri/{alternative-button-link-role-2448c7aa.js → alternative-button-link-role-6e251523.js} +1 -1
- package/dist/kolibri/app-globals-f43e7498.js +4 -0
- package/dist/kolibri/{app-globals-d3c4b38e.js.map → app-globals-f43e7498.js.map} +1 -1
- package/dist/kolibri/{associated.controller-2e4854aa.js → associated.controller-e8585dfb.js} +1 -1
- package/dist/kolibri/{color-994bf163.js → color-74eac985.js} +1 -1
- package/dist/kolibri/{controller-bc00373d.js → controller-155cfee3.js} +1 -1
- package/dist/kolibri/{controller-8eb319c8.js → controller-928905f0.js} +1 -1
- package/dist/kolibri/{controller-68f34456.js → controller-a6ffee27.js} +1 -1
- package/dist/kolibri/{controller-6853d800.js → controller-ae7d4a77.js} +1 -1
- package/dist/kolibri/{controller-6ab1cb06.js → controller-c233edf4.js} +1 -1
- package/dist/kolibri/{controller-icon-5fe19121.js → controller-icon-09e55d92.js} +1 -1
- package/dist/kolibri/{custom-class-59057e96.js → custom-class-fb88922a.js} +1 -1
- package/dist/kolibri/{dev.utils-2dfcff1c.js → dev.utils-15468eab.js} +1 -1
- package/dist/kolibri/{dev.utils-2dfcff1c.js.map → dev.utils-15468eab.js.map} +1 -1
- package/dist/kolibri/devtools-fe80821d.js +4 -0
- package/dist/kolibri/{devtools-3a887392.js.map → devtools-fe80821d.js.map} +1 -1
- package/dist/kolibri/has-closer-9bb2d802.js +4 -0
- package/dist/kolibri/hide-label-59320a79.js +4 -0
- package/dist/kolibri/{i18n-4753a22f.js → i18n-2d630bd4.js} +1 -1
- package/dist/kolibri/{icon-30b99a49.js → icon-e9f19388.js} +1 -1
- package/dist/kolibri/image-source-cdcbea01.js +4 -0
- 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-card.entry.js +1 -1
- package/dist/kolibri/kol-details.entry.js +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-adapter-leanup.entry.js +1 -1
- package/dist/kolibri/kol-input-checkbox.entry.js +1 -1
- package/dist/kolibri/kol-input-color.entry.js +1 -1
- package/dist/kolibri/kol-input-date.entry.js +1 -1
- package/dist/kolibri/kol-input-email.entry.js +1 -1
- package/dist/kolibri/kol-input-file.entry.js +1 -1
- package/dist/kolibri/kol-input-number.entry.js +1 -1
- package/dist/kolibri/kol-input-password.entry.js +1 -1
- package/dist/kolibri/kol-input-radio-group.entry.js +1 -1
- package/dist/kolibri/kol-input-radio.entry.js +1 -1
- package/dist/kolibri/kol-input-range.entry.js +1 -1
- package/dist/kolibri/kol-input-text.entry.js +1 -1
- package/dist/kolibri/kol-input.entry.js +1 -1
- package/dist/kolibri/kol-input.entry.js.map +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-button.entry.js.map +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-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-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-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-split-button.entry.js +1 -1
- package/dist/kolibri/kol-symbol.entry.js +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-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/label-671155b8.js +4 -0
- package/dist/kolibri/open-23d53249.js +4 -0
- package/dist/kolibri/prop.validators-e8e7611e.js +4 -0
- package/dist/kolibri/rows-c15196b5.js +4 -0
- package/dist/kolibri/show-8e8d6f73.js +4 -0
- package/dist/kolibri/{suggestions-c6fb713f.js → suggestions-748f987c.js} +1 -1
- package/dist/kolibri/tab-index-a166ca52.js +4 -0
- package/dist/kolibri/{tab-index-9c10594d.js.map → tab-index-a166ca52.js.map} +1 -1
- package/dist/kolibri/tooltip-align-a1e0f931.js +4 -0
- package/dist/kolibri/{validation-506928e9.js → validation-c78bf25b.js} +1 -1
- package/dist/kolibri/validation-edd7dd57.js +4 -0
- package/jest-test-results.json +1 -1
- package/package.json +1 -1
- package/dist/cjs/align-9e535cd3.js +0 -4
- package/dist/cjs/has-closer-8ef0053a.js +0 -4
- package/dist/cjs/hide-label-446ae8ed.js +0 -4
- package/dist/cjs/image-source-46c66acc.js +0 -4
- package/dist/cjs/open-ac9f80a5.js +0 -4
- package/dist/cjs/rows-adb589f4.js +0 -4
- package/dist/cjs/show-a96164f1.js +0 -4
- package/dist/cjs/tooltip-align-f6084a9c.js +0 -4
- package/dist/esm/app-globals-d3c4b38e.js +0 -4
- package/dist/esm/validation-eb464d50.js +0 -4
- package/dist/kolibri/align-96c1f990.js +0 -4
- package/dist/kolibri/app-globals-d3c4b38e.js +0 -4
- package/dist/kolibri/devtools-3a887392.js +0 -4
- package/dist/kolibri/has-closer-fd018dc5.js +0 -4
- package/dist/kolibri/hide-label-dd9b83d5.js +0 -4
- package/dist/kolibri/image-source-84a695dd.js +0 -4
- package/dist/kolibri/label-cdf2126a.js +0 -4
- package/dist/kolibri/open-46e62bc3.js +0 -4
- package/dist/kolibri/prop.validators-e3efc9be.js +0 -4
- package/dist/kolibri/rows-8e1f2d42.js +0 -4
- package/dist/kolibri/show-820a9a22.js +0 -4
- package/dist/kolibri/tab-index-9c10594d.js +0 -4
- package/dist/kolibri/tooltip-align-b91851a6.js +0 -4
- package/dist/kolibri/validation-eb464d50.js +0 -4
- /package/dist/kolibri/{a11y.tipps-8ac27a12.js.map → a11y.tipps-32ec681c.js.map} +0 -0
- /package/dist/kolibri/{align-96c1f990.js.map → align-91ae6977.js.map} +0 -0
- /package/dist/kolibri/{alignment-313f7fef.js.map → alignment-6e474722.js.map} +0 -0
- /package/dist/kolibri/{alternative-button-link-role-2448c7aa.js.map → alternative-button-link-role-6e251523.js.map} +0 -0
- /package/dist/kolibri/{associated.controller-2e4854aa.js.map → associated.controller-e8585dfb.js.map} +0 -0
- /package/dist/kolibri/{color-994bf163.js.map → color-74eac985.js.map} +0 -0
- /package/dist/kolibri/{controller-bc00373d.js.map → controller-155cfee3.js.map} +0 -0
- /package/dist/kolibri/{controller-8eb319c8.js.map → controller-928905f0.js.map} +0 -0
- /package/dist/kolibri/{controller-68f34456.js.map → controller-a6ffee27.js.map} +0 -0
- /package/dist/kolibri/{controller-6853d800.js.map → controller-ae7d4a77.js.map} +0 -0
- /package/dist/kolibri/{controller-6ab1cb06.js.map → controller-c233edf4.js.map} +0 -0
- /package/dist/kolibri/{controller-icon-5fe19121.js.map → controller-icon-09e55d92.js.map} +0 -0
- /package/dist/kolibri/{custom-class-59057e96.js.map → custom-class-fb88922a.js.map} +0 -0
- /package/dist/kolibri/{has-closer-fd018dc5.js.map → has-closer-9bb2d802.js.map} +0 -0
- /package/dist/kolibri/{hide-label-dd9b83d5.js.map → hide-label-59320a79.js.map} +0 -0
- /package/dist/kolibri/{i18n-4753a22f.js.map → i18n-2d630bd4.js.map} +0 -0
- /package/dist/kolibri/{icon-30b99a49.js.map → icon-e9f19388.js.map} +0 -0
- /package/dist/kolibri/{image-source-84a695dd.js.map → image-source-cdcbea01.js.map} +0 -0
- /package/dist/kolibri/{label-cdf2126a.js.map → label-671155b8.js.map} +0 -0
- /package/dist/kolibri/{open-46e62bc3.js.map → open-23d53249.js.map} +0 -0
- /package/dist/kolibri/{prop.validators-e3efc9be.js.map → prop.validators-e8e7611e.js.map} +0 -0
- /package/dist/kolibri/{rows-8e1f2d42.js.map → rows-c15196b5.js.map} +0 -0
- /package/dist/kolibri/{show-820a9a22.js.map → show-8e8d6f73.js.map} +0 -0
- /package/dist/kolibri/{suggestions-c6fb713f.js.map → suggestions-748f987c.js.map} +0 -0
- /package/dist/kolibri/{tooltip-align-b91851a6.js.map → tooltip-align-a1e0f931.js.map} +0 -0
- /package/dist/kolibri/{validation-506928e9.js.map → validation-c78bf25b.js.map} +0 -0
- /package/dist/kolibri/{validation-eb464d50.js.map → validation-edd7dd57.js.map} +0 -0
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* KoliBri - The accessible HTML-Standard
|
|
3
3
|
*/
|
|
4
|
-
import{h as t,H as e,r as i,g as a}from"./index-e27342ee.js";import{n as s}from"./dev.utils-
|
|
4
|
+
import{h as t,H as e,r as i,g as a}from"./index-e27342ee.js";import{n as s}from"./dev.utils-15468eab.js";import{s as n,t as l}from"./events-2bb1065b.js";import{a as o}from"./reuse-3698e2f5.js";import{g as d}from"./controller-928905f0.js";import{d as r,a as p}from"./prop.validators-e8e7611e.js";import{I as h}from"./controller-icon-09e55d92.js";import"./label-671155b8.js";import"./a11y.tipps-32ec681c.js";import"./tab-index-a166ca52.js";import"./associated.controller-e8585dfb.js";import"./hide-label-59320a79.js";import"./index-d49940eb.js";import"./icon-e9f19388.js";class u extends h{constructor(t,e,i){super(t,e,i),this.component=t}validateAccept(t){r(this.component,"_accept",t)}validateMultiple(t){p(this.component,"_multiple",t)}validateRequired(t){p(this.component,"_required",t)}validateValue(t){r(this.component,"_value",t),this.setFormAssociatedValue(this.component._value)}componentWillLoad(){super.componentWillLoad(),this.validateAccept(this.component._accept),this.validateMultiple(this.component._multiple),this.validateRequired(this.component._required),this.validateValue(this.component._value)}}const c=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.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:'*'}label input[type='file']::-webkit-file-upload-button{display:none}label input[type='file']:before{content:'Datei auswählen'}label input[multiple]:before{content:'Dateien auswählen'}div.input{cursor:pointer}",f=class{render(){const{ariaDescribedBy:i}=d(this.state),a=!1===this.state._label;return t(e,null,t("kol-input",{class:{file:!0,"hide-label":!!this.state._hideLabel},_disabled:this.state._disabled,_error:this.state._error,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icon:this.state._icon,_id:this.state._id,_required:this.state._required,_smartButton:this.state._smartButton,_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",null):this.state._label),t("div",{slot:"input"},t("input",Object.assign({ref:this.catchRef,title:"",accept:this.state._accept,accessKey:this.state._accessKey,"aria-describedby":i.length>0?i.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,spellcheck:"false",type:"file",value:this.state._value},this.controller.onFacade,{onChange:this.onChange})),t("kol-tooltip-wc",{"aria-hidden":"true",class:"input-tooltip",hidden:a||!this.state._hideLabel,_align:this._tooltipAlign,_label:"string"==typeof this.state._label?this.state._label:""}))))}constructor(t){i(this,t),this.catchRef=t=>{this.ref=t,o(this.host,this.ref)},this.onChange=t=>{var e;if(this.ref instanceof HTMLInputElement&&"file"===this.ref.type){const i=this.ref.files;n(t),l("change",this.host,i),this.controller.setFormAssociatedValue(i),"function"==typeof(null===(e=this.state._on)||void 0===e?void 0:e.onChange)&&this.state._on.onChange(t,i)}},this._accept=void 0,this._accessKey=void 0,this._alert=!0,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._label=void 0,this._multiple=void 0,this._name=void 0,this._on=void 0,this._required=void 0,this._smartButton=void 0,this._syncValueBySelector=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._touched=!1,this._value=void 0,this.state={_id:`id-${s()}`,_label:!1},this.controller=new u(this,"input-file",this.host)}validateAccept(t){this.controller.validateAccept(t)}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAlert(t){this.controller.validateAlert(t)}validateDisabled(t){this.controller.validateDisabled(t)}validateError(t){this.controller.validateError(t)}validateHideLabel(t){this.controller.validateHideLabel(t)}validateHint(t){this.controller.validateHint(t)}validateIcon(t){this.controller.validateIcon(t)}validateId(t){this.controller.validateId(t)}validateLabel(t){this.controller.validateLabel(t)}validateMultiple(t){this.controller.validateMultiple(t)}validateName(t){this.controller.validateName(t)}validateOn(t){this.controller.validateOn(t)}validateRequired(t){this.controller.validateRequired(t)}validateSmartButton(t){this.controller.validateSmartButton(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()}get host(){return a(this)}static get watchers(){return{_accept:["validateAccept"],_accessKey:["validateAccessKey"],_alert:["validateAlert"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_label:["validateLabel"],_multiple:["validateMultiple"],_name:["validateName"],_on:["validateOn"],_required:["validateRequired"],_smartButton:["validateSmartButton"],_syncValueBySelector:["validateSyncValueBySelector"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};f.style={default:c};export{f as kol_input_file};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* KoliBri - The accessible HTML-Standard
|
|
3
3
|
*/
|
|
4
|
-
import{h as t,H as e,r as i,g as s}from"./index-e27342ee.js";import{n as a}from"./dev.utils-
|
|
4
|
+
import{h as t,H as e,r as i,g as s}from"./index-e27342ee.js";import{n as a}from"./dev.utils-15468eab.js";import{a as n}from"./reuse-3698e2f5.js";import{p as l}from"./controller-ae7d4a77.js";import{g as d}from"./controller-928905f0.js";import{v as o}from"./suggestions-748f987c.js";import{w as h,d as r,a as p,e as u}from"./prop.validators-e8e7611e.js";import{I as c}from"./controller-icon-09e55d92.js";import"./a11y.tipps-32ec681c.js";import"./label-671155b8.js";import"./events-2bb1065b.js";import"./tab-index-a166ca52.js";import"./associated.controller-e8585dfb.js";import"./hide-label-59320a79.js";import"./index-d49940eb.js";import"./icon-e9f19388.js";class f extends c{constructor(t,e,i){super(t,e,i),this.numberOrIsoDateRegex=/^\d+$|(^\d{4}-([0]\d|1[0-2])-([0-2]\d|3[01])([T ][0-2]\d:[0-5]\d:[0-5]\d(?:\.\d+)?([+-][0-2]\d:[0-5]\d|Z)?)?$)|(^[0-2]\d:[0-5]\d(:[0-5]\d)?$)/,this.parseToString=t=>"string"==typeof t?t:"number"==typeof t?`${t}`:"object"==typeof t&&t instanceof Date?t.toISOString():"",this.validateIso8601=(t,e,i)=>{const a=parseFloat(e),s=a==e;return h(this.component,t,(t=>void 0===t||""===t||s&&"number"==typeof a||this.numberOrIsoDateRegex.test(t)),new Set(["number","Date","string{ISO-8601}"]),this.parseToString(e),{hooks:{afterPatch:t=>{"string"==typeof t&&i&&i(t)}}})},this.component=t}validateAutoComplete(t){h(this.component,"_autoComplete",(t=>"string"==typeof t&&("on"===t||"off"===t)),new Set(["on | off"]),t)}validateList(){}validateSuggestions(t){o(this.component,t)}onChange(t){super.onChange(t),!!t.target.value!=!!this.component._value&&(this.component._value=t.target.value)}validateMax(t){this.validateIso8601("_max",t)}validateMin(t){this.validateIso8601("_min",t)}validatePlaceholder(t){r(this.component,"_placeholder",t)}validateReadOnly(t){p(this.component,"_readOnly",t)}validateRequired(t){p(this.component,"_required",t)}validateStep(t){u(this.component,"_step",t)}validateType(t){h(this.component,"_type",(t=>"string"==typeof t&&("date"===t||"datetime-local"===t||"month"===t||"number"===t||"time"===t||"week"===t)),new Set(["String {date, datetime-local, month, number, time, week}"]),t)}validateValue(t){this.validateValueEx(t)}validateValueEx(t,e){this.validateIso8601("_value",t,e),this.setFormAssociatedValue(this.component.state._value)}componentWillLoad(){super.componentWillLoad(),this.validateAutoComplete(this.component._autoComplete),this.validateMax(this.component._max),this.validateMin(this.component._min),this.validateSuggestions(this.component._suggestions||this.component._list),this.validatePlaceholder(this.component._placeholder),this.validateReadOnly(this.component._readOnly),this.validateRequired(this.component._required),this.validateStep(this.component._step),this.validateType(this.component._type),this.validateValue(this.component._value)}}const m=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.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:'*'}",v=class{render(){const{ariaDescribedBy:i}=d(this.state),a=Array.isArray(this.state._suggestions)&&this.state._suggestions.length>0,s=!1===this.state._label;return t(e,{class:{"has-value":this.state._hasValue}},t("kol-input",{class:{[this.state._type]:!0,"hide-label":!!this.state._hideLabel},_disabled:this.state._disabled,_error:this.state._error,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icon:this.state._icon,_id:this.state._id,_suggestions:this.state._suggestions,_readOnly:this.state._readOnly,_required:this.state._required,_smartButton:this.state._smartButton,_touched:this.state._touched},t("span",{slot:"label"},s?t("slot",null):this.state._label),t("div",{slot:"input"},t("input",Object.assign({ref:this.catchRef,title:"",accessKey:this.state._accessKey,"aria-describedby":i.length>0?i.join(" "):void 0,"aria-label":this.state._hideLabel&&"string"==typeof this.state._label?this.state._label:void 0,autoCapitalize:"off",autoComplete:this.state._autoComplete,autoCorrect:"off",disabled:this.state._disabled,id:this.state._id,list:a?`${this.state._id}-list`:void 0,max:this.state._max,min:this.state._min,name:this.state._name,readOnly:this.state._readOnly,required:this.state._required,placeholder:this.state._placeholder,step:this.state._step,spellcheck:"false",type:this.state._type,value:this.state._value},this.controller.onFacade,{onKeyUp:this.onKeyUp})),t("kol-tooltip-wc",{"aria-hidden":"true",class:"input-tooltip",hidden:s||!this.state._hideLabel,_align:this._tooltipAlign,_label:"string"==typeof this.state._label?this.state._label:""}))))}constructor(t){i(this,t),this.catchRef=t=>{this.ref=t,n(this.host,this.ref)},this.onKeyUp=t=>{"Enter"===t.code?l({form:this.host,ref:this.ref}):this.controller.onFacade.onChange(t)},this._accessKey=void 0,this._alert=!0,this._autoComplete=void 0,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._label=void 0,this._list=void 0,this._max=void 0,this._min=void 0,this._name=void 0,this._on=void 0,this._placeholder=void 0,this._readOnly=void 0,this._required=void 0,this._smartButton=void 0,this._suggestions=void 0,this._step=void 0,this._syncValueBySelector=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._touched=!1,this._type="number",this._value=void 0,this.state={_autoComplete:"off",_hasValue:!1,_id:`id-${a()}`,_label:!1,_suggestions:[],_type:"number"},this.controller=new f(this,"input-number",this.host)}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAlert(t){this.controller.validateAlert(t)}validateAutoComplete(t){this.controller.validateAutoComplete(t)}validateDisabled(t){this.controller.validateDisabled(t)}validateError(t){this.controller.validateError(t)}validateHideLabel(t){this.controller.validateHideLabel(t)}validateHint(t){this.controller.validateHint(t)}validateIcon(t){this.controller.validateIcon(t)}validateId(t){this.controller.validateId(t)}validateLabel(t){this.controller.validateLabel(t)}validateList(t){this.validateSuggestions(t)}validateMax(t){this.controller.validateMax(t)}validateMin(t){this.controller.validateMin(t)}validateName(t){this.controller.validateName(t)}validateOn(t){this.controller.validateOn(t)}validatePlaceholder(t){this.controller.validatePlaceholder(t)}validateReadOnly(t){this.controller.validateReadOnly(t)}validateRequired(t){this.controller.validateRequired(t)}validateSmartButton(t){this.controller.validateSmartButton(t)}validateSuggestions(t){this.controller.validateSuggestions(t)}validateStep(t){this.controller.validateStep(t)}validateSyncValueBySelector(t){this.controller.validateSyncValueBySelector(t)}validateTabIndex(t){this.controller.validateTabIndex(t)}validateTouched(t){this.controller.validateTouched(t)}validateType(t){this.controller.validateType(t)}validateValue(t){this.controller.validateValueEx(t,(t=>{""===t&&this.ref&&(this.ref.value="")}))}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.controller.componentWillLoad(),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"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_label:["validateLabel"],_list:["validateList"],_max:["validateMax"],_min:["validateMin"],_name:["validateName"],_on:["validateOn"],_placeholder:["validatePlaceholder"],_readOnly:["validateReadOnly"],_required:["validateRequired"],_smartButton:["validateSmartButton"],_suggestions:["validateSuggestions"],_step:["validateStep"],_syncValueBySelector:["validateSyncValueBySelector"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_type:["validateType"],_value:["validateValue"]}}};v.style={default:m};export{v as kol_input_number};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* KoliBri - The accessible HTML-Standard
|
|
3
3
|
*/
|
|
4
|
-
import{h as t,H as e,r as i,g as a}from"./index-e27342ee.js";import{d as s}from"./a11y.tipps-
|
|
4
|
+
import{h as t,H as e,r as i,g as a}from"./index-e27342ee.js";import{d as s}from"./a11y.tipps-32ec681c.js";import{n}from"./dev.utils-15468eab.js";import{s as l}from"./prop.validators-e8e7611e.js";import{a as o}from"./reuse-3698e2f5.js";import{p as d}from"./controller-ae7d4a77.js";import{g as r}from"./controller-928905f0.js";import{I as h}from"./controller-155cfee3.js";import"./index-d49940eb.js";import"./label-671155b8.js";import"./events-2bb1065b.js";import"./tab-index-a166ca52.js";import"./associated.controller-e8585dfb.js";import"./hide-label-59320a79.js";import"./controller-icon-09e55d92.js";import"./icon-e9f19388.js";const p=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.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:'*'}",u=class{render(){const{ariaDescribedBy:a}=r(this.state),i=!1===this.state._label;return t(e,{class:{"has-value":this.state._hasValue}},t("kol-input",{class:{"hide-label":!!this.state._hideLabel,password:!0},_currentLength:this.state._currentLength,_disabled:this.state._disabled,_error:this.state._error,_hasCounter:this.state._hasCounter,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icon:this.state._icon,_id:this.state._id,_maxLength:this.state._maxLength,_readOnly:this.state._readOnly,_required:this.state._required,_smartButton:this.state._smartButton,_touched:this.state._touched,onClick:()=>{var t;return null===(t=this.ref)||void 0===t?void 0:t.focus()}},t("span",{slot:"label"},i?t("slot",null):this.state._label),t("div",{slot:"input"},t("input",Object.assign({ref:this.catchRef,title:"",accessKey:this.state._accessKey,"aria-describedby":a.length>0?a.join(" "):void 0,"aria-label":this.state._hideLabel&&"string"==typeof this.state._label?this.state._label:void 0,autoCapitalize:"off",autoComplete:this.state._autoComplete,autoCorrect:"off",disabled:this.state._disabled,id:this.state._id,maxlength:this.state._maxLength,name:this.state._name,pattern:this.state._pattern,placeholder:this.state._placeholder,readOnly:this.state._readOnly,required:this.state._required,size:this.state._size,spellcheck:"false",type:"password",value:this.state._value},this.controller.onFacade,{onKeyUp:this.onKeyUp})),t("kol-tooltip-wc",{"aria-hidden":"true",class:"input-tooltip",hidden:i||!this.state._hideLabel,_align:this._tooltipAlign,_label:"string"==typeof this.state._label?this.state._label:""}))))}constructor(t){i(this,t),this.catchRef=t=>{this.ref=t,o(this.host,this.ref)},this.onKeyUp=t=>{l(this,"_currentLength",t.target.value.length),"Enter"===t.code?d({form:this.host,ref:this.ref}):this.controller.onFacade.onChange(t)},this._accessKey=void 0,this._alert=!0,this._autoComplete=void 0,this._disabled=void 0,this._error=void 0,this._hasCounter=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._label=void 0,this._maxLength=void 0,this._name=void 0,this._on=void 0,this._pattern=void 0,this._placeholder=void 0,this._readOnly=void 0,this._required=void 0,this._size=void 0,this._smartButton=void 0,this._syncValueBySelector=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._touched=!1,this._value=void 0,this.state={_autoComplete:"off",_currentLength:0,_id:`id-${n()}`,_label:!1,_hasValue:!1},this.controller=new h(this,"input-password",this.host)}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAlert(t){this.controller.validateAlert(t)}validateAutoComplete(t){this.controller.validateAutoComplete(t),"on"===t&&s("[KolInputPassword] Die Option 'autocomplete' sollte bei einem Passwort-Eingabefeld nicht auf \"on\" gesetzt werden.")}validateDisabled(t){this.controller.validateDisabled(t)}validateError(t){this.controller.validateError(t)}validateHasCounter(t){this.controller.validateHasCounter(t)}validateHideLabel(t){this.controller.validateHideLabel(t)}validateHint(t){this.controller.validateHint(t)}validateIcon(t){this.controller.validateIcon(t)}validateId(t){this.controller.validateId(t)}validateLabel(t){this.controller.validateLabel(t)}validateMaxLength(t){this.controller.validateMaxLength(t)}validateName(t){this.controller.validateName(t)}validateOn(t){this.controller.validateOn(t)}validatePattern(t){this.controller.validatePattern(t)}validatePlaceholder(t){this.controller.validatePlaceholder(t)}validateReadOnly(t){this.controller.validateReadOnly(t)}validateRequired(t){this.controller.validateRequired(t)}validateSize(t){this.controller.validateSize(t)}validateSmartButton(t){this.controller.validateSmartButton(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.state._hasValue=!!this.state._value,this.controller.addValueChangeListener((t=>this.state._hasValue=!!t))}get host(){return a(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_error:["validateError"],_hasCounter:["validateHasCounter"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_label:["validateLabel"],_maxLength:["validateMaxLength"],_name:["validateName"],_on:["validateOn"],_pattern:["validatePattern"],_placeholder:["validatePlaceholder"],_readOnly:["validateReadOnly"],_required:["validateRequired"],_size:["validateSize"],_smartButton:["validateSmartButton"],_syncValueBySelector:["validateSyncValueBySelector"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};u.style={default:p};export{u as kol_input_password};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* KoliBri - The accessible HTML-Standard
|
|
3
3
|
*/
|
|
4
|
-
import{r as e,h as i}from"./index-e27342ee.js";import{e as t}from"./a11y.tipps-
|
|
4
|
+
import{r as e,h as i}from"./index-e27342ee.js";import{e as t}from"./a11y.tipps-32ec681c.js";import"./dev.utils-15468eab.js";import"./reuse-3698e2f5.js";const n=class{constructor(i){e(this,i),this._accessKey=void 0,this._alert=!0,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._id=void 0,this._label=void 0,this._list=void 0,this._name=void 0,this._on=void 0,this._orientation="vertical",this._required=void 0,this._tabIndex=void 0,this._touched=!1,this._value=void 0}render(){return t("[KolInputRadioGroup] Die Komponenten Input-Radio-Group und Input-Radio werden zur Komponente Input-Radio zusammengeführt. Wir empfehlen den Tag <kol-input-radio> statt <kol-input-radio-group> zu verwenden.\n\nMit der Version 1.1 wird die Komponente KolInputRadioGroup aus der Bibliothek entfernt."),i("kol-input-radio",{_accessKey:this._accessKey,_disabled:this._disabled,_error:this._error,_hideLabel:this._hideLabel,_id:this._id,_label:this._label,_list:this._list,_name:this._name,_on:this._on,_orientation:this._orientation,_required:this._required,_tabIndex:this._tabIndex,_touched:this._touched,_value:this._value},i("slot",null))}};export{n as kol_input_radio_group};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* KoliBri - The accessible HTML-Standard
|
|
3
3
|
*/
|
|
4
|
-
import{h as t,H as e,r as i,g as a}from"./index-e27342ee.js";import{n}from"./dev.utils-
|
|
4
|
+
import{h as t,H as e,r as i,g as a}from"./index-e27342ee.js";import{n}from"./dev.utils-15468eab.js";import{s,t as r}from"./events-2bb1065b.js";import{a as l}from"./reuse-3698e2f5.js";import{g as d}from"./controller-928905f0.js";import{a as o}from"./controller-c233edf4.js";import"./prop.validators-e8e7611e.js";import"./a11y.tipps-32ec681c.js";import"./index-d49940eb.js";import"./label-671155b8.js";import"./tab-index-a166ca52.js";import"./associated.controller-e8585dfb.js";import"./hide-label-59320a79.js";const h=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.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}:host{--border-width:2px;--input-size:1.5em}kol-input .icons{display:none}label{cursor:pointer}input{appearance:none;border-width:var(--border-width);border-style:solid;border-radius:100%;cursor:pointer;display:flex;height:var(--input-size);margin:0;min-height:var(--input-size);min-width:var(--input-size);padding:0;width:var(--input-size)}input:before{border-radius:100%;content:'';margin:auto;height:calc(var(--input-size) / 2);width:calc(var(--input-size) / 2)}input:checked:before{background-color:#000}fieldset{display:flex}fieldset.vertical{flex-direction:column}fieldset .input-slot{align-items:center;display:flex}.required label>span::after{content:''}",p=class{render(){const{ariaDescribedBy:i,hasError:a}=d(this.state),l=!1===this.state._label;return t(e,null,t("fieldset",{class:{disabled:!0===this.state._disabled,error:!0===a,required:!0===this.state._required,[this.state._orientation]:!0}},t("legend",{class:"block w-full mb-1 leading-normal"},t("span",null,t("span",{slot:"label"},l?t("slot",null):this.state._label))),this.state._options.map(((e,a)=>{const s=`${this.state._id}-${a}`,o=`radio-${a}`;return t("kol-input",{class:"radio",key:s,_disabled:this.state._disabled||e.disabled,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_id:s,_renderNoLabel:!0,_required:this.state._required,_slotName:o,_touched:this.state._touched},t("div",{slot:o},t("input",Object.assign({ref:this.state._value===e.value?this.catchRef:void 0,title:"",accessKey:this.state._accessKey,"aria-describedby":i.length>0?i.join(" "):void 0,"aria-label":this.state._hideLabel&&"string"==typeof e.label?e.label:void 0,type:"radio",id:s,checked:this.state._value===e.value,name:this.state._name||this.state._id,disabled:this.state._disabled||e.disabled,required:this.state._required,tabIndex:this.state._tabIndex,value:`-${a}`},this.controller.onFacade,{onChange:this.onChange,onClick:void 0})),t("kol-tooltip-wc",{"aria-hidden":"true",class:"input-tooltip",hidden:l||!this.state._hideLabel,_label:"string"==typeof this.state._label?this.state._label:""}),t("label",{htmlFor:`${s}`,style:{height:this.state._hideLabel&&!0!==this.state._required?"0":void 0,margin:this.state._hideLabel&&!0!==this.state._required?"0":void 0,padding:this.state._hideLabel&&!0!==this.state._required?"0":void 0,visibility:this.state._hideLabel&&!0!==this.state._required?"hidden":void 0}},t("span",null,t("span",null,e.label)))))})),a&&t("kol-alert",{id:"error",_alert:!0,_type:"error",_variant:"msg"},this.state._error)))}constructor(t){i(this,t),this.catchRef=t=>{this.ref=t,l(this.host,this.ref)},this.onChange=t=>{var e;if(t.target instanceof HTMLInputElement){const i=this.controller.getOptionByKey(t.target.value);void 0!==i&&(s(t),r("change",this.host,i.value),this.controller.setFormAssociatedValue(i.value),"function"==typeof(null===(e=this.state._on)||void 0===e?void 0:e.onChange)&&this.state._on.onChange(t,i.value),this.controller.setValue(t,i.value))}},this._accessKey=void 0,this._alert=!0,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._id=void 0,this._label=void 0,this._list=void 0,this._name=void 0,this._on=void 0,this._options=void 0,this._orientation="vertical",this._required=void 0,this._syncValueBySelector=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._touched=!1,this._value=void 0,this.state={_id:`id-${n()}`,_label:!1,_options:[],_orientation:"vertical"},this.controller=new o(this,"input-radio",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)}validateHideLabel(t){this.controller.validateHideLabel(t)}validateHint(t){this.controller.validateHint(t)}validateId(t){this.controller.validateId(t)}validateLabel(t){this.controller.validateLabel(t)}validateList(t){this.validateOptions(t)}validateName(t){this.controller.validateName(t)}validateOn(t){this.controller.validateOn(t)}validateOptions(t){this.controller.validateOptions(t)}validateOrientation(t){this.controller.validateOrientation(t)}validateRequired(t){this.controller.validateRequired(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)}get host(){return a(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_id:["validateId"],_label:["validateLabel"],_list:["validateList"],_name:["validateName"],_on:["validateOn"],_options:["validateOptions"],_orientation:["validateOrientation"],_required:["validateRequired"],_syncValueBySelector:["validateSyncValueBySelector"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};p.style={default:h};export{p as kol_input_radio};
|
|
@@ -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-e27342ee.js";import{n as a}from"./dev.utils-
|
|
4
|
+
import{h as t,H as i,r as e,g as s}from"./index-e27342ee.js";import{n as a}from"./dev.utils-15468eab.js";import{a as n}from"./reuse-3698e2f5.js";import{p as o}from"./controller-ae7d4a77.js";import{g as l}from"./controller-928905f0.js";import{v as r}from"./suggestions-748f987c.js";import{w as d,e as h}from"./prop.validators-e8e7611e.js";import{I as p}from"./controller-icon-09e55d92.js";import"./a11y.tipps-32ec681c.js";import"./label-671155b8.js";import"./events-2bb1065b.js";import"./tab-index-a166ca52.js";import"./associated.controller-e8585dfb.js";import"./hide-label-59320a79.js";import"./index-d49940eb.js";import"./icon-e9f19388.js";class u extends p{constructor(t,e,i){super(t,e,i),this.component=t}validateAutoComplete(t){d(this.component,"_autoComplete",(t=>"string"==typeof t&&("on"===t||"off"===t)),new Set(["on | off"]),t)}validateList(t){Array.isArray(t)&&this.validateSuggestions(t.map((t=>t.value)))}validateMax(t){h(this.component,"_max",t)}validateMin(t){h(this.component,"_min",t)}validateStep(t){h(this.component,"_step",t)}validateSuggestions(t){r(this.component,t)}validateValue(t){h(this.component,"_value",t),this.setFormAssociatedValue(this.component.state._value)}componentWillLoad(){super.componentWillLoad(),this.validateAutoComplete(this.component._autoComplete),this.validateList(this.component._list),this.validateMax(this.component._max),this.validateMin(this.component._min),this.validateStep(this.component._step),this.validateSuggestions(this.component._suggestions),this.validateValue(this.component._value)}}const c=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.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:'*'}.inputs-wrapper{align-items:center;display:flex;flex-direction:row}input[type='number']{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size);width:var(--kolibri-input-range--input-number--width)}input[type='range']{appearance:none;background-color:#d3d3d3;border:1px solid #000;display:inline-block;flex-grow:1;height:0.5rem;line-height:1.5em;padding:0;margin:0;width:0;}input[type='range']::-webkit-slider-thumb{box-sizing:border-box;background-color:#000;height:20px;width:20px;border-radius:20px;cursor:pointer;-webkit-appearance:none}input[type='range']::-moz-range-thumb{box-sizing:border-box;background-color:#000;height:20px;width:20px;border-radius:20px;cursor:pointer;-moz-appearance:none}",f=class{render(){const{ariaDescribedBy:e}=l(this.state),a=Array.isArray(this.state._suggestions)&&this.state._suggestions.length>0,s=!1===this.state._label;return t(i,null,t("kol-input",{class:{range:!0,"hide-label":!!this.state._hideLabel},_disabled:this.state._disabled,_error:this.state._error,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icon:this.state._icon,_id:this.state._id,_touched:this.state._touched},t("span",{slot:"label"},s?t("slot",null):this.state._label),t("div",{slot:"input"},t("div",{class:"inputs-wrapper",style:{"--kolibri-input-range--input-number--width":`${this.state._max}`.length+.5+"em"}},t("input",Object.assign({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",autoComplete:this.state._autoComplete,autoCorrect:"off",disabled:this.state._disabled,list:a?`${this.state._id}-list`:void 0,max:this.state._max,min:this.state._min,name:this.state._name?`${this.state._name}-range`:void 0,spellcheck:"false",step:this.state._step,tabIndex:-1,type:"range",value:this.state._value},this.controller.onFacade,{onChange:this.onChange})),t("input",Object.assign({ref:this.catchInputNumberRef,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",autoComplete:this.state._autoComplete,autoCorrect:"off",disabled:this.state._disabled,id:this.state._id,list:a?`${this.state._id}-list`:void 0,max:this.state._max,min:this.state._min,name:this.state._name?`${this.state._name}-number`:void 0,step:this.state._step,type:"number",value:this.state._value},this.controller.onFacade,{onKeyUp:this.onKeyUp,onChange:this.onChange})),t("kol-tooltip-wc",{"aria-hidden":"true",class:"input-tooltip",hidden:s||!this.state._hideLabel,_align:this._tooltipAlign,_label:"string"==typeof this.state._label?this.state._label:""})),a&&[t("datalist",{id:`${this.state._id}-list`},this.state._suggestions.map((e=>t("option",{value:e}))))])))}constructor(t){e(this,t),this.catchInputNumberRef=t=>{var e;t&&(this.ref=t,n(this.host,t),!this._value&&(null===(e=this.ref)||void 0===e?void 0:e.value)&&this.validateValue(parseFloat(this.ref.value)))},this.onChange=t=>{var e,i;let a=parseFloat(t.target.value);this.state._max&&a>this.state._max&&(a=this.state._max),this.state._min&&a<this.state._min&&(a=this.state._min),this.validateValue(a),"function"==typeof(null===(e=this.state._on)||void 0===e?void 0:e.onChange)&&(null===(i=this.state._on)||void 0===i||i.onChange(t,a))},this.onKeyUp=t=>{"Enter"===t.code?o({form:this.host,ref:this.ref}):this.onChange(t)},this._accessKey=void 0,this._alert=!0,this._autoComplete=void 0,this._disabled=void 0,this._error=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._label=void 0,this._list=void 0,this._max=void 0,this._min=void 0,this._name=void 0,this._on=void 0,this._step=void 0,this._suggestions=void 0,this._syncValueBySelector=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._touched=!1,this._value=void 0,this.state={_autoComplete:"off",_id:`id-${a()}`,_label:!1,_suggestions:[]},this.controller=new u(this,"input-range",this.host)}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAlert(t){this.controller.validateAlert(t)}validateAutoComplete(t){this.controller.validateAutoComplete(t)}validateDisabled(t){this.controller.validateDisabled(t)}validateError(t){this.controller.validateError(t)}validateHideLabel(t){this.controller.validateHideLabel(t)}validateHint(t){this.controller.validateHint(t)}validateIcon(t){this.controller.validateIcon(t)}validateId(t){this.controller.validateId(t)}validateLabel(t){this.controller.validateLabel(t)}validateList(t){this.controller.validateList(t)}validateMax(t){this.controller.validateMax(t)}validateMin(t){this.controller.validateMin(t)}validateName(t){this.controller.validateName(t)}validateOn(t){this.controller.validateOn(t)}validateStep(t){this.controller.validateStep(t)}validateSuggestions(t){this.controller.validateSuggestions(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()}get host(){return s(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_error:["validateError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_label:["validateLabel"],_list:["validateList"],_max:["validateMax"],_min:["validateMin"],_name:["validateName"],_on:["validateOn"],_step:["validateStep"],_suggestions:["validateSuggestions"],_syncValueBySelector:["validateSyncValueBySelector"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};f.style={default:c};export{f as kol_input_range};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* KoliBri - The accessible HTML-Standard
|
|
3
3
|
*/
|
|
4
|
-
import{h as t,H as e,r as i,g as a}from"./index-e27342ee.js";import{a as s,s as n}from"./prop.validators-
|
|
4
|
+
import{h as t,H as e,r as i,g as a}from"./index-e27342ee.js";import{a as s,s as n}from"./prop.validators-e8e7611e.js";import{f as l}from"./a11y.tipps-32ec681c.js";import{n as o}from"./dev.utils-15468eab.js";import{a as d}from"./reuse-3698e2f5.js";import{p as r}from"./controller-ae7d4a77.js";import{g as h}from"./controller-928905f0.js";import{a as u}from"./controller-a6ffee27.js";import"./index-d49940eb.js";import"./label-671155b8.js";import"./events-2bb1065b.js";import"./tab-index-a166ca52.js";import"./associated.controller-e8585dfb.js";import"./hide-label-59320a79.js";import"./controller-155cfee3.js";import"./controller-icon-09e55d92.js";import"./icon-e9f19388.js";import"./suggestions-748f987c.js";const p=(t,e)=>{s(t,"_alert",e)},c=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}.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:'*'}";l("[KolInputText] Pre- und post-Label für Währung usw.");const f=class{render(){const{ariaDescribedBy:i}=h(this.state),a=Array.isArray(this.state._suggestions)&&this.state._suggestions.length>0,s=!1===this.state._label;return t(e,{class:{"has-value":this.state._hasValue}},t("kol-input",{class:{[this.state._type]:!0,"hide-label":!!this.state._hideLabel},_currentLength:this.state._currentLength,_disabled:this.state._disabled,_error:this.state._error,_hasCounter:this.state._hasCounter,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icon:this.state._icon,_id:this.state._id,_suggestions:this.state._suggestions,_maxLength:this.state._maxLength,_readOnly:this.state._readOnly,_required:this.state._required,_smartButton:this.state._smartButton,_touched:this.state._touched,onClick:()=>{var t;return null===(t=this.ref)||void 0===t?void 0:t.focus()}},t("span",{slot:"label"},s?t("slot",null):this.state._label),t("div",{slot:"input"},t("input",Object.assign({ref:this.catchRef,title:"",accessKey:this.state._accessKey,"aria-describedby":i.length>0?i.join(" "):void 0,"aria-label":this.state._hideLabel&&"string"==typeof this.state._label?this.state._label:void 0,autoCapitalize:"off",autoComplete:this.state._autoComplete,autoCorrect:"off",disabled:this.state._disabled,id:this.state._id,list:a?`${this.state._id}-list`:void 0,maxlength:this.state._maxLength,name:this.state._name,pattern:this.state._pattern,placeholder:this.state._placeholder,readOnly:this.state._readOnly,required:this.state._required,size:this.state._size,spellcheck:"false",type:this.state._type,value:this.state._value},this.controller.onFacade,{onKeyUp:this.onKeyUp})),t("kol-tooltip-wc",{"aria-hidden":"true",class:"input-tooltip",hidden:s||!this.state._hideLabel,_align:this._tooltipAlign,_label:"string"==typeof this.state._label?this.state._label:""}))))}constructor(t){i(this,t),this.catchRef=t=>{var e;this.ref=t,d(this.host,this.ref),this.disconnectedCallback(),null===(e=this.ref)||void 0===e||e.addEventListener("search",this.onChange)},this.onKeyUp=t=>{n(this,"_currentLength",t.target.value.length),"Enter"===t.code||"NumpadEnter"===t.code?r({form:this.host,ref:this.ref}):this.onChange(t)},this.onChange=t=>{var e,i;this.oldValue!==(null===(e=this.ref)||void 0===e?void 0:e.value)&&(this.oldValue=null===(i=this.ref)||void 0===i?void 0:i.value,this.controller.onFacade.onChange(t))},this._accessKey=void 0,this._alert=!0,this._autoComplete=void 0,this._disabled=void 0,this._error=void 0,this._hasCounter=void 0,this._hideLabel=void 0,this._hint="",this._icon=void 0,this._id=void 0,this._label=void 0,this._list=void 0,this._maxLength=void 0,this._name=void 0,this._on=void 0,this._pattern=void 0,this._placeholder=void 0,this._readOnly=void 0,this._required=void 0,this._size=void 0,this._suggestions=void 0,this._smartButton=void 0,this._syncValueBySelector=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._touched=!1,this._type="text",this._value=void 0,this.state={_autoComplete:"off",_currentLength:0,_id:`id-${o()}`,_hasValue:!1,_label:!1,_suggestions:[],_type:"text"},this.controller=new u(this,"input-text",this.host)}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAlert(t){p(this,t)}validateAutoComplete(t){this.controller.validateAutoComplete(t)}validateDisabled(t){this.controller.validateDisabled(t)}validateError(t){this.controller.validateError(t)}validateHasCounter(t){this.controller.validateHasCounter(t)}validateHideLabel(t){this.controller.validateHideLabel(t)}validateHint(t){this.controller.validateHint(t)}validateIcon(t){this.controller.validateIcon(t)}validateId(t){this.controller.validateId(t)}validateLabel(t){this.controller.validateLabel(t)}validateList(t){this.validateSuggestions(t)}validateMaxLength(t){this.controller.validateMaxLength(t)}validateName(t){this.controller.validateName(t)}validateOn(t){this.controller.validateOn(t)}validatePattern(t){this.controller.validatePattern(t)}validatePlaceholder(t){this.controller.validatePlaceholder(t)}validateReadOnly(t){this.controller.validateReadOnly(t)}validateRequired(t){this.controller.validateRequired(t)}validateSize(t){this.controller.validateSize(t)}validateSuggestions(t){this.controller.validateSuggestions(t)}validateSmartButton(t){this.controller.validateSmartButton(t)}validateSyncValueBySelector(t){this.controller.validateSyncValueBySelector(t)}validateTabIndex(t){this.controller.validateTabIndex(t)}validateTouched(t){this.controller.validateTouched(t)}validateType(t){this.controller.validateType(t)}validateValue(t){this.controller.validateValue(t)}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.oldValue=this._value,this.controller.componentWillLoad(),this.state._hasValue=!!this.state._value,this.controller.addValueChangeListener((t=>this.state._hasValue=!!t))}disconnectedCallback(){var t;null===(t=this.ref)||void 0===t||t.removeEventListener("search",this.onChange)}get host(){return a(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_error:["validateError"],_hasCounter:["validateHasCounter"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icon:["validateIcon"],_id:["validateId"],_label:["validateLabel"],_list:["validateList"],_maxLength:["validateMaxLength"],_name:["validateName"],_on:["validateOn"],_pattern:["validatePattern"],_placeholder:["validatePlaceholder"],_readOnly:["validateReadOnly"],_required:["validateRequired"],_size:["validateSize"],_suggestions:["validateSuggestions"],_smartButton:["validateSmartButton"],_syncValueBySelector:["validateSyncValueBySelector"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_type:["validateType"],_value:["validateValue"]}}};f.style={default:c};export{f as kol_input_text};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* KoliBri - The accessible HTML-Standard
|
|
3
3
|
*/
|
|
4
|
-
import{r as i,h as t,F as s,H as e,g as h}from"./index-e27342ee.js";import{a}from"./i18n-
|
|
4
|
+
import{r as i,h as t,F as s,H as e,g as h}from"./index-e27342ee.js";import{a as l}from"./i18n-2d630bd4.js";import{h as o}from"./reuse-3698e2f5.js";import"./index-42a84baa.js";import"./index-d49940eb.js";import"./a11y.tipps-32ec681c.js";import"./dev.utils-15468eab.js";const a=class{constructor(t){i(this,t),this.slotName="input",this.catchInputSlot=t=>{o(this.host,t,this.slotName)},this._alert=!0,this._currentLength=void 0,this._disabled=!1,this._error="",this._hasCounter=void 0,this._hideLabel=!1,this._hint="",this._icon=void 0,this._id=void 0,this._maxLength=void 0,this._readOnly=!1,this._renderNoLabel=!1,this._required=!1,this._slotName=void 0,this._suggestions=void 0,this._smartButton=void 0,this._touched=!1}componentWillRender(){this.slotName=this._slotName?this._slotName:"input"}render(){var i,o,h,a;const r="string"==typeof this._error&&this._error.length>0&&!0===this._touched,n="string"==typeof this._hint&&this._hint.length>0;return t(e,{class:{disabled:!0===this._disabled,error:!0===r,"read-only":!0===this._readOnly,required:!0===this._required,touched:!0===this._touched}},!1===this._renderNoLabel&&t("label",{id:`${this._id}-label`,hidden:this._hideLabel,htmlFor:this._id},t("span",null,t("slot",{name:"label"}))),n&&t("span",{class:"hint",id:`${this._id}-hint`},this._hint),t("div",{class:{input:!0,"icon-left":"object"==typeof(null===(i=this._icon)||void 0===i?void 0:i.left),"icon-right":"object"==typeof(null===(o=this._icon)||void 0===o?void 0:o.right)}},(null===(h=this._icon)||void 0===h?void 0:h.left)&&t("kol-icon",{_ariaLabel:"",_icon:this._icon.left.icon}),t("div",{ref:this.catchInputSlot,id:this.slotName,class:"input-slot"}),"object"==typeof this._smartButton&&null!==this._smartButton&&t("kol-button-wc",{_customClass:this._smartButton._customClass,_disabled:this._smartButton._disabled,_icon:this._smartButton._icon,_hideLabel:!0,_id:this._smartButton._id,_label:this._smartButton._label,_on:this._smartButton._on,_tooltipAlign:this._smartButton._tooltipAlign,_variant:this._smartButton._variant}),(null===(a=this._icon)||void 0===a?void 0:a.right)&&t("kol-icon",{_ariaLabel:"",_icon:this._icon.right.icon})),r&&t("kol-alert",{class:"error",id:`${this._id}-error`,_alert:this._alert,_type:"error",_variant:"msg"},this._error),Array.isArray(this._suggestions)&&this._suggestions.length>0&&t("datalist",{id:`${this._id}-list`},this._suggestions.map((i=>t("option",{value:i})))),this._hasCounter&&t("span",{class:"counter","aria-atomic":"true","aria-live":"polite"},this._currentLength,this._maxLength&&t(s,null,t("span",{"aria-label":l("kol-of"),role:"img"},"/"),this._maxLength)," ",t("span",null,l("kol-characters"))))}get host(){return h(this)}};export{a as kol_input};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["KolInput","this","slotName","catchInputSlot","slot","handleSlotContent","host","componentWillRender","_slotName","render","hasError","_error","length","_touched","hasHint","_hint","h","Host","class","disabled","_disabled","error","_readOnly","required","_required","touched","_renderNoLabel","id","_id","hidden","_hideLabel","htmlFor","name","input","_a","_icon","left","_b","right","_c","_ariaLabel","icon","ref","_smartButton","_customClass","_label","_on","_tooltipAlign","_variant","_d","_alert","_type","Array","isArray","_suggestions","map","option","value","_hasCounter","_currentLength","_maxLength","Fragment","translate","role"],"sources":["src/components/input/component.tsx"],"sourcesContent":["/* eslint-disable jsx-a11y/label-has-associated-control */\nimport { Component, Element, Fragment, h, Host, JSX, Prop } from '@stencil/core';\n\nimport { translate } from '../../i18n';\nimport { Stringified } from '../../types/common';\nimport { KoliBriCustomIcon, KoliBriHorizontalIcon } from '../../types/icon';\nimport { IdPropType } from '../../types/props/id';\nimport { SuggestionsPropType } from '../../types/props/suggestions';\nimport { W3CInputValue } from '../../types/w3c';\nimport { handleSlotContent } from '../../utils/reuse';\nimport { Props as ButtonProps } from '../button/types';\nimport { Props } from './types';\n\n/**\n * @internal\n */\n@Component({\n\ttag: 'kol-input',\n\tshadow: false,\n})\nexport class KolInput implements Props {\n\t@Element() private readonly host?: HTMLElement;\n\n\tprivate slotName: string = 'input';\n\n\tpublic componentWillRender(): void {\n\t\tthis.slotName = this._slotName ? this._slotName : 'input';\n\t}\n\n\tprivate catchInputSlot = (slot?: HTMLDivElement): void => {\n\t\thandleSlotContent(this.host!, slot!, this.slotName);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst hasError = typeof this._error === 'string' && this._error.length > 0 && this._touched === true;\n\t\tconst hasHint = typeof this._hint === 'string' && this._hint.length > 0;\n\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tclass={{\n\t\t\t\t\tdisabled: this._disabled === true,\n\t\t\t\t\terror: hasError === true,\n\t\t\t\t\t'read-only': this._readOnly === true,\n\t\t\t\t\trequired: this._required === true,\n\t\t\t\t\ttouched: this._touched === true,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{this._renderNoLabel === false && (\n\t\t\t\t\t<label id={`${this._id}-label`} hidden={this._hideLabel} htmlFor={this._id}>\n\t\t\t\t\t\t{/* INFO: span is needed for css styling :after content like a star (*) or optional text ! */}\n\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t{/* INFO: label comes with any html tag or as plain text! */}\n\t\t\t\t\t\t\t<slot name=\"label\"></slot>\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</label>\n\t\t\t\t)}\n\t\t\t\t{hasHint && (\n\t\t\t\t\t<span class=\"hint\" id={`${this._id}-hint`}>\n\t\t\t\t\t\t{this._hint}\n\t\t\t\t\t</span>\n\t\t\t\t)}\n\t\t\t\t<div\n\t\t\t\t\tclass={{\n\t\t\t\t\t\tinput: true,\n\t\t\t\t\t\t'icon-left': typeof this._icon?.left === 'object',\n\t\t\t\t\t\t'icon-right': typeof this._icon?.right === 'object',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{this._icon?.left && <kol-icon _ariaLabel=\"\" _icon={(this._icon.left as KoliBriCustomIcon).icon}></kol-icon>}\n\t\t\t\t\t<div ref={this.catchInputSlot} id={this.slotName} class=\"input-slot\"></div>\n\t\t\t\t\t{typeof this._smartButton === 'object' && this._smartButton !== null && (\n\t\t\t\t\t\t<kol-button-wc\n\t\t\t\t\t\t\t_customClass={this._smartButton._customClass}\n\t\t\t\t\t\t\t_disabled={this._smartButton._disabled}\n\t\t\t\t\t\t\t_icon={this._smartButton._icon}\n\t\t\t\t\t\t\t_hideLabel={true}\n\t\t\t\t\t\t\t_id={this._smartButton._id}\n\t\t\t\t\t\t\t_label={this._smartButton._label}\n\t\t\t\t\t\t\t_on={this._smartButton._on}\n\t\t\t\t\t\t\t_tooltipAlign={this._smartButton._tooltipAlign}\n\t\t\t\t\t\t\t_variant={this._smartButton._variant}\n\t\t\t\t\t\t></kol-button-wc>\n\t\t\t\t\t)}\n\t\t\t\t\t{this._icon?.right && <kol-icon _ariaLabel=\"\" _icon={(this._icon.right as KoliBriCustomIcon).icon}></kol-icon>}\n\t\t\t\t</div>\n\t\t\t\t{hasError && (\n\t\t\t\t\t<kol-alert class=\"error\" id={`${this._id}-error`} _alert={this._alert} _type=\"error\" _variant=\"msg\">\n\t\t\t\t\t\t{this._error}\n\t\t\t\t\t</kol-alert>\n\t\t\t\t)}\n\t\t\t\t{Array.isArray(this._suggestions) && this._suggestions.length > 0 && (\n\t\t\t\t\t<datalist id={`${this._id}-list`}>\n\t\t\t\t\t\t{this._suggestions.map((option: W3CInputValue) => (\n\t\t\t\t\t\t\t<option value={option} />\n\t\t\t\t\t\t))}\n\t\t\t\t\t</datalist>\n\t\t\t\t)}\n\t\t\t\t{this._hasCounter && (\n\t\t\t\t\t<span class=\"counter\" aria-atomic=\"true\" aria-live=\"polite\">\n\t\t\t\t\t\t{this._currentLength}\n\t\t\t\t\t\t{this._maxLength && (\n\t\t\t\t\t\t\t<Fragment>\n\t\t\t\t\t\t\t\t<span aria-label={translate('kol-of')} role=\"img\">\n\t\t\t\t\t\t\t\t\t/\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t{this._maxLength}\n\t\t\t\t\t\t\t</Fragment>\n\t\t\t\t\t\t)}{' '}\n\t\t\t\t\t\t<span>{translate('kol-characters')}</span>\n\t\t\t\t\t</span>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Defines whether the screen-readers should read out the notification.\n\t * @TODO: Change type back to `AlertPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _alert?: boolean = true;\n\n\t/**\n\t * @internal\n\t */\n\t@Prop() public _currentLength?: number;\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 * Shows the character count on the lower border of the input.\n\t * @TODO: Change type back to `HasCounterPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _hasCounter?: boolean;\n\n\t/**\n\t * Hides the label and shows the description in a Tooltip instead.\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. `_icon=\"fa-solid fa-user\"`).\n\t */\n\t@Prop() public _icon?: KoliBriHorizontalIcon;\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 maximum number of input characters.\n\t */\n\t@Prop() public _maxLength?: number;\n\n\t/**\n\t * Makes the input element read only.\n\t * @TODO: Change type back to `ReadOnlyPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _readOnly?: boolean = false;\n\n\t/**\n\t * Gibt an, ob die Komponente kein Label rendern soll.\n\t */\n\t@Prop() public _renderNoLabel?: boolean = false;\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 * Ermöglicht den Slotnamen zu bestimmen. Wird nur verwendet, wenn sonst mehrere Slots mit dem gleichen Namen innerhalb eines Shadow DOMs existieren würden.\n\t * @internal\n\t */\n\t@Prop() public _slotName?: string;\n\n\t/**\n\t * Suggestions to provide for the input.\n\t */\n\t@Prop() public _suggestions?: SuggestionsPropType;\n\n\t/**\n\t * Allows to add a button with an arbitrary action within the element (_hide-label only).\n\t */\n\t@Prop() public _smartButton?: Stringified<ButtonProps>;\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() public _touched?: boolean = false;\n}\n"],"mappings":";;;
|
|
1
|
+
{"version":3,"names":["KolInput","this","slotName","catchInputSlot","slot","handleSlotContent","host","componentWillRender","_slotName","render","hasError","_error","length","_touched","hasHint","_hint","h","Host","class","disabled","_disabled","error","_readOnly","required","_required","touched","_renderNoLabel","id","_id","hidden","_hideLabel","htmlFor","name","input","_a","_icon","left","_b","right","_c","_ariaLabel","icon","ref","_smartButton","_customClass","_label","_on","_tooltipAlign","_variant","_d","_alert","_type","Array","isArray","_suggestions","map","option","value","_hasCounter","_currentLength","_maxLength","Fragment","translate","role"],"sources":["src/components/input/component.tsx"],"sourcesContent":["/* eslint-disable jsx-a11y/label-has-associated-control */\nimport { Component, Element, Fragment, h, Host, JSX, Prop } from '@stencil/core';\n\nimport { translate } from '../../i18n';\nimport { Stringified } from '../../types/common';\nimport { KoliBriCustomIcon, KoliBriHorizontalIcon } from '../../types/icon';\nimport { IdPropType } from '../../types/props/id';\nimport { SuggestionsPropType } from '../../types/props/suggestions';\nimport { W3CInputValue } from '../../types/w3c';\nimport { handleSlotContent } from '../../utils/reuse';\nimport { Props as ButtonProps } from '../button/types';\nimport { Props } from './types';\n\n/**\n * @internal\n */\n@Component({\n\ttag: 'kol-input',\n\tshadow: false,\n})\nexport class KolInput implements Props {\n\t@Element() private readonly host?: HTMLElement;\n\n\tprivate slotName: string = 'input';\n\n\tpublic componentWillRender(): void {\n\t\tthis.slotName = this._slotName ? this._slotName : 'input';\n\t}\n\n\tprivate catchInputSlot = (slot?: HTMLDivElement): void => {\n\t\thandleSlotContent(this.host!, slot!, this.slotName);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst hasError = typeof this._error === 'string' && this._error.length > 0 && this._touched === true;\n\t\tconst hasHint = typeof this._hint === 'string' && this._hint.length > 0;\n\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tclass={{\n\t\t\t\t\tdisabled: this._disabled === true,\n\t\t\t\t\terror: hasError === true,\n\t\t\t\t\t'read-only': this._readOnly === true,\n\t\t\t\t\trequired: this._required === true,\n\t\t\t\t\ttouched: this._touched === true,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{this._renderNoLabel === false && (\n\t\t\t\t\t<label id={`${this._id}-label`} hidden={this._hideLabel} htmlFor={this._id}>\n\t\t\t\t\t\t{/* INFO: span is needed for css styling :after content like a star (*) or optional text ! */}\n\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t{/* INFO: label comes with any html tag or as plain text! */}\n\t\t\t\t\t\t\t<slot name=\"label\"></slot>\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</label>\n\t\t\t\t)}\n\t\t\t\t{hasHint && (\n\t\t\t\t\t<span class=\"hint\" id={`${this._id}-hint`}>\n\t\t\t\t\t\t{this._hint}\n\t\t\t\t\t</span>\n\t\t\t\t)}\n\t\t\t\t<div\n\t\t\t\t\tclass={{\n\t\t\t\t\t\tinput: true,\n\t\t\t\t\t\t'icon-left': typeof this._icon?.left === 'object',\n\t\t\t\t\t\t'icon-right': typeof this._icon?.right === 'object',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{this._icon?.left && <kol-icon _ariaLabel=\"\" _icon={(this._icon.left as KoliBriCustomIcon).icon}></kol-icon>}\n\t\t\t\t\t<div ref={this.catchInputSlot} id={this.slotName} class=\"input-slot\"></div>\n\t\t\t\t\t{typeof this._smartButton === 'object' && this._smartButton !== null && (\n\t\t\t\t\t\t<kol-button-wc\n\t\t\t\t\t\t\t_customClass={this._smartButton._customClass}\n\t\t\t\t\t\t\t_disabled={this._smartButton._disabled}\n\t\t\t\t\t\t\t_icon={this._smartButton._icon}\n\t\t\t\t\t\t\t_hideLabel={true}\n\t\t\t\t\t\t\t_id={this._smartButton._id}\n\t\t\t\t\t\t\t_label={this._smartButton._label}\n\t\t\t\t\t\t\t_on={this._smartButton._on}\n\t\t\t\t\t\t\t_tooltipAlign={this._smartButton._tooltipAlign}\n\t\t\t\t\t\t\t_variant={this._smartButton._variant}\n\t\t\t\t\t\t></kol-button-wc>\n\t\t\t\t\t)}\n\t\t\t\t\t{this._icon?.right && <kol-icon _ariaLabel=\"\" _icon={(this._icon.right as KoliBriCustomIcon).icon}></kol-icon>}\n\t\t\t\t</div>\n\t\t\t\t{hasError && (\n\t\t\t\t\t<kol-alert class=\"error\" id={`${this._id}-error`} _alert={this._alert} _type=\"error\" _variant=\"msg\">\n\t\t\t\t\t\t{this._error}\n\t\t\t\t\t</kol-alert>\n\t\t\t\t)}\n\t\t\t\t{Array.isArray(this._suggestions) && this._suggestions.length > 0 && (\n\t\t\t\t\t<datalist id={`${this._id}-list`}>\n\t\t\t\t\t\t{this._suggestions.map((option: W3CInputValue) => (\n\t\t\t\t\t\t\t<option value={option} />\n\t\t\t\t\t\t))}\n\t\t\t\t\t</datalist>\n\t\t\t\t)}\n\t\t\t\t{this._hasCounter && (\n\t\t\t\t\t<span class=\"counter\" aria-atomic=\"true\" aria-live=\"polite\">\n\t\t\t\t\t\t{this._currentLength}\n\t\t\t\t\t\t{this._maxLength && (\n\t\t\t\t\t\t\t<Fragment>\n\t\t\t\t\t\t\t\t<span aria-label={translate('kol-of')} role=\"img\">\n\t\t\t\t\t\t\t\t\t/\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t{this._maxLength}\n\t\t\t\t\t\t\t</Fragment>\n\t\t\t\t\t\t)}{' '}\n\t\t\t\t\t\t<span>{translate('kol-characters')}</span>\n\t\t\t\t\t</span>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Defines whether the screen-readers should read out the notification.\n\t * @TODO: Change type back to `AlertPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _alert?: boolean = true;\n\n\t/**\n\t * @internal\n\t */\n\t@Prop() public _currentLength?: number;\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 * Shows the character count on the lower border of the input.\n\t * @TODO: Change type back to `HasCounterPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _hasCounter?: boolean;\n\n\t/**\n\t * Hides the label and shows the description in a Tooltip instead.\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. `_icon=\"fa-solid fa-user\"`).\n\t */\n\t@Prop() public _icon?: KoliBriHorizontalIcon;\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 maximum number of input characters.\n\t */\n\t@Prop() public _maxLength?: number;\n\n\t/**\n\t * Makes the input element read only.\n\t * @TODO: Change type back to `ReadOnlyPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _readOnly?: boolean = false;\n\n\t/**\n\t * Gibt an, ob die Komponente kein Label rendern soll.\n\t */\n\t@Prop() public _renderNoLabel?: boolean = false;\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 * Ermöglicht den Slotnamen zu bestimmen. Wird nur verwendet, wenn sonst mehrere Slots mit dem gleichen Namen innerhalb eines Shadow DOMs existieren würden.\n\t * @internal\n\t */\n\t@Prop() public _slotName?: string;\n\n\t/**\n\t * Suggestions to provide for the input.\n\t */\n\t@Prop() public _suggestions?: SuggestionsPropType;\n\n\t/**\n\t * Allows to add a button with an arbitrary action within the element (_hide-label only).\n\t */\n\t@Prop() public _smartButton?: Stringified<ButtonProps>;\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() public _touched?: boolean = false;\n}\n"],"mappings":";;;kRAoBaA,EAAQ,M,yBAGZC,KAAAC,SAAmB,QAMnBD,KAAAE,eAAkBC,IACzBC,EAAkBJ,KAAKK,KAAOF,EAAOH,KAAKC,SAAS,E,YAyFlB,K,6CAWG,M,YAKJ,G,2CAYK,M,WAKN,G,iFAqBK,M,oBAKK,M,eAML,M,+FAsBD,K,CArL7B,mBAAAK,GACNN,KAAKC,SAAWD,KAAKO,UAAYP,KAAKO,UAAY,O,CAO5C,MAAAC,G,YACN,MAAMC,SAAkBT,KAAKU,SAAW,UAAYV,KAAKU,OAAOC,OAAS,GAAKX,KAAKY,WAAa,KAChG,MAAMC,SAAiBb,KAAKc,QAAU,UAAYd,KAAKc,MAAMH,OAAS,EAEtE,OACCI,EAACC,EAAI,CACJC,MAAO,CACNC,SAAUlB,KAAKmB,YAAc,KAC7BC,MAAOX,IAAa,KACpB,YAAaT,KAAKqB,YAAc,KAChCC,SAAUtB,KAAKuB,YAAc,KAC7BC,QAASxB,KAAKY,WAAa,OAG3BZ,KAAKyB,iBAAmB,OACxBV,EAAA,SAAOW,GAAI,GAAG1B,KAAK2B,YAAaC,OAAQ5B,KAAK6B,WAAYC,QAAS9B,KAAK2B,KAEtEZ,EAAA,YAECA,EAAA,QAAMgB,KAAK,YAIblB,GACAE,EAAA,QAAME,MAAM,OAAOS,GAAI,GAAG1B,KAAK2B,YAC7B3B,KAAKc,OAGRC,EAAA,OACCE,MAAO,CACNe,MAAO,KACP,oBAAoBC,EAAAjC,KAAKkC,SAAK,MAAAD,SAAA,SAAAA,EAAEE,QAAS,SACzC,qBAAqBC,EAAApC,KAAKkC,SAAK,MAAAE,SAAA,SAAAA,EAAEC,SAAU,aAG3CC,EAAAtC,KAAKkC,SAAK,MAAAI,SAAA,SAAAA,EAAEH,OAAQpB,EAAA,YAAUwB,WAAW,GAAGL,MAAQlC,KAAKkC,MAAMC,KAA2BK,OAC3FzB,EAAA,OAAK0B,IAAKzC,KAAKE,eAAgBwB,GAAI1B,KAAKC,SAAUgB,MAAM,sBAChDjB,KAAK0C,eAAiB,UAAY1C,KAAK0C,eAAiB,MAC/D3B,EAAA,iBACC4B,aAAc3C,KAAK0C,aAAaC,aAChCxB,UAAWnB,KAAK0C,aAAavB,UAC7Be,MAAOlC,KAAK0C,aAAaR,MACzBL,WAAY,KACZF,IAAK3B,KAAK0C,aAAaf,IACvBiB,OAAQ5C,KAAK0C,aAAaE,OAC1BC,IAAK7C,KAAK0C,aAAaG,IACvBC,cAAe9C,KAAK0C,aAAaI,cACjCC,SAAU/C,KAAK0C,aAAaK,aAG7BC,EAAAhD,KAAKkC,SAAK,MAAAc,SAAA,SAAAA,EAAEX,QAAStB,EAAA,YAAUwB,WAAW,GAAGL,MAAQlC,KAAKkC,MAAMG,MAA4BG,QAE7F/B,GACAM,EAAA,aAAWE,MAAM,QAAQS,GAAI,GAAG1B,KAAK2B,YAAasB,OAAQjD,KAAKiD,OAAQC,MAAM,QAAQH,SAAS,OAC5F/C,KAAKU,QAGPyC,MAAMC,QAAQpD,KAAKqD,eAAiBrD,KAAKqD,aAAa1C,OAAS,GAC/DI,EAAA,YAAUW,GAAI,GAAG1B,KAAK2B,YACpB3B,KAAKqD,aAAaC,KAAKC,GACvBxC,EAAA,UAAQyC,MAAOD,OAIjBvD,KAAKyD,aACL1C,EAAA,QAAME,MAAM,UAAS,cAAa,OAAM,YAAW,UACjDjB,KAAK0D,eACL1D,KAAK2D,YACL5C,EAAC6C,EAAQ,KACR7C,EAAA,qBAAkB8C,EAAU,UAAWC,KAAK,OAAK,KAGhD9D,KAAK2D,YAEL,IACH5C,EAAA,YAAO8C,EAAU,oB"}
|
|
@@ -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-e27342ee.js";import{a}from"./i18n-
|
|
4
|
+
import{r as t,h as e,H as i}from"./index-e27342ee.js";import{a}from"./i18n-2d630bd4.js";import{c as o,v as s}from"./color-74eac985.js";import{d as r}from"./a11y.tipps-32ec681c.js";import{a as n}from"./prop.validators-e8e7611e.js";import"./index-42a84baa.js";import"./index-d49940eb.js";import"./dev.utils-15468eab.js";import"./reuse-3698e2f5.js";const l=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}text{font-size:90px;letter-spacing:normal;word-spacing:normal}svg{max-height:100%}",h=360;function d(t){return t*Math.PI/180}function c(t){return Math.round((Math.cos(d(t))+1)/2*225)}const p=class{constructor(e){t(this,e),this.handleColorChange=(t,e)=>{if("string"==typeof t){const a=o(t);e.set("_color",{red:a[0],green:a[1],blue:a[2]})}else r("[KolKolibri] You used the complex color schema. For the KoliBri we use need the color as hex string.")},this._animate=void 0,this._color="#003c78",this._labeled=void 0,this.state={_animate:!1,_color:{red:0,green:60,blue:120},_labeled:!0}}render(){const t=!0===this.state._animate?`rgb(${c(this.state._color.red)},${c(this.state._color.green)},${c(this.state._color.blue)})`:`rgb(${this.state._color.red},${this.state._color.green},${this.state._color.blue})`;return e(i,null,e("svg",{role:"img","aria-label":a("kol-kolibri-logo"),xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 600 600",fill:t},e("path",{d:"M353 322L213 304V434L353 322Z"}),e("path",{d:"M209 564V304L149 434L209 564Z"}),e("path",{d:"M357 316L417 250L361 210L275 244L357 316Z"}),e("path",{d:"M329 218L237 92L250 222L272 241L329 218Z"}),e("path",{d:"M353 318L35 36L213 300L353 318Z"}),e("path",{d:"M391 286L565 272L421 252L391 286Z"}),!0===this.state._labeled&&e("text",{x:"250",y:"525",fill:t},"KoliBri")))}validateAnimate(t){n(this,"_animate",t)}validateColor(t){s(this,t,{defaultValue:"#003c78",hooks:{beforePatch:this.handleColorChange}})}validateLabeled(t){n(this,"_labeled",t)}componentWillLoad(){this.validateAnimate(this._animate),this.validateColor(this._color),this.validateLabeled(this._labeled)}componentDidRender(){clearInterval(this.interval),this.state._animate&&(this.interval=setInterval((()=>{this.state=Object.assign(Object.assign({},this.state),{_color:{red:(this.state._color.red+1)%h,green:(this.state._color.green+2)%h,blue:(this.state._color.blue+3)%h}})}),50))}disconnectedCallback(){clearInterval(this.interval)}static get watchers(){return{_animate:["validateAnimate"],_color:["validateColor"],_labeled:["validateLabeled"]}}};p.style={default:l};export{p as kol_kolibri};
|
|
@@ -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,g as n}from"./index-e27342ee.js";import{a as s}from"./i18n-
|
|
4
|
+
import{r as t,h as i,H as e,g as n}from"./index-e27342ee.js";import{a as s}from"./i18n-2d630bd4.js";import{a as o}from"./reuse-3698e2f5.js";import"./index-42a84baa.js";import"./index-d49940eb.js";import"./a11y.tipps-32ec681c.js";import"./dev.utils-15468eab.js";const a=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}:host{display:inline-block}:is(a,button){display:inline-flex;place-items:center;text-align:center;text-decoration-line:none}:is(a,button)>kol-span-wc{margin:auto;width:100%}:is(button):disabled{cursor:not-allowed;opacity:0.5}",r=class{constructor(i){t(this,i),this.catchRef=t=>{this.ref=t,o(this.host,this.ref)},this._ariaControls=void 0,this._ariaCurrent=void 0,this._ariaExpanded=void 0,this._ariaLabel=void 0,this._ariaSelected=void 0,this._customClass=void 0,this._disabled=!1,this._download=!1,this._hideLabel=!1,this._href=void 0,this._icon=void 0,this._iconOnly=void 0,this._label=void 0,this._listenAriaCurrent=void 0,this._on=void 0,this._role=void 0,this._tabIndex=void 0,this._target=void 0,this._targetDescription=s("kol-open-link-in-tab"),this._tooltipAlign="right",this._variant="normal"}render(){return i(e,null,i("kol-link-wc",{ref:this.catchRef,class:{button:!0,[this._variant]:"custom"!==this._variant,[this._customClass]:"custom"===this._variant&&"string"==typeof this._customClass&&this._customClass.length>0},_ariaControls:this._ariaControls,_ariaCurrent:this._ariaCurrent,_ariaExpanded:this._ariaExpanded,_ariaLabel:this._ariaLabel,_ariaSelected:this._ariaSelected,_disabled:this._disabled,_download:this._download,_hideLabel:this._hideLabel,_href:this._href,_icon:this._icon,_label:this._label,_listenAriaCurrent:this._listenAriaCurrent,_on:this._on,_role:"button",_tabIndex:this._tabIndex,_target:this._target,_targetDescription:this._targetDescription,_tooltipAlign:this._tooltipAlign},i("slot",{name:"expert",slot:"expert"})))}get host(){return n(this)}};r.style={default:a};export{r as kol_link_button};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["defaultStyleCss","KolLinkButton","this","catchRef","ref","propagateFocus","host","translate","render","h","Host","class","button","_variant","_customClass","length","_ariaControls","_ariaCurrent","_ariaExpanded","_ariaLabel","_ariaSelected","_disabled","_download","_hideLabel","_href","_icon","_label","_listenAriaCurrent","_on","_role","_tabIndex","_target","_targetDescription","_tooltipAlign","name","slot"],"sources":["src/components/link-button/style.css?tag=kol-link-button&mode=default&encapsulation=shadow","src/components/link-button/component.tsx"],"sourcesContent":["@import url(../button.css);\n","import { Component, Element, h, Host, JSX, Prop } from '@stencil/core';\n\nimport { translate } from '../../i18n';\nimport { AriaCurrentPropType } from '../../types/props/aria-current';\nimport { LabelWithExpertSlotPropType } from '../../types/props/label';\nimport { propagateFocus } from '../../utils/reuse';\nimport { DownloadPropType } from '../../types/props/download';\nimport { AlternativeButtonLinkRolePropType } from '../../types/props/alternative-button-link-role';\nimport { ButtonVariantPropType } from '../../types/props/button-variant';\nimport { LinkTargetPropType } from '../../types/props/link-target';\nimport { Props } from './types';\nimport { CustomClassPropType } from '../../types/props/custom-class';\nimport { HrefPropType } from '../../types/props/href';\nimport { IconPropType } from '../../types/props/icon';\nimport { TooltipAlignPropType } from '../../types/props/tooltip-align';\nimport { LinkOnCallbacksPropType } from '../../types/props/link-on-callbacks';\n\n@Component({\n\ttag: 'kol-link-button',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolLinkButton implements Props {\n\t@Element() private readonly host?: HTMLKolLinkButtonElement;\n\tprivate ref?: HTMLKolLinkWcElement;\n\n\tprivate readonly catchRef = (ref?: HTMLKolLinkWcElement) => {\n\t\tthis.ref = ref;\n\t\tpropagateFocus(this.host, this.ref);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<kol-link-wc\n\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\tclass={{\n\t\t\t\t\t\tbutton: true,\n\t\t\t\t\t\t[this._variant as string]: this._variant !== 'custom',\n\t\t\t\t\t\t[this._customClass as string]: this._variant === 'custom' && typeof this._customClass === 'string' && this._customClass.length > 0,\n\t\t\t\t\t}}\n\t\t\t\t\t_ariaControls={this._ariaControls}\n\t\t\t\t\t_ariaCurrent={this._ariaCurrent}\n\t\t\t\t\t_ariaExpanded={this._ariaExpanded}\n\t\t\t\t\t_ariaLabel={this._ariaLabel}\n\t\t\t\t\t_ariaSelected={this._ariaSelected}\n\t\t\t\t\t_disabled={this._disabled}\n\t\t\t\t\t_download={this._download}\n\t\t\t\t\t_hideLabel={this._hideLabel}\n\t\t\t\t\t_href={this._href}\n\t\t\t\t\t_icon={this._icon}\n\t\t\t\t\t_label={this._label}\n\t\t\t\t\t_listenAriaCurrent={this._listenAriaCurrent}\n\t\t\t\t\t_on={this._on}\n\t\t\t\t\t_role=\"button\"\n\t\t\t\t\t_tabIndex={this._tabIndex}\n\t\t\t\t\t_target={this._target}\n\t\t\t\t\t_targetDescription={this._targetDescription}\n\t\t\t\t\t_tooltipAlign={this._tooltipAlign}\n\t\t\t\t>\n\t\t\t\t\t<slot name=\"expert\" slot=\"expert\"></slot>\n\t\t\t\t</kol-link-wc>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Deprecated: Defines which elements are controlled by this component. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls)\n\t *\n\t * @deprecated will be removed in v2\n\t */\n\t@Prop() public _ariaControls?: string;\n\n\t/**\n\t * Deprecated: Marks the element as the selected in a group of related elements. Can be one of the following: `date` | `location` | `page` | `step` | `time` | `true`. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current)\n\t *\n\t * @deprecated use _listen-aria-current instead\n\t */\n\t@Prop() public _ariaCurrent?: AriaCurrentPropType;\n\n\t/**\n\t * Deprecated: Defines whether the interactive element of the component expanded something. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded)\n\t *\n\t * @deprecated will be removed in v2\n\t */\n\t@Prop() public _ariaExpanded?: boolean;\n\n\t/**\n\t * Deprecated: Setzt die semantische Beschriftung der Komponente.\n\t *\n\t * @deprecated use _label instead\n\t */\n\t@Prop() public _ariaLabel?: string;\n\n\t/**\n\t * Deprecated: Defines whether the interactive element of the component is selected (e.g. role=tab). (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected)\n\t *\n\t * @deprecated will be removed in v2\n\t */\n\t@Prop() public _ariaSelected?: boolean;\n\n\t/**\n\t * Defines the custom class attribute if _variant=\"custom\" is set.\n\t */\n\t@Prop() public _customClass?: CustomClassPropType;\n\n\t/**\n\t * Deprecated: Makes the element not focusable and ignore all events.\n\t *\n\t * @deprecated Ein Link kann nicht deaktiviert werden, nutzen Sie den Button-Link stattdessen.\n\t */\n\t@Prop() public _disabled?: boolean = false;\n\n\t/**\n\t * Tells the browser that the link contains a file. Optionally sets the filename.\n\t */\n\t@Prop() public _download?: DownloadPropType = false;\n\n\t/**\n\t * Hides the label and shows the description in a Tooltip instead.\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 target URI of the link.\n\t */\n\t@Prop() public _href!: HrefPropType;\n\n\t/**\n\t * Defines the icon classnames (e.g. `_icon=\"fa-solid fa-user\"`).\n\t */\n\t@Prop() public _icon?: IconPropType;\n\n\t/**\n\t * Deprecated: Hides the label and shows the description in a Tooltip instead.\n\t * @deprecated use _hide-label\n\t */\n\t@Prop() public _iconOnly?: boolean;\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 * Listen on a aria-current event with this value. If the value matches the current value and the href is the same as the current url, the aria-current attribute will be set to current value.\n\t */\n\t@Prop() public _listenAriaCurrent?: AriaCurrentPropType;\n\n\t/**\n\t * Defines the callback functions for links.\n\t */\n\t@Prop() public _on?: LinkOnCallbacksPropType;\n\n\t/**\n\t * Defines the role of the components primary element.\n\t */\n\t@Prop() public _role?: AlternativeButtonLinkRolePropType;\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 open the link.\n\t */\n\t@Prop() public _target?: LinkTargetPropType;\n\n\t/**\n\t * Defines the description to use when the link is going to be opened in another application.\n\t */\n\t@Prop() public _targetDescription?: string = translate('kol-open-link-in-tab');\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 = 'right';\n\n\t/**\n\t * Defines which variant should be used for presentation.\n\t */\n\t@Prop() public _variant?: ButtonVariantPropType = 'normal';\n}\n"],"mappings":";;;
|
|
1
|
+
{"version":3,"names":["defaultStyleCss","KolLinkButton","this","catchRef","ref","propagateFocus","host","translate","render","h","Host","class","button","_variant","_customClass","length","_ariaControls","_ariaCurrent","_ariaExpanded","_ariaLabel","_ariaSelected","_disabled","_download","_hideLabel","_href","_icon","_label","_listenAriaCurrent","_on","_role","_tabIndex","_target","_targetDescription","_tooltipAlign","name","slot"],"sources":["src/components/link-button/style.css?tag=kol-link-button&mode=default&encapsulation=shadow","src/components/link-button/component.tsx"],"sourcesContent":["@import url(../button.css);\n","import { Component, Element, h, Host, JSX, Prop } from '@stencil/core';\n\nimport { translate } from '../../i18n';\nimport { AriaCurrentPropType } from '../../types/props/aria-current';\nimport { LabelWithExpertSlotPropType } from '../../types/props/label';\nimport { propagateFocus } from '../../utils/reuse';\nimport { DownloadPropType } from '../../types/props/download';\nimport { AlternativeButtonLinkRolePropType } from '../../types/props/alternative-button-link-role';\nimport { ButtonVariantPropType } from '../../types/props/button-variant';\nimport { LinkTargetPropType } from '../../types/props/link-target';\nimport { Props } from './types';\nimport { CustomClassPropType } from '../../types/props/custom-class';\nimport { HrefPropType } from '../../types/props/href';\nimport { IconPropType } from '../../types/props/icon';\nimport { TooltipAlignPropType } from '../../types/props/tooltip-align';\nimport { LinkOnCallbacksPropType } from '../../types/props/link-on-callbacks';\n\n@Component({\n\ttag: 'kol-link-button',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolLinkButton implements Props {\n\t@Element() private readonly host?: HTMLKolLinkButtonElement;\n\tprivate ref?: HTMLKolLinkWcElement;\n\n\tprivate readonly catchRef = (ref?: HTMLKolLinkWcElement) => {\n\t\tthis.ref = ref;\n\t\tpropagateFocus(this.host, this.ref);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<kol-link-wc\n\t\t\t\t\tref={this.catchRef}\n\t\t\t\t\tclass={{\n\t\t\t\t\t\tbutton: true,\n\t\t\t\t\t\t[this._variant as string]: this._variant !== 'custom',\n\t\t\t\t\t\t[this._customClass as string]: this._variant === 'custom' && typeof this._customClass === 'string' && this._customClass.length > 0,\n\t\t\t\t\t}}\n\t\t\t\t\t_ariaControls={this._ariaControls}\n\t\t\t\t\t_ariaCurrent={this._ariaCurrent}\n\t\t\t\t\t_ariaExpanded={this._ariaExpanded}\n\t\t\t\t\t_ariaLabel={this._ariaLabel}\n\t\t\t\t\t_ariaSelected={this._ariaSelected}\n\t\t\t\t\t_disabled={this._disabled}\n\t\t\t\t\t_download={this._download}\n\t\t\t\t\t_hideLabel={this._hideLabel}\n\t\t\t\t\t_href={this._href}\n\t\t\t\t\t_icon={this._icon}\n\t\t\t\t\t_label={this._label}\n\t\t\t\t\t_listenAriaCurrent={this._listenAriaCurrent}\n\t\t\t\t\t_on={this._on}\n\t\t\t\t\t_role=\"button\"\n\t\t\t\t\t_tabIndex={this._tabIndex}\n\t\t\t\t\t_target={this._target}\n\t\t\t\t\t_targetDescription={this._targetDescription}\n\t\t\t\t\t_tooltipAlign={this._tooltipAlign}\n\t\t\t\t>\n\t\t\t\t\t<slot name=\"expert\" slot=\"expert\"></slot>\n\t\t\t\t</kol-link-wc>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Deprecated: Defines which elements are controlled by this component. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls)\n\t *\n\t * @deprecated will be removed in v2\n\t */\n\t@Prop() public _ariaControls?: string;\n\n\t/**\n\t * Deprecated: Marks the element as the selected in a group of related elements. Can be one of the following: `date` | `location` | `page` | `step` | `time` | `true`. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current)\n\t *\n\t * @deprecated use _listen-aria-current instead\n\t */\n\t@Prop() public _ariaCurrent?: AriaCurrentPropType;\n\n\t/**\n\t * Deprecated: Defines whether the interactive element of the component expanded something. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded)\n\t *\n\t * @deprecated will be removed in v2\n\t */\n\t@Prop() public _ariaExpanded?: boolean;\n\n\t/**\n\t * Deprecated: Setzt die semantische Beschriftung der Komponente.\n\t *\n\t * @deprecated use _label instead\n\t */\n\t@Prop() public _ariaLabel?: string;\n\n\t/**\n\t * Deprecated: Defines whether the interactive element of the component is selected (e.g. role=tab). (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected)\n\t *\n\t * @deprecated will be removed in v2\n\t */\n\t@Prop() public _ariaSelected?: boolean;\n\n\t/**\n\t * Defines the custom class attribute if _variant=\"custom\" is set.\n\t */\n\t@Prop() public _customClass?: CustomClassPropType;\n\n\t/**\n\t * Deprecated: Makes the element not focusable and ignore all events.\n\t *\n\t * @deprecated Ein Link kann nicht deaktiviert werden, nutzen Sie den Button-Link stattdessen.\n\t */\n\t@Prop() public _disabled?: boolean = false;\n\n\t/**\n\t * Tells the browser that the link contains a file. Optionally sets the filename.\n\t */\n\t@Prop() public _download?: DownloadPropType = false;\n\n\t/**\n\t * Hides the label and shows the description in a Tooltip instead.\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 target URI of the link.\n\t */\n\t@Prop() public _href!: HrefPropType;\n\n\t/**\n\t * Defines the icon classnames (e.g. `_icon=\"fa-solid fa-user\"`).\n\t */\n\t@Prop() public _icon?: IconPropType;\n\n\t/**\n\t * Deprecated: Hides the label and shows the description in a Tooltip instead.\n\t * @deprecated use _hide-label\n\t */\n\t@Prop() public _iconOnly?: boolean;\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 * Listen on a aria-current event with this value. If the value matches the current value and the href is the same as the current url, the aria-current attribute will be set to current value.\n\t */\n\t@Prop() public _listenAriaCurrent?: AriaCurrentPropType;\n\n\t/**\n\t * Defines the callback functions for links.\n\t */\n\t@Prop() public _on?: LinkOnCallbacksPropType;\n\n\t/**\n\t * Defines the role of the components primary element.\n\t */\n\t@Prop() public _role?: AlternativeButtonLinkRolePropType;\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 open the link.\n\t */\n\t@Prop() public _target?: LinkTargetPropType;\n\n\t/**\n\t * Defines the description to use when the link is going to be opened in another application.\n\t */\n\t@Prop() public _targetDescription?: string = translate('kol-open-link-in-tab');\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 = 'right';\n\n\t/**\n\t * Defines which variant should be used for presentation.\n\t */\n\t@Prop() public _variant?: ButtonVariantPropType = 'normal';\n}\n"],"mappings":";;;qQAAA,MAAMA,EAAkB,w5B,MCwBXC,EAAa,M,yBAIRC,KAAAC,SAAYC,IAC5BF,KAAKE,IAAMA,EACXC,EAAeH,KAAKI,KAAMJ,KAAKE,IAAI,E,wLAmFC,M,eAKS,M,gBAMR,M,2OAmDOG,EAAU,wB,mBAKD,Q,cAKJ,Q,CAxJ3C,MAAAC,GACN,OACCC,EAACC,EAAI,KACJD,EAAA,eACCL,IAAKF,KAAKC,SACVQ,MAAO,CACNC,OAAQ,KACR,CAACV,KAAKW,UAAqBX,KAAKW,WAAa,SAC7C,CAACX,KAAKY,cAAyBZ,KAAKW,WAAa,iBAAmBX,KAAKY,eAAiB,UAAYZ,KAAKY,aAAaC,OAAS,GAElIC,cAAed,KAAKc,cACpBC,aAAcf,KAAKe,aACnBC,cAAehB,KAAKgB,cACpBC,WAAYjB,KAAKiB,WACjBC,cAAelB,KAAKkB,cACpBC,UAAWnB,KAAKmB,UAChBC,UAAWpB,KAAKoB,UAChBC,WAAYrB,KAAKqB,WACjBC,MAAOtB,KAAKsB,MACZC,MAAOvB,KAAKuB,MACZC,OAAQxB,KAAKwB,OACbC,mBAAoBzB,KAAKyB,mBACzBC,IAAK1B,KAAK0B,IACVC,MAAM,SACNC,UAAW5B,KAAK4B,UAChBC,QAAS7B,KAAK6B,QACdC,mBAAoB9B,KAAK8B,mBACzBC,cAAe/B,KAAK+B,eAEpBxB,EAAA,QAAMyB,KAAK,SAASC,KAAK,Y"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* KoliBri - The accessible HTML-Standard
|
|
3
3
|
*/
|
|
4
|
-
import{r as i,h as t}from"./index-e27342ee.js";import{v as e}from"./label-
|
|
4
|
+
import{r as i,h as t}from"./index-e27342ee.js";import{v as e}from"./label-671155b8.js";import{d as a,w as n,a as s}from"./prop.validators-e8e7611e.js";import{w as l}from"./validation-c78bf25b.js";import{w as r}from"./validation-edd7dd57.js";import{r as o,a as h}from"./unique-nav-labels-c6750f60.js";import"./a11y.tipps-32ec681c.js";import"./dev.utils-15468eab.js";import"./reuse-3698e2f5.js";import"./index-d49940eb.js";const d=":host{--a11y-min-size:44px;font-size:inherit}*{hyphens:auto;letter-spacing:inherit;word-break:break-word;word-spacing:inherit}[role='button'],button:not([role='link']),kol-input .input{min-height:var(--a11y-min-size);min-width:var(--a11y-min-size)}a,button,h1,h2,h3,h4,h5,h6,input,option,select,textarea{font-family:inherit;font-size:inherit}:is(a,button){background-color:transparent;border:none;margin:0;padding:0;width:100%;}:host{max-width:100%}*{box-sizing:border-box}kol-span-wc{display:grid;place-items:center}kol-span-wc>span{display:flex;place-items:center}a,button{cursor:pointer}button,input,option,select,textarea{font-family:inherit}.icon-only>kol-span-wc>span>span{display:none}ul{list-style:none;margin:0;padding:0}nav.horizontal ul{display:flex;flex-wrap:wrap}nav.horizontal li{margin-left:1.25rem;margin-right:0.25rem}nav.horizontal li:first-child{margin-left:0}nav.horizontal li:last-child{margin-right:0}nav.vertical li{margin-left:1.75rem;margin-right:0.5rem}li.list-none{list-style-type:none !important;margin-left:0}",c=i=>{const e=[];return i.links.map(((a,l)=>{e.push(t("li",{key:l,class:{ident:l>0&&"vertical"===i.orientation,"list-none":0===l&&"horizontal"===i.orientation},style:{listStyleType:i.listStyleType}},t("kol-link",Object.assign({},a))))})),e},p=class{constructor(t){i(this,t),this.isUl=!0,this._ariaLabel=void 0,this._listStyleType=void 0,this._heading=void 0,this._label=void 0,this._level=void 0,this._links=void 0,this._ordered=void 0,this._orientation="vertical",this.state={_label:"…",_listStyleType:"disc",_links:[],_orientation:"vertical"}}render(){var i;return t("nav",{"aria-label":this.state._label,class:{vertical:"vertical"===this.state._orientation,horizontal:"horizontal"===this.state._orientation}},"string"==typeof this.state._heading&&(null===(i=this.state._heading)||void 0===i?void 0:i.length)>0&&t("kol-heading-wc",{_label:this.state._heading,_level:this.state._level}),!1===this.isUl?t("ol",null,t(c,{links:this.state._links,orientation:this.state._orientation,listStyleType:this.state._listStyleType})):t("ul",null,t(c,{links:this.state._links,orientation:this.state._orientation,listStyleType:this.state._listStyleType})))}validateAriaLabel(t){this.validateLabel(t)}validateHeading(t){a(this,"_heading",t)}validateLabel(t,i,a=!1){a||o(this.state._label),e(this,t),h(this.state._label)}validateLevel(t){l(this,t)}validateListStyleType(t){n(this,"_listStyleType",(t=>{switch(t){case"disc":case"circle":case"square":case"none":return this.isUl=!0,!0;case"decimal":case"decimal-leading-zero":case"lower-alpha":case"lower-latin":case"lower-greek":case"lower-roman":case"upper-alpha":case"upper-latin":case"upper-roman":return this.isUl=!1,!0;default:return!1}}),new Set(["https://www.w3schools.com/tags/tag_ol.asp"]),t)}validateLinks(t){r("KolLinkGroup",this,t)}validateOrdered(t){s(this,"_ordered",t)}validateOrientation(t){n(this,"_orientation",(t=>"horizontal"===t||"vertical"===t),new Set(["Orientation {horizontal, vertical}"]),t,{defaultValue:"vertical"})}componentWillLoad(){this.validateHeading(this._heading),this.validateLabel(this._label||this._ariaLabel,void 0,!0),this.validateLevel(this._level),this.validateListStyleType(this._listStyleType),this.validateLinks(this._links),this.validateOrientation(this._orientation)}disconnectedCallback(){o(this.state._label)}static get watchers(){return{_ariaLabel:["validateAriaLabel"],_heading:["validateHeading"],_label:["validateLabel"],_level:["validateLevel"],_listStyleType:["validateListStyleType"],_links:["validateLinks"],_ordered:["validateOrdered"],_orientation:["validateOrientation"]}}};p.style={default:d};export{p as kol_link_group};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* KoliBri - The accessible HTML-Standard
|
|
3
3
|
*/
|
|
4
|
-
import{r as i,h as t,H as e,g as s}from"./index-e27342ee.js";import{a}from"./i18n-
|
|
4
|
+
import{r as i,h as t,H as e,g as s}from"./index-e27342ee.js";import{a}from"./i18n-2d630bd4.js";import{v as l,a as n,b as h,c as d}from"./alternative-button-link-role-6e251523.js";import{a as o,d as r,f as c,h as f,i as v,j as p}from"./prop.validators-e8e7611e.js";import{v as u}from"./hide-label-59320a79.js";import{v as _,w as b}from"./icon-e9f19388.js";import{a as g}from"./label-671155b8.js";import{d as m,h as j,g as x}from"./a11y.tipps-32ec681c.js";import{a as A}from"./reuse-3698e2f5.js";import{v as k}from"./tab-index-a166ca52.js";import{v as y}from"./tooltip-align-a1e0f931.js";import"./index-42a84baa.js";import"./index-d49940eb.js";import"./dev.utils-15468eab.js";import"./alignment-6e474722.js";const C=(t,e)=>{o(t,"_ariaSelected",e)},L=(t,e)=>{"boolean"==typeof e?o(t,"_download",e):r(t,"_download",e)},w=(t,e,a={})=>{r(t,"_href",e,a)},I=(t,e)=>{o(t,"_stealth",e)},T=(t,e)=>{r(t,"_target",e)},O=(t,e)=>{"object"==typeof e&&"function"==typeof(null==e?void 0:e.onClick)&&(t.state=Object.assign(Object.assign({},t.state),{_on:e}))},D=class{constructor(t){i(this,t),this.catchRef=t=>{this.ref=t,A(this.host,this.ref)},this.onClick=t=>{var e,a;"function"==typeof(null===(e=this.state._on)||void 0===e?void 0:e.onClick)&&(t.preventDefault(),t.stopPropagation(),c(t,this.ref),null===(a=this.state._on)||void 0===a||a.onClick(t,this.state._href))},this.getRenderValues=()=>{let t={};"string"==typeof this.state._selector&&(t={role:"link",tabIndex:0,onClick:()=>{p(this.state._selector)},onKeyPress:()=>{p(this.state._selector)}});const e="string"==typeof this.state._target&&"_self"!==this.state._target,a={href:"string"==typeof this.state._href&&this.state._href.length>0?this.state._href:"javascript:void(0);",target:"string"==typeof this.state._target&&this.state._target.length>0?this.state._target:void 0,rel:e?"noopener":void 0};return"image"!==this.state._useCase&&!0!==this.state._hideLabel||this.state._label||m("[KolLink] Es muss ein Aria-Label gesetzt werden, wenn eine Grafik verlinkt oder der _hide-label gesetzt ist."),{isExternal:e,tagAttrs:a,goToProps:t}},this.unsubscribeAriaCurrentSubject=f.subscribe((t=>{try{this.state._listenAriaCurrent&&this.state._listenAriaCurrent===t.ariaCurrent&&(this.state._href===t.href?this.validateAriaCurrent(t.ariaCurrent):this.validateAriaCurrent(!1))}catch(t){j("The aria-current event is not valid.")}})),this._ariaControls=void 0,this._ariaCurrent=void 0,this._ariaExpanded=void 0,this._ariaLabel=void 0,this._ariaSelected=void 0,this._disabled=!1,this._download=!1,this._hideLabel=!1,this._href=void 0,this._icon=void 0,this._iconAlign=void 0,this._iconOnly=void 0,this._label=void 0,this._listenAriaCurrent=void 0,this._on=void 0,this._role=void 0,this._selector=void 0,this._stealth=!1,this._tabIndex=void 0,this._target=void 0,this._targetDescription=a("kol-open-link-in-tab"),this._tooltipAlign="right",this._useCase="text",this.state={_href:"…",_icon:{},_label:!1}}render(){const{isExternal:a,tagAttrs:i,goToProps:s}=this.getRenderValues(),l=!1===this.state._label;return t(e,null,t("a",Object.assign({ref:this.catchRef},i,{"aria-controls":this.state._ariaControls,"aria-current":this.state._ariaCurrent,"aria-expanded":v(this.state._ariaExpanded),"aria-label":this.state._hideLabel&&"string"==typeof this.state._label?this.state._label:void 0,"aria-selected":v(this.state._ariaSelected),class:{disabled:!0===this.state._disabled,"skip ":!1!==this.state._stealth,"icon-only":!0===this.state._hideLabel,"hide-label":!0===this.state._hideLabel,"external-link":a}},this.state._on,{onClick:this.onClick,onKeyPress:this.onClick},s,{role:this.state._role,tabIndex:this.state._tabIndex}),t("kol-span-wc",{_icon:this.state._icon,_hideLabel:this.state._hideLabel,_label:!l&&(this.state._label||this.state._href)},t("slot",{name:"expert",slot:"expert"})),a&&t("kol-icon",{class:"external-link-icon",_label:this.state._targetDescription,_icon:"codicon codicon-link-external"})),t("kol-tooltip-wc",{"aria-hidden":"true",hidden:l||!this.state._hideLabel,_align:this.state._tooltipAlign,_label:this.state._label||this.state._href}))}validateAriaControls(t){l(this,t)}validateAriaCurrent(t){n(this,t)}validateAriaExpanded(t){o(this,"_ariaExpanded",t)}validateAriaLabel(t){this.validateLabel(t)}validateAriaSelected(t){C(this,t)}validateDisabled(t){o(this,"_disabled",t),!0===t&&x()}validateDownload(t){L(this,t)}validateHideLabel(t){u(this,t)}validateHref(t){w(this,t)}validateIcon(t){_(this,t)}validateIconAlign(t){b(this,t)}validateIconOnly(t){this.validateHideLabel(t)}validateLabel(t){g(this,t)}validateListenAriaCurrent(t){h(this,t)}validateOn(t){O(this,t)}validateRole(t){d(this,t)}validateSelector(t){r(this,"_selector",t)}validateStealth(t){I(this,t)}validateTabIndex(t){k(this,t)}validateTarget(t){T(this,t)}validateTargetDescription(t){r(this,"_targetDescription",t)}validateTooltipAlign(t){y(this,t)}validateUseCase(t){"string"==typeof t&&(this.state=Object.assign(Object.assign({},this.state),{_useCase:t}))}componentWillLoad(){this.validateAriaControls(this._ariaControls),this.validateAriaCurrent(this._ariaCurrent),this.validateAriaExpanded(this._ariaExpanded),this.validateAriaSelected(this._ariaSelected),this.validateDisabled(this._disabled),this.validateDownload(this._download),this.validateHideLabel(this._hideLabel||this._iconOnly),this.validateHref(this._href),this.validateIcon(this._icon),this.validateIconAlign(this._iconAlign),this.validateLabel(this._label||this._ariaLabel),this.validateListenAriaCurrent(this._listenAriaCurrent),this.validateOn(this._on),this.validateRole(this._role),this.validateSelector(this._selector),this.validateStealth(this._stealth),this.validateTabIndex(this._tabIndex),this.validateTarget(this._target),this.validateTargetDescription(this._targetDescription),this.validateTooltipAlign(this._tooltipAlign),this.validateUseCase(this._useCase)}disconnectedCallback(){this.unsubscribeAriaCurrentSubject.unsubscribe()}get host(){return s(this)}static get watchers(){return{_ariaControls:["validateAriaControls"],_ariaCurrent:["validateAriaCurrent"],_ariaExpanded:["validateAriaExpanded"],_ariaLabel:["validateAriaLabel"],_ariaSelected:["validateAriaSelected"],_disabled:["validateDisabled"],_download:["validateDownload"],_hideLabel:["validateHideLabel"],_href:["validateHref"],_icon:["validateIcon"],_iconAlign:["validateIconAlign"],_iconOnly:["validateIconOnly"],_label:["validateLabel"],_listenAriaCurrent:["validateListenAriaCurrent"],_on:["validateOn"],_role:["validateRole"],_selector:["validateSelector"],_stealth:["validateStealth"],_tabIndex:["validateTabIndex"],_target:["validateTarget"],_targetDescription:["validateTargetDescription"],_tooltipAlign:["validateTooltipAlign"],_useCase:["validateUseCase"]}}};export{D as kol_link_wc};
|