@sellmate/design-system 1.16.0 → 1.18.0
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/dist/cjs/component.listItem-Bnh0r_CA.js +53 -0
- package/dist/cjs/design-system.cjs.js +1 -1
- package/dist/cjs/index.cjs.js +11 -0
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/sd-button_2.cjs.entry.js +54 -0
- package/dist/cjs/sd-calendar_2.cjs.entry.js +2 -2
- package/dist/cjs/sd-chip-input.cjs.entry.js +236 -18
- package/dist/cjs/sd-circle-progress.cjs.entry.js +2 -2
- package/dist/cjs/sd-confirm-modal_2.cjs.entry.js +3 -3
- package/dist/cjs/sd-date-picker_7.cjs.entry.js +9 -9
- package/dist/cjs/sd-date-range-picker-calendar.cjs.entry.js +1 -1
- package/dist/cjs/sd-divider.cjs.entry.js +2 -2
- package/dist/cjs/sd-dropdown-button.cjs.entry.js +17 -7
- package/dist/cjs/sd-field_3.cjs.entry.js +8 -8
- package/dist/cjs/sd-ghost-button_2.cjs.entry.js +2 -2
- package/dist/cjs/sd-guide.cjs.entry.js +1 -1
- package/dist/cjs/sd-key-value-table.cjs.entry.js +45 -9
- package/dist/cjs/sd-linear-progress.cjs.entry.js +2 -2
- package/dist/cjs/sd-loading-container.cjs.entry.js +2 -2
- package/dist/cjs/sd-modal-container.cjs.entry.js +8 -1
- package/dist/cjs/sd-pagination_4.cjs.entry.js +10 -10
- package/dist/cjs/sd-popup.cjs.entry.js +2 -2
- package/dist/cjs/sd-portal.cjs.entry.js +16 -12
- package/dist/cjs/sd-select-list-item_2.cjs.entry.js +8 -7
- package/dist/cjs/{sd-select.config-DrJ4LNVz.js → sd-select.config-C9Ohe1QA.js} +25 -71
- package/dist/cjs/sd-select_3.cjs.entry.js +12 -11
- package/dist/cjs/sd-switch.cjs.entry.js +1 -1
- package/dist/cjs/sd-table.cjs.entry.js +8 -8
- package/dist/cjs/{sd-table.config-BjJW74Zx.js → sd-table.config-B7MuRLoR.js} +1 -1
- package/dist/cjs/sd-tabs.cjs.entry.js +1 -1
- package/dist/cjs/sd-td.cjs.entry.js +1 -1
- package/dist/cjs/sd-text-link.cjs.entry.js +4 -4
- package/dist/cjs/sd-toast-container.cjs.entry.js +1 -1
- package/dist/cjs/sd-toast.cjs.entry.js +2 -2
- package/dist/cjs/sd-toggle.cjs.entry.js +1 -1
- package/dist/cjs/{system-CdAyz3ej.js → system-MjrAugX-.js} +7 -0
- package/dist/collection/collection-manifest.json +1 -1
- package/dist/collection/components/assets/Bill.js +5 -0
- package/dist/collection/components/assets/Coupon.js +5 -0
- package/dist/collection/components/assets/Delete.js +5 -0
- package/dist/collection/components/assets/Dot.js +5 -0
- package/dist/collection/components/assets/Launcher.js +5 -0
- package/dist/collection/components/assets/Monitor.js +5 -0
- package/dist/collection/components/assets/Shield.js +5 -0
- package/dist/collection/components/assets/Sidebar.js +5 -0
- package/dist/collection/components/assets/Store.js +5 -0
- package/dist/collection/components/assets/index.js +18 -0
- package/dist/collection/components/sd-button/sd-button.js +2 -2
- package/dist/collection/components/sd-chip-input/sd-chip-input.config.js +29 -0
- package/dist/collection/components/sd-chip-input/sd-chip-input.css +50 -0
- package/dist/collection/components/sd-chip-input/sd-chip-input.js +321 -19
- package/dist/collection/components/sd-circle-progress/sd-circle-progress.js +1 -1
- package/dist/collection/components/sd-confirm-modal/sd-confirm-modal.js +2 -2
- package/dist/collection/components/sd-date-picker/sd-date-picker-trigger/sd-date-picker-trigger.js +2 -2
- package/dist/collection/components/sd-date-picker/sd-date-picker.js +2 -2
- package/dist/collection/components/sd-date-range-picker/sd-date-range-picker-calendar/sd-date-range-picker-calendar.js +1 -1
- package/dist/collection/components/sd-divider/sd-divider.js +1 -1
- package/dist/collection/components/sd-dropdown-button/sd-dropdown-button.config.js +7 -0
- package/dist/collection/components/sd-dropdown-button/sd-dropdown-button.js +10 -7
- package/dist/collection/components/sd-field/sd-field.js +5 -5
- package/dist/collection/components/sd-floating-portal/sd-floating-portal.js +1 -1
- package/dist/collection/components/sd-ghost-button/sd-ghost-button.js +1 -1
- package/dist/collection/components/sd-icon/sd-icon.js +1 -1
- package/dist/collection/components/sd-input/sd-input.js +2 -2
- package/dist/collection/components/sd-key-value-table/sd-key-value-table.config.js +2 -3
- package/dist/collection/components/sd-key-value-table/sd-key-value-table.css +2 -2
- package/dist/collection/components/sd-key-value-table/sd-key-value-table.js +41 -4
- package/dist/collection/components/sd-linear-progress/sd-linear-progress.js +1 -1
- package/dist/collection/components/sd-loading-container/sd-loading-container.js +2 -2
- package/dist/collection/components/sd-loading-modal/sd-loading-modal.js +1 -1
- package/dist/collection/components/sd-modal-container/sd-modal-container.js +8 -1
- package/dist/collection/components/sd-number-input/sd-number-input.js +4 -4
- package/dist/collection/components/sd-pagination/sd-pagination.js +3 -3
- package/dist/collection/components/sd-popover/sd-popover.js +2 -2
- package/dist/collection/components/sd-popup/sd-popup.js +1 -1
- package/dist/collection/components/sd-portal/sd-portal.js +16 -12
- package/dist/collection/components/sd-select/sd-select-list-item/sd-select-list-item.js +2 -2
- package/dist/collection/components/sd-select/sd-select-list-item-search/sd-select-list-item-search.js +4 -4
- package/dist/collection/components/sd-select/sd-select-listbox/sd-select-listbox.js +4 -4
- package/dist/collection/components/sd-select/sd-select-trigger/sd-select-trigger.js +2 -2
- package/dist/collection/components/sd-select/sd-select.config.js +2 -2
- package/dist/collection/components/sd-select/sd-select.js +4 -4
- package/dist/collection/components/sd-switch/sd-switch.js +1 -1
- package/dist/collection/components/sd-table/sd-table.js +6 -6
- package/dist/collection/components/sd-table/sd-tbody/sd-tbody.js +2 -2
- package/dist/collection/components/sd-table/sd-td/sd-td.js +1 -1
- package/dist/collection/components/sd-table/sd-thead/sd-thead.js +3 -3
- package/dist/collection/components/sd-tabs/sd-tabs.js +1 -1
- package/dist/collection/components/sd-tag/sd-tag.js +3 -3
- package/dist/collection/components/sd-text-link/sd-text-link.js +4 -4
- package/dist/collection/components/sd-textarea/sd-textarea.js +1 -1
- package/dist/collection/components/sd-toast/sd-toast.js +3 -3
- package/dist/collection/components/sd-toast-container/sd-toast-container.js +1 -1
- package/dist/collection/components/sd-toggle/sd-toggle.js +1 -1
- package/dist/collection/components/sd-tooltip/sd-tooltip.js +4 -4
- package/dist/collection/utils/modal.js +11 -0
- package/dist/components/index.js +1 -1
- package/dist/components/{p-DfZ8X4ly.js → p-4HPAPKne.js} +1 -1
- package/dist/components/{p-B57sOZvR.js → p-79DExV92.js} +1 -1
- package/dist/components/{p-RE577yb-.js → p-AI4YlQmL.js} +1 -1
- package/dist/components/{p-B4pLCd0_.js → p-B-4ulKJj.js} +1 -1
- package/dist/components/{p-G_N9xEDL.js → p-B3SKaQId.js} +1 -1
- package/dist/components/p-BD8OoYud.js +1 -0
- package/dist/components/p-BJfiMC9H.js +1 -0
- package/dist/components/{p-DknZgTo9.js → p-BLNc_TL-.js} +1 -1
- package/dist/components/{p-CLEAGFjW.js → p-BMIgVp9-.js} +1 -1
- package/dist/components/{p-vS0t7bWk.js → p-BX5uKVOt.js} +1 -1
- package/dist/components/p-BYTrIk62.js +1 -0
- package/dist/components/{p-_P21dOPl.js → p-B_5uwji5.js} +1 -1
- package/dist/components/{p-DUwrMHYa.js → p-Bzo51vnP.js} +1 -1
- package/dist/components/{p-DtG23tkr.js → p-C0tkFuhj.js} +1 -1
- package/dist/components/{p-YlaidN9T.js → p-C3wv8gVC.js} +1 -1
- package/dist/components/{p-YKESuy-p.js → p-CH6cVc2a.js} +1 -1
- package/dist/components/{p-Bfrg9lvO.js → p-CQWZv8vY.js} +1 -1
- package/dist/components/{p-BsQf9d7Q.js → p-CXRFEcE_.js} +1 -1
- package/dist/components/{p-B-61rIur.js → p-C_r3z9VA.js} +1 -1
- package/dist/components/{p-BvAJ_toQ.js → p-Cl5io5TH.js} +1 -1
- package/dist/components/p-ClKABgST.js +1 -0
- package/dist/components/{p-DGyTYauz.js → p-Cmg10jpN.js} +1 -1
- package/dist/components/{p-DeXO3mpJ.js → p-CtWfOIxb.js} +1 -1
- package/dist/components/{p-CIZpVJBx.js → p-CzCu_NDl.js} +1 -1
- package/dist/components/{p-FGvi8J2D.js → p-DAOeioSV.js} +1 -1
- package/dist/components/{p-iGvyLmbb.js → p-DDR0VcRU.js} +1 -1
- package/dist/components/{p-CnfnK5aj.js → p-DMS9mQsg.js} +1 -1
- package/dist/components/{p-B73U-Zw2.js → p-DTFXzlvq.js} +1 -1
- package/dist/components/{p-CHjF0mwj.js → p-DbLQoVx6.js} +1 -1
- package/dist/components/p-Dr5Q2ZKB.js +1 -0
- package/dist/components/{p-B4UxhQes.js → p-DrSHJYop.js} +1 -1
- package/dist/components/p-DvvGi4J_.js +1 -0
- package/dist/components/{p-BrzBnO1L.js → p-DyVh4pNL.js} +1 -1
- package/dist/components/{p-C_6HUUGg.js → p-Ng3JMPxb.js} +1 -1
- package/dist/components/p-U8VaRj9c.js +1 -0
- package/dist/components/{p-BY1ItC8N.js → p-hzCGj0On.js} +1 -1
- package/dist/components/{p-BMVHvEDw.js → p-qJeUUOyB.js} +1 -1
- package/dist/components/sd-action-modal.js +1 -1
- package/dist/components/sd-barcode-input.js +1 -1
- package/dist/components/sd-button.js +1 -1
- package/dist/components/sd-calendar.js +1 -1
- package/dist/components/sd-callout.js +1 -1
- package/dist/components/sd-checkbox.js +1 -1
- package/dist/components/sd-chip-input.js +1 -1
- package/dist/components/sd-chip.js +1 -1
- package/dist/components/sd-circle-progress.js +1 -1
- package/dist/components/sd-confirm-modal.js +1 -1
- package/dist/components/sd-date-picker-trigger.js +1 -1
- package/dist/components/sd-date-picker.js +1 -1
- package/dist/components/sd-date-range-picker-calendar.js +1 -1
- package/dist/components/sd-date-range-picker.js +1 -1
- package/dist/components/sd-divider.js +1 -1
- package/dist/components/sd-dropdown-button.js +1 -1
- package/dist/components/sd-field.js +1 -1
- package/dist/components/sd-file-picker.js +1 -1
- package/dist/components/sd-floating-portal.js +1 -1
- package/dist/components/sd-ghost-button.js +1 -1
- package/dist/components/sd-guide.js +1 -1
- package/dist/components/sd-icon.js +1 -1
- package/dist/components/sd-input.js +1 -1
- package/dist/components/sd-key-value-table.js +1 -1
- package/dist/components/sd-linear-progress.js +1 -1
- package/dist/components/sd-loading-container.js +1 -1
- package/dist/components/sd-loading-modal.js +1 -1
- package/dist/components/sd-modal-container.js +1 -1
- package/dist/components/sd-number-input.js +1 -1
- package/dist/components/sd-pagination.js +1 -1
- package/dist/components/sd-popover.js +1 -1
- package/dist/components/sd-popup.js +1 -1
- package/dist/components/sd-portal.js +1 -1
- package/dist/components/sd-select-list-item-search.js +1 -1
- package/dist/components/sd-select-list-item.js +1 -1
- package/dist/components/sd-select-listbox.js +1 -1
- package/dist/components/sd-select-trigger.js +1 -1
- package/dist/components/sd-select.js +1 -1
- package/dist/components/sd-switch.js +1 -1
- package/dist/components/sd-table.js +1 -1
- package/dist/components/sd-tabs.js +1 -1
- package/dist/components/sd-tag.js +1 -1
- package/dist/components/sd-tbody.js +1 -1
- package/dist/components/sd-td.js +1 -1
- package/dist/components/sd-text-link.js +1 -1
- package/dist/components/sd-textarea.js +1 -1
- package/dist/components/sd-thead.js +1 -1
- package/dist/components/sd-toast-container.js +1 -1
- package/dist/components/sd-toast.js +1 -1
- package/dist/components/sd-toggle.js +1 -1
- package/dist/components/sd-tooltip.js +1 -1
- package/dist/components/sd-tr.js +1 -1
- package/dist/design-system/design-system.esm.js +1 -1
- package/dist/design-system/index.esm.js +1 -1
- package/dist/design-system/{p-13b0db59.entry.js → p-0a772d43.entry.js} +1 -1
- package/dist/design-system/p-12306783.entry.js +1 -0
- package/dist/design-system/{p-b457611c.entry.js → p-1602a5fa.entry.js} +1 -1
- package/dist/design-system/p-1f3c1cca.entry.js +1 -0
- package/dist/design-system/{p-3045ffe1.entry.js → p-22484d65.entry.js} +1 -1
- package/dist/design-system/p-3caf2c5b.entry.js +1 -0
- package/dist/design-system/p-3f7349ae.entry.js +1 -0
- package/dist/design-system/{p-b8ea656d.entry.js → p-43529bba.entry.js} +1 -1
- package/dist/design-system/p-46da89f2.entry.js +1 -0
- package/dist/design-system/{p-a1f756ab.entry.js → p-4e1d76b8.entry.js} +1 -1
- package/dist/design-system/{p-03bcd782.entry.js → p-683c3b91.entry.js} +1 -1
- package/dist/design-system/{p-99ffe505.entry.js → p-6ce68bf2.entry.js} +1 -1
- package/dist/design-system/{p-a5131a43.entry.js → p-80bde621.entry.js} +1 -1
- package/dist/design-system/{p-22883fe1.entry.js → p-81aa23d1.entry.js} +1 -1
- package/dist/design-system/{p-c78b8822.entry.js → p-827f067b.entry.js} +1 -1
- package/dist/design-system/p-8a025f91.entry.js +1 -0
- package/dist/design-system/{p-3e62a3ea.entry.js → p-8a84a4fe.entry.js} +1 -1
- package/dist/design-system/{p-d2833150.entry.js → p-8f90620b.entry.js} +1 -1
- package/dist/design-system/{p-a0775a0c.entry.js → p-9124a1af.entry.js} +1 -1
- package/dist/design-system/p-BJfiMC9H.js +1 -0
- package/dist/design-system/p-CAFz8W8_.js +1 -0
- package/dist/design-system/{p-DGyTYauz.js → p-Cmg10jpN.js} +1 -1
- package/dist/design-system/p-U8VaRj9c.js +1 -0
- package/dist/design-system/{p-c6307ba4.entry.js → p-a263af1b.entry.js} +1 -1
- package/dist/design-system/p-aa312937.entry.js +1 -0
- package/dist/design-system/p-b4b20a86.entry.js +1 -0
- package/dist/design-system/{p-7eb31041.entry.js → p-bbbc4b27.entry.js} +1 -1
- package/dist/design-system/p-bcd7d358.entry.js +1 -0
- package/dist/design-system/{p-14340e46.entry.js → p-cc5f5bff.entry.js} +1 -1
- package/dist/design-system/{p-8140a225.entry.js → p-d5032f31.entry.js} +1 -1
- package/dist/design-system/{p-6d765b25.entry.js → p-e93dda25.entry.js} +1 -1
- package/dist/design-system/{p-c4e1641b.entry.js → p-f5190934.entry.js} +1 -1
- package/dist/design-system/p-ff939fbd.entry.js +1 -0
- package/dist/esm/component.listItem-U8VaRj9c.js +50 -0
- package/dist/esm/design-system.js +1 -1
- package/dist/esm/index.js +11 -0
- package/dist/esm/loader.js +1 -1
- package/dist/esm/sd-button_2.entry.js +54 -0
- package/dist/esm/sd-calendar_2.entry.js +2 -2
- package/dist/esm/sd-chip-input.entry.js +236 -18
- package/dist/esm/sd-circle-progress.entry.js +2 -2
- package/dist/esm/sd-confirm-modal_2.entry.js +3 -3
- package/dist/esm/sd-date-picker_7.entry.js +9 -9
- package/dist/esm/sd-date-range-picker-calendar.entry.js +1 -1
- package/dist/esm/sd-divider.entry.js +2 -2
- package/dist/esm/sd-dropdown-button.entry.js +17 -7
- package/dist/esm/sd-field_3.entry.js +8 -8
- package/dist/esm/sd-ghost-button_2.entry.js +2 -2
- package/dist/esm/sd-guide.entry.js +1 -1
- package/dist/esm/sd-key-value-table.entry.js +45 -9
- package/dist/esm/sd-linear-progress.entry.js +2 -2
- package/dist/esm/sd-loading-container.entry.js +2 -2
- package/dist/esm/sd-modal-container.entry.js +8 -1
- package/dist/esm/sd-pagination_4.entry.js +10 -10
- package/dist/esm/sd-popup.entry.js +2 -2
- package/dist/esm/sd-portal.entry.js +16 -12
- package/dist/esm/sd-select-list-item_2.entry.js +8 -7
- package/dist/esm/{sd-select.config-DtrsLG0Z.js → sd-select.config-D6ktrl7E.js} +4 -50
- package/dist/esm/sd-select_3.entry.js +12 -11
- package/dist/esm/sd-switch.entry.js +1 -1
- package/dist/esm/{sd-table.config-D9meRqTx.js → sd-table.config-B3wuA5wX.js} +1 -1
- package/dist/esm/sd-table.entry.js +8 -8
- package/dist/esm/sd-tabs.entry.js +1 -1
- package/dist/esm/sd-td.entry.js +1 -1
- package/dist/esm/sd-text-link.entry.js +4 -4
- package/dist/esm/sd-toast-container.entry.js +1 -1
- package/dist/esm/sd-toast.entry.js +2 -2
- package/dist/esm/sd-toggle.entry.js +1 -1
- package/dist/esm/{system-j2khhcHY.js → system-BJfiMC9H.js} +7 -0
- package/dist/types/components/assets/Bill.d.ts +1 -0
- package/dist/types/components/assets/Coupon.d.ts +1 -0
- package/dist/types/components/assets/Delete.d.ts +1 -0
- package/dist/types/components/assets/Dot.d.ts +1 -0
- package/dist/types/components/assets/Launcher.d.ts +1 -0
- package/dist/types/components/assets/Monitor.d.ts +1 -0
- package/dist/types/components/assets/Shield.d.ts +1 -0
- package/dist/types/components/assets/Sidebar.d.ts +1 -0
- package/dist/types/components/assets/Store.d.ts +1 -0
- package/dist/types/components/assets/index.d.ts +9 -0
- package/dist/types/components/sd-chip-input/sd-chip-input.config.d.ts +24 -0
- package/dist/types/components/sd-chip-input/sd-chip-input.d.ts +15 -0
- package/dist/types/components/sd-dropdown-button/sd-dropdown-button.config.d.ts +4 -0
- package/dist/types/components/sd-dropdown-button/sd-dropdown-button.d.ts +1 -0
- package/dist/types/components/sd-key-value-table/sd-key-value-table.config.d.ts +3 -2
- package/dist/types/components/sd-key-value-table/sd-key-value-table.d.ts +5 -0
- package/dist/types/components/sd-modal-container/sd-modal-container.config.d.ts +2 -0
- package/dist/types/components/sd-portal/sd-portal.d.ts +1 -0
- package/dist/types/components.d.ts +39 -0
- package/dist/types/utils/modal.d.ts +6 -0
- package/hydrate/index.js +547 -204
- package/hydrate/index.mjs +547 -204
- package/package.json +1 -1
- package/dist/components/p-6oSCGUOo.js +0 -1
- package/dist/components/p-BWoC-hMr.js +0 -1
- package/dist/components/p-C5wgHjtx.js +0 -1
- package/dist/components/p-Cftyepf_.js +0 -1
- package/dist/components/p-IgBxAXyL.js +0 -1
- package/dist/components/p-j2khhcHY.js +0 -1
- package/dist/design-system/p-0c5192b8.entry.js +0 -1
- package/dist/design-system/p-1652ae55.entry.js +0 -1
- package/dist/design-system/p-21fa7f85.entry.js +0 -1
- package/dist/design-system/p-2753c6c9.entry.js +0 -1
- package/dist/design-system/p-5c6dd20b.entry.js +0 -1
- package/dist/design-system/p-71739336.entry.js +0 -1
- package/dist/design-system/p-DtrsLG0Z.js +0 -1
- package/dist/design-system/p-b22cb811.entry.js +0 -1
- package/dist/design-system/p-b576bc21.entry.js +0 -1
- package/dist/design-system/p-c1f71355.entry.js +0 -1
- package/dist/design-system/p-da90b448.entry.js +0 -1
- package/dist/design-system/p-j2khhcHY.js +0 -1
|
@@ -53,7 +53,7 @@ const SdPortal = class {
|
|
|
53
53
|
createWrapper() {
|
|
54
54
|
this.wrapper = document.createElement('div');
|
|
55
55
|
Object.assign(this.wrapper.style, {
|
|
56
|
-
position: '
|
|
56
|
+
position: 'fixed',
|
|
57
57
|
top: '0',
|
|
58
58
|
left: '0',
|
|
59
59
|
zIndex: (this.zIndex ?? 998).toString(),
|
|
@@ -127,13 +127,13 @@ const SdPortal = class {
|
|
|
127
127
|
const wrapperRect = this.wrapper.getBoundingClientRect();
|
|
128
128
|
const availableBelow = viewport.height - parentRect.bottom - offset[1] - viewportPadding;
|
|
129
129
|
const availableAbove = parentRect.top - offset[1] - viewportPadding;
|
|
130
|
-
let top = parentRect.bottom +
|
|
131
|
-
let left = parentRect.left +
|
|
130
|
+
let top = parentRect.bottom + offset[1];
|
|
131
|
+
let left = parentRect.left + offset[0];
|
|
132
132
|
if (availableBelow < wrapperRect.height && availableAbove > availableBelow) {
|
|
133
|
-
top = parentRect.top
|
|
133
|
+
top = parentRect.top - wrapperRect.height - offset[1];
|
|
134
134
|
}
|
|
135
|
-
const minTop =
|
|
136
|
-
const maxTop =
|
|
135
|
+
const minTop = viewportPadding;
|
|
136
|
+
const maxTop = viewport.height - viewportPadding - wrapperRect.height;
|
|
137
137
|
if (maxTop < minTop) {
|
|
138
138
|
top = minTop;
|
|
139
139
|
}
|
|
@@ -141,10 +141,10 @@ const SdPortal = class {
|
|
|
141
141
|
top = Math.min(Math.max(top, minTop), maxTop);
|
|
142
142
|
}
|
|
143
143
|
if (parentRect.left + wrapperRect.width + offset[0] > viewport.width - viewportPadding) {
|
|
144
|
-
left = parentRect.right
|
|
144
|
+
left = parentRect.right - wrapperRect.width - offset[0];
|
|
145
145
|
}
|
|
146
|
-
const minLeft =
|
|
147
|
-
const maxLeft =
|
|
146
|
+
const minLeft = viewportPadding;
|
|
147
|
+
const maxLeft = viewport.width - viewportPadding - wrapperRect.width;
|
|
148
148
|
if (maxLeft < minLeft) {
|
|
149
149
|
left = minLeft;
|
|
150
150
|
}
|
|
@@ -211,21 +211,25 @@ const SdPortal = class {
|
|
|
211
211
|
}
|
|
212
212
|
return scrollParents;
|
|
213
213
|
}
|
|
214
|
+
isInsideTarget(target) {
|
|
215
|
+
return !!((this.wrapper?.contains(target)) ||
|
|
216
|
+
(this.parentRef?.contains(target)));
|
|
217
|
+
}
|
|
214
218
|
// 외부 클릭 감지
|
|
215
219
|
handleMouseDown(e) {
|
|
216
|
-
this.isInsideClick =
|
|
220
|
+
this.isInsideClick = this.isInsideTarget(e.target);
|
|
217
221
|
}
|
|
218
222
|
handleWindowClick(e) {
|
|
219
223
|
if (this.isInsideClick) {
|
|
220
224
|
this.isInsideClick = false;
|
|
221
225
|
return;
|
|
222
226
|
}
|
|
223
|
-
if (this.
|
|
227
|
+
if (this.isInsideTarget(e.target))
|
|
224
228
|
return;
|
|
225
229
|
this.close.emit();
|
|
226
230
|
}
|
|
227
231
|
render() {
|
|
228
|
-
return h("slot", { key: '
|
|
232
|
+
return h("slot", { key: '22e09896836d017f33a9c6b92772a00fc85f8997' });
|
|
229
233
|
}
|
|
230
234
|
static get watchers() { return {
|
|
231
235
|
"open": [{
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { r as registerInstance, c as createEvent, h } from './index-CAxodB5I.js';
|
|
2
|
-
import { g as LIST_ITEM_LAYOUT, i as isHtmlLabel, h as LIST_ITEM_TYPOGRAPHY, j as LIST_ITEM_COLORS, k as SEARCH_DEBOUNCE_MS } from './sd-select.config-
|
|
2
|
+
import { g as LIST_ITEM_LAYOUT, i as isHtmlLabel, h as LIST_ITEM_TYPOGRAPHY, j as LIST_ITEM_COLORS, k as SEARCH_DEBOUNCE_MS } from './sd-select.config-D6ktrl7E.js';
|
|
3
3
|
import { s as sanitizeInlineHtml } from './sanitize-inline-html-BE4tnQ2Z.js';
|
|
4
|
+
import './component.listItem-U8VaRj9c.js';
|
|
4
5
|
|
|
5
6
|
const sdSelectListItemCss = () => `sd-select-list-item{display:block}sd-select-list-item .sd-select-list-item{display:flex;align-items:center;gap:var(--list-item-gap);padding:var(--list-item-padding-y) var(--list-item-padding-right) var(--list-item-padding-y) var(--list-item-padding-left);font-size:var(--list-item-font-size);line-height:var(--list-item-line-height);font-weight:var(--list-item-font-weight);background:var(--list-item-bg);color:var(--list-item-color);cursor:default;user-select:none}sd-select-list-item .sd-select-list-item--selectable{cursor:pointer}sd-select-list-item .sd-select-list-item--depth1-group{border-top:var(--list-item-border-top);font-weight:700}sd-select-list-item .sd-select-list-item--depth2-group{font-weight:500}sd-select-list-item .sd-select-list-item--focused.sd-select-list-item--selectable:not(.sd-select-list-item--disabled){background:var(--list-item-bg-hover);color:var(--list-item-color-hover)}sd-select-list-item .sd-select-list-item--selected:not(.sd-select-list-item--group){font-weight:var(--list-item-font-weight-selected);color:var(--list-item-color-selected)}sd-select-list-item .sd-select-list-item--selected.sd-select-list-item--focused{color:var(--list-item-color-hover)}sd-select-list-item .sd-select-list-item--disabled{color:var(--list-item-color-disabled);cursor:not-allowed}sd-select-list-item .sd-select-list-item__label{flex:0 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}sd-select-list-item .sd-select-list-item__count{flex-shrink:0;font-weight:500;color:var(--list-item-color-disabled)}sd-select-list-item .sd-select-list-item--group.sd-select-list-item--focused .sd-select-list-item__count{color:#ffffff}sd-select-list-item .sd-select-list-item__checkbox{flex-shrink:0}`;
|
|
6
7
|
|
|
@@ -78,7 +79,7 @@ const SdSelectListItem = class {
|
|
|
78
79
|
return (
|
|
79
80
|
// 키보드 네비게이션은 부모 listbox 의 ArrowUp/Down + Enter 가 담당. 항목 자체는 role=option, tabindex=-1 으로 표시.
|
|
80
81
|
// eslint-disable-next-line jsx-a11y/click-events-have-key-events
|
|
81
|
-
h("div", { key: '
|
|
82
|
+
h("div", { key: 'c964b0cf5b064c74a7e063be21350bca8124d77d', role: "option", tabindex: -1, "aria-selected": this.isSelected === true ? 'true' : 'false', class: {
|
|
82
83
|
'sd-select-list-item': true,
|
|
83
84
|
'sd-select-list-item--group': isGroup,
|
|
84
85
|
'sd-select-list-item--depth1-group': isDepth1Group,
|
|
@@ -88,7 +89,7 @@ const SdSelectListItem = class {
|
|
|
88
89
|
'sd-select-list-item--focused': this.isFocused,
|
|
89
90
|
'sd-select-list-item--selectable': this.isSelectable && !this.option.disabled,
|
|
90
91
|
'sd-select-list-item--disabled': !!this.option.disabled,
|
|
91
|
-
}, style: cssVars, onClick: this.handleClick }, this.useCheckbox && (h("sd-checkbox", { key: '
|
|
92
|
+
}, style: cssVars, onClick: this.handleClick }, this.useCheckbox && (h("sd-checkbox", { key: '981e055f47aa512d18d61ae938b41942197f3088', value: this.isSelected === null ? null : !!this.isSelected, disabled: this.option.disabled, inverse: this.isFocused && this.isSelected !== false, class: "sd-select-list-item__checkbox", onClick: this.handleCheckboxClick, onSdUpdate: this.handleCheckboxUpdate })), isHtmlLabel(this.option.label) ? (h("span", { class: "sd-select-list-item__label", ref: el => el && (el.innerHTML = sanitizeInlineHtml(this.option.label)) })) : (h("span", { class: "sd-select-list-item__label" }, this.option.label)), this.countInfo && (h("span", { key: 'ac34372d921afcb3eba0a51bed3dd70b4e8f1d0f', class: "sd-select-list-item__count" }, "(", this.countInfo.selected, "/", this.countInfo.total, ")"))));
|
|
92
93
|
}
|
|
93
94
|
};
|
|
94
95
|
SdSelectListItem.style = sdSelectListItemCss();
|
|
@@ -141,15 +142,15 @@ const SdSelectListItemSearch = class {
|
|
|
141
142
|
clearTimeout(this.debounceTimer);
|
|
142
143
|
}
|
|
143
144
|
render() {
|
|
144
|
-
return (h("div", { key: '
|
|
145
|
+
return (h("div", { key: '6250cee5611a36f6c5fb317d7d24abeae1ed142f', class: {
|
|
145
146
|
'sd-select-list-item-search': true,
|
|
146
147
|
'sd-select-list-item-search--scrolled': this.isScrolled,
|
|
147
|
-
} }, h("div", { key: '
|
|
148
|
+
} }, h("div", { key: 'fa48adb1406c8922b61083a19cc270f02ddab100', class: "sd-select-list-item-search__inner" }, h("sd-icon", { key: '868519f09dc11fc4e9bde7a1148ce5ce666dd851', name: "search", size: 16, color: "grey_70", class: "sd-select-list-item-search__icon" }), h("input", { key: 'ff946fa2f360cd21eb785d13cb91e23f18abe05c', ref: el => {
|
|
148
149
|
this.inputEl = el;
|
|
149
|
-
}, type: "text", class: "sd-select-list-item-search__input", placeholder: "\uAC80\uC0C9\uC5B4 \uC785\uB825", value: this.searchText, onInput: this.handleInput, onFocus: () => this.searchFocus.emit() }), h("button", { key: '
|
|
150
|
+
}, type: "text", class: "sd-select-list-item-search__input", placeholder: "\uAC80\uC0C9\uC5B4 \uC785\uB825", value: this.searchText, onInput: this.handleInput, onFocus: () => this.searchFocus.emit() }), h("button", { key: 'e70e4c0af6e11f89d2893ae5bb28887a0ed8a5ee', type: "button", class: {
|
|
150
151
|
'sd-select-list-item-search__clear': true,
|
|
151
152
|
'sd-select-list-item-search__clear--hidden': this.searchText === '',
|
|
152
|
-
}, onClick: this.handleClear, tabindex: this.searchText !== '' ? 0 : -1, "aria-hidden": this.searchText !== '' ? 'false' : 'true' }, h("sd-icon", { key: '
|
|
153
|
+
}, onClick: this.handleClear, tabindex: this.searchText !== '' ? 0 : -1, "aria-hidden": this.searchText !== '' ? 'false' : 'true' }, h("sd-icon", { key: '57b4af6446a565b6e1e95153e8553b1c3c363a33', name: "close", size: 12, color: "#888888" })))));
|
|
153
154
|
}
|
|
154
155
|
};
|
|
155
156
|
SdSelectListItemSearch.style = sdSelectListItemSearchCss();
|
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
import { l as listBoxTokens, a as listItemTokens } from './component.listItem-U8VaRj9c.js';
|
|
2
|
+
|
|
1
3
|
const select = {
|
|
2
4
|
sm: {
|
|
3
5
|
paddingX: "12",
|
|
@@ -19,54 +21,6 @@ var selectTokens = {
|
|
|
19
21
|
select: select
|
|
20
22
|
};
|
|
21
23
|
|
|
22
|
-
const listItem = {
|
|
23
|
-
paddingY: "4",
|
|
24
|
-
paddingRight: "12",
|
|
25
|
-
gap: "8",
|
|
26
|
-
paddingLeft: {
|
|
27
|
-
depth1: "12",
|
|
28
|
-
depth2: "20",
|
|
29
|
-
depth3: "28"
|
|
30
|
-
},
|
|
31
|
-
typography: {
|
|
32
|
-
"default": {
|
|
33
|
-
fontWeight: "400",
|
|
34
|
-
fontSize: "12",
|
|
35
|
-
lineHeight: "20"},
|
|
36
|
-
selected: {
|
|
37
|
-
fontWeight: "700"}
|
|
38
|
-
},
|
|
39
|
-
bg: {
|
|
40
|
-
"default": "#FFFFFF",
|
|
41
|
-
hover: "#0075FF"
|
|
42
|
-
},
|
|
43
|
-
content: {
|
|
44
|
-
"default": "#222222",
|
|
45
|
-
hover: "#FFFFFF",
|
|
46
|
-
disabled: "#888888",
|
|
47
|
-
selected: "#0075FF"
|
|
48
|
-
},
|
|
49
|
-
depth1: {
|
|
50
|
-
bg: {
|
|
51
|
-
"default": "#EFF6FF"},
|
|
52
|
-
border: {
|
|
53
|
-
color: "#E1E1E1",
|
|
54
|
-
width: "1"
|
|
55
|
-
}},
|
|
56
|
-
depth2: {
|
|
57
|
-
middle: {
|
|
58
|
-
bg: "#F6F6F6"}
|
|
59
|
-
}};
|
|
60
|
-
var listItemTokens = {
|
|
61
|
-
listItem: listItem
|
|
62
|
-
};
|
|
63
|
-
|
|
64
|
-
const listBox = {
|
|
65
|
-
radius: "4"};
|
|
66
|
-
var listBoxTokens = {
|
|
67
|
-
listBox: listBox
|
|
68
|
-
};
|
|
69
|
-
|
|
70
24
|
// ── Select Trigger Tokens ──
|
|
71
25
|
const SELECT_LAYOUT = {
|
|
72
26
|
paddingX: selectTokens.select.sm.paddingX,
|
|
@@ -146,10 +100,10 @@ function countLeaves(options) {
|
|
|
146
100
|
}, 0);
|
|
147
101
|
}
|
|
148
102
|
function filterTree(options, keyword) {
|
|
149
|
-
const lowerKeyword = keyword.toLowerCase();
|
|
103
|
+
const lowerKeyword = (keyword ?? '').toLowerCase();
|
|
150
104
|
return options.reduce((acc, option) => {
|
|
151
105
|
const labelText = isHtmlLabel(option.label) ? extractText(option.label) : option.label;
|
|
152
|
-
const selfMatch = labelText.toLowerCase().includes(lowerKeyword);
|
|
106
|
+
const selfMatch = labelText != null && labelText.toLowerCase().includes(lowerKeyword);
|
|
153
107
|
if (option.children) {
|
|
154
108
|
// 그룹: 자식은 항상 추가로 필터링한다.
|
|
155
109
|
// - 자식 중 일치하는 게 있으면 그 자식들만 노출
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import { r as registerInstance, c as createEvent, a as getElement, h } from './index-CAxodB5I.js';
|
|
2
2
|
import { n as nanoid } from './index-CCwNgVmC.js';
|
|
3
|
-
import { c as countLeaves, S as SEARCH_THRESHOLD, f as filterTree, i as isHtmlLabel, e as extractText, E as EMPTY_MESSAGE, L as LIST_BOX_LAYOUT, a as SELECT_COLORS, b as SELECT_TYPOGRAPHY, d as SELECT_LAYOUT } from './sd-select.config-
|
|
3
|
+
import { c as countLeaves, S as SEARCH_THRESHOLD, f as filterTree, i as isHtmlLabel, e as extractText, E as EMPTY_MESSAGE, L as LIST_BOX_LAYOUT, a as SELECT_COLORS, b as SELECT_TYPOGRAPHY, d as SELECT_LAYOUT } from './sd-select.config-D6ktrl7E.js';
|
|
4
4
|
import { s as sanitizeInlineHtml } from './sanitize-inline-html-BE4tnQ2Z.js';
|
|
5
|
+
import './component.listItem-U8VaRj9c.js';
|
|
5
6
|
|
|
6
7
|
const sdSelectCss = () => `sd-select{display:inline-flex}sd-select sd-portal{display:none}sd-select .sd-select{position:relative;width:100%;height:100%}`;
|
|
7
8
|
|
|
@@ -264,15 +265,15 @@ const SdSelect = class {
|
|
|
264
265
|
this.closeDropdown();
|
|
265
266
|
},
|
|
266
267
|
};
|
|
267
|
-
return (h("sd-field", { key: '
|
|
268
|
+
return (h("sd-field", { key: 'fced3680a535c60d5750908acf1226426e12182b', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, addonAlign: this.addonAlign, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, onMouseEnter: () => {
|
|
268
269
|
this.hovered = true;
|
|
269
270
|
}, onMouseLeave: () => {
|
|
270
271
|
this.hovered = false;
|
|
271
|
-
} }, h("div", { key: '
|
|
272
|
+
} }, h("div", { key: '38d53e92c022affd40bfc7951bbcdf7e02071446', class: "sd-select", ref: el => {
|
|
272
273
|
this.triggerRef = el;
|
|
273
|
-
} }, h("sd-select-trigger", { key: '
|
|
274
|
+
} }, h("sd-select-trigger", { key: '9cd9bdb89db37204f9a5c312d26277da772b1209', ref: el => {
|
|
274
275
|
this.triggerComponentRef = el;
|
|
275
|
-
}, displayText: this.displayText, placeholder: this.placeholder ?? '선택', disabled: this.disabled, isOpen: this.isOpen, onSdTriggerClick: this.handleTriggerClick, onSdTriggerFocus: this.handleTriggerFocus, onSdTriggerBlur: this.handleTriggerBlur })), (this.isOpen || this.isAnimatingOut) && (h("sd-portal", { key: '
|
|
276
|
+
}, displayText: this.displayText, placeholder: this.placeholder ?? '선택', disabled: this.disabled, isOpen: this.isOpen, onSdTriggerClick: this.handleTriggerClick, onSdTriggerFocus: this.handleTriggerFocus, onSdTriggerBlur: this.handleTriggerBlur })), (this.isOpen || this.isAnimatingOut) && (h("sd-portal", { key: '8666dc885f3dcbae13011fd312eb72b7e6c906d9', ...portalProps }, h("sd-select-listbox", { key: '04e6dba3d2837cbef68ded80bd2f89c5bbe9dc01', type: this.type, options: this.options, value: this.value, emitValue: this.emitValue, useSearch: this.useSearch, useSelectAll: this.useSelectAll, triggerWidth: this.dropdownWidth || this.triggerWidth, maxWidth: this.resolvedMaxDropdownWidth, maxHeight: this.resolvedDropdownHeight, onSdOptionSelect: event => this.handleOptionSelect(event.detail) })))));
|
|
276
277
|
}
|
|
277
278
|
static get watchers() { return {
|
|
278
279
|
"isOpen": [{
|
|
@@ -350,14 +351,14 @@ const SdSelectListbox = class {
|
|
|
350
351
|
return count >= SEARCH_THRESHOLD;
|
|
351
352
|
}
|
|
352
353
|
get filteredOptions() {
|
|
353
|
-
if (this.searchKeyword === '')
|
|
354
|
+
if (this.searchKeyword == null || this.searchKeyword === '')
|
|
354
355
|
return this.options;
|
|
355
356
|
if (this.isDepth)
|
|
356
357
|
return filterTree(this.options, this.searchKeyword);
|
|
357
358
|
const keyword = this.searchKeyword.toLowerCase();
|
|
358
359
|
return this.options.filter(o => {
|
|
359
360
|
const labelText = isHtmlLabel(o.label) ? extractText(o.label) : o.label;
|
|
360
|
-
return labelText.toLowerCase().includes(keyword);
|
|
361
|
+
return labelText != null && labelText.toLowerCase().includes(keyword);
|
|
361
362
|
});
|
|
362
363
|
}
|
|
363
364
|
get isEmpty() {
|
|
@@ -639,9 +640,9 @@ const SdSelectListbox = class {
|
|
|
639
640
|
'--listbox-max-height': this.maxHeight ?? '260px',
|
|
640
641
|
'--listbox-radius': `${LIST_BOX_LAYOUT.radius}px`,
|
|
641
642
|
};
|
|
642
|
-
return (h("div", { key: '
|
|
643
|
+
return (h("div", { key: 'fe30af2954ea5669f2071698e6ef9e2b26244d9b', class: "sd-select-listbox", style: cssVars }, this.showSearch && (h("sd-select-list-item-search", { key: 'aa7ce87d8c0c7163921445325121562603edd960', isScrolled: this.isScrolled, onSdSearchFilter: this.handleSearchFilter })), h("div", { key: 'e8b5b3f73653ddc5096101f7109d427de1efa93a', class: "sd-select-listbox__list", onScroll: this.handleScroll, ref: el => {
|
|
643
644
|
this.listEl = el;
|
|
644
|
-
} }, this.showSelectAll && (h("sd-select-list-item", { key: '
|
|
645
|
+
} }, this.showSelectAll && (h("sd-select-list-item", { key: '7fbde730eca0b8234475b714ea38a4393425410e', option: SdSelectListbox.SELECT_ALL_OPTION, depth: 1, isSelected: this.selectAllState, isFocused: this.isOptionFocused(SdSelectListbox.SELECT_ALL_OPTION), useCheckbox: true, onSdListItemClick: this.handleSelectAllClick, onMouseEnter: () => this.handleOptionHover(SdSelectListbox.SELECT_ALL_OPTION) })), this.isEmpty ? (h("div", { class: "sd-select-listbox__empty" }, EMPTY_MESSAGE)) : this.isDepth ? (this.renderOptions(this.filteredOptions)) : (this.filteredOptions.map(option => (h("sd-select-list-item", { option: option, depth: 1, isSelected: this.isOptionSelected(option), isFocused: this.isOptionFocused(option), useCheckbox: this.isMulti, onSdListItemClick: this.handleOptionClick, onMouseEnter: () => this.handleOptionHover(option) })))))));
|
|
645
646
|
}
|
|
646
647
|
static get watchers() { return {
|
|
647
648
|
"searchKeyword": [{
|
|
@@ -701,7 +702,7 @@ const SdSelectTrigger = class {
|
|
|
701
702
|
? SELECT_COLORS.icon.disabled
|
|
702
703
|
: SELECT_COLORS.icon.default,
|
|
703
704
|
};
|
|
704
|
-
return (h("div", { key: '
|
|
705
|
+
return (h("div", { key: '0a929b8c0d68e25a64c352b5ea93b2e9c5f52611', ref: el => {
|
|
705
706
|
this.triggerEl = el;
|
|
706
707
|
}, role: "button", "aria-haspopup": "listbox", "aria-expanded": this.isOpen ? 'true' : 'false', tabindex: this.disabled ? -1 : 0, class: {
|
|
707
708
|
'sd-select-trigger': true,
|
|
@@ -712,7 +713,7 @@ const SdSelectTrigger = class {
|
|
|
712
713
|
e.preventDefault();
|
|
713
714
|
this.handleClick();
|
|
714
715
|
}
|
|
715
|
-
}, onFocus: this.handleFocus, onBlur: this.handleBlur }, h("div", { key: '
|
|
716
|
+
}, onFocus: this.handleFocus, onBlur: this.handleBlur }, h("div", { key: 'd8c91e392604c462aa9228147eb18c0b2ac13851', class: "sd-select-trigger__content" }, hasValue && isHtmlLabel(this.displayText) ? (h("span", { class: "sd-select-trigger__text", ref: el => el && (el.innerHTML = sanitizeInlineHtml(this.displayText)) })) : (h("span", { class: "sd-select-trigger__text" }, hasValue ? this.displayText : (this.placeholder ?? '선택'))), h("sd-icon", { key: '1afdcb944b30b675d4d2b31d6aeaa2ce41045d36', name: "chevronDown", size: 12, color: "var(--trigger-icon-color)", class: {
|
|
716
717
|
'sd-select-trigger__icon': true,
|
|
717
718
|
'sd-select-trigger__icon--open': this.isOpen,
|
|
718
719
|
} }))));
|
|
@@ -103,7 +103,7 @@ const SdSwitch = class {
|
|
|
103
103
|
'--sd-switch-line-height': `${SWITCH_TYPOGRAPHY.lineHeight}px`,
|
|
104
104
|
'--sd-switch-text-decoration': SWITCH_TYPOGRAPHY.textDecoration,
|
|
105
105
|
};
|
|
106
|
-
return (h("label", { key: '
|
|
106
|
+
return (h("label", { key: '8038810bfcf78ddea9ef73706689e19fdfe0b57f', "aria-label": this.label || 'switch', class: this.switchClasses, style: cssVars }, h("input", { key: 'ee4c60f379f20f56af01bafb0533e6b64bb3054a', type: "checkbox", checked: this.value, disabled: this.disabled, onInput: this.handleChange }), h("div", { key: '8ce56df6d631b742331466ded340298a888576c7', class: "sd-switch__track" }, h("div", { key: 'e02c48a7af9e005524b5d3ba8689e99dd42555f2', class: "sd-switch__knob" })), this.label && h("span", { key: 'c1533c489ef8d0a2b8374d2eaeeb0ac743a9c507', class: "sd-switch__label" }, this.label)));
|
|
107
107
|
}
|
|
108
108
|
};
|
|
109
109
|
SdSwitch.style = sdSwitchCss();
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { r as registerInstance, c as createEvent, a as getElement, d as readTask, f as forceUpdate, h, H as Host } from './index-CAxodB5I.js';
|
|
2
2
|
import { T as TABLE_ID_ATTR } from './constants-sZMi_32I.js';
|
|
3
|
-
import { T as TABLE_BODY_LAYOUT, a as TABLE_SELECTABLE_COLUMN_WIDTH, b as TABLE_BODY_TYPOGRAPHY, c as TABLE_BORDER, d as TABLE_RADIUS } from './sd-table.config-
|
|
3
|
+
import { T as TABLE_BODY_LAYOUT, a as TABLE_SELECTABLE_COLUMN_WIDTH, b as TABLE_BODY_TYPOGRAPHY, c as TABLE_BORDER, d as TABLE_RADIUS } from './sd-table.config-B3wuA5wX.js';
|
|
4
4
|
import './component.table-D6GUzecR.js';
|
|
5
|
-
import './system-
|
|
5
|
+
import './system-BJfiMC9H.js';
|
|
6
6
|
|
|
7
7
|
let urlAlphabet =
|
|
8
8
|
'useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict';
|
|
@@ -843,24 +843,24 @@ const SdTable = class {
|
|
|
843
843
|
'--table-selectable-width': `${TABLE_SELECTABLE_COLUMN_WIDTH}px`,
|
|
844
844
|
'--table-host-height': hostHeight,
|
|
845
845
|
};
|
|
846
|
-
return (h(Host, { key: '
|
|
846
|
+
return (h(Host, { key: '337909d6279baf60effec188eb60422ce47c0585', style: hostStyle }, h("div", { key: '46d53ced85e1700da3c6ca082d5752c0bb4a155b', class: "sd-table__container", style: {
|
|
847
847
|
'--table-width': this.width,
|
|
848
848
|
'--pagination-height': `${paginationHeight}px`,
|
|
849
|
-
} }, h("div", { key: '
|
|
849
|
+
} }, h("div", { key: '159fad6dec16b3328d0da4ce22ae6bca537046e9', class: {
|
|
850
850
|
'sd-table__wrapper': true,
|
|
851
851
|
'sd-table__wrapper--use-top': this.useTop,
|
|
852
|
-
} }, h("div", { key: '
|
|
852
|
+
} }, h("div", { key: '22acbc7de61e11807b1a8919090286bb04a98bed', class: {
|
|
853
853
|
'sd-table__scroll-container': true,
|
|
854
854
|
'sd-table__scroll-container--loading': this.isLoading,
|
|
855
855
|
'sd-table__scroll-container--no-data': isNoData,
|
|
856
|
-
} }, this.isLoading && (h("div", { key: '
|
|
856
|
+
} }, this.isLoading && (h("div", { key: '040736d35428396068d5237a17f23f8f70ba2541', class: "sd-table__loading", style: { top: `${this.loadingScrollTop}px` } }, h("sd-circle-progress", { key: 'eae076a71161e315951692f051522b8b5f094271', indeterminate: true }))), isNoData && (h(h.Fragment, null, h("div", { key: 'e8bdf5ae38a77988fce0a60ae9309f5d03b34928', class: "sd-table__no-data-header-overlay" }), h("div", { key: 'd6ce4d4479eb927137b1afd5494a91494568b274', class: "sd-table__no-data" }, h("div", { key: 'cfccc6382e7d0cc76d7f50515cd157ccd56cbac8', class: "sd-table__no-data-content", ref: el => {
|
|
857
857
|
this.noDataContentEl = el;
|
|
858
858
|
if (el)
|
|
859
859
|
this.syncNoDataContentObserver();
|
|
860
|
-
} }, h("slot", { key: '
|
|
860
|
+
} }, h("slot", { key: '45a2df0c0fa234408ca5a5fb76b5a74729cad482', name: "no-data" }, h("span", { key: 'a126d8ce4149ac87e55f5a6acc67bbb3a650cdf4' }, this.resolvedNoDataLabel)))))), h("table", { key: 'aa4b94ed02700edd1846ca51235f47fe7de570be', class: this.tableClasses }, this.autoThead ? (h("slot", { name: `${resolvedTableId}-head`, onSlotchange: this.handleStructureSlotChange }, h("sd-thead", { rows: this.rows ?? [] }))) : (h("slot", { name: `${resolvedTableId}-head`, onSlotchange: this.handleStructureSlotChange })), this.autoTbody ? (h("slot", { name: `${resolvedTableId}-body`, onSlotchange: this.handleStructureSlotChange }, h("sd-tbody", { rows: this.rows ?? [] }, this.renderAutoRows()))) : (h("slot", { name: `${resolvedTableId}-body`, onSlotchange: this.handleStructureSlotChange }))))), this.pagination &&
|
|
861
861
|
this.pagination.rowsPerPage > 0 &&
|
|
862
862
|
this.rowCount > 0 &&
|
|
863
|
-
!this.useVirtualScroll && (h("div", { key: '
|
|
863
|
+
!this.useVirtualScroll && (h("div", { key: 'f4d357d62af40e3ea8f35c799b4409c7deb2606f', class: "sd-table__pagination" }, h("sd-pagination", { key: '6aad139f1f06d1851f30b5c8331899fe9d23ba37', currentPage: !this.useInternalPagination ? this.pagination.page : this.currentPage, lastPage: !this.useInternalPagination ? this.pagination.lastPage : this.lastPageNumber, onSdPageChange: (e) => this.changePage(e.detail) }), this.useRowsPerPageSelect && (h("sd-select", { key: '85aa19726fca6dce007d8ffcc5550de8115546cb', value: this.useInternalPagination
|
|
864
864
|
? this.innerRowsPerPage
|
|
865
865
|
: this.pagination.rowsPerPage, options: this.rowsPerPageOption, width: "128px", emitValue: true, onSdUpdate: e => {
|
|
866
866
|
if (!this.isRowsPerPageValue(e.detail))
|
|
@@ -199,7 +199,7 @@ const SdTabs = class {
|
|
|
199
199
|
};
|
|
200
200
|
}
|
|
201
201
|
render() {
|
|
202
|
-
return (h("div", { key: '
|
|
202
|
+
return (h("div", { key: 'fd65e555621e8b9f9c8e93578f41f1c24a8cbeda', class: this.getContainerClasses(), style: this.buildCssVars() }, this.tabs.map((tab, index) => {
|
|
203
203
|
const badgeName = this.getBadgeName(tab);
|
|
204
204
|
return (h("div", { key: `tab-${index}`, role: "tab", tabindex: 0, "aria-selected": tab.value === this.value ? 'true' : 'false', class: this.getTabClasses(tab), "aria-label": tab.label || 'tab', onClick: () => this.handleTabClick(tab), onKeyDown: e => {
|
|
205
205
|
if (e.key === 'Enter' || e.key === ' ') {
|
package/dist/esm/sd-td.entry.js
CHANGED
|
@@ -156,7 +156,7 @@ const SdTd = class {
|
|
|
156
156
|
}
|
|
157
157
|
}
|
|
158
158
|
render() {
|
|
159
|
-
return (h(Host, { key: '
|
|
159
|
+
return (h(Host, { key: '02464050ab6179a4d19bc5885aff8c2690cc3dd6', class: { [`align-${this.align}`]: Boolean(this.align) } }, h("slot", { key: 'a4cde26644aea2e1a99690c407b7020b20bd3981' })));
|
|
160
160
|
}
|
|
161
161
|
static get watchers() { return {
|
|
162
162
|
"field": [{
|
|
@@ -131,7 +131,7 @@ const SdTextLink = class {
|
|
|
131
131
|
this.click.emit();
|
|
132
132
|
};
|
|
133
133
|
render() {
|
|
134
|
-
const sizeConfig = TEXT_LINK_SIZE_CONFIG[this.size];
|
|
134
|
+
const sizeConfig = TEXT_LINK_SIZE_CONFIG[this.size] ?? TEXT_LINK_SIZE_CONFIG.sm;
|
|
135
135
|
const typo = this.underline ? sizeConfig.typography.underline : sizeConfig.typography.default;
|
|
136
136
|
const labelClassName = ['sd-text-link__label', this.labelClass].filter(Boolean).join(' ');
|
|
137
137
|
const iconColor = this.disabled
|
|
@@ -145,7 +145,7 @@ const SdTextLink = class {
|
|
|
145
145
|
'--sd-text-link-text-decoration': typo.textDecoration,
|
|
146
146
|
...(this.disabled ? { '--sd-text-link-color': TEXT_LINK_COLORS.content.disabled } : {}),
|
|
147
147
|
};
|
|
148
|
-
return (h("span", { key: '
|
|
148
|
+
return (h("span", { key: '74e9dd05f3efa3ecfec4edca1b74c29bb7207894', role: "button", tabindex: this.disabled ? -1 : 0, class: {
|
|
149
149
|
'sd-text-link': true,
|
|
150
150
|
'sd-text-link--disabled': this.disabled,
|
|
151
151
|
}, style: cssVars, onClick: this.handleClick, onKeyDown: e => {
|
|
@@ -153,13 +153,13 @@ const SdTextLink = class {
|
|
|
153
153
|
e.preventDefault();
|
|
154
154
|
this.handleClick();
|
|
155
155
|
}
|
|
156
|
-
} }, this.icon && (h("sd-icon", { key: '
|
|
156
|
+
} }, this.icon && (h("sd-icon", { key: 'e60be0764adf889af988fd887582776d44239e07', name: this.icon, size: sizeConfig.iconSize, color: iconColor, class: "sd-text-link__icon" })), h("span", { key: '17996ef0620948fe1660945e68c9bb55e62fc982', class: labelClassName }, this.label), this.rightArrow && this.rightArrow !== 'none' && (h("span", { key: 'b9cfc03d4295beb9956f661032ea3fd1d9acfbe9', class: "sd-text-link__arrow", style: {
|
|
157
157
|
width: `${TEXT_LINK_ARROW.arrowFrame}px`,
|
|
158
158
|
height: `${TEXT_LINK_ARROW.arrowFrame}px`,
|
|
159
159
|
display: 'inline-flex',
|
|
160
160
|
alignItems: 'center',
|
|
161
161
|
justifyContent: 'center',
|
|
162
|
-
} }, h("sd-icon", { key: '
|
|
162
|
+
} }, h("sd-icon", { key: '6c2e4640a767acd5e66089e7e78f27c0fb8a0955', name: this.rightArrow === 'chevron' ? 'chevronRight' : 'caretRight', size: TEXT_LINK_ARROW.arrowIconSize, color: arrowColor })))));
|
|
163
163
|
}
|
|
164
164
|
};
|
|
165
165
|
SdTextLink.style = sdTextLinkCss();
|
|
@@ -232,7 +232,7 @@ const SdToastContainer = class {
|
|
|
232
232
|
const activeToasts = toasts.filter(t => t.state !== 'exiting').reverse();
|
|
233
233
|
const indexMap = new Map();
|
|
234
234
|
activeToasts.forEach((t, i) => indexMap.set(t.id, i));
|
|
235
|
-
return (h("div", { key: '
|
|
235
|
+
return (h("div", { key: '44b4f34b231186fd00ef9c1a65bd68a83fced6da', class: "sd-toast-container", style: this.getContainerStyles(), onMouseEnter: () => {
|
|
236
236
|
this.expanded = true;
|
|
237
237
|
this.pauseTimers();
|
|
238
238
|
}, onMouseLeave: () => {
|
|
@@ -82,12 +82,12 @@ const SdToast = class {
|
|
|
82
82
|
const linkColor = typeConfig.linkColor ?? typeConfig.content;
|
|
83
83
|
const useDefaultCloseIntent = ['default', 'caution', 'info'].includes(this.type);
|
|
84
84
|
const buttonName = TOAST_BUTTON_NAME_BY_TYPE[this.type] ?? TOAST_BUTTON_NAME_BY_TYPE.default;
|
|
85
|
-
return (h("div", { key: '
|
|
85
|
+
return (h("div", { key: '656bf6231262cc7d974adbe5f0ce0053d03aca84', style: {
|
|
86
86
|
'--sd-toast-bg': typeConfig.bg,
|
|
87
87
|
'--sd-toast-text': typeConfig.content,
|
|
88
88
|
'--sd-toast-icon': iconColor,
|
|
89
89
|
'--sd-toast-link': linkColor,
|
|
90
|
-
} }, h("div", { key: '
|
|
90
|
+
} }, h("div", { key: '1e15e50c926ce65cea86db069dd1e79a642da01c', class: "sd-toast", role: "status", "aria-live": "polite", "aria-atomic": "true" }, this.icon && (h("div", { key: '692277c23c4530d9fa0c5e26ea9d3b9759024dea', class: "sd-toast__icon" }, h("sd-icon", { key: '0a15993313f3a9d1f27d6ae727c2c248c3390701', name: this.icon, size: iconSize, color: iconColor }))), h("div", { key: '9c1af0c9cedbb772b9b59ae80a0ff861066aa0de', class: "sd-toast__content" }, h("span", { key: '2aacd89fe1cf31f271da027459a6cfaece3dbdbf', class: "sd-toast__message" }, this.message)), this.link && (h("a", { key: '094a68e843d9ab50cea46a506d6ccdc1ebf375d7', href: this.link, class: "sd-toast__link", target: "_blank", rel: "noopener noreferrer" }, this.linkLabel || this.link)), this.buttonLabel && (h("sd-button", { key: '7dabe182870a01cf285ee7441dfe39b07e943751', class: "sd-toast__button", name: buttonName, label: this.buttonLabel, onSdClick: (event) => this.buttonClick.emit(event.detail) })), this.useClose && (h("sd-ghost-button", { key: '2a893c6ace888d8f21ce16c9dbf2a35b23bc9372', class: "sd-toast__close", icon: "close", intent: useDefaultCloseIntent ? 'default' : 'inverse', ariaLabel: "close", size: "xs", onClick: () => this.close.emit() })))));
|
|
91
91
|
}
|
|
92
92
|
};
|
|
93
93
|
SdToast.style = sdToastCss();
|
|
@@ -118,7 +118,7 @@ const SdToggle = class {
|
|
|
118
118
|
'--sd-toggle-content-select': TOGGLE_COLORS.content.select,
|
|
119
119
|
'--sd-toggle-content-disabled': TOGGLE_COLORS.content.disabled,
|
|
120
120
|
};
|
|
121
|
-
return (h("label", { key: '
|
|
121
|
+
return (h("label", { key: '5657698c379c71e770b18006b5f5c69c122a06a7', class: this.toggleClasses, style: cssVars, "aria-label": this.label || 'toggle' }, this.label, h("input", { key: '8f72307d4efd029df200243cf670377aea2cff02', style: { display: 'none' }, type: "checkbox", onInput: this.handleChange })));
|
|
122
122
|
}
|
|
123
123
|
};
|
|
124
124
|
SdToggle.style = sdToggleCss();
|
|
@@ -1,3 +1,9 @@
|
|
|
1
|
+
const typography = {
|
|
2
|
+
feedback: {
|
|
3
|
+
sm: {
|
|
4
|
+
regular: {
|
|
5
|
+
fontSize: "12",
|
|
6
|
+
fontWeight: "400"}}}};
|
|
1
7
|
const color = {
|
|
2
8
|
bg: {
|
|
3
9
|
frame: "#FFFFFF",
|
|
@@ -30,6 +36,7 @@ const shadow = {
|
|
|
30
36
|
color: "rgba(34,34,34,0.2)"}
|
|
31
37
|
}};
|
|
32
38
|
var systemTokens = {
|
|
39
|
+
typography: typography,
|
|
33
40
|
color: color,
|
|
34
41
|
shadow: shadow
|
|
35
42
|
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const Bill: (props: any) => any;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const Coupon: (props: any) => any;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const Delete: (props: any) => any;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const Dot: (props: any) => any;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const Launcher: (props: any) => any;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const Monitor: (props: any) => any;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const Shield: (props: any) => any;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const Sidebar: (props: any) => any;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const Store: (props: any) => any;
|
|
@@ -10,6 +10,7 @@ export declare const Icons: {
|
|
|
10
10
|
readonly attachFile: (props: any) => any;
|
|
11
11
|
readonly barcode: (props: any) => any;
|
|
12
12
|
readonly bell: (props: any) => any;
|
|
13
|
+
readonly bill: (props: any) => any;
|
|
13
14
|
readonly board: (props: any) => any;
|
|
14
15
|
readonly box: (props: any) => any;
|
|
15
16
|
readonly camera: (props: any) => any;
|
|
@@ -34,8 +35,11 @@ export declare const Icons: {
|
|
|
34
35
|
readonly clockOutline: (props: any) => any;
|
|
35
36
|
readonly close: (props: any) => any;
|
|
36
37
|
readonly copy: (props: any) => any;
|
|
38
|
+
readonly coupon: (props: any) => any;
|
|
37
39
|
readonly dashboard: (props: any) => any;
|
|
38
40
|
readonly date: (props: any) => any;
|
|
41
|
+
readonly delete: (props: any) => any;
|
|
42
|
+
readonly dot: (props: any) => any;
|
|
39
43
|
readonly download: (props: any) => any;
|
|
40
44
|
readonly drag: (props: any) => any;
|
|
41
45
|
readonly edit: (props: any) => any;
|
|
@@ -48,10 +52,12 @@ export declare const Icons: {
|
|
|
48
52
|
readonly imageFill: (props: any) => any;
|
|
49
53
|
readonly imageOutline: (props: any) => any;
|
|
50
54
|
readonly inline: (props: any) => any;
|
|
55
|
+
readonly launcher: (props: any) => any;
|
|
51
56
|
readonly line: (props: any) => any;
|
|
52
57
|
readonly location: (props: any) => any;
|
|
53
58
|
readonly logout: (props: any) => any;
|
|
54
59
|
readonly minus: (props: any) => any;
|
|
60
|
+
readonly monitor: (props: any) => any;
|
|
55
61
|
readonly new: (props: any) => any;
|
|
56
62
|
readonly notificationFill: (props: any) => any;
|
|
57
63
|
readonly notificationOutline: (props: any) => any;
|
|
@@ -68,7 +74,10 @@ export declare const Icons: {
|
|
|
68
74
|
readonly save: (props: any) => any;
|
|
69
75
|
readonly search: (props: any) => any;
|
|
70
76
|
readonly setting: (props: any) => any;
|
|
77
|
+
readonly shield: (props: any) => any;
|
|
78
|
+
readonly sidebar: (props: any) => any;
|
|
71
79
|
readonly star: (props: any) => any;
|
|
80
|
+
readonly store: (props: any) => any;
|
|
72
81
|
readonly synchronize: (props: any) => any;
|
|
73
82
|
readonly updown: (props: any) => any;
|
|
74
83
|
readonly user: (props: any) => any;
|
|
@@ -32,3 +32,27 @@ export declare const CHIP_INPUT_RESET: {
|
|
|
32
32
|
iconColor: string;
|
|
33
33
|
labelColor: string;
|
|
34
34
|
};
|
|
35
|
+
export declare const CHIP_INPUT_MAX_COUNT: {
|
|
36
|
+
fontSize: string;
|
|
37
|
+
fontWeight: string;
|
|
38
|
+
color: string;
|
|
39
|
+
};
|
|
40
|
+
export declare const CHIP_INPUT_SUGGESTIONS: {
|
|
41
|
+
radius: string;
|
|
42
|
+
maxHeight: string;
|
|
43
|
+
itemPaddingY: string;
|
|
44
|
+
itemPaddingX: string;
|
|
45
|
+
itemPaddingRight: string;
|
|
46
|
+
itemGap: string;
|
|
47
|
+
itemFontSize: string;
|
|
48
|
+
itemFontWeight: string;
|
|
49
|
+
itemFontWeightSelected: string;
|
|
50
|
+
itemLineHeight: string;
|
|
51
|
+
itemFontFamily: string;
|
|
52
|
+
itemColor: string;
|
|
53
|
+
itemColorHover: string;
|
|
54
|
+
itemBgHover: string;
|
|
55
|
+
emptyColor: string;
|
|
56
|
+
emptyFontSize: string;
|
|
57
|
+
emptyLineHeight: string;
|
|
58
|
+
};
|