@customafk/lunas-ui 0.0.33 → 0.0.34
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/{add-new-Cj8K1Czh.cjs → add-new-C1-CCkbQ.cjs} +2 -2
- package/dist/{add-new-Cj8K1Czh.cjs.map → add-new-C1-CCkbQ.cjs.map} +1 -1
- package/dist/add-new-CIkUJq58.js +2 -0
- package/dist/{add-new-CPZxuEkP.js.map → add-new-CIkUJq58.js.map} +1 -1
- package/dist/{alert-dialog-ACHwFDPf.js → alert-dialog-6qa0-AL-.js} +2 -2
- package/dist/{alert-dialog-ACHwFDPf.js.map → alert-dialog-6qa0-AL-.js.map} +1 -1
- package/dist/{alert-dialog-lQEYgR6M.cjs → alert-dialog-uupOOu4w.cjs} +2 -2
- package/dist/{alert-dialog-lQEYgR6M.cjs.map → alert-dialog-uupOOu4w.cjs.map} +1 -1
- package/dist/{badge-CDuVH1Mj.cjs → badge-C5OQVVdj.cjs} +1 -1
- package/dist/{badge-CDuVH1Mj.cjs.map → badge-C5OQVVdj.cjs.map} +1 -1
- package/dist/{badge-q5yF26Mk.js → badge-DP4D6fsq.js} +1 -1
- package/dist/{badge-q5yF26Mk.js.map → badge-DP4D6fsq.js.map} +1 -1
- package/dist/{button-BoUygRNE.d.ts → button-3uYacIew.d.cts} +5 -4
- package/dist/{button-DPxiXJtr.d.cts → button-Bu7Ti4Ru.d.ts} +6 -5
- package/dist/{button-B57i_k5U.cjs → button-Db_CKSZw.cjs} +2 -2
- package/dist/{button-B57i_k5U.cjs.map → button-Db_CKSZw.cjs.map} +1 -1
- package/dist/{button-BJxq6PAQ.js → button-Pscu7CVU.js} +2 -2
- package/dist/{button-BJxq6PAQ.js.map → button-Pscu7CVU.js.map} +1 -1
- package/dist/{calendar-CSDEJP-b.cjs → calendar-DfzVqVmv.cjs} +2 -2
- package/dist/{calendar-CSDEJP-b.cjs.map → calendar-DfzVqVmv.cjs.map} +1 -1
- package/dist/{calendar-BW8M2GW_.js → calendar-u4FqjUKm.js} +2 -2
- package/dist/{calendar-BW8M2GW_.js.map → calendar-u4FqjUKm.js.map} +1 -1
- package/dist/cards/simple-card.d.cts +2 -2
- package/dist/{command-BmHb5JLj.cjs → command-BqUZEUTy.cjs} +2 -2
- package/dist/{command-BmHb5JLj.cjs.map → command-BqUZEUTy.cjs.map} +1 -1
- package/dist/{command-BMTaaAVA.js → command-C3siWT3g.js} +2 -2
- package/dist/{command-BMTaaAVA.js.map → command-C3siWT3g.js.map} +1 -1
- package/dist/{command-BenMcy0a.d.cts → command-DuKVGg2h.d.cts} +12 -12
- package/dist/{command-iFY6IzYs.d.ts → command-eTZ_8zR_.d.ts} +12 -12
- package/dist/data-display/country.cjs +1 -1
- package/dist/data-display/country.js +1 -1
- package/dist/data-display/data-list.cjs +1 -1
- package/dist/data-display/data-list.js +1 -1
- package/dist/data-display/date-tooltip.cjs +1 -1
- package/dist/data-display/date-tooltip.js +1 -1
- package/dist/data-display/date.cjs +1 -1
- package/dist/data-display/date.js +1 -1
- package/dist/data-display/empty.cjs +1 -1
- package/dist/data-display/empty.d.cts +2 -2
- package/dist/data-display/empty.d.ts +2 -2
- package/dist/data-display/empty.js +1 -1
- package/dist/data-display/name.cjs +1 -1
- package/dist/data-display/name.js +1 -1
- package/dist/data-display/phone-number.cjs +1 -1
- package/dist/data-display/phone-number.js +1 -1
- package/dist/data-display/role-badge.cjs +1 -1
- package/dist/data-display/role-badge.js +1 -1
- package/dist/data-display/statistic.cjs +1 -1
- package/dist/data-display/statistic.d.cts +2 -2
- package/dist/data-display/statistic.d.ts +2 -2
- package/dist/data-display/statistic.js +1 -1
- package/dist/{date-BMq_DNsv.js → date-B1g1OMYc.js} +1 -1
- package/dist/{date-BMq_DNsv.js.map → date-B1g1OMYc.js.map} +1 -1
- package/dist/{date-nd8WkPlx.cjs → date-Cw6Jf7k6.cjs} +1 -1
- package/dist/{date-nd8WkPlx.cjs.map → date-Cw6Jf7k6.cjs.map} +1 -1
- package/dist/{dialog-CguMVyyd.cjs → dialog-C712sXiq.cjs} +2 -2
- package/dist/{dialog-CguMVyyd.cjs.map → dialog-C712sXiq.cjs.map} +1 -1
- package/dist/{dialog-YTzM43YA.js → dialog-DEgx84P1.js} +2 -2
- package/dist/{dialog-YTzM43YA.js.map → dialog-DEgx84P1.js.map} +1 -1
- package/dist/{dialog-KnfZCHrN.d.ts → dialog-DRWITPUY.d.ts} +12 -12
- package/dist/{dialog-DC9nwyvF.d.cts → dialog-oAOedasX.d.cts} +12 -12
- package/dist/dialogs/confirm-dialog.cjs +1 -1
- package/dist/dialogs/confirm-dialog.js +1 -1
- package/dist/dialogs/detail-dialog/component/sidebar.cjs +1 -1
- package/dist/dialogs/detail-dialog/component/sidebar.d.cts +30 -30
- package/dist/dialogs/detail-dialog/component/sidebar.d.ts +4 -4
- package/dist/dialogs/detail-dialog/component/sidebar.js +1 -1
- package/dist/dialogs/detail-dialog/index.cjs +1 -1
- package/dist/dialogs/detail-dialog/index.js +1 -1
- package/dist/dialogs/error-dialog.cjs +1 -1
- package/dist/dialogs/error-dialog.js +1 -1
- package/dist/dialogs/form-dialog.cjs +1 -1
- package/dist/dialogs/form-dialog.d.ts +2 -2
- package/dist/dialogs/form-dialog.js +1 -1
- package/dist/dialogs/loading-dialog.cjs +1 -1
- package/dist/dialogs/loading-dialog.js +1 -1
- package/dist/dropdown-menu-B8ugkLB5.cjs +2 -0
- package/dist/dropdown-menu-B8ugkLB5.cjs.map +1 -0
- package/dist/dropdown-menu-DiM3sKIv.js +2 -0
- package/dist/dropdown-menu-DiM3sKIv.js.map +1 -0
- package/dist/{error-dialog-AnOiRms-.js → error-dialog-Bbu3oJO-.js} +2 -2
- package/dist/{error-dialog-AnOiRms-.js.map → error-dialog-Bbu3oJO-.js.map} +1 -1
- package/dist/{error-dialog-BA46Lm8p.cjs → error-dialog-CmPmHWv-.cjs} +2 -2
- package/dist/{error-dialog-BA46Lm8p.cjs.map → error-dialog-CmPmHWv-.cjs.map} +1 -1
- package/dist/{flex-CNA_SId-.cjs → flex-B5MQmxX8.cjs} +1 -1
- package/dist/{flex-CNA_SId-.cjs.map → flex-B5MQmxX8.cjs.map} +1 -1
- package/dist/{flex-ILvQrYMJ.js → flex-CBAzUoXK.js} +1 -1
- package/dist/{flex-ILvQrYMJ.js.map → flex-CBAzUoXK.js.map} +1 -1
- package/dist/{form-CHs85hm6.cjs → form-D13wOyun.cjs} +2 -2
- package/dist/{form-CHs85hm6.cjs.map → form-D13wOyun.cjs.map} +1 -1
- package/dist/{form-tabDlutX.js → form-DZqGhxta.js} +2 -2
- package/dist/{form-tabDlutX.js.map → form-DZqGhxta.js.map} +1 -1
- package/dist/{form-wrapper-DBV6X6Db.js → form-wrapper-Brw2tcHJ.js} +2 -2
- package/dist/{form-wrapper-DBV6X6Db.js.map → form-wrapper-Brw2tcHJ.js.map} +1 -1
- package/dist/{form-wrapper-BqbIZ1z1.cjs → form-wrapper-DH49h1Pa.cjs} +2 -2
- package/dist/{form-wrapper-BqbIZ1z1.cjs.map → form-wrapper-DH49h1Pa.cjs.map} +1 -1
- package/dist/forms/combobox-field.cjs +1 -1
- package/dist/forms/combobox-field.cjs.map +1 -1
- package/dist/forms/combobox-field.d.cts +2 -2
- package/dist/forms/combobox-field.d.ts +2 -2
- package/dist/forms/combobox-field.js +1 -1
- package/dist/forms/combobox-field.js.map +1 -1
- package/dist/forms/date-field.cjs +1 -1
- package/dist/forms/date-field.d.ts +2 -2
- package/dist/forms/date-field.js +1 -1
- package/dist/forms/form-wrapper.cjs +1 -1
- package/dist/forms/form-wrapper.d.cts +2 -2
- package/dist/forms/form-wrapper.js +1 -1
- package/dist/forms/multi-select-field.cjs +1 -1
- package/dist/forms/multi-select-field.cjs.map +1 -1
- package/dist/forms/multi-select-field.d.cts +2 -2
- package/dist/forms/multi-select-field.d.ts +2 -2
- package/dist/forms/multi-select-field.js +1 -1
- package/dist/forms/number-field.cjs +1 -1
- package/dist/forms/number-field.cjs.map +1 -1
- package/dist/forms/number-field.d.cts +2 -2
- package/dist/forms/number-field.d.ts +2 -2
- package/dist/forms/number-field.js +1 -1
- package/dist/forms/number-field.js.map +1 -1
- package/dist/forms/password-field.cjs +1 -1
- package/dist/forms/password-field.d.cts +2 -2
- package/dist/forms/password-field.d.ts +2 -2
- package/dist/forms/password-field.js +1 -1
- package/dist/forms/select-field.cjs +1 -1
- package/dist/forms/select-field.d.cts +2 -2
- package/dist/forms/select-field.d.ts +2 -2
- package/dist/forms/select-field.js +1 -1
- package/dist/forms/switch-field.cjs +1 -1
- package/dist/forms/switch-field.d.cts +2 -2
- package/dist/forms/switch-field.d.ts +2 -2
- package/dist/forms/switch-field.js +1 -1
- package/dist/forms/text-field.cjs +1 -1
- package/dist/forms/text-field.d.cts +2 -2
- package/dist/forms/text-field.d.ts +2 -2
- package/dist/forms/text-field.js +1 -1
- package/dist/forms/textarea-field.cjs +1 -1
- package/dist/forms/textarea-field.d.cts +2 -2
- package/dist/forms/textarea-field.js +1 -1
- package/dist/{input-zQM2qGNB.d.cts → input-8RZx48bn.d.cts} +3 -4
- package/dist/input-C-60EZ1K.cjs +2 -0
- package/dist/input-C-60EZ1K.cjs.map +1 -0
- package/dist/{input-CHksbruy.d.ts → input-CNvAUyl3.d.ts} +3 -4
- package/dist/input-nsu0-DwM.js +2 -0
- package/dist/input-nsu0-DwM.js.map +1 -0
- package/dist/{label-B_2ZQn0X.cjs → label-CW94D639.cjs} +1 -1
- package/dist/{label-B_2ZQn0X.cjs.map → label-CW94D639.cjs.map} +1 -1
- package/dist/{label-D1XmKlc3.js → label-DuddAB1p.js} +1 -1
- package/dist/{label-D1XmKlc3.js.map → label-DuddAB1p.js.map} +1 -1
- package/dist/layouts/app-layout/index.cjs +1 -1
- package/dist/layouts/app-layout/index.d.cts +3 -3
- package/dist/layouts/app-layout/index.d.ts +26 -26
- package/dist/layouts/app-layout/index.js +1 -1
- package/dist/layouts/flex.cjs +1 -1
- package/dist/layouts/flex.d.cts +2 -2
- package/dist/layouts/flex.d.ts +4 -4
- package/dist/layouts/flex.js +1 -1
- package/dist/layouts/main/index.cjs +1 -1
- package/dist/layouts/main/index.cjs.map +1 -1
- package/dist/layouts/main/index.d.ts +4 -4
- package/dist/layouts/main/index.js +1 -1
- package/dist/{multi-select-CgMIwUze.cjs → multi-select-D1CyXEEU.cjs} +2 -2
- package/dist/{multi-select-CgMIwUze.cjs.map → multi-select-D1CyXEEU.cjs.map} +1 -1
- package/dist/{multi-select-2gDBlVHu.js → multi-select-DNLyV99t.js} +2 -2
- package/dist/{multi-select-2gDBlVHu.js.map → multi-select-DNLyV99t.js.map} +1 -1
- package/dist/{paragraph-B4cQhLhW.js → paragraph-C0KfolV0.js} +1 -1
- package/dist/{paragraph-B4cQhLhW.js.map → paragraph-C0KfolV0.js.map} +1 -1
- package/dist/{paragraph-DcRBcRhQ.cjs → paragraph-JXci2Ihg.cjs} +1 -1
- package/dist/{paragraph-DcRBcRhQ.cjs.map → paragraph-JXci2Ihg.cjs.map} +1 -1
- package/dist/{popover-DCcPvdz2.cjs → popover-ByzBl1kH.cjs} +1 -1
- package/dist/{popover-DCcPvdz2.cjs.map → popover-ByzBl1kH.cjs.map} +1 -1
- package/dist/{popover-CTFp7ZXi.js → popover-DyoAfuhi.js} +1 -1
- package/dist/{popover-CTFp7ZXi.js.map → popover-DyoAfuhi.js.map} +1 -1
- package/dist/refresh-B6cTks2r.js +2 -0
- package/dist/{refresh-BLScMELs.js.map → refresh-B6cTks2r.js.map} +1 -1
- package/dist/{refresh-jFf3KQ-2.cjs → refresh-T1bZVS2m.cjs} +2 -2
- package/dist/{refresh-jFf3KQ-2.cjs.map → refresh-T1bZVS2m.cjs.map} +1 -1
- package/dist/{search-input-DqcwkgsY.js → search-input-BTzO9gpv.js} +2 -2
- package/dist/{search-input-DqcwkgsY.js.map → search-input-BTzO9gpv.js.map} +1 -1
- package/dist/{search-input-yweS9EMM.cjs → search-input-CDvluPxl.cjs} +2 -2
- package/dist/{search-input-yweS9EMM.cjs.map → search-input-CDvluPxl.cjs.map} +1 -1
- package/dist/select-BQqcz6WZ.cjs +2 -0
- package/dist/select-BQqcz6WZ.cjs.map +1 -0
- package/dist/select-RKVYJMTd.js +2 -0
- package/dist/select-RKVYJMTd.js.map +1 -0
- package/dist/{separator-BWBuPnbr.d.ts → separator-D5g8c5qg.d.ts} +3 -3
- package/dist/{separator-CM1kQQxq.d.cts → separator-DIIArEUd.d.cts} +3 -3
- package/dist/{sheet-DqPtcv9H.js → sheet-7EAzHejw.js} +2 -2
- package/dist/{sheet-DqPtcv9H.js.map → sheet-7EAzHejw.js.map} +1 -1
- package/dist/{sheet-CX3PajAc.cjs → sheet-C1xD7y3c.cjs} +2 -2
- package/dist/{sheet-CX3PajAc.cjs.map → sheet-C1xD7y3c.cjs.map} +1 -1
- package/dist/{sidebar-N_QJqMBE.cjs → sidebar-BXAkGEG6.cjs} +2 -2
- package/dist/{sidebar-N_QJqMBE.cjs.map → sidebar-BXAkGEG6.cjs.map} +1 -1
- package/dist/{sidebar-CQbg0LEV.cjs → sidebar-BmjgdQ-H.cjs} +2 -2
- package/dist/{sidebar-CQbg0LEV.cjs.map → sidebar-BmjgdQ-H.cjs.map} +1 -1
- package/dist/{sidebar-Ex4hQbd6.js → sidebar-COss4MdI.js} +2 -2
- package/dist/{sidebar-Ex4hQbd6.js.map → sidebar-COss4MdI.js.map} +1 -1
- package/dist/{sidebar-gO9wT3iV.js → sidebar-D9c0zxDI.js} +2 -2
- package/dist/{sidebar-gO9wT3iV.js.map → sidebar-D9c0zxDI.js.map} +1 -1
- package/dist/{switch-965kHdW_.js → switch-B9LmV-PS.js} +1 -1
- package/dist/{switch-965kHdW_.js.map → switch-B9LmV-PS.js.map} +1 -1
- package/dist/{switch-C3igCoxt.cjs → switch-bfoTi9s3.cjs} +1 -1
- package/dist/{switch-C3igCoxt.cjs.map → switch-bfoTi9s3.cjs.map} +1 -1
- package/dist/table/index.cjs +1 -1
- package/dist/table/index.d.cts +2 -2
- package/dist/table/index.d.ts +2 -2
- package/dist/table/index.js +1 -1
- package/dist/textarea-B9T9ZzvL.js +2 -0
- package/dist/textarea-B9T9ZzvL.js.map +1 -0
- package/dist/textarea-DzxaJFbk.cjs +2 -0
- package/dist/textarea-DzxaJFbk.cjs.map +1 -0
- package/dist/{toggle-A6eGkFij.js → toggle-BNtw9z70.js} +2 -2
- package/dist/{toggle-A6eGkFij.js.map → toggle-BNtw9z70.js.map} +1 -1
- package/dist/{toggle-MKfmKthf.d.cts → toggle-Dfa885le.d.cts} +5 -5
- package/dist/{toggle-ZyB3GPu7.d.ts → toggle-Du_U7mc3.d.ts} +4 -4
- package/dist/{toggle-B7nXBZ9r.cjs → toggle-eio6M2Fc.cjs} +2 -2
- package/dist/{toggle-B7nXBZ9r.cjs.map → toggle-eio6M2Fc.cjs.map} +1 -1
- package/dist/{tooltip-DLnAwybV.cjs → tooltip-Ci6WUOcz.cjs} +1 -1
- package/dist/{tooltip-DLnAwybV.cjs.map → tooltip-Ci6WUOcz.cjs.map} +1 -1
- package/dist/{tooltip-DFsHixOs.d.ts → tooltip-DL5DG_s3.d.ts} +6 -6
- package/dist/{tooltip-B8KdfOeT.js → tooltip-DkB0gnp9.js} +1 -1
- package/dist/{tooltip-B8KdfOeT.js.map → tooltip-DkB0gnp9.js.map} +1 -1
- package/dist/{tooltip-CSLkr6mF.d.cts → tooltip-Dmw3-czf.d.cts} +6 -6
- package/dist/{types-DaIHddx7.js → types-BVNbk1ZN.js} +1 -1
- package/dist/{types-DaIHddx7.js.map → types-BVNbk1ZN.js.map} +1 -1
- package/dist/{types-CrbWxjnp.cjs → types-CnMfjcgO.cjs} +1 -1
- package/dist/{types-CrbWxjnp.cjs.map → types-CnMfjcgO.cjs.map} +1 -1
- package/dist/typography/paragraph.cjs +1 -1
- package/dist/typography/paragraph.d.cts +2 -2
- package/dist/typography/paragraph.d.ts +2 -2
- package/dist/typography/paragraph.js +1 -1
- package/dist/typography/title.d.cts +2 -2
- package/dist/typography/title.d.ts +2 -2
- package/dist/ui/alert-dialog.cjs +1 -1
- package/dist/ui/alert-dialog.d.cts +12 -12
- package/dist/ui/alert-dialog.d.ts +12 -12
- package/dist/ui/alert-dialog.js +1 -1
- package/dist/ui/alert.d.cts +4 -4
- package/dist/ui/alert.d.ts +4 -4
- package/dist/ui/aspect-ratio.d.cts +2 -2
- package/dist/ui/aspect-ratio.d.ts +2 -2
- package/dist/ui/avatar.d.cts +4 -4
- package/dist/ui/avatar.d.ts +4 -4
- package/dist/ui/badge.cjs +1 -1
- package/dist/ui/badge.d.cts +4 -4
- package/dist/ui/badge.d.ts +4 -4
- package/dist/ui/badge.js +1 -1
- package/dist/ui/breadcrumb.cjs +1 -1
- package/dist/ui/breadcrumb.d.cts +8 -8
- package/dist/ui/breadcrumb.d.ts +8 -8
- package/dist/ui/breadcrumb.js +1 -1
- package/dist/ui/button.cjs +1 -1
- package/dist/ui/button.d.cts +1 -1
- package/dist/ui/button.d.ts +1 -1
- package/dist/ui/button.js +1 -1
- package/dist/ui/buttons/add-new.cjs +1 -1
- package/dist/ui/buttons/add-new.js +1 -1
- package/dist/ui/buttons/edit.cjs +1 -1
- package/dist/ui/buttons/edit.js +1 -1
- package/dist/ui/buttons/refresh.cjs +1 -1
- package/dist/ui/buttons/refresh.js +1 -1
- package/dist/ui/buttons/trash.cjs +1 -1
- package/dist/ui/buttons/trash.js +1 -1
- package/dist/ui/buttons/upload-image.cjs +1 -1
- package/dist/ui/buttons/upload-image.js +1 -1
- package/dist/ui/calendar.cjs +1 -1
- package/dist/ui/calendar.d.cts +4 -4
- package/dist/ui/calendar.d.ts +4 -4
- package/dist/ui/calendar.js +1 -1
- package/dist/ui/card.d.cts +8 -8
- package/dist/ui/card.d.ts +8 -8
- package/dist/ui/carousel.cjs +1 -1
- package/dist/ui/carousel.d.cts +7 -7
- package/dist/ui/carousel.d.ts +7 -7
- package/dist/ui/carousel.js +1 -1
- package/dist/ui/collapsible.d.cts +4 -4
- package/dist/ui/collapsible.d.ts +4 -4
- package/dist/ui/command.cjs +1 -1
- package/dist/ui/command.d.cts +2 -2
- package/dist/ui/command.d.ts +2 -2
- package/dist/ui/command.js +1 -1
- package/dist/ui/context-menu.cjs +1 -1
- package/dist/ui/context-menu.d.cts +16 -16
- package/dist/ui/context-menu.d.ts +16 -16
- package/dist/ui/context-menu.js +1 -1
- package/dist/ui/dialog.cjs +1 -1
- package/dist/ui/dialog.d.cts +1 -1
- package/dist/ui/dialog.d.ts +1 -1
- package/dist/ui/dialog.js +1 -1
- package/dist/ui/dropdown-menu.cjs +1 -1
- package/dist/ui/dropdown-menu.d.cts +16 -16
- package/dist/ui/dropdown-menu.d.ts +16 -16
- package/dist/ui/dropdown-menu.js +1 -1
- package/dist/ui/file-uploader.cjs +1 -1
- package/dist/ui/file-uploader.d.cts +2 -2
- package/dist/ui/file-uploader.d.ts +2 -2
- package/dist/ui/file-uploader.js +1 -1
- package/dist/ui/form.cjs +1 -1
- package/dist/ui/form.d.cts +7 -7
- package/dist/ui/form.d.ts +7 -7
- package/dist/ui/form.js +1 -1
- package/dist/ui/hover-card.d.cts +4 -4
- package/dist/ui/hover-card.d.ts +4 -4
- package/dist/ui/input-otp.d.cts +5 -5
- package/dist/ui/input-otp.d.ts +5 -5
- package/dist/ui/input.cjs +1 -1
- package/dist/ui/input.d.cts +1 -1
- package/dist/ui/input.d.ts +1 -1
- package/dist/ui/input.js +1 -1
- package/dist/ui/inputs/search-input.cjs +1 -1
- package/dist/ui/inputs/search-input.d.cts +3 -3
- package/dist/ui/inputs/search-input.d.ts +1 -1
- package/dist/ui/inputs/search-input.js +1 -1
- package/dist/ui/label.cjs +1 -1
- package/dist/ui/label.d.cts +2 -2
- package/dist/ui/label.d.ts +2 -2
- package/dist/ui/label.js +1 -1
- package/dist/ui/menubar.cjs +1 -1
- package/dist/ui/menubar.d.cts +17 -17
- package/dist/ui/menubar.d.ts +17 -17
- package/dist/ui/menubar.js +1 -1
- package/dist/ui/multi-select.cjs +1 -1
- package/dist/ui/multi-select.d.cts +2 -2
- package/dist/ui/multi-select.d.ts +2 -2
- package/dist/ui/multi-select.js +1 -1
- package/dist/ui/navigation-menu.cjs +1 -1
- package/dist/ui/navigation-menu.d.cts +11 -11
- package/dist/ui/navigation-menu.js +1 -1
- package/dist/ui/pagination.cjs +1 -1
- package/dist/ui/pagination.d.cts +9 -9
- package/dist/ui/pagination.d.ts +9 -9
- package/dist/ui/pagination.js +1 -1
- package/dist/ui/popover.cjs +1 -1
- package/dist/ui/popover.d.cts +5 -5
- package/dist/ui/popover.d.ts +5 -5
- package/dist/ui/popover.js +1 -1
- package/dist/ui/progress.d.cts +2 -2
- package/dist/ui/progress.d.ts +2 -2
- package/dist/ui/radio-group.cjs +1 -1
- package/dist/ui/radio-group.d.cts +3 -3
- package/dist/ui/radio-group.d.ts +3 -3
- package/dist/ui/radio-group.js +1 -1
- package/dist/ui/resizable.d.cts +4 -4
- package/dist/ui/resizable.d.ts +4 -4
- package/dist/ui/scroll-area.d.cts +3 -3
- package/dist/ui/scroll-area.d.ts +3 -3
- package/dist/ui/select.cjs +1 -1
- package/dist/ui/select.d.cts +11 -11
- package/dist/ui/select.d.ts +11 -11
- package/dist/ui/select.js +1 -1
- package/dist/ui/separator.d.cts +1 -1
- package/dist/ui/separator.d.ts +1 -1
- package/dist/ui/sheet.cjs +1 -1
- package/dist/ui/sheet.d.cts +9 -9
- package/dist/ui/sheet.d.ts +9 -9
- package/dist/ui/sheet.js +1 -1
- package/dist/ui/sidebar.cjs +1 -1
- package/dist/ui/sidebar.d.cts +30 -30
- package/dist/ui/sidebar.d.ts +28 -28
- package/dist/ui/sidebar.js +1 -1
- package/dist/ui/skeleton.d.cts +2 -2
- package/dist/ui/skeleton.d.ts +2 -2
- package/dist/ui/slider.d.cts +2 -2
- package/dist/ui/slider.d.ts +2 -2
- package/dist/ui/sonner.d.ts +2 -2
- package/dist/ui/switch.cjs +1 -1
- package/dist/ui/switch.d.cts +2 -2
- package/dist/ui/switch.d.ts +2 -2
- package/dist/ui/switch.js +1 -1
- package/dist/ui/table.d.cts +9 -9
- package/dist/ui/table.d.ts +9 -9
- package/dist/ui/tabs.d.cts +5 -5
- package/dist/ui/tabs.d.ts +5 -5
- package/dist/ui/textarea.cjs +1 -1
- package/dist/ui/textarea.d.cts +2 -2
- package/dist/ui/textarea.d.ts +2 -2
- package/dist/ui/textarea.js +1 -1
- package/dist/ui/toggle-group.cjs +1 -1
- package/dist/ui/toggle-group.d.cts +4 -4
- package/dist/ui/toggle-group.d.ts +5 -5
- package/dist/ui/toggle-group.js +1 -1
- package/dist/ui/toggle.cjs +1 -1
- package/dist/ui/toggle.d.cts +1 -1
- package/dist/ui/toggle.d.ts +1 -1
- package/dist/ui/toggle.js +1 -1
- package/dist/ui/tooltip.cjs +1 -1
- package/dist/ui/tooltip.d.cts +1 -1
- package/dist/ui/tooltip.d.ts +1 -1
- package/dist/ui/tooltip.js +1 -1
- package/package.json +1 -1
- package/dist/add-new-CPZxuEkP.js +0 -2
- package/dist/dropdown-menu-BnfaOPEM.cjs +0 -2
- package/dist/dropdown-menu-BnfaOPEM.cjs.map +0 -1
- package/dist/dropdown-menu-D5uG4HZA.js +0 -2
- package/dist/dropdown-menu-D5uG4HZA.js.map +0 -1
- package/dist/input--6vqz8UI.js +0 -2
- package/dist/input--6vqz8UI.js.map +0 -1
- package/dist/input-VZiryzkl.cjs +0 -2
- package/dist/input-VZiryzkl.cjs.map +0 -1
- package/dist/refresh-BLScMELs.js +0 -2
- package/dist/select-BHjk6yT3.cjs +0 -2
- package/dist/select-BHjk6yT3.cjs.map +0 -1
- package/dist/select-C6N3CXuY.js +0 -2
- package/dist/select-C6N3CXuY.js.map +0 -1
- package/dist/textarea-3XRFTUZ8.cjs +0 -2
- package/dist/textarea-3XRFTUZ8.cjs.map +0 -1
- package/dist/textarea-CQ6gAnm5.js +0 -2
- package/dist/textarea-CQ6gAnm5.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"multi-select-CgMIwUze.cjs","names":["React","groupOption: GroupOption","cn","CommandItem","value","Command","X","CommandPrimitive","CommandList","CommandSeparator","CommandGroup","Button","PlusIcon"],"sources":["../packages/components/ui/multi-select.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\nimport { Command as CommandPrimitive, useCommandState } from 'cmdk'\nimport { PlusIcon, X } from 'lucide-react'\n\nimport { Command, CommandGroup, CommandItem, CommandList, CommandSeparator } from '@/components/ui/command'\nimport { Button } from '@/components/ui/button'\nimport { cn } from '@/lib/utils'\n\nexport interface Option {\n value: string\n label: string\n disable?: boolean\n /** fixed option that can‘t be removed. */\n fixed?: boolean\n /** Group the options by providing key. */\n [key: string]: string | boolean | undefined\n}\ninterface GroupOption {\n [key: string]: Option[]\n}\n\ninterface MultipleSelectorProps {\n value?: Option[]\n defaultOptions?: Option[]\n /** manually controlled options */\n options?: Option[]\n placeholder?: string\n /** Loading component. */\n loadingIndicator?: React.ReactNode\n /** Empty component. */\n emptyIndicator?: React.ReactNode\n /** Debounce time for async search. Only work with `onSearch`. */\n delay?: number\n /**\n * Only work with `onSearch` prop. Trigger search when `onFocus`.\n * For example, when user click on the input, it will trigger the search to get initial options.\n **/\n triggerSearchOnFocus?: boolean\n /** async search */\n onSearch?: (value: string) => Promise<Option[]>\n /**\n * sync search. This search will not showing loadingIndicator.\n * The rest props are the same as async search.\n * i.e.: creatable, groupBy, delay.\n **/\n onSearchSync?: (value: string) => Option[]\n onChange?: (options: Option[]) => void\n /** Limit the maximum number of selected options. */\n maxSelected?: number\n /** When the number of selected options exceeds the limit, the onMaxSelected will be called. */\n onMaxSelected?: (maxLimit: number) => void\n /** Hide the placeholder when there are options selected. */\n hidePlaceholderWhenSelected?: boolean\n disabled?: boolean\n /** Group the options base on provided key. */\n groupBy?: string\n className?: string\n badgeClassName?: string\n /**\n * First item selected is a default behavior by cmdk. That is why the default is true.\n * This is a workaround solution by add a dummy item.\n *\n * @reference: https://github.com/pacocoursey/cmdk/issues/171\n */\n selectFirstItem?: boolean\n /** Allow user to create option when there is no option matched. */\n creatable?: boolean\n /** Props of `Command` */\n commandProps?: React.ComponentPropsWithoutRef<typeof Command>\n /** Props of `CommandInput` */\n inputProps?: Omit<React.ComponentPropsWithoutRef<typeof CommandPrimitive.Input>, 'value' | 'placeholder' | 'disabled'>\n /** hide the clear all button. */\n hideClearAllButton?: boolean\n\n /** Add new item event for select with search */\n onAddNewItem?: () => void\n}\n\nexport interface MultipleSelectorRef {\n selectedValue: Option[]\n input: HTMLInputElement\n focus: () => void\n reset: () => void\n}\n\n// eslint-disable-next-line react-refresh/only-export-components\nexport function useDebounce<T>(value: T, delay?: number): T {\n const [debouncedValue, setDebouncedValue] = React.useState<T>(value)\n\n React.useEffect(() => {\n const timer = setTimeout(() => setDebouncedValue(value), delay || 500)\n\n return () => {\n clearTimeout(timer)\n }\n }, [value, delay])\n\n return debouncedValue\n}\n\nfunction transToGroupOption(options: Option[], groupBy?: string) {\n if (options.length === 0) {\n return {}\n }\n if (!groupBy) {\n return {\n '': options,\n }\n }\n\n const groupOption: GroupOption = {}\n options.forEach((option) => {\n const key = (option[groupBy] as string) || ''\n if (!groupOption[key]) {\n groupOption[key] = []\n }\n groupOption[key].push(option)\n })\n return groupOption\n}\n\nfunction removePickedOption(groupOption: GroupOption, picked: Option[]) {\n const cloneOption = JSON.parse(JSON.stringify(groupOption)) as GroupOption\n\n for (const [key, value] of Object.entries(cloneOption)) {\n cloneOption[key] = value.filter((val) => !picked.find((p) => p.value === val.value))\n }\n return cloneOption\n}\n\nfunction isOptionsExist(groupOption: GroupOption, targetOption: Option[]) {\n for (const [, value] of Object.entries(groupOption)) {\n if (value.some((option) => targetOption.find((p) => p.value === option.value))) {\n return true\n }\n }\n return false\n}\n\n/**\n * The `CommandEmpty` of shadcn/ui will cause the cmdk empty not rendering correctly.\n * So we create one and copy the `Empty` implementation from `cmdk`.\n *\n * @reference: https://github.com/hsuanyi-chou/shadcn-ui-expansions/issues/34#issuecomment-1949561607\n **/\nconst CommandEmpty = React.forwardRef<HTMLDivElement, React.ComponentProps<typeof CommandPrimitive.Empty>>(({ className, ...props }, forwardedRef) => {\n const render = useCommandState((state) => state.filtered.count === 0)\n\n if (!render) return null\n\n return <div ref={forwardedRef} className={cn('px-2 py-4 text-center text-sm', className)} cmdk-empty=\"\" role=\"presentation\" {...props} />\n})\n\nCommandEmpty.displayName = 'CommandEmpty'\n\nexport const MultipleSelector = React.forwardRef<MultipleSelectorRef, MultipleSelectorProps>(\n (\n {\n value,\n onChange,\n placeholder,\n defaultOptions: arrayDefaultOptions = [],\n options: arrayOptions,\n delay,\n onSearch,\n onSearchSync,\n loadingIndicator: LoadingIndicator,\n emptyIndicator,\n maxSelected = Number.MAX_SAFE_INTEGER,\n onMaxSelected,\n hidePlaceholderWhenSelected,\n disabled,\n groupBy,\n className,\n badgeClassName,\n selectFirstItem = true,\n creatable = false,\n triggerSearchOnFocus = false,\n commandProps,\n inputProps,\n hideClearAllButton = false,\n onAddNewItem,\n }: MultipleSelectorProps,\n ref: React.Ref<MultipleSelectorRef>,\n ) => {\n const inputRef = React.useRef<HTMLInputElement>(null)\n const dropdownRef = React.useRef<HTMLDivElement>(null) // Added this\n\n const [open, setOpen] = React.useState(false)\n const [onScrollbar, setOnScrollbar] = React.useState(false)\n const [isLoading, setIsLoading] = React.useState(false)\n\n const [selected, setSelected] = React.useState<Option[]>(value || [])\n const [options, setOptions] = React.useState<GroupOption>(transToGroupOption(arrayDefaultOptions, groupBy))\n const [inputValue, setInputValue] = React.useState('')\n\n const debouncedSearchTerm = useDebounce(inputValue, delay || 500)\n\n React.useImperativeHandle(\n ref,\n () => ({\n selectedValue: [...selected],\n input: inputRef.current as HTMLInputElement,\n focus: () => inputRef?.current?.focus(),\n reset: () => setSelected([]),\n }),\n [selected],\n )\n\n const handleClickOutside = React.useCallback((event: MouseEvent | TouchEvent) => {\n if (dropdownRef.current && !dropdownRef.current.contains(event.target as Node) && inputRef.current && !inputRef.current.contains(event.target as Node)) {\n setOpen(false)\n inputRef.current.blur()\n }\n }, [])\n\n const handleUnselect = React.useCallback(\n (option: Option) => {\n const newOptions = selected.filter((s) => s.value !== option.value)\n setSelected(newOptions)\n onChange?.(newOptions)\n },\n [onChange, selected],\n )\n\n const handleKeyDown = React.useCallback(\n (e: React.KeyboardEvent<HTMLDivElement>) => {\n const input = inputRef.current\n if (!input) return\n\n if (e.key === 'Delete' || e.key === 'Backspace') {\n if (input.value === '' && selected.length > 0) {\n const lastSelectOption = selected[selected.length - 1]\n // If last item is fixed, we should not remove it.\n if (!lastSelectOption.fixed) {\n handleUnselect(selected[selected.length - 1])\n }\n }\n }\n\n // This is not a default behavior of the <input /> field\n if (e.key === 'Escape') {\n input.blur()\n }\n },\n [handleUnselect, selected],\n )\n\n React.useEffect(() => {\n if (open) {\n document.addEventListener('mousedown', handleClickOutside)\n document.addEventListener('touchend', handleClickOutside)\n } else {\n document.removeEventListener('mousedown', handleClickOutside)\n document.removeEventListener('touchend', handleClickOutside)\n }\n\n return () => {\n document.removeEventListener('mousedown', handleClickOutside)\n document.removeEventListener('touchend', handleClickOutside)\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [open])\n\n React.useEffect(() => {\n if (value) {\n setSelected(value)\n }\n }, [value])\n\n React.useEffect(() => {\n /** If `onSearch` is provided, do not trigger options updated. */\n if (!arrayOptions || onSearch) {\n return\n }\n const newOption = transToGroupOption(arrayOptions || [], groupBy)\n if (JSON.stringify(newOption) !== JSON.stringify(options)) {\n setOptions(newOption)\n }\n }, [arrayDefaultOptions, arrayOptions, groupBy, onSearch, options])\n\n React.useEffect(() => {\n /** sync search */\n\n const doSearchSync = () => {\n const res = onSearchSync?.(debouncedSearchTerm)\n setOptions(transToGroupOption(res || [], groupBy))\n }\n\n const exec = async () => {\n if (!onSearchSync || !open) return\n\n if (triggerSearchOnFocus) {\n doSearchSync()\n }\n\n if (debouncedSearchTerm) {\n doSearchSync()\n }\n }\n\n void exec()\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [debouncedSearchTerm, groupBy, open, triggerSearchOnFocus])\n\n React.useEffect(() => {\n /** async search */\n\n const doSearch = async () => {\n setIsLoading(true)\n const res = await onSearch?.(debouncedSearchTerm)\n setOptions(transToGroupOption(res || [], groupBy))\n setIsLoading(false)\n }\n\n const exec = async () => {\n if (!onSearch || !open) return\n\n if (triggerSearchOnFocus) {\n await doSearch()\n }\n\n if (debouncedSearchTerm) {\n await doSearch()\n }\n }\n\n void exec()\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [debouncedSearchTerm, groupBy, open, triggerSearchOnFocus])\n\n const CreatableItem = () => {\n if (!creatable) return undefined\n if (isOptionsExist(options, [{ value: inputValue, label: inputValue }]) || selected.find((s) => s.value === inputValue)) {\n return undefined\n }\n\n const Item = (\n <CommandItem\n value={inputValue}\n className=\"cursor-pointer\"\n onMouseDown={(e) => {\n e.preventDefault()\n e.stopPropagation()\n }}\n onSelect={(value: string) => {\n if (selected.length >= maxSelected) {\n onMaxSelected?.(selected.length)\n return\n }\n setInputValue('')\n const newOptions = [...selected, { value, label: value }]\n setSelected(newOptions)\n onChange?.(newOptions)\n }}\n >\n {`Create \"${inputValue}\"`}\n </CommandItem>\n )\n\n // For normal creatable\n if (!onSearch && inputValue.length > 0) {\n return Item\n }\n\n // For async search creatable. avoid showing creatable item before loading at first.\n if (onSearch && debouncedSearchTerm.length > 0 && !isLoading) {\n return Item\n }\n\n return undefined\n }\n\n const EmptyItem = React.useCallback(() => {\n if (!emptyIndicator) return undefined\n\n // For async search that showing emptyIndicator\n if (onSearch && !creatable && Object.keys(options).length === 0) {\n return (\n <CommandItem value=\"-\" disabled>\n {emptyIndicator}\n </CommandItem>\n )\n }\n\n return <CommandEmpty>{emptyIndicator}</CommandEmpty>\n }, [creatable, emptyIndicator, onSearch, options])\n\n const selectables = React.useMemo<GroupOption>(() => removePickedOption(options, selected), [options, selected])\n\n /** Avoid Creatable Selector freezing or lagging when paste a long string. */\n const commandFilter = React.useCallback(() => {\n if (commandProps?.filter) {\n return commandProps.filter\n }\n\n if (creatable) {\n return (value: string, search: string) => {\n return value.toLowerCase().includes(search.toLowerCase()) ? 1 : -1\n }\n }\n // Using default filter in `cmdk`. We don‘t have to provide it.\n return undefined\n }, [creatable, commandProps?.filter])\n\n return (\n <Command\n ref={dropdownRef}\n {...commandProps}\n onKeyDown={(e) => {\n handleKeyDown(e)\n commandProps?.onKeyDown?.(e)\n }}\n className={cn('h-auto overflow-visible bg-transparent', commandProps?.className)}\n shouldFilter={commandProps?.shouldFilter !== undefined ? commandProps.shouldFilter : !onSearch} // When onSearch is provided, we don‘t want to filter the options. You can still override it.\n filter={commandFilter()}\n >\n <div\n className={cn(\n 'border-border-weak relative rounded-md border text-sm transition-shadow',\n 'focus-within:border-primary',\n 'focus-within:ring-primary-weak',\n 'focus-within:ring-4',\n 'focus-within:outline-hidden',\n 'has-disabled:bg-muted',\n 'has-disabled:text-muted-foreground',\n selected.length !== 0 && 'p-1',\n !disabled && selected.length !== 0 && 'cursor-text',\n !hideClearAllButton && 'pe-9',\n className,\n )}\n onClick={() => {\n if (disabled) return\n inputRef?.current?.focus()\n }}\n >\n <div className=\"flex flex-wrap gap-1\">\n {selected.map((option) => {\n return (\n <div\n key={option.value}\n className={cn(\n 'animate-fadeIn',\n 'bg-background',\n 'hover:bg-background',\n 'border-border-weak border border-solid',\n 'text-text-positive-weak relative inline-flex h-7 cursor-default items-center rounded-md ps-2 pe-7 pl-2 text-xs font-medium transition-all',\n 'disabled:cursor-not-allowed',\n 'disabled:opacity-50',\n 'data-fixed:pe-2',\n badgeClassName,\n )}\n data-fixed={option.fixed}\n data-disabled={disabled || undefined}\n >\n {option.label}\n <button\n type=\"button\"\n disabled={disabled || option.fixed}\n className={cn(\n 'text-text-positive-muted absolute -inset-y-px -end-px flex size-7 items-center justify-center rounded-e-lg border border-transparent p-0 outline-0 transition-colors',\n 'hover:text-foreground',\n 'focus-visible:outline',\n 'focus-visible:outline-2',\n 'focus-visible:outline-primary-weak',\n 'disabled:hover:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50',\n )}\n onKeyDown={(e) => {\n if (e.key !== 'Enter') return\n handleUnselect(option)\n }}\n onMouseDown={(e) => {\n e.preventDefault()\n e.stopPropagation()\n }}\n onClick={() => handleUnselect(option)}\n aria-label=\"Remove\"\n >\n <X size={14} strokeWidth={2} aria-hidden=\"true\" />\n </button>\n </div>\n )\n })}\n {/* Avoid having the \"Search\" Icon */}\n <CommandPrimitive.Input\n {...inputProps}\n ref={inputRef}\n value={inputValue}\n disabled={disabled}\n onValueChange={(value) => {\n setInputValue(value)\n inputProps?.onValueChange?.(value)\n }}\n onBlur={(event) => {\n if (!onScrollbar) {\n setOpen(false)\n }\n inputProps?.onBlur?.(event)\n }}\n onFocus={(event) => {\n setOpen(true)\n if (triggerSearchOnFocus) {\n onSearch?.(debouncedSearchTerm)\n }\n inputProps?.onFocus?.(event)\n }}\n placeholder={hidePlaceholderWhenSelected && selected.length !== 0 ? '' : placeholder}\n className={cn(\n 'placeholder:text-text-positive-muted flex-1 bg-transparent outline-hidden',\n 'disabled:placeholder:text-transparent',\n {\n 'w-full': hidePlaceholderWhenSelected,\n 'px-3 py-2': selected.length === 0,\n 'ml-1': selected.length !== 0,\n },\n inputProps?.className,\n )}\n />\n <button\n type=\"button\"\n onClick={() => {\n setSelected(selected.filter((s) => s.fixed))\n onChange?.(selected.filter((s) => s.fixed))\n }}\n className={cn(\n 'text-muted-foreground/80',\n 'absolute end-0 top-0 flex size-9 items-center justify-center rounded-lg border border-transparent transition-colors',\n 'focus-visible:outline-2',\n 'hover:text-text-positive',\n 'focus-visible:outline-primary-weak',\n (hideClearAllButton || disabled || selected.length < 1 || selected.filter(({ fixed }) => fixed).length === selected.length) && 'hidden',\n )}\n aria-label=\"Clear all\"\n >\n <X size={16} strokeWidth={2} aria-hidden=\"true\" />\n </button>\n </div>\n </div>\n <div className=\"relative\">\n <div\n className={cn(\n 'shadow-dropdown absolute top-2 z-10 w-full overflow-hidden rounded-lg',\n 'data-[state=open]:animate-in',\n 'data-[state=closed]:animate-out',\n 'data-[state=closed]:fade-out-0',\n 'data-[state=open]:fade-in-0',\n 'data-[state=closed]:zoom-out-95',\n 'data-[state=open]:zoom-in-95',\n !open && 'hidden',\n )}\n data-state={open ? 'open' : 'closed'}\n >\n {open && (\n <CommandList\n className=\"shadow-lg outline-hidden\"\n onMouseLeave={() => {\n setOnScrollbar(false)\n }}\n onMouseEnter={() => {\n setOnScrollbar(true)\n }}\n onMouseUp={() => {\n inputRef?.current?.focus()\n }}\n >\n {onAddNewItem && (\n <>\n <CommandSeparator />\n <CommandGroup>\n <Button type=\"button\" variant=\"ghost\" className=\"w-full font-normal [&_div]:justify-start\" onClick={onAddNewItem}>\n <PlusIcon size={14} className=\"opacity-60\" aria-hidden=\"true\" />\n Thêm mới\n </Button>\n </CommandGroup>\n </>\n )}\n {isLoading ? (\n LoadingIndicator\n ) : (\n <React.Fragment>\n {EmptyItem()}\n {CreatableItem()}\n {!selectFirstItem && <CommandItem value=\"-\" className=\"hidden\" />}\n {Object.entries(selectables).map(([key, dropdowns]) => (\n <CommandGroup key={key} heading={key} className=\"h-full overflow-auto\">\n {dropdowns.map((option) => {\n return (\n <CommandItem\n key={option.value}\n value={option.value}\n disabled={option.disable}\n onMouseDown={(e) => {\n e.preventDefault()\n e.stopPropagation()\n }}\n onSelect={() => {\n if (selected.length >= maxSelected) {\n onMaxSelected?.(selected.length)\n return\n }\n const newOptions = [...selected, option]\n setInputValue('')\n setSelected(newOptions)\n onChange?.(newOptions)\n }}\n className={cn('cursor-pointer', option.disable && 'cursor-not-allowed opacity-50')}\n >\n {option.label}\n </CommandItem>\n )\n })}\n </CommandGroup>\n ))}\n </React.Fragment>\n )}\n </CommandList>\n )}\n </div>\n </div>\n </Command>\n )\n },\n)\n\nMultipleSelector.displayName = 'MultipleSelector'\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"multi-select-D1CyXEEU.cjs","names":["React","groupOption: GroupOption","cn","CommandItem","value","Command","X","CommandPrimitive","CommandList","CommandSeparator","CommandGroup","Button","PlusIcon"],"sources":["../packages/components/ui/multi-select.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\nimport { Command as CommandPrimitive, useCommandState } from 'cmdk'\nimport { PlusIcon, X } from 'lucide-react'\n\nimport { Command, CommandGroup, CommandItem, CommandList, CommandSeparator } from '@/components/ui/command'\nimport { Button } from '@/components/ui/button'\nimport { cn } from '@/lib/utils'\n\nexport interface Option {\n value: string\n label: string\n disable?: boolean\n /** fixed option that can‘t be removed. */\n fixed?: boolean\n /** Group the options by providing key. */\n [key: string]: string | boolean | undefined\n}\ninterface GroupOption {\n [key: string]: Option[]\n}\n\ninterface MultipleSelectorProps {\n value?: Option[]\n defaultOptions?: Option[]\n /** manually controlled options */\n options?: Option[]\n placeholder?: string\n /** Loading component. */\n loadingIndicator?: React.ReactNode\n /** Empty component. */\n emptyIndicator?: React.ReactNode\n /** Debounce time for async search. Only work with `onSearch`. */\n delay?: number\n /**\n * Only work with `onSearch` prop. Trigger search when `onFocus`.\n * For example, when user click on the input, it will trigger the search to get initial options.\n **/\n triggerSearchOnFocus?: boolean\n /** async search */\n onSearch?: (value: string) => Promise<Option[]>\n /**\n * sync search. This search will not showing loadingIndicator.\n * The rest props are the same as async search.\n * i.e.: creatable, groupBy, delay.\n **/\n onSearchSync?: (value: string) => Option[]\n onChange?: (options: Option[]) => void\n /** Limit the maximum number of selected options. */\n maxSelected?: number\n /** When the number of selected options exceeds the limit, the onMaxSelected will be called. */\n onMaxSelected?: (maxLimit: number) => void\n /** Hide the placeholder when there are options selected. */\n hidePlaceholderWhenSelected?: boolean\n disabled?: boolean\n /** Group the options base on provided key. */\n groupBy?: string\n className?: string\n badgeClassName?: string\n /**\n * First item selected is a default behavior by cmdk. That is why the default is true.\n * This is a workaround solution by add a dummy item.\n *\n * @reference: https://github.com/pacocoursey/cmdk/issues/171\n */\n selectFirstItem?: boolean\n /** Allow user to create option when there is no option matched. */\n creatable?: boolean\n /** Props of `Command` */\n commandProps?: React.ComponentPropsWithoutRef<typeof Command>\n /** Props of `CommandInput` */\n inputProps?: Omit<React.ComponentPropsWithoutRef<typeof CommandPrimitive.Input>, 'value' | 'placeholder' | 'disabled'>\n /** hide the clear all button. */\n hideClearAllButton?: boolean\n\n /** Add new item event for select with search */\n onAddNewItem?: () => void\n}\n\nexport interface MultipleSelectorRef {\n selectedValue: Option[]\n input: HTMLInputElement\n focus: () => void\n reset: () => void\n}\n\n// eslint-disable-next-line react-refresh/only-export-components\nexport function useDebounce<T>(value: T, delay?: number): T {\n const [debouncedValue, setDebouncedValue] = React.useState<T>(value)\n\n React.useEffect(() => {\n const timer = setTimeout(() => setDebouncedValue(value), delay || 500)\n\n return () => {\n clearTimeout(timer)\n }\n }, [value, delay])\n\n return debouncedValue\n}\n\nfunction transToGroupOption(options: Option[], groupBy?: string) {\n if (options.length === 0) {\n return {}\n }\n if (!groupBy) {\n return {\n '': options,\n }\n }\n\n const groupOption: GroupOption = {}\n options.forEach((option) => {\n const key = (option[groupBy] as string) || ''\n if (!groupOption[key]) {\n groupOption[key] = []\n }\n groupOption[key].push(option)\n })\n return groupOption\n}\n\nfunction removePickedOption(groupOption: GroupOption, picked: Option[]) {\n const cloneOption = JSON.parse(JSON.stringify(groupOption)) as GroupOption\n\n for (const [key, value] of Object.entries(cloneOption)) {\n cloneOption[key] = value.filter((val) => !picked.find((p) => p.value === val.value))\n }\n return cloneOption\n}\n\nfunction isOptionsExist(groupOption: GroupOption, targetOption: Option[]) {\n for (const [, value] of Object.entries(groupOption)) {\n if (value.some((option) => targetOption.find((p) => p.value === option.value))) {\n return true\n }\n }\n return false\n}\n\n/**\n * The `CommandEmpty` of shadcn/ui will cause the cmdk empty not rendering correctly.\n * So we create one and copy the `Empty` implementation from `cmdk`.\n *\n * @reference: https://github.com/hsuanyi-chou/shadcn-ui-expansions/issues/34#issuecomment-1949561607\n **/\nconst CommandEmpty = React.forwardRef<HTMLDivElement, React.ComponentProps<typeof CommandPrimitive.Empty>>(({ className, ...props }, forwardedRef) => {\n const render = useCommandState((state) => state.filtered.count === 0)\n\n if (!render) return null\n\n return <div ref={forwardedRef} className={cn('px-2 py-4 text-center text-sm', className)} cmdk-empty=\"\" role=\"presentation\" {...props} />\n})\n\nCommandEmpty.displayName = 'CommandEmpty'\n\nexport const MultipleSelector = React.forwardRef<MultipleSelectorRef, MultipleSelectorProps>(\n (\n {\n value,\n onChange,\n placeholder,\n defaultOptions: arrayDefaultOptions = [],\n options: arrayOptions,\n delay,\n onSearch,\n onSearchSync,\n loadingIndicator: LoadingIndicator,\n emptyIndicator,\n maxSelected = Number.MAX_SAFE_INTEGER,\n onMaxSelected,\n hidePlaceholderWhenSelected,\n disabled,\n groupBy,\n className,\n badgeClassName,\n selectFirstItem = true,\n creatable = false,\n triggerSearchOnFocus = false,\n commandProps,\n inputProps,\n hideClearAllButton = false,\n onAddNewItem,\n }: MultipleSelectorProps,\n ref: React.Ref<MultipleSelectorRef>,\n ) => {\n const inputRef = React.useRef<HTMLInputElement>(null)\n const dropdownRef = React.useRef<HTMLDivElement>(null) // Added this\n\n const [open, setOpen] = React.useState(false)\n const [onScrollbar, setOnScrollbar] = React.useState(false)\n const [isLoading, setIsLoading] = React.useState(false)\n\n const [selected, setSelected] = React.useState<Option[]>(value || [])\n const [options, setOptions] = React.useState<GroupOption>(transToGroupOption(arrayDefaultOptions, groupBy))\n const [inputValue, setInputValue] = React.useState('')\n\n const debouncedSearchTerm = useDebounce(inputValue, delay || 500)\n\n React.useImperativeHandle(\n ref,\n () => ({\n selectedValue: [...selected],\n input: inputRef.current as HTMLInputElement,\n focus: () => inputRef?.current?.focus(),\n reset: () => setSelected([]),\n }),\n [selected],\n )\n\n const handleClickOutside = React.useCallback((event: MouseEvent | TouchEvent) => {\n if (dropdownRef.current && !dropdownRef.current.contains(event.target as Node) && inputRef.current && !inputRef.current.contains(event.target as Node)) {\n setOpen(false)\n inputRef.current.blur()\n }\n }, [])\n\n const handleUnselect = React.useCallback(\n (option: Option) => {\n const newOptions = selected.filter((s) => s.value !== option.value)\n setSelected(newOptions)\n onChange?.(newOptions)\n },\n [onChange, selected],\n )\n\n const handleKeyDown = React.useCallback(\n (e: React.KeyboardEvent<HTMLDivElement>) => {\n const input = inputRef.current\n if (!input) return\n\n if (e.key === 'Delete' || e.key === 'Backspace') {\n if (input.value === '' && selected.length > 0) {\n const lastSelectOption = selected[selected.length - 1]\n // If last item is fixed, we should not remove it.\n if (!lastSelectOption.fixed) {\n handleUnselect(selected[selected.length - 1])\n }\n }\n }\n\n // This is not a default behavior of the <input /> field\n if (e.key === 'Escape') {\n input.blur()\n }\n },\n [handleUnselect, selected],\n )\n\n React.useEffect(() => {\n if (open) {\n document.addEventListener('mousedown', handleClickOutside)\n document.addEventListener('touchend', handleClickOutside)\n } else {\n document.removeEventListener('mousedown', handleClickOutside)\n document.removeEventListener('touchend', handleClickOutside)\n }\n\n return () => {\n document.removeEventListener('mousedown', handleClickOutside)\n document.removeEventListener('touchend', handleClickOutside)\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [open])\n\n React.useEffect(() => {\n if (value) {\n setSelected(value)\n }\n }, [value])\n\n React.useEffect(() => {\n /** If `onSearch` is provided, do not trigger options updated. */\n if (!arrayOptions || onSearch) {\n return\n }\n const newOption = transToGroupOption(arrayOptions || [], groupBy)\n if (JSON.stringify(newOption) !== JSON.stringify(options)) {\n setOptions(newOption)\n }\n }, [arrayDefaultOptions, arrayOptions, groupBy, onSearch, options])\n\n React.useEffect(() => {\n /** sync search */\n\n const doSearchSync = () => {\n const res = onSearchSync?.(debouncedSearchTerm)\n setOptions(transToGroupOption(res || [], groupBy))\n }\n\n const exec = async () => {\n if (!onSearchSync || !open) return\n\n if (triggerSearchOnFocus) {\n doSearchSync()\n }\n\n if (debouncedSearchTerm) {\n doSearchSync()\n }\n }\n\n void exec()\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [debouncedSearchTerm, groupBy, open, triggerSearchOnFocus])\n\n React.useEffect(() => {\n /** async search */\n\n const doSearch = async () => {\n setIsLoading(true)\n const res = await onSearch?.(debouncedSearchTerm)\n setOptions(transToGroupOption(res || [], groupBy))\n setIsLoading(false)\n }\n\n const exec = async () => {\n if (!onSearch || !open) return\n\n if (triggerSearchOnFocus) {\n await doSearch()\n }\n\n if (debouncedSearchTerm) {\n await doSearch()\n }\n }\n\n void exec()\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [debouncedSearchTerm, groupBy, open, triggerSearchOnFocus])\n\n const CreatableItem = () => {\n if (!creatable) return undefined\n if (isOptionsExist(options, [{ value: inputValue, label: inputValue }]) || selected.find((s) => s.value === inputValue)) {\n return undefined\n }\n\n const Item = (\n <CommandItem\n value={inputValue}\n className=\"cursor-pointer\"\n onMouseDown={(e) => {\n e.preventDefault()\n e.stopPropagation()\n }}\n onSelect={(value: string) => {\n if (selected.length >= maxSelected) {\n onMaxSelected?.(selected.length)\n return\n }\n setInputValue('')\n const newOptions = [...selected, { value, label: value }]\n setSelected(newOptions)\n onChange?.(newOptions)\n }}\n >\n {`Create \"${inputValue}\"`}\n </CommandItem>\n )\n\n // For normal creatable\n if (!onSearch && inputValue.length > 0) {\n return Item\n }\n\n // For async search creatable. avoid showing creatable item before loading at first.\n if (onSearch && debouncedSearchTerm.length > 0 && !isLoading) {\n return Item\n }\n\n return undefined\n }\n\n const EmptyItem = React.useCallback(() => {\n if (!emptyIndicator) return undefined\n\n // For async search that showing emptyIndicator\n if (onSearch && !creatable && Object.keys(options).length === 0) {\n return (\n <CommandItem value=\"-\" disabled>\n {emptyIndicator}\n </CommandItem>\n )\n }\n\n return <CommandEmpty>{emptyIndicator}</CommandEmpty>\n }, [creatable, emptyIndicator, onSearch, options])\n\n const selectables = React.useMemo<GroupOption>(() => removePickedOption(options, selected), [options, selected])\n\n /** Avoid Creatable Selector freezing or lagging when paste a long string. */\n const commandFilter = React.useCallback(() => {\n if (commandProps?.filter) {\n return commandProps.filter\n }\n\n if (creatable) {\n return (value: string, search: string) => {\n return value.toLowerCase().includes(search.toLowerCase()) ? 1 : -1\n }\n }\n // Using default filter in `cmdk`. We don‘t have to provide it.\n return undefined\n }, [creatable, commandProps?.filter])\n\n return (\n <Command\n ref={dropdownRef}\n {...commandProps}\n onKeyDown={(e) => {\n handleKeyDown(e)\n commandProps?.onKeyDown?.(e)\n }}\n className={cn('h-auto overflow-visible bg-transparent', commandProps?.className)}\n shouldFilter={commandProps?.shouldFilter !== undefined ? commandProps.shouldFilter : !onSearch} // When onSearch is provided, we don‘t want to filter the options. You can still override it.\n filter={commandFilter()}\n >\n <div\n className={cn(\n 'border-border-weak relative rounded-md border text-sm transition-shadow',\n 'focus-within:border-primary',\n 'focus-within:ring-primary-weak',\n 'focus-within:ring-4',\n 'focus-within:outline-hidden',\n 'has-disabled:bg-muted',\n 'has-disabled:text-muted-foreground',\n selected.length !== 0 && 'p-1',\n !disabled && selected.length !== 0 && 'cursor-text',\n !hideClearAllButton && 'pe-9',\n className,\n )}\n onClick={() => {\n if (disabled) return\n inputRef?.current?.focus()\n }}\n >\n <div className=\"flex flex-wrap gap-1\">\n {selected.map((option) => {\n return (\n <div\n key={option.value}\n className={cn(\n 'animate-fadeIn',\n 'bg-background',\n 'hover:bg-background',\n 'border-border-weak border border-solid',\n 'text-text-positive-weak relative inline-flex h-7 cursor-default items-center rounded-md ps-2 pe-7 pl-2 text-xs font-medium transition-all',\n 'disabled:cursor-not-allowed',\n 'disabled:opacity-50',\n 'data-fixed:pe-2',\n badgeClassName,\n )}\n data-fixed={option.fixed}\n data-disabled={disabled || undefined}\n >\n {option.label}\n <button\n type=\"button\"\n disabled={disabled || option.fixed}\n className={cn(\n 'text-text-positive-muted absolute -inset-y-px -end-px flex size-7 items-center justify-center rounded-e-lg border border-transparent p-0 outline-0 transition-colors',\n 'hover:text-foreground',\n 'focus-visible:outline',\n 'focus-visible:outline-2',\n 'focus-visible:outline-primary-weak',\n 'disabled:hover:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50',\n )}\n onKeyDown={(e) => {\n if (e.key !== 'Enter') return\n handleUnselect(option)\n }}\n onMouseDown={(e) => {\n e.preventDefault()\n e.stopPropagation()\n }}\n onClick={() => handleUnselect(option)}\n aria-label=\"Remove\"\n >\n <X size={14} strokeWidth={2} aria-hidden=\"true\" />\n </button>\n </div>\n )\n })}\n {/* Avoid having the \"Search\" Icon */}\n <CommandPrimitive.Input\n {...inputProps}\n ref={inputRef}\n value={inputValue}\n disabled={disabled}\n onValueChange={(value) => {\n setInputValue(value)\n inputProps?.onValueChange?.(value)\n }}\n onBlur={(event) => {\n if (!onScrollbar) {\n setOpen(false)\n }\n inputProps?.onBlur?.(event)\n }}\n onFocus={(event) => {\n setOpen(true)\n if (triggerSearchOnFocus) {\n onSearch?.(debouncedSearchTerm)\n }\n inputProps?.onFocus?.(event)\n }}\n placeholder={hidePlaceholderWhenSelected && selected.length !== 0 ? '' : placeholder}\n className={cn(\n 'placeholder:text-text-positive-muted flex-1 bg-transparent outline-hidden',\n 'disabled:placeholder:text-transparent',\n {\n 'w-full': hidePlaceholderWhenSelected,\n 'px-3 py-2': selected.length === 0,\n 'ml-1': selected.length !== 0,\n },\n inputProps?.className,\n )}\n />\n <button\n type=\"button\"\n onClick={() => {\n setSelected(selected.filter((s) => s.fixed))\n onChange?.(selected.filter((s) => s.fixed))\n }}\n className={cn(\n 'text-muted-foreground/80',\n 'absolute end-0 top-0 flex size-9 items-center justify-center rounded-lg border border-transparent transition-colors',\n 'focus-visible:outline-2',\n 'hover:text-text-positive',\n 'focus-visible:outline-primary-weak',\n (hideClearAllButton || disabled || selected.length < 1 || selected.filter(({ fixed }) => fixed).length === selected.length) && 'hidden',\n )}\n aria-label=\"Clear all\"\n >\n <X size={16} strokeWidth={2} aria-hidden=\"true\" />\n </button>\n </div>\n </div>\n <div className=\"relative\">\n <div\n className={cn(\n 'shadow-dropdown absolute top-2 z-10 w-full overflow-hidden rounded-lg',\n 'data-[state=open]:animate-in',\n 'data-[state=closed]:animate-out',\n 'data-[state=closed]:fade-out-0',\n 'data-[state=open]:fade-in-0',\n 'data-[state=closed]:zoom-out-95',\n 'data-[state=open]:zoom-in-95',\n !open && 'hidden',\n )}\n data-state={open ? 'open' : 'closed'}\n >\n {open && (\n <CommandList\n className=\"shadow-lg outline-hidden\"\n onMouseLeave={() => {\n setOnScrollbar(false)\n }}\n onMouseEnter={() => {\n setOnScrollbar(true)\n }}\n onMouseUp={() => {\n inputRef?.current?.focus()\n }}\n >\n {onAddNewItem && (\n <>\n <CommandSeparator />\n <CommandGroup>\n <Button type=\"button\" variant=\"ghost\" className=\"w-full font-normal [&_div]:justify-start\" onClick={onAddNewItem}>\n <PlusIcon size={14} className=\"opacity-60\" aria-hidden=\"true\" />\n Thêm mới\n </Button>\n </CommandGroup>\n </>\n )}\n {isLoading ? (\n LoadingIndicator\n ) : (\n <React.Fragment>\n {EmptyItem()}\n {CreatableItem()}\n {!selectFirstItem && <CommandItem value=\"-\" className=\"hidden\" />}\n {Object.entries(selectables).map(([key, dropdowns]) => (\n <CommandGroup key={key} heading={key} className=\"h-full overflow-auto\">\n {dropdowns.map((option) => {\n return (\n <CommandItem\n key={option.value}\n value={option.value}\n disabled={option.disable}\n onMouseDown={(e) => {\n e.preventDefault()\n e.stopPropagation()\n }}\n onSelect={() => {\n if (selected.length >= maxSelected) {\n onMaxSelected?.(selected.length)\n return\n }\n const newOptions = [...selected, option]\n setInputValue('')\n setSelected(newOptions)\n onChange?.(newOptions)\n }}\n className={cn('cursor-pointer', option.disable && 'cursor-not-allowed opacity-50')}\n >\n {option.label}\n </CommandItem>\n )\n })}\n </CommandGroup>\n ))}\n </React.Fragment>\n )}\n </CommandList>\n )}\n </div>\n </div>\n </Command>\n )\n },\n)\n\nMultipleSelector.displayName = 'MultipleSelector'\n"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{cn as e}from"./utils-D9AH0PUV.js";import{Button as t}from"./button-
|
|
2
|
-
//# sourceMappingURL=multi-select-
|
|
1
|
+
import{cn as e}from"./utils-D9AH0PUV.js";import{Button as t}from"./button-Pscu7CVU.js";import{Command as n,CommandGroup as r,CommandItem as i,CommandList as ee,CommandSeparator as te}from"./command-C3siWT3g.js";import a from"react";import{Fragment as o,jsx as s,jsxs as c}from"react/jsx-runtime";import{PlusIcon as l,X as u}from"lucide-react";import{Command as ne,useCommandState as d}from"cmdk";function f(e,t){let[n,r]=a.useState(e);return a.useEffect(()=>{let n=setTimeout(()=>r(e),t||500);return()=>{clearTimeout(n)}},[e,t]),n}function p(e,t){if(e.length===0)return{};if(!t)return{"":e};let n={};return e.forEach(e=>{let r=e[t]||``;n[r]||(n[r]=[]),n[r].push(e)}),n}function re(e,t){let n=JSON.parse(JSON.stringify(e));for(let[e,r]of Object.entries(n))n[e]=r.filter(e=>!t.find(t=>t.value===e.value));return n}function m(e,t){for(let[,n]of Object.entries(e))if(n.some(e=>t.find(t=>t.value===e.value)))return!0;return!1}const h=a.forwardRef(({className:t,...n},r)=>{let i=d(e=>e.filtered.count===0);return i?s(`div`,{ref:r,className:e(`px-2 py-4 text-center text-sm`,t),"cmdk-empty":``,role:`presentation`,...n}):null});h.displayName=`CommandEmpty`;const g=a.forwardRef(({value:d,onChange:g,placeholder:_,defaultOptions:v=[],options:y,delay:b,onSearch:x,onSearchSync:S,loadingIndicator:ie,emptyIndicator:C,maxSelected:w=9007199254740991,onMaxSelected:T,hidePlaceholderWhenSelected:E,disabled:D,groupBy:O,className:ae,badgeClassName:k,selectFirstItem:A=!0,creatable:j=!1,triggerSearchOnFocus:M=!1,commandProps:N,inputProps:P,hideClearAllButton:F=!1,onAddNewItem:I},L)=>{let R=a.useRef(null),z=a.useRef(null),[B,V]=a.useState(!1),[oe,H]=a.useState(!1),[U,W]=a.useState(!1),[G,K]=a.useState(d||[]),[q,J]=a.useState(p(v,O)),[Y,X]=a.useState(``),Z=f(Y,b||500);a.useImperativeHandle(L,()=>({selectedValue:[...G],input:R.current,focus:()=>R?.current?.focus(),reset:()=>K([])}),[G]);let Q=a.useCallback(e=>{z.current&&!z.current.contains(e.target)&&R.current&&!R.current.contains(e.target)&&(V(!1),R.current.blur())},[]),$=a.useCallback(e=>{let t=G.filter(t=>t.value!==e.value);K(t),g?.(t)},[g,G]),se=a.useCallback(e=>{let t=R.current;if(t){if((e.key===`Delete`||e.key===`Backspace`)&&t.value===``&&G.length>0){let e=G[G.length-1];e.fixed||$(G[G.length-1])}e.key===`Escape`&&t.blur()}},[$,G]);a.useEffect(()=>(B?(document.addEventListener(`mousedown`,Q),document.addEventListener(`touchend`,Q)):(document.removeEventListener(`mousedown`,Q),document.removeEventListener(`touchend`,Q)),()=>{document.removeEventListener(`mousedown`,Q),document.removeEventListener(`touchend`,Q)}),[B]),a.useEffect(()=>{d&&K(d)},[d]),a.useEffect(()=>{if(!y||x)return;let e=p(y||[],O);JSON.stringify(e)!==JSON.stringify(q)&&J(e)},[v,y,O,x,q]),a.useEffect(()=>{let e=()=>{let e=S?.(Z);J(p(e||[],O))},t=async()=>{!S||!B||(M&&e(),Z&&e())};t()},[Z,O,B,M]),a.useEffect(()=>{let e=async()=>{W(!0);let e=await x?.(Z);J(p(e||[],O)),W(!1)},t=async()=>{!x||!B||(M&&await e(),Z&&await e())};t()},[Z,O,B,M]);let ce=()=>{if(!j||m(q,[{value:Y,label:Y}])||G.find(e=>e.value===Y))return;let e=s(i,{value:Y,className:`cursor-pointer`,onMouseDown:e=>{e.preventDefault(),e.stopPropagation()},onSelect:e=>{if(G.length>=w){T?.(G.length);return}X(``);let t=[...G,{value:e,label:e}];K(t),g?.(t)},children:`Create "${Y}"`});if(!x&&Y.length>0||x&&Z.length>0&&!U)return e},le=a.useCallback(()=>{if(C)return x&&!j&&Object.keys(q).length===0?s(i,{value:`-`,disabled:!0,children:C}):s(h,{children:C})},[j,C,x,q]),ue=a.useMemo(()=>re(q,G),[q,G]),de=a.useCallback(()=>{if(N?.filter)return N.filter;if(j)return(e,t)=>e.toLowerCase().includes(t.toLowerCase())?1:-1},[j,N?.filter]);return c(n,{ref:z,...N,onKeyDown:e=>{se(e),N?.onKeyDown?.(e)},className:e(`h-auto overflow-visible bg-transparent`,N?.className),shouldFilter:N?.shouldFilter===void 0?!x:N.shouldFilter,filter:de(),children:[s(`div`,{className:e(`border-border-weak relative rounded-md border text-sm transition-shadow`,`focus-within:border-primary`,`focus-within:ring-primary-weak`,`focus-within:ring-4`,`focus-within:outline-hidden`,`has-disabled:bg-muted`,`has-disabled:text-muted-foreground`,G.length!==0&&`p-1`,!D&&G.length!==0&&`cursor-text`,!F&&`pe-9`,ae),onClick:()=>{D||R?.current?.focus()},children:c(`div`,{className:`flex flex-wrap gap-1`,children:[G.map(t=>c(`div`,{className:e(`animate-fadeIn`,`bg-background`,`hover:bg-background`,`border-border-weak border border-solid`,`text-text-positive-weak relative inline-flex h-7 cursor-default items-center rounded-md ps-2 pe-7 pl-2 text-xs font-medium transition-all`,`disabled:cursor-not-allowed`,`disabled:opacity-50`,`data-fixed:pe-2`,k),"data-fixed":t.fixed,"data-disabled":D||void 0,children:[t.label,s(`button`,{type:`button`,disabled:D||t.fixed,className:e(`text-text-positive-muted absolute -inset-y-px -end-px flex size-7 items-center justify-center rounded-e-lg border border-transparent p-0 outline-0 transition-colors`,`hover:text-foreground`,`focus-visible:outline`,`focus-visible:outline-2`,`focus-visible:outline-primary-weak`,`disabled:hover:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50`),onKeyDown:e=>{e.key===`Enter`&&$(t)},onMouseDown:e=>{e.preventDefault(),e.stopPropagation()},onClick:()=>$(t),"aria-label":`Remove`,children:s(u,{size:14,strokeWidth:2,"aria-hidden":`true`})})]},t.value)),s(ne.Input,{...P,ref:R,value:Y,disabled:D,onValueChange:e=>{X(e),P?.onValueChange?.(e)},onBlur:e=>{oe||V(!1),P?.onBlur?.(e)},onFocus:e=>{V(!0),M&&x?.(Z),P?.onFocus?.(e)},placeholder:E&&G.length!==0?``:_,className:e(`placeholder:text-text-positive-muted flex-1 bg-transparent outline-hidden`,`disabled:placeholder:text-transparent`,{"w-full":E,"px-3 py-2":G.length===0,"ml-1":G.length!==0},P?.className)}),s(`button`,{type:`button`,onClick:()=>{K(G.filter(e=>e.fixed)),g?.(G.filter(e=>e.fixed))},className:e(`text-muted-foreground/80`,`absolute end-0 top-0 flex size-9 items-center justify-center rounded-lg border border-transparent transition-colors`,`focus-visible:outline-2`,`hover:text-text-positive`,`focus-visible:outline-primary-weak`,(F||D||G.length<1||G.filter(({fixed:e})=>e).length===G.length)&&`hidden`),"aria-label":`Clear all`,children:s(u,{size:16,strokeWidth:2,"aria-hidden":`true`})})]})}),s(`div`,{className:`relative`,children:s(`div`,{className:e(`shadow-dropdown absolute top-2 z-10 w-full overflow-hidden rounded-lg`,`data-[state=open]:animate-in`,`data-[state=closed]:animate-out`,`data-[state=closed]:fade-out-0`,`data-[state=open]:fade-in-0`,`data-[state=closed]:zoom-out-95`,`data-[state=open]:zoom-in-95`,!B&&`hidden`),"data-state":B?`open`:`closed`,children:B&&c(ee,{className:`shadow-lg outline-hidden`,onMouseLeave:()=>{H(!1)},onMouseEnter:()=>{H(!0)},onMouseUp:()=>{R?.current?.focus()},children:[I&&c(o,{children:[s(te,{}),s(r,{children:c(t,{type:`button`,variant:`ghost`,className:`w-full font-normal [&_div]:justify-start`,onClick:I,children:[s(l,{size:14,className:`opacity-60`,"aria-hidden":`true`}),`Thêm mới`]})})]}),U?ie:c(a.Fragment,{children:[le(),ce(),!A&&s(i,{value:`-`,className:`hidden`}),Object.entries(ue).map(([t,n])=>s(r,{heading:t,className:`h-full overflow-auto`,children:n.map(t=>s(i,{value:t.value,disabled:t.disable,onMouseDown:e=>{e.preventDefault(),e.stopPropagation()},onSelect:()=>{if(G.length>=w){T?.(G.length);return}let e=[...G,t];X(``),K(e),g?.(e)},className:e(`cursor-pointer`,t.disable&&`cursor-not-allowed opacity-50`),children:t.label},t.value))},t))]})]})})})]})});g.displayName=`MultipleSelector`;export{g as MultipleSelector,f as useDebounce};
|
|
2
|
+
//# sourceMappingURL=multi-select-DNLyV99t.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"multi-select-2gDBlVHu.js","names":["groupOption: GroupOption","value","Command","CommandPrimitive"],"sources":["../packages/components/ui/multi-select.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\nimport { Command as CommandPrimitive, useCommandState } from 'cmdk'\nimport { PlusIcon, X } from 'lucide-react'\n\nimport { Command, CommandGroup, CommandItem, CommandList, CommandSeparator } from '@/components/ui/command'\nimport { Button } from '@/components/ui/button'\nimport { cn } from '@/lib/utils'\n\nexport interface Option {\n value: string\n label: string\n disable?: boolean\n /** fixed option that can‘t be removed. */\n fixed?: boolean\n /** Group the options by providing key. */\n [key: string]: string | boolean | undefined\n}\ninterface GroupOption {\n [key: string]: Option[]\n}\n\ninterface MultipleSelectorProps {\n value?: Option[]\n defaultOptions?: Option[]\n /** manually controlled options */\n options?: Option[]\n placeholder?: string\n /** Loading component. */\n loadingIndicator?: React.ReactNode\n /** Empty component. */\n emptyIndicator?: React.ReactNode\n /** Debounce time for async search. Only work with `onSearch`. */\n delay?: number\n /**\n * Only work with `onSearch` prop. Trigger search when `onFocus`.\n * For example, when user click on the input, it will trigger the search to get initial options.\n **/\n triggerSearchOnFocus?: boolean\n /** async search */\n onSearch?: (value: string) => Promise<Option[]>\n /**\n * sync search. This search will not showing loadingIndicator.\n * The rest props are the same as async search.\n * i.e.: creatable, groupBy, delay.\n **/\n onSearchSync?: (value: string) => Option[]\n onChange?: (options: Option[]) => void\n /** Limit the maximum number of selected options. */\n maxSelected?: number\n /** When the number of selected options exceeds the limit, the onMaxSelected will be called. */\n onMaxSelected?: (maxLimit: number) => void\n /** Hide the placeholder when there are options selected. */\n hidePlaceholderWhenSelected?: boolean\n disabled?: boolean\n /** Group the options base on provided key. */\n groupBy?: string\n className?: string\n badgeClassName?: string\n /**\n * First item selected is a default behavior by cmdk. That is why the default is true.\n * This is a workaround solution by add a dummy item.\n *\n * @reference: https://github.com/pacocoursey/cmdk/issues/171\n */\n selectFirstItem?: boolean\n /** Allow user to create option when there is no option matched. */\n creatable?: boolean\n /** Props of `Command` */\n commandProps?: React.ComponentPropsWithoutRef<typeof Command>\n /** Props of `CommandInput` */\n inputProps?: Omit<React.ComponentPropsWithoutRef<typeof CommandPrimitive.Input>, 'value' | 'placeholder' | 'disabled'>\n /** hide the clear all button. */\n hideClearAllButton?: boolean\n\n /** Add new item event for select with search */\n onAddNewItem?: () => void\n}\n\nexport interface MultipleSelectorRef {\n selectedValue: Option[]\n input: HTMLInputElement\n focus: () => void\n reset: () => void\n}\n\n// eslint-disable-next-line react-refresh/only-export-components\nexport function useDebounce<T>(value: T, delay?: number): T {\n const [debouncedValue, setDebouncedValue] = React.useState<T>(value)\n\n React.useEffect(() => {\n const timer = setTimeout(() => setDebouncedValue(value), delay || 500)\n\n return () => {\n clearTimeout(timer)\n }\n }, [value, delay])\n\n return debouncedValue\n}\n\nfunction transToGroupOption(options: Option[], groupBy?: string) {\n if (options.length === 0) {\n return {}\n }\n if (!groupBy) {\n return {\n '': options,\n }\n }\n\n const groupOption: GroupOption = {}\n options.forEach((option) => {\n const key = (option[groupBy] as string) || ''\n if (!groupOption[key]) {\n groupOption[key] = []\n }\n groupOption[key].push(option)\n })\n return groupOption\n}\n\nfunction removePickedOption(groupOption: GroupOption, picked: Option[]) {\n const cloneOption = JSON.parse(JSON.stringify(groupOption)) as GroupOption\n\n for (const [key, value] of Object.entries(cloneOption)) {\n cloneOption[key] = value.filter((val) => !picked.find((p) => p.value === val.value))\n }\n return cloneOption\n}\n\nfunction isOptionsExist(groupOption: GroupOption, targetOption: Option[]) {\n for (const [, value] of Object.entries(groupOption)) {\n if (value.some((option) => targetOption.find((p) => p.value === option.value))) {\n return true\n }\n }\n return false\n}\n\n/**\n * The `CommandEmpty` of shadcn/ui will cause the cmdk empty not rendering correctly.\n * So we create one and copy the `Empty` implementation from `cmdk`.\n *\n * @reference: https://github.com/hsuanyi-chou/shadcn-ui-expansions/issues/34#issuecomment-1949561607\n **/\nconst CommandEmpty = React.forwardRef<HTMLDivElement, React.ComponentProps<typeof CommandPrimitive.Empty>>(({ className, ...props }, forwardedRef) => {\n const render = useCommandState((state) => state.filtered.count === 0)\n\n if (!render) return null\n\n return <div ref={forwardedRef} className={cn('px-2 py-4 text-center text-sm', className)} cmdk-empty=\"\" role=\"presentation\" {...props} />\n})\n\nCommandEmpty.displayName = 'CommandEmpty'\n\nexport const MultipleSelector = React.forwardRef<MultipleSelectorRef, MultipleSelectorProps>(\n (\n {\n value,\n onChange,\n placeholder,\n defaultOptions: arrayDefaultOptions = [],\n options: arrayOptions,\n delay,\n onSearch,\n onSearchSync,\n loadingIndicator: LoadingIndicator,\n emptyIndicator,\n maxSelected = Number.MAX_SAFE_INTEGER,\n onMaxSelected,\n hidePlaceholderWhenSelected,\n disabled,\n groupBy,\n className,\n badgeClassName,\n selectFirstItem = true,\n creatable = false,\n triggerSearchOnFocus = false,\n commandProps,\n inputProps,\n hideClearAllButton = false,\n onAddNewItem,\n }: MultipleSelectorProps,\n ref: React.Ref<MultipleSelectorRef>,\n ) => {\n const inputRef = React.useRef<HTMLInputElement>(null)\n const dropdownRef = React.useRef<HTMLDivElement>(null) // Added this\n\n const [open, setOpen] = React.useState(false)\n const [onScrollbar, setOnScrollbar] = React.useState(false)\n const [isLoading, setIsLoading] = React.useState(false)\n\n const [selected, setSelected] = React.useState<Option[]>(value || [])\n const [options, setOptions] = React.useState<GroupOption>(transToGroupOption(arrayDefaultOptions, groupBy))\n const [inputValue, setInputValue] = React.useState('')\n\n const debouncedSearchTerm = useDebounce(inputValue, delay || 500)\n\n React.useImperativeHandle(\n ref,\n () => ({\n selectedValue: [...selected],\n input: inputRef.current as HTMLInputElement,\n focus: () => inputRef?.current?.focus(),\n reset: () => setSelected([]),\n }),\n [selected],\n )\n\n const handleClickOutside = React.useCallback((event: MouseEvent | TouchEvent) => {\n if (dropdownRef.current && !dropdownRef.current.contains(event.target as Node) && inputRef.current && !inputRef.current.contains(event.target as Node)) {\n setOpen(false)\n inputRef.current.blur()\n }\n }, [])\n\n const handleUnselect = React.useCallback(\n (option: Option) => {\n const newOptions = selected.filter((s) => s.value !== option.value)\n setSelected(newOptions)\n onChange?.(newOptions)\n },\n [onChange, selected],\n )\n\n const handleKeyDown = React.useCallback(\n (e: React.KeyboardEvent<HTMLDivElement>) => {\n const input = inputRef.current\n if (!input) return\n\n if (e.key === 'Delete' || e.key === 'Backspace') {\n if (input.value === '' && selected.length > 0) {\n const lastSelectOption = selected[selected.length - 1]\n // If last item is fixed, we should not remove it.\n if (!lastSelectOption.fixed) {\n handleUnselect(selected[selected.length - 1])\n }\n }\n }\n\n // This is not a default behavior of the <input /> field\n if (e.key === 'Escape') {\n input.blur()\n }\n },\n [handleUnselect, selected],\n )\n\n React.useEffect(() => {\n if (open) {\n document.addEventListener('mousedown', handleClickOutside)\n document.addEventListener('touchend', handleClickOutside)\n } else {\n document.removeEventListener('mousedown', handleClickOutside)\n document.removeEventListener('touchend', handleClickOutside)\n }\n\n return () => {\n document.removeEventListener('mousedown', handleClickOutside)\n document.removeEventListener('touchend', handleClickOutside)\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [open])\n\n React.useEffect(() => {\n if (value) {\n setSelected(value)\n }\n }, [value])\n\n React.useEffect(() => {\n /** If `onSearch` is provided, do not trigger options updated. */\n if (!arrayOptions || onSearch) {\n return\n }\n const newOption = transToGroupOption(arrayOptions || [], groupBy)\n if (JSON.stringify(newOption) !== JSON.stringify(options)) {\n setOptions(newOption)\n }\n }, [arrayDefaultOptions, arrayOptions, groupBy, onSearch, options])\n\n React.useEffect(() => {\n /** sync search */\n\n const doSearchSync = () => {\n const res = onSearchSync?.(debouncedSearchTerm)\n setOptions(transToGroupOption(res || [], groupBy))\n }\n\n const exec = async () => {\n if (!onSearchSync || !open) return\n\n if (triggerSearchOnFocus) {\n doSearchSync()\n }\n\n if (debouncedSearchTerm) {\n doSearchSync()\n }\n }\n\n void exec()\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [debouncedSearchTerm, groupBy, open, triggerSearchOnFocus])\n\n React.useEffect(() => {\n /** async search */\n\n const doSearch = async () => {\n setIsLoading(true)\n const res = await onSearch?.(debouncedSearchTerm)\n setOptions(transToGroupOption(res || [], groupBy))\n setIsLoading(false)\n }\n\n const exec = async () => {\n if (!onSearch || !open) return\n\n if (triggerSearchOnFocus) {\n await doSearch()\n }\n\n if (debouncedSearchTerm) {\n await doSearch()\n }\n }\n\n void exec()\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [debouncedSearchTerm, groupBy, open, triggerSearchOnFocus])\n\n const CreatableItem = () => {\n if (!creatable) return undefined\n if (isOptionsExist(options, [{ value: inputValue, label: inputValue }]) || selected.find((s) => s.value === inputValue)) {\n return undefined\n }\n\n const Item = (\n <CommandItem\n value={inputValue}\n className=\"cursor-pointer\"\n onMouseDown={(e) => {\n e.preventDefault()\n e.stopPropagation()\n }}\n onSelect={(value: string) => {\n if (selected.length >= maxSelected) {\n onMaxSelected?.(selected.length)\n return\n }\n setInputValue('')\n const newOptions = [...selected, { value, label: value }]\n setSelected(newOptions)\n onChange?.(newOptions)\n }}\n >\n {`Create \"${inputValue}\"`}\n </CommandItem>\n )\n\n // For normal creatable\n if (!onSearch && inputValue.length > 0) {\n return Item\n }\n\n // For async search creatable. avoid showing creatable item before loading at first.\n if (onSearch && debouncedSearchTerm.length > 0 && !isLoading) {\n return Item\n }\n\n return undefined\n }\n\n const EmptyItem = React.useCallback(() => {\n if (!emptyIndicator) return undefined\n\n // For async search that showing emptyIndicator\n if (onSearch && !creatable && Object.keys(options).length === 0) {\n return (\n <CommandItem value=\"-\" disabled>\n {emptyIndicator}\n </CommandItem>\n )\n }\n\n return <CommandEmpty>{emptyIndicator}</CommandEmpty>\n }, [creatable, emptyIndicator, onSearch, options])\n\n const selectables = React.useMemo<GroupOption>(() => removePickedOption(options, selected), [options, selected])\n\n /** Avoid Creatable Selector freezing or lagging when paste a long string. */\n const commandFilter = React.useCallback(() => {\n if (commandProps?.filter) {\n return commandProps.filter\n }\n\n if (creatable) {\n return (value: string, search: string) => {\n return value.toLowerCase().includes(search.toLowerCase()) ? 1 : -1\n }\n }\n // Using default filter in `cmdk`. We don‘t have to provide it.\n return undefined\n }, [creatable, commandProps?.filter])\n\n return (\n <Command\n ref={dropdownRef}\n {...commandProps}\n onKeyDown={(e) => {\n handleKeyDown(e)\n commandProps?.onKeyDown?.(e)\n }}\n className={cn('h-auto overflow-visible bg-transparent', commandProps?.className)}\n shouldFilter={commandProps?.shouldFilter !== undefined ? commandProps.shouldFilter : !onSearch} // When onSearch is provided, we don‘t want to filter the options. You can still override it.\n filter={commandFilter()}\n >\n <div\n className={cn(\n 'border-border-weak relative rounded-md border text-sm transition-shadow',\n 'focus-within:border-primary',\n 'focus-within:ring-primary-weak',\n 'focus-within:ring-4',\n 'focus-within:outline-hidden',\n 'has-disabled:bg-muted',\n 'has-disabled:text-muted-foreground',\n selected.length !== 0 && 'p-1',\n !disabled && selected.length !== 0 && 'cursor-text',\n !hideClearAllButton && 'pe-9',\n className,\n )}\n onClick={() => {\n if (disabled) return\n inputRef?.current?.focus()\n }}\n >\n <div className=\"flex flex-wrap gap-1\">\n {selected.map((option) => {\n return (\n <div\n key={option.value}\n className={cn(\n 'animate-fadeIn',\n 'bg-background',\n 'hover:bg-background',\n 'border-border-weak border border-solid',\n 'text-text-positive-weak relative inline-flex h-7 cursor-default items-center rounded-md ps-2 pe-7 pl-2 text-xs font-medium transition-all',\n 'disabled:cursor-not-allowed',\n 'disabled:opacity-50',\n 'data-fixed:pe-2',\n badgeClassName,\n )}\n data-fixed={option.fixed}\n data-disabled={disabled || undefined}\n >\n {option.label}\n <button\n type=\"button\"\n disabled={disabled || option.fixed}\n className={cn(\n 'text-text-positive-muted absolute -inset-y-px -end-px flex size-7 items-center justify-center rounded-e-lg border border-transparent p-0 outline-0 transition-colors',\n 'hover:text-foreground',\n 'focus-visible:outline',\n 'focus-visible:outline-2',\n 'focus-visible:outline-primary-weak',\n 'disabled:hover:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50',\n )}\n onKeyDown={(e) => {\n if (e.key !== 'Enter') return\n handleUnselect(option)\n }}\n onMouseDown={(e) => {\n e.preventDefault()\n e.stopPropagation()\n }}\n onClick={() => handleUnselect(option)}\n aria-label=\"Remove\"\n >\n <X size={14} strokeWidth={2} aria-hidden=\"true\" />\n </button>\n </div>\n )\n })}\n {/* Avoid having the \"Search\" Icon */}\n <CommandPrimitive.Input\n {...inputProps}\n ref={inputRef}\n value={inputValue}\n disabled={disabled}\n onValueChange={(value) => {\n setInputValue(value)\n inputProps?.onValueChange?.(value)\n }}\n onBlur={(event) => {\n if (!onScrollbar) {\n setOpen(false)\n }\n inputProps?.onBlur?.(event)\n }}\n onFocus={(event) => {\n setOpen(true)\n if (triggerSearchOnFocus) {\n onSearch?.(debouncedSearchTerm)\n }\n inputProps?.onFocus?.(event)\n }}\n placeholder={hidePlaceholderWhenSelected && selected.length !== 0 ? '' : placeholder}\n className={cn(\n 'placeholder:text-text-positive-muted flex-1 bg-transparent outline-hidden',\n 'disabled:placeholder:text-transparent',\n {\n 'w-full': hidePlaceholderWhenSelected,\n 'px-3 py-2': selected.length === 0,\n 'ml-1': selected.length !== 0,\n },\n inputProps?.className,\n )}\n />\n <button\n type=\"button\"\n onClick={() => {\n setSelected(selected.filter((s) => s.fixed))\n onChange?.(selected.filter((s) => s.fixed))\n }}\n className={cn(\n 'text-muted-foreground/80',\n 'absolute end-0 top-0 flex size-9 items-center justify-center rounded-lg border border-transparent transition-colors',\n 'focus-visible:outline-2',\n 'hover:text-text-positive',\n 'focus-visible:outline-primary-weak',\n (hideClearAllButton || disabled || selected.length < 1 || selected.filter(({ fixed }) => fixed).length === selected.length) && 'hidden',\n )}\n aria-label=\"Clear all\"\n >\n <X size={16} strokeWidth={2} aria-hidden=\"true\" />\n </button>\n </div>\n </div>\n <div className=\"relative\">\n <div\n className={cn(\n 'shadow-dropdown absolute top-2 z-10 w-full overflow-hidden rounded-lg',\n 'data-[state=open]:animate-in',\n 'data-[state=closed]:animate-out',\n 'data-[state=closed]:fade-out-0',\n 'data-[state=open]:fade-in-0',\n 'data-[state=closed]:zoom-out-95',\n 'data-[state=open]:zoom-in-95',\n !open && 'hidden',\n )}\n data-state={open ? 'open' : 'closed'}\n >\n {open && (\n <CommandList\n className=\"shadow-lg outline-hidden\"\n onMouseLeave={() => {\n setOnScrollbar(false)\n }}\n onMouseEnter={() => {\n setOnScrollbar(true)\n }}\n onMouseUp={() => {\n inputRef?.current?.focus()\n }}\n >\n {onAddNewItem && (\n <>\n <CommandSeparator />\n <CommandGroup>\n <Button type=\"button\" variant=\"ghost\" className=\"w-full font-normal [&_div]:justify-start\" onClick={onAddNewItem}>\n <PlusIcon size={14} className=\"opacity-60\" aria-hidden=\"true\" />\n Thêm mới\n </Button>\n </CommandGroup>\n </>\n )}\n {isLoading ? (\n LoadingIndicator\n ) : (\n <React.Fragment>\n {EmptyItem()}\n {CreatableItem()}\n {!selectFirstItem && <CommandItem value=\"-\" className=\"hidden\" />}\n {Object.entries(selectables).map(([key, dropdowns]) => (\n <CommandGroup key={key} heading={key} className=\"h-full overflow-auto\">\n {dropdowns.map((option) => {\n return (\n <CommandItem\n key={option.value}\n value={option.value}\n disabled={option.disable}\n onMouseDown={(e) => {\n e.preventDefault()\n e.stopPropagation()\n }}\n onSelect={() => {\n if (selected.length >= maxSelected) {\n onMaxSelected?.(selected.length)\n return\n }\n const newOptions = [...selected, option]\n setInputValue('')\n setSelected(newOptions)\n onChange?.(newOptions)\n }}\n className={cn('cursor-pointer', option.disable && 'cursor-not-allowed opacity-50')}\n >\n {option.label}\n </CommandItem>\n )\n })}\n </CommandGroup>\n ))}\n </React.Fragment>\n )}\n </CommandList>\n )}\n </div>\n </div>\n </Command>\n )\n },\n)\n\nMultipleSelector.displayName = 'MultipleSelector'\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"multi-select-DNLyV99t.js","names":["groupOption: GroupOption","value","Command","CommandPrimitive"],"sources":["../packages/components/ui/multi-select.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\nimport { Command as CommandPrimitive, useCommandState } from 'cmdk'\nimport { PlusIcon, X } from 'lucide-react'\n\nimport { Command, CommandGroup, CommandItem, CommandList, CommandSeparator } from '@/components/ui/command'\nimport { Button } from '@/components/ui/button'\nimport { cn } from '@/lib/utils'\n\nexport interface Option {\n value: string\n label: string\n disable?: boolean\n /** fixed option that can‘t be removed. */\n fixed?: boolean\n /** Group the options by providing key. */\n [key: string]: string | boolean | undefined\n}\ninterface GroupOption {\n [key: string]: Option[]\n}\n\ninterface MultipleSelectorProps {\n value?: Option[]\n defaultOptions?: Option[]\n /** manually controlled options */\n options?: Option[]\n placeholder?: string\n /** Loading component. */\n loadingIndicator?: React.ReactNode\n /** Empty component. */\n emptyIndicator?: React.ReactNode\n /** Debounce time for async search. Only work with `onSearch`. */\n delay?: number\n /**\n * Only work with `onSearch` prop. Trigger search when `onFocus`.\n * For example, when user click on the input, it will trigger the search to get initial options.\n **/\n triggerSearchOnFocus?: boolean\n /** async search */\n onSearch?: (value: string) => Promise<Option[]>\n /**\n * sync search. This search will not showing loadingIndicator.\n * The rest props are the same as async search.\n * i.e.: creatable, groupBy, delay.\n **/\n onSearchSync?: (value: string) => Option[]\n onChange?: (options: Option[]) => void\n /** Limit the maximum number of selected options. */\n maxSelected?: number\n /** When the number of selected options exceeds the limit, the onMaxSelected will be called. */\n onMaxSelected?: (maxLimit: number) => void\n /** Hide the placeholder when there are options selected. */\n hidePlaceholderWhenSelected?: boolean\n disabled?: boolean\n /** Group the options base on provided key. */\n groupBy?: string\n className?: string\n badgeClassName?: string\n /**\n * First item selected is a default behavior by cmdk. That is why the default is true.\n * This is a workaround solution by add a dummy item.\n *\n * @reference: https://github.com/pacocoursey/cmdk/issues/171\n */\n selectFirstItem?: boolean\n /** Allow user to create option when there is no option matched. */\n creatable?: boolean\n /** Props of `Command` */\n commandProps?: React.ComponentPropsWithoutRef<typeof Command>\n /** Props of `CommandInput` */\n inputProps?: Omit<React.ComponentPropsWithoutRef<typeof CommandPrimitive.Input>, 'value' | 'placeholder' | 'disabled'>\n /** hide the clear all button. */\n hideClearAllButton?: boolean\n\n /** Add new item event for select with search */\n onAddNewItem?: () => void\n}\n\nexport interface MultipleSelectorRef {\n selectedValue: Option[]\n input: HTMLInputElement\n focus: () => void\n reset: () => void\n}\n\n// eslint-disable-next-line react-refresh/only-export-components\nexport function useDebounce<T>(value: T, delay?: number): T {\n const [debouncedValue, setDebouncedValue] = React.useState<T>(value)\n\n React.useEffect(() => {\n const timer = setTimeout(() => setDebouncedValue(value), delay || 500)\n\n return () => {\n clearTimeout(timer)\n }\n }, [value, delay])\n\n return debouncedValue\n}\n\nfunction transToGroupOption(options: Option[], groupBy?: string) {\n if (options.length === 0) {\n return {}\n }\n if (!groupBy) {\n return {\n '': options,\n }\n }\n\n const groupOption: GroupOption = {}\n options.forEach((option) => {\n const key = (option[groupBy] as string) || ''\n if (!groupOption[key]) {\n groupOption[key] = []\n }\n groupOption[key].push(option)\n })\n return groupOption\n}\n\nfunction removePickedOption(groupOption: GroupOption, picked: Option[]) {\n const cloneOption = JSON.parse(JSON.stringify(groupOption)) as GroupOption\n\n for (const [key, value] of Object.entries(cloneOption)) {\n cloneOption[key] = value.filter((val) => !picked.find((p) => p.value === val.value))\n }\n return cloneOption\n}\n\nfunction isOptionsExist(groupOption: GroupOption, targetOption: Option[]) {\n for (const [, value] of Object.entries(groupOption)) {\n if (value.some((option) => targetOption.find((p) => p.value === option.value))) {\n return true\n }\n }\n return false\n}\n\n/**\n * The `CommandEmpty` of shadcn/ui will cause the cmdk empty not rendering correctly.\n * So we create one and copy the `Empty` implementation from `cmdk`.\n *\n * @reference: https://github.com/hsuanyi-chou/shadcn-ui-expansions/issues/34#issuecomment-1949561607\n **/\nconst CommandEmpty = React.forwardRef<HTMLDivElement, React.ComponentProps<typeof CommandPrimitive.Empty>>(({ className, ...props }, forwardedRef) => {\n const render = useCommandState((state) => state.filtered.count === 0)\n\n if (!render) return null\n\n return <div ref={forwardedRef} className={cn('px-2 py-4 text-center text-sm', className)} cmdk-empty=\"\" role=\"presentation\" {...props} />\n})\n\nCommandEmpty.displayName = 'CommandEmpty'\n\nexport const MultipleSelector = React.forwardRef<MultipleSelectorRef, MultipleSelectorProps>(\n (\n {\n value,\n onChange,\n placeholder,\n defaultOptions: arrayDefaultOptions = [],\n options: arrayOptions,\n delay,\n onSearch,\n onSearchSync,\n loadingIndicator: LoadingIndicator,\n emptyIndicator,\n maxSelected = Number.MAX_SAFE_INTEGER,\n onMaxSelected,\n hidePlaceholderWhenSelected,\n disabled,\n groupBy,\n className,\n badgeClassName,\n selectFirstItem = true,\n creatable = false,\n triggerSearchOnFocus = false,\n commandProps,\n inputProps,\n hideClearAllButton = false,\n onAddNewItem,\n }: MultipleSelectorProps,\n ref: React.Ref<MultipleSelectorRef>,\n ) => {\n const inputRef = React.useRef<HTMLInputElement>(null)\n const dropdownRef = React.useRef<HTMLDivElement>(null) // Added this\n\n const [open, setOpen] = React.useState(false)\n const [onScrollbar, setOnScrollbar] = React.useState(false)\n const [isLoading, setIsLoading] = React.useState(false)\n\n const [selected, setSelected] = React.useState<Option[]>(value || [])\n const [options, setOptions] = React.useState<GroupOption>(transToGroupOption(arrayDefaultOptions, groupBy))\n const [inputValue, setInputValue] = React.useState('')\n\n const debouncedSearchTerm = useDebounce(inputValue, delay || 500)\n\n React.useImperativeHandle(\n ref,\n () => ({\n selectedValue: [...selected],\n input: inputRef.current as HTMLInputElement,\n focus: () => inputRef?.current?.focus(),\n reset: () => setSelected([]),\n }),\n [selected],\n )\n\n const handleClickOutside = React.useCallback((event: MouseEvent | TouchEvent) => {\n if (dropdownRef.current && !dropdownRef.current.contains(event.target as Node) && inputRef.current && !inputRef.current.contains(event.target as Node)) {\n setOpen(false)\n inputRef.current.blur()\n }\n }, [])\n\n const handleUnselect = React.useCallback(\n (option: Option) => {\n const newOptions = selected.filter((s) => s.value !== option.value)\n setSelected(newOptions)\n onChange?.(newOptions)\n },\n [onChange, selected],\n )\n\n const handleKeyDown = React.useCallback(\n (e: React.KeyboardEvent<HTMLDivElement>) => {\n const input = inputRef.current\n if (!input) return\n\n if (e.key === 'Delete' || e.key === 'Backspace') {\n if (input.value === '' && selected.length > 0) {\n const lastSelectOption = selected[selected.length - 1]\n // If last item is fixed, we should not remove it.\n if (!lastSelectOption.fixed) {\n handleUnselect(selected[selected.length - 1])\n }\n }\n }\n\n // This is not a default behavior of the <input /> field\n if (e.key === 'Escape') {\n input.blur()\n }\n },\n [handleUnselect, selected],\n )\n\n React.useEffect(() => {\n if (open) {\n document.addEventListener('mousedown', handleClickOutside)\n document.addEventListener('touchend', handleClickOutside)\n } else {\n document.removeEventListener('mousedown', handleClickOutside)\n document.removeEventListener('touchend', handleClickOutside)\n }\n\n return () => {\n document.removeEventListener('mousedown', handleClickOutside)\n document.removeEventListener('touchend', handleClickOutside)\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [open])\n\n React.useEffect(() => {\n if (value) {\n setSelected(value)\n }\n }, [value])\n\n React.useEffect(() => {\n /** If `onSearch` is provided, do not trigger options updated. */\n if (!arrayOptions || onSearch) {\n return\n }\n const newOption = transToGroupOption(arrayOptions || [], groupBy)\n if (JSON.stringify(newOption) !== JSON.stringify(options)) {\n setOptions(newOption)\n }\n }, [arrayDefaultOptions, arrayOptions, groupBy, onSearch, options])\n\n React.useEffect(() => {\n /** sync search */\n\n const doSearchSync = () => {\n const res = onSearchSync?.(debouncedSearchTerm)\n setOptions(transToGroupOption(res || [], groupBy))\n }\n\n const exec = async () => {\n if (!onSearchSync || !open) return\n\n if (triggerSearchOnFocus) {\n doSearchSync()\n }\n\n if (debouncedSearchTerm) {\n doSearchSync()\n }\n }\n\n void exec()\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [debouncedSearchTerm, groupBy, open, triggerSearchOnFocus])\n\n React.useEffect(() => {\n /** async search */\n\n const doSearch = async () => {\n setIsLoading(true)\n const res = await onSearch?.(debouncedSearchTerm)\n setOptions(transToGroupOption(res || [], groupBy))\n setIsLoading(false)\n }\n\n const exec = async () => {\n if (!onSearch || !open) return\n\n if (triggerSearchOnFocus) {\n await doSearch()\n }\n\n if (debouncedSearchTerm) {\n await doSearch()\n }\n }\n\n void exec()\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [debouncedSearchTerm, groupBy, open, triggerSearchOnFocus])\n\n const CreatableItem = () => {\n if (!creatable) return undefined\n if (isOptionsExist(options, [{ value: inputValue, label: inputValue }]) || selected.find((s) => s.value === inputValue)) {\n return undefined\n }\n\n const Item = (\n <CommandItem\n value={inputValue}\n className=\"cursor-pointer\"\n onMouseDown={(e) => {\n e.preventDefault()\n e.stopPropagation()\n }}\n onSelect={(value: string) => {\n if (selected.length >= maxSelected) {\n onMaxSelected?.(selected.length)\n return\n }\n setInputValue('')\n const newOptions = [...selected, { value, label: value }]\n setSelected(newOptions)\n onChange?.(newOptions)\n }}\n >\n {`Create \"${inputValue}\"`}\n </CommandItem>\n )\n\n // For normal creatable\n if (!onSearch && inputValue.length > 0) {\n return Item\n }\n\n // For async search creatable. avoid showing creatable item before loading at first.\n if (onSearch && debouncedSearchTerm.length > 0 && !isLoading) {\n return Item\n }\n\n return undefined\n }\n\n const EmptyItem = React.useCallback(() => {\n if (!emptyIndicator) return undefined\n\n // For async search that showing emptyIndicator\n if (onSearch && !creatable && Object.keys(options).length === 0) {\n return (\n <CommandItem value=\"-\" disabled>\n {emptyIndicator}\n </CommandItem>\n )\n }\n\n return <CommandEmpty>{emptyIndicator}</CommandEmpty>\n }, [creatable, emptyIndicator, onSearch, options])\n\n const selectables = React.useMemo<GroupOption>(() => removePickedOption(options, selected), [options, selected])\n\n /** Avoid Creatable Selector freezing or lagging when paste a long string. */\n const commandFilter = React.useCallback(() => {\n if (commandProps?.filter) {\n return commandProps.filter\n }\n\n if (creatable) {\n return (value: string, search: string) => {\n return value.toLowerCase().includes(search.toLowerCase()) ? 1 : -1\n }\n }\n // Using default filter in `cmdk`. We don‘t have to provide it.\n return undefined\n }, [creatable, commandProps?.filter])\n\n return (\n <Command\n ref={dropdownRef}\n {...commandProps}\n onKeyDown={(e) => {\n handleKeyDown(e)\n commandProps?.onKeyDown?.(e)\n }}\n className={cn('h-auto overflow-visible bg-transparent', commandProps?.className)}\n shouldFilter={commandProps?.shouldFilter !== undefined ? commandProps.shouldFilter : !onSearch} // When onSearch is provided, we don‘t want to filter the options. You can still override it.\n filter={commandFilter()}\n >\n <div\n className={cn(\n 'border-border-weak relative rounded-md border text-sm transition-shadow',\n 'focus-within:border-primary',\n 'focus-within:ring-primary-weak',\n 'focus-within:ring-4',\n 'focus-within:outline-hidden',\n 'has-disabled:bg-muted',\n 'has-disabled:text-muted-foreground',\n selected.length !== 0 && 'p-1',\n !disabled && selected.length !== 0 && 'cursor-text',\n !hideClearAllButton && 'pe-9',\n className,\n )}\n onClick={() => {\n if (disabled) return\n inputRef?.current?.focus()\n }}\n >\n <div className=\"flex flex-wrap gap-1\">\n {selected.map((option) => {\n return (\n <div\n key={option.value}\n className={cn(\n 'animate-fadeIn',\n 'bg-background',\n 'hover:bg-background',\n 'border-border-weak border border-solid',\n 'text-text-positive-weak relative inline-flex h-7 cursor-default items-center rounded-md ps-2 pe-7 pl-2 text-xs font-medium transition-all',\n 'disabled:cursor-not-allowed',\n 'disabled:opacity-50',\n 'data-fixed:pe-2',\n badgeClassName,\n )}\n data-fixed={option.fixed}\n data-disabled={disabled || undefined}\n >\n {option.label}\n <button\n type=\"button\"\n disabled={disabled || option.fixed}\n className={cn(\n 'text-text-positive-muted absolute -inset-y-px -end-px flex size-7 items-center justify-center rounded-e-lg border border-transparent p-0 outline-0 transition-colors',\n 'hover:text-foreground',\n 'focus-visible:outline',\n 'focus-visible:outline-2',\n 'focus-visible:outline-primary-weak',\n 'disabled:hover:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50',\n )}\n onKeyDown={(e) => {\n if (e.key !== 'Enter') return\n handleUnselect(option)\n }}\n onMouseDown={(e) => {\n e.preventDefault()\n e.stopPropagation()\n }}\n onClick={() => handleUnselect(option)}\n aria-label=\"Remove\"\n >\n <X size={14} strokeWidth={2} aria-hidden=\"true\" />\n </button>\n </div>\n )\n })}\n {/* Avoid having the \"Search\" Icon */}\n <CommandPrimitive.Input\n {...inputProps}\n ref={inputRef}\n value={inputValue}\n disabled={disabled}\n onValueChange={(value) => {\n setInputValue(value)\n inputProps?.onValueChange?.(value)\n }}\n onBlur={(event) => {\n if (!onScrollbar) {\n setOpen(false)\n }\n inputProps?.onBlur?.(event)\n }}\n onFocus={(event) => {\n setOpen(true)\n if (triggerSearchOnFocus) {\n onSearch?.(debouncedSearchTerm)\n }\n inputProps?.onFocus?.(event)\n }}\n placeholder={hidePlaceholderWhenSelected && selected.length !== 0 ? '' : placeholder}\n className={cn(\n 'placeholder:text-text-positive-muted flex-1 bg-transparent outline-hidden',\n 'disabled:placeholder:text-transparent',\n {\n 'w-full': hidePlaceholderWhenSelected,\n 'px-3 py-2': selected.length === 0,\n 'ml-1': selected.length !== 0,\n },\n inputProps?.className,\n )}\n />\n <button\n type=\"button\"\n onClick={() => {\n setSelected(selected.filter((s) => s.fixed))\n onChange?.(selected.filter((s) => s.fixed))\n }}\n className={cn(\n 'text-muted-foreground/80',\n 'absolute end-0 top-0 flex size-9 items-center justify-center rounded-lg border border-transparent transition-colors',\n 'focus-visible:outline-2',\n 'hover:text-text-positive',\n 'focus-visible:outline-primary-weak',\n (hideClearAllButton || disabled || selected.length < 1 || selected.filter(({ fixed }) => fixed).length === selected.length) && 'hidden',\n )}\n aria-label=\"Clear all\"\n >\n <X size={16} strokeWidth={2} aria-hidden=\"true\" />\n </button>\n </div>\n </div>\n <div className=\"relative\">\n <div\n className={cn(\n 'shadow-dropdown absolute top-2 z-10 w-full overflow-hidden rounded-lg',\n 'data-[state=open]:animate-in',\n 'data-[state=closed]:animate-out',\n 'data-[state=closed]:fade-out-0',\n 'data-[state=open]:fade-in-0',\n 'data-[state=closed]:zoom-out-95',\n 'data-[state=open]:zoom-in-95',\n !open && 'hidden',\n )}\n data-state={open ? 'open' : 'closed'}\n >\n {open && (\n <CommandList\n className=\"shadow-lg outline-hidden\"\n onMouseLeave={() => {\n setOnScrollbar(false)\n }}\n onMouseEnter={() => {\n setOnScrollbar(true)\n }}\n onMouseUp={() => {\n inputRef?.current?.focus()\n }}\n >\n {onAddNewItem && (\n <>\n <CommandSeparator />\n <CommandGroup>\n <Button type=\"button\" variant=\"ghost\" className=\"w-full font-normal [&_div]:justify-start\" onClick={onAddNewItem}>\n <PlusIcon size={14} className=\"opacity-60\" aria-hidden=\"true\" />\n Thêm mới\n </Button>\n </CommandGroup>\n </>\n )}\n {isLoading ? (\n LoadingIndicator\n ) : (\n <React.Fragment>\n {EmptyItem()}\n {CreatableItem()}\n {!selectFirstItem && <CommandItem value=\"-\" className=\"hidden\" />}\n {Object.entries(selectables).map(([key, dropdowns]) => (\n <CommandGroup key={key} heading={key} className=\"h-full overflow-auto\">\n {dropdowns.map((option) => {\n return (\n <CommandItem\n key={option.value}\n value={option.value}\n disabled={option.disable}\n onMouseDown={(e) => {\n e.preventDefault()\n e.stopPropagation()\n }}\n onSelect={() => {\n if (selected.length >= maxSelected) {\n onMaxSelected?.(selected.length)\n return\n }\n const newOptions = [...selected, option]\n setInputValue('')\n setSelected(newOptions)\n onChange?.(newOptions)\n }}\n className={cn('cursor-pointer', option.disable && 'cursor-not-allowed opacity-50')}\n >\n {option.label}\n </CommandItem>\n )\n })}\n </CommandGroup>\n ))}\n </React.Fragment>\n )}\n </CommandList>\n )}\n </div>\n </div>\n </Command>\n )\n },\n)\n\nMultipleSelector.displayName = 'MultipleSelector'\n"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import{cn as e}from"./utils-D9AH0PUV.js";import{jsx as t}from"react/jsx-runtime";import{cva as n}from"class-variance-authority";const r=n(``,{variants:{variant:{p:`leading-7 [&:not(:first-child)]:mt-6`,sm:`text-sm leading-none font-normal`,lg:`text-lg font-semibold`,lead:`text-text-positive-strong text-xl`,muted:`text-text-positive-muted text-sm`},default:{variant:`sm`}}}),i=({variant:n=`p`,className:i,children:a})=>t(`p`,{className:e(`text-text-positive`,r({variant:n}),i),children:a});export{i as Paragraph};
|
|
2
|
-
//# sourceMappingURL=paragraph-
|
|
2
|
+
//# sourceMappingURL=paragraph-C0KfolV0.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"paragraph-
|
|
1
|
+
{"version":3,"file":"paragraph-C0KfolV0.js","names":[],"sources":["../packages/components/typography/paragraph.tsx"],"sourcesContent":["'use client'\nimport { cva } from 'class-variance-authority'\n\nimport { cn } from '@/lib/utils'\n\ntype Props = {\n variant?: 'p' | 'muted' | 'lead' | 'sm' | 'lg'\n className?: string\n children?: React.ReactNode\n}\n\nconst paragraphVariants = cva('', {\n variants: {\n variant: {\n p: 'leading-7 [&:not(:first-child)]:mt-6',\n sm: 'text-sm leading-none font-normal',\n lg: 'text-lg font-semibold',\n lead: 'text-text-positive-strong text-xl',\n muted: 'text-text-positive-muted text-sm',\n },\n default: {\n variant: 'sm',\n },\n },\n})\n\nexport const Paragraph = ({ variant = 'p', className, children }: Props) => {\n return <p className={cn('text-text-positive', paragraphVariants({ variant }), className)}>{children}</p>\n}\n"],"mappings":"gIAWA,MAAM,EAAoB,EAAI,GAAI,CAChC,SAAU,CACR,QAAS,CACP,EAAG,uCACH,GAAI,mCACJ,GAAI,wBACJ,KAAM,oCACN,MAAO,oCAET,QAAS,CACP,QAAS,SAKF,GAAa,CAAE,UAAU,IAAK,YAAW,cAC7C,EAAC,IAAA,CAAE,UAAW,EAAG,qBAAsB,EAAkB,CAAE,YAAY,GAAa"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
const e=require(`./chunk-CUT6urMc.cjs`),t=require(`./utils-BsjVK5EW.cjs`),n=e.__toESM(require(`react/jsx-runtime`)),r=e.__toESM(require(`class-variance-authority`)),i=(0,r.cva)(``,{variants:{variant:{p:`leading-7 [&:not(:first-child)]:mt-6`,sm:`text-sm leading-none font-normal`,lg:`text-lg font-semibold`,lead:`text-text-positive-strong text-xl`,muted:`text-text-positive-muted text-sm`},default:{variant:`sm`}}}),a=({variant:e=`p`,className:r,children:a})=>(0,n.jsx)(`p`,{className:t.cn(`text-text-positive`,i({variant:e}),r),children:a});Object.defineProperty(exports,`Paragraph`,{enumerable:!0,get:function(){return a}});
|
|
2
|
-
//# sourceMappingURL=paragraph-
|
|
2
|
+
//# sourceMappingURL=paragraph-JXci2Ihg.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"paragraph-
|
|
1
|
+
{"version":3,"file":"paragraph-JXci2Ihg.cjs","names":["cn"],"sources":["../packages/components/typography/paragraph.tsx"],"sourcesContent":["'use client'\nimport { cva } from 'class-variance-authority'\n\nimport { cn } from '@/lib/utils'\n\ntype Props = {\n variant?: 'p' | 'muted' | 'lead' | 'sm' | 'lg'\n className?: string\n children?: React.ReactNode\n}\n\nconst paragraphVariants = cva('', {\n variants: {\n variant: {\n p: 'leading-7 [&:not(:first-child)]:mt-6',\n sm: 'text-sm leading-none font-normal',\n lg: 'text-lg font-semibold',\n lead: 'text-text-positive-strong text-xl',\n muted: 'text-text-positive-muted text-sm',\n },\n default: {\n variant: 'sm',\n },\n },\n})\n\nexport const Paragraph = ({ variant = 'p', className, children }: Props) => {\n return <p className={cn('text-text-positive', paragraphVariants({ variant }), className)}>{children}</p>\n}\n"],"mappings":"qKAWM,GAAA,EAAA,EAAA,KAAwB,GAAI,CAChC,SAAU,CACR,QAAS,CACP,EAAG,uCACH,GAAI,mCACJ,GAAI,wBACJ,KAAM,oCACN,MAAO,oCAET,QAAS,CACP,QAAS,SAKF,GAAa,CAAE,UAAU,IAAK,YAAW,eAC7C,EAAA,EAAA,KAAC,IAAA,CAAE,UAAWA,EAAAA,GAAG,qBAAsB,EAAkB,CAAE,YAAY,GAAa"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
const e=require(`./chunk-CUT6urMc.cjs`),t=require(`./utils-BsjVK5EW.cjs`),n=e.__toESM(require(`react/jsx-runtime`)),r=e.__toESM(require(`radix-ui`));function i({...e}){return(0,n.jsx)(r.Popover.Root,{"data-slot":`popover`,...e})}function a({...e}){return(0,n.jsx)(r.Popover.Trigger,{"data-slot":`popover-trigger`,...e})}function o({className:e,align:i=`start`,sideOffset:a=4,...o}){return(0,n.jsx)(r.Popover.Portal,{children:(0,n.jsx)(r.Popover.Content,{"data-slot":`popover-content`,align:i,sideOffset:a,className:t.cn(`bg-popover`,`text-text-positive`,`z-50 w-72`,`origin-(--radix-popover-content-transform-origin)`,`shadow-dropdown rounded-md p-4 outline-none`,`data-[state=open]:animate-in`,`data-[state=open]:fade-in-0`,`data-[state=open]:zoom-in-95`,`data-[state=closed]:animate-out`,`data-[state=closed]:fade-out-0`,`data-[state=closed]:zoom-out-95`,`data-[side=bottom]:slide-in-from-top-2`,`data-[side=left]:slide-in-from-right-2`,`data-[side=right]:slide-in-from-left-2`,`data-[side=top]:slide-in-from-bottom-2`,e),...o})})}function s({...e}){return(0,n.jsx)(r.Popover.Anchor,{"data-slot":`popover-anchor`,...e})}Object.defineProperty(exports,`Popover`,{enumerable:!0,get:function(){return i}}),Object.defineProperty(exports,`PopoverAnchor`,{enumerable:!0,get:function(){return s}}),Object.defineProperty(exports,`PopoverContent`,{enumerable:!0,get:function(){return o}}),Object.defineProperty(exports,`PopoverTrigger`,{enumerable:!0,get:function(){return a}});
|
|
2
|
-
//# sourceMappingURL=popover-
|
|
2
|
+
//# sourceMappingURL=popover-ByzBl1kH.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"popover-
|
|
1
|
+
{"version":3,"file":"popover-ByzBl1kH.cjs","names":["PopoverPrimitive","cn"],"sources":["../packages/components/ui/popover.tsx"],"sourcesContent":["'use client'\nimport { Popover as PopoverPrimitive } from 'radix-ui'\n\nimport { cn } from '@/lib/utils'\n\nfunction Popover({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Root>) {\n return <PopoverPrimitive.Root data-slot=\"popover\" {...props} />\n}\n\nfunction PopoverTrigger({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Trigger>) {\n return <PopoverPrimitive.Trigger data-slot=\"popover-trigger\" {...props} />\n}\n\nfunction PopoverContent({ className, align = 'start', sideOffset = 4, ...props }: React.ComponentProps<typeof PopoverPrimitive.Content>) {\n return (\n <PopoverPrimitive.Portal>\n <PopoverPrimitive.Content\n data-slot=\"popover-content\"\n align={align}\n sideOffset={sideOffset}\n className={cn(\n 'bg-popover',\n 'text-text-positive',\n 'z-50 w-72',\n 'origin-(--radix-popover-content-transform-origin)',\n 'shadow-dropdown rounded-md p-4 outline-none',\n 'data-[state=open]:animate-in',\n 'data-[state=open]:fade-in-0',\n 'data-[state=open]:zoom-in-95',\n 'data-[state=closed]:animate-out',\n 'data-[state=closed]:fade-out-0',\n 'data-[state=closed]:zoom-out-95',\n 'data-[side=bottom]:slide-in-from-top-2',\n 'data-[side=left]:slide-in-from-right-2',\n 'data-[side=right]:slide-in-from-left-2',\n 'data-[side=top]:slide-in-from-bottom-2',\n className,\n )}\n {...props}\n />\n </PopoverPrimitive.Portal>\n )\n}\n\nfunction PopoverAnchor({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Anchor>) {\n return <PopoverPrimitive.Anchor data-slot=\"popover-anchor\" {...props} />\n}\n\nexport { Popover, PopoverAnchor, PopoverContent, PopoverTrigger }\n"],"mappings":"qJAKA,SAAS,EAAQ,CAAE,GAAG,GAA6D,CACjF,OAAO,EAAA,EAAA,KAACA,EAAAA,QAAiB,KAAA,CAAK,YAAU,UAAU,GAAI,IAGxD,SAAS,EAAe,CAAE,GAAG,GAAgE,CAC3F,OAAO,EAAA,EAAA,KAACA,EAAAA,QAAiB,QAAA,CAAQ,YAAU,kBAAkB,GAAI,IAGnE,SAAS,EAAe,CAAE,YAAW,QAAQ,QAAS,aAAa,EAAG,GAAG,GAAgE,CACvI,OACE,EAAA,EAAA,KAACA,EAAAA,QAAiB,OAAA,CAAA,UAChB,EAAA,EAAA,KAACA,EAAAA,QAAiB,QAAA,CAChB,YAAU,kBACH,QACK,aACZ,UAAWC,EAAAA,GACT,aACA,qBACA,YACA,oDACA,8CACA,+BACA,8BACA,+BACA,kCACA,iCACA,kCACA,yCACA,yCACA,yCACA,yCACA,GAEF,GAAI,MAMZ,SAAS,EAAc,CAAE,GAAG,GAA+D,CACzF,OAAO,EAAA,EAAA,KAACD,EAAAA,QAAiB,OAAA,CAAO,YAAU,iBAAiB,GAAI"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import{cn as e}from"./utils-D9AH0PUV.js";import{jsx as t}from"react/jsx-runtime";import{Popover as n}from"radix-ui";function r({...e}){return t(n.Root,{"data-slot":`popover`,...e})}function i({...e}){return t(n.Trigger,{"data-slot":`popover-trigger`,...e})}function a({className:r,align:i=`start`,sideOffset:a=4,...o}){return t(n.Portal,{children:t(n.Content,{"data-slot":`popover-content`,align:i,sideOffset:a,className:e(`bg-popover`,`text-text-positive`,`z-50 w-72`,`origin-(--radix-popover-content-transform-origin)`,`shadow-dropdown rounded-md p-4 outline-none`,`data-[state=open]:animate-in`,`data-[state=open]:fade-in-0`,`data-[state=open]:zoom-in-95`,`data-[state=closed]:animate-out`,`data-[state=closed]:fade-out-0`,`data-[state=closed]:zoom-out-95`,`data-[side=bottom]:slide-in-from-top-2`,`data-[side=left]:slide-in-from-right-2`,`data-[side=right]:slide-in-from-left-2`,`data-[side=top]:slide-in-from-bottom-2`,r),...o})})}function o({...e}){return t(n.Anchor,{"data-slot":`popover-anchor`,...e})}export{r as Popover,o as PopoverAnchor,a as PopoverContent,i as PopoverTrigger};
|
|
2
|
-
//# sourceMappingURL=popover-
|
|
2
|
+
//# sourceMappingURL=popover-DyoAfuhi.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"popover-
|
|
1
|
+
{"version":3,"file":"popover-DyoAfuhi.js","names":["Popover","PopoverPrimitive"],"sources":["../packages/components/ui/popover.tsx"],"sourcesContent":["'use client'\nimport { Popover as PopoverPrimitive } from 'radix-ui'\n\nimport { cn } from '@/lib/utils'\n\nfunction Popover({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Root>) {\n return <PopoverPrimitive.Root data-slot=\"popover\" {...props} />\n}\n\nfunction PopoverTrigger({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Trigger>) {\n return <PopoverPrimitive.Trigger data-slot=\"popover-trigger\" {...props} />\n}\n\nfunction PopoverContent({ className, align = 'start', sideOffset = 4, ...props }: React.ComponentProps<typeof PopoverPrimitive.Content>) {\n return (\n <PopoverPrimitive.Portal>\n <PopoverPrimitive.Content\n data-slot=\"popover-content\"\n align={align}\n sideOffset={sideOffset}\n className={cn(\n 'bg-popover',\n 'text-text-positive',\n 'z-50 w-72',\n 'origin-(--radix-popover-content-transform-origin)',\n 'shadow-dropdown rounded-md p-4 outline-none',\n 'data-[state=open]:animate-in',\n 'data-[state=open]:fade-in-0',\n 'data-[state=open]:zoom-in-95',\n 'data-[state=closed]:animate-out',\n 'data-[state=closed]:fade-out-0',\n 'data-[state=closed]:zoom-out-95',\n 'data-[side=bottom]:slide-in-from-top-2',\n 'data-[side=left]:slide-in-from-right-2',\n 'data-[side=right]:slide-in-from-left-2',\n 'data-[side=top]:slide-in-from-bottom-2',\n className,\n )}\n {...props}\n />\n </PopoverPrimitive.Portal>\n )\n}\n\nfunction PopoverAnchor({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Anchor>) {\n return <PopoverPrimitive.Anchor data-slot=\"popover-anchor\" {...props} />\n}\n\nexport { Popover, PopoverAnchor, PopoverContent, PopoverTrigger }\n"],"mappings":"oHAKA,SAASA,EAAQ,CAAE,GAAG,GAA6D,CACjF,OAAO,EAACC,EAAiB,KAAA,CAAK,YAAU,UAAU,GAAI,IAGxD,SAAS,EAAe,CAAE,GAAG,GAAgE,CAC3F,OAAO,EAACA,EAAiB,QAAA,CAAQ,YAAU,kBAAkB,GAAI,IAGnE,SAAS,EAAe,CAAE,YAAW,QAAQ,QAAS,aAAa,EAAG,GAAG,GAAgE,CACvI,OACE,EAACA,EAAiB,OAAA,CAAA,SAChB,EAACA,EAAiB,QAAA,CAChB,YAAU,kBACH,QACK,aACZ,UAAW,EACT,aACA,qBACA,YACA,oDACA,8CACA,+BACA,8BACA,+BACA,kCACA,iCACA,kCACA,yCACA,yCACA,yCACA,yCACA,GAEF,GAAI,MAMZ,SAAS,EAAc,CAAE,GAAG,GAA+D,CACzF,OAAO,EAACA,EAAiB,OAAA,CAAO,YAAU,iBAAiB,GAAI"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{Button as e}from"./button-Pscu7CVU.js";import{Paragraph as t}from"./paragraph-C0KfolV0.js";import{jsx as n,jsxs as r}from"react/jsx-runtime";import{RefreshCwIcon as i}from"lucide-react";const a=({onClick:a=()=>{}})=>r(e,{"aria-label":`Tạo mới`,variant:`outline`,color:`muted`,className:`max-sm:aspect-square max-sm:p-0`,onClick:a,children:[n(i,{className:`opacity-60 sm:-ms-1`,size:16,"aria-hidden":`true`}),n(t,{variant:`sm`,className:`max-sm:sr-only`,children:`Reset`})]});export{a as RefreshBtn};
|
|
2
|
+
//# sourceMappingURL=refresh-B6cTks2r.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"refresh-
|
|
1
|
+
{"version":3,"file":"refresh-B6cTks2r.js","names":["RefreshBtn: React.FC<React.PropsWithChildren<Props>>"],"sources":["../packages/components/ui/buttons/refresh.tsx"],"sourcesContent":["import { RefreshCwIcon } from 'lucide-react'\n\nimport { Paragraph } from '@/components/typography/paragraph'\n\nimport { Button } from '../button'\n\ntype Props = {\n onClick?: () => void\n}\nexport const RefreshBtn: React.FC<React.PropsWithChildren<Props>> = ({ onClick = () => {} }) => {\n return (\n <Button aria-label=\"Tạo mới\" variant=\"outline\" color=\"muted\" className=\"max-sm:aspect-square max-sm:p-0\" onClick={onClick}>\n <RefreshCwIcon className=\"opacity-60 sm:-ms-1\" size={16} aria-hidden=\"true\" />\n <Paragraph variant=\"sm\" className=\"max-sm:sr-only\">\n Reset\n </Paragraph>\n </Button>\n )\n}\n"],"mappings":"iMASA,MAAaA,GAAwD,CAAE,cAAgB,MAEnF,EAAC,EAAA,CAAO,aAAW,UAAU,QAAQ,UAAU,MAAM,QAAQ,UAAU,kCAA2C,oBAChH,EAAC,EAAA,CAAc,UAAU,sBAAsB,KAAM,GAAI,cAAY,SACrE,EAAC,EAAA,CAAU,QAAQ,KAAK,UAAU,0BAAiB"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
const e=require(`./chunk-CUT6urMc.cjs`),t=require(`./
|
|
2
|
-
//# sourceMappingURL=refresh-
|
|
1
|
+
const e=require(`./chunk-CUT6urMc.cjs`),t=require(`./button-Db_CKSZw.cjs`),n=require(`./paragraph-JXci2Ihg.cjs`),r=e.__toESM(require(`react/jsx-runtime`)),i=e.__toESM(require(`lucide-react`)),a=({onClick:e=()=>{}})=>(0,r.jsxs)(t.Button,{"aria-label":`Tạo mới`,variant:`outline`,color:`muted`,className:`max-sm:aspect-square max-sm:p-0`,onClick:e,children:[(0,r.jsx)(i.RefreshCwIcon,{className:`opacity-60 sm:-ms-1`,size:16,"aria-hidden":`true`}),(0,r.jsx)(n.Paragraph,{variant:`sm`,className:`max-sm:sr-only`,children:`Reset`})]});Object.defineProperty(exports,`RefreshBtn`,{enumerable:!0,get:function(){return a}});
|
|
2
|
+
//# sourceMappingURL=refresh-T1bZVS2m.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"refresh-
|
|
1
|
+
{"version":3,"file":"refresh-T1bZVS2m.cjs","names":["RefreshBtn: React.FC<React.PropsWithChildren<Props>>","Button","RefreshCwIcon","Paragraph"],"sources":["../packages/components/ui/buttons/refresh.tsx"],"sourcesContent":["import { RefreshCwIcon } from 'lucide-react'\n\nimport { Paragraph } from '@/components/typography/paragraph'\n\nimport { Button } from '../button'\n\ntype Props = {\n onClick?: () => void\n}\nexport const RefreshBtn: React.FC<React.PropsWithChildren<Props>> = ({ onClick = () => {} }) => {\n return (\n <Button aria-label=\"Tạo mới\" variant=\"outline\" color=\"muted\" className=\"max-sm:aspect-square max-sm:p-0\" onClick={onClick}>\n <RefreshCwIcon className=\"opacity-60 sm:-ms-1\" size={16} aria-hidden=\"true\" />\n <Paragraph variant=\"sm\" className=\"max-sm:sr-only\">\n Reset\n </Paragraph>\n </Button>\n )\n}\n"],"mappings":"gMASaA,GAAwD,CAAE,cAAgB,OAEnF,EAAA,EAAA,MAACC,EAAAA,OAAAA,CAAO,aAAW,UAAU,QAAQ,UAAU,MAAM,QAAQ,UAAU,kCAA2C,qBAChH,EAAA,EAAA,KAACC,EAAAA,cAAAA,CAAc,UAAU,sBAAsB,KAAM,GAAI,cAAY,UACrE,EAAA,EAAA,KAACC,EAAAA,UAAAA,CAAU,QAAQ,KAAK,UAAU,0BAAiB"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{cn as e}from"./utils-D9AH0PUV.js";import{Input as t}from"./input
|
|
2
|
-
//# sourceMappingURL=search-input-
|
|
1
|
+
import{cn as e}from"./utils-D9AH0PUV.js";import{Input as t}from"./input-nsu0-DwM.js";import{jsx as n,jsxs as r}from"react/jsx-runtime";import{ArrowRightIcon as i,SearchIcon as a}from"lucide-react";const o=({className:o,...s})=>r(`div`,{className:`relative`,children:[n(t,{...s,type:`search`,className:e(`ps-9 pe-9`,o)}),n(`div`,{className:`text-muted-foreground/80 pointer-events-none absolute inset-y-0 start-0 flex items-center justify-center ps-3 peer-disabled:opacity-50`,children:n(a,{size:16})}),n(`button`,{className:`text-muted-foreground/80 hover:text-foreground focus-visible:border-ring focus-visible:ring-ring/50 absolute inset-y-0 end-0 flex h-full w-9 items-center justify-center rounded-e-md transition-[color,box-shadow] outline-none focus:z-10 focus-visible:ring-[3px] disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50`,"aria-label":`Submit search`,type:`submit`,children:n(i,{size:16,"aria-hidden":`true`})})]});export{o as SearchInput};
|
|
2
|
+
//# sourceMappingURL=search-input-BTzO9gpv.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"search-input-
|
|
1
|
+
{"version":3,"file":"search-input-BTzO9gpv.js","names":[],"sources":["../packages/components/ui/inputs/search-input.tsx"],"sourcesContent":["import { ArrowRightIcon, SearchIcon } from 'lucide-react'\n\nimport { cn } from '@/lib/utils'\n\nimport { Input } from '../input'\n\ntype Props = React.ComponentPropsWithoutRef<typeof Input>\nexport const SearchInput = ({ className, ...rest }: Props) => {\n return (\n <div className=\"relative\">\n <Input {...rest} type=\"search\" className={cn('ps-9 pe-9', className)} />\n <div className=\"text-muted-foreground/80 pointer-events-none absolute inset-y-0 start-0 flex items-center justify-center ps-3 peer-disabled:opacity-50\">\n <SearchIcon size={16} />\n </div>\n <button\n className=\"text-muted-foreground/80 hover:text-foreground focus-visible:border-ring focus-visible:ring-ring/50 absolute inset-y-0 end-0 flex h-full w-9 items-center justify-center rounded-e-md transition-[color,box-shadow] outline-none focus:z-10 focus-visible:ring-[3px] disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50\"\n aria-label=\"Submit search\"\n type=\"submit\"\n >\n <ArrowRightIcon size={16} aria-hidden=\"true\" />\n </button>\n </div>\n )\n}\n"],"mappings":"qMAOA,MAAa,GAAe,CAAE,YAAW,GAAG,KAExC,EAAC,MAAA,CAAI,UAAU,qBACb,EAAC,EAAA,CAAM,GAAI,EAAM,KAAK,SAAS,UAAW,EAAG,YAAa,KAC1D,EAAC,MAAA,CAAI,UAAU,kJACb,EAAC,EAAA,CAAW,KAAM,OAEpB,EAAC,SAAA,CACC,UAAU,oVACV,aAAW,gBACX,KAAK,kBAEL,EAAC,EAAA,CAAe,KAAM,GAAI,cAAY"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
const e=require(`./chunk-CUT6urMc.cjs`),t=require(`./utils-BsjVK5EW.cjs`),n=require(`./input-
|
|
2
|
-
//# sourceMappingURL=search-input-
|
|
1
|
+
const e=require(`./chunk-CUT6urMc.cjs`),t=require(`./utils-BsjVK5EW.cjs`),n=require(`./input-C-60EZ1K.cjs`),r=e.__toESM(require(`react/jsx-runtime`)),i=e.__toESM(require(`lucide-react`)),a=({className:e,...a})=>(0,r.jsxs)(`div`,{className:`relative`,children:[(0,r.jsx)(n.Input,{...a,type:`search`,className:t.cn(`ps-9 pe-9`,e)}),(0,r.jsx)(`div`,{className:`text-muted-foreground/80 pointer-events-none absolute inset-y-0 start-0 flex items-center justify-center ps-3 peer-disabled:opacity-50`,children:(0,r.jsx)(i.SearchIcon,{size:16})}),(0,r.jsx)(`button`,{className:`text-muted-foreground/80 hover:text-foreground focus-visible:border-ring focus-visible:ring-ring/50 absolute inset-y-0 end-0 flex h-full w-9 items-center justify-center rounded-e-md transition-[color,box-shadow] outline-none focus:z-10 focus-visible:ring-[3px] disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50`,"aria-label":`Submit search`,type:`submit`,children:(0,r.jsx)(i.ArrowRightIcon,{size:16,"aria-hidden":`true`})})]});Object.defineProperty(exports,`SearchInput`,{enumerable:!0,get:function(){return a}});
|
|
2
|
+
//# sourceMappingURL=search-input-CDvluPxl.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"search-input-
|
|
1
|
+
{"version":3,"file":"search-input-CDvluPxl.cjs","names":["Input","cn","SearchIcon","ArrowRightIcon"],"sources":["../packages/components/ui/inputs/search-input.tsx"],"sourcesContent":["import { ArrowRightIcon, SearchIcon } from 'lucide-react'\n\nimport { cn } from '@/lib/utils'\n\nimport { Input } from '../input'\n\ntype Props = React.ComponentPropsWithoutRef<typeof Input>\nexport const SearchInput = ({ className, ...rest }: Props) => {\n return (\n <div className=\"relative\">\n <Input {...rest} type=\"search\" className={cn('ps-9 pe-9', className)} />\n <div className=\"text-muted-foreground/80 pointer-events-none absolute inset-y-0 start-0 flex items-center justify-center ps-3 peer-disabled:opacity-50\">\n <SearchIcon size={16} />\n </div>\n <button\n className=\"text-muted-foreground/80 hover:text-foreground focus-visible:border-ring focus-visible:ring-ring/50 absolute inset-y-0 end-0 flex h-full w-9 items-center justify-center rounded-e-md transition-[color,box-shadow] outline-none focus:z-10 focus-visible:ring-[3px] disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50\"\n aria-label=\"Submit search\"\n type=\"submit\"\n >\n <ArrowRightIcon size={16} aria-hidden=\"true\" />\n </button>\n </div>\n )\n}\n"],"mappings":"2LAOa,GAAe,CAAE,YAAW,GAAG,MAExC,EAAA,EAAA,MAAC,MAAA,CAAI,UAAU,sBACb,EAAA,EAAA,KAACA,EAAAA,MAAAA,CAAM,GAAI,EAAM,KAAK,SAAS,UAAWC,EAAAA,GAAG,YAAa,MAC1D,EAAA,EAAA,KAAC,MAAA,CAAI,UAAU,mJACb,EAAA,EAAA,KAACC,EAAAA,WAAAA,CAAW,KAAM,QAEpB,EAAA,EAAA,KAAC,SAAA,CACC,UAAU,oVACV,aAAW,gBACX,KAAK,mBAEL,EAAA,EAAA,KAACC,EAAAA,eAAAA,CAAe,KAAM,GAAI,cAAY"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
const e=require(`./chunk-CUT6urMc.cjs`),t=require(`./utils-BsjVK5EW.cjs`),n=e.__toESM(require(`react/jsx-runtime`)),r=e.__toESM(require(`lucide-react`)),i=e.__toESM(require(`radix-ui`));function a({...e}){return(0,n.jsx)(i.Select.Root,{"data-slot":`select`,...e})}function o({...e}){return(0,n.jsx)(i.Select.Group,{"data-slot":`select-group`,...e})}function s({...e}){return(0,n.jsx)(i.Select.Value,{"data-slot":`select-value`,...e})}function c({className:e,size:a=`default`,children:o,...s}){return(0,n.jsxs)(i.Select.Trigger,{"data-slot":`select-trigger`,"data-size":a,className:t.cn(`border-border-weak shadow-input`,`flex w-fit items-center justify-between`,`gap-2 rounded-md border bg-transparent px-3 py-2 text-sm`,`whitespace-nowrap transition-all outline-none`,`cursor-pointer`,`hover:border-border`,`focus:border-primary-strong`,`focus:ring-primary-weak`,`focus:ring-4`,`aria-invalid:ring-danger-weak`,`aria-invalid:border-danger-strong`,`disabled:cursor-not-allowed`,`disabled:opacity-50`,`data-[state=open]:text-text-positive-muted`,`data-[state=open]:border-primary`,`data-[state=open]:ring-ring`,`data-[state=open]:ring-4`,`data-[placeholder]:text-text-positive-muted`,`data-[size=default]:h-9`,`data-[size=sm]:h-8`,`*:data-[slot=select-value]:line-clamp-1`,`*:data-[slot=select-value]:flex`,`*:data-[slot=select-value]:items-center`,`*:data-[slot=select-value]:gap-2`,`[&_svg]:shrink-0`,`[&_svg]:pointer-events-none`,`[&_svg:not([class*='size-'])]:size-4`,`[&_svg:not([class*='text-'])]:text-muted-foreground`,e),...s,children:[o,(0,n.jsx)(i.Select.Icon,{asChild:!0,children:(0,n.jsx)(r.ChevronDownIcon,{size:16,opacity:50})})]})}function l({className:e,children:r,position:a=`popper`,...o}){return(0,n.jsx)(i.Select.Portal,{children:(0,n.jsxs)(i.Select.Content,{"data-slot":`select-content`,className:t.cn(`bg-popover`,`relative z-50`,`min-w-32`,`overflow-x-hidden overflow-y-auto`,`shadow-dropdown rounded-md`,`data-[state=open]:animate-in`,`data-[state=open]:fade-in-0`,`data-[state=open]:zoom-in-95`,`data-[state=closed]:animate-out`,`data-[state=closed]:fade-out-0`,`data-[state=closed]:zoom-out-95`,`data-[side=bottom]:slide-in-from-top-2`,`data-[side=left]:slide-in-from-right-2`,`data-[side=right]:slide-in-from-left-2`,`data-[side=top]:slide-in-from-bottom-2`,`max-h-(--radix-select-content-available-height)`,`origin-(--radix-select-content-transform-origin)`,a===`popper`&&`data-[side=bottom]:translate-y-1`,a===`popper`&&`data-[side=left]:-translate-x-1`,a===`popper`&&`data-[side=right]:translate-x-1`,a===`popper`&&`data-[side=top]:-translate-y-1`,e),position:a,...o,children:[(0,n.jsx)(p,{}),(0,n.jsx)(i.Select.Viewport,{className:t.cn(`p-1`,a===`popper`&&`w-full scroll-my-1`,a===`popper`&&`h-[var(--radix-select-trigger-height)]`,a===`popper`&&`min-w-[var(--radix-select-trigger-width)]`),children:r}),(0,n.jsx)(m,{})]})})}function u({className:e,...r}){return(0,n.jsx)(i.Select.Label,{"data-slot":`select-label`,className:t.cn(`text-text-positive-weak px-2 py-1.5 text-xs`,e),...r})}function d({className:e,children:a,...o}){return(0,n.jsxs)(i.Select.Item,{"data-slot":`select-item`,className:t.cn(`relative flex items-center select-none`,`gap-2 rounded-md py-2.5 pr-8 pl-2`,`w-full`,`cursor-pointer transition-colors`,`text-text-positive text-sm outline-hidden`,`focus:bg-muted-muted`,`focus:text-text-positive-strong`,`data-[disabled]:opacity-50`,`data-[disabled]:pointer-events-none`,`[&_svg]:pointer-events-none`,`[&_svg]:shrink-0`,`[&_svg:not([class*='size-'])]:size-4`,`[&_svg:not([class*='text-'])]:text-text-positive-weak`,`*:[span]:last:flex`,`*:[span]:last:items-center`,`*:[span]:last:gap-2`,e),...o,children:[(0,n.jsx)(`span`,{className:`absolute right-2 flex size-3.5 items-center justify-center`,children:(0,n.jsx)(i.Select.ItemIndicator,{children:(0,n.jsx)(r.CheckIcon,{size:16})})}),(0,n.jsx)(i.Select.ItemText,{children:a})]})}function f({className:e,...r}){return(0,n.jsx)(i.Select.Separator,{"data-slot":`select-separator`,className:t.cn(`bg-border-weak pointer-events-none -mx-1 my-1 h-px`,e),...r})}function p({className:e,...a}){return(0,n.jsx)(i.Select.ScrollUpButton,{"data-slot":`select-scroll-up-button`,className:t.cn(`flex cursor-default items-center justify-center py-1`,e),...a,children:(0,n.jsx)(r.ChevronUpIcon,{className:`size-4`})})}function m({className:e,...a}){return(0,n.jsx)(i.Select.ScrollDownButton,{"data-slot":`select-scroll-down-button`,className:t.cn(`flex cursor-default items-center justify-center py-1`,e),...a,children:(0,n.jsx)(r.ChevronDownIcon,{className:`size-4`})})}Object.defineProperty(exports,`Select`,{enumerable:!0,get:function(){return a}}),Object.defineProperty(exports,`SelectContent`,{enumerable:!0,get:function(){return l}}),Object.defineProperty(exports,`SelectGroup`,{enumerable:!0,get:function(){return o}}),Object.defineProperty(exports,`SelectItem`,{enumerable:!0,get:function(){return d}}),Object.defineProperty(exports,`SelectLabel`,{enumerable:!0,get:function(){return u}}),Object.defineProperty(exports,`SelectScrollDownButton`,{enumerable:!0,get:function(){return m}}),Object.defineProperty(exports,`SelectScrollUpButton`,{enumerable:!0,get:function(){return p}}),Object.defineProperty(exports,`SelectSeparator`,{enumerable:!0,get:function(){return f}}),Object.defineProperty(exports,`SelectTrigger`,{enumerable:!0,get:function(){return c}}),Object.defineProperty(exports,`SelectValue`,{enumerable:!0,get:function(){return s}});
|
|
2
|
+
//# sourceMappingURL=select-BQqcz6WZ.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"select-BQqcz6WZ.cjs","names":["SelectPrimitive","cn","ChevronDownIcon","CheckIcon","ChevronUpIcon"],"sources":["../packages/components/ui/select.tsx"],"sourcesContent":["'use client'\nimport { Select as SelectPrimitive } from 'radix-ui'\nimport { CheckIcon, ChevronDownIcon, ChevronUpIcon } from 'lucide-react'\n\nimport { cn } from '@/lib/utils'\n\nfunction Select({ ...props }: React.ComponentProps<typeof SelectPrimitive.Root>) {\n return <SelectPrimitive.Root data-slot=\"select\" {...props} />\n}\n\nfunction SelectGroup({ ...props }: React.ComponentProps<typeof SelectPrimitive.Group>) {\n return <SelectPrimitive.Group data-slot=\"select-group\" {...props} />\n}\n\nfunction SelectValue({ ...props }: React.ComponentProps<typeof SelectPrimitive.Value>) {\n return <SelectPrimitive.Value data-slot=\"select-value\" {...props} />\n}\n\nfunction SelectTrigger({\n className,\n size = 'default',\n children,\n ...props\n}: React.ComponentProps<typeof SelectPrimitive.Trigger> & {\n size?: 'sm' | 'default'\n}) {\n return (\n <SelectPrimitive.Trigger\n data-slot=\"select-trigger\"\n data-size={size}\n className={cn(\n 'border-border-weak shadow-input',\n 'flex w-fit items-center justify-between',\n 'gap-2 rounded-md border bg-transparent px-3 py-2 text-sm',\n 'whitespace-nowrap transition-all outline-none',\n 'cursor-pointer',\n 'hover:border-border',\n 'focus:border-primary-strong',\n 'focus:ring-primary-weak',\n 'focus:ring-4',\n 'aria-invalid:ring-danger-weak',\n 'aria-invalid:border-danger-strong',\n 'disabled:cursor-not-allowed',\n 'disabled:opacity-50',\n 'data-[state=open]:text-text-positive-muted',\n 'data-[state=open]:border-primary',\n 'data-[state=open]:ring-ring',\n 'data-[state=open]:ring-4',\n 'data-[placeholder]:text-text-positive-muted',\n 'data-[size=default]:h-9',\n 'data-[size=sm]:h-8',\n '*:data-[slot=select-value]:line-clamp-1',\n '*:data-[slot=select-value]:flex',\n '*:data-[slot=select-value]:items-center',\n '*:data-[slot=select-value]:gap-2',\n '[&_svg]:shrink-0',\n '[&_svg]:pointer-events-none',\n \"[&_svg:not([class*='size-'])]:size-4\",\n \"[&_svg:not([class*='text-'])]:text-muted-foreground\",\n className,\n )}\n {...props}\n >\n {children}\n <SelectPrimitive.Icon asChild>\n <ChevronDownIcon size={16} opacity={50} />\n </SelectPrimitive.Icon>\n </SelectPrimitive.Trigger>\n )\n}\n\nfunction SelectContent({ className, children, position = 'popper', ...props }: React.ComponentProps<typeof SelectPrimitive.Content>) {\n return (\n <SelectPrimitive.Portal>\n <SelectPrimitive.Content\n data-slot=\"select-content\"\n className={cn(\n 'bg-popover',\n 'relative z-50',\n 'min-w-32',\n 'overflow-x-hidden overflow-y-auto',\n 'shadow-dropdown rounded-md',\n 'data-[state=open]:animate-in',\n 'data-[state=open]:fade-in-0',\n 'data-[state=open]:zoom-in-95',\n 'data-[state=closed]:animate-out',\n 'data-[state=closed]:fade-out-0',\n 'data-[state=closed]:zoom-out-95',\n 'data-[side=bottom]:slide-in-from-top-2',\n 'data-[side=left]:slide-in-from-right-2',\n 'data-[side=right]:slide-in-from-left-2',\n 'data-[side=top]:slide-in-from-bottom-2',\n 'max-h-(--radix-select-content-available-height)',\n 'origin-(--radix-select-content-transform-origin)',\n position === 'popper' && 'data-[side=bottom]:translate-y-1',\n position === 'popper' && 'data-[side=left]:-translate-x-1',\n position === 'popper' && 'data-[side=right]:translate-x-1',\n position === 'popper' && 'data-[side=top]:-translate-y-1',\n className,\n )}\n position={position}\n {...props}\n >\n <SelectScrollUpButton />\n <SelectPrimitive.Viewport\n className={cn(\n 'p-1',\n position === 'popper' && 'w-full scroll-my-1',\n position === 'popper' && 'h-[var(--radix-select-trigger-height)]',\n position === 'popper' && 'min-w-[var(--radix-select-trigger-width)]',\n )}\n >\n {children}\n </SelectPrimitive.Viewport>\n <SelectScrollDownButton />\n </SelectPrimitive.Content>\n </SelectPrimitive.Portal>\n )\n}\n\nfunction SelectLabel({ className, ...props }: React.ComponentProps<typeof SelectPrimitive.Label>) {\n return <SelectPrimitive.Label data-slot=\"select-label\" className={cn('text-text-positive-weak px-2 py-1.5 text-xs', className)} {...props} />\n}\n\nfunction SelectItem({ className, children, ...props }: React.ComponentProps<typeof SelectPrimitive.Item>) {\n return (\n <SelectPrimitive.Item\n data-slot=\"select-item\"\n className={cn(\n 'relative flex items-center select-none',\n 'gap-2 rounded-md py-2.5 pr-8 pl-2',\n 'w-full',\n 'cursor-pointer transition-colors',\n 'text-text-positive text-sm outline-hidden',\n 'focus:bg-muted-muted',\n 'focus:text-text-positive-strong',\n 'data-[disabled]:opacity-50',\n 'data-[disabled]:pointer-events-none',\n '[&_svg]:pointer-events-none',\n '[&_svg]:shrink-0',\n \"[&_svg:not([class*='size-'])]:size-4\",\n \"[&_svg:not([class*='text-'])]:text-text-positive-weak\",\n '*:[span]:last:flex',\n '*:[span]:last:items-center',\n '*:[span]:last:gap-2',\n className,\n )}\n {...props}\n >\n <span className=\"absolute right-2 flex size-3.5 items-center justify-center\">\n <SelectPrimitive.ItemIndicator>\n <CheckIcon size={16} />\n </SelectPrimitive.ItemIndicator>\n </span>\n <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>\n </SelectPrimitive.Item>\n )\n}\n\nfunction SelectSeparator({ className, ...props }: React.ComponentProps<typeof SelectPrimitive.Separator>) {\n return <SelectPrimitive.Separator data-slot=\"select-separator\" className={cn('bg-border-weak pointer-events-none -mx-1 my-1 h-px', className)} {...props} />\n}\n\nfunction SelectScrollUpButton({ className, ...props }: React.ComponentProps<typeof SelectPrimitive.ScrollUpButton>) {\n return (\n <SelectPrimitive.ScrollUpButton\n data-slot=\"select-scroll-up-button\"\n className={cn('flex cursor-default items-center justify-center py-1', className)}\n {...props}\n >\n <ChevronUpIcon className=\"size-4\" />\n </SelectPrimitive.ScrollUpButton>\n )\n}\n\nfunction SelectScrollDownButton({ className, ...props }: React.ComponentProps<typeof SelectPrimitive.ScrollDownButton>) {\n return (\n <SelectPrimitive.ScrollDownButton\n data-slot=\"select-scroll-down-button\"\n className={cn('flex cursor-default items-center justify-center py-1', className)}\n {...props}\n >\n <ChevronDownIcon className=\"size-4\" />\n </SelectPrimitive.ScrollDownButton>\n )\n}\n\nexport {\n Select,\n SelectContent,\n SelectGroup,\n SelectItem,\n SelectLabel,\n SelectScrollDownButton,\n SelectScrollUpButton,\n SelectSeparator,\n SelectTrigger,\n SelectValue,\n}\n"],"mappings":"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"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{cn as e}from"./utils-D9AH0PUV.js";import{jsx as t,jsxs as n}from"react/jsx-runtime";import{CheckIcon as r,ChevronDownIcon as i,ChevronUpIcon as a}from"lucide-react";import{Select as o}from"radix-ui";function s({...e}){return t(o.Root,{"data-slot":`select`,...e})}function c({...e}){return t(o.Group,{"data-slot":`select-group`,...e})}function l({...e}){return t(o.Value,{"data-slot":`select-value`,...e})}function u({className:r,size:a=`default`,children:s,...c}){return n(o.Trigger,{"data-slot":`select-trigger`,"data-size":a,className:e(`border-border-weak shadow-input`,`flex w-fit items-center justify-between`,`gap-2 rounded-md border bg-transparent px-3 py-2 text-sm`,`whitespace-nowrap transition-all outline-none`,`cursor-pointer`,`hover:border-border`,`focus:border-primary-strong`,`focus:ring-primary-weak`,`focus:ring-4`,`aria-invalid:ring-danger-weak`,`aria-invalid:border-danger-strong`,`disabled:cursor-not-allowed`,`disabled:opacity-50`,`data-[state=open]:text-text-positive-muted`,`data-[state=open]:border-primary`,`data-[state=open]:ring-ring`,`data-[state=open]:ring-4`,`data-[placeholder]:text-text-positive-muted`,`data-[size=default]:h-9`,`data-[size=sm]:h-8`,`*:data-[slot=select-value]:line-clamp-1`,`*:data-[slot=select-value]:flex`,`*:data-[slot=select-value]:items-center`,`*:data-[slot=select-value]:gap-2`,`[&_svg]:shrink-0`,`[&_svg]:pointer-events-none`,`[&_svg:not([class*='size-'])]:size-4`,`[&_svg:not([class*='text-'])]:text-muted-foreground`,r),...c,children:[s,t(o.Icon,{asChild:!0,children:t(i,{size:16,opacity:50})})]})}function d({className:r,children:i,position:a=`popper`,...s}){return t(o.Portal,{children:n(o.Content,{"data-slot":`select-content`,className:e(`bg-popover`,`relative z-50`,`min-w-32`,`overflow-x-hidden overflow-y-auto`,`shadow-dropdown rounded-md`,`data-[state=open]:animate-in`,`data-[state=open]:fade-in-0`,`data-[state=open]:zoom-in-95`,`data-[state=closed]:animate-out`,`data-[state=closed]:fade-out-0`,`data-[state=closed]:zoom-out-95`,`data-[side=bottom]:slide-in-from-top-2`,`data-[side=left]:slide-in-from-right-2`,`data-[side=right]:slide-in-from-left-2`,`data-[side=top]:slide-in-from-bottom-2`,`max-h-(--radix-select-content-available-height)`,`origin-(--radix-select-content-transform-origin)`,a===`popper`&&`data-[side=bottom]:translate-y-1`,a===`popper`&&`data-[side=left]:-translate-x-1`,a===`popper`&&`data-[side=right]:translate-x-1`,a===`popper`&&`data-[side=top]:-translate-y-1`,r),position:a,...s,children:[t(h,{}),t(o.Viewport,{className:e(`p-1`,a===`popper`&&`w-full scroll-my-1`,a===`popper`&&`h-[var(--radix-select-trigger-height)]`,a===`popper`&&`min-w-[var(--radix-select-trigger-width)]`),children:i}),t(g,{})]})})}function f({className:n,...r}){return t(o.Label,{"data-slot":`select-label`,className:e(`text-text-positive-weak px-2 py-1.5 text-xs`,n),...r})}function p({className:i,children:a,...s}){return n(o.Item,{"data-slot":`select-item`,className:e(`relative flex items-center select-none`,`gap-2 rounded-md py-2.5 pr-8 pl-2`,`w-full`,`cursor-pointer transition-colors`,`text-text-positive text-sm outline-hidden`,`focus:bg-muted-muted`,`focus:text-text-positive-strong`,`data-[disabled]:opacity-50`,`data-[disabled]:pointer-events-none`,`[&_svg]:pointer-events-none`,`[&_svg]:shrink-0`,`[&_svg:not([class*='size-'])]:size-4`,`[&_svg:not([class*='text-'])]:text-text-positive-weak`,`*:[span]:last:flex`,`*:[span]:last:items-center`,`*:[span]:last:gap-2`,i),...s,children:[t(`span`,{className:`absolute right-2 flex size-3.5 items-center justify-center`,children:t(o.ItemIndicator,{children:t(r,{size:16})})}),t(o.ItemText,{children:a})]})}function m({className:n,...r}){return t(o.Separator,{"data-slot":`select-separator`,className:e(`bg-border-weak pointer-events-none -mx-1 my-1 h-px`,n),...r})}function h({className:n,...r}){return t(o.ScrollUpButton,{"data-slot":`select-scroll-up-button`,className:e(`flex cursor-default items-center justify-center py-1`,n),...r,children:t(a,{className:`size-4`})})}function g({className:n,...r}){return t(o.ScrollDownButton,{"data-slot":`select-scroll-down-button`,className:e(`flex cursor-default items-center justify-center py-1`,n),...r,children:t(i,{className:`size-4`})})}export{s as Select,d as SelectContent,c as SelectGroup,p as SelectItem,f as SelectLabel,g as SelectScrollDownButton,h as SelectScrollUpButton,m as SelectSeparator,u as SelectTrigger,l as SelectValue};
|
|
2
|
+
//# sourceMappingURL=select-RKVYJMTd.js.map
|