erp-pro-ui 0.1.1 → 0.1.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +512 -288
- package/dist/accordion.cjs +1 -1
- package/dist/accordion.mjs +1 -1
- package/dist/alert.cjs +1 -1
- package/dist/alert.mjs +1 -1
- package/dist/ascii-text.cjs +1 -1
- package/dist/ascii-text.mjs +1 -1
- package/dist/button.cjs +1 -1
- package/dist/button.mjs +1 -1
- package/dist/card.cjs +1 -1
- package/dist/card.mjs +1 -1
- package/dist/carousel.cjs +1 -1
- package/dist/carousel.mjs +1 -1
- package/dist/catalog.cjs +6 -0
- package/dist/catalog.cjs.map +1 -1
- package/dist/catalog.d.ts +11 -1
- package/dist/catalog.d.ts.map +1 -1
- package/dist/catalog.mjs +6 -0
- package/dist/catalog.mjs.map +1 -1
- package/dist/charts.cjs +4 -1
- package/dist/charts.mjs +2 -2
- package/dist/checkbox.cjs +1 -1
- package/dist/checkbox.mjs +1 -1
- package/dist/chip.cjs +1 -1
- package/dist/chip.mjs +1 -1
- package/dist/chroma-grid.cjs +1 -1
- package/dist/chroma-grid.mjs +1 -1
- package/dist/chunks/{accordion-C_0oGZkZ.mjs → accordion-Cbt-SJhj.mjs} +4 -4
- package/dist/chunks/accordion-Cbt-SJhj.mjs.map +1 -0
- package/dist/chunks/{accordion-BZ5hyz0_.cjs → accordion-pfJR8YYA.cjs} +4 -4
- package/dist/chunks/accordion-pfJR8YYA.cjs.map +1 -0
- package/dist/chunks/{alert-DeVa-NR1.mjs → alert-CtdLy4Hv.mjs} +6 -6
- package/dist/chunks/alert-CtdLy4Hv.mjs.map +1 -0
- package/dist/chunks/{alert-BdBDWqBN.cjs → alert-Dvz1GoL5.cjs} +6 -6
- package/dist/chunks/alert-Dvz1GoL5.cjs.map +1 -0
- package/dist/chunks/{ascii-text-BzQCLfya.mjs → ascii-text-C5tyNsR3.mjs} +32 -5
- package/dist/chunks/ascii-text-C5tyNsR3.mjs.map +1 -0
- package/dist/chunks/{ascii-text-D6lVHWph.cjs → ascii-text-DlmArZXh.cjs} +32 -5
- package/dist/chunks/ascii-text-DlmArZXh.cjs.map +1 -0
- package/dist/chunks/background-gradient-animation-BL-lnrJe.mjs.map +1 -1
- package/dist/chunks/background-gradient-animation-CXV9GDH8.cjs.map +1 -1
- package/dist/chunks/{button-CmNEMp_O.mjs → button-B0Lhj0AS.mjs} +3 -3
- package/dist/chunks/button-B0Lhj0AS.mjs.map +1 -0
- package/dist/chunks/{button-BH1eUjae.cjs → button-CZL6kFzT.cjs} +3 -3
- package/dist/chunks/button-CZL6kFzT.cjs.map +1 -0
- package/dist/chunks/{card-CzstAQYy.mjs → card-CcIF6z2H.mjs} +2 -2
- package/dist/chunks/card-CcIF6z2H.mjs.map +1 -0
- package/dist/chunks/{card-DZGM4zLx.cjs → card-gt-HZh0h.cjs} +2 -2
- package/dist/chunks/card-gt-HZh0h.cjs.map +1 -0
- package/dist/chunks/{carousel-47Eiyzwg.cjs → carousel-Cq5uwqQt.cjs} +3 -3
- package/dist/chunks/{carousel-BJ3nm2bw.mjs.map → carousel-Cq5uwqQt.cjs.map} +1 -1
- package/dist/chunks/{carousel-BJ3nm2bw.mjs → carousel-DJdqBVRK.mjs} +3 -3
- package/dist/chunks/{carousel-47Eiyzwg.cjs.map → carousel-DJdqBVRK.mjs.map} +1 -1
- package/dist/chunks/charts-BpElnsoR.cjs +687 -0
- package/dist/chunks/charts-BpElnsoR.cjs.map +1 -0
- package/dist/chunks/charts-DugYWvEf.mjs +632 -0
- package/dist/chunks/charts-DugYWvEf.mjs.map +1 -0
- package/dist/chunks/{checkbox-B3eIojWs.mjs → checkbox-DvwlGwWe.mjs} +8 -8
- package/dist/chunks/checkbox-DvwlGwWe.mjs.map +1 -0
- package/dist/chunks/{checkbox-DQmZwRTt.cjs → checkbox-yHuSw-hV.cjs} +8 -8
- package/dist/chunks/checkbox-yHuSw-hV.cjs.map +1 -0
- package/dist/chunks/{chip-cZ7-HmWw.mjs → chip-BGSUmnlO.mjs} +12 -12
- package/dist/chunks/chip-BGSUmnlO.mjs.map +1 -0
- package/dist/chunks/{chip-BH6wzwat.cjs → chip-DcBji__g.cjs} +12 -12
- package/dist/chunks/chip-DcBji__g.cjs.map +1 -0
- package/dist/chunks/{chroma-grid-DtsqM4LW.cjs → chroma-grid-9E9j1s9I.cjs} +10 -10
- package/dist/chunks/chroma-grid-9E9j1s9I.cjs.map +1 -0
- package/dist/chunks/{chroma-grid-CC_fFzxO.mjs → chroma-grid-Cdeql_2C.mjs} +10 -10
- package/dist/chunks/chroma-grid-Cdeql_2C.mjs.map +1 -0
- package/dist/chunks/color-palette-BLvDnCOD.cjs +754 -0
- package/dist/chunks/color-palette-BLvDnCOD.cjs.map +1 -0
- package/dist/chunks/color-palette-CXlCDiZz.mjs +748 -0
- package/dist/chunks/color-palette-CXlCDiZz.mjs.map +1 -0
- package/dist/chunks/{combobox-mAvOcg-E.cjs → combobox-BXu3s0dt.cjs} +56 -32
- package/dist/chunks/combobox-BXu3s0dt.cjs.map +1 -0
- package/dist/chunks/combobox-CjK-qG4k.mjs +132 -0
- package/dist/chunks/combobox-CjK-qG4k.mjs.map +1 -0
- package/dist/chunks/{data-table-BRcGhJDf.cjs → data-table-9HELVsYR.cjs} +197 -292
- package/dist/chunks/data-table-9HELVsYR.cjs.map +1 -0
- package/dist/chunks/{data-table-Dp0t_I_z.mjs → data-table-DyEQn9Yj.mjs} +197 -292
- package/dist/chunks/data-table-DyEQn9Yj.mjs.map +1 -0
- package/dist/chunks/{date-picker-BWBkr6LG.mjs → date-picker-D8gaaMlJ.mjs} +39 -16
- package/dist/chunks/date-picker-D8gaaMlJ.mjs.map +1 -0
- package/dist/chunks/{date-picker-DooielHi.cjs → date-picker-W9om1j7A.cjs} +39 -16
- package/dist/chunks/date-picker-W9om1j7A.cjs.map +1 -0
- package/dist/chunks/{dialog-Cbuf8V0g.cjs → dialog-CYFiWN8M.cjs} +20 -20
- package/dist/chunks/dialog-CYFiWN8M.cjs.map +1 -0
- package/dist/chunks/{dialog-C6nxSfIl.mjs → dialog-DUWnV9tN.mjs} +20 -20
- package/dist/chunks/dialog-DUWnV9tN.mjs.map +1 -0
- package/dist/chunks/{drawer-Dn0u8Sck.cjs → drawer-CLjsYdxN.cjs} +39 -22
- package/dist/chunks/drawer-CLjsYdxN.cjs.map +1 -0
- package/dist/chunks/drawer-D82Jz6KO.mjs +122 -0
- package/dist/chunks/drawer-D82Jz6KO.mjs.map +1 -0
- package/dist/chunks/{form-TwlDrshv.mjs → form-B2vcaHwh.mjs} +4 -4
- package/dist/chunks/form-B2vcaHwh.mjs.map +1 -0
- package/dist/chunks/{form-DcEuk721.cjs → form-CzH9GQc6.cjs} +4 -4
- package/dist/chunks/form-CzH9GQc6.cjs.map +1 -0
- package/dist/chunks/{gradual-blur-2jVhPcND.cjs → gradual-blur-B9GoY8o1.cjs} +1 -1
- package/dist/chunks/{gradual-blur-2jVhPcND.cjs.map → gradual-blur-B9GoY8o1.cjs.map} +1 -1
- package/dist/chunks/{gradual-blur-jTzKCmAV.mjs → gradual-blur-Bl3dOMEz.mjs} +1 -1
- package/dist/chunks/{gradual-blur-jTzKCmAV.mjs.map → gradual-blur-Bl3dOMEz.mjs.map} +1 -1
- package/dist/chunks/{hover-card-KjWMnvt_.cjs → hover-card-v0QwmVBU.cjs} +9 -4
- package/dist/chunks/hover-card-v0QwmVBU.cjs.map +1 -0
- package/dist/chunks/{hover-card-DwTVfjgN.mjs → hover-card-xqwpmZNm.mjs} +9 -4
- package/dist/chunks/{hover-card-KjWMnvt_.cjs.map → hover-card-xqwpmZNm.mjs.map} +1 -1
- package/dist/chunks/{icons-DYkpqWYG.cjs → icons-BxIzP2jd.cjs} +131 -8
- package/dist/chunks/icons-BxIzP2jd.cjs.map +1 -0
- package/dist/chunks/{icons-CrM6pFkv.mjs → icons-DuumN7z-.mjs} +108 -9
- package/dist/chunks/icons-DuumN7z-.mjs.map +1 -0
- package/dist/chunks/{input-CoRHoZkB.cjs → input-D9qZNqXV.cjs} +8 -8
- package/dist/chunks/input-D9qZNqXV.cjs.map +1 -0
- package/dist/chunks/{input-ChhwdNGk.mjs → input-wNqevfQ4.mjs} +8 -8
- package/dist/chunks/input-wNqevfQ4.mjs.map +1 -0
- package/dist/chunks/{label-EciNc4hO.cjs → label-BWPEGVam.cjs} +1 -1
- package/dist/chunks/{label-EciNc4hO.cjs.map → label-BWPEGVam.cjs.map} +1 -1
- package/dist/chunks/{label-JZn7PmtR.mjs → label-KPA-yYOF.mjs} +1 -1
- package/dist/chunks/{label-JZn7PmtR.mjs.map → label-KPA-yYOF.mjs.map} +1 -1
- package/dist/chunks/{loading-DPNa_X3c.mjs → loading-S1TdIrbB.mjs} +2 -2
- package/dist/chunks/{loading-DPNa_X3c.mjs.map → loading-S1TdIrbB.mjs.map} +1 -1
- package/dist/chunks/{loading-Cqgps3nf.cjs → loading-q7IEg56I.cjs} +2 -2
- package/dist/chunks/{loading-Cqgps3nf.cjs.map → loading-q7IEg56I.cjs.map} +1 -1
- package/dist/chunks/multi-select-combobox-ELSH_Xr4.mjs +132 -0
- package/dist/chunks/multi-select-combobox-ELSH_Xr4.mjs.map +1 -0
- package/dist/chunks/multi-select-combobox-UW0X15W7.cjs +139 -0
- package/dist/chunks/multi-select-combobox-UW0X15W7.cjs.map +1 -0
- package/dist/chunks/{otp-input-DaQDfI9C.cjs → otp-input-B6zzOEqw.cjs} +13 -14
- package/dist/chunks/otp-input-B6zzOEqw.cjs.map +1 -0
- package/dist/chunks/{otp-input-CNungc1j.mjs → otp-input-Bg4nQG6x.mjs} +13 -14
- package/dist/chunks/otp-input-Bg4nQG6x.mjs.map +1 -0
- package/dist/chunks/{overlay-BfUR77DT.cjs → overlay-DWNTyQzK.cjs} +1 -1
- package/dist/chunks/{overlay-BfUR77DT.cjs.map → overlay-DWNTyQzK.cjs.map} +1 -1
- package/dist/chunks/{overlay-CpdakhXI.mjs → overlay-TycCIFOu.mjs} +1 -1
- package/dist/chunks/{overlay-CpdakhXI.mjs.map → overlay-TycCIFOu.mjs.map} +1 -1
- package/dist/chunks/{password-strength-meter-xtMqhhFg.mjs → password-strength-meter-CbNSBuh_.mjs} +10 -10
- package/dist/chunks/password-strength-meter-CbNSBuh_.mjs.map +1 -0
- package/dist/chunks/{password-strength-meter-u4YI00zE.cjs → password-strength-meter-DxMV6GAs.cjs} +10 -10
- package/dist/chunks/password-strength-meter-DxMV6GAs.cjs.map +1 -0
- package/dist/chunks/progress-bar-C1OvQ-NI.cjs +96 -0
- package/dist/chunks/progress-bar-C1OvQ-NI.cjs.map +1 -0
- package/dist/chunks/progress-bar-C9FZDrju.mjs +89 -0
- package/dist/chunks/progress-bar-C9FZDrju.mjs.map +1 -0
- package/dist/chunks/{radio-C-fPZgSY.mjs → radio-C9w_CoiY.mjs} +9 -9
- package/dist/chunks/radio-C9w_CoiY.mjs.map +1 -0
- package/dist/chunks/{radio-mCgvEhOR.cjs → radio-jMHDvaMY.cjs} +9 -9
- package/dist/chunks/radio-jMHDvaMY.cjs.map +1 -0
- package/dist/chunks/select-D71tk6-I.mjs +152 -0
- package/dist/chunks/select-D71tk6-I.mjs.map +1 -0
- package/dist/chunks/select-WC_kPqUP.cjs +158 -0
- package/dist/chunks/select-WC_kPqUP.cjs.map +1 -0
- package/dist/chunks/{skeleton-D1S4RyeL.mjs → skeleton-BhYWOp0Q.mjs} +1 -1
- package/dist/chunks/{skeleton-D1S4RyeL.mjs.map → skeleton-BhYWOp0Q.mjs.map} +1 -1
- package/dist/chunks/{skeleton-C-NHrM-w.cjs → skeleton-DTXpHYYB.cjs} +1 -1
- package/dist/chunks/{skeleton-C-NHrM-w.cjs.map → skeleton-DTXpHYYB.cjs.map} +1 -1
- package/dist/chunks/{spinners-hf553hP9.mjs → spinners-BBCWD2gw.mjs} +2 -2
- package/dist/chunks/{spinners-hf553hP9.mjs.map → spinners-BBCWD2gw.mjs.map} +1 -1
- package/dist/chunks/{spinners-CU3bLaoo.cjs → spinners-BL4ERCCw.cjs} +2 -2
- package/dist/chunks/{spinners-CU3bLaoo.cjs.map → spinners-BL4ERCCw.cjs.map} +1 -1
- package/dist/chunks/{splash-cursor-Dpzl_YXx.cjs → splash-cursor-BVSmbcIX.cjs} +9 -8
- package/dist/chunks/splash-cursor-BVSmbcIX.cjs.map +1 -0
- package/dist/chunks/{splash-cursor-9BsoQZl0.mjs → splash-cursor-rSrTnawZ.mjs} +9 -8
- package/dist/chunks/splash-cursor-rSrTnawZ.mjs.map +1 -0
- package/dist/chunks/{spotlight-card-Bl0aXnT4.mjs → spotlight-card-BpZLMOp6.mjs} +1 -1
- package/dist/chunks/{spotlight-card-Bl0aXnT4.mjs.map → spotlight-card-BpZLMOp6.mjs.map} +1 -1
- package/dist/chunks/{spotlight-card-SUhrgstF.cjs → spotlight-card-DS1dy1W3.cjs} +1 -1
- package/dist/chunks/{spotlight-card-SUhrgstF.cjs.map → spotlight-card-DS1dy1W3.cjs.map} +1 -1
- package/dist/chunks/{stepper-uz8iRzlY.mjs → stepper-D4yQsQB0.mjs} +14 -14
- package/dist/chunks/stepper-D4yQsQB0.mjs.map +1 -0
- package/dist/chunks/{stepper-BDz6PkjV.cjs → stepper-fY-Sx72k.cjs} +14 -14
- package/dist/chunks/stepper-fY-Sx72k.cjs.map +1 -0
- package/dist/chunks/{sun-to-moon-button-3E6qah0o.mjs → sun-to-moon-button-B2Aje05o.mjs} +3 -3
- package/dist/chunks/{sun-to-moon-button-3E6qah0o.mjs.map → sun-to-moon-button-B2Aje05o.mjs.map} +1 -1
- package/dist/chunks/{sun-to-moon-button-B__3FWnK.cjs → sun-to-moon-button-BmFwRBye.cjs} +3 -3
- package/dist/chunks/{sun-to-moon-button-B__3FWnK.cjs.map → sun-to-moon-button-BmFwRBye.cjs.map} +1 -1
- package/dist/chunks/{switch-y8oWcyLp.cjs → switch-C5otDb4c.cjs} +3 -3
- package/dist/chunks/switch-C5otDb4c.cjs.map +1 -0
- package/dist/chunks/{switch-DYLavKgf.mjs → switch-DOVl_i_s.mjs} +3 -3
- package/dist/chunks/switch-DOVl_i_s.mjs.map +1 -0
- package/dist/chunks/textarea-CAUsyu4-.cjs +63 -0
- package/dist/chunks/textarea-CAUsyu4-.cjs.map +1 -0
- package/dist/chunks/textarea-CU5C-Zw9.mjs +57 -0
- package/dist/chunks/textarea-CU5C-Zw9.mjs.map +1 -0
- package/dist/chunks/{theme-CBtWIFMT.cjs → theme-7DWLxJK_.cjs} +4 -2
- package/dist/chunks/theme-7DWLxJK_.cjs.map +1 -0
- package/dist/chunks/{theme-Bwu0HKqZ.mjs → theme-BceKeYhw.mjs} +4 -2
- package/dist/chunks/theme-BceKeYhw.mjs.map +1 -0
- package/dist/chunks/{toast-C8JRhbSo.mjs → toast-CvfP7PUP.mjs} +20 -20
- package/dist/chunks/toast-CvfP7PUP.mjs.map +1 -0
- package/dist/chunks/{toast-DWOwpD2F.cjs → toast-Ds7_19Ap.cjs} +20 -20
- package/dist/chunks/toast-Ds7_19Ap.cjs.map +1 -0
- package/dist/chunks/{tooltip-YtA_66_1.mjs → tooltip-efHETBo1.mjs} +1 -1
- package/dist/chunks/{tooltip-YtA_66_1.mjs.map → tooltip-efHETBo1.mjs.map} +1 -1
- package/dist/chunks/{tooltip-BHXNmXsa.cjs → tooltip-nkIqViGk.cjs} +1 -1
- package/dist/chunks/{tooltip-BHXNmXsa.cjs.map → tooltip-nkIqViGk.cjs.map} +1 -1
- package/dist/chunks/{typography-BzprBnQc.mjs → typography-CLu6Hx9j.mjs} +7 -3
- package/dist/chunks/{typography-BzprBnQc.mjs.map → typography-CLu6Hx9j.mjs.map} +1 -1
- package/dist/chunks/{typography-3wSx67DZ.cjs → typography-DaLu9tty.cjs} +7 -3
- package/dist/chunks/{typography-3wSx67DZ.cjs.map → typography-DaLu9tty.cjs.map} +1 -1
- package/dist/color-palette.cjs +1 -1
- package/dist/color-palette.mjs +1 -1
- package/dist/colors.css +121 -186
- package/dist/combobox.cjs +1 -1
- package/dist/combobox.mjs +1 -1
- package/dist/components/data-display/charts/AreaChart.d.ts.map +1 -1
- package/dist/components/data-display/charts/BarChart.d.ts.map +1 -1
- package/dist/components/data-display/charts/NeonLineChart.d.ts.map +1 -1
- package/dist/components/data-display/charts/PieChart.d.ts.map +1 -1
- package/dist/components/data-display/charts/StackedBarChart.d.ts.map +1 -1
- package/dist/components/data-display/charts/ThinBreakdownBar.d.ts.map +1 -1
- package/dist/components/data-display/charts/chartPalette.d.ts +10 -0
- package/dist/components/data-display/charts/chartPalette.d.ts.map +1 -0
- package/dist/components/data-display/charts/index.d.ts +2 -0
- package/dist/components/data-display/charts/index.d.ts.map +1 -1
- package/dist/components/data-display/chip/Chip.d.ts.map +1 -1
- package/dist/components/data-display/color-palette/ColorPalette.d.ts.map +1 -1
- package/dist/components/data-display/data-table/DataTable.d.ts +17 -10
- package/dist/components/data-display/data-table/DataTable.d.ts.map +1 -1
- package/dist/components/data-display/data-table/index.d.ts +1 -1
- package/dist/components/data-display/data-table/index.d.ts.map +1 -1
- package/dist/components/data-display/index.d.ts +1 -0
- package/dist/components/data-display/index.d.ts.map +1 -1
- package/dist/components/data-display/progress-bar/ProgressBar.d.ts +18 -0
- package/dist/components/data-display/progress-bar/ProgressBar.d.ts.map +1 -0
- package/dist/components/data-display/progress-bar/index.d.ts +3 -0
- package/dist/components/data-display/progress-bar/index.d.ts.map +1 -0
- package/dist/components/effects/ascii-text/ASCIIText.d.ts.map +1 -1
- package/dist/components/effects/border-beam/BorderBeam.d.ts.map +1 -1
- package/dist/components/effects/chroma-grid/ChromaGrid.d.ts.map +1 -1
- package/dist/components/effects/splash-cursor/SplashCursor.d.ts.map +1 -1
- package/dist/components/forms/combobox/Combobox.d.ts.map +1 -1
- package/dist/components/forms/date-picker/DatePicker.d.ts.map +1 -1
- package/dist/components/forms/input/Input.d.ts.map +1 -1
- package/dist/components/forms/multi-select-combobox/MultiSelectCombobox.d.ts.map +1 -1
- package/dist/components/forms/otp-input/OTPInput.d.ts.map +1 -1
- package/dist/components/forms/password-strength-meter/PasswordCriteria.d.ts.map +1 -1
- package/dist/components/forms/select/Select.d.ts.map +1 -1
- package/dist/components/forms/select/types.d.ts +2 -0
- package/dist/components/forms/select/types.d.ts.map +1 -1
- package/dist/components/forms/textarea/Textarea.d.ts.map +1 -1
- package/dist/components/icons/ColumnsIcon.d.ts +9 -0
- package/dist/components/icons/ColumnsIcon.d.ts.map +1 -0
- package/dist/components/icons/MailIcon.d.ts +9 -0
- package/dist/components/icons/MailIcon.d.ts.map +1 -0
- package/dist/components/icons/PlayIcon.d.ts +9 -0
- package/dist/components/icons/PlayIcon.d.ts.map +1 -0
- package/dist/components/icons/ZapIcon.d.ts +9 -0
- package/dist/components/icons/ZapIcon.d.ts.map +1 -0
- package/dist/components/icons/index.d.ts +4 -0
- package/dist/components/icons/index.d.ts.map +1 -1
- package/dist/components/navigation/accordion/Accordion.d.ts.map +1 -1
- package/dist/components/overlays/drawer/Drawer.d.ts.map +1 -1
- package/dist/components/overlays/hover-card/HoverCard.d.ts.map +1 -1
- package/dist/components/typography/Typography.d.ts.map +1 -1
- package/dist/data-table.cjs +1 -1
- package/dist/data-table.mjs +1 -1
- package/dist/date-picker.cjs +1 -1
- package/dist/date-picker.mjs +1 -1
- package/dist/dialog.cjs +1 -1
- package/dist/dialog.mjs +1 -1
- package/dist/docs.cjs +50 -4
- package/dist/docs.cjs.map +1 -1
- package/dist/docs.d.ts +59 -9
- package/dist/docs.d.ts.map +1 -1
- package/dist/docs.mjs +50 -4
- package/dist/docs.mjs.map +1 -1
- package/dist/drawer.cjs +1 -1
- package/dist/drawer.mjs +1 -1
- package/dist/fonts.css +5 -0
- package/dist/form.cjs +1 -1
- package/dist/form.mjs +1 -1
- package/dist/foundation.css +3 -3
- package/dist/foundations/theme/ThemeProvider.d.ts +1 -0
- package/dist/foundations/theme/ThemeProvider.d.ts.map +1 -1
- package/dist/gradual-blur.cjs +1 -1
- package/dist/gradual-blur.mjs +1 -1
- package/dist/hover-card.cjs +1 -1
- package/dist/hover-card.mjs +1 -1
- package/dist/icons.cjs +5 -1
- package/dist/icons.mjs +2 -2
- package/dist/index.cjs +50 -41
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +5 -3
- package/dist/index.d.ts.map +1 -1
- package/dist/index.mjs +43 -42
- package/dist/index.mjs.map +1 -1
- package/dist/input.cjs +1 -1
- package/dist/input.mjs +1 -1
- package/dist/label.cjs +1 -1
- package/dist/label.mjs +1 -1
- package/dist/loading.cjs +1 -1
- package/dist/loading.mjs +1 -1
- package/dist/multi-select-combobox.cjs +1 -1
- package/dist/multi-select-combobox.mjs +1 -1
- package/dist/otp-input.cjs +1 -1
- package/dist/otp-input.mjs +1 -1
- package/dist/password-strength-meter.cjs +1 -1
- package/dist/password-strength-meter.mjs +1 -1
- package/dist/progress-bar.cjs +3 -0
- package/dist/progress-bar.d.ts +2 -0
- package/dist/progress-bar.mjs +2 -0
- package/dist/radio.cjs +1 -1
- package/dist/radio.mjs +1 -1
- package/dist/select.cjs +1 -1
- package/dist/select.mjs +1 -1
- package/dist/skeleton.cjs +1 -1
- package/dist/skeleton.mjs +1 -1
- package/dist/spinners.cjs +1 -1
- package/dist/spinners.mjs +1 -1
- package/dist/splash-cursor.cjs +1 -1
- package/dist/splash-cursor.mjs +1 -1
- package/dist/spotlight-card.cjs +1 -1
- package/dist/spotlight-card.mjs +1 -1
- package/dist/stepper.cjs +1 -1
- package/dist/stepper.mjs +1 -1
- package/dist/sun-to-moon-button.cjs +1 -1
- package/dist/sun-to-moon-button.mjs +1 -1
- package/dist/switch.cjs +1 -1
- package/dist/switch.mjs +1 -1
- package/dist/textarea.cjs +1 -1
- package/dist/textarea.mjs +1 -1
- package/dist/theme.cjs +1 -1
- package/dist/theme.mjs +1 -1
- package/dist/toast.cjs +1 -1
- package/dist/toast.mjs +1 -1
- package/dist/tokens.css +592 -0
- package/dist/tooltip.cjs +1 -1
- package/dist/tooltip.mjs +1 -1
- package/dist/typography.cjs +1 -1
- package/dist/typography.mjs +1 -1
- package/package.json +19 -5
- package/dist/chunks/accordion-BZ5hyz0_.cjs.map +0 -1
- package/dist/chunks/accordion-C_0oGZkZ.mjs.map +0 -1
- package/dist/chunks/alert-BdBDWqBN.cjs.map +0 -1
- package/dist/chunks/alert-DeVa-NR1.mjs.map +0 -1
- package/dist/chunks/ascii-text-BzQCLfya.mjs.map +0 -1
- package/dist/chunks/ascii-text-D6lVHWph.cjs.map +0 -1
- package/dist/chunks/button-BH1eUjae.cjs.map +0 -1
- package/dist/chunks/button-CmNEMp_O.mjs.map +0 -1
- package/dist/chunks/card-CzstAQYy.mjs.map +0 -1
- package/dist/chunks/card-DZGM4zLx.cjs.map +0 -1
- package/dist/chunks/charts-Bynf6x07.mjs +0 -448
- package/dist/chunks/charts-Bynf6x07.mjs.map +0 -1
- package/dist/chunks/charts-UYl7Ecqv.cjs +0 -485
- package/dist/chunks/charts-UYl7Ecqv.cjs.map +0 -1
- package/dist/chunks/checkbox-B3eIojWs.mjs.map +0 -1
- package/dist/chunks/checkbox-DQmZwRTt.cjs.map +0 -1
- package/dist/chunks/chip-BH6wzwat.cjs.map +0 -1
- package/dist/chunks/chip-cZ7-HmWw.mjs.map +0 -1
- package/dist/chunks/chroma-grid-CC_fFzxO.mjs.map +0 -1
- package/dist/chunks/chroma-grid-DtsqM4LW.cjs.map +0 -1
- package/dist/chunks/color-palette-Cz7vqbil.cjs +0 -1156
- package/dist/chunks/color-palette-Cz7vqbil.cjs.map +0 -1
- package/dist/chunks/color-palette-yadpDCUw.mjs +0 -1150
- package/dist/chunks/color-palette-yadpDCUw.mjs.map +0 -1
- package/dist/chunks/combobox-B9Nzlhu3.mjs +0 -108
- package/dist/chunks/combobox-B9Nzlhu3.mjs.map +0 -1
- package/dist/chunks/combobox-mAvOcg-E.cjs.map +0 -1
- package/dist/chunks/data-table-BRcGhJDf.cjs.map +0 -1
- package/dist/chunks/data-table-Dp0t_I_z.mjs.map +0 -1
- package/dist/chunks/date-picker-BWBkr6LG.mjs.map +0 -1
- package/dist/chunks/date-picker-DooielHi.cjs.map +0 -1
- package/dist/chunks/dialog-C6nxSfIl.mjs.map +0 -1
- package/dist/chunks/dialog-Cbuf8V0g.cjs.map +0 -1
- package/dist/chunks/drawer-DIuvgqTA.mjs +0 -105
- package/dist/chunks/drawer-DIuvgqTA.mjs.map +0 -1
- package/dist/chunks/drawer-Dn0u8Sck.cjs.map +0 -1
- package/dist/chunks/form-DcEuk721.cjs.map +0 -1
- package/dist/chunks/form-TwlDrshv.mjs.map +0 -1
- package/dist/chunks/hover-card-DwTVfjgN.mjs.map +0 -1
- package/dist/chunks/icons-CrM6pFkv.mjs.map +0 -1
- package/dist/chunks/icons-DYkpqWYG.cjs.map +0 -1
- package/dist/chunks/input-ChhwdNGk.mjs.map +0 -1
- package/dist/chunks/input-CoRHoZkB.cjs.map +0 -1
- package/dist/chunks/multi-select-combobox-BPRTZVF6.mjs +0 -108
- package/dist/chunks/multi-select-combobox-BPRTZVF6.mjs.map +0 -1
- package/dist/chunks/multi-select-combobox-DiMwJxj_.cjs +0 -115
- package/dist/chunks/multi-select-combobox-DiMwJxj_.cjs.map +0 -1
- package/dist/chunks/otp-input-CNungc1j.mjs.map +0 -1
- package/dist/chunks/otp-input-DaQDfI9C.cjs.map +0 -1
- package/dist/chunks/password-strength-meter-u4YI00zE.cjs.map +0 -1
- package/dist/chunks/password-strength-meter-xtMqhhFg.mjs.map +0 -1
- package/dist/chunks/radio-C-fPZgSY.mjs.map +0 -1
- package/dist/chunks/radio-mCgvEhOR.cjs.map +0 -1
- package/dist/chunks/select-BB-pOzI2.mjs +0 -116
- package/dist/chunks/select-BB-pOzI2.mjs.map +0 -1
- package/dist/chunks/select-BwelAQc1.cjs +0 -122
- package/dist/chunks/select-BwelAQc1.cjs.map +0 -1
- package/dist/chunks/splash-cursor-9BsoQZl0.mjs.map +0 -1
- package/dist/chunks/splash-cursor-Dpzl_YXx.cjs.map +0 -1
- package/dist/chunks/stepper-BDz6PkjV.cjs.map +0 -1
- package/dist/chunks/stepper-uz8iRzlY.mjs.map +0 -1
- package/dist/chunks/switch-DYLavKgf.mjs.map +0 -1
- package/dist/chunks/switch-y8oWcyLp.cjs.map +0 -1
- package/dist/chunks/textarea-BWkUVpm3.cjs +0 -66
- package/dist/chunks/textarea-BWkUVpm3.cjs.map +0 -1
- package/dist/chunks/textarea-Bxqe70TW.mjs +0 -60
- package/dist/chunks/textarea-Bxqe70TW.mjs.map +0 -1
- package/dist/chunks/theme-Bwu0HKqZ.mjs.map +0 -1
- package/dist/chunks/theme-CBtWIFMT.cjs.map +0 -1
- package/dist/chunks/toast-C8JRhbSo.mjs.map +0 -1
- package/dist/chunks/toast-DWOwpD2F.cjs.map +0 -1
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"data-table-Dp0t_I_z.mjs","names":[],"sources":["../../src/components/data-display/data-table/DataTable.tsx"],"sourcesContent":["import React from 'react';\nimport {\n useReactTable,\n getCoreRowModel,\n getPaginationRowModel,\n getFilteredRowModel,\n flexRender,\n type ColumnDef,\n type PaginationState,\n type Table,\n} from '@tanstack/react-table';\nimport { Combobox } from '../../forms/combobox';\nimport { MultiSelectCombobox } from '../../forms/multi-select-combobox';\nimport { Checkbox } from '../../forms/checkbox';\nimport { Input } from '../../forms/input';\nimport { Select } from '../../forms/select';\nimport { Switch } from '../../forms/switch';\nimport {\n DatePicker,\n type DatePickerValue,\n type DateRangeValue,\n} from '../../forms/date-picker';\n\n// Filter option type - can be static or async\nexport interface FilterOption {\n id: string;\n label: string;\n type?:\n | 'text'\n | 'select'\n | 'combobox'\n | 'checkbox'\n | 'switch'\n | 'date'\n | 'date-range'\n | 'number-range';\n placeholder?: string;\n options?: string[]; // Static options\n // Async options support\n queryKey?: string | string[]; // React Query key for caching\n fetchOptions?: () => Promise<string[]>; // Async function to fetch options\n isLoading?: boolean; // Loading state (managed externally)\n multiple?: boolean; // Enable multi-select\n /* Crystal UI Unification */\n /*\n ### Automated Browser Testing\n The filters were verified using the browser subagent, confirming that each filter type correctly updates the table data in real-time and adheres to our new unified \"Crystal\" aesthetic.\n\n ````carousel\n \n <!-- slide -->\n \n <!-- slide -->\n \n ````\n\n ### Key Successes:\n - **Unified Aesthetic**: All components now share a consistent `backdrop-blur-xl` and semi-transparent background.\n - **Improved Visual Hierarchy**: The crystal effect makes the components feel integrated with the page while still being clearly interactive.\n - **Robust Logic**: Maintained all advanced filtering logic (date ranges, numeric ranges, partial matches) while upgrading the visual layer.\n */\n}\n\n// Filter value can be single string, array of strings, or range objects\nexport type FilterValue =\n | string\n | string[]\n | boolean\n | DatePickerValue\n | { min?: number; max?: number };\nexport type FilterValues = Record<string, FilterValue>;\n\nexport interface DataTableBulkActionContext<T> {\n selectedRows: T[];\n selectedCount: number;\n clearSelection: () => void;\n disableBulkSelection: () => void;\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport interface DataTableProps<T = Record<string, any>> {\n columns: {\n id: string;\n label: string;\n visible?: boolean;\n filterable?: boolean; // Enable filtering for this column\n multiFilter?: boolean; // Enable multi-select filter for this column\n /** Priority for responsive display (1 = always visible, higher = hidden earlier on small screens) */\n priority?: number;\n }[];\n data: T[];\n isLoading?: boolean; // Table data loading state\n onColumnToggle?: (columnId: string) => void;\n /** Number of items per page */\n pageSize?: number;\n /** Maximum height for the scrollable table area */\n maxHeight?: string;\n onSearch?: (query: string) => void;\n onExport?: () => void;\n onRowAction?: (action: string, row: T) => void;\n onBulkDelete?: (rows: T[]) => void;\n renderBulkActions?: (\n context: DataTableBulkActionContext<T>,\n ) => React.ReactNode;\n renderBulkActionCard?: (\n context: DataTableBulkActionContext<T>,\n ) => React.ReactNode;\n onFilterChange?: (filters: FilterValues) => void;\n // Filter options - can include async filters\n filterOptions?: FilterOption[];\n // Called when filters are applied (for server-side filtering)\n onFiltersApply?: (filters: FilterValues) => void;\n // Enable server-side filtering mode\n serverSideFiltering?: boolean;\n searchPlaceholder?: string;\n children?: React.ReactNode;\n /** Total row count for server-side pagination */\n totalCount?: number;\n /** Callback when pagination changes (for server-side pagination) */\n onPaginationChange?: (pageIndex: number, pageSize: number) => void;\n}\n\ninterface FilterDropdownProps {\n isOpen: boolean;\n onClose: () => void;\n children: React.ReactNode;\n}\n\nexport const FilterDropdown: React.FC<FilterDropdownProps> = ({\n isOpen,\n onClose,\n children,\n}) => {\n if (!isOpen) return null;\n\n return (\n <>\n <div\n className=\"fixed inset-0 z-40\"\n onClick={onClose}\n aria-hidden=\"true\"\n />\n <div className=\"absolute top-full right-0 mt-2 bg-white dark:bg-neutral-800 rounded-lg shadow-lg border border-neutral-200 dark:border-neutral-700 z-50 min-w-64\">\n {children}\n </div>\n </>\n );\n};\n\ninterface FilterButtonProps {\n icon: React.ReactNode;\n label: string;\n onClick: () => void;\n hasActive?: boolean;\n}\n\nexport const FilterButton: React.FC<FilterButtonProps> = ({\n icon,\n label,\n onClick,\n hasActive,\n}) => (\n <button\n onClick={onClick}\n title={label}\n className={`p-2 rounded-lg transition-colors ${\n hasActive\n ? 'bg-primary-100 dark:bg-primary-900 text-primary-600 dark:text-primary-400'\n : 'text-neutral-600 dark:text-neutral-400 hover:bg-neutral-100 dark:hover:bg-neutral-700'\n }`}\n >\n {icon}\n </button>\n);\n\ninterface ColumnToggleProps {\n columns: {\n id: string;\n label: string;\n visible?: boolean;\n }[];\n onToggle: (columnId: string) => void;\n onShowAll?: () => void;\n onHideAll?: () => void;\n}\n\nexport const ColumnToggle: React.FC<ColumnToggleProps> = ({\n columns,\n onToggle,\n onShowAll,\n onHideAll,\n}) => (\n <div className=\"p-4 space-y-3\">\n <div className=\"flex items-center justify-between mb-3\">\n <span className=\"text-sm font-semibold text-neutral-900 dark:text-white\">\n COLUMNS\n </span>\n </div>\n\n <div className=\"space-y-2 max-h-64 overflow-y-auto\">\n {columns.map((col) => (\n <label\n key={col.id}\n className=\"flex items-center gap-2 cursor-pointer px-2 py-1 hover:bg-neutral-50 dark:hover:bg-neutral-700 rounded\"\n >\n <input\n type=\"checkbox\"\n checked={col.visible !== false}\n onChange={() => onToggle(col.id)}\n className=\"w-4 h-4 rounded cursor-pointer accent-primary-500\"\n />\n <span className=\"text-sm text-neutral-700 dark:text-neutral-300\">\n {col.label}\n </span>\n </label>\n ))}\n </div>\n\n {(onShowAll || onHideAll) && (\n <div className=\"flex gap-2 pt-2 border-t border-neutral-200 dark:border-neutral-700\">\n {onShowAll && (\n <button\n onClick={onShowAll}\n className=\"flex-1 text-xs font-semibold text-primary-500 hover:text-primary-600 py-1\"\n >\n SHOW ALL\n </button>\n )}\n {onHideAll && (\n <button\n onClick={onHideAll}\n className=\"flex-1 text-xs font-semibold text-neutral-500 hover:text-neutral-600 py-1\"\n >\n HIDE ALL\n </button>\n )}\n </div>\n )}\n </div>\n);\n\ninterface FilterProfileProps {\n isOpen: boolean;\n onClose: () => void;\n onSaveProfile: (name: string) => void;\n}\n\nexport const FilterProfile: React.FC<FilterProfileProps> = ({\n isOpen,\n onClose,\n onSaveProfile,\n}) => {\n const [profileName, setProfileName] = React.useState('');\n\n const handleSave = () => {\n if (profileName.trim()) {\n onSaveProfile(profileName);\n setProfileName('');\n onClose();\n }\n };\n\n if (!isOpen) return null;\n\n return (\n <div\n className=\"fixed inset-0 bg-black/50 flex items-center justify-center z-50\"\n onClick={onClose}\n >\n <div\n className=\"bg-white dark:bg-neutral-800 rounded-xl p-6 max-w-md w-full mx-4\"\n onClick={(e) => e.stopPropagation()}\n >\n <h2 className=\"text-2xl font-bold text-neutral-900 dark:text-white mb-4\">\n Add new profile\n </h2>\n\n <label className=\"block text-sm font-medium text-primary-500 mb-2\">\n Enter filter profile name:\n </label>\n <input\n type=\"text\"\n value={profileName}\n onChange={(e) => setProfileName(e.target.value)}\n placeholder=\"Enter value\"\n className=\"w-full px-4 py-3 border-2 border-primary-500 rounded-lg bg-white dark:bg-neutral-700 text-neutral-900 dark:text-white placeholder:text-neutral-400 dark:placeholder:text-neutral-500 mb-6 focus:outline-none focus:ring-2 focus:ring-primary-300\"\n onKeyPress={(e) => e.key === 'Enter' && handleSave()}\n />\n\n <div className=\"flex gap-4\">\n <button\n onClick={onClose}\n className=\"flex-1 px-4 py-3 rounded-lg border-2 border-neutral-300 dark:border-neutral-600 text-neutral-700 dark:text-neutral-200 font-semibold hover:bg-neutral-100 dark:hover:bg-neutral-700 transition-colors flex items-center justify-center gap-2\"\n >\n <span>🗑️</span>\n CANCEL\n </button>\n <button\n onClick={handleSave}\n disabled={!profileName.trim()}\n className=\"flex-1 px-4 py-3 rounded-lg bg-neutral-900 dark:bg-white text-white dark:text-neutral-900 font-semibold hover:bg-neutral-800 dark:hover:bg-neutral-100 disabled:opacity-50 disabled:cursor-not-allowed transition-colors\"\n >\n SAVE\n </button>\n </div>\n </div>\n </div>\n );\n};\n\ntype AsyncFilterOptionsState = Record<\n string,\n { options: string[]; isLoading: boolean }\n>;\n\ntype NumberRangeFilterValue = { min?: number; max?: number };\n\nconst ICON_BUTTON_CLASS_NAME =\n 'p-2 rounded-lg text-neutral-400 hover:text-neutral-600 hover:bg-neutral-100 dark:hover:bg-neutral-700 transition-colors';\nconst DISABLED_ICON_BUTTON_CLASS_NAME = `${ICON_BUTTON_CLASS_NAME} disabled:opacity-40 disabled:cursor-not-allowed`;\n\nconst isFilterValueEmpty = (value?: FilterValue | null): boolean => {\n if (value === undefined || value === null) {\n return true;\n }\n\n if (typeof value === 'string') {\n return value === '';\n }\n\n if (Array.isArray(value)) {\n return value.length === 0;\n }\n\n if (value instanceof Date || typeof value === 'boolean') {\n return false;\n }\n\n if ('start' in value || 'end' in value) {\n const rangeValue = value as DateRangeValue;\n return !rangeValue.start && !rangeValue.end;\n }\n\n return value.min === undefined && value.max === undefined;\n};\n\nconst isFilterActive = (value?: FilterValue): boolean =>\n !isFilterValueEmpty(value);\n\nconst toSelectOptions = (options?: string[]) =>\n (options || []).map((option) => ({\n value: option,\n label: option,\n }));\n\nconst getStringFilterValue = (value?: FilterValue): string =>\n typeof value === 'string' ? value : '';\n\nconst getMultiStringFilterValue = (value?: FilterValue): string[] => {\n if (Array.isArray(value)) {\n return value;\n }\n\n return typeof value === 'string' && value ? [value] : [];\n};\n\nconst getNumberRangeFilterValue = (\n value?: FilterValue,\n): NumberRangeFilterValue => {\n if (\n !value ||\n typeof value !== 'object' ||\n 'start' in value ||\n 'end' in value\n ) {\n return {};\n }\n\n return value as NumberRangeFilterValue;\n};\n\nconst getDateFilterValue = (value?: FilterValue): DatePickerValue =>\n value instanceof Date || value === null ? value : null;\n\nconst getDateRangeFilterValue = (value?: FilterValue): DateRangeValue => {\n if (\n value &&\n typeof value === 'object' &&\n 'start' in value &&\n 'end' in value\n ) {\n return value as DateRangeValue;\n }\n\n return { start: null, end: null };\n};\n\nfunction buildGeneratedFilterOptions<T>(\n columns: DataTableProps<T>['columns'],\n data: T[],\n): FilterOption[] {\n return columns\n .filter((column) => column.filterable !== false)\n .map((column) => {\n const uniqueValues = new Set<string>();\n\n data.forEach((row) => {\n const value = (row as Record<string, unknown>)[column.id];\n if (value !== undefined && value !== null && value !== '') {\n uniqueValues.add(String(value));\n }\n });\n\n return {\n id: column.id,\n label: column.label,\n options: Array.from(uniqueValues).sort(),\n multiple: column.multiFilter,\n };\n });\n}\n\nfunction resolveFilterOptions<T>(\n columns: DataTableProps<T>['columns'],\n data: T[],\n externalFilterOptions: FilterOption[] | undefined,\n asyncFilterOptions: AsyncFilterOptionsState,\n): FilterOption[] {\n if (!externalFilterOptions?.length) {\n return buildGeneratedFilterOptions(columns, data);\n }\n\n return externalFilterOptions.map((filter) => {\n const asyncState = asyncFilterOptions[filter.id];\n if (!asyncState) {\n return filter;\n }\n\n return {\n ...filter,\n options: asyncState.options,\n isLoading: asyncState.isLoading,\n };\n });\n}\n\nfunction matchesSearchQuery<T>(row: T, searchQuery: string): boolean {\n if (!searchQuery.trim()) {\n return true;\n }\n\n const query = searchQuery.toLowerCase();\n return Object.values(row as Record<string, unknown>).some((value) => {\n if (value === undefined || value === null) {\n return false;\n }\n\n return String(value).toLowerCase().includes(query);\n });\n}\n\nfunction matchesFilterValue(\n rowValue: unknown,\n filterValue: FilterValue,\n filterOption?: FilterOption,\n): boolean {\n if (isFilterValueEmpty(filterValue)) {\n return true;\n }\n\n switch (filterOption?.type) {\n case 'text':\n return String(rowValue)\n .toLowerCase()\n .includes(String(filterValue).toLowerCase());\n case 'number-range': {\n const rangeValue = getNumberRangeFilterValue(filterValue);\n const numericValue = Number(rowValue);\n if (rangeValue.min !== undefined && numericValue < rangeValue.min) {\n return false;\n }\n if (rangeValue.max !== undefined && numericValue > rangeValue.max) {\n return false;\n }\n return true;\n }\n case 'date-range': {\n const rangeValue = getDateRangeFilterValue(filterValue);\n if (!rangeValue.start) {\n return true;\n }\n const timeValue = new Date(rowValue as string | number | Date).getTime();\n if (timeValue < rangeValue.start.getTime()) {\n return false;\n }\n return !rangeValue.end || timeValue <= rangeValue.end.getTime();\n }\n case 'date': {\n const selectedDate = filterValue as Date;\n const rowDate = new Date(rowValue as string | number | Date);\n return selectedDate.toDateString() === rowDate.toDateString();\n }\n case 'switch':\n case 'checkbox':\n return Boolean(rowValue) === Boolean(filterValue);\n default: {\n const rowValueString = String(rowValue).toLowerCase();\n if (Array.isArray(filterValue)) {\n return filterValue.some(\n (value) => String(value).toLowerCase() === rowValueString,\n );\n }\n\n return typeof filterValue !== 'string'\n ? true\n : rowValueString === filterValue.toLowerCase();\n }\n }\n}\n\nfunction filterClientData<T>(\n data: T[],\n activeFilters: FilterValues,\n searchQuery: string,\n serverSideFiltering: boolean,\n filterOptions: FilterOption[],\n): T[] {\n if (serverSideFiltering) {\n return data;\n }\n\n const filterOptionsMap = new Map(\n filterOptions.map((filterOption) => [filterOption.id, filterOption]),\n );\n\n return data.filter((row) => {\n if (!matchesSearchQuery(row, searchQuery)) {\n return false;\n }\n\n return Object.entries(activeFilters).every(([filterId, filterValue]) => {\n const rowValue = (row as Record<string, unknown>)[filterId];\n return matchesFilterValue(\n rowValue,\n filterValue,\n filterOptionsMap.get(filterId),\n );\n });\n });\n}\n\nfunction useAsyncFilterOptions(\n externalFilterOptions: FilterOption[] | undefined,\n filterSelectorOpen: boolean,\n): AsyncFilterOptionsState {\n const [asyncFilterOptions, setAsyncFilterOptions] =\n React.useState<AsyncFilterOptionsState>({});\n const asyncFilterOptionsRef = React.useRef(asyncFilterOptions);\n\n React.useEffect(() => {\n asyncFilterOptionsRef.current = asyncFilterOptions;\n }, [asyncFilterOptions]);\n\n const fetchAsyncOptions = React.useCallback(async (filter: FilterOption) => {\n if (\n !filter.fetchOptions ||\n asyncFilterOptionsRef.current[filter.id]?.options.length\n ) {\n return;\n }\n\n setAsyncFilterOptions((prev) => ({\n ...prev,\n [filter.id]: { options: [], isLoading: true },\n }));\n\n try {\n const options = await filter.fetchOptions();\n setAsyncFilterOptions((prev) => ({\n ...prev,\n [filter.id]: { options, isLoading: false },\n }));\n } catch {\n setAsyncFilterOptions((prev) => ({\n ...prev,\n [filter.id]: { options: [], isLoading: false },\n }));\n }\n }, []);\n\n React.useEffect(() => {\n if (!filterSelectorOpen || !externalFilterOptions) {\n return;\n }\n\n externalFilterOptions.forEach((filter) => {\n if (filter.fetchOptions) {\n void fetchAsyncOptions(filter);\n }\n });\n }, [externalFilterOptions, fetchAsyncOptions, filterSelectorOpen]);\n\n return asyncFilterOptions;\n}\n\nfunction LoadingFilterField({ label }: { label: string }) {\n return (\n <div className=\"h-10 flex items-center justify-center bg-neutral-100 dark:bg-neutral-800 rounded-md px-3\">\n <svg\n className=\"w-4 h-4 animate-spin text-neutral-400\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n >\n <circle\n className=\"opacity-25\"\n cx=\"12\"\n cy=\"12\"\n r=\"10\"\n stroke=\"currentColor\"\n strokeWidth=\"4\"\n />\n <path\n className=\"opacity-75\"\n fill=\"currentColor\"\n d=\"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z\"\n />\n </svg>\n <span className=\"ml-2 text-sm text-neutral-500\">{label}</span>\n </div>\n );\n}\n\ninterface NumberRangeFilterProps {\n value: NumberRangeFilterValue;\n onChange: (value: NumberRangeFilterValue) => void;\n}\n\nfunction NumberRangeFilter({ value, onChange }: NumberRangeFilterProps) {\n return (\n <div className=\"flex items-center gap-1\">\n <Input\n type=\"number\"\n placeholder=\"Min\"\n value={value.min ?? ''}\n onChange={(event) => {\n const min =\n event.target.value === '' ? undefined : Number(event.target.value);\n onChange({ ...value, min });\n }}\n className=\"h-9 px-2 text-xs\"\n />\n <span className=\"text-neutral-400\">-</span>\n <Input\n type=\"number\"\n placeholder=\"Max\"\n value={value.max ?? ''}\n onChange={(event) => {\n const max =\n event.target.value === '' ? undefined : Number(event.target.value);\n onChange({ ...value, max });\n }}\n className=\"h-9 px-2 text-xs\"\n />\n </div>\n );\n}\n\ninterface FilterFieldControlProps {\n filter: FilterOption;\n value?: FilterValue;\n isActive: boolean;\n onChange: (value: FilterValue) => void;\n}\n\nfunction FilterFieldControl({\n filter,\n value,\n isActive,\n onChange,\n}: FilterFieldControlProps) {\n if (filter.isLoading) {\n return <LoadingFilterField label={filter.label} />;\n }\n\n const activeClassName = isActive ? 'border-primary-500' : '';\n\n switch (filter.type) {\n case 'text':\n return (\n <Input\n value={getStringFilterValue(value)}\n onChange={(event) => onChange(event.target.value)}\n placeholder={filter.placeholder || filter.label}\n className={activeClassName}\n />\n );\n case 'select':\n return (\n <Select\n value={getStringFilterValue(value)}\n onChange={(event) => onChange(event.target.value)}\n placeholder={filter.placeholder || filter.label}\n options={toSelectOptions(filter.options)}\n className={activeClassName}\n />\n );\n case 'switch':\n case 'checkbox':\n return (\n <Switch\n checked={Boolean(value)}\n onChange={(event) => onChange(event.target.checked)}\n label={filter.label}\n />\n );\n case 'date':\n return (\n <DatePicker\n mode=\"single\"\n value={getDateFilterValue(value)}\n onChange={(nextValue) => onChange(nextValue)}\n placeholder={filter.placeholder || filter.label}\n />\n );\n case 'date-range':\n return (\n <DatePicker\n mode=\"range\"\n value={getDateRangeFilterValue(value)}\n onChange={(nextValue) => onChange(nextValue)}\n placeholder={filter.placeholder || filter.label}\n />\n );\n case 'number-range':\n return (\n <NumberRangeFilter\n value={getNumberRangeFilterValue(value)}\n onChange={onChange}\n />\n );\n default:\n return filter.multiple ? (\n <MultiSelectCombobox\n value={getMultiStringFilterValue(value)}\n onChange={(values) => onChange(values)}\n placeholder={filter.placeholder || filter.label}\n options={toSelectOptions(filter.options)}\n className={isActive ? 'border-primary-500 border-2' : ''}\n />\n ) : (\n <Combobox\n value={getStringFilterValue(value)}\n onChange={(nextValue) => onChange(nextValue)}\n placeholder={filter.placeholder || filter.label}\n options={toSelectOptions(filter.options)}\n className={isActive ? 'border-primary-500 border-2' : ''}\n />\n );\n }\n}\n\ninterface ToolbarIconButtonProps {\n title: string;\n onClick?: () => void;\n disabled?: boolean;\n children: React.ReactNode;\n}\n\nfunction ToolbarIconButton({\n title,\n onClick,\n disabled,\n children,\n}: ToolbarIconButtonProps) {\n return (\n <button\n onClick={onClick}\n disabled={disabled}\n title={title}\n className={\n disabled ? DISABLED_ICON_BUTTON_CLASS_NAME : ICON_BUTTON_CLASS_NAME\n }\n >\n {children}\n </button>\n );\n}\n\ninterface SearchFieldProps {\n value: string;\n onChange: (value: string) => void;\n placeholder: string;\n}\n\nfunction SearchField({ value, onChange, placeholder }: SearchFieldProps) {\n return (\n <div className=\"relative w-[300px]\">\n <svg\n className=\"pointer-events-none absolute left-4 top-1/2 z-10 h-4 w-4 -translate-y-1/2 text-neutral-400\"\n fill=\"none\"\n stroke=\"currentColor\"\n viewBox=\"0 0 24 24\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z\"\n />\n </svg>\n <Input\n type=\"text\"\n value={value}\n onChange={(event) => onChange(event.target.value)}\n placeholder={placeholder}\n style={{ paddingLeft: '2.75rem' }}\n />\n </div>\n );\n}\n\ninterface RowActionsCellProps<T> {\n rowIndex: number;\n row: T;\n isOpen: boolean;\n onToggle: (rowIndex: number) => void;\n onClose: () => void;\n onRowAction?: (action: string, row: T) => void;\n}\n\nfunction RowActionsCell<T>({\n rowIndex,\n row,\n isOpen,\n onToggle,\n onClose,\n onRowAction,\n}: RowActionsCellProps<T>) {\n return (\n <td className=\"px-2 py-3 text-right relative\">\n <button\n onClick={() => onToggle(rowIndex)}\n className=\"p-1 rounded hover:bg-neutral-100 dark:hover:bg-neutral-600 text-neutral-500\"\n >\n <svg className=\"w-5 h-5\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n <path d=\"M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z\" />\n </svg>\n </button>\n {isOpen ? (\n <>\n <div className=\"fixed inset-0 z-40\" onClick={onClose} />\n <div className=\"absolute right-0 top-full mt-1 bg-white dark:bg-neutral-800 rounded-lg shadow-lg border border-neutral-200 dark:border-neutral-700 z-50 min-w-32 py-1\">\n <button\n onClick={() => {\n onRowAction?.('edit', row);\n onClose();\n }}\n className=\"w-full text-left px-4 py-2 text-sm hover:bg-neutral-50 dark:hover:bg-neutral-700\"\n >\n Edit\n </button>\n <button\n onClick={() => {\n onRowAction?.('delete', row);\n onClose();\n }}\n className=\"w-full text-left px-4 py-2 text-sm text-error hover:bg-neutral-50 dark:hover:bg-neutral-700\"\n >\n Delete\n </button>\n </div>\n </>\n ) : null}\n </td>\n );\n}\n\ninterface DataTablePaginationProps<T> {\n table: Table<T>;\n totalCount?: number;\n filteredCount: number;\n}\n\nfunction DataTablePagination<T>({\n table,\n totalCount,\n filteredCount,\n}: DataTablePaginationProps<T>) {\n const { pageIndex, pageSize } = table.getState().pagination;\n const itemCount = totalCount ?? filteredCount;\n const pageStart = itemCount === 0 ? 0 : pageIndex * pageSize + 1;\n const pageEnd = Math.min((pageIndex + 1) * pageSize, itemCount);\n\n return (\n <div className=\"flex items-center justify-between px-4 py-3 border-t border-neutral-200 dark:border-neutral-700 bg-neutral-50 dark:bg-neutral-800/50\">\n <div className=\"flex items-center gap-2\">\n <span className=\"text-sm text-neutral-600 dark:text-neutral-400\">\n Showing {pageStart} to {pageEnd} of {itemCount} items\n </span>\n </div>\n\n <div className=\"flex items-center gap-2\">\n <select\n value={pageSize}\n onChange={(event) => table.setPageSize(Number(event.target.value))}\n className=\"px-2 py-1 text-sm border border-neutral-200 dark:border-neutral-600 rounded-lg bg-white dark:bg-neutral-700 text-neutral-700 dark:text-neutral-300\"\n >\n {[10, 20, 30, 50, 100].map((size) => (\n <option key={size} value={size}>\n {size} / page\n </option>\n ))}\n </select>\n\n <ToolbarIconButton\n title=\"First page\"\n onClick={() => table.setPageIndex(0)}\n disabled={!table.getCanPreviousPage()}\n >\n <svg\n className=\"w-4 h-4\"\n fill=\"none\"\n stroke=\"currentColor\"\n viewBox=\"0 0 24 24\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M11 19l-7-7 7-7m8 14l-7-7 7-7\"\n />\n </svg>\n </ToolbarIconButton>\n\n <ToolbarIconButton\n title=\"Previous page\"\n onClick={() => table.previousPage()}\n disabled={!table.getCanPreviousPage()}\n >\n <svg\n className=\"w-4 h-4\"\n fill=\"none\"\n stroke=\"currentColor\"\n viewBox=\"0 0 24 24\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M15 19l-7-7 7-7\"\n />\n </svg>\n </ToolbarIconButton>\n\n <span className=\"px-3 py-1 text-sm text-neutral-700 dark:text-neutral-300\">\n Page {pageIndex + 1} of {table.getPageCount()}\n </span>\n\n <ToolbarIconButton\n title=\"Next page\"\n onClick={() => table.nextPage()}\n disabled={!table.getCanNextPage()}\n >\n <svg\n className=\"w-4 h-4\"\n fill=\"none\"\n stroke=\"currentColor\"\n viewBox=\"0 0 24 24\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M9 5l7 7-7 7\"\n />\n </svg>\n </ToolbarIconButton>\n\n <ToolbarIconButton\n title=\"Last page\"\n onClick={() => table.setPageIndex(table.getPageCount() - 1)}\n disabled={!table.getCanNextPage()}\n >\n <svg\n className=\"w-4 h-4\"\n fill=\"none\"\n stroke=\"currentColor\"\n viewBox=\"0 0 24 24\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M13 5l7 7-7 7M5 5l7 7-7 7\"\n />\n </svg>\n </ToolbarIconButton>\n </div>\n </div>\n );\n}\n\ninterface FilterSelectorMenuProps {\n filterOptions: FilterOption[];\n visibleFilters: string[];\n onToggleFilter: (filterId: string, isVisible: boolean) => void;\n onShowAll: () => void;\n onHideAll: () => void;\n}\n\nfunction FilterSelectorMenu({\n filterOptions,\n visibleFilters,\n onToggleFilter,\n onShowAll,\n onHideAll,\n}: FilterSelectorMenuProps) {\n return (\n <div className=\"p-2 min-w-48 space-y-1\">\n <div className=\"text-xs font-semibold text-neutral-500 px-2 pb-2\">\n Show filters\n </div>\n {filterOptions.map((filter) => (\n <label\n key={filter.id}\n className=\"flex items-center gap-2 px-2 py-1.5 rounded-lg cursor-pointer hover:bg-neutral-50 dark:hover:bg-neutral-700\"\n >\n <input\n type=\"checkbox\"\n checked={visibleFilters.includes(filter.id)}\n onChange={(event) =>\n onToggleFilter(filter.id, event.target.checked)\n }\n className=\"w-4 h-4 rounded cursor-pointer accent-primary-500\"\n />\n <span className=\"text-sm text-neutral-700 dark:text-neutral-300\">\n {filter.label}\n </span>\n </label>\n ))}\n <div className=\"flex gap-2 pt-2 border-t border-neutral-200 dark:border-neutral-700\">\n <button\n onClick={onShowAll}\n className=\"flex-1 text-xs font-semibold text-primary-500 hover:text-primary-600 py-1\"\n >\n SHOW ALL\n </button>\n <button\n onClick={onHideAll}\n className=\"flex-1 text-xs font-semibold text-neutral-500 hover:text-neutral-600 py-1\"\n >\n HIDE ALL\n </button>\n </div>\n </div>\n );\n}\n\ninterface DataTableToolbarProps<T> {\n searchQuery: string;\n onSearchChange: (value: string) => void;\n searchPlaceholder: string;\n bulkDeleteEnabled: boolean;\n bulkSelectionActive: boolean;\n selectedCount: number;\n bulkActionsContent?: React.ReactNode;\n bulkActionCard?: React.ReactNode;\n onToggleBulkSelection: () => void;\n onBulkDeleteSelected: () => void;\n onExport?: () => void;\n columnMenuOpen: boolean;\n onToggleColumnMenu: () => void;\n onCloseColumnMenu: () => void;\n columns: DataTableProps<T>['columns'];\n onColumnToggle?: (columnId: string) => void;\n}\n\nfunction DataTableToolbar<T>({\n searchQuery,\n onSearchChange,\n searchPlaceholder,\n bulkDeleteEnabled,\n bulkSelectionActive,\n selectedCount,\n bulkActionsContent,\n bulkActionCard,\n onToggleBulkSelection,\n onBulkDeleteSelected,\n onExport,\n columnMenuOpen,\n onToggleColumnMenu,\n onCloseColumnMenu,\n columns,\n onColumnToggle,\n}: DataTableToolbarProps<T>) {\n const hasSelectedRows = selectedCount > 0;\n\n return (\n <div className=\"border-b border-neutral-200 px-4 py-3 dark:border-neutral-700\">\n <div className=\"flex flex-col gap-3 lg:flex-row lg:items-center lg:justify-between\">\n <div className=\"flex min-w-0 flex-1 flex-wrap items-center gap-2\">\n {bulkDeleteEnabled ? (\n <FilterButton\n icon={\n <svg\n fill=\"none\"\n stroke=\"currentColor\"\n className=\"h-6.5 w-6.5\"\n viewBox=\"0 0 24 24\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={1.75}\n d=\"M4.25 10V18.85A1.25 1.25 0 005.5 20.1H14\"\n />\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={1.75}\n d=\"M7 5.75h10A1.25 1.25 0 0118.25 7v10A1.25 1.25 0 0117 18.25H7A1.25 1.25 0 015.75 17V7A1.25 1.25 0 017 5.75z\"\n />\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={1.75}\n d=\"m9.25 12 2.25 2.25 4.25-4.5\"\n />\n </svg>\n }\n label={\n bulkSelectionActive\n ? 'Disable bulk selection'\n : 'Enable bulk selection'\n }\n onClick={onToggleBulkSelection}\n hasActive={bulkSelectionActive}\n />\n ) : null}\n\n <SearchField\n value={searchQuery}\n onChange={onSearchChange}\n placeholder={searchPlaceholder}\n />\n </div>\n\n <div className=\"flex items-center gap-1 self-end lg:self-auto\">\n <ToolbarIconButton onClick={onExport} title=\"Refresh\">\n <svg\n className=\"w-5 h-5\"\n fill=\"none\"\n stroke=\"currentColor\"\n viewBox=\"0 0 24 24\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15\"\n />\n </svg>\n </ToolbarIconButton>\n\n <div className=\"relative\">\n <ToolbarIconButton\n onClick={onToggleColumnMenu}\n title=\"Column settings\"\n >\n <svg\n className=\"w-5 h-5\"\n fill=\"none\"\n stroke=\"currentColor\"\n viewBox=\"0 0 24 24\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M4 6h16M7 12h10m-7 6h4\"\n />\n </svg>\n </ToolbarIconButton>\n\n <FilterDropdown isOpen={columnMenuOpen} onClose={onCloseColumnMenu}>\n <ColumnToggle\n columns={columns}\n onToggle={(columnId) => {\n onColumnToggle?.(columnId);\n }}\n />\n </FilterDropdown>\n </div>\n </div>\n </div>\n\n {bulkSelectionActive && hasSelectedRows\n ? (bulkActionCard ?? (\n <div className=\"mt-3 flex flex-col gap-3 rounded-xl border border-neutral-200/80 bg-white/90 px-4 py-3 shadow-sm backdrop-blur-xl dark:border-white/10 dark:bg-neutral-900/70 dark:shadow-black/20 lg:flex-row lg:items-center lg:justify-between\">\n <div className=\"flex min-w-0 flex-wrap items-center gap-2\">\n <span className=\"inline-flex items-center rounded-full border border-primary-200 bg-primary-100/80 px-2.5 py-1 text-xs font-semibold uppercase tracking-wide text-primary-700 dark:border-primary-400/20 dark:bg-primary-500/15 dark:text-primary-200\">\n Bulk actions\n </span>\n <p className=\"text-sm font-medium text-neutral-900 dark:text-white\">\n {selectedCount} {selectedCount === 1 ? 'row' : 'rows'}{' '}\n selected\n </p>\n </div>\n\n <div className=\"flex flex-wrap items-center gap-2\">\n {bulkActionsContent}\n {bulkDeleteEnabled ? (\n <button\n type=\"button\"\n onClick={onBulkDeleteSelected}\n className=\"inline-flex items-center gap-2 rounded-lg border border-primary-400/30 bg-primary px-3 py-2 text-sm font-medium text-primary-foreground shadow-lg shadow-primary-500/20 transition-colors hover:bg-primary-600\"\n >\n <svg\n className=\"h-4 w-4\"\n fill=\"none\"\n stroke=\"currentColor\"\n viewBox=\"0 0 24 24\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6M9 7V4a1 1 0 011-1h4a1 1 0 011 1v3m-7 0h8\"\n />\n </svg>\n Delete selected\n </button>\n ) : null}\n </div>\n </div>\n ))\n : null}\n </div>\n );\n}\n\ninterface TableStateRowProps {\n colSpan: number;\n children: React.ReactNode;\n}\n\nfunction TableStateRow({ colSpan, children }: TableStateRowProps) {\n return (\n <tr>\n <td colSpan={colSpan} className=\"px-4 py-12 text-center text-neutral-500\">\n {children}\n </td>\n </tr>\n );\n}\n\nfunction LoadingTableState({ colSpan }: { colSpan: number }) {\n return (\n <TableStateRow colSpan={colSpan}>\n <div className=\"flex flex-col items-center gap-3\">\n <svg\n className=\"w-8 h-8 animate-spin text-primary-500\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n >\n <circle\n className=\"opacity-25\"\n cx=\"12\"\n cy=\"12\"\n r=\"10\"\n stroke=\"currentColor\"\n strokeWidth=\"4\"\n />\n <path\n className=\"opacity-75\"\n fill=\"currentColor\"\n d=\"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z\"\n />\n </svg>\n <span>Loading data...</span>\n </div>\n </TableStateRow>\n );\n}\n\nfunction EmptyTableState({ colSpan }: { colSpan: number }) {\n return (\n <TableStateRow colSpan={colSpan}>\n <div className=\"flex flex-col items-center gap-2\">\n <span className=\"text-4xl\">🔍</span>\n <p className=\"font-medium\">No results found</p>\n <p className=\"text-sm\">Try adjusting the filter</p>\n </div>\n </TableStateRow>\n );\n}\n\ninterface DataTableRowsProps<T> {\n table: Table<T>;\n isLoading: boolean;\n bulkSelectionActive: boolean;\n selectedRowIds: Record<string, boolean>;\n onToggleRowSelection: (rowId: string, checked: boolean) => void;\n rowMenuOpen: number | null;\n onToggleRowMenu: (rowIndex: number) => void;\n onCloseRowMenu: () => void;\n onRowAction?: (action: string, row: T) => void;\n}\n\nfunction DataTableRows<T>({\n table,\n isLoading,\n bulkSelectionActive,\n selectedRowIds,\n onToggleRowSelection,\n rowMenuOpen,\n onToggleRowMenu,\n onCloseRowMenu,\n onRowAction,\n}: DataTableRowsProps<T>) {\n const colSpan =\n table.getVisibleLeafColumns().length + (bulkSelectionActive ? 2 : 1);\n\n if (isLoading) {\n return <LoadingTableState colSpan={colSpan} />;\n }\n\n if (table.getRowModel().rows.length === 0) {\n return <EmptyTableState colSpan={colSpan} />;\n }\n\n return (\n <>\n {table.getRowModel().rows.map((row) => (\n <tr\n key={row.id}\n className=\"border-b border-neutral-100 dark:border-neutral-700 hover:bg-neutral-50 dark:hover:bg-neutral-700/50 transition-colors\"\n >\n {bulkSelectionActive ? (\n <td className=\"w-12 px-4 py-3 align-middle\">\n <Checkbox\n aria-label={`Select row ${row.id}`}\n checked={Boolean(selectedRowIds[row.id])}\n onChange={(event) =>\n onToggleRowSelection(row.id, event.target.checked)\n }\n />\n </td>\n ) : null}\n {row.getVisibleCells().map((cell) => (\n <td\n key={cell.id}\n className=\"px-4 py-3 text-sm text-neutral-700 dark:text-neutral-300\"\n >\n {flexRender(cell.column.columnDef.cell, cell.getContext())}\n </td>\n ))}\n <RowActionsCell\n rowIndex={row.index}\n row={row.original}\n isOpen={rowMenuOpen === row.index}\n onToggle={onToggleRowMenu}\n onClose={onCloseRowMenu}\n onRowAction={onRowAction}\n />\n </tr>\n ))}\n </>\n );\n}\n\nconst usesManualPagination = (\n totalCount?: number,\n onPaginationChange?: (pageIndex: number, pageSize: number) => void,\n) => totalCount !== undefined || typeof onPaginationChange === 'function';\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport default function DataTable<T = Record<string, any>>({\n columns,\n data,\n isLoading = false,\n onColumnToggle,\n pageSize = 10,\n maxHeight = '500px',\n onSearch,\n onExport,\n onRowAction,\n onBulkDelete,\n renderBulkActions,\n renderBulkActionCard,\n onFilterChange,\n onFiltersApply,\n serverSideFiltering = false,\n filterOptions: externalFilterOptions,\n searchPlaceholder = 'Search ...',\n totalCount,\n onPaginationChange,\n}: DataTableProps<T>) {\n const [pagination, setPagination] = React.useState<PaginationState>({\n pageIndex: 0,\n pageSize: pageSize,\n });\n const [columnMenuOpen, setColumnMenuOpen] = React.useState(false);\n const [profileMenuOpen, setProfileMenuOpen] = React.useState(false);\n const [profileOpen, setProfileOpen] = React.useState(false);\n const [filterSelectorOpen, setFilterSelectorOpen] = React.useState(false);\n const [visibleFilters, setVisibleFilters] = React.useState<string[]>([]);\n const [activeFilters, setActiveFilters] = React.useState<FilterValues>({});\n const [bulkSelectionActive, setBulkSelectionActive] = React.useState(false);\n const [selectedRowIds, setSelectedRowIds] = React.useState<\n Record<string, boolean>\n >({});\n const [rowMenuOpen, setRowMenuOpen] = React.useState<number | null>(null);\n const [searchQuery, setSearchQuery] = React.useState('');\n\n const asyncFilterOptions = useAsyncFilterOptions(\n externalFilterOptions,\n filterSelectorOpen,\n );\n\n // Auto-generate filter options from columns that are filterable\n const filterOptions: FilterOption[] = React.useMemo(() => {\n return resolveFilterOptions(\n columns,\n data,\n externalFilterOptions,\n asyncFilterOptions,\n );\n }, [columns, data, externalFilterOptions, asyncFilterOptions]);\n\n const visibleColumns = React.useMemo(\n () => columns.filter((column) => column.visible !== false),\n [columns],\n );\n const manualPagination = usesManualPagination(totalCount, onPaginationChange);\n const pageCount =\n totalCount === undefined\n ? undefined\n : Math.ceil(totalCount / pagination.pageSize);\n\n // Filter data based on search query and active filters (client-side only)\n const filteredData = React.useMemo(() => {\n return filterClientData(\n data,\n activeFilters,\n searchQuery,\n serverSideFiltering,\n filterOptions,\n );\n }, [data, activeFilters, searchQuery, serverSideFiltering, filterOptions]);\n\n // TanStack Table columns definition\n const tableColumns = React.useMemo<ColumnDef<T>[]>(\n () =>\n visibleColumns.map((col) => ({\n id: col.id,\n accessorKey: col.id,\n header: col.label,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n cell: (info: any) => info.getValue() || '-',\n })),\n [visibleColumns],\n );\n\n const updatePagination = React.useCallback(\n (\n updater:\n | PaginationState\n | ((previous: PaginationState) => PaginationState),\n ) => {\n setPagination((previous) => {\n const nextPagination =\n typeof updater === 'function' ? updater(previous) : updater;\n\n if (\n previous.pageIndex !== nextPagination.pageIndex ||\n previous.pageSize !== nextPagination.pageSize\n ) {\n onPaginationChange?.(\n nextPagination.pageIndex,\n nextPagination.pageSize,\n );\n }\n\n return nextPagination;\n });\n },\n [onPaginationChange],\n );\n\n const table = useReactTable({\n data: filteredData,\n columns: tableColumns,\n getCoreRowModel: getCoreRowModel(),\n getPaginationRowModel: getPaginationRowModel(),\n getFilteredRowModel: getFilteredRowModel(),\n state: {\n pagination,\n globalFilter: searchQuery,\n },\n onPaginationChange: updatePagination,\n manualPagination,\n pageCount,\n });\n\n const visibleRows = table.getRowModel().rows;\n const bulkDeleteEnabled = typeof onBulkDelete === 'function';\n const selectedRows = React.useMemo(\n () =>\n visibleRows\n .filter((row) => selectedRowIds[row.id])\n .map((row) => row.original),\n [selectedRowIds, visibleRows],\n );\n const allVisibleRowsSelected =\n visibleRows.length > 0 &&\n visibleRows.every((row) => selectedRowIds[row.id]);\n\n React.useEffect(() => {\n updatePagination((previous) =>\n previous.pageIndex === 0 ? previous : { ...previous, pageIndex: 0 },\n );\n }, [activeFilters, searchQuery, updatePagination]);\n\n React.useEffect(() => {\n setSelectedRowIds((previous) => {\n const visibleRowIds = new Set(visibleRows.map((row) => row.id));\n const nextSelection = Object.fromEntries(\n Object.entries(previous).filter(\n ([rowId, isSelected]) => isSelected && visibleRowIds.has(rowId),\n ),\n );\n\n const previousKeys = Object.keys(previous).sort().join('|');\n const nextKeys = Object.keys(nextSelection).sort().join('|');\n\n return previousKeys === nextKeys ? previous : nextSelection;\n });\n }, [visibleRows]);\n\n const applyFilters = React.useCallback(\n (nextFilters: FilterValues) => {\n setActiveFilters(nextFilters);\n onFilterChange?.(nextFilters);\n\n if (serverSideFiltering) {\n onFiltersApply?.(nextFilters);\n }\n },\n [onFilterChange, onFiltersApply, serverSideFiltering],\n );\n\n const handleSearchChange = React.useCallback(\n (value: string) => {\n setSearchQuery(value);\n onSearch?.(value);\n },\n [onSearch],\n );\n\n const handleFilterChange = React.useCallback(\n (filterId: string, value: FilterValue) => {\n applyFilters({\n ...activeFilters,\n [filterId]: value,\n });\n },\n [activeFilters, applyFilters],\n );\n\n const handleResetFilters = React.useCallback(() => {\n applyFilters({});\n }, [applyFilters]);\n\n const handleToggleFilterVisibility = React.useCallback(\n (filterId: string, isVisible: boolean) => {\n setVisibleFilters((previous) => {\n if (isVisible) {\n return previous.includes(filterId)\n ? previous\n : [...previous, filterId];\n }\n\n return previous.filter((id) => id !== filterId);\n });\n\n if (!isVisible && filterId in activeFilters) {\n const nextFilters = { ...activeFilters };\n delete nextFilters[filterId];\n applyFilters(nextFilters);\n }\n },\n [activeFilters, applyFilters],\n );\n\n const handleShowAllFilters = React.useCallback(() => {\n setVisibleFilters(filterOptions.map((filter) => filter.id));\n }, [filterOptions]);\n\n const handleHideAllFilters = React.useCallback(() => {\n setVisibleFilters([]);\n handleResetFilters();\n }, [handleResetFilters]);\n\n const handleToggleRowMenu = React.useCallback((rowIndex: number) => {\n setRowMenuOpen((previous) => (previous === rowIndex ? null : rowIndex));\n }, []);\n\n const handleToggleFilterSelector = React.useCallback(() => {\n setFilterSelectorOpen((previous) => !previous);\n }, []);\n\n const handleToggleProfileMenu = React.useCallback(() => {\n setProfileMenuOpen((previous) => !previous);\n }, []);\n\n const handleToggleColumnMenu = React.useCallback(() => {\n setColumnMenuOpen((previous) => !previous);\n }, []);\n\n const handleToggleBulkSelection = React.useCallback(() => {\n setBulkSelectionActive((previous) => {\n if (previous) {\n setSelectedRowIds({});\n }\n\n return !previous;\n });\n }, []);\n\n const handleToggleRowSelection = React.useCallback(\n (rowId: string, checked: boolean) => {\n setSelectedRowIds((previous) => {\n if (checked) {\n return {\n ...previous,\n [rowId]: true,\n };\n }\n\n const nextSelection = { ...previous };\n delete nextSelection[rowId];\n return nextSelection;\n });\n },\n [],\n );\n\n const handleToggleAllVisibleRows = React.useCallback(\n (checked: boolean) => {\n setSelectedRowIds((previous) => {\n const nextSelection = { ...previous };\n\n visibleRows.forEach((row) => {\n if (checked) {\n nextSelection[row.id] = true;\n } else {\n delete nextSelection[row.id];\n }\n });\n\n return nextSelection;\n });\n },\n [visibleRows],\n );\n\n const handleBulkDeleteSelected = React.useCallback(() => {\n if (!onBulkDelete || selectedRows.length === 0) {\n return;\n }\n\n onBulkDelete(selectedRows);\n setSelectedRowIds({});\n }, [onBulkDelete, selectedRows]);\n\n const handleClearSelectedRows = React.useCallback(() => {\n setSelectedRowIds({});\n }, []);\n\n const handleDisableBulkSelection = React.useCallback(() => {\n setBulkSelectionActive(false);\n setSelectedRowIds({});\n }, []);\n\n const bulkActionContext = React.useMemo<DataTableBulkActionContext<T>>(\n () => ({\n selectedRows,\n selectedCount: selectedRows.length,\n clearSelection: handleClearSelectedRows,\n disableBulkSelection: handleDisableBulkSelection,\n }),\n [handleClearSelectedRows, handleDisableBulkSelection, selectedRows],\n );\n\n const bulkActionsContent = renderBulkActions?.(bulkActionContext);\n const bulkActionCard = renderBulkActionCard?.(bulkActionContext);\n\n const handleOpenProfile = React.useCallback(() => {\n setProfileOpen(true);\n setProfileMenuOpen(false);\n }, []);\n\n const hasActiveFilters = Object.values(activeFilters).some(isFilterActive);\n\n const handleSaveProfile = (profileName: string) => {\n void {\n name: profileName,\n filters: activeFilters,\n timestamp: new Date().toISOString(),\n };\n };\n\n return (\n <div className=\"space-y-0\">\n {/* Row 1: Filters Row - Separated with border */}\n <div className=\"flex items-center justify-between gap-4 py-4 px-4 bg-white dark:bg-neutral-900 border border-neutral-200 dark:border-neutral-700 rounded-lg mb-4\">\n <div className=\"flex items-center gap-3 flex-wrap\">\n {filterOptions\n .filter((filter) => visibleFilters.includes(filter.id))\n .map((filter, index) => {\n const isActive = isFilterActive(activeFilters[filter.id]);\n\n return (\n <div\n key={filter.id}\n className={`min-w-[200px] ${\n index > 0\n ? 'pl-3 border-l border-neutral-200 dark:border-neutral-600'\n : ''\n }`}\n >\n <FilterFieldControl\n filter={filter}\n value={activeFilters[filter.id]}\n isActive={isActive}\n onChange={(value) => handleFilterChange(filter.id, value)}\n />\n </div>\n );\n })}\n </div>\n\n {/* Right side icons */}\n <div className=\"flex items-center gap-1 ml-auto\">\n <div className=\"relative\">\n <ToolbarIconButton\n onClick={handleToggleFilterSelector}\n title=\"Add filter\"\n >\n <svg\n className=\"w-5 h-5\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth={2}\n viewBox=\"0 0 24 24\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n d=\"M3 4h18l-7 8v6l-4 2v-8L3 4z\"\n />\n </svg>\n </ToolbarIconButton>\n <FilterDropdown\n isOpen={filterSelectorOpen}\n onClose={() => setFilterSelectorOpen(false)}\n >\n <FilterSelectorMenu\n filterOptions={filterOptions}\n visibleFilters={visibleFilters}\n onToggleFilter={handleToggleFilterVisibility}\n onShowAll={handleShowAllFilters}\n onHideAll={handleHideAllFilters}\n />\n </FilterDropdown>\n </div>\n\n <ToolbarIconButton\n onClick={handleResetFilters}\n disabled={!hasActiveFilters}\n title=\"Clear filters\"\n >\n <svg\n className=\"w-5 h-5\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth={2}\n viewBox=\"0 0 24 24\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n d=\"M3 4h18l-7 8v6l-4 2v-8L3 4z\"\n />\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n d=\"M17 17l4 4m0-4l-4 4\"\n />\n </svg>\n </ToolbarIconButton>\n\n <div className=\"relative\">\n <ToolbarIconButton\n onClick={handleToggleProfileMenu}\n title=\"Filter profiles\"\n >\n <svg\n className=\"w-5 h-5\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth={2}\n viewBox=\"0 0 24 24\"\n >\n {/* Person head */}\n <circle cx=\"9\" cy=\"7\" r=\"3\" />\n {/* Person body */}\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n d=\"M3 21v-2a4 4 0 014-4h4\"\n />\n {/* Small funnel */}\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n d=\"M15 12h6l-3 3.5v2.5l-1.5 1v-3.5L15 12z\"\n />\n </svg>\n </ToolbarIconButton>\n <FilterDropdown\n isOpen={profileMenuOpen}\n onClose={() => setProfileMenuOpen(false)}\n >\n <div className=\"p-2 min-w-48\">\n <button\n onClick={handleOpenProfile}\n className=\"w-full text-left px-4 py-3 text-primary-500 font-medium hover:bg-neutral-50 dark:hover:bg-neutral-700 rounded-lg border-2 border-dashed border-primary-300\"\n >\n Save new filter profile\n </button>\n </div>\n </FilterDropdown>\n </div>\n </div>\n </div>\n\n {/* Table */}\n <div className=\"bg-white dark:bg-neutral-800 rounded-lg border border-neutral-200 dark:border-neutral-700 overflow-hidden\">\n <DataTableToolbar\n searchQuery={searchQuery}\n onSearchChange={handleSearchChange}\n searchPlaceholder={searchPlaceholder}\n bulkDeleteEnabled={bulkDeleteEnabled}\n bulkSelectionActive={bulkSelectionActive}\n selectedCount={selectedRows.length}\n bulkActionsContent={bulkActionsContent}\n bulkActionCard={bulkActionCard}\n onToggleBulkSelection={handleToggleBulkSelection}\n onBulkDeleteSelected={handleBulkDeleteSelected}\n onExport={onExport}\n columnMenuOpen={columnMenuOpen}\n onToggleColumnMenu={handleToggleColumnMenu}\n onCloseColumnMenu={() => setColumnMenuOpen(false)}\n columns={columns}\n onColumnToggle={onColumnToggle}\n />\n\n {/* Table Container */}\n <div className=\"overflow-auto\" style={{ maxHeight }}>\n <table className=\"w-full min-w-[600px]\">\n <thead className=\"sticky top-0 bg-white dark:bg-neutral-800 z-10\">\n {table.getHeaderGroups().map((headerGroup) => (\n <tr\n key={headerGroup.id}\n className=\"border-b border-neutral-200 dark:border-neutral-700\"\n >\n {bulkSelectionActive ? (\n <th className=\"w-12 px-4 py-3 bg-white dark:bg-neutral-800\">\n <Checkbox\n aria-label=\"Select all visible rows\"\n checked={allVisibleRowsSelected}\n onChange={(event) =>\n handleToggleAllVisibleRows(event.target.checked)\n }\n />\n </th>\n ) : null}\n {headerGroup.headers.map((header) => (\n <th\n key={header.id}\n className=\"px-4 py-3 text-left text-sm font-semibold text-neutral-900 dark:text-white whitespace-nowrap bg-white dark:bg-neutral-800\"\n >\n {header.isPlaceholder\n ? null\n : flexRender(\n header.column.columnDef.header,\n header.getContext(),\n )}\n </th>\n ))}\n <th className=\"w-12 bg-white dark:bg-neutral-800\"></th>\n </tr>\n ))}\n </thead>\n <tbody>\n <DataTableRows\n table={table}\n isLoading={isLoading}\n bulkSelectionActive={bulkSelectionActive}\n selectedRowIds={selectedRowIds}\n onToggleRowSelection={handleToggleRowSelection}\n rowMenuOpen={rowMenuOpen}\n onToggleRowMenu={handleToggleRowMenu}\n onCloseRowMenu={() => setRowMenuOpen(null)}\n onRowAction={onRowAction}\n />\n </tbody>\n </table>\n </div>\n\n <DataTablePagination\n table={table}\n totalCount={totalCount}\n filteredCount={filteredData.length}\n />\n </div>\n\n {/* Profile Modal */}\n <FilterProfile\n isOpen={profileOpen}\n onClose={() => setProfileOpen(false)}\n onSaveProfile={(name) => {\n handleSaveProfile(name);\n setProfileOpen(false);\n }}\n />\n </div>\n );\n}\n"],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"date-picker-BWBkr6LG.mjs","names":[],"sources":["../../src/components/forms/date-picker/DatePicker.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef, useState } from \"react\";\n\nimport { Calendar } from \"../calendar\";\n\nimport type { DatePickerProps, DatePickerValue, DateRangeValue } from \"./types\";\n\nconst formatDate = (date: Date | null) =>\n date?.toLocaleDateString(undefined, {\n month: \"short\",\n day: \"numeric\",\n year: \"numeric\",\n }) ?? \"\";\n\nconst isRangeValue = (value: DatePickerValue): value is DateRangeValue =>\n typeof value === \"object\" &&\n value !== null &&\n \"start\" in value &&\n \"end\" in value;\n\nconst emptyRange: DateRangeValue = { start: null, end: null };\n\nexport const DatePicker = ({\n mode = \"single\",\n value,\n onChange,\n label,\n placeholder = \"Pick a date\",\n helperText,\n disabled = false,\n className = \"\",\n presets,\n}: DatePickerProps) => {\n const [open, setOpen] = useState(false);\n const isControlled = value !== undefined;\n const [internalValue, setInternalValue] = useState<DatePickerValue>(\n value ?? (mode === \"range\" ? emptyRange : null),\n );\n\n const currentValue = isControlled ? value : internalValue;\n const singleValue = mode === \"range\" ? null : (currentValue as Date | null);\n const rangeValue =\n mode === \"range\" && isRangeValue(currentValue)\n ? currentValue\n : mode === \"range\"\n ? { ...emptyRange }\n : emptyRange;\n\n const displayValue = useMemo(() => {\n if (mode === \"range\") {\n if (rangeValue.start && rangeValue.end) {\n return `${formatDate(rangeValue.start)} — ${formatDate(rangeValue.end)}`;\n }\n if (rangeValue.start) {\n return `${formatDate(rangeValue.start)} — …`;\n }\n return \"\";\n }\n return formatDate(singleValue);\n }, [mode, rangeValue.end, rangeValue.start, singleValue]);\n\n const updateValue = (next: DatePickerValue) => {\n if (!isControlled) {\n setInternalValue(next);\n }\n onChange?.(next);\n };\n\n const containerRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n if (\n containerRef.current &&\n !containerRef.current.contains(event.target as Node)\n ) {\n setOpen(false);\n }\n };\n\n if (open) {\n document.addEventListener(\"mousedown\", handleClickOutside);\n }\n\n return () => {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n };\n }, [open]);\n\n const handlePresetClick = (getValue: () => DatePickerValue) => {\n const next = getValue();\n updateValue(next);\n setOpen(false);\n };\n\n return (\n <div ref={containerRef} className={`w-full space-y-2 ${className}`.trim()}>\n {label && <p className=\"text-sm font-medium text-heading\">{label}</p>}\n <div className=\"relative\">\n <button\n type=\"button\"\n className={`flex w-full items-center justify-between rounded-md border border-black/5 dark:border-white/10 backdrop-blur-xl bg-white/40 dark:bg-zinc-950/40 px-3 py-2 text-sm shadow-sm ${\n disabled ? \"opacity-50 cursor-not-allowed\" : \"\"\n }`}\n onClick={() => !disabled && setOpen((prev) => !prev)}\n aria-haspopup=\"dialog\"\n aria-expanded={open}\n disabled={disabled}\n >\n <span\n className={\n displayValue ? \"text-foreground\" : \"text-muted-foreground\"\n }\n >\n {displayValue || placeholder}\n </span>\n <span aria-hidden=\"true\">📅</span>\n </button>\n {open && !disabled && (\n <div className=\"absolute left-0 top-12 z-40 dropdown-panel\">\n <Calendar\n value={mode === \"single\" ? (singleValue ?? null) : undefined}\n selectionMode={mode}\n range={mode === \"range\" ? rangeValue : undefined}\n onSelect={\n mode === \"single\"\n ? (date) => {\n updateValue(date);\n setOpen(false);\n }\n : undefined\n }\n onRangeSelect={\n mode === \"range\"\n ? (nextRange) => {\n updateValue(nextRange);\n if (nextRange.start && nextRange.end) {\n setOpen(false);\n }\n }\n : undefined\n }\n />\n {presets?.length ? (\n <div className=\"mt-3 flex flex-wrap gap-2\">\n {presets.map((preset) => (\n <button\n key={preset.label}\n type=\"button\"\n className=\"rounded-full border border-input px-3 py-1 text-xs text-muted-foreground transition-colors hover:border-ring hover:text-heading\"\n onClick={() => handlePresetClick(preset.value)}\n >\n {preset.label}\n </button>\n ))}\n </div>\n ) : null}\n </div>\n )}\n </div>\n {helperText && (\n <p className=\"text-xs text-muted-foreground\">{helperText}</p>\n )}\n </div>\n );\n};\n"],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"date-picker-DooielHi.cjs","names":[],"sources":["../../src/components/forms/date-picker/DatePicker.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef, useState } from \"react\";\n\nimport { Calendar } from \"../calendar\";\n\nimport type { DatePickerProps, DatePickerValue, DateRangeValue } from \"./types\";\n\nconst formatDate = (date: Date | null) =>\n date?.toLocaleDateString(undefined, {\n month: \"short\",\n day: \"numeric\",\n year: \"numeric\",\n }) ?? \"\";\n\nconst isRangeValue = (value: DatePickerValue): value is DateRangeValue =>\n typeof value === \"object\" &&\n value !== null &&\n \"start\" in value &&\n \"end\" in value;\n\nconst emptyRange: DateRangeValue = { start: null, end: null };\n\nexport const DatePicker = ({\n mode = \"single\",\n value,\n onChange,\n label,\n placeholder = \"Pick a date\",\n helperText,\n disabled = false,\n className = \"\",\n presets,\n}: DatePickerProps) => {\n const [open, setOpen] = useState(false);\n const isControlled = value !== undefined;\n const [internalValue, setInternalValue] = useState<DatePickerValue>(\n value ?? (mode === \"range\" ? emptyRange : null),\n );\n\n const currentValue = isControlled ? value : internalValue;\n const singleValue = mode === \"range\" ? null : (currentValue as Date | null);\n const rangeValue =\n mode === \"range\" && isRangeValue(currentValue)\n ? currentValue\n : mode === \"range\"\n ? { ...emptyRange }\n : emptyRange;\n\n const displayValue = useMemo(() => {\n if (mode === \"range\") {\n if (rangeValue.start && rangeValue.end) {\n return `${formatDate(rangeValue.start)} — ${formatDate(rangeValue.end)}`;\n }\n if (rangeValue.start) {\n return `${formatDate(rangeValue.start)} — …`;\n }\n return \"\";\n }\n return formatDate(singleValue);\n }, [mode, rangeValue.end, rangeValue.start, singleValue]);\n\n const updateValue = (next: DatePickerValue) => {\n if (!isControlled) {\n setInternalValue(next);\n }\n onChange?.(next);\n };\n\n const containerRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n if (\n containerRef.current &&\n !containerRef.current.contains(event.target as Node)\n ) {\n setOpen(false);\n }\n };\n\n if (open) {\n document.addEventListener(\"mousedown\", handleClickOutside);\n }\n\n return () => {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n };\n }, [open]);\n\n const handlePresetClick = (getValue: () => DatePickerValue) => {\n const next = getValue();\n updateValue(next);\n setOpen(false);\n };\n\n return (\n <div ref={containerRef} className={`w-full space-y-2 ${className}`.trim()}>\n {label && <p className=\"text-sm font-medium text-heading\">{label}</p>}\n <div className=\"relative\">\n <button\n type=\"button\"\n className={`flex w-full items-center justify-between rounded-md border border-black/5 dark:border-white/10 backdrop-blur-xl bg-white/40 dark:bg-zinc-950/40 px-3 py-2 text-sm shadow-sm ${\n disabled ? \"opacity-50 cursor-not-allowed\" : \"\"\n }`}\n onClick={() => !disabled && setOpen((prev) => !prev)}\n aria-haspopup=\"dialog\"\n aria-expanded={open}\n disabled={disabled}\n >\n <span\n className={\n displayValue ? \"text-foreground\" : \"text-muted-foreground\"\n }\n >\n {displayValue || placeholder}\n </span>\n <span aria-hidden=\"true\">📅</span>\n </button>\n {open && !disabled && (\n <div className=\"absolute left-0 top-12 z-40 dropdown-panel\">\n <Calendar\n value={mode === \"single\" ? (singleValue ?? null) : undefined}\n selectionMode={mode}\n range={mode === \"range\" ? rangeValue : undefined}\n onSelect={\n mode === \"single\"\n ? (date) => {\n updateValue(date);\n setOpen(false);\n }\n : undefined\n }\n onRangeSelect={\n mode === \"range\"\n ? (nextRange) => {\n updateValue(nextRange);\n if (nextRange.start && nextRange.end) {\n setOpen(false);\n }\n }\n : undefined\n }\n />\n {presets?.length ? (\n <div className=\"mt-3 flex flex-wrap gap-2\">\n {presets.map((preset) => (\n <button\n key={preset.label}\n type=\"button\"\n className=\"rounded-full border border-input px-3 py-1 text-xs text-muted-foreground transition-colors hover:border-ring hover:text-heading\"\n onClick={() => handlePresetClick(preset.value)}\n >\n {preset.label}\n </button>\n ))}\n </div>\n ) : null}\n </div>\n )}\n </div>\n {helperText && (\n <p className=\"text-xs text-muted-foreground\">{helperText}</p>\n )}\n </div>\n );\n};\n"],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"dialog-C6nxSfIl.mjs","names":[],"sources":["../../src/components/overlays/dialog/Dialog.tsx"],"sourcesContent":["import { useEffect, useRef, type ReactElement } from \"react\";\nimport {\n motion,\n AnimatePresence,\n type TargetAndTransition,\n} from \"framer-motion\";\nimport {\n AlertCircleIcon,\n AlertTriangleIcon,\n CheckCircleIcon,\n CloseIcon,\n InfoCircleIcon,\n LoaderIcon,\n QuestionCircleIcon,\n} from \"../../icons\";\nimport type {\n DialogProps,\n DialogVariant,\n DialogAnimation,\n DialogPreset,\n} from \"./types\";\nexport type { DialogProps, DialogVariant, DialogAnimation, DialogPreset };\nimport { useOverlayEffects } from \"../../shared/overlay\";\n\n// Animation preset type\ninterface AnimationPreset {\n initial: TargetAndTransition;\n animate: TargetAndTransition;\n exit: TargetAndTransition;\n}\n\n// Animation presets for different entrance/exit effects\nconst animationVariants: Record<DialogAnimation, AnimationPreset> = {\n fade: {\n initial: { opacity: 0 },\n animate: { opacity: 1 },\n exit: { opacity: 0 },\n },\n scale: {\n initial: { opacity: 0, scale: 0.9, y: 20 },\n animate: { opacity: 1, scale: 1, y: 0 },\n exit: { opacity: 0, scale: 0.95, y: 10 },\n },\n slideUp: {\n initial: { opacity: 0, y: 100 },\n animate: { opacity: 1, y: 0 },\n exit: { opacity: 0, y: 50 },\n },\n slideDown: {\n initial: { opacity: 0, y: -100 },\n animate: { opacity: 1, y: 0 },\n exit: { opacity: 0, y: -50 },\n },\n slideLeft: {\n initial: { opacity: 0, x: 100 },\n animate: { opacity: 1, x: 0 },\n exit: { opacity: 0, x: 50 },\n },\n slideRight: {\n initial: { opacity: 0, x: -100 },\n animate: { opacity: 1, x: 0 },\n exit: { opacity: 0, x: -50 },\n },\n elastic: {\n initial: { opacity: 0, scale: 0.5, y: 50 },\n animate: { opacity: 1, scale: 1, y: 0 },\n exit: { opacity: 0, scale: 0.8, y: 20 },\n },\n bounce: {\n initial: { opacity: 0, scale: 0.3, y: -100 },\n animate: { opacity: 1, scale: 1, y: 0 },\n exit: { opacity: 0, scale: 0.5, y: -50 },\n },\n flip: {\n initial: { opacity: 0, rotateX: -90, scale: 0.9 },\n animate: { opacity: 1, rotateX: 0, scale: 1 },\n exit: { opacity: 0, rotateX: 90, scale: 0.9 },\n },\n zoom: {\n initial: { opacity: 0, scale: 0, rotate: -10 },\n animate: { opacity: 1, scale: 1, rotate: 0 },\n exit: { opacity: 0, scale: 0.5, rotate: 5 },\n },\n};\n\n// Transition configs for each animation type\nconst animationTransitions: Record<DialogAnimation, object> = {\n fade: { duration: 0.2 },\n scale: { type: \"spring\", damping: 25, stiffness: 300 },\n slideUp: { type: \"spring\", damping: 25, stiffness: 300 },\n slideDown: { type: \"spring\", damping: 25, stiffness: 300 },\n slideLeft: { type: \"spring\", damping: 25, stiffness: 300 },\n slideRight: { type: \"spring\", damping: 25, stiffness: 300 },\n elastic: { type: \"spring\", damping: 10, stiffness: 100 },\n bounce: { type: \"spring\", damping: 8, stiffness: 200, bounce: 0.5 },\n flip: { type: \"spring\", damping: 15, stiffness: 150 },\n zoom: { type: \"spring\", damping: 20, stiffness: 200 },\n};\n\n// Crystal glass panel base styling\nconst basePanel = `\n relative w-full max-w-lg rounded-2xl overflow-hidden\n border border-white/30 dark:border-white/10\n backdrop-blur-2xl backdrop-saturate-150\n bg-gradient-to-br from-white/80 via-white/70 to-white/60\n dark:from-neutral-900/90 dark:via-neutral-900/80 dark:to-neutral-800/70\n p-6\n shadow-[0_8px_32px_rgba(0,0,0,0.12),0_2px_8px_rgba(0,0,0,0.08)]\n dark:shadow-[0_8px_32px_rgba(0,0,0,0.5),0_2px_8px_rgba(0,0,0,0.3)]\n ring-1 ring-inset ring-white/20 dark:ring-white/5\n`;\n\n// Variant accent colors for icons and confirm buttons\nconst variantStyles: Record<\n DialogVariant,\n { icon: string; button: string; iconColor: string }\n> = {\n default: {\n icon: \"bg-primary-100 dark:bg-primary-900/30\",\n button: \"bg-primary hover:bg-primary-600 text-white\",\n iconColor: \"text-primary dark:text-primary-400\",\n },\n destructive: {\n icon: \"bg-red-100 dark:bg-red-900/30\",\n button: \"bg-red-500 hover:bg-red-600 text-white\",\n iconColor: \"text-red-500 dark:text-red-400\",\n },\n success: {\n icon: \"bg-green-100 dark:bg-green-900/30\",\n button: \"bg-green-500 hover:bg-green-600 text-white\",\n iconColor: \"text-green-500 dark:text-green-400\",\n },\n warning: {\n icon: \"bg-amber-100 dark:bg-amber-900/30\",\n button: \"bg-amber-500 hover:bg-amber-600 text-white\",\n iconColor: \"text-amber-500 dark:text-amber-400\",\n },\n info: {\n icon: \"bg-blue-100 dark:bg-blue-900/30\",\n button: \"bg-blue-500 hover:bg-blue-600 text-white\",\n iconColor: \"text-blue-500 dark:text-blue-400\",\n },\n};\n\n// Default icons per variant\nconst VariantIcon = ({ variant }: { variant: DialogVariant }): ReactElement => {\n const icons: Record<DialogVariant, ReactElement> = {\n default: <QuestionCircleIcon className=\"w-6 h-6\" aria-hidden=\"true\" />,\n destructive: <AlertTriangleIcon className=\"w-6 h-6\" aria-hidden=\"true\" />,\n success: <CheckCircleIcon className=\"w-6 h-6\" aria-hidden=\"true\" />,\n warning: <AlertCircleIcon className=\"w-6 h-6\" aria-hidden=\"true\" />,\n info: <InfoCircleIcon className=\"w-6 h-6\" aria-hidden=\"true\" />,\n };\n return icons[variant];\n};\n\n// Loading spinner\nconst Spinner = () => (\n <LoaderIcon className=\"animate-spin w-4 h-4\" aria-hidden=\"true\" />\n);\n\nexport const Dialog = ({\n open,\n onOpenChange,\n title,\n description,\n children,\n footer,\n closeOnOverlay = true,\n showClose = true,\n className = \"\",\n widthClassName = \"\",\n variant = \"default\",\n preset = \"custom\",\n confirmLabel = \"OK\",\n cancelLabel = \"Cancel\",\n onConfirm,\n onCancel,\n loading = false,\n icon,\n animation = \"scale\",\n}: DialogProps) => {\n const currentAnimation = animationVariants[animation];\n const currentTransition = animationTransitions[animation];\n const panelRef = useRef<HTMLDivElement | null>(null);\n useOverlayEffects(panelRef, open);\n\n useEffect(() => {\n if (!open || typeof window === \"undefined\") return;\n const handleKey = (event: KeyboardEvent) => {\n if (event.key === \"Escape\") {\n onOpenChange?.(false);\n }\n };\n window.addEventListener(\"keydown\", handleKey);\n return () => window.removeEventListener(\"keydown\", handleKey);\n }, [open, onOpenChange]);\n\n const handleOverlayClick = () => {\n if (closeOnOverlay) {\n onOpenChange?.(false);\n }\n };\n\n const handleCancel = () => {\n onCancel?.();\n onOpenChange?.(false);\n };\n\n const handleConfirm = () => {\n onConfirm?.();\n if (!loading) {\n onOpenChange?.(false);\n }\n };\n\n const styles = variantStyles[variant];\n const showPresetButtons = preset !== \"custom\" && !footer;\n const showCancelButton = preset === \"confirm\";\n\n // Render preset buttons\n const renderFooter = () => {\n if (footer) return footer;\n if (!showPresetButtons) return null;\n\n return (\n <div className=\"flex gap-3 justify-end w-full\">\n {showCancelButton && (\n <button\n type=\"button\"\n onClick={handleCancel}\n disabled={loading}\n className=\"inline-flex items-center justify-center gap-2 cursor-pointer\n py-2.5 px-4 text-sm font-semibold leading-none\n rounded-lg transition-all duration-200\n bg-neutral-200 dark:bg-neutral-700\n border border-neutral-300 dark:border-neutral-600\n text-neutral-800 dark:text-white\n shadow-sm hover:bg-neutral-300 dark:hover:bg-neutral-600\n active:scale-95 hover:opacity-90\n disabled:opacity-50 disabled:cursor-not-allowed\"\n >\n {cancelLabel}\n </button>\n )}\n <button\n type=\"button\"\n onClick={handleConfirm}\n disabled={loading}\n className={`inline-flex items-center justify-center gap-2 cursor-pointer\n py-2.5 px-4 text-sm font-semibold leading-none\n rounded-lg transition-all duration-200\n shadow-md hover:shadow-lg\n active:scale-95 hover:opacity-90\n disabled:opacity-50 disabled:cursor-not-allowed ${styles.button}`}\n >\n {loading && <Spinner />}\n {confirmLabel}\n </button>\n </div>\n );\n };\n\n return (\n <AnimatePresence>\n {open && (\n <div\n className=\"fixed inset-0 z-50 flex items-center justify-center px-4 overlay-backdrop\"\n role=\"presentation\"\n >\n {/* Backdrop with blur */}\n <motion.div\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n transition={{ duration: 0.2 }}\n className=\"fixed inset-0 bg-black/30 backdrop-blur-sm\"\n onClick={handleOverlayClick}\n />\n\n {/* Crystal panel */}\n <motion.div\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label={title}\n className={`${basePanel} overlay-panel ${className} ${widthClassName}`.trim()}\n tabIndex={-1}\n ref={panelRef}\n onClick={(event) => event.stopPropagation()}\n initial={currentAnimation.initial}\n animate={currentAnimation.animate}\n exit={currentAnimation.exit}\n transition={currentTransition}\n >\n {/* Subtle gradient overlay for crystal effect */}\n <div className=\"absolute inset-0 bg-gradient-to-tr from-white/10 via-transparent to-white/5 dark:from-white/5 dark:to-transparent pointer-events-none rounded-2xl\" />\n\n {/* Close button */}\n {showClose && (\n <button\n type=\"button\"\n className=\"absolute right-4 top-4 w-8 h-8 flex items-center justify-center\n rounded-full transition-all duration-200\n text-neutral-400 dark:text-neutral-500\n hover:text-neutral-600 dark:hover:text-neutral-300\n hover:bg-neutral-100/50 dark:hover:bg-white/10\"\n aria-label=\"Close dialog\"\n onClick={() => onOpenChange?.(false)}\n >\n <CloseIcon className=\"w-4 h-4\" aria-hidden=\"true\" />\n </button>\n )}\n\n {/* Content */}\n <div className=\"relative flex gap-4\">\n {/* Icon */}\n {preset !== \"custom\" && (\n <div\n className={`flex-shrink-0 w-10 h-10 rounded-full flex items-center justify-center ${styles.icon}`}\n >\n <span className={styles.iconColor}>\n {icon || <VariantIcon variant={variant} />}\n </span>\n </div>\n )}\n\n {/* Text content */}\n <div className=\"flex-1 min-w-0\">\n {title && (\n <h2 className=\"text-lg font-semibold text-neutral-900 dark:text-white pr-8\">\n {title}\n </h2>\n )}\n {description && (\n <p className=\"mt-1 text-sm text-neutral-600 dark:text-neutral-400 leading-relaxed\">\n {description}\n </p>\n )}\n </div>\n </div>\n\n {/* Children content */}\n {children && (\n <div className=\"mt-4 space-y-4 relative\">{children}</div>\n )}\n\n {/* Footer */}\n {(footer || showPresetButtons) && (\n <footer className=\"mt-6 flex justify-end gap-3 relative\">\n {renderFooter()}\n </footer>\n )}\n </motion.div>\n </div>\n )}\n </AnimatePresence>\n );\n};\n"],"mappings":";;;;;;AAgCA,IAAM,oBAA8D;CAClE,MAAM;EACJ,SAAS,EAAE,SAAS,GAAG;EACvB,SAAS,EAAE,SAAS,GAAG;EACvB,MAAM,EAAE,SAAS,GAAG;EACrB;CACD,OAAO;EACL,SAAS;GAAE,SAAS;GAAG,OAAO;GAAK,GAAG;GAAI;EAC1C,SAAS;GAAE,SAAS;GAAG,OAAO;GAAG,GAAG;GAAG;EACvC,MAAM;GAAE,SAAS;GAAG,OAAO;GAAM,GAAG;GAAI;EACzC;CACD,SAAS;EACP,SAAS;GAAE,SAAS;GAAG,GAAG;GAAK;EAC/B,SAAS;GAAE,SAAS;GAAG,GAAG;GAAG;EAC7B,MAAM;GAAE,SAAS;GAAG,GAAG;GAAI;EAC5B;CACD,WAAW;EACT,SAAS;GAAE,SAAS;GAAG,GAAG;GAAM;EAChC,SAAS;GAAE,SAAS;GAAG,GAAG;GAAG;EAC7B,MAAM;GAAE,SAAS;GAAG,GAAG;GAAK;EAC7B;CACD,WAAW;EACT,SAAS;GAAE,SAAS;GAAG,GAAG;GAAK;EAC/B,SAAS;GAAE,SAAS;GAAG,GAAG;GAAG;EAC7B,MAAM;GAAE,SAAS;GAAG,GAAG;GAAI;EAC5B;CACD,YAAY;EACV,SAAS;GAAE,SAAS;GAAG,GAAG;GAAM;EAChC,SAAS;GAAE,SAAS;GAAG,GAAG;GAAG;EAC7B,MAAM;GAAE,SAAS;GAAG,GAAG;GAAK;EAC7B;CACD,SAAS;EACP,SAAS;GAAE,SAAS;GAAG,OAAO;GAAK,GAAG;GAAI;EAC1C,SAAS;GAAE,SAAS;GAAG,OAAO;GAAG,GAAG;GAAG;EACvC,MAAM;GAAE,SAAS;GAAG,OAAO;GAAK,GAAG;GAAI;EACxC;CACD,QAAQ;EACN,SAAS;GAAE,SAAS;GAAG,OAAO;GAAK,GAAG;GAAM;EAC5C,SAAS;GAAE,SAAS;GAAG,OAAO;GAAG,GAAG;GAAG;EACvC,MAAM;GAAE,SAAS;GAAG,OAAO;GAAK,GAAG;GAAK;EACzC;CACD,MAAM;EACJ,SAAS;GAAE,SAAS;GAAG,SAAS;GAAK,OAAO;GAAK;EACjD,SAAS;GAAE,SAAS;GAAG,SAAS;GAAG,OAAO;GAAG;EAC7C,MAAM;GAAE,SAAS;GAAG,SAAS;GAAI,OAAO;GAAK;EAC9C;CACD,MAAM;EACJ,SAAS;GAAE,SAAS;GAAG,OAAO;GAAG,QAAQ;GAAK;EAC9C,SAAS;GAAE,SAAS;GAAG,OAAO;GAAG,QAAQ;GAAG;EAC5C,MAAM;GAAE,SAAS;GAAG,OAAO;GAAK,QAAQ;GAAG;EAC5C;CACF;AAGD,IAAM,uBAAwD;CAC5D,MAAM,EAAE,UAAU,IAAK;CACvB,OAAO;EAAE,MAAM;EAAU,SAAS;EAAI,WAAW;EAAK;CACtD,SAAS;EAAE,MAAM;EAAU,SAAS;EAAI,WAAW;EAAK;CACxD,WAAW;EAAE,MAAM;EAAU,SAAS;EAAI,WAAW;EAAK;CAC1D,WAAW;EAAE,MAAM;EAAU,SAAS;EAAI,WAAW;EAAK;CAC1D,YAAY;EAAE,MAAM;EAAU,SAAS;EAAI,WAAW;EAAK;CAC3D,SAAS;EAAE,MAAM;EAAU,SAAS;EAAI,WAAW;EAAK;CACxD,QAAQ;EAAE,MAAM;EAAU,SAAS;EAAG,WAAW;EAAK,QAAQ;EAAK;CACnE,MAAM;EAAE,MAAM;EAAU,SAAS;EAAI,WAAW;EAAK;CACrD,MAAM;EAAE,MAAM;EAAU,SAAS;EAAI,WAAW;EAAK;CACtD;AAGD,IAAM,YAAY;;;;;;;;;;;AAalB,IAAM,gBAGF;CACF,SAAS;EACP,MAAM;EACN,QAAQ;EACR,WAAW;EACZ;CACD,aAAa;EACX,MAAM;EACN,QAAQ;EACR,WAAW;EACZ;CACD,SAAS;EACP,MAAM;EACN,QAAQ;EACR,WAAW;EACZ;CACD,SAAS;EACP,MAAM;EACN,QAAQ;EACR,WAAW;EACZ;CACD,MAAM;EACJ,MAAM;EACN,QAAQ;EACR,WAAW;EACZ;CACF;AAGD,IAAM,eAAe,EAAE,cAAwD;AAQ7E,QAPmD;EACjD,SAAS,oBAAC,oBAAD;GAAoB,WAAU;GAAU,eAAY;GAAS,CAAA;EACtE,aAAa,oBAAC,mBAAD;GAAmB,WAAU;GAAU,eAAY;GAAS,CAAA;EACzE,SAAS,oBAAC,iBAAD;GAAiB,WAAU;GAAU,eAAY;GAAS,CAAA;EACnE,SAAS,oBAAC,iBAAD;GAAiB,WAAU;GAAU,eAAY;GAAS,CAAA;EACnE,MAAM,oBAAC,gBAAD;GAAgB,WAAU;GAAU,eAAY;GAAS,CAAA;EAChE,CACY;;AAIf,IAAM,gBACJ,oBAAC,YAAD;CAAY,WAAU;CAAuB,eAAY;CAAS,CAAA;AAGpE,IAAa,UAAU,EACrB,MACA,cACA,OACA,aACA,UACA,QACA,iBAAiB,MACjB,YAAY,MACZ,YAAY,IACZ,iBAAiB,IACjB,UAAU,WACV,SAAS,UACT,eAAe,MACf,cAAc,UACd,WACA,UACA,UAAU,OACV,MACA,YAAY,cACK;CACjB,MAAM,mBAAmB,kBAAkB;CAC3C,MAAM,oBAAoB,qBAAqB;CAC/C,MAAM,WAAW,OAA8B,KAAK;AACpD,mBAAkB,UAAU,KAAK;AAEjC,iBAAgB;AACd,MAAI,CAAC,QAAQ,OAAO,WAAW,YAAa;EAC5C,MAAM,aAAa,UAAyB;AAC1C,OAAI,MAAM,QAAQ,SAChB,gBAAe,MAAM;;AAGzB,SAAO,iBAAiB,WAAW,UAAU;AAC7C,eAAa,OAAO,oBAAoB,WAAW,UAAU;IAC5D,CAAC,MAAM,aAAa,CAAC;CAExB,MAAM,2BAA2B;AAC/B,MAAI,eACF,gBAAe,MAAM;;CAIzB,MAAM,qBAAqB;AACzB,cAAY;AACZ,iBAAe,MAAM;;CAGvB,MAAM,sBAAsB;AAC1B,eAAa;AACb,MAAI,CAAC,QACH,gBAAe,MAAM;;CAIzB,MAAM,SAAS,cAAc;CAC7B,MAAM,oBAAoB,WAAW,YAAY,CAAC;CAClD,MAAM,mBAAmB,WAAW;CAGpC,MAAM,qBAAqB;AACzB,MAAI,OAAQ,QAAO;AACnB,MAAI,CAAC,kBAAmB,QAAO;AAE/B,SACE,qBAAC,OAAD;GAAK,WAAU;aAAf,CACG,oBACC,oBAAC,UAAD;IACE,MAAK;IACL,SAAS;IACT,UAAU;IACV,WAAU;cAUT;IACM,CAAA,EAEX,qBAAC,UAAD;IACE,MAAK;IACL,SAAS;IACT,UAAU;IACV,WAAW;;;;;8DAKyC,OAAO;cAT7D,CAWG,WAAW,oBAAC,SAAD,EAAW,CAAA,EACtB,aACM;MACL;;;AAIV,QACE,oBAAC,iBAAD,EAAA,UACG,QACC,qBAAC,OAAD;EACE,WAAU;EACV,MAAK;YAFP,CAKE,oBAAC,OAAO,KAAR;GACE,SAAS,EAAE,SAAS,GAAG;GACvB,SAAS,EAAE,SAAS,GAAG;GACvB,MAAM,EAAE,SAAS,GAAG;GACpB,YAAY,EAAE,UAAU,IAAK;GAC7B,WAAU;GACV,SAAS;GACT,CAAA,EAGF,qBAAC,OAAO,KAAR;GACE,MAAK;GACL,cAAW;GACX,cAAY;GACZ,WAAW,GAAG,UAAU,iBAAiB,UAAU,GAAG,iBAAiB,MAAM;GAC7E,UAAU;GACV,KAAK;GACL,UAAU,UAAU,MAAM,iBAAiB;GAC3C,SAAS,iBAAiB;GAC1B,SAAS,iBAAiB;GAC1B,MAAM,iBAAiB;GACvB,YAAY;aAXd;IAcE,oBAAC,OAAD,EAAK,WAAU,qJAAsJ,CAAA;IAGpK,aACC,oBAAC,UAAD;KACE,MAAK;KACL,WAAU;KAKV,cAAW;KACX,eAAe,eAAe,MAAM;eAEpC,oBAAC,WAAD;MAAW,WAAU;MAAU,eAAY;MAAS,CAAA;KAC7C,CAAA;IAIX,qBAAC,OAAD;KAAK,WAAU;eAAf,CAEG,WAAW,YACV,oBAAC,OAAD;MACE,WAAW,yEAAyE,OAAO;gBAE3F,oBAAC,QAAD;OAAM,WAAW,OAAO;iBACrB,QAAQ,oBAAC,aAAD,EAAsB,SAAW,CAAA;OACrC,CAAA;MACH,CAAA,EAIR,qBAAC,OAAD;MAAK,WAAU;gBAAf,CACG,SACC,oBAAC,MAAD;OAAI,WAAU;iBACX;OACE,CAAA,EAEN,eACC,oBAAC,KAAD;OAAG,WAAU;iBACV;OACC,CAAA,CAEF;QACF;;IAGL,YACC,oBAAC,OAAD;KAAK,WAAU;KAA2B;KAAe,CAAA;KAIzD,UAAU,sBACV,oBAAC,UAAD;KAAQ,WAAU;eACf,cAAc;KACR,CAAA;IAEA;KACT;KAEQ,CAAA"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"dialog-Cbuf8V0g.cjs","names":[],"sources":["../../src/components/overlays/dialog/Dialog.tsx"],"sourcesContent":["import { useEffect, useRef, type ReactElement } from \"react\";\nimport {\n motion,\n AnimatePresence,\n type TargetAndTransition,\n} from \"framer-motion\";\nimport {\n AlertCircleIcon,\n AlertTriangleIcon,\n CheckCircleIcon,\n CloseIcon,\n InfoCircleIcon,\n LoaderIcon,\n QuestionCircleIcon,\n} from \"../../icons\";\nimport type {\n DialogProps,\n DialogVariant,\n DialogAnimation,\n DialogPreset,\n} from \"./types\";\nexport type { DialogProps, DialogVariant, DialogAnimation, DialogPreset };\nimport { useOverlayEffects } from \"../../shared/overlay\";\n\n// Animation preset type\ninterface AnimationPreset {\n initial: TargetAndTransition;\n animate: TargetAndTransition;\n exit: TargetAndTransition;\n}\n\n// Animation presets for different entrance/exit effects\nconst animationVariants: Record<DialogAnimation, AnimationPreset> = {\n fade: {\n initial: { opacity: 0 },\n animate: { opacity: 1 },\n exit: { opacity: 0 },\n },\n scale: {\n initial: { opacity: 0, scale: 0.9, y: 20 },\n animate: { opacity: 1, scale: 1, y: 0 },\n exit: { opacity: 0, scale: 0.95, y: 10 },\n },\n slideUp: {\n initial: { opacity: 0, y: 100 },\n animate: { opacity: 1, y: 0 },\n exit: { opacity: 0, y: 50 },\n },\n slideDown: {\n initial: { opacity: 0, y: -100 },\n animate: { opacity: 1, y: 0 },\n exit: { opacity: 0, y: -50 },\n },\n slideLeft: {\n initial: { opacity: 0, x: 100 },\n animate: { opacity: 1, x: 0 },\n exit: { opacity: 0, x: 50 },\n },\n slideRight: {\n initial: { opacity: 0, x: -100 },\n animate: { opacity: 1, x: 0 },\n exit: { opacity: 0, x: -50 },\n },\n elastic: {\n initial: { opacity: 0, scale: 0.5, y: 50 },\n animate: { opacity: 1, scale: 1, y: 0 },\n exit: { opacity: 0, scale: 0.8, y: 20 },\n },\n bounce: {\n initial: { opacity: 0, scale: 0.3, y: -100 },\n animate: { opacity: 1, scale: 1, y: 0 },\n exit: { opacity: 0, scale: 0.5, y: -50 },\n },\n flip: {\n initial: { opacity: 0, rotateX: -90, scale: 0.9 },\n animate: { opacity: 1, rotateX: 0, scale: 1 },\n exit: { opacity: 0, rotateX: 90, scale: 0.9 },\n },\n zoom: {\n initial: { opacity: 0, scale: 0, rotate: -10 },\n animate: { opacity: 1, scale: 1, rotate: 0 },\n exit: { opacity: 0, scale: 0.5, rotate: 5 },\n },\n};\n\n// Transition configs for each animation type\nconst animationTransitions: Record<DialogAnimation, object> = {\n fade: { duration: 0.2 },\n scale: { type: \"spring\", damping: 25, stiffness: 300 },\n slideUp: { type: \"spring\", damping: 25, stiffness: 300 },\n slideDown: { type: \"spring\", damping: 25, stiffness: 300 },\n slideLeft: { type: \"spring\", damping: 25, stiffness: 300 },\n slideRight: { type: \"spring\", damping: 25, stiffness: 300 },\n elastic: { type: \"spring\", damping: 10, stiffness: 100 },\n bounce: { type: \"spring\", damping: 8, stiffness: 200, bounce: 0.5 },\n flip: { type: \"spring\", damping: 15, stiffness: 150 },\n zoom: { type: \"spring\", damping: 20, stiffness: 200 },\n};\n\n// Crystal glass panel base styling\nconst basePanel = `\n relative w-full max-w-lg rounded-2xl overflow-hidden\n border border-white/30 dark:border-white/10\n backdrop-blur-2xl backdrop-saturate-150\n bg-gradient-to-br from-white/80 via-white/70 to-white/60\n dark:from-neutral-900/90 dark:via-neutral-900/80 dark:to-neutral-800/70\n p-6\n shadow-[0_8px_32px_rgba(0,0,0,0.12),0_2px_8px_rgba(0,0,0,0.08)]\n dark:shadow-[0_8px_32px_rgba(0,0,0,0.5),0_2px_8px_rgba(0,0,0,0.3)]\n ring-1 ring-inset ring-white/20 dark:ring-white/5\n`;\n\n// Variant accent colors for icons and confirm buttons\nconst variantStyles: Record<\n DialogVariant,\n { icon: string; button: string; iconColor: string }\n> = {\n default: {\n icon: \"bg-primary-100 dark:bg-primary-900/30\",\n button: \"bg-primary hover:bg-primary-600 text-white\",\n iconColor: \"text-primary dark:text-primary-400\",\n },\n destructive: {\n icon: \"bg-red-100 dark:bg-red-900/30\",\n button: \"bg-red-500 hover:bg-red-600 text-white\",\n iconColor: \"text-red-500 dark:text-red-400\",\n },\n success: {\n icon: \"bg-green-100 dark:bg-green-900/30\",\n button: \"bg-green-500 hover:bg-green-600 text-white\",\n iconColor: \"text-green-500 dark:text-green-400\",\n },\n warning: {\n icon: \"bg-amber-100 dark:bg-amber-900/30\",\n button: \"bg-amber-500 hover:bg-amber-600 text-white\",\n iconColor: \"text-amber-500 dark:text-amber-400\",\n },\n info: {\n icon: \"bg-blue-100 dark:bg-blue-900/30\",\n button: \"bg-blue-500 hover:bg-blue-600 text-white\",\n iconColor: \"text-blue-500 dark:text-blue-400\",\n },\n};\n\n// Default icons per variant\nconst VariantIcon = ({ variant }: { variant: DialogVariant }): ReactElement => {\n const icons: Record<DialogVariant, ReactElement> = {\n default: <QuestionCircleIcon className=\"w-6 h-6\" aria-hidden=\"true\" />,\n destructive: <AlertTriangleIcon className=\"w-6 h-6\" aria-hidden=\"true\" />,\n success: <CheckCircleIcon className=\"w-6 h-6\" aria-hidden=\"true\" />,\n warning: <AlertCircleIcon className=\"w-6 h-6\" aria-hidden=\"true\" />,\n info: <InfoCircleIcon className=\"w-6 h-6\" aria-hidden=\"true\" />,\n };\n return icons[variant];\n};\n\n// Loading spinner\nconst Spinner = () => (\n <LoaderIcon className=\"animate-spin w-4 h-4\" aria-hidden=\"true\" />\n);\n\nexport const Dialog = ({\n open,\n onOpenChange,\n title,\n description,\n children,\n footer,\n closeOnOverlay = true,\n showClose = true,\n className = \"\",\n widthClassName = \"\",\n variant = \"default\",\n preset = \"custom\",\n confirmLabel = \"OK\",\n cancelLabel = \"Cancel\",\n onConfirm,\n onCancel,\n loading = false,\n icon,\n animation = \"scale\",\n}: DialogProps) => {\n const currentAnimation = animationVariants[animation];\n const currentTransition = animationTransitions[animation];\n const panelRef = useRef<HTMLDivElement | null>(null);\n useOverlayEffects(panelRef, open);\n\n useEffect(() => {\n if (!open || typeof window === \"undefined\") return;\n const handleKey = (event: KeyboardEvent) => {\n if (event.key === \"Escape\") {\n onOpenChange?.(false);\n }\n };\n window.addEventListener(\"keydown\", handleKey);\n return () => window.removeEventListener(\"keydown\", handleKey);\n }, [open, onOpenChange]);\n\n const handleOverlayClick = () => {\n if (closeOnOverlay) {\n onOpenChange?.(false);\n }\n };\n\n const handleCancel = () => {\n onCancel?.();\n onOpenChange?.(false);\n };\n\n const handleConfirm = () => {\n onConfirm?.();\n if (!loading) {\n onOpenChange?.(false);\n }\n };\n\n const styles = variantStyles[variant];\n const showPresetButtons = preset !== \"custom\" && !footer;\n const showCancelButton = preset === \"confirm\";\n\n // Render preset buttons\n const renderFooter = () => {\n if (footer) return footer;\n if (!showPresetButtons) return null;\n\n return (\n <div className=\"flex gap-3 justify-end w-full\">\n {showCancelButton && (\n <button\n type=\"button\"\n onClick={handleCancel}\n disabled={loading}\n className=\"inline-flex items-center justify-center gap-2 cursor-pointer\n py-2.5 px-4 text-sm font-semibold leading-none\n rounded-lg transition-all duration-200\n bg-neutral-200 dark:bg-neutral-700\n border border-neutral-300 dark:border-neutral-600\n text-neutral-800 dark:text-white\n shadow-sm hover:bg-neutral-300 dark:hover:bg-neutral-600\n active:scale-95 hover:opacity-90\n disabled:opacity-50 disabled:cursor-not-allowed\"\n >\n {cancelLabel}\n </button>\n )}\n <button\n type=\"button\"\n onClick={handleConfirm}\n disabled={loading}\n className={`inline-flex items-center justify-center gap-2 cursor-pointer\n py-2.5 px-4 text-sm font-semibold leading-none\n rounded-lg transition-all duration-200\n shadow-md hover:shadow-lg\n active:scale-95 hover:opacity-90\n disabled:opacity-50 disabled:cursor-not-allowed ${styles.button}`}\n >\n {loading && <Spinner />}\n {confirmLabel}\n </button>\n </div>\n );\n };\n\n return (\n <AnimatePresence>\n {open && (\n <div\n className=\"fixed inset-0 z-50 flex items-center justify-center px-4 overlay-backdrop\"\n role=\"presentation\"\n >\n {/* Backdrop with blur */}\n <motion.div\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n transition={{ duration: 0.2 }}\n className=\"fixed inset-0 bg-black/30 backdrop-blur-sm\"\n onClick={handleOverlayClick}\n />\n\n {/* Crystal panel */}\n <motion.div\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label={title}\n className={`${basePanel} overlay-panel ${className} ${widthClassName}`.trim()}\n tabIndex={-1}\n ref={panelRef}\n onClick={(event) => event.stopPropagation()}\n initial={currentAnimation.initial}\n animate={currentAnimation.animate}\n exit={currentAnimation.exit}\n transition={currentTransition}\n >\n {/* Subtle gradient overlay for crystal effect */}\n <div className=\"absolute inset-0 bg-gradient-to-tr from-white/10 via-transparent to-white/5 dark:from-white/5 dark:to-transparent pointer-events-none rounded-2xl\" />\n\n {/* Close button */}\n {showClose && (\n <button\n type=\"button\"\n className=\"absolute right-4 top-4 w-8 h-8 flex items-center justify-center\n rounded-full transition-all duration-200\n text-neutral-400 dark:text-neutral-500\n hover:text-neutral-600 dark:hover:text-neutral-300\n hover:bg-neutral-100/50 dark:hover:bg-white/10\"\n aria-label=\"Close dialog\"\n onClick={() => onOpenChange?.(false)}\n >\n <CloseIcon className=\"w-4 h-4\" aria-hidden=\"true\" />\n </button>\n )}\n\n {/* Content */}\n <div className=\"relative flex gap-4\">\n {/* Icon */}\n {preset !== \"custom\" && (\n <div\n className={`flex-shrink-0 w-10 h-10 rounded-full flex items-center justify-center ${styles.icon}`}\n >\n <span className={styles.iconColor}>\n {icon || <VariantIcon variant={variant} />}\n </span>\n </div>\n )}\n\n {/* Text content */}\n <div className=\"flex-1 min-w-0\">\n {title && (\n <h2 className=\"text-lg font-semibold text-neutral-900 dark:text-white pr-8\">\n {title}\n </h2>\n )}\n {description && (\n <p className=\"mt-1 text-sm text-neutral-600 dark:text-neutral-400 leading-relaxed\">\n {description}\n </p>\n )}\n </div>\n </div>\n\n {/* Children content */}\n {children && (\n <div className=\"mt-4 space-y-4 relative\">{children}</div>\n )}\n\n {/* Footer */}\n {(footer || showPresetButtons) && (\n <footer className=\"mt-6 flex justify-end gap-3 relative\">\n {renderFooter()}\n </footer>\n )}\n </motion.div>\n </div>\n )}\n </AnimatePresence>\n );\n};\n"],"mappings":";;;;;;;AAgCA,IAAM,oBAA8D;CAClE,MAAM;EACJ,SAAS,EAAE,SAAS,GAAG;EACvB,SAAS,EAAE,SAAS,GAAG;EACvB,MAAM,EAAE,SAAS,GAAG;EACrB;CACD,OAAO;EACL,SAAS;GAAE,SAAS;GAAG,OAAO;GAAK,GAAG;GAAI;EAC1C,SAAS;GAAE,SAAS;GAAG,OAAO;GAAG,GAAG;GAAG;EACvC,MAAM;GAAE,SAAS;GAAG,OAAO;GAAM,GAAG;GAAI;EACzC;CACD,SAAS;EACP,SAAS;GAAE,SAAS;GAAG,GAAG;GAAK;EAC/B,SAAS;GAAE,SAAS;GAAG,GAAG;GAAG;EAC7B,MAAM;GAAE,SAAS;GAAG,GAAG;GAAI;EAC5B;CACD,WAAW;EACT,SAAS;GAAE,SAAS;GAAG,GAAG;GAAM;EAChC,SAAS;GAAE,SAAS;GAAG,GAAG;GAAG;EAC7B,MAAM;GAAE,SAAS;GAAG,GAAG;GAAK;EAC7B;CACD,WAAW;EACT,SAAS;GAAE,SAAS;GAAG,GAAG;GAAK;EAC/B,SAAS;GAAE,SAAS;GAAG,GAAG;GAAG;EAC7B,MAAM;GAAE,SAAS;GAAG,GAAG;GAAI;EAC5B;CACD,YAAY;EACV,SAAS;GAAE,SAAS;GAAG,GAAG;GAAM;EAChC,SAAS;GAAE,SAAS;GAAG,GAAG;GAAG;EAC7B,MAAM;GAAE,SAAS;GAAG,GAAG;GAAK;EAC7B;CACD,SAAS;EACP,SAAS;GAAE,SAAS;GAAG,OAAO;GAAK,GAAG;GAAI;EAC1C,SAAS;GAAE,SAAS;GAAG,OAAO;GAAG,GAAG;GAAG;EACvC,MAAM;GAAE,SAAS;GAAG,OAAO;GAAK,GAAG;GAAI;EACxC;CACD,QAAQ;EACN,SAAS;GAAE,SAAS;GAAG,OAAO;GAAK,GAAG;GAAM;EAC5C,SAAS;GAAE,SAAS;GAAG,OAAO;GAAG,GAAG;GAAG;EACvC,MAAM;GAAE,SAAS;GAAG,OAAO;GAAK,GAAG;GAAK;EACzC;CACD,MAAM;EACJ,SAAS;GAAE,SAAS;GAAG,SAAS;GAAK,OAAO;GAAK;EACjD,SAAS;GAAE,SAAS;GAAG,SAAS;GAAG,OAAO;GAAG;EAC7C,MAAM;GAAE,SAAS;GAAG,SAAS;GAAI,OAAO;GAAK;EAC9C;CACD,MAAM;EACJ,SAAS;GAAE,SAAS;GAAG,OAAO;GAAG,QAAQ;GAAK;EAC9C,SAAS;GAAE,SAAS;GAAG,OAAO;GAAG,QAAQ;GAAG;EAC5C,MAAM;GAAE,SAAS;GAAG,OAAO;GAAK,QAAQ;GAAG;EAC5C;CACF;AAGD,IAAM,uBAAwD;CAC5D,MAAM,EAAE,UAAU,IAAK;CACvB,OAAO;EAAE,MAAM;EAAU,SAAS;EAAI,WAAW;EAAK;CACtD,SAAS;EAAE,MAAM;EAAU,SAAS;EAAI,WAAW;EAAK;CACxD,WAAW;EAAE,MAAM;EAAU,SAAS;EAAI,WAAW;EAAK;CAC1D,WAAW;EAAE,MAAM;EAAU,SAAS;EAAI,WAAW;EAAK;CAC1D,YAAY;EAAE,MAAM;EAAU,SAAS;EAAI,WAAW;EAAK;CAC3D,SAAS;EAAE,MAAM;EAAU,SAAS;EAAI,WAAW;EAAK;CACxD,QAAQ;EAAE,MAAM;EAAU,SAAS;EAAG,WAAW;EAAK,QAAQ;EAAK;CACnE,MAAM;EAAE,MAAM;EAAU,SAAS;EAAI,WAAW;EAAK;CACrD,MAAM;EAAE,MAAM;EAAU,SAAS;EAAI,WAAW;EAAK;CACtD;AAGD,IAAM,YAAY;;;;;;;;;;;AAalB,IAAM,gBAGF;CACF,SAAS;EACP,MAAM;EACN,QAAQ;EACR,WAAW;EACZ;CACD,aAAa;EACX,MAAM;EACN,QAAQ;EACR,WAAW;EACZ;CACD,SAAS;EACP,MAAM;EACN,QAAQ;EACR,WAAW;EACZ;CACD,SAAS;EACP,MAAM;EACN,QAAQ;EACR,WAAW;EACZ;CACD,MAAM;EACJ,MAAM;EACN,QAAQ;EACR,WAAW;EACZ;CACF;AAGD,IAAM,eAAe,EAAE,cAAwD;AAQ7E,QAPmD;EACjD,SAAS,iBAAA,GAAA,kBAAA,KAAC,cAAA,oBAAD;GAAoB,WAAU;GAAU,eAAY;GAAS,CAAA;EACtE,aAAa,iBAAA,GAAA,kBAAA,KAAC,cAAA,mBAAD;GAAmB,WAAU;GAAU,eAAY;GAAS,CAAA;EACzE,SAAS,iBAAA,GAAA,kBAAA,KAAC,cAAA,iBAAD;GAAiB,WAAU;GAAU,eAAY;GAAS,CAAA;EACnE,SAAS,iBAAA,GAAA,kBAAA,KAAC,cAAA,iBAAD;GAAiB,WAAU;GAAU,eAAY;GAAS,CAAA;EACnE,MAAM,iBAAA,GAAA,kBAAA,KAAC,cAAA,gBAAD;GAAgB,WAAU;GAAU,eAAY;GAAS,CAAA;EAChE,CACY;;AAIf,IAAM,gBACJ,iBAAA,GAAA,kBAAA,KAAC,cAAA,YAAD;CAAY,WAAU;CAAuB,eAAY;CAAS,CAAA;AAGpE,IAAa,UAAU,EACrB,MACA,cACA,OACA,aACA,UACA,QACA,iBAAiB,MACjB,YAAY,MACZ,YAAY,IACZ,iBAAiB,IACjB,UAAU,WACV,SAAS,UACT,eAAe,MACf,cAAc,UACd,WACA,UACA,UAAU,OACV,MACA,YAAY,cACK;CACjB,MAAM,mBAAmB,kBAAkB;CAC3C,MAAM,oBAAoB,qBAAqB;CAC/C,MAAM,YAAA,GAAA,MAAA,QAAyC,KAAK;AACpD,iBAAA,kBAAkB,UAAU,KAAK;AAEjC,EAAA,GAAA,MAAA,iBAAgB;AACd,MAAI,CAAC,QAAQ,OAAO,WAAW,YAAa;EAC5C,MAAM,aAAa,UAAyB;AAC1C,OAAI,MAAM,QAAQ,SAChB,gBAAe,MAAM;;AAGzB,SAAO,iBAAiB,WAAW,UAAU;AAC7C,eAAa,OAAO,oBAAoB,WAAW,UAAU;IAC5D,CAAC,MAAM,aAAa,CAAC;CAExB,MAAM,2BAA2B;AAC/B,MAAI,eACF,gBAAe,MAAM;;CAIzB,MAAM,qBAAqB;AACzB,cAAY;AACZ,iBAAe,MAAM;;CAGvB,MAAM,sBAAsB;AAC1B,eAAa;AACb,MAAI,CAAC,QACH,gBAAe,MAAM;;CAIzB,MAAM,SAAS,cAAc;CAC7B,MAAM,oBAAoB,WAAW,YAAY,CAAC;CAClD,MAAM,mBAAmB,WAAW;CAGpC,MAAM,qBAAqB;AACzB,MAAI,OAAQ,QAAO;AACnB,MAAI,CAAC,kBAAmB,QAAO;AAE/B,SACE,iBAAA,GAAA,kBAAA,MAAC,OAAD;GAAK,WAAU;aAAf,CACG,oBACC,iBAAA,GAAA,kBAAA,KAAC,UAAD;IACE,MAAK;IACL,SAAS;IACT,UAAU;IACV,WAAU;cAUT;IACM,CAAA,EAEX,iBAAA,GAAA,kBAAA,MAAC,UAAD;IACE,MAAK;IACL,SAAS;IACT,UAAU;IACV,WAAW;;;;;8DAKyC,OAAO;cAT7D,CAWG,WAAW,iBAAA,GAAA,kBAAA,KAAC,SAAD,EAAW,CAAA,EACtB,aACM;MACL;;;AAIV,QACE,iBAAA,GAAA,kBAAA,KAAC,cAAA,iBAAD,EAAA,UACG,QACC,iBAAA,GAAA,kBAAA,MAAC,OAAD;EACE,WAAU;EACV,MAAK;YAFP,CAKE,iBAAA,GAAA,kBAAA,KAAC,cAAA,OAAO,KAAR;GACE,SAAS,EAAE,SAAS,GAAG;GACvB,SAAS,EAAE,SAAS,GAAG;GACvB,MAAM,EAAE,SAAS,GAAG;GACpB,YAAY,EAAE,UAAU,IAAK;GAC7B,WAAU;GACV,SAAS;GACT,CAAA,EAGF,iBAAA,GAAA,kBAAA,MAAC,cAAA,OAAO,KAAR;GACE,MAAK;GACL,cAAW;GACX,cAAY;GACZ,WAAW,GAAG,UAAU,iBAAiB,UAAU,GAAG,iBAAiB,MAAM;GAC7E,UAAU;GACV,KAAK;GACL,UAAU,UAAU,MAAM,iBAAiB;GAC3C,SAAS,iBAAiB;GAC1B,SAAS,iBAAiB;GAC1B,MAAM,iBAAiB;GACvB,YAAY;aAXd;IAcE,iBAAA,GAAA,kBAAA,KAAC,OAAD,EAAK,WAAU,qJAAsJ,CAAA;IAGpK,aACC,iBAAA,GAAA,kBAAA,KAAC,UAAD;KACE,MAAK;KACL,WAAU;KAKV,cAAW;KACX,eAAe,eAAe,MAAM;eAEpC,iBAAA,GAAA,kBAAA,KAAC,cAAA,WAAD;MAAW,WAAU;MAAU,eAAY;MAAS,CAAA;KAC7C,CAAA;IAIX,iBAAA,GAAA,kBAAA,MAAC,OAAD;KAAK,WAAU;eAAf,CAEG,WAAW,YACV,iBAAA,GAAA,kBAAA,KAAC,OAAD;MACE,WAAW,yEAAyE,OAAO;gBAE3F,iBAAA,GAAA,kBAAA,KAAC,QAAD;OAAM,WAAW,OAAO;iBACrB,QAAQ,iBAAA,GAAA,kBAAA,KAAC,aAAD,EAAsB,SAAW,CAAA;OACrC,CAAA;MACH,CAAA,EAIR,iBAAA,GAAA,kBAAA,MAAC,OAAD;MAAK,WAAU;gBAAf,CACG,SACC,iBAAA,GAAA,kBAAA,KAAC,MAAD;OAAI,WAAU;iBACX;OACE,CAAA,EAEN,eACC,iBAAA,GAAA,kBAAA,KAAC,KAAD;OAAG,WAAU;iBACV;OACC,CAAA,CAEF;QACF;;IAGL,YACC,iBAAA,GAAA,kBAAA,KAAC,OAAD;KAAK,WAAU;KAA2B;KAAe,CAAA;KAIzD,UAAU,sBACV,iBAAA,GAAA,kBAAA,KAAC,UAAD;KAAQ,WAAU;eACf,cAAc;KACR,CAAA;IAEA;KACT;KAEQ,CAAA"}
|
|
@@ -1,105 +0,0 @@
|
|
|
1
|
-
import { t as useOverlayEffects } from "./overlay-CpdakhXI.mjs";
|
|
2
|
-
import { useEffect, useRef } from "react";
|
|
3
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
4
|
-
import { AnimatePresence, motion } from "framer-motion";
|
|
5
|
-
//#region src/components/overlays/drawer/Drawer.tsx
|
|
6
|
-
var basePanel = "relative flex flex-col backdrop-blur-xl bg-white/70 dark:bg-neutral-900/70 p-6 shadow-2xl border-white/20 dark:border-white/10 rounded-sm";
|
|
7
|
-
var positionClasses = {
|
|
8
|
-
right: "h-[calc(100%-8px)] my-1 mr-1 w-full max-w-md ml-auto border",
|
|
9
|
-
left: "h-[calc(100%-8px)] my-1 ml-1 w-full max-w-md mr-auto border",
|
|
10
|
-
top: "w-[calc(100%-8px)] mx-1 mt-1 max-h-[80vh] border",
|
|
11
|
-
bottom: "w-[calc(100%-8px)] mx-1 mb-1 max-h-[80vh] mt-auto border"
|
|
12
|
-
};
|
|
13
|
-
var getVariants = (position) => {
|
|
14
|
-
switch (position) {
|
|
15
|
-
case "left": return {
|
|
16
|
-
hidden: { x: "-100%" },
|
|
17
|
-
visible: { x: 0 }
|
|
18
|
-
};
|
|
19
|
-
case "right": return {
|
|
20
|
-
hidden: { x: "100%" },
|
|
21
|
-
visible: { x: 0 }
|
|
22
|
-
};
|
|
23
|
-
case "top": return {
|
|
24
|
-
hidden: { y: "-100%" },
|
|
25
|
-
visible: { y: 0 }
|
|
26
|
-
};
|
|
27
|
-
case "bottom": return {
|
|
28
|
-
hidden: { y: "100%" },
|
|
29
|
-
visible: { y: 0 }
|
|
30
|
-
};
|
|
31
|
-
}
|
|
32
|
-
};
|
|
33
|
-
var Drawer = ({ open, onOpenChange, title, description, position = "right", children, footer }) => {
|
|
34
|
-
const panelRef = useRef(null);
|
|
35
|
-
useOverlayEffects(panelRef, open);
|
|
36
|
-
useEffect(() => {
|
|
37
|
-
if (!open || typeof window === "undefined") return;
|
|
38
|
-
const handleKey = (event) => {
|
|
39
|
-
if (event.key === "Escape") onOpenChange?.(false);
|
|
40
|
-
};
|
|
41
|
-
window.addEventListener("keydown", handleKey);
|
|
42
|
-
return () => window.removeEventListener("keydown", handleKey);
|
|
43
|
-
}, [open, onOpenChange]);
|
|
44
|
-
const variants = getVariants(position);
|
|
45
|
-
return /* @__PURE__ */ jsx(AnimatePresence, { children: open && /* @__PURE__ */ jsxs("div", {
|
|
46
|
-
className: "fixed inset-0 z-40 flex overlay-backdrop",
|
|
47
|
-
role: "presentation",
|
|
48
|
-
children: [/* @__PURE__ */ jsx(motion.div, {
|
|
49
|
-
initial: { opacity: 0 },
|
|
50
|
-
animate: { opacity: 1 },
|
|
51
|
-
exit: { opacity: 0 },
|
|
52
|
-
transition: { duration: .3 },
|
|
53
|
-
className: "fixed inset-0 bg-black/40",
|
|
54
|
-
onClick: () => onOpenChange?.(false)
|
|
55
|
-
}), /* @__PURE__ */ jsxs(motion.div, {
|
|
56
|
-
role: "dialog",
|
|
57
|
-
"aria-modal": "true",
|
|
58
|
-
"aria-label": title,
|
|
59
|
-
className: `${basePanel} ${positionClasses[position]}`,
|
|
60
|
-
tabIndex: -1,
|
|
61
|
-
ref: panelRef,
|
|
62
|
-
onClick: (event) => event.stopPropagation(),
|
|
63
|
-
initial: "hidden",
|
|
64
|
-
animate: "visible",
|
|
65
|
-
exit: "hidden",
|
|
66
|
-
variants,
|
|
67
|
-
transition: {
|
|
68
|
-
type: "spring",
|
|
69
|
-
damping: 25,
|
|
70
|
-
stiffness: 200
|
|
71
|
-
},
|
|
72
|
-
children: [
|
|
73
|
-
/* @__PURE__ */ jsx("button", {
|
|
74
|
-
type: "button",
|
|
75
|
-
className: "absolute right-4 top-4 text-neutral-500 dark:text-neutral-400 transition-colors hover:text-neutral-900 dark:hover:text-white text-xl font-light",
|
|
76
|
-
"aria-label": "Close drawer",
|
|
77
|
-
onClick: () => onOpenChange?.(false),
|
|
78
|
-
children: "×"
|
|
79
|
-
}),
|
|
80
|
-
(title || description) && /* @__PURE__ */ jsxs("header", {
|
|
81
|
-
className: "space-y-1 pr-6",
|
|
82
|
-
children: [title && /* @__PURE__ */ jsx("h2", {
|
|
83
|
-
className: "text-lg font-semibold text-neutral-900 dark:text-white",
|
|
84
|
-
children: title
|
|
85
|
-
}), description && /* @__PURE__ */ jsx("p", {
|
|
86
|
-
className: "text-sm text-neutral-600 dark:text-neutral-400",
|
|
87
|
-
children: description
|
|
88
|
-
})]
|
|
89
|
-
}),
|
|
90
|
-
children && /* @__PURE__ */ jsx("div", {
|
|
91
|
-
className: "mt-4 flex-1 overflow-auto space-y-4",
|
|
92
|
-
children
|
|
93
|
-
}),
|
|
94
|
-
footer && /* @__PURE__ */ jsx("footer", {
|
|
95
|
-
className: "mt-6",
|
|
96
|
-
children: footer
|
|
97
|
-
})
|
|
98
|
-
]
|
|
99
|
-
})]
|
|
100
|
-
}) });
|
|
101
|
-
};
|
|
102
|
-
//#endregion
|
|
103
|
-
export { Drawer as t };
|
|
104
|
-
|
|
105
|
-
//# sourceMappingURL=drawer-DIuvgqTA.mjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"drawer-DIuvgqTA.mjs","names":[],"sources":["../../src/components/overlays/drawer/Drawer.tsx"],"sourcesContent":["import { useEffect, useRef } from \"react\";\nimport { motion, AnimatePresence } from \"framer-motion\";\nimport type { DrawerProps, DrawerPosition } from \"./types\";\nimport { useOverlayEffects } from \"../../shared/overlay\";\n\nconst basePanel =\n \"relative flex flex-col backdrop-blur-xl bg-white/70 dark:bg-neutral-900/70 p-6 shadow-2xl border-white/20 dark:border-white/10 rounded-sm\";\n\nconst positionClasses: Record<DrawerPosition, string> = {\n right: \"h-[calc(100%-8px)] my-1 mr-1 w-full max-w-md ml-auto border\",\n left: \"h-[calc(100%-8px)] my-1 ml-1 w-full max-w-md mr-auto border\",\n top: \"w-[calc(100%-8px)] mx-1 mt-1 max-h-[80vh] border\",\n bottom: \"w-[calc(100%-8px)] mx-1 mb-1 max-h-[80vh] mt-auto border\",\n};\n\nconst getVariants = (position: DrawerPosition) => {\n switch (position) {\n case \"left\":\n return { hidden: { x: \"-100%\" }, visible: { x: 0 } };\n case \"right\":\n return { hidden: { x: \"100%\" }, visible: { x: 0 } };\n case \"top\":\n return { hidden: { y: \"-100%\" }, visible: { y: 0 } };\n case \"bottom\":\n return { hidden: { y: \"100%\" }, visible: { y: 0 } };\n }\n};\n\nexport const Drawer = ({\n open,\n onOpenChange,\n title,\n description,\n position = \"right\",\n children,\n footer,\n}: DrawerProps) => {\n const panelRef = useRef<HTMLDivElement | null>(null);\n useOverlayEffects(panelRef, open);\n\n useEffect(() => {\n if (!open || typeof window === \"undefined\") return;\n const handleKey = (event: KeyboardEvent) => {\n if (event.key === \"Escape\") {\n onOpenChange?.(false);\n }\n };\n window.addEventListener(\"keydown\", handleKey);\n return () => window.removeEventListener(\"keydown\", handleKey);\n }, [open, onOpenChange]);\n\n const variants = getVariants(position);\n\n return (\n <AnimatePresence>\n {open && (\n <div\n className=\"fixed inset-0 z-40 flex overlay-backdrop\"\n role=\"presentation\"\n >\n <motion.div\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n transition={{ duration: 0.3 }}\n className=\"fixed inset-0 bg-black/40\"\n onClick={() => onOpenChange?.(false)}\n />\n <motion.div\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label={title}\n className={`${basePanel} ${positionClasses[position]}`}\n tabIndex={-1}\n ref={panelRef}\n onClick={(event) => event.stopPropagation()}\n initial=\"hidden\"\n animate=\"visible\"\n exit=\"hidden\"\n variants={variants}\n transition={{ type: \"spring\", damping: 25, stiffness: 200 }}\n >\n <button\n type=\"button\"\n className=\"absolute right-4 top-4 text-neutral-500 dark:text-neutral-400 transition-colors hover:text-neutral-900 dark:hover:text-white text-xl font-light\"\n aria-label=\"Close drawer\"\n onClick={() => onOpenChange?.(false)}\n >\n ×\n </button>\n {(title || description) && (\n <header className=\"space-y-1 pr-6\">\n {title && (\n <h2 className=\"text-lg font-semibold text-neutral-900 dark:text-white\">\n {title}\n </h2>\n )}\n {description && (\n <p className=\"text-sm text-neutral-600 dark:text-neutral-400\">\n {description}\n </p>\n )}\n </header>\n )}\n {children && (\n <div className=\"mt-4 flex-1 overflow-auto space-y-4\">\n {children}\n </div>\n )}\n {footer && <footer className=\"mt-6\">{footer}</footer>}\n </motion.div>\n </div>\n )}\n </AnimatePresence>\n );\n};\n"],"mappings":";;;;;AAKA,IAAM,YACJ;AAEF,IAAM,kBAAkD;CACtD,OAAO;CACP,MAAM;CACN,KAAK;CACL,QAAQ;CACT;AAED,IAAM,eAAe,aAA6B;AAChD,SAAQ,UAAR;EACE,KAAK,OACH,QAAO;GAAE,QAAQ,EAAE,GAAG,SAAS;GAAE,SAAS,EAAE,GAAG,GAAG;GAAE;EACtD,KAAK,QACH,QAAO;GAAE,QAAQ,EAAE,GAAG,QAAQ;GAAE,SAAS,EAAE,GAAG,GAAG;GAAE;EACrD,KAAK,MACH,QAAO;GAAE,QAAQ,EAAE,GAAG,SAAS;GAAE,SAAS,EAAE,GAAG,GAAG;GAAE;EACtD,KAAK,SACH,QAAO;GAAE,QAAQ,EAAE,GAAG,QAAQ;GAAE,SAAS,EAAE,GAAG,GAAG;GAAE;;;AAIzD,IAAa,UAAU,EACrB,MACA,cACA,OACA,aACA,WAAW,SACX,UACA,aACiB;CACjB,MAAM,WAAW,OAA8B,KAAK;AACpD,mBAAkB,UAAU,KAAK;AAEjC,iBAAgB;AACd,MAAI,CAAC,QAAQ,OAAO,WAAW,YAAa;EAC5C,MAAM,aAAa,UAAyB;AAC1C,OAAI,MAAM,QAAQ,SAChB,gBAAe,MAAM;;AAGzB,SAAO,iBAAiB,WAAW,UAAU;AAC7C,eAAa,OAAO,oBAAoB,WAAW,UAAU;IAC5D,CAAC,MAAM,aAAa,CAAC;CAExB,MAAM,WAAW,YAAY,SAAS;AAEtC,QACE,oBAAC,iBAAD,EAAA,UACG,QACC,qBAAC,OAAD;EACE,WAAU;EACV,MAAK;YAFP,CAIE,oBAAC,OAAO,KAAR;GACE,SAAS,EAAE,SAAS,GAAG;GACvB,SAAS,EAAE,SAAS,GAAG;GACvB,MAAM,EAAE,SAAS,GAAG;GACpB,YAAY,EAAE,UAAU,IAAK;GAC7B,WAAU;GACV,eAAe,eAAe,MAAM;GACpC,CAAA,EACF,qBAAC,OAAO,KAAR;GACE,MAAK;GACL,cAAW;GACX,cAAY;GACZ,WAAW,GAAG,UAAU,GAAG,gBAAgB;GAC3C,UAAU;GACV,KAAK;GACL,UAAU,UAAU,MAAM,iBAAiB;GAC3C,SAAQ;GACR,SAAQ;GACR,MAAK;GACK;GACV,YAAY;IAAE,MAAM;IAAU,SAAS;IAAI,WAAW;IAAK;aAZ7D;IAcE,oBAAC,UAAD;KACE,MAAK;KACL,WAAU;KACV,cAAW;KACX,eAAe,eAAe,MAAM;eACrC;KAEQ,CAAA;KACP,SAAS,gBACT,qBAAC,UAAD;KAAQ,WAAU;eAAlB,CACG,SACC,oBAAC,MAAD;MAAI,WAAU;gBACX;MACE,CAAA,EAEN,eACC,oBAAC,KAAD;MAAG,WAAU;gBACV;MACC,CAAA,CAEC;;IAEV,YACC,oBAAC,OAAD;KAAK,WAAU;KACZ;KACG,CAAA;IAEP,UAAU,oBAAC,UAAD;KAAQ,WAAU;eAAQ;KAAgB,CAAA;IAC1C;KACT;KAEQ,CAAA"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"drawer-Dn0u8Sck.cjs","names":[],"sources":["../../src/components/overlays/drawer/Drawer.tsx"],"sourcesContent":["import { useEffect, useRef } from \"react\";\nimport { motion, AnimatePresence } from \"framer-motion\";\nimport type { DrawerProps, DrawerPosition } from \"./types\";\nimport { useOverlayEffects } from \"../../shared/overlay\";\n\nconst basePanel =\n \"relative flex flex-col backdrop-blur-xl bg-white/70 dark:bg-neutral-900/70 p-6 shadow-2xl border-white/20 dark:border-white/10 rounded-sm\";\n\nconst positionClasses: Record<DrawerPosition, string> = {\n right: \"h-[calc(100%-8px)] my-1 mr-1 w-full max-w-md ml-auto border\",\n left: \"h-[calc(100%-8px)] my-1 ml-1 w-full max-w-md mr-auto border\",\n top: \"w-[calc(100%-8px)] mx-1 mt-1 max-h-[80vh] border\",\n bottom: \"w-[calc(100%-8px)] mx-1 mb-1 max-h-[80vh] mt-auto border\",\n};\n\nconst getVariants = (position: DrawerPosition) => {\n switch (position) {\n case \"left\":\n return { hidden: { x: \"-100%\" }, visible: { x: 0 } };\n case \"right\":\n return { hidden: { x: \"100%\" }, visible: { x: 0 } };\n case \"top\":\n return { hidden: { y: \"-100%\" }, visible: { y: 0 } };\n case \"bottom\":\n return { hidden: { y: \"100%\" }, visible: { y: 0 } };\n }\n};\n\nexport const Drawer = ({\n open,\n onOpenChange,\n title,\n description,\n position = \"right\",\n children,\n footer,\n}: DrawerProps) => {\n const panelRef = useRef<HTMLDivElement | null>(null);\n useOverlayEffects(panelRef, open);\n\n useEffect(() => {\n if (!open || typeof window === \"undefined\") return;\n const handleKey = (event: KeyboardEvent) => {\n if (event.key === \"Escape\") {\n onOpenChange?.(false);\n }\n };\n window.addEventListener(\"keydown\", handleKey);\n return () => window.removeEventListener(\"keydown\", handleKey);\n }, [open, onOpenChange]);\n\n const variants = getVariants(position);\n\n return (\n <AnimatePresence>\n {open && (\n <div\n className=\"fixed inset-0 z-40 flex overlay-backdrop\"\n role=\"presentation\"\n >\n <motion.div\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n transition={{ duration: 0.3 }}\n className=\"fixed inset-0 bg-black/40\"\n onClick={() => onOpenChange?.(false)}\n />\n <motion.div\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label={title}\n className={`${basePanel} ${positionClasses[position]}`}\n tabIndex={-1}\n ref={panelRef}\n onClick={(event) => event.stopPropagation()}\n initial=\"hidden\"\n animate=\"visible\"\n exit=\"hidden\"\n variants={variants}\n transition={{ type: \"spring\", damping: 25, stiffness: 200 }}\n >\n <button\n type=\"button\"\n className=\"absolute right-4 top-4 text-neutral-500 dark:text-neutral-400 transition-colors hover:text-neutral-900 dark:hover:text-white text-xl font-light\"\n aria-label=\"Close drawer\"\n onClick={() => onOpenChange?.(false)}\n >\n ×\n </button>\n {(title || description) && (\n <header className=\"space-y-1 pr-6\">\n {title && (\n <h2 className=\"text-lg font-semibold text-neutral-900 dark:text-white\">\n {title}\n </h2>\n )}\n {description && (\n <p className=\"text-sm text-neutral-600 dark:text-neutral-400\">\n {description}\n </p>\n )}\n </header>\n )}\n {children && (\n <div className=\"mt-4 flex-1 overflow-auto space-y-4\">\n {children}\n </div>\n )}\n {footer && <footer className=\"mt-6\">{footer}</footer>}\n </motion.div>\n </div>\n )}\n </AnimatePresence>\n );\n};\n"],"mappings":";;;;;;AAKA,IAAM,YACJ;AAEF,IAAM,kBAAkD;CACtD,OAAO;CACP,MAAM;CACN,KAAK;CACL,QAAQ;CACT;AAED,IAAM,eAAe,aAA6B;AAChD,SAAQ,UAAR;EACE,KAAK,OACH,QAAO;GAAE,QAAQ,EAAE,GAAG,SAAS;GAAE,SAAS,EAAE,GAAG,GAAG;GAAE;EACtD,KAAK,QACH,QAAO;GAAE,QAAQ,EAAE,GAAG,QAAQ;GAAE,SAAS,EAAE,GAAG,GAAG;GAAE;EACrD,KAAK,MACH,QAAO;GAAE,QAAQ,EAAE,GAAG,SAAS;GAAE,SAAS,EAAE,GAAG,GAAG;GAAE;EACtD,KAAK,SACH,QAAO;GAAE,QAAQ,EAAE,GAAG,QAAQ;GAAE,SAAS,EAAE,GAAG,GAAG;GAAE;;;AAIzD,IAAa,UAAU,EACrB,MACA,cACA,OACA,aACA,WAAW,SACX,UACA,aACiB;CACjB,MAAM,YAAA,GAAA,MAAA,QAAyC,KAAK;AACpD,iBAAA,kBAAkB,UAAU,KAAK;AAEjC,EAAA,GAAA,MAAA,iBAAgB;AACd,MAAI,CAAC,QAAQ,OAAO,WAAW,YAAa;EAC5C,MAAM,aAAa,UAAyB;AAC1C,OAAI,MAAM,QAAQ,SAChB,gBAAe,MAAM;;AAGzB,SAAO,iBAAiB,WAAW,UAAU;AAC7C,eAAa,OAAO,oBAAoB,WAAW,UAAU;IAC5D,CAAC,MAAM,aAAa,CAAC;CAExB,MAAM,WAAW,YAAY,SAAS;AAEtC,QACE,iBAAA,GAAA,kBAAA,KAAC,cAAA,iBAAD,EAAA,UACG,QACC,iBAAA,GAAA,kBAAA,MAAC,OAAD;EACE,WAAU;EACV,MAAK;YAFP,CAIE,iBAAA,GAAA,kBAAA,KAAC,cAAA,OAAO,KAAR;GACE,SAAS,EAAE,SAAS,GAAG;GACvB,SAAS,EAAE,SAAS,GAAG;GACvB,MAAM,EAAE,SAAS,GAAG;GACpB,YAAY,EAAE,UAAU,IAAK;GAC7B,WAAU;GACV,eAAe,eAAe,MAAM;GACpC,CAAA,EACF,iBAAA,GAAA,kBAAA,MAAC,cAAA,OAAO,KAAR;GACE,MAAK;GACL,cAAW;GACX,cAAY;GACZ,WAAW,GAAG,UAAU,GAAG,gBAAgB;GAC3C,UAAU;GACV,KAAK;GACL,UAAU,UAAU,MAAM,iBAAiB;GAC3C,SAAQ;GACR,SAAQ;GACR,MAAK;GACK;GACV,YAAY;IAAE,MAAM;IAAU,SAAS;IAAI,WAAW;IAAK;aAZ7D;IAcE,iBAAA,GAAA,kBAAA,KAAC,UAAD;KACE,MAAK;KACL,WAAU;KACV,cAAW;KACX,eAAe,eAAe,MAAM;eACrC;KAEQ,CAAA;KACP,SAAS,gBACT,iBAAA,GAAA,kBAAA,MAAC,UAAD;KAAQ,WAAU;eAAlB,CACG,SACC,iBAAA,GAAA,kBAAA,KAAC,MAAD;MAAI,WAAU;gBACX;MACE,CAAA,EAEN,eACC,iBAAA,GAAA,kBAAA,KAAC,KAAD;MAAG,WAAU;gBACV;MACC,CAAA,CAEC;;IAEV,YACC,iBAAA,GAAA,kBAAA,KAAC,OAAD;KAAK,WAAU;KACZ;KACG,CAAA;IAEP,UAAU,iBAAA,GAAA,kBAAA,KAAC,UAAD;KAAQ,WAAU;eAAQ;KAAgB,CAAA;IAC1C;KACT;KAEQ,CAAA"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"form-DcEuk721.cjs","names":[],"sources":["../../src/components/forms/form/Form.tsx"],"sourcesContent":["import { Children, cloneElement, isValidElement, useId } from \"react\";\nimport type { ReactElement } from \"react\";\n\nimport type {\n FormProps,\n FormSectionProps,\n FormFieldProps,\n FormActionsProps,\n InputGroupProps,\n FormDescriptionProps,\n FormMessageProps,\n} from \"./types\";\n\nconst cx = (...classes: Array<string | false | undefined>) =>\n classes.filter(Boolean).join(\" \").replace(/\\s+/g, \" \").trim();\n\nconst gapClassMap: Record<NonNullable<FormProps[\"gap\"]>, string> = {\n sm: \"space-y-4\",\n md: \"space-y-6\",\n lg: \"space-y-8\",\n};\n\nconst sectionColumnsMap: Record<\n NonNullable<FormSectionProps[\"columns\"]>,\n string\n> = {\n 1: \"space-y-4\",\n 2: \"grid grid-cols-2 gap-4\",\n 3: \"grid grid-cols-3 gap-4\",\n};\n\nconst inputGroupMap: Record<NonNullable<InputGroupProps[\"columns\"]>, string> = {\n 1: \"grid-cols-1\",\n 2: \"grid-cols-2\",\n 3: \"grid-cols-3\",\n 4: \"grid-cols-4\",\n};\n\nconst actionsAlignMap: Record<\n NonNullable<FormActionsProps[\"align\"]>,\n string\n> = {\n start: \"justify-start\",\n center: \"justify-center\",\n end: \"justify-end\",\n between: \"justify-between\",\n};\n\nconst messageIntentMap: Record<\n NonNullable<FormMessageProps[\"intent\"]>,\n string\n> = {\n default: \"text-neutral-500 dark:text-neutral-400\",\n error: \"text-red-500 dark:text-red-400\",\n success: \"text-emerald-600 dark:text-emerald-400\",\n};\n\nconst sanitizeId = (value: string) => value.replace(/[^a-zA-Z0-9_-]/g, \"-\");\n\nexport const Form = ({\n title,\n description,\n gap = \"lg\",\n children,\n className = \"\",\n ...props\n}: FormProps) => {\n return (\n <form\n className={cx(\n \"w-full space-y-6 rounded-lg border border-neutral-200 dark:border-neutral-700 bg-white dark:bg-neutral-800 p-6\",\n className,\n )}\n {...props}\n >\n {(title || description) && (\n <div className=\"space-y-2\">\n {title && (\n <h2 className=\"text-xl font-semibold text-neutral-900 dark:text-white\">\n {title}\n </h2>\n )}\n {description && (\n <p className=\"text-sm text-neutral-500 dark:text-neutral-400\">\n {description}\n </p>\n )}\n </div>\n )}\n <div className={gapClassMap[gap]}>{children}</div>\n </form>\n );\n};\n\nexport const FormSection = ({\n title,\n description,\n columns = 1,\n children,\n className = \"\",\n}: FormSectionProps) => {\n return (\n <section className={cx(\"space-y-4\", className)}>\n {(title || description) && (\n <header className=\"space-y-1\">\n {title && (\n <h3 className=\"text-base font-medium text-neutral-900 dark:text-white\">\n {title}\n </h3>\n )}\n {description && (\n <p className=\"text-sm text-neutral-500 dark:text-neutral-400\">\n {description}\n </p>\n )}\n </header>\n )}\n <div className={sectionColumnsMap[columns] || sectionColumnsMap[1]}>\n {children}\n </div>\n </section>\n );\n};\n\nexport const FormDescription = ({\n children,\n className = \"\",\n id,\n}: FormDescriptionProps) => (\n <p\n id={id}\n className={cx(\"text-sm text-neutral-500 dark:text-neutral-400\", className)}\n >\n {children}\n </p>\n);\n\nexport const FormMessage = ({\n children,\n intent = \"default\",\n className = \"\",\n id,\n}: FormMessageProps) => (\n <p\n id={id}\n role={intent === \"error\" ? \"alert\" : \"status\"}\n className={cx(\"text-sm\", messageIntentMap[intent], className)}\n >\n {children}\n </p>\n);\n\nexport const FormField = ({\n label,\n description,\n error,\n required,\n htmlFor,\n helperAction,\n layout = \"stacked\",\n children,\n className = \"\",\n}: FormFieldProps) => {\n const autoId = useId();\n const fieldId = sanitizeId(htmlFor ?? autoId);\n const descriptionId = description ? `${fieldId}-description` : undefined;\n const errorId = error ? `${fieldId}-error` : undefined;\n\n const controls = Children.map(children, (child) => {\n if (!isValidElement(child)) {\n return child;\n }\n\n const element = child as ReactElement<Record<string, unknown>>;\n const currentDescribedBy = element.props?.[\"aria-describedby\"] as\n | string\n | undefined;\n const describedBy = [currentDescribedBy, descriptionId, errorId]\n .filter(Boolean)\n .join(\" \")\n .trim();\n\n return cloneElement(element, {\n id: element.props?.id ?? fieldId,\n \"aria-describedby\": describedBy || undefined,\n \"aria-invalid\": element.props?.[\"aria-invalid\"] ?? Boolean(error),\n });\n });\n\n const labelNode = (\n <div className=\"flex items-center justify-between gap-2\">\n <label\n htmlFor={fieldId}\n className=\"text-sm font-medium text-neutral-900 dark:text-white\"\n >\n {label}\n {required && <span className=\"text-red-500 ml-1\">*</span>}\n </label>\n {helperAction && (\n <div className=\"text-xs text-neutral-500 dark:text-neutral-400\">\n {helperAction}\n </div>\n )}\n </div>\n );\n\n if (layout === \"inline\") {\n return (\n <div className={cx(\"flex flex-wrap items-start gap-6\", className)}>\n <div className=\"min-w-[200px] space-y-1\">\n {labelNode}\n {description && (\n <FormDescription id={descriptionId}>{description}</FormDescription>\n )}\n </div>\n <div className=\"flex-1 space-y-2\">\n {controls}\n {error && (\n <FormMessage id={errorId} intent=\"error\">\n {error}\n </FormMessage>\n )}\n </div>\n </div>\n );\n }\n\n return (\n <div className={cx(\"space-y-2\", className)}>\n {labelNode}\n {description && (\n <FormDescription id={descriptionId}>{description}</FormDescription>\n )}\n <div className=\"space-y-2\">\n {controls}\n {error && (\n <FormMessage id={errorId} intent=\"error\">\n {error}\n </FormMessage>\n )}\n </div>\n </div>\n );\n};\n\nexport const FormActions = ({\n children,\n align = \"end\",\n className = \"\",\n}: FormActionsProps) => (\n <div\n className={cx(\"flex flex-wrap gap-3\", actionsAlignMap[align], className)}\n >\n {children}\n </div>\n);\n\nexport const InputGroup = ({\n columns = 2,\n children,\n className = \"\",\n}: InputGroupProps) => (\n <div className={cx(\"grid gap-4\", inputGroupMap[columns], className)}>\n {children}\n </div>\n);\n"],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"form-TwlDrshv.mjs","names":[],"sources":["../../src/components/forms/form/Form.tsx"],"sourcesContent":["import { Children, cloneElement, isValidElement, useId } from \"react\";\nimport type { ReactElement } from \"react\";\n\nimport type {\n FormProps,\n FormSectionProps,\n FormFieldProps,\n FormActionsProps,\n InputGroupProps,\n FormDescriptionProps,\n FormMessageProps,\n} from \"./types\";\n\nconst cx = (...classes: Array<string | false | undefined>) =>\n classes.filter(Boolean).join(\" \").replace(/\\s+/g, \" \").trim();\n\nconst gapClassMap: Record<NonNullable<FormProps[\"gap\"]>, string> = {\n sm: \"space-y-4\",\n md: \"space-y-6\",\n lg: \"space-y-8\",\n};\n\nconst sectionColumnsMap: Record<\n NonNullable<FormSectionProps[\"columns\"]>,\n string\n> = {\n 1: \"space-y-4\",\n 2: \"grid grid-cols-2 gap-4\",\n 3: \"grid grid-cols-3 gap-4\",\n};\n\nconst inputGroupMap: Record<NonNullable<InputGroupProps[\"columns\"]>, string> = {\n 1: \"grid-cols-1\",\n 2: \"grid-cols-2\",\n 3: \"grid-cols-3\",\n 4: \"grid-cols-4\",\n};\n\nconst actionsAlignMap: Record<\n NonNullable<FormActionsProps[\"align\"]>,\n string\n> = {\n start: \"justify-start\",\n center: \"justify-center\",\n end: \"justify-end\",\n between: \"justify-between\",\n};\n\nconst messageIntentMap: Record<\n NonNullable<FormMessageProps[\"intent\"]>,\n string\n> = {\n default: \"text-neutral-500 dark:text-neutral-400\",\n error: \"text-red-500 dark:text-red-400\",\n success: \"text-emerald-600 dark:text-emerald-400\",\n};\n\nconst sanitizeId = (value: string) => value.replace(/[^a-zA-Z0-9_-]/g, \"-\");\n\nexport const Form = ({\n title,\n description,\n gap = \"lg\",\n children,\n className = \"\",\n ...props\n}: FormProps) => {\n return (\n <form\n className={cx(\n \"w-full space-y-6 rounded-lg border border-neutral-200 dark:border-neutral-700 bg-white dark:bg-neutral-800 p-6\",\n className,\n )}\n {...props}\n >\n {(title || description) && (\n <div className=\"space-y-2\">\n {title && (\n <h2 className=\"text-xl font-semibold text-neutral-900 dark:text-white\">\n {title}\n </h2>\n )}\n {description && (\n <p className=\"text-sm text-neutral-500 dark:text-neutral-400\">\n {description}\n </p>\n )}\n </div>\n )}\n <div className={gapClassMap[gap]}>{children}</div>\n </form>\n );\n};\n\nexport const FormSection = ({\n title,\n description,\n columns = 1,\n children,\n className = \"\",\n}: FormSectionProps) => {\n return (\n <section className={cx(\"space-y-4\", className)}>\n {(title || description) && (\n <header className=\"space-y-1\">\n {title && (\n <h3 className=\"text-base font-medium text-neutral-900 dark:text-white\">\n {title}\n </h3>\n )}\n {description && (\n <p className=\"text-sm text-neutral-500 dark:text-neutral-400\">\n {description}\n </p>\n )}\n </header>\n )}\n <div className={sectionColumnsMap[columns] || sectionColumnsMap[1]}>\n {children}\n </div>\n </section>\n );\n};\n\nexport const FormDescription = ({\n children,\n className = \"\",\n id,\n}: FormDescriptionProps) => (\n <p\n id={id}\n className={cx(\"text-sm text-neutral-500 dark:text-neutral-400\", className)}\n >\n {children}\n </p>\n);\n\nexport const FormMessage = ({\n children,\n intent = \"default\",\n className = \"\",\n id,\n}: FormMessageProps) => (\n <p\n id={id}\n role={intent === \"error\" ? \"alert\" : \"status\"}\n className={cx(\"text-sm\", messageIntentMap[intent], className)}\n >\n {children}\n </p>\n);\n\nexport const FormField = ({\n label,\n description,\n error,\n required,\n htmlFor,\n helperAction,\n layout = \"stacked\",\n children,\n className = \"\",\n}: FormFieldProps) => {\n const autoId = useId();\n const fieldId = sanitizeId(htmlFor ?? autoId);\n const descriptionId = description ? `${fieldId}-description` : undefined;\n const errorId = error ? `${fieldId}-error` : undefined;\n\n const controls = Children.map(children, (child) => {\n if (!isValidElement(child)) {\n return child;\n }\n\n const element = child as ReactElement<Record<string, unknown>>;\n const currentDescribedBy = element.props?.[\"aria-describedby\"] as\n | string\n | undefined;\n const describedBy = [currentDescribedBy, descriptionId, errorId]\n .filter(Boolean)\n .join(\" \")\n .trim();\n\n return cloneElement(element, {\n id: element.props?.id ?? fieldId,\n \"aria-describedby\": describedBy || undefined,\n \"aria-invalid\": element.props?.[\"aria-invalid\"] ?? Boolean(error),\n });\n });\n\n const labelNode = (\n <div className=\"flex items-center justify-between gap-2\">\n <label\n htmlFor={fieldId}\n className=\"text-sm font-medium text-neutral-900 dark:text-white\"\n >\n {label}\n {required && <span className=\"text-red-500 ml-1\">*</span>}\n </label>\n {helperAction && (\n <div className=\"text-xs text-neutral-500 dark:text-neutral-400\">\n {helperAction}\n </div>\n )}\n </div>\n );\n\n if (layout === \"inline\") {\n return (\n <div className={cx(\"flex flex-wrap items-start gap-6\", className)}>\n <div className=\"min-w-[200px] space-y-1\">\n {labelNode}\n {description && (\n <FormDescription id={descriptionId}>{description}</FormDescription>\n )}\n </div>\n <div className=\"flex-1 space-y-2\">\n {controls}\n {error && (\n <FormMessage id={errorId} intent=\"error\">\n {error}\n </FormMessage>\n )}\n </div>\n </div>\n );\n }\n\n return (\n <div className={cx(\"space-y-2\", className)}>\n {labelNode}\n {description && (\n <FormDescription id={descriptionId}>{description}</FormDescription>\n )}\n <div className=\"space-y-2\">\n {controls}\n {error && (\n <FormMessage id={errorId} intent=\"error\">\n {error}\n </FormMessage>\n )}\n </div>\n </div>\n );\n};\n\nexport const FormActions = ({\n children,\n align = \"end\",\n className = \"\",\n}: FormActionsProps) => (\n <div\n className={cx(\"flex flex-wrap gap-3\", actionsAlignMap[align], className)}\n >\n {children}\n </div>\n);\n\nexport const InputGroup = ({\n columns = 2,\n children,\n className = \"\",\n}: InputGroupProps) => (\n <div className={cx(\"grid gap-4\", inputGroupMap[columns], className)}>\n {children}\n </div>\n);\n"],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"hover-card-DwTVfjgN.mjs","names":[],"sources":["../../src/components/overlays/hover-card/HoverCard.tsx"],"sourcesContent":["import { forwardRef, useState, useCallback, useRef, useEffect } from \"react\";\nimport { motion, AnimatePresence } from \"framer-motion\";\n\nexport type HoverCardPosition = \"top\" | \"bottom\" | \"left\" | \"right\";\nexport type HoverCardAlign = \"start\" | \"center\" | \"end\";\n\nexport interface HoverCardProps {\n /** The trigger element */\n children: React.ReactNode;\n /** The content to display in the hover card */\n content: React.ReactNode;\n /** Position of the hover card relative to trigger */\n position?: HoverCardPosition;\n /** Alignment of the hover card */\n align?: HoverCardAlign;\n /** Delay before showing the card (ms) */\n openDelay?: number;\n /** Delay before hiding the card (ms) */\n closeDelay?: number;\n /** Whether the hover card is disabled */\n disabled?: boolean;\n /** Custom className for the card */\n className?: string;\n /** Custom className for the trigger wrapper */\n triggerClassName?: string;\n /** Whether to show an arrow */\n arrow?: boolean;\n /** Custom width for the card */\n width?: number | string;\n /** Max width for the card */\n maxWidth?: number | string;\n}\n\nconst positionStyles: Record<\n HoverCardPosition,\n Record<HoverCardAlign, string>\n> = {\n top: {\n start: \"bottom-full left-0 mb-2\",\n center: \"bottom-full left-1/2 -translate-x-1/2 mb-2\",\n end: \"bottom-full right-0 mb-2\",\n },\n bottom: {\n start: \"top-full left-0 mt-2\",\n center: \"top-full left-1/2 -translate-x-1/2 mt-2\",\n end: \"top-full right-0 mt-2\",\n },\n left: {\n start: \"right-full top-0 mr-2\",\n center: \"right-full top-1/2 -translate-y-1/2 mr-2\",\n end: \"right-full bottom-0 mr-2\",\n },\n right: {\n start: \"left-full top-0 ml-2\",\n center: \"left-full top-1/2 -translate-y-1/2 ml-2\",\n end: \"left-full bottom-0 ml-2\",\n },\n};\n\nconst arrowStyles: Record<HoverCardPosition, string> = {\n top: \"bottom-[-6px] left-1/2 -translate-x-1/2 border-l-transparent border-r-transparent border-b-transparent border-t-white/70 dark:border-t-neutral-900/70\",\n bottom:\n \"top-[-6px] left-1/2 -translate-x-1/2 border-l-transparent border-r-transparent border-t-transparent border-b-white/70 dark:border-b-neutral-900/70\",\n left: \"right-[-6px] top-1/2 -translate-y-1/2 border-t-transparent border-b-transparent border-r-transparent border-l-white/70 dark:border-l-neutral-900/70\",\n right:\n \"left-[-6px] top-1/2 -translate-y-1/2 border-t-transparent border-b-transparent border-l-transparent border-r-white/70 dark:border-r-neutral-900/70\",\n};\n\nconst motionVariants = {\n top: {\n initial: { opacity: 0, y: 5, scale: 0.98 },\n animate: { opacity: 1, y: 0, scale: 1 },\n exit: { opacity: 0, y: 5, scale: 0.98 },\n },\n bottom: {\n initial: { opacity: 0, y: -5, scale: 0.98 },\n animate: { opacity: 1, y: 0, scale: 1 },\n exit: { opacity: 0, y: -5, scale: 0.98 },\n },\n left: {\n initial: { opacity: 0, x: 5, scale: 0.98 },\n animate: { opacity: 1, x: 0, scale: 1 },\n exit: { opacity: 0, x: 5, scale: 0.98 },\n },\n right: {\n initial: { opacity: 0, x: -5, scale: 0.98 },\n animate: { opacity: 1, x: 0, scale: 1 },\n exit: { opacity: 0, x: -5, scale: 0.98 },\n },\n} as const;\n\nconst HoverCard = forwardRef<HTMLDivElement, HoverCardProps>(\n (\n {\n children,\n content,\n position = \"bottom\",\n align = \"center\",\n openDelay = 200,\n closeDelay = 150,\n disabled = false,\n className = \"\",\n triggerClassName = \"\",\n arrow = true,\n width,\n maxWidth = 320,\n },\n ref,\n ) => {\n const [isOpen, setIsOpen] = useState(false);\n const openTimeoutRef = useRef<any>(null);\n const closeTimeoutRef = useRef<any>(null);\n\n const clearTimeouts = useCallback(() => {\n if (openTimeoutRef.current) {\n clearTimeout(openTimeoutRef.current);\n openTimeoutRef.current = null;\n }\n if (closeTimeoutRef.current) {\n clearTimeout(closeTimeoutRef.current);\n closeTimeoutRef.current = null;\n }\n }, []);\n\n const handleMouseEnter = useCallback(() => {\n if (disabled) return;\n clearTimeouts();\n openTimeoutRef.current = setTimeout(() => {\n setIsOpen(true);\n }, openDelay);\n }, [disabled, openDelay, clearTimeouts]);\n\n const handleMouseLeave = useCallback(() => {\n clearTimeouts();\n closeTimeoutRef.current = setTimeout(() => {\n setIsOpen(false);\n }, closeDelay);\n }, [closeDelay, clearTimeouts]);\n\n useEffect(() => {\n return () => clearTimeouts();\n }, [clearTimeouts]);\n\n const cardStyle: React.CSSProperties = {\n width: width\n ? typeof width === \"number\"\n ? `${width}px`\n : width\n : undefined,\n maxWidth: typeof maxWidth === \"number\" ? `${maxWidth}px` : maxWidth,\n };\n\n return (\n <div\n ref={ref}\n className={`relative inline-block ${triggerClassName}`}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n >\n {children}\n <AnimatePresence>\n {isOpen && (\n <motion.div\n className={`\n absolute z-50\n ${positionStyles[position][align]}\n `}\n initial={motionVariants[position].initial}\n animate={motionVariants[position].animate}\n exit={motionVariants[position].exit}\n transition={{ duration: 0.15, ease: \"easeOut\" }}\n >\n <div\n className={`\n bg-white/70 dark:bg-neutral-900/70\n backdrop-blur-xl\n rounded-xl shadow-2xl dark:shadow-neutral-950/50\n border border-white/40 dark:border-white/10\n p-4\n ${className}\n `}\n style={cardStyle}\n >\n {content}\n </div>\n {arrow && (\n <span\n className={`\n absolute w-0 h-0 border-[6px]\n ${arrowStyles[position]}\n `}\n />\n )}\n </motion.div>\n )}\n </AnimatePresence>\n </div>\n );\n },\n);\n\nHoverCard.displayName = \"HoverCard\";\n\nexport default HoverCard;\nexport { HoverCard };\n"],"mappings":"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"}
|