erp-pro-ui 0.1.4 → 0.1.6
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 +137 -28
- 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/animated-content.cjs +1 -1
- package/dist/animated-content.mjs +1 -1
- package/dist/animations.css +2 -2
- package/dist/ascii-text.cjs +1 -1
- package/dist/ascii-text.mjs +1 -1
- package/dist/background-gradient-animation.cjs +1 -1
- package/dist/background-gradient-animation.mjs +1 -1
- package/dist/button-hover-border-gradient.cjs +1 -1
- package/dist/button-hover-border-gradient.mjs +1 -1
- package/dist/button.cjs +1 -1
- package/dist/button.mjs +1 -1
- package/dist/calendar.cjs +1 -1
- package/dist/calendar.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 +2 -1
- package/dist/charts.mjs +2 -2
- package/dist/checkbox.cjs +1 -1
- package/dist/checkbox.mjs +1 -1
- package/dist/chip.cjs +3 -1
- package/dist/chip.mjs +2 -2
- package/dist/chroma-grid.cjs +1 -1
- package/dist/chroma-grid.mjs +1 -1
- package/dist/chunks/{HoverBorderGradient-Df3PKpw6.cjs → HoverBorderGradient-C5D6lGg0.cjs} +8 -8
- package/dist/chunks/HoverBorderGradient-C5D6lGg0.cjs.map +1 -0
- package/dist/chunks/{HoverBorderGradient-DVFEIXFQ.mjs → HoverBorderGradient-CduqqQgX.mjs} +8 -8
- package/dist/chunks/HoverBorderGradient-CduqqQgX.mjs.map +1 -0
- package/dist/chunks/{accordion-Cbt-SJhj.mjs → accordion-6zxJUYXr.mjs} +8 -8
- package/dist/chunks/accordion-6zxJUYXr.mjs.map +1 -0
- package/dist/chunks/{accordion-pfJR8YYA.cjs → accordion-CmB6EidC.cjs} +8 -8
- package/dist/chunks/accordion-CmB6EidC.cjs.map +1 -0
- package/dist/chunks/alert-C5KEeQqh.cjs +81 -0
- package/dist/chunks/alert-C5KEeQqh.cjs.map +1 -0
- package/dist/chunks/alert-XVmYJgds.mjs +75 -0
- package/dist/chunks/alert-XVmYJgds.mjs.map +1 -0
- package/dist/chunks/{animated-content-CttSmLWV.cjs → animated-content-CLsFnjgr.cjs} +1 -1
- package/dist/chunks/{animated-content-CttSmLWV.cjs.map → animated-content-CLsFnjgr.cjs.map} +1 -1
- package/dist/chunks/{animated-content-C1uNg1xO.mjs → animated-content-bK6xp-vc.mjs} +1 -1
- package/dist/chunks/{animated-content-C1uNg1xO.mjs.map → animated-content-bK6xp-vc.mjs.map} +1 -1
- package/dist/chunks/{ascii-text-DlmArZXh.cjs → ascii-text-BP-BBy0-.cjs} +3 -3
- package/dist/chunks/{ascii-text-DlmArZXh.cjs.map → ascii-text-BP-BBy0-.cjs.map} +1 -1
- package/dist/chunks/{ascii-text-C5tyNsR3.mjs → ascii-text-RJxX3wCC.mjs} +1 -1
- package/dist/chunks/{ascii-text-C5tyNsR3.mjs.map → ascii-text-RJxX3wCC.mjs.map} +1 -1
- package/dist/chunks/{background-gradient-animation-BL-lnrJe.mjs → background-gradient-animation-DpKJ3ecq.mjs} +3 -3
- package/dist/chunks/{background-gradient-animation-BL-lnrJe.mjs.map → background-gradient-animation-DpKJ3ecq.mjs.map} +1 -1
- package/dist/chunks/{background-gradient-animation-CXV9GDH8.cjs → background-gradient-animation-II9hdrgB.cjs} +3 -3
- package/dist/chunks/{background-gradient-animation-CXV9GDH8.cjs.map → background-gradient-animation-II9hdrgB.cjs.map} +1 -1
- package/dist/chunks/{button-B0Lhj0AS.mjs → button-DddUhuR-.mjs} +6 -5
- package/dist/chunks/button-DddUhuR-.mjs.map +1 -0
- package/dist/chunks/{button-hover-border-gradient-CvoM60wz.mjs → button-hover-border-gradient-DFppVRI4.mjs} +3 -3
- package/dist/chunks/{button-hover-border-gradient-CvoM60wz.mjs.map → button-hover-border-gradient-DFppVRI4.mjs.map} +1 -1
- package/dist/chunks/{button-hover-border-gradient-CSHXM5Cm.cjs → button-hover-border-gradient-DX2lBG5C.cjs} +3 -3
- package/dist/chunks/{button-hover-border-gradient-CSHXM5Cm.cjs.map → button-hover-border-gradient-DX2lBG5C.cjs.map} +1 -1
- package/dist/chunks/{button-CZL6kFzT.cjs → button-xqernofO.cjs} +6 -5
- package/dist/chunks/button-xqernofO.cjs.map +1 -0
- package/dist/chunks/{calendar-DrCgT_pj.mjs → calendar-Cp84V2rY.mjs} +7 -7
- package/dist/chunks/calendar-Cp84V2rY.mjs.map +1 -0
- package/dist/chunks/{calendar-Cpp_Rc7T.cjs → calendar-DuCKr6b7.cjs} +7 -7
- package/dist/chunks/calendar-DuCKr6b7.cjs.map +1 -0
- package/dist/chunks/{card-C5_tFK6Q.cjs → card-CqPDr6Tt.cjs} +4 -4
- package/dist/chunks/card-CqPDr6Tt.cjs.map +1 -0
- package/dist/chunks/{card-Dh8wNv8N.mjs → card-SpHHNB0c.mjs} +4 -4
- package/dist/chunks/card-SpHHNB0c.mjs.map +1 -0
- package/dist/chunks/{carousel-BYwqI4cA.mjs → carousel-C1skQ65z.mjs} +14 -14
- package/dist/chunks/carousel-C1skQ65z.mjs.map +1 -0
- package/dist/chunks/{carousel-C1338X8h.cjs → carousel-YlRLOGkM.cjs} +11 -11
- package/dist/chunks/carousel-YlRLOGkM.cjs.map +1 -0
- package/dist/chunks/{charts-BYvM4TMG.mjs → charts-C-Qee_JY.mjs} +118 -19
- package/dist/chunks/charts-C-Qee_JY.mjs.map +1 -0
- package/dist/chunks/{charts-DbxyHtlX.cjs → charts-CZEYcr6X.cjs} +119 -14
- package/dist/chunks/charts-CZEYcr6X.cjs.map +1 -0
- package/dist/chunks/{checkbox-Pr49U9F1.mjs → checkbox-DjGpvMyo.mjs} +12 -12
- package/dist/chunks/checkbox-DjGpvMyo.mjs.map +1 -0
- package/dist/chunks/{checkbox-CxOcjoGP.cjs → checkbox-NM_iPd6S.cjs} +10 -10
- package/dist/chunks/checkbox-NM_iPd6S.cjs.map +1 -0
- package/dist/chunks/chip-BY83_HK7.cjs +203 -0
- package/dist/chunks/chip-BY83_HK7.cjs.map +1 -0
- package/dist/chunks/chip-CbO8-1lK.mjs +185 -0
- package/dist/chunks/chip-CbO8-1lK.mjs.map +1 -0
- package/dist/chunks/{chroma-grid-BAo6V5A7.mjs → chroma-grid-CexX28VQ.mjs} +6 -6
- package/dist/chunks/chroma-grid-CexX28VQ.mjs.map +1 -0
- package/dist/chunks/{chroma-grid-CIk0dsNS.cjs → chroma-grid-DP__XtmV.cjs} +6 -6
- package/dist/chunks/chroma-grid-DP__XtmV.cjs.map +1 -0
- package/dist/chunks/{color-palette-euKQMWlV.mjs → color-palette-BU1cI6XP.mjs} +166 -132
- package/dist/chunks/color-palette-BU1cI6XP.mjs.map +1 -0
- package/dist/chunks/{color-palette-2TuEMkAn.cjs → color-palette-ThIKMhT1.cjs} +168 -133
- package/dist/chunks/color-palette-ThIKMhT1.cjs.map +1 -0
- package/dist/chunks/{combobox-CwGubKTt.cjs → combobox-B7UIcjsI.cjs} +31 -23
- package/dist/chunks/combobox-B7UIcjsI.cjs.map +1 -0
- package/dist/chunks/{combobox-DrFmkI0F.mjs → combobox-D6WnThIQ.mjs} +30 -22
- package/dist/chunks/combobox-D6WnThIQ.mjs.map +1 -0
- package/dist/chunks/data-table-KDM8AEwU.mjs +1555 -0
- package/dist/chunks/data-table-KDM8AEwU.mjs.map +1 -0
- package/dist/chunks/data-table-z-YDzi0N.cjs +1646 -0
- package/dist/chunks/data-table-z-YDzi0N.cjs.map +1 -0
- package/dist/chunks/{date-picker-CNPORxhv.mjs → date-picker-Bh6_p4bD.mjs} +39 -19
- package/dist/chunks/date-picker-Bh6_p4bD.mjs.map +1 -0
- package/dist/chunks/{date-picker-CZo68Fkl.cjs → date-picker-CfCvp6Tj.cjs} +39 -19
- package/dist/chunks/date-picker-CfCvp6Tj.cjs.map +1 -0
- package/dist/chunks/{dialog-DUWnV9tN.mjs → dialog-BibwiFLY.mjs} +33 -30
- package/dist/chunks/dialog-BibwiFLY.mjs.map +1 -0
- package/dist/chunks/{dialog-CYFiWN8M.cjs → dialog-I141I0nc.cjs} +33 -30
- package/dist/chunks/dialog-I141I0nc.cjs.map +1 -0
- package/dist/chunks/{drawer-D82Jz6KO.mjs → drawer-DsE8Pb8e.mjs} +11 -11
- package/dist/chunks/drawer-DsE8Pb8e.mjs.map +1 -0
- package/dist/chunks/{drawer-CLjsYdxN.cjs → drawer-EC9eopGX.cjs} +11 -11
- package/dist/chunks/drawer-EC9eopGX.cjs.map +1 -0
- package/dist/chunks/{form-B2vcaHwh.mjs → form-CRwpjFWu.mjs} +10 -10
- package/dist/chunks/form-CRwpjFWu.mjs.map +1 -0
- package/dist/chunks/{form-CzH9GQc6.cjs → form-DaGyqM97.cjs} +10 -10
- package/dist/chunks/form-DaGyqM97.cjs.map +1 -0
- package/dist/chunks/{gradual-blur-B9GoY8o1.cjs → gradual-blur-Di7MBs7M.cjs} +1 -1
- package/dist/chunks/{gradual-blur-B9GoY8o1.cjs.map → gradual-blur-Di7MBs7M.cjs.map} +1 -1
- package/dist/chunks/{gradual-blur-Bl3dOMEz.mjs → gradual-blur-pt0UiMEy.mjs} +1 -1
- package/dist/chunks/{gradual-blur-Bl3dOMEz.mjs.map → gradual-blur-pt0UiMEy.mjs.map} +1 -1
- package/dist/chunks/{hover-card-xqwpmZNm.mjs → hover-card-C3Xa18Ov.mjs} +7 -8
- package/dist/chunks/hover-card-C3Xa18Ov.mjs.map +1 -0
- package/dist/chunks/{hover-card-v0QwmVBU.cjs → hover-card-D78E07hk.cjs} +7 -8
- package/dist/chunks/hover-card-D78E07hk.cjs.map +1 -0
- package/dist/chunks/{icons-BxIzP2jd.cjs → icons-CRanVZB1.cjs} +8 -8
- package/dist/chunks/icons-CRanVZB1.cjs.map +1 -0
- package/dist/chunks/{icons-DuumN7z-.mjs → icons-bx3nrxNv.mjs} +8 -8
- package/dist/chunks/icons-bx3nrxNv.mjs.map +1 -0
- package/dist/chunks/{input-Bt_r_B_c.mjs → input-CpARxvFi.mjs} +14 -14
- package/dist/chunks/input-CpARxvFi.mjs.map +1 -0
- package/dist/chunks/{input-BWM6G7jq.cjs → input-DTW_8EwG.cjs} +14 -14
- package/dist/chunks/input-DTW_8EwG.cjs.map +1 -0
- package/dist/chunks/{label-KPA-yYOF.mjs → label-BVH02Yvq.mjs} +1 -1
- package/dist/chunks/{label-KPA-yYOF.mjs.map → label-BVH02Yvq.mjs.map} +1 -1
- package/dist/chunks/{label-BWPEGVam.cjs → label-DN-Bg5i8.cjs} +1 -1
- package/dist/chunks/{label-BWPEGVam.cjs.map → label-DN-Bg5i8.cjs.map} +1 -1
- package/dist/chunks/{loading-q7IEg56I.cjs → loading-B1yrR3KX.cjs} +7 -7
- package/dist/chunks/{loading-q7IEg56I.cjs.map → loading-B1yrR3KX.cjs.map} +1 -1
- package/dist/chunks/{loading-S1TdIrbB.mjs → loading-B2Ron0Fd.mjs} +7 -7
- package/dist/chunks/{loading-S1TdIrbB.mjs.map → loading-B2Ron0Fd.mjs.map} +1 -1
- package/dist/chunks/{multi-select-combobox-D46M-AN9.mjs → multi-select-combobox-CMhAXEGZ.mjs} +15 -15
- package/dist/chunks/multi-select-combobox-CMhAXEGZ.mjs.map +1 -0
- package/dist/chunks/{multi-select-combobox-dS6bJE_e.cjs → multi-select-combobox-FEbMAPEg.cjs} +16 -16
- package/dist/chunks/multi-select-combobox-FEbMAPEg.cjs.map +1 -0
- package/dist/chunks/{otp-input-DSW9Ca_D.cjs → otp-input-B6nJC-Fl.cjs} +10 -10
- package/dist/chunks/otp-input-B6nJC-Fl.cjs.map +1 -0
- package/dist/chunks/{otp-input-DeAi4nJ_.mjs → otp-input-B7DhhsMe.mjs} +10 -10
- package/dist/chunks/otp-input-B7DhhsMe.mjs.map +1 -0
- package/dist/chunks/{overlay-TycCIFOu.mjs → overlay-C58wXorc.mjs} +1 -1
- package/dist/chunks/{overlay-TycCIFOu.mjs.map → overlay-C58wXorc.mjs.map} +1 -1
- package/dist/chunks/{overlay-DWNTyQzK.cjs → overlay-DwJgjJuu.cjs} +1 -1
- package/dist/chunks/{overlay-DWNTyQzK.cjs.map → overlay-DwJgjJuu.cjs.map} +1 -1
- package/dist/chunks/{password-strength-meter-DxMV6GAs.cjs → password-strength-meter-6vNu6p19.cjs} +13 -13
- package/dist/chunks/password-strength-meter-6vNu6p19.cjs.map +1 -0
- package/dist/chunks/{password-strength-meter-CbNSBuh_.mjs → password-strength-meter-D7gmZNjp.mjs} +13 -13
- package/dist/chunks/password-strength-meter-D7gmZNjp.mjs.map +1 -0
- package/dist/chunks/{progress-bar-BdvQtpm3.cjs → progress-bar-CbsCItvv.cjs} +78 -5
- package/dist/chunks/progress-bar-CbsCItvv.cjs.map +1 -0
- package/dist/chunks/{progress-bar-B9sy7WBT.mjs → progress-bar-D6Q9Di7D.mjs} +72 -5
- package/dist/chunks/progress-bar-D6Q9Di7D.mjs.map +1 -0
- package/dist/chunks/{radio-C9w_CoiY.mjs → radio-C6Meq2iz.mjs} +2 -2
- package/dist/chunks/{radio-C9w_CoiY.mjs.map → radio-C6Meq2iz.mjs.map} +1 -1
- package/dist/chunks/{radio-jMHDvaMY.cjs → radio-DxakS7iD.cjs} +2 -2
- package/dist/chunks/{radio-jMHDvaMY.cjs.map → radio-DxakS7iD.cjs.map} +1 -1
- package/dist/chunks/{select-B8UQ6Uq5.mjs → select-1rSJeUBQ.mjs} +25 -19
- package/dist/chunks/select-1rSJeUBQ.mjs.map +1 -0
- package/dist/chunks/{select-CCUSMvfS.cjs → select-SOmIt-BD.cjs} +25 -19
- package/dist/chunks/select-SOmIt-BD.cjs.map +1 -0
- package/dist/chunks/{skeleton-CtLumdRw.mjs → skeleton-BRx-80dg.mjs} +18 -18
- package/dist/chunks/skeleton-BRx-80dg.mjs.map +1 -0
- package/dist/chunks/{skeleton-BNea1Rcp.cjs → skeleton-o7DlA5yl.cjs} +18 -18
- package/dist/chunks/skeleton-o7DlA5yl.cjs.map +1 -0
- package/dist/chunks/{spinners-BL4ERCCw.cjs → spinners-BylPf0uk.cjs} +2 -2
- package/dist/chunks/{spinners-BL4ERCCw.cjs.map → spinners-BylPf0uk.cjs.map} +1 -1
- package/dist/chunks/{spinners-BBCWD2gw.mjs → spinners-hJaI_cBH.mjs} +2 -2
- package/dist/chunks/{spinners-BBCWD2gw.mjs.map → spinners-hJaI_cBH.mjs.map} +1 -1
- package/dist/chunks/{splash-cursor-BVSmbcIX.cjs → splash-cursor-CmqkSl6m.cjs} +1 -1
- package/dist/chunks/{splash-cursor-BVSmbcIX.cjs.map → splash-cursor-CmqkSl6m.cjs.map} +1 -1
- package/dist/chunks/{splash-cursor-rSrTnawZ.mjs → splash-cursor-Cxouip_h.mjs} +1 -1
- package/dist/chunks/{splash-cursor-rSrTnawZ.mjs.map → splash-cursor-Cxouip_h.mjs.map} +1 -1
- package/dist/chunks/{spotlight-card-DS1dy1W3.cjs → spotlight-card-B3L3K21T.cjs} +8 -8
- package/dist/chunks/spotlight-card-B3L3K21T.cjs.map +1 -0
- package/dist/chunks/{spotlight-card-BpZLMOp6.mjs → spotlight-card-DIgacTxA.mjs} +8 -8
- package/dist/chunks/spotlight-card-DIgacTxA.mjs.map +1 -0
- package/dist/chunks/{stepper-D6qQbZdg.cjs → stepper-BpjKyemI.cjs} +212 -129
- package/dist/chunks/stepper-BpjKyemI.cjs.map +1 -0
- package/dist/chunks/{stepper-DUknuW2E.mjs → stepper-JD4ZHT-b.mjs} +213 -130
- package/dist/chunks/stepper-JD4ZHT-b.mjs.map +1 -0
- package/dist/chunks/sun-to-moon-button-BOx1n6nk.cjs +311 -0
- package/dist/chunks/sun-to-moon-button-BOx1n6nk.cjs.map +1 -0
- package/dist/chunks/sun-to-moon-button-CBbDar4k.mjs +299 -0
- package/dist/chunks/sun-to-moon-button-CBbDar4k.mjs.map +1 -0
- package/dist/chunks/{switch-C5otDb4c.cjs → switch-C9suGEWg.cjs} +5 -5
- package/dist/chunks/switch-C9suGEWg.cjs.map +1 -0
- package/dist/chunks/{switch-DOVl_i_s.mjs → switch-hd7zTBD_.mjs} +5 -5
- package/dist/chunks/switch-hd7zTBD_.mjs.map +1 -0
- package/dist/chunks/{textarea-Blky_fLK.mjs → textarea-Cu26uKqq.mjs} +5 -5
- package/dist/chunks/textarea-Cu26uKqq.mjs.map +1 -0
- package/dist/chunks/{textarea-ok_NlE2p.cjs → textarea-cXgKzluG.cjs} +5 -5
- package/dist/chunks/textarea-cXgKzluG.cjs.map +1 -0
- package/dist/chunks/{theme-7DWLxJK_.cjs → theme-D6B-FaoE.cjs} +28 -5
- package/dist/chunks/theme-D6B-FaoE.cjs.map +1 -0
- package/dist/chunks/{theme-BceKeYhw.mjs → theme-koPrLKQv.mjs} +28 -5
- package/dist/chunks/theme-koPrLKQv.mjs.map +1 -0
- package/dist/chunks/{toast-CvfP7PUP.mjs → toast-CpX-22n2.mjs} +26 -26
- package/dist/chunks/toast-CpX-22n2.mjs.map +1 -0
- package/dist/chunks/{toast-Ds7_19Ap.cjs → toast-REa6FRBc.cjs} +26 -26
- package/dist/chunks/toast-REa6FRBc.cjs.map +1 -0
- package/dist/chunks/{tooltip-efHETBo1.mjs → tooltip-CASvQiFQ.mjs} +6 -7
- package/dist/chunks/tooltip-CASvQiFQ.mjs.map +1 -0
- package/dist/chunks/{tooltip-nkIqViGk.cjs → tooltip-CKF78rni.cjs} +6 -7
- package/dist/chunks/tooltip-CKF78rni.cjs.map +1 -0
- package/dist/chunks/truncated-text-DTgks5yS.mjs +45 -0
- package/dist/chunks/truncated-text-DTgks5yS.mjs.map +1 -0
- package/dist/chunks/truncated-text-istgJRUq.cjs +52 -0
- package/dist/chunks/truncated-text-istgJRUq.cjs.map +1 -0
- package/dist/chunks/{typography-CLu6Hx9j.mjs → typography-KxLf6Td8.mjs} +5 -5
- package/dist/chunks/typography-KxLf6Td8.mjs.map +1 -0
- package/dist/chunks/{typography-DaLu9tty.cjs → typography-sGmh0gZ_.cjs} +6 -6
- package/dist/chunks/typography-sGmh0gZ_.cjs.map +1 -0
- package/dist/color-palette.cjs +1 -1
- package/dist/color-palette.mjs +1 -1
- package/dist/colors.css +45 -149
- package/dist/combobox.cjs +1 -1
- package/dist/combobox.mjs +1 -1
- package/dist/components/data-display/card/Card.d.ts.map +1 -1
- package/dist/components/data-display/charts/MiniNeonSparkline.d.ts +17 -0
- package/dist/components/data-display/charts/MiniNeonSparkline.d.ts.map +1 -0
- package/dist/components/data-display/charts/ThinBreakdownBar.d.ts.map +1 -1
- 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/chip/SpecialChip.d.ts +23 -0
- package/dist/components/data-display/chip/SpecialChip.d.ts.map +1 -0
- package/dist/components/data-display/chip/index.d.ts +2 -0
- package/dist/components/data-display/chip/index.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 +49 -26
- package/dist/components/data-display/data-table/DataTable.d.ts.map +1 -1
- package/dist/components/data-display/data-table/DataTableControls.d.ts +34 -0
- package/dist/components/data-display/data-table/DataTableControls.d.ts.map +1 -0
- package/dist/components/data-display/data-table/DataTableFilters.d.ts +27 -0
- package/dist/components/data-display/data-table/DataTableFilters.d.ts.map +1 -0
- package/dist/components/data-display/data-table/DataTableRows.d.ts +34 -0
- package/dist/components/data-display/data-table/DataTableRows.d.ts.map +1 -0
- package/dist/components/data-display/data-table/DataTableToolbar.d.ts +48 -0
- package/dist/components/data-display/data-table/DataTableToolbar.d.ts.map +1 -0
- package/dist/components/data-display/data-table/TablePrimitives.d.ts +11 -0
- package/dist/components/data-display/data-table/TablePrimitives.d.ts.map +1 -0
- package/dist/components/data-display/data-table/direction.d.ts +7 -0
- package/dist/components/data-display/data-table/direction.d.ts.map +1 -0
- package/dist/components/data-display/data-table/index.d.ts +2 -2
- package/dist/components/data-display/data-table/index.d.ts.map +1 -1
- package/dist/components/data-display/loading/Loading.d.ts.map +1 -1
- package/dist/components/data-display/progress-bar/CircularProgress.d.ts +17 -0
- package/dist/components/data-display/progress-bar/CircularProgress.d.ts.map +1 -0
- package/dist/components/data-display/progress-bar/index.d.ts +2 -0
- package/dist/components/data-display/progress-bar/index.d.ts.map +1 -1
- package/dist/components/effects/sun-to-moon-button/ThemeSwitcherButtons.d.ts +5 -0
- package/dist/components/effects/sun-to-moon-button/ThemeSwitcherButtons.d.ts.map +1 -0
- package/dist/components/effects/sun-to-moon-button/index.d.ts +2 -0
- package/dist/components/effects/sun-to-moon-button/index.d.ts.map +1 -1
- package/dist/components/feedback/alert/Alert.d.ts +1 -1
- package/dist/components/feedback/alert/Alert.d.ts.map +1 -1
- package/dist/components/feedback/alert/types.d.ts +11 -2
- package/dist/components/feedback/alert/types.d.ts.map +1 -1
- package/dist/components/forms/button/Button.d.ts +1 -1
- package/dist/components/forms/button/Button.d.ts.map +1 -1
- package/dist/components/forms/button/index.d.ts +1 -1
- package/dist/components/forms/button/index.d.ts.map +1 -1
- package/dist/components/forms/button/types.d.ts +4 -1
- package/dist/components/forms/button/types.d.ts.map +1 -1
- package/dist/components/forms/calendar/Calendar.d.ts.map +1 -1
- package/dist/components/forms/checkbox/Checkbox.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/form/Form.d.ts.map +1 -1
- package/dist/components/forms/input/Input.d.ts.map +1 -1
- package/dist/components/forms/input/types.d.ts +1 -1
- package/dist/components/forms/input/types.d.ts.map +1 -1
- package/dist/components/forms/password-strength-meter/PasswordCriteria.d.ts.map +1 -1
- package/dist/components/forms/password-strength-meter/PasswordStrengthMeter.d.ts.map +1 -1
- package/dist/components/forms/select/Select.d.ts.map +1 -1
- package/dist/components/navigation/accordion/Accordion.d.ts.map +1 -1
- package/dist/components/navigation/stepper/Stepper.d.ts +1 -1
- package/dist/components/navigation/stepper/Stepper.d.ts.map +1 -1
- package/dist/components/navigation/stepper/Stepper1.d.ts.map +1 -1
- package/dist/components/navigation/stepper/index.d.ts +1 -1
- package/dist/components/navigation/stepper/index.d.ts.map +1 -1
- package/dist/components/navigation/stepper/types.d.ts +3 -0
- package/dist/components/navigation/stepper/types.d.ts.map +1 -1
- package/dist/components/navigation/tabs/Tabs.d.ts +3 -0
- package/dist/components/navigation/tabs/Tabs.d.ts.map +1 -0
- package/dist/components/navigation/tabs/index.d.ts +3 -0
- package/dist/components/navigation/tabs/index.d.ts.map +1 -0
- package/dist/components/navigation/tabs/types.d.ts +21 -0
- package/dist/components/navigation/tabs/types.d.ts.map +1 -0
- package/dist/components/overlays/dialog/Dialog.d.ts.map +1 -1
- package/dist/components/overlays/dialog/types.d.ts +1 -0
- package/dist/components/overlays/dialog/types.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/overlays/toast/Toast.d.ts.map +1 -1
- package/dist/components/overlays/tooltip/Tooltip.d.ts.map +1 -1
- package/dist/components/shared/overlay.d.ts +1 -1
- package/dist/components/typography/Typography.d.ts.map +1 -1
- package/dist/components/typography/truncated-text/TruncatedText.d.ts +11 -0
- package/dist/components/typography/truncated-text/TruncatedText.d.ts.map +1 -0
- package/dist/components/typography/truncated-text/index.d.ts +3 -0
- package/dist/components/typography/truncated-text/index.d.ts.map +1 -0
- package/dist/contexts/ThemeContext.d.ts +1 -1
- package/dist/contexts/ThemeContext.d.ts.map +1 -1
- package/dist/contexts/index.d.ts +1 -1
- package/dist/contexts/index.d.ts.map +1 -1
- package/dist/data-table.cjs +11 -1
- package/dist/data-table.mjs +2 -2
- 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 +76 -26
- package/dist/docs.cjs.map +1 -1
- package/dist/docs.d.ts +10 -10
- package/dist/docs.d.ts.map +1 -1
- package/dist/docs.mjs +76 -26
- package/dist/docs.mjs.map +1 -1
- package/dist/drawer.cjs +1 -1
- package/dist/drawer.mjs +1 -1
- package/dist/form.cjs +1 -1
- package/dist/form.mjs +1 -1
- package/dist/foundation.css +54 -3
- package/dist/foundations/theme/ThemeProvider.d.ts +22 -1
- package/dist/foundations/theme/ThemeProvider.d.ts.map +1 -1
- package/dist/foundations/theme/index.d.ts +1 -1
- package/dist/foundations/theme/index.d.ts.map +1 -1
- package/dist/gradual-blur.cjs +1 -1
- package/dist/gradual-blur.mjs +1 -1
- package/dist/hover-border-gradient.cjs +1 -1
- package/dist/hover-border-gradient.mjs +1 -1
- package/dist/hover-card.cjs +1 -1
- package/dist/hover-card.mjs +1 -1
- package/dist/icons.cjs +1 -1
- package/dist/icons.mjs +1 -1
- package/dist/index.cjs +201 -48
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +17 -9
- package/dist/index.d.ts.map +1 -1
- package/dist/index.mjs +183 -50
- 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 +2 -1
- package/dist/progress-bar.mjs +2 -2
- 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 +2 -1
- package/dist/sun-to-moon-button.mjs +2 -2
- 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 -298
- package/dist/tooltip.cjs +1 -1
- package/dist/tooltip.mjs +1 -1
- package/dist/truncated-text.cjs +3 -0
- package/dist/truncated-text.d.ts +2 -0
- package/dist/truncated-text.mjs +2 -0
- package/dist/typography.cjs +1 -1
- package/dist/typography.mjs +1 -1
- package/package.json +15 -9
- package/dist/chunks/HoverBorderGradient-DVFEIXFQ.mjs.map +0 -1
- package/dist/chunks/HoverBorderGradient-Df3PKpw6.cjs.map +0 -1
- package/dist/chunks/accordion-Cbt-SJhj.mjs.map +0 -1
- package/dist/chunks/accordion-pfJR8YYA.cjs.map +0 -1
- package/dist/chunks/alert-CtdLy4Hv.mjs +0 -40
- package/dist/chunks/alert-CtdLy4Hv.mjs.map +0 -1
- package/dist/chunks/alert-Dvz1GoL5.cjs +0 -46
- package/dist/chunks/alert-Dvz1GoL5.cjs.map +0 -1
- package/dist/chunks/button-B0Lhj0AS.mjs.map +0 -1
- package/dist/chunks/button-CZL6kFzT.cjs.map +0 -1
- package/dist/chunks/calendar-Cpp_Rc7T.cjs.map +0 -1
- package/dist/chunks/calendar-DrCgT_pj.mjs.map +0 -1
- package/dist/chunks/card-C5_tFK6Q.cjs.map +0 -1
- package/dist/chunks/card-Dh8wNv8N.mjs.map +0 -1
- package/dist/chunks/carousel-BYwqI4cA.mjs.map +0 -1
- package/dist/chunks/carousel-C1338X8h.cjs.map +0 -1
- package/dist/chunks/charts-BYvM4TMG.mjs.map +0 -1
- package/dist/chunks/charts-DbxyHtlX.cjs.map +0 -1
- package/dist/chunks/checkbox-CxOcjoGP.cjs.map +0 -1
- package/dist/chunks/checkbox-Pr49U9F1.mjs.map +0 -1
- package/dist/chunks/chip-B4ol1yPk.cjs +0 -145
- package/dist/chunks/chip-B4ol1yPk.cjs.map +0 -1
- package/dist/chunks/chip-DdnBLdpl.mjs +0 -139
- package/dist/chunks/chip-DdnBLdpl.mjs.map +0 -1
- package/dist/chunks/chroma-grid-BAo6V5A7.mjs.map +0 -1
- package/dist/chunks/chroma-grid-CIk0dsNS.cjs.map +0 -1
- package/dist/chunks/color-palette-2TuEMkAn.cjs.map +0 -1
- package/dist/chunks/color-palette-euKQMWlV.mjs.map +0 -1
- package/dist/chunks/combobox-CwGubKTt.cjs.map +0 -1
- package/dist/chunks/combobox-DrFmkI0F.mjs.map +0 -1
- package/dist/chunks/data-table-Bo80m7qV.mjs +0 -1123
- package/dist/chunks/data-table-Bo80m7qV.mjs.map +0 -1
- package/dist/chunks/data-table-W1sK5tkL.cjs +0 -1154
- package/dist/chunks/data-table-W1sK5tkL.cjs.map +0 -1
- package/dist/chunks/date-picker-CNPORxhv.mjs.map +0 -1
- package/dist/chunks/date-picker-CZo68Fkl.cjs.map +0 -1
- package/dist/chunks/dialog-CYFiWN8M.cjs.map +0 -1
- package/dist/chunks/dialog-DUWnV9tN.mjs.map +0 -1
- package/dist/chunks/drawer-CLjsYdxN.cjs.map +0 -1
- package/dist/chunks/drawer-D82Jz6KO.mjs.map +0 -1
- package/dist/chunks/form-B2vcaHwh.mjs.map +0 -1
- package/dist/chunks/form-CzH9GQc6.cjs.map +0 -1
- package/dist/chunks/hover-card-v0QwmVBU.cjs.map +0 -1
- package/dist/chunks/hover-card-xqwpmZNm.mjs.map +0 -1
- package/dist/chunks/icons-BxIzP2jd.cjs.map +0 -1
- package/dist/chunks/icons-DuumN7z-.mjs.map +0 -1
- package/dist/chunks/input-BWM6G7jq.cjs.map +0 -1
- package/dist/chunks/input-Bt_r_B_c.mjs.map +0 -1
- package/dist/chunks/multi-select-combobox-D46M-AN9.mjs.map +0 -1
- package/dist/chunks/multi-select-combobox-dS6bJE_e.cjs.map +0 -1
- package/dist/chunks/otp-input-DSW9Ca_D.cjs.map +0 -1
- package/dist/chunks/otp-input-DeAi4nJ_.mjs.map +0 -1
- package/dist/chunks/password-strength-meter-CbNSBuh_.mjs.map +0 -1
- package/dist/chunks/password-strength-meter-DxMV6GAs.cjs.map +0 -1
- package/dist/chunks/progress-bar-B9sy7WBT.mjs.map +0 -1
- package/dist/chunks/progress-bar-BdvQtpm3.cjs.map +0 -1
- package/dist/chunks/select-B8UQ6Uq5.mjs.map +0 -1
- package/dist/chunks/select-CCUSMvfS.cjs.map +0 -1
- package/dist/chunks/skeleton-BNea1Rcp.cjs.map +0 -1
- package/dist/chunks/skeleton-CtLumdRw.mjs.map +0 -1
- package/dist/chunks/spotlight-card-BpZLMOp6.mjs.map +0 -1
- package/dist/chunks/spotlight-card-DS1dy1W3.cjs.map +0 -1
- package/dist/chunks/stepper-D6qQbZdg.cjs.map +0 -1
- package/dist/chunks/stepper-DUknuW2E.mjs.map +0 -1
- package/dist/chunks/sun-to-moon-button-B2Aje05o.mjs +0 -186
- package/dist/chunks/sun-to-moon-button-B2Aje05o.mjs.map +0 -1
- package/dist/chunks/sun-to-moon-button-BmFwRBye.cjs +0 -192
- package/dist/chunks/sun-to-moon-button-BmFwRBye.cjs.map +0 -1
- package/dist/chunks/switch-C5otDb4c.cjs.map +0 -1
- package/dist/chunks/switch-DOVl_i_s.mjs.map +0 -1
- package/dist/chunks/textarea-Blky_fLK.mjs.map +0 -1
- package/dist/chunks/textarea-ok_NlE2p.cjs.map +0 -1
- package/dist/chunks/theme-7DWLxJK_.cjs.map +0 -1
- package/dist/chunks/theme-BceKeYhw.mjs.map +0 -1
- package/dist/chunks/toast-CvfP7PUP.mjs.map +0 -1
- package/dist/chunks/toast-Ds7_19Ap.cjs.map +0 -1
- package/dist/chunks/tooltip-efHETBo1.mjs.map +0 -1
- package/dist/chunks/tooltip-nkIqViGk.cjs.map +0 -1
- package/dist/chunks/typography-CLu6Hx9j.mjs.map +0 -1
- package/dist/chunks/typography-DaLu9tty.cjs.map +0 -1
package/dist/chip.cjs
CHANGED
|
@@ -1,3 +1,5 @@
|
|
|
1
1
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
2
|
-
const require_chip = require("./chunks/chip-
|
|
2
|
+
const require_chip = require("./chunks/chip-BY83_HK7.cjs");
|
|
3
3
|
exports.Chip = require_chip.Chip;
|
|
4
|
+
exports.SplitChip = require_chip.SplitChip;
|
|
5
|
+
exports.StatusDotChip = require_chip.StatusDotChip;
|
package/dist/chip.mjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import {
|
|
2
|
-
export { Chip };
|
|
1
|
+
import { n as StatusDotChip, r as Chip, t as SplitChip } from "./chunks/chip-CbO8-1lK.mjs";
|
|
2
|
+
export { Chip, SplitChip, StatusDotChip };
|
package/dist/chroma-grid.cjs
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
2
|
-
const require_chroma_grid = require("./chunks/chroma-grid-
|
|
2
|
+
const require_chroma_grid = require("./chunks/chroma-grid-DP__XtmV.cjs");
|
|
3
3
|
exports.ChromaGrid = require_chroma_grid.ChromaGrid;
|
package/dist/chroma-grid.mjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { t as ChromaGrid } from "./chunks/chroma-grid-
|
|
1
|
+
import { t as ChromaGrid } from "./chunks/chroma-grid-CexX28VQ.mjs";
|
|
2
2
|
export { ChromaGrid };
|
|
@@ -5,12 +5,12 @@ let react_jsx_runtime = require("react/jsx-runtime");
|
|
|
5
5
|
let framer_motion = require("framer-motion");
|
|
6
6
|
//#region src/components/effects/hover-border-gradient/HoverBorderGradient.tsx
|
|
7
7
|
var movingMap = {
|
|
8
|
-
TOP: "radial-gradient(50.7% 50% at 50% 0%, var(--
|
|
9
|
-
LEFT: "radial-gradient(25.6% 43.1% at 0% 50%, var(--
|
|
10
|
-
BOTTOM: "radial-gradient(50.7% 50% at 50% 100%, var(--
|
|
11
|
-
RIGHT: "radial-gradient(25.2% 41% at 100% 50%, var(--
|
|
8
|
+
TOP: "radial-gradient(50.7% 50% at 50% 0%, var(--ds-gradient-accent-hover) 0%, transparent 100%)",
|
|
9
|
+
LEFT: "radial-gradient(25.6% 43.1% at 0% 50%, var(--ds-gradient-accent-hover) 0%, transparent 100%)",
|
|
10
|
+
BOTTOM: "radial-gradient(50.7% 50% at 50% 100%, var(--ds-gradient-accent-hover) 0%, transparent 100%)",
|
|
11
|
+
RIGHT: "radial-gradient(25.2% 41% at 100% 50%, var(--ds-gradient-accent-hover) 0%, transparent 100%)"
|
|
12
12
|
};
|
|
13
|
-
var highlight = `radial-gradient(85% 181% at 50% 50%, var(--
|
|
13
|
+
var highlight = `radial-gradient(85% 181% at 50% 50%, var(--ds-gradient-accent-hover) 0%, transparent 100%)`;
|
|
14
14
|
function HoverBorderGradient({ containerClassName, className, duration = 1, clockwise = true, children, ...props }) {
|
|
15
15
|
const [hovered, setHovered] = (0, react.useState)(false);
|
|
16
16
|
const [direction, setDirection] = (0, react.useState)("TOP");
|
|
@@ -42,10 +42,10 @@ function HoverBorderGradient({ containerClassName, className, duration = 1, cloc
|
|
|
42
42
|
type: "button",
|
|
43
43
|
onMouseEnter: handleMouseEnter,
|
|
44
44
|
onMouseLeave: handleMouseLeave,
|
|
45
|
-
className: require_utils.mergeClassNames("relative flex h-min w-fit flex-col flex-nowrap content-center items-center justify-center gap-10 overflow-visible rounded-lg border border-
|
|
45
|
+
className: require_utils.mergeClassNames("relative flex h-min w-fit flex-col flex-nowrap content-center items-center justify-center gap-10 overflow-visible rounded-lg border border-ds-border-2 p-px transition duration-500", containerClassName),
|
|
46
46
|
...props,
|
|
47
47
|
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
48
|
-
className: require_utils.mergeClassNames("bg-
|
|
48
|
+
className: require_utils.mergeClassNames("bg-ds-surface-1 text-ds-1 z-10 w-auto rounded-[inherit] px-4 py-2", className),
|
|
49
49
|
children
|
|
50
50
|
}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(framer_motion.motion.div, {
|
|
51
51
|
className: require_utils.mergeClassNames("absolute inset-0 z-0 flex-none overflow-hidden rounded-[inherit]"),
|
|
@@ -72,4 +72,4 @@ Object.defineProperty(exports, "HoverBorderGradient", {
|
|
|
72
72
|
}
|
|
73
73
|
});
|
|
74
74
|
|
|
75
|
-
//# sourceMappingURL=HoverBorderGradient-
|
|
75
|
+
//# sourceMappingURL=HoverBorderGradient-C5D6lGg0.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"HoverBorderGradient-C5D6lGg0.cjs","names":[],"sources":["../../src/components/effects/hover-border-gradient/HoverBorderGradient.tsx"],"sourcesContent":["import { mergeClassNames } from \"../../../utils\";\nimport { motion } from \"framer-motion\";\nimport { useCallback, useEffect, useState } from \"react\";\n\ntype Direction = \"TOP\" | \"LEFT\" | \"BOTTOM\" | \"RIGHT\";\n\ntype HoverBorderGradientProps =\n React.ButtonHTMLAttributes<HTMLButtonElement> & {\n containerClassName?: string;\n className?: string;\n duration?: number;\n clockwise?: boolean;\n children?: React.ReactNode;\n };\n\nconst movingMap: Record<Direction, string> = {\n TOP: \"radial-gradient(50.7% 50% at 50% 0%, var(--ds-gradient-accent-hover) 0%, transparent 100%)\",\n LEFT: \"radial-gradient(25.6% 43.1% at 0% 50%, var(--ds-gradient-accent-hover) 0%, transparent 100%)\",\n BOTTOM:\n \"radial-gradient(50.7% 50% at 50% 100%, var(--ds-gradient-accent-hover) 0%, transparent 100%)\",\n RIGHT:\n \"radial-gradient(25.2% 41% at 100% 50%, var(--ds-gradient-accent-hover) 0%, transparent 100%)\",\n};\n\nconst highlight = `radial-gradient(85% 181% at 50% 50%, var(--ds-gradient-accent-hover) 0%, transparent 100%)`;\n\nexport function HoverBorderGradient({\n containerClassName,\n className,\n duration = 1,\n clockwise = true,\n children,\n ...props\n}: HoverBorderGradientProps) {\n const [hovered, setHovered] = useState(false);\n const [direction, setDirection] = useState<Direction>(\"TOP\");\n\n const rotateDirection = useCallback(\n (current: Direction): Direction => {\n const directions: Direction[] = [\"TOP\", \"LEFT\", \"BOTTOM\", \"RIGHT\"];\n const index = directions.indexOf(current);\n const nextIndex = clockwise\n ? (index - 1 + directions.length) % directions.length\n : (index + 1) % directions.length;\n return directions[nextIndex];\n },\n [clockwise],\n );\n\n useEffect(() => {\n if (!hovered) {\n const interval = setInterval(() => {\n setDirection((prevState) => rotateDirection(prevState));\n }, duration * 1000);\n return () => clearInterval(interval);\n }\n }, [hovered, duration, rotateDirection]);\n\n const handleMouseEnter = () => setHovered(true);\n const handleMouseLeave = () => setHovered(false);\n\n return (\n <button\n type=\"button\"\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n className={mergeClassNames(\n \"relative flex h-min w-fit flex-col flex-nowrap content-center items-center justify-center gap-10 overflow-visible rounded-lg border border-ds-border-2 p-px transition duration-500\",\n containerClassName,\n )}\n {...props}\n >\n <div\n className={mergeClassNames(\n \"bg-ds-surface-1 text-ds-1 z-10 w-auto rounded-[inherit] px-4 py-2\",\n className,\n )}\n >\n {children}\n </div>\n <motion.div\n className={mergeClassNames(\n \"absolute inset-0 z-0 flex-none overflow-hidden rounded-[inherit]\",\n )}\n style={{\n filter: \"blur(2px)\",\n position: \"absolute\",\n width: \"100%\",\n height: \"100%\",\n }}\n initial={{ background: movingMap[direction] }}\n animate={{\n background: hovered\n ? [movingMap[direction], highlight]\n : movingMap[direction],\n }}\n transition={{ ease: \"linear\", duration: duration ?? 1 }}\n />\n </button>\n );\n}\n"],"mappings":";;;;;;AAeA,IAAM,YAAuC;CAC3C,KAAK;CACL,MAAM;CACN,QACE;CACF,OACE;CACH;AAED,IAAM,YAAY;AAElB,SAAgB,oBAAoB,EAClC,oBACA,WACA,WAAW,GACX,YAAY,MACZ,UACA,GAAG,SACwB;CAC3B,MAAM,CAAC,SAAS,eAAA,GAAA,MAAA,UAAuB,MAAM;CAC7C,MAAM,CAAC,WAAW,iBAAA,GAAA,MAAA,UAAoC,MAAM;CAE5D,MAAM,mBAAA,GAAA,MAAA,cACH,YAAkC;EACjC,MAAM,aAA0B;GAAC;GAAO;GAAQ;GAAU;GAAQ;EAClE,MAAM,QAAQ,WAAW,QAAQ,QAAQ;AAIzC,SAAO,WAHW,aACb,QAAQ,IAAI,WAAW,UAAU,WAAW,UAC5C,QAAQ,KAAK,WAAW;IAG/B,CAAC,UAAU,CACZ;AAED,EAAA,GAAA,MAAA,iBAAgB;AACd,MAAI,CAAC,SAAS;GACZ,MAAM,WAAW,kBAAkB;AACjC,kBAAc,cAAc,gBAAgB,UAAU,CAAC;MACtD,WAAW,IAAK;AACnB,gBAAa,cAAc,SAAS;;IAErC;EAAC;EAAS;EAAU;EAAgB,CAAC;CAExC,MAAM,yBAAyB,WAAW,KAAK;CAC/C,MAAM,yBAAyB,WAAW,MAAM;AAEhD,QACE,iBAAA,GAAA,kBAAA,MAAC,UAAD;EACE,MAAK;EACL,cAAc;EACd,cAAc;EACd,WAAW,cAAA,gBACT,uLACA,mBACD;EACD,GAAI;YARN,CAUE,iBAAA,GAAA,kBAAA,KAAC,OAAD;GACE,WAAW,cAAA,gBACT,qEACA,UACD;GAEA;GACG,CAAA,EACN,iBAAA,GAAA,kBAAA,KAAC,cAAA,OAAO,KAAR;GACE,WAAW,cAAA,gBACT,mEACD;GACD,OAAO;IACL,QAAQ;IACR,UAAU;IACV,OAAO;IACP,QAAQ;IACT;GACD,SAAS,EAAE,YAAY,UAAU,YAAY;GAC7C,SAAS,EACP,YAAY,UACR,CAAC,UAAU,YAAY,UAAU,GACjC,UAAU,YACf;GACD,YAAY;IAAE,MAAM;IAAU,UAAU,YAAY;IAAG;GACvD,CAAA,CACK"}
|
|
@@ -4,12 +4,12 @@ import { jsx, jsxs } from "react/jsx-runtime";
|
|
|
4
4
|
import { motion } from "framer-motion";
|
|
5
5
|
//#region src/components/effects/hover-border-gradient/HoverBorderGradient.tsx
|
|
6
6
|
var movingMap = {
|
|
7
|
-
TOP: "radial-gradient(50.7% 50% at 50% 0%, var(--
|
|
8
|
-
LEFT: "radial-gradient(25.6% 43.1% at 0% 50%, var(--
|
|
9
|
-
BOTTOM: "radial-gradient(50.7% 50% at 50% 100%, var(--
|
|
10
|
-
RIGHT: "radial-gradient(25.2% 41% at 100% 50%, var(--
|
|
7
|
+
TOP: "radial-gradient(50.7% 50% at 50% 0%, var(--ds-gradient-accent-hover) 0%, transparent 100%)",
|
|
8
|
+
LEFT: "radial-gradient(25.6% 43.1% at 0% 50%, var(--ds-gradient-accent-hover) 0%, transparent 100%)",
|
|
9
|
+
BOTTOM: "radial-gradient(50.7% 50% at 50% 100%, var(--ds-gradient-accent-hover) 0%, transparent 100%)",
|
|
10
|
+
RIGHT: "radial-gradient(25.2% 41% at 100% 50%, var(--ds-gradient-accent-hover) 0%, transparent 100%)"
|
|
11
11
|
};
|
|
12
|
-
var highlight = `radial-gradient(85% 181% at 50% 50%, var(--
|
|
12
|
+
var highlight = `radial-gradient(85% 181% at 50% 50%, var(--ds-gradient-accent-hover) 0%, transparent 100%)`;
|
|
13
13
|
function HoverBorderGradient({ containerClassName, className, duration = 1, clockwise = true, children, ...props }) {
|
|
14
14
|
const [hovered, setHovered] = useState(false);
|
|
15
15
|
const [direction, setDirection] = useState("TOP");
|
|
@@ -41,10 +41,10 @@ function HoverBorderGradient({ containerClassName, className, duration = 1, cloc
|
|
|
41
41
|
type: "button",
|
|
42
42
|
onMouseEnter: handleMouseEnter,
|
|
43
43
|
onMouseLeave: handleMouseLeave,
|
|
44
|
-
className: mergeClassNames("relative flex h-min w-fit flex-col flex-nowrap content-center items-center justify-center gap-10 overflow-visible rounded-lg border border-
|
|
44
|
+
className: mergeClassNames("relative flex h-min w-fit flex-col flex-nowrap content-center items-center justify-center gap-10 overflow-visible rounded-lg border border-ds-border-2 p-px transition duration-500", containerClassName),
|
|
45
45
|
...props,
|
|
46
46
|
children: [/* @__PURE__ */ jsx("div", {
|
|
47
|
-
className: mergeClassNames("bg-
|
|
47
|
+
className: mergeClassNames("bg-ds-surface-1 text-ds-1 z-10 w-auto rounded-[inherit] px-4 py-2", className),
|
|
48
48
|
children
|
|
49
49
|
}), /* @__PURE__ */ jsx(motion.div, {
|
|
50
50
|
className: mergeClassNames("absolute inset-0 z-0 flex-none overflow-hidden rounded-[inherit]"),
|
|
@@ -66,4 +66,4 @@ function HoverBorderGradient({ containerClassName, className, duration = 1, cloc
|
|
|
66
66
|
//#endregion
|
|
67
67
|
export { HoverBorderGradient as t };
|
|
68
68
|
|
|
69
|
-
//# sourceMappingURL=HoverBorderGradient-
|
|
69
|
+
//# sourceMappingURL=HoverBorderGradient-CduqqQgX.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"HoverBorderGradient-CduqqQgX.mjs","names":[],"sources":["../../src/components/effects/hover-border-gradient/HoverBorderGradient.tsx"],"sourcesContent":["import { mergeClassNames } from \"../../../utils\";\nimport { motion } from \"framer-motion\";\nimport { useCallback, useEffect, useState } from \"react\";\n\ntype Direction = \"TOP\" | \"LEFT\" | \"BOTTOM\" | \"RIGHT\";\n\ntype HoverBorderGradientProps =\n React.ButtonHTMLAttributes<HTMLButtonElement> & {\n containerClassName?: string;\n className?: string;\n duration?: number;\n clockwise?: boolean;\n children?: React.ReactNode;\n };\n\nconst movingMap: Record<Direction, string> = {\n TOP: \"radial-gradient(50.7% 50% at 50% 0%, var(--ds-gradient-accent-hover) 0%, transparent 100%)\",\n LEFT: \"radial-gradient(25.6% 43.1% at 0% 50%, var(--ds-gradient-accent-hover) 0%, transparent 100%)\",\n BOTTOM:\n \"radial-gradient(50.7% 50% at 50% 100%, var(--ds-gradient-accent-hover) 0%, transparent 100%)\",\n RIGHT:\n \"radial-gradient(25.2% 41% at 100% 50%, var(--ds-gradient-accent-hover) 0%, transparent 100%)\",\n};\n\nconst highlight = `radial-gradient(85% 181% at 50% 50%, var(--ds-gradient-accent-hover) 0%, transparent 100%)`;\n\nexport function HoverBorderGradient({\n containerClassName,\n className,\n duration = 1,\n clockwise = true,\n children,\n ...props\n}: HoverBorderGradientProps) {\n const [hovered, setHovered] = useState(false);\n const [direction, setDirection] = useState<Direction>(\"TOP\");\n\n const rotateDirection = useCallback(\n (current: Direction): Direction => {\n const directions: Direction[] = [\"TOP\", \"LEFT\", \"BOTTOM\", \"RIGHT\"];\n const index = directions.indexOf(current);\n const nextIndex = clockwise\n ? (index - 1 + directions.length) % directions.length\n : (index + 1) % directions.length;\n return directions[nextIndex];\n },\n [clockwise],\n );\n\n useEffect(() => {\n if (!hovered) {\n const interval = setInterval(() => {\n setDirection((prevState) => rotateDirection(prevState));\n }, duration * 1000);\n return () => clearInterval(interval);\n }\n }, [hovered, duration, rotateDirection]);\n\n const handleMouseEnter = () => setHovered(true);\n const handleMouseLeave = () => setHovered(false);\n\n return (\n <button\n type=\"button\"\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n className={mergeClassNames(\n \"relative flex h-min w-fit flex-col flex-nowrap content-center items-center justify-center gap-10 overflow-visible rounded-lg border border-ds-border-2 p-px transition duration-500\",\n containerClassName,\n )}\n {...props}\n >\n <div\n className={mergeClassNames(\n \"bg-ds-surface-1 text-ds-1 z-10 w-auto rounded-[inherit] px-4 py-2\",\n className,\n )}\n >\n {children}\n </div>\n <motion.div\n className={mergeClassNames(\n \"absolute inset-0 z-0 flex-none overflow-hidden rounded-[inherit]\",\n )}\n style={{\n filter: \"blur(2px)\",\n position: \"absolute\",\n width: \"100%\",\n height: \"100%\",\n }}\n initial={{ background: movingMap[direction] }}\n animate={{\n background: hovered\n ? [movingMap[direction], highlight]\n : movingMap[direction],\n }}\n transition={{ ease: \"linear\", duration: duration ?? 1 }}\n />\n </button>\n );\n}\n"],"mappings":";;;;;AAeA,IAAM,YAAuC;CAC3C,KAAK;CACL,MAAM;CACN,QACE;CACF,OACE;CACH;AAED,IAAM,YAAY;AAElB,SAAgB,oBAAoB,EAClC,oBACA,WACA,WAAW,GACX,YAAY,MACZ,UACA,GAAG,SACwB;CAC3B,MAAM,CAAC,SAAS,cAAc,SAAS,MAAM;CAC7C,MAAM,CAAC,WAAW,gBAAgB,SAAoB,MAAM;CAE5D,MAAM,kBAAkB,aACrB,YAAkC;EACjC,MAAM,aAA0B;GAAC;GAAO;GAAQ;GAAU;GAAQ;EAClE,MAAM,QAAQ,WAAW,QAAQ,QAAQ;AAIzC,SAAO,WAHW,aACb,QAAQ,IAAI,WAAW,UAAU,WAAW,UAC5C,QAAQ,KAAK,WAAW;IAG/B,CAAC,UAAU,CACZ;AAED,iBAAgB;AACd,MAAI,CAAC,SAAS;GACZ,MAAM,WAAW,kBAAkB;AACjC,kBAAc,cAAc,gBAAgB,UAAU,CAAC;MACtD,WAAW,IAAK;AACnB,gBAAa,cAAc,SAAS;;IAErC;EAAC;EAAS;EAAU;EAAgB,CAAC;CAExC,MAAM,yBAAyB,WAAW,KAAK;CAC/C,MAAM,yBAAyB,WAAW,MAAM;AAEhD,QACE,qBAAC,UAAD;EACE,MAAK;EACL,cAAc;EACd,cAAc;EACd,WAAW,gBACT,uLACA,mBACD;EACD,GAAI;YARN,CAUE,oBAAC,OAAD;GACE,WAAW,gBACT,qEACA,UACD;GAEA;GACG,CAAA,EACN,oBAAC,OAAO,KAAR;GACE,WAAW,gBACT,mEACD;GACD,OAAO;IACL,QAAQ;IACR,UAAU;IACV,OAAO;IACP,QAAQ;IACT;GACD,SAAS,EAAE,YAAY,UAAU,YAAY;GAC7C,SAAS,EACP,YAAY,UACR,CAAC,UAAU,YAAY,UAAU,GACjC,UAAU,YACf;GACD,YAAY;IAAE,MAAM;IAAU,UAAU,YAAY;IAAG;GACvD,CAAA,CACK"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { N as ChevronDownIcon } from "./icons-
|
|
1
|
+
import { N as ChevronDownIcon } from "./icons-bx3nrxNv.mjs";
|
|
2
2
|
import { useState } from "react";
|
|
3
3
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
4
4
|
//#region src/components/navigation/accordion/Accordion.tsx
|
|
@@ -24,10 +24,10 @@ var Accordion = ({ items, type = "single", defaultOpenIds = type === "single" &&
|
|
|
24
24
|
children: items.map((item) => {
|
|
25
25
|
const open = openItems.includes(item.id);
|
|
26
26
|
return /* @__PURE__ */ jsxs("div", {
|
|
27
|
-
className: cx("rounded-xl
|
|
27
|
+
className: cx("rounded-xl border border-ds-border-2 bg-ds-surface-1 backdrop-blur-2xl transition-all duration-300", "hover:border-ds-border-1 hover:bg-ds-surface-2", open && "ring-2 ring-ds-focus/40", separated ? "p-0" : ""),
|
|
28
28
|
children: [/* @__PURE__ */ jsxs("button", {
|
|
29
29
|
type: "button",
|
|
30
|
-
className: cx("flex w-full items-center justify-between gap-4 px-5 py-4 rounded-xl transition-colors duration-200", "text-
|
|
30
|
+
className: cx("flex w-full items-center justify-between gap-4 px-5 py-4 rounded-xl transition-colors duration-200", "text-ds-1 hover:bg-ds-surface-2", separated ? "border-b border-ds-border-2" : "", item.disabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer"),
|
|
31
31
|
"aria-expanded": open,
|
|
32
32
|
"aria-controls": `${item.id}-content`,
|
|
33
33
|
id: `${item.id}-trigger`,
|
|
@@ -36,14 +36,14 @@ var Accordion = ({ items, type = "single", defaultOpenIds = type === "single" &&
|
|
|
36
36
|
children: [/* @__PURE__ */ jsxs("div", {
|
|
37
37
|
className: "text-left flex-1",
|
|
38
38
|
children: [/* @__PURE__ */ jsx("p", {
|
|
39
|
-
className: "text-base font-semibold text-
|
|
39
|
+
className: "text-base font-semibold text-ds-1",
|
|
40
40
|
children: item.title
|
|
41
41
|
}), item.description && /* @__PURE__ */ jsx("p", {
|
|
42
|
-
className: "
|
|
42
|
+
className: "mt-0.5 text-sm text-ds-2",
|
|
43
43
|
children: item.description
|
|
44
44
|
})]
|
|
45
45
|
}), /* @__PURE__ */ jsx("span", {
|
|
46
|
-
className: cx("p-1.5 rounded-lg transition-all duration-300", "bg-
|
|
46
|
+
className: cx("p-1.5 rounded-lg transition-all duration-300", "bg-ds-surface-2 text-ds-2", open && "rotate-180 bg-ds-accent-subtle text-ds-1"),
|
|
47
47
|
children: caret
|
|
48
48
|
})]
|
|
49
49
|
}), /* @__PURE__ */ jsx("div", {
|
|
@@ -52,7 +52,7 @@ var Accordion = ({ items, type = "single", defaultOpenIds = type === "single" &&
|
|
|
52
52
|
"aria-labelledby": `${item.id}-trigger`,
|
|
53
53
|
className: cx("overflow-hidden transition-all duration-300 ease-in-out", open ? "max-h-[1000px] opacity-100" : "max-h-0 opacity-0"),
|
|
54
54
|
children: /* @__PURE__ */ jsx("div", {
|
|
55
|
-
className: "px-5 pb-5 pt-2 text-sm
|
|
55
|
+
className: "px-5 pb-5 pt-2 text-sm leading-relaxed text-ds-2",
|
|
56
56
|
children: item.content
|
|
57
57
|
})
|
|
58
58
|
})]
|
|
@@ -63,4 +63,4 @@ var Accordion = ({ items, type = "single", defaultOpenIds = type === "single" &&
|
|
|
63
63
|
//#endregion
|
|
64
64
|
export { Accordion as t };
|
|
65
65
|
|
|
66
|
-
//# sourceMappingURL=accordion-
|
|
66
|
+
//# sourceMappingURL=accordion-6zxJUYXr.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"accordion-6zxJUYXr.mjs","names":[],"sources":["../../src/components/navigation/accordion/Accordion.tsx"],"sourcesContent":["import { useState } from \"react\";\n\nimport { ChevronDownIcon } from \"../../icons\";\nimport type { AccordionProps } from \"./types\";\n\nconst cx = (...classes: Array<string | false | undefined>) =>\n classes.filter(Boolean).join(\" \").replace(/\\s+/g, \" \").trim();\n\nconst caret = (\n <ChevronDownIcon\n className=\"h-5 w-5 transition-transform duration-300\"\n aria-hidden=\"true\"\n />\n);\n\nexport const Accordion = ({\n items,\n type = \"single\",\n defaultOpenIds = type === \"single\" && items.length ? [items[0].id] : [],\n value,\n onValueChange,\n className = \"\",\n separated = false,\n}: AccordionProps) => {\n const [internalOpen, setInternalOpen] = useState<string[]>(defaultOpenIds);\n const controlled = Array.isArray(value);\n const openItems = controlled ? value! : internalOpen;\n\n const toggleItem = (id: string) => {\n let next: string[];\n const isOpen = openItems.includes(id);\n\n if (type === \"single\") {\n next = isOpen ? [] : [id];\n } else {\n next = isOpen\n ? openItems.filter((openId) => openId !== id)\n : [...openItems, id];\n }\n\n if (!controlled) {\n setInternalOpen(next);\n }\n onValueChange?.(next);\n };\n\n return (\n <div className={cx(\"space-y-3\", className)}>\n {items.map((item) => {\n const open = openItems.includes(item.id);\n return (\n <div\n key={item.id}\n className={cx(\n \"rounded-xl border border-ds-border-2 bg-ds-surface-1 backdrop-blur-2xl transition-all duration-300\",\n \"hover:border-ds-border-1 hover:bg-ds-surface-2\",\n // Ring highlight on open\n open && \"ring-2 ring-ds-focus/40\",\n separated ? \"p-0\" : \"\",\n )}\n >\n <button\n type=\"button\"\n className={cx(\n \"flex w-full items-center justify-between gap-4 px-5 py-4 rounded-xl transition-colors duration-200\",\n \"text-ds-1 hover:bg-ds-surface-2\",\n separated ? \"border-b border-ds-border-2\" : \"\",\n item.disabled\n ? \"opacity-50 cursor-not-allowed\"\n : \"cursor-pointer\",\n )}\n aria-expanded={open}\n aria-controls={`${item.id}-content`}\n id={`${item.id}-trigger`}\n onClick={() => !item.disabled && toggleItem(item.id)}\n disabled={item.disabled}\n >\n <div className=\"text-left flex-1\">\n <p className=\"text-base font-semibold text-ds-1\">\n {item.title}\n </p>\n {item.description && (\n <p className=\"mt-0.5 text-sm text-ds-2\">{item.description}</p>\n )}\n </div>\n <span\n className={cx(\n \"p-1.5 rounded-lg transition-all duration-300\",\n \"bg-ds-surface-2 text-ds-2\",\n open && \"rotate-180 bg-ds-accent-subtle text-ds-1\",\n )}\n >\n {caret}\n </span>\n </button>\n <div\n id={`${item.id}-content`}\n role=\"region\"\n aria-labelledby={`${item.id}-trigger`}\n className={cx(\n \"overflow-hidden transition-all duration-300 ease-in-out\",\n open ? \"max-h-[1000px] opacity-100\" : \"max-h-0 opacity-0\",\n )}\n >\n <div className=\"px-5 pb-5 pt-2 text-sm leading-relaxed text-ds-2\">\n {item.content}\n </div>\n </div>\n </div>\n );\n })}\n </div>\n );\n};\n"],"mappings":";;;;AAKA,IAAM,MAAM,GAAG,YACb,QAAQ,OAAO,QAAQ,CAAC,KAAK,IAAI,CAAC,QAAQ,QAAQ,IAAI,CAAC,MAAM;AAE/D,IAAM,QACJ,oBAAC,iBAAD;CACE,WAAU;CACV,eAAY;CACZ,CAAA;AAGJ,IAAa,aAAa,EACxB,OACA,OAAO,UACP,iBAAiB,SAAS,YAAY,MAAM,SAAS,CAAC,MAAM,GAAG,GAAG,GAAG,EAAE,EACvE,OACA,eACA,YAAY,IACZ,YAAY,YACQ;CACpB,MAAM,CAAC,cAAc,mBAAmB,SAAmB,eAAe;CAC1E,MAAM,aAAa,MAAM,QAAQ,MAAM;CACvC,MAAM,YAAY,aAAa,QAAS;CAExC,MAAM,cAAc,OAAe;EACjC,IAAI;EACJ,MAAM,SAAS,UAAU,SAAS,GAAG;AAErC,MAAI,SAAS,SACX,QAAO,SAAS,EAAE,GAAG,CAAC,GAAG;MAEzB,QAAO,SACH,UAAU,QAAQ,WAAW,WAAW,GAAG,GAC3C,CAAC,GAAG,WAAW,GAAG;AAGxB,MAAI,CAAC,WACH,iBAAgB,KAAK;AAEvB,kBAAgB,KAAK;;AAGvB,QACE,oBAAC,OAAD;EAAK,WAAW,GAAG,aAAa,UAAU;YACvC,MAAM,KAAK,SAAS;GACnB,MAAM,OAAO,UAAU,SAAS,KAAK,GAAG;AACxC,UACE,qBAAC,OAAD;IAEE,WAAW,GACT,sGACA,kDAEA,QAAQ,2BACR,YAAY,QAAQ,GACrB;cARH,CAUE,qBAAC,UAAD;KACE,MAAK;KACL,WAAW,GACT,sGACA,mCACA,YAAY,gCAAgC,IAC5C,KAAK,WACD,kCACA,iBACL;KACD,iBAAe;KACf,iBAAe,GAAG,KAAK,GAAG;KAC1B,IAAI,GAAG,KAAK,GAAG;KACf,eAAe,CAAC,KAAK,YAAY,WAAW,KAAK,GAAG;KACpD,UAAU,KAAK;eAdjB,CAgBE,qBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,oBAAC,KAAD;OAAG,WAAU;iBACV,KAAK;OACJ,CAAA,EACH,KAAK,eACJ,oBAAC,KAAD;OAAG,WAAU;iBAA4B,KAAK;OAAgB,CAAA,CAE5D;SACN,oBAAC,QAAD;MACE,WAAW,GACT,gDACA,6BACA,QAAQ,2CACT;gBAEA;MACI,CAAA,CACA;QACT,oBAAC,OAAD;KACE,IAAI,GAAG,KAAK,GAAG;KACf,MAAK;KACL,mBAAiB,GAAG,KAAK,GAAG;KAC5B,WAAW,GACT,2DACA,OAAO,+BAA+B,oBACvC;eAED,oBAAC,OAAD;MAAK,WAAU;gBACZ,KAAK;MACF,CAAA;KACF,CAAA,CACF;MAxDC,KAAK,GAwDN;IAER;EACE,CAAA"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
require("./chunk-B_GkZjkl.cjs");
|
|
2
|
-
const require_icons = require("./icons-
|
|
2
|
+
const require_icons = require("./icons-CRanVZB1.cjs");
|
|
3
3
|
let react = require("react");
|
|
4
4
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
5
5
|
//#region src/components/navigation/accordion/Accordion.tsx
|
|
@@ -25,10 +25,10 @@ var Accordion = ({ items, type = "single", defaultOpenIds = type === "single" &&
|
|
|
25
25
|
children: items.map((item) => {
|
|
26
26
|
const open = openItems.includes(item.id);
|
|
27
27
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
28
|
-
className: cx("rounded-xl
|
|
28
|
+
className: cx("rounded-xl border border-ds-border-2 bg-ds-surface-1 backdrop-blur-2xl transition-all duration-300", "hover:border-ds-border-1 hover:bg-ds-surface-2", open && "ring-2 ring-ds-focus/40", separated ? "p-0" : ""),
|
|
29
29
|
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
|
|
30
30
|
type: "button",
|
|
31
|
-
className: cx("flex w-full items-center justify-between gap-4 px-5 py-4 rounded-xl transition-colors duration-200", "text-
|
|
31
|
+
className: cx("flex w-full items-center justify-between gap-4 px-5 py-4 rounded-xl transition-colors duration-200", "text-ds-1 hover:bg-ds-surface-2", separated ? "border-b border-ds-border-2" : "", item.disabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer"),
|
|
32
32
|
"aria-expanded": open,
|
|
33
33
|
"aria-controls": `${item.id}-content`,
|
|
34
34
|
id: `${item.id}-trigger`,
|
|
@@ -37,14 +37,14 @@ var Accordion = ({ items, type = "single", defaultOpenIds = type === "single" &&
|
|
|
37
37
|
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
38
38
|
className: "text-left flex-1",
|
|
39
39
|
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
|
|
40
|
-
className: "text-base font-semibold text-
|
|
40
|
+
className: "text-base font-semibold text-ds-1",
|
|
41
41
|
children: item.title
|
|
42
42
|
}), item.description && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
|
|
43
|
-
className: "
|
|
43
|
+
className: "mt-0.5 text-sm text-ds-2",
|
|
44
44
|
children: item.description
|
|
45
45
|
})]
|
|
46
46
|
}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
|
|
47
|
-
className: cx("p-1.5 rounded-lg transition-all duration-300", "bg-
|
|
47
|
+
className: cx("p-1.5 rounded-lg transition-all duration-300", "bg-ds-surface-2 text-ds-2", open && "rotate-180 bg-ds-accent-subtle text-ds-1"),
|
|
48
48
|
children: caret
|
|
49
49
|
})]
|
|
50
50
|
}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
@@ -53,7 +53,7 @@ var Accordion = ({ items, type = "single", defaultOpenIds = type === "single" &&
|
|
|
53
53
|
"aria-labelledby": `${item.id}-trigger`,
|
|
54
54
|
className: cx("overflow-hidden transition-all duration-300 ease-in-out", open ? "max-h-[1000px] opacity-100" : "max-h-0 opacity-0"),
|
|
55
55
|
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
56
|
-
className: "px-5 pb-5 pt-2 text-sm
|
|
56
|
+
className: "px-5 pb-5 pt-2 text-sm leading-relaxed text-ds-2",
|
|
57
57
|
children: item.content
|
|
58
58
|
})
|
|
59
59
|
})]
|
|
@@ -69,4 +69,4 @@ Object.defineProperty(exports, "Accordion", {
|
|
|
69
69
|
}
|
|
70
70
|
});
|
|
71
71
|
|
|
72
|
-
//# sourceMappingURL=accordion-
|
|
72
|
+
//# sourceMappingURL=accordion-CmB6EidC.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"accordion-CmB6EidC.cjs","names":[],"sources":["../../src/components/navigation/accordion/Accordion.tsx"],"sourcesContent":["import { useState } from \"react\";\n\nimport { ChevronDownIcon } from \"../../icons\";\nimport type { AccordionProps } from \"./types\";\n\nconst cx = (...classes: Array<string | false | undefined>) =>\n classes.filter(Boolean).join(\" \").replace(/\\s+/g, \" \").trim();\n\nconst caret = (\n <ChevronDownIcon\n className=\"h-5 w-5 transition-transform duration-300\"\n aria-hidden=\"true\"\n />\n);\n\nexport const Accordion = ({\n items,\n type = \"single\",\n defaultOpenIds = type === \"single\" && items.length ? [items[0].id] : [],\n value,\n onValueChange,\n className = \"\",\n separated = false,\n}: AccordionProps) => {\n const [internalOpen, setInternalOpen] = useState<string[]>(defaultOpenIds);\n const controlled = Array.isArray(value);\n const openItems = controlled ? value! : internalOpen;\n\n const toggleItem = (id: string) => {\n let next: string[];\n const isOpen = openItems.includes(id);\n\n if (type === \"single\") {\n next = isOpen ? [] : [id];\n } else {\n next = isOpen\n ? openItems.filter((openId) => openId !== id)\n : [...openItems, id];\n }\n\n if (!controlled) {\n setInternalOpen(next);\n }\n onValueChange?.(next);\n };\n\n return (\n <div className={cx(\"space-y-3\", className)}>\n {items.map((item) => {\n const open = openItems.includes(item.id);\n return (\n <div\n key={item.id}\n className={cx(\n \"rounded-xl border border-ds-border-2 bg-ds-surface-1 backdrop-blur-2xl transition-all duration-300\",\n \"hover:border-ds-border-1 hover:bg-ds-surface-2\",\n // Ring highlight on open\n open && \"ring-2 ring-ds-focus/40\",\n separated ? \"p-0\" : \"\",\n )}\n >\n <button\n type=\"button\"\n className={cx(\n \"flex w-full items-center justify-between gap-4 px-5 py-4 rounded-xl transition-colors duration-200\",\n \"text-ds-1 hover:bg-ds-surface-2\",\n separated ? \"border-b border-ds-border-2\" : \"\",\n item.disabled\n ? \"opacity-50 cursor-not-allowed\"\n : \"cursor-pointer\",\n )}\n aria-expanded={open}\n aria-controls={`${item.id}-content`}\n id={`${item.id}-trigger`}\n onClick={() => !item.disabled && toggleItem(item.id)}\n disabled={item.disabled}\n >\n <div className=\"text-left flex-1\">\n <p className=\"text-base font-semibold text-ds-1\">\n {item.title}\n </p>\n {item.description && (\n <p className=\"mt-0.5 text-sm text-ds-2\">{item.description}</p>\n )}\n </div>\n <span\n className={cx(\n \"p-1.5 rounded-lg transition-all duration-300\",\n \"bg-ds-surface-2 text-ds-2\",\n open && \"rotate-180 bg-ds-accent-subtle text-ds-1\",\n )}\n >\n {caret}\n </span>\n </button>\n <div\n id={`${item.id}-content`}\n role=\"region\"\n aria-labelledby={`${item.id}-trigger`}\n className={cx(\n \"overflow-hidden transition-all duration-300 ease-in-out\",\n open ? \"max-h-[1000px] opacity-100\" : \"max-h-0 opacity-0\",\n )}\n >\n <div className=\"px-5 pb-5 pt-2 text-sm leading-relaxed text-ds-2\">\n {item.content}\n </div>\n </div>\n </div>\n );\n })}\n </div>\n );\n};\n"],"mappings":";;;;;AAKA,IAAM,MAAM,GAAG,YACb,QAAQ,OAAO,QAAQ,CAAC,KAAK,IAAI,CAAC,QAAQ,QAAQ,IAAI,CAAC,MAAM;AAE/D,IAAM,QACJ,iBAAA,GAAA,kBAAA,KAAC,cAAA,iBAAD;CACE,WAAU;CACV,eAAY;CACZ,CAAA;AAGJ,IAAa,aAAa,EACxB,OACA,OAAO,UACP,iBAAiB,SAAS,YAAY,MAAM,SAAS,CAAC,MAAM,GAAG,GAAG,GAAG,EAAE,EACvE,OACA,eACA,YAAY,IACZ,YAAY,YACQ;CACpB,MAAM,CAAC,cAAc,oBAAA,GAAA,MAAA,UAAsC,eAAe;CAC1E,MAAM,aAAa,MAAM,QAAQ,MAAM;CACvC,MAAM,YAAY,aAAa,QAAS;CAExC,MAAM,cAAc,OAAe;EACjC,IAAI;EACJ,MAAM,SAAS,UAAU,SAAS,GAAG;AAErC,MAAI,SAAS,SACX,QAAO,SAAS,EAAE,GAAG,CAAC,GAAG;MAEzB,QAAO,SACH,UAAU,QAAQ,WAAW,WAAW,GAAG,GAC3C,CAAC,GAAG,WAAW,GAAG;AAGxB,MAAI,CAAC,WACH,iBAAgB,KAAK;AAEvB,kBAAgB,KAAK;;AAGvB,QACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EAAK,WAAW,GAAG,aAAa,UAAU;YACvC,MAAM,KAAK,SAAS;GACnB,MAAM,OAAO,UAAU,SAAS,KAAK,GAAG;AACxC,UACE,iBAAA,GAAA,kBAAA,MAAC,OAAD;IAEE,WAAW,GACT,sGACA,kDAEA,QAAQ,2BACR,YAAY,QAAQ,GACrB;cARH,CAUE,iBAAA,GAAA,kBAAA,MAAC,UAAD;KACE,MAAK;KACL,WAAW,GACT,sGACA,mCACA,YAAY,gCAAgC,IAC5C,KAAK,WACD,kCACA,iBACL;KACD,iBAAe;KACf,iBAAe,GAAG,KAAK,GAAG;KAC1B,IAAI,GAAG,KAAK,GAAG;KACf,eAAe,CAAC,KAAK,YAAY,WAAW,KAAK,GAAG;KACpD,UAAU,KAAK;eAdjB,CAgBE,iBAAA,GAAA,kBAAA,MAAC,OAAD;MAAK,WAAU;gBAAf,CACE,iBAAA,GAAA,kBAAA,KAAC,KAAD;OAAG,WAAU;iBACV,KAAK;OACJ,CAAA,EACH,KAAK,eACJ,iBAAA,GAAA,kBAAA,KAAC,KAAD;OAAG,WAAU;iBAA4B,KAAK;OAAgB,CAAA,CAE5D;SACN,iBAAA,GAAA,kBAAA,KAAC,QAAD;MACE,WAAW,GACT,gDACA,6BACA,QAAQ,2CACT;gBAEA;MACI,CAAA,CACA;QACT,iBAAA,GAAA,kBAAA,KAAC,OAAD;KACE,IAAI,GAAG,KAAK,GAAG;KACf,MAAK;KACL,mBAAiB,GAAG,KAAK,GAAG;KAC5B,WAAW,GACT,2DACA,OAAO,+BAA+B,oBACvC;eAED,iBAAA,GAAA,kBAAA,KAAC,OAAD;MAAK,WAAU;gBACZ,KAAK;MACF,CAAA;KACF,CAAA,CACF;MAxDC,KAAK,GAwDN;IAER;EACE,CAAA"}
|
|
@@ -0,0 +1,81 @@
|
|
|
1
|
+
require("./chunk-B_GkZjkl.cjs");
|
|
2
|
+
const require_icons = require("./icons-CRanVZB1.cjs");
|
|
3
|
+
let react_jsx_runtime = require("react/jsx-runtime");
|
|
4
|
+
//#region src/components/feedback/alert/Alert.tsx
|
|
5
|
+
var variantStyles = {
|
|
6
|
+
info: {
|
|
7
|
+
container: "border-ds-state-info-border bg-ds-state-info-surface",
|
|
8
|
+
icon: "text-ds-state-info-text",
|
|
9
|
+
title: "text-ds-state-info-text",
|
|
10
|
+
description: "text-ds-1"
|
|
11
|
+
},
|
|
12
|
+
success: {
|
|
13
|
+
container: "border-ds-state-success-border bg-ds-state-success-surface",
|
|
14
|
+
icon: "text-ds-state-success-text",
|
|
15
|
+
title: "text-ds-state-success-text",
|
|
16
|
+
description: "text-ds-1"
|
|
17
|
+
},
|
|
18
|
+
warning: {
|
|
19
|
+
container: "border-ds-state-warning-border bg-ds-state-warning-surface",
|
|
20
|
+
icon: "text-ds-state-warning-text",
|
|
21
|
+
title: "text-ds-state-warning-text",
|
|
22
|
+
description: "text-ds-1"
|
|
23
|
+
},
|
|
24
|
+
destructive: {
|
|
25
|
+
container: "border-ds-state-error-border bg-ds-state-error-surface",
|
|
26
|
+
icon: "text-ds-state-error-text",
|
|
27
|
+
title: "text-ds-state-error-text",
|
|
28
|
+
description: "text-ds-1"
|
|
29
|
+
}
|
|
30
|
+
};
|
|
31
|
+
var defaultIcon = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_icons.InfoCircleIcon, {
|
|
32
|
+
className: "h-5 w-5",
|
|
33
|
+
"aria-hidden": "true"
|
|
34
|
+
});
|
|
35
|
+
var Alert = ({ title, description, icon = defaultIcon, variant = "info", colorOverrides, style, className = "", children }) => {
|
|
36
|
+
const resolvedVariant = variant === "error" ? "destructive" : variant;
|
|
37
|
+
const styles = variantStyles[resolvedVariant];
|
|
38
|
+
const classes = `flex gap-3 rounded-lg border p-4 text-sm ${styles.container}`.concat(" ", className).trim();
|
|
39
|
+
const containerStyle = {
|
|
40
|
+
...style,
|
|
41
|
+
...colorOverrides?.background ? { backgroundColor: colorOverrides.background } : {},
|
|
42
|
+
...colorOverrides?.border ? { borderColor: colorOverrides.border } : {}
|
|
43
|
+
};
|
|
44
|
+
const iconStyle = colorOverrides?.icon ? { color: colorOverrides.icon } : {};
|
|
45
|
+
const titleStyle = colorOverrides?.title ? { color: colorOverrides.title } : {};
|
|
46
|
+
const descriptionStyle = colorOverrides?.description ? { color: colorOverrides.description } : {};
|
|
47
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
48
|
+
className: classes,
|
|
49
|
+
style: containerStyle,
|
|
50
|
+
role: resolvedVariant === "destructive" ? "alert" : "status",
|
|
51
|
+
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
|
|
52
|
+
className: styles.icon,
|
|
53
|
+
style: iconStyle,
|
|
54
|
+
children: icon
|
|
55
|
+
}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
56
|
+
className: "space-y-1",
|
|
57
|
+
children: [
|
|
58
|
+
title && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
|
|
59
|
+
className: `text-base font-medium ${styles.title}`,
|
|
60
|
+
style: titleStyle,
|
|
61
|
+
children: title
|
|
62
|
+
}),
|
|
63
|
+
description && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
|
|
64
|
+
className: styles.description,
|
|
65
|
+
style: descriptionStyle,
|
|
66
|
+
children: description
|
|
67
|
+
}),
|
|
68
|
+
children
|
|
69
|
+
]
|
|
70
|
+
})]
|
|
71
|
+
});
|
|
72
|
+
};
|
|
73
|
+
//#endregion
|
|
74
|
+
Object.defineProperty(exports, "Alert", {
|
|
75
|
+
enumerable: true,
|
|
76
|
+
get: function() {
|
|
77
|
+
return Alert;
|
|
78
|
+
}
|
|
79
|
+
});
|
|
80
|
+
|
|
81
|
+
//# sourceMappingURL=alert-C5KEeQqh.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"alert-C5KEeQqh.cjs","names":[],"sources":["../../src/components/feedback/alert/Alert.tsx"],"sourcesContent":["import { InfoCircleIcon } from \"../../icons\";\nimport type { AlertProps } from \"./types\";\nimport type { CSSProperties } from \"react\";\n\ntype ResolvedAlertVariant = \"info\" | \"success\" | \"warning\" | \"destructive\";\n\nconst variantStyles: Record<\n ResolvedAlertVariant,\n {\n container: string;\n icon: string;\n title: string;\n description: string;\n }\n> = {\n info: {\n container: \"border-ds-state-info-border bg-ds-state-info-surface\",\n icon: \"text-ds-state-info-text\",\n title: \"text-ds-state-info-text\",\n description: \"text-ds-1\",\n },\n success: {\n container: \"border-ds-state-success-border bg-ds-state-success-surface\",\n icon: \"text-ds-state-success-text\",\n title: \"text-ds-state-success-text\",\n description: \"text-ds-1\",\n },\n warning: {\n container: \"border-ds-state-warning-border bg-ds-state-warning-surface\",\n icon: \"text-ds-state-warning-text\",\n title: \"text-ds-state-warning-text\",\n description: \"text-ds-1\",\n },\n destructive: {\n container: \"border-ds-state-error-border bg-ds-state-error-surface\",\n icon: \"text-ds-state-error-text\",\n title: \"text-ds-state-error-text\",\n description: \"text-ds-1\",\n },\n};\n\nconst defaultIcon = <InfoCircleIcon className=\"h-5 w-5\" aria-hidden=\"true\" />;\n\nexport const Alert = ({\n title,\n description,\n icon = defaultIcon,\n variant = \"info\",\n colorOverrides,\n style,\n className = \"\",\n children,\n}: AlertProps) => {\n const resolvedVariant: ResolvedAlertVariant =\n variant === \"error\" ? \"destructive\" : variant;\n const styles = variantStyles[resolvedVariant];\n const classes = `flex gap-3 rounded-lg border p-4 text-sm ${styles.container}`\n .concat(\" \", className)\n .trim();\n const containerStyle: CSSProperties = {\n ...style,\n ...(colorOverrides?.background\n ? { backgroundColor: colorOverrides.background }\n : {}),\n ...(colorOverrides?.border ? { borderColor: colorOverrides.border } : {}),\n };\n const iconStyle: CSSProperties = colorOverrides?.icon\n ? { color: colorOverrides.icon }\n : {};\n const titleStyle: CSSProperties = colorOverrides?.title\n ? { color: colorOverrides.title }\n : {};\n const descriptionStyle: CSSProperties = colorOverrides?.description\n ? { color: colorOverrides.description }\n : {};\n\n return (\n <div\n className={classes}\n style={containerStyle}\n role={resolvedVariant === \"destructive\" ? \"alert\" : \"status\"}\n >\n <span className={styles.icon} style={iconStyle}>\n {icon}\n </span>\n <div className=\"space-y-1\">\n {title && (\n <p\n className={`text-base font-medium ${styles.title}`}\n style={titleStyle}\n >\n {title}\n </p>\n )}\n {description && (\n <p className={styles.description} style={descriptionStyle}>\n {description}\n </p>\n )}\n {children}\n </div>\n </div>\n );\n};\n"],"mappings":";;;;AAMA,IAAM,gBAQF;CACF,MAAM;EACJ,WAAW;EACX,MAAM;EACN,OAAO;EACP,aAAa;EACd;CACD,SAAS;EACP,WAAW;EACX,MAAM;EACN,OAAO;EACP,aAAa;EACd;CACD,SAAS;EACP,WAAW;EACX,MAAM;EACN,OAAO;EACP,aAAa;EACd;CACD,aAAa;EACX,WAAW;EACX,MAAM;EACN,OAAO;EACP,aAAa;EACd;CACF;AAED,IAAM,cAAc,iBAAA,GAAA,kBAAA,KAAC,cAAA,gBAAD;CAAgB,WAAU;CAAU,eAAY;CAAS,CAAA;AAE7E,IAAa,SAAS,EACpB,OACA,aACA,OAAO,aACP,UAAU,QACV,gBACA,OACA,YAAY,IACZ,eACgB;CAChB,MAAM,kBACJ,YAAY,UAAU,gBAAgB;CACxC,MAAM,SAAS,cAAc;CAC7B,MAAM,UAAU,4CAA4C,OAAO,YAChE,OAAO,KAAK,UAAU,CACtB,MAAM;CACT,MAAM,iBAAgC;EACpC,GAAG;EACH,GAAI,gBAAgB,aAChB,EAAE,iBAAiB,eAAe,YAAY,GAC9C,EAAE;EACN,GAAI,gBAAgB,SAAS,EAAE,aAAa,eAAe,QAAQ,GAAG,EAAE;EACzE;CACD,MAAM,YAA2B,gBAAgB,OAC7C,EAAE,OAAO,eAAe,MAAM,GAC9B,EAAE;CACN,MAAM,aAA4B,gBAAgB,QAC9C,EAAE,OAAO,eAAe,OAAO,GAC/B,EAAE;CACN,MAAM,mBAAkC,gBAAgB,cACpD,EAAE,OAAO,eAAe,aAAa,GACrC,EAAE;AAEN,QACE,iBAAA,GAAA,kBAAA,MAAC,OAAD;EACE,WAAW;EACX,OAAO;EACP,MAAM,oBAAoB,gBAAgB,UAAU;YAHtD,CAKE,iBAAA,GAAA,kBAAA,KAAC,QAAD;GAAM,WAAW,OAAO;GAAM,OAAO;aAClC;GACI,CAAA,EACP,iBAAA,GAAA,kBAAA,MAAC,OAAD;GAAK,WAAU;aAAf;IACG,SACC,iBAAA,GAAA,kBAAA,KAAC,KAAD;KACE,WAAW,yBAAyB,OAAO;KAC3C,OAAO;eAEN;KACC,CAAA;IAEL,eACC,iBAAA,GAAA,kBAAA,KAAC,KAAD;KAAG,WAAW,OAAO;KAAa,OAAO;eACtC;KACC,CAAA;IAEL;IACG;KACF"}
|
|
@@ -0,0 +1,75 @@
|
|
|
1
|
+
import { u as InfoCircleIcon } from "./icons-bx3nrxNv.mjs";
|
|
2
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
|
+
//#region src/components/feedback/alert/Alert.tsx
|
|
4
|
+
var variantStyles = {
|
|
5
|
+
info: {
|
|
6
|
+
container: "border-ds-state-info-border bg-ds-state-info-surface",
|
|
7
|
+
icon: "text-ds-state-info-text",
|
|
8
|
+
title: "text-ds-state-info-text",
|
|
9
|
+
description: "text-ds-1"
|
|
10
|
+
},
|
|
11
|
+
success: {
|
|
12
|
+
container: "border-ds-state-success-border bg-ds-state-success-surface",
|
|
13
|
+
icon: "text-ds-state-success-text",
|
|
14
|
+
title: "text-ds-state-success-text",
|
|
15
|
+
description: "text-ds-1"
|
|
16
|
+
},
|
|
17
|
+
warning: {
|
|
18
|
+
container: "border-ds-state-warning-border bg-ds-state-warning-surface",
|
|
19
|
+
icon: "text-ds-state-warning-text",
|
|
20
|
+
title: "text-ds-state-warning-text",
|
|
21
|
+
description: "text-ds-1"
|
|
22
|
+
},
|
|
23
|
+
destructive: {
|
|
24
|
+
container: "border-ds-state-error-border bg-ds-state-error-surface",
|
|
25
|
+
icon: "text-ds-state-error-text",
|
|
26
|
+
title: "text-ds-state-error-text",
|
|
27
|
+
description: "text-ds-1"
|
|
28
|
+
}
|
|
29
|
+
};
|
|
30
|
+
var defaultIcon = /* @__PURE__ */ jsx(InfoCircleIcon, {
|
|
31
|
+
className: "h-5 w-5",
|
|
32
|
+
"aria-hidden": "true"
|
|
33
|
+
});
|
|
34
|
+
var Alert = ({ title, description, icon = defaultIcon, variant = "info", colorOverrides, style, className = "", children }) => {
|
|
35
|
+
const resolvedVariant = variant === "error" ? "destructive" : variant;
|
|
36
|
+
const styles = variantStyles[resolvedVariant];
|
|
37
|
+
const classes = `flex gap-3 rounded-lg border p-4 text-sm ${styles.container}`.concat(" ", className).trim();
|
|
38
|
+
const containerStyle = {
|
|
39
|
+
...style,
|
|
40
|
+
...colorOverrides?.background ? { backgroundColor: colorOverrides.background } : {},
|
|
41
|
+
...colorOverrides?.border ? { borderColor: colorOverrides.border } : {}
|
|
42
|
+
};
|
|
43
|
+
const iconStyle = colorOverrides?.icon ? { color: colorOverrides.icon } : {};
|
|
44
|
+
const titleStyle = colorOverrides?.title ? { color: colorOverrides.title } : {};
|
|
45
|
+
const descriptionStyle = colorOverrides?.description ? { color: colorOverrides.description } : {};
|
|
46
|
+
return /* @__PURE__ */ jsxs("div", {
|
|
47
|
+
className: classes,
|
|
48
|
+
style: containerStyle,
|
|
49
|
+
role: resolvedVariant === "destructive" ? "alert" : "status",
|
|
50
|
+
children: [/* @__PURE__ */ jsx("span", {
|
|
51
|
+
className: styles.icon,
|
|
52
|
+
style: iconStyle,
|
|
53
|
+
children: icon
|
|
54
|
+
}), /* @__PURE__ */ jsxs("div", {
|
|
55
|
+
className: "space-y-1",
|
|
56
|
+
children: [
|
|
57
|
+
title && /* @__PURE__ */ jsx("p", {
|
|
58
|
+
className: `text-base font-medium ${styles.title}`,
|
|
59
|
+
style: titleStyle,
|
|
60
|
+
children: title
|
|
61
|
+
}),
|
|
62
|
+
description && /* @__PURE__ */ jsx("p", {
|
|
63
|
+
className: styles.description,
|
|
64
|
+
style: descriptionStyle,
|
|
65
|
+
children: description
|
|
66
|
+
}),
|
|
67
|
+
children
|
|
68
|
+
]
|
|
69
|
+
})]
|
|
70
|
+
});
|
|
71
|
+
};
|
|
72
|
+
//#endregion
|
|
73
|
+
export { Alert as t };
|
|
74
|
+
|
|
75
|
+
//# sourceMappingURL=alert-XVmYJgds.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"alert-XVmYJgds.mjs","names":[],"sources":["../../src/components/feedback/alert/Alert.tsx"],"sourcesContent":["import { InfoCircleIcon } from \"../../icons\";\nimport type { AlertProps } from \"./types\";\nimport type { CSSProperties } from \"react\";\n\ntype ResolvedAlertVariant = \"info\" | \"success\" | \"warning\" | \"destructive\";\n\nconst variantStyles: Record<\n ResolvedAlertVariant,\n {\n container: string;\n icon: string;\n title: string;\n description: string;\n }\n> = {\n info: {\n container: \"border-ds-state-info-border bg-ds-state-info-surface\",\n icon: \"text-ds-state-info-text\",\n title: \"text-ds-state-info-text\",\n description: \"text-ds-1\",\n },\n success: {\n container: \"border-ds-state-success-border bg-ds-state-success-surface\",\n icon: \"text-ds-state-success-text\",\n title: \"text-ds-state-success-text\",\n description: \"text-ds-1\",\n },\n warning: {\n container: \"border-ds-state-warning-border bg-ds-state-warning-surface\",\n icon: \"text-ds-state-warning-text\",\n title: \"text-ds-state-warning-text\",\n description: \"text-ds-1\",\n },\n destructive: {\n container: \"border-ds-state-error-border bg-ds-state-error-surface\",\n icon: \"text-ds-state-error-text\",\n title: \"text-ds-state-error-text\",\n description: \"text-ds-1\",\n },\n};\n\nconst defaultIcon = <InfoCircleIcon className=\"h-5 w-5\" aria-hidden=\"true\" />;\n\nexport const Alert = ({\n title,\n description,\n icon = defaultIcon,\n variant = \"info\",\n colorOverrides,\n style,\n className = \"\",\n children,\n}: AlertProps) => {\n const resolvedVariant: ResolvedAlertVariant =\n variant === \"error\" ? \"destructive\" : variant;\n const styles = variantStyles[resolvedVariant];\n const classes = `flex gap-3 rounded-lg border p-4 text-sm ${styles.container}`\n .concat(\" \", className)\n .trim();\n const containerStyle: CSSProperties = {\n ...style,\n ...(colorOverrides?.background\n ? { backgroundColor: colorOverrides.background }\n : {}),\n ...(colorOverrides?.border ? { borderColor: colorOverrides.border } : {}),\n };\n const iconStyle: CSSProperties = colorOverrides?.icon\n ? { color: colorOverrides.icon }\n : {};\n const titleStyle: CSSProperties = colorOverrides?.title\n ? { color: colorOverrides.title }\n : {};\n const descriptionStyle: CSSProperties = colorOverrides?.description\n ? { color: colorOverrides.description }\n : {};\n\n return (\n <div\n className={classes}\n style={containerStyle}\n role={resolvedVariant === \"destructive\" ? \"alert\" : \"status\"}\n >\n <span className={styles.icon} style={iconStyle}>\n {icon}\n </span>\n <div className=\"space-y-1\">\n {title && (\n <p\n className={`text-base font-medium ${styles.title}`}\n style={titleStyle}\n >\n {title}\n </p>\n )}\n {description && (\n <p className={styles.description} style={descriptionStyle}>\n {description}\n </p>\n )}\n {children}\n </div>\n </div>\n );\n};\n"],"mappings":";;;AAMA,IAAM,gBAQF;CACF,MAAM;EACJ,WAAW;EACX,MAAM;EACN,OAAO;EACP,aAAa;EACd;CACD,SAAS;EACP,WAAW;EACX,MAAM;EACN,OAAO;EACP,aAAa;EACd;CACD,SAAS;EACP,WAAW;EACX,MAAM;EACN,OAAO;EACP,aAAa;EACd;CACD,aAAa;EACX,WAAW;EACX,MAAM;EACN,OAAO;EACP,aAAa;EACd;CACF;AAED,IAAM,cAAc,oBAAC,gBAAD;CAAgB,WAAU;CAAU,eAAY;CAAS,CAAA;AAE7E,IAAa,SAAS,EACpB,OACA,aACA,OAAO,aACP,UAAU,QACV,gBACA,OACA,YAAY,IACZ,eACgB;CAChB,MAAM,kBACJ,YAAY,UAAU,gBAAgB;CACxC,MAAM,SAAS,cAAc;CAC7B,MAAM,UAAU,4CAA4C,OAAO,YAChE,OAAO,KAAK,UAAU,CACtB,MAAM;CACT,MAAM,iBAAgC;EACpC,GAAG;EACH,GAAI,gBAAgB,aAChB,EAAE,iBAAiB,eAAe,YAAY,GAC9C,EAAE;EACN,GAAI,gBAAgB,SAAS,EAAE,aAAa,eAAe,QAAQ,GAAG,EAAE;EACzE;CACD,MAAM,YAA2B,gBAAgB,OAC7C,EAAE,OAAO,eAAe,MAAM,GAC9B,EAAE;CACN,MAAM,aAA4B,gBAAgB,QAC9C,EAAE,OAAO,eAAe,OAAO,GAC/B,EAAE;CACN,MAAM,mBAAkC,gBAAgB,cACpD,EAAE,OAAO,eAAe,aAAa,GACrC,EAAE;AAEN,QACE,qBAAC,OAAD;EACE,WAAW;EACX,OAAO;EACP,MAAM,oBAAoB,gBAAgB,UAAU;YAHtD,CAKE,oBAAC,QAAD;GAAM,WAAW,OAAO;GAAM,OAAO;aAClC;GACI,CAAA,EACP,qBAAC,OAAD;GAAK,WAAU;aAAf;IACG,SACC,oBAAC,KAAD;KACE,WAAW,yBAAyB,OAAO;KAC3C,OAAO;eAEN;KACC,CAAA;IAEL,eACC,oBAAC,KAAD;KAAG,WAAW,OAAO;KAAa,OAAO;eACtC;KACC,CAAA;IAEL;IACG;KACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"animated-content-CttSmLWV.cjs","names":[],"sources":["../../src/components/effects/animated-content/AnimatedContent.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\nimport { motion, useInView, type TargetAndTransition } from \"framer-motion\";\nimport type {\n AnimatedContentProps,\n AnimationPreset,\n AnimationEase,\n} from \"./types\";\n\n// Easing function mappings\nconst easingMap: Record<AnimationEase, number[] | string> = {\n linear: [0, 0, 1, 1],\n easeIn: [0.4, 0, 1, 1],\n easeOut: [0, 0, 0.2, 1],\n easeInOut: [0.4, 0, 0.2, 1],\n circIn: [0.55, 0, 1, 0.45],\n circOut: [0, 0.55, 0.45, 1],\n circInOut: [0.85, 0, 0.15, 1],\n backIn: [0.36, 0, 0.66, -0.56],\n backOut: [0.34, 1.56, 0.64, 1],\n backInOut: [0.68, -0.6, 0.32, 1.6],\n anticipate: \"anticipate\",\n bounce: \"easeOut\",\n elastic: \"easeOut\",\n};\n\n// Get spring config for bouncy/elastic animations\nconst getSpringConfig = (ease: AnimationEase) => {\n switch (ease) {\n case \"bounce\":\n return {\n type: \"spring\" as const,\n damping: 8,\n stiffness: 200,\n bounce: 0.5,\n };\n case \"elastic\":\n return { type: \"spring\" as const, damping: 10, stiffness: 100 };\n default:\n return null;\n }\n};\n\n// Preset animation configurations\nconst getPresetAnimation = (\n preset: AnimationPreset,\n distance: number,\n initialOpacity: number,\n initialScale: number,\n reverse: boolean,\n): {\n initial: TargetAndTransition;\n animate: TargetAndTransition;\n exit: TargetAndTransition;\n} => {\n const dir = reverse ? -1 : 1;\n\n const presets: Record<\n AnimationPreset,\n {\n initial: TargetAndTransition;\n animate: TargetAndTransition;\n exit: TargetAndTransition;\n }\n > = {\n fade: {\n initial: { opacity: initialOpacity },\n animate: { opacity: 1 },\n exit: { opacity: 0 },\n },\n scale: {\n initial: { opacity: initialOpacity, scale: initialScale },\n animate: { opacity: 1, scale: 1 },\n exit: { opacity: 0, scale: initialScale },\n },\n slideUp: {\n initial: { opacity: initialOpacity, y: distance * dir },\n animate: { opacity: 1, y: 0 },\n exit: { opacity: 0, y: (distance / 2) * dir },\n },\n slideDown: {\n initial: { opacity: initialOpacity, y: -distance * dir },\n animate: { opacity: 1, y: 0 },\n exit: { opacity: 0, y: (-distance / 2) * dir },\n },\n slideLeft: {\n initial: { opacity: initialOpacity, x: distance * dir },\n animate: { opacity: 1, x: 0 },\n exit: { opacity: 0, x: (distance / 2) * dir },\n },\n slideRight: {\n initial: { opacity: initialOpacity, x: -distance * dir },\n animate: { opacity: 1, x: 0 },\n exit: { opacity: 0, x: (-distance / 2) * dir },\n },\n elastic: {\n initial: {\n opacity: initialOpacity,\n scale: initialScale,\n y: distance / 2,\n },\n animate: { opacity: 1, scale: 1, y: 0 },\n exit: { opacity: 0, scale: 0.8, y: distance / 4 },\n },\n bounce: {\n initial: { opacity: initialOpacity, scale: initialScale, y: -distance },\n animate: { opacity: 1, scale: 1, y: 0 },\n exit: { opacity: 0, scale: 0.5, y: -distance / 2 },\n },\n flip: {\n initial: { opacity: initialOpacity, rotateX: -90 * dir, scale: 0.9 },\n animate: { opacity: 1, rotateX: 0, scale: 1 },\n exit: { opacity: 0, rotateX: 90 * dir, scale: 0.9 },\n },\n zoom: {\n initial: { opacity: initialOpacity, scale: 0, rotate: -10 * dir },\n animate: { opacity: 1, scale: 1, rotate: 0 },\n exit: { opacity: 0, scale: 0.5, rotate: 5 * dir },\n },\n custom: {\n initial: { opacity: initialOpacity },\n animate: { opacity: 1 },\n exit: { opacity: 0 },\n },\n };\n\n return presets[preset];\n};\n\nexport const AnimatedContent = ({\n children,\n preset = \"fade\",\n direction = \"vertical\",\n ease = \"easeOut\",\n exitEase,\n reverse = false,\n animateOpacity = true,\n distance = 50,\n duration = 0.5,\n delay = 0,\n initialOpacity = 0,\n initialScale = 0.9,\n threshold = 0.1,\n disappearAfter = 0,\n disappearDuration = 0.3,\n triggerOnView = false,\n triggerOnce = true,\n className = \"\",\n as = \"div\",\n}: AnimatedContentProps) => {\n const ref = useRef<HTMLDivElement>(null);\n const isInView = useInView(ref, {\n once: triggerOnce,\n amount: threshold,\n });\n const [isVisible, setIsVisible] = useState(!triggerOnView);\n const [hasDisappeared, setHasDisappeared] = useState(false);\n\n // Handle view-triggered animation\n useEffect(() => {\n if (triggerOnView && isInView && !isVisible) {\n setIsVisible(true);\n }\n }, [isInView, triggerOnView, isVisible]);\n\n // Handle disappear after timeout\n useEffect(() => {\n if (disappearAfter > 0 && isVisible && !hasDisappeared) {\n const timer = setTimeout(() => {\n setHasDisappeared(true);\n }, disappearAfter * 1000);\n return () => clearTimeout(timer);\n }\n }, [disappearAfter, isVisible, hasDisappeared]);\n\n // Get animation config\n const opacity = animateOpacity ? initialOpacity : 1;\n const animation = getPresetAnimation(\n preset,\n distance,\n opacity,\n initialScale,\n reverse,\n );\n\n // Get transition config\n const springConfig = getSpringConfig(ease);\n const easingValue = easingMap[ease];\n\n const transition = springConfig || {\n duration,\n delay,\n ease: (typeof easingValue === \"string\" ? easingValue : easingValue) as any,\n };\n\n const exitTransition = exitEase\n ? { duration: disappearDuration, ease: easingMap[exitEase] }\n : { duration: disappearDuration };\n\n // Determine current animation state\n const shouldAnimate = triggerOnView ? isVisible : true;\n const currentState = hasDisappeared\n ? \"exit\"\n : shouldAnimate\n ? \"animate\"\n : \"initial\";\n\n const MotionComponent = (motion as any)[as] || motion.div;\n\n return (\n <MotionComponent\n ref={ref as any}\n className={className}\n initial={animation.initial}\n animate={\n currentState === \"animate\"\n ? animation.animate\n : currentState === \"exit\"\n ? animation.exit\n : animation.initial\n }\n transition={\n (currentState === \"exit\" ? exitTransition : transition) as any\n }\n style={{ perspective: preset === \"flip\" ? 1000 : undefined }}\n >\n {children}\n </MotionComponent>\n );\n};\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"animated-content-CLsFnjgr.cjs","names":[],"sources":["../../src/components/effects/animated-content/AnimatedContent.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\nimport { motion, useInView, type TargetAndTransition } from \"framer-motion\";\nimport type {\n AnimatedContentProps,\n AnimationPreset,\n AnimationEase,\n} from \"./types\";\n\n// Easing function mappings\nconst easingMap: Record<AnimationEase, number[] | string> = {\n linear: [0, 0, 1, 1],\n easeIn: [0.4, 0, 1, 1],\n easeOut: [0, 0, 0.2, 1],\n easeInOut: [0.4, 0, 0.2, 1],\n circIn: [0.55, 0, 1, 0.45],\n circOut: [0, 0.55, 0.45, 1],\n circInOut: [0.85, 0, 0.15, 1],\n backIn: [0.36, 0, 0.66, -0.56],\n backOut: [0.34, 1.56, 0.64, 1],\n backInOut: [0.68, -0.6, 0.32, 1.6],\n anticipate: \"anticipate\",\n bounce: \"easeOut\",\n elastic: \"easeOut\",\n};\n\n// Get spring config for bouncy/elastic animations\nconst getSpringConfig = (ease: AnimationEase) => {\n switch (ease) {\n case \"bounce\":\n return {\n type: \"spring\" as const,\n damping: 8,\n stiffness: 200,\n bounce: 0.5,\n };\n case \"elastic\":\n return { type: \"spring\" as const, damping: 10, stiffness: 100 };\n default:\n return null;\n }\n};\n\n// Preset animation configurations\nconst getPresetAnimation = (\n preset: AnimationPreset,\n distance: number,\n initialOpacity: number,\n initialScale: number,\n reverse: boolean,\n): {\n initial: TargetAndTransition;\n animate: TargetAndTransition;\n exit: TargetAndTransition;\n} => {\n const dir = reverse ? -1 : 1;\n\n const presets: Record<\n AnimationPreset,\n {\n initial: TargetAndTransition;\n animate: TargetAndTransition;\n exit: TargetAndTransition;\n }\n > = {\n fade: {\n initial: { opacity: initialOpacity },\n animate: { opacity: 1 },\n exit: { opacity: 0 },\n },\n scale: {\n initial: { opacity: initialOpacity, scale: initialScale },\n animate: { opacity: 1, scale: 1 },\n exit: { opacity: 0, scale: initialScale },\n },\n slideUp: {\n initial: { opacity: initialOpacity, y: distance * dir },\n animate: { opacity: 1, y: 0 },\n exit: { opacity: 0, y: (distance / 2) * dir },\n },\n slideDown: {\n initial: { opacity: initialOpacity, y: -distance * dir },\n animate: { opacity: 1, y: 0 },\n exit: { opacity: 0, y: (-distance / 2) * dir },\n },\n slideLeft: {\n initial: { opacity: initialOpacity, x: distance * dir },\n animate: { opacity: 1, x: 0 },\n exit: { opacity: 0, x: (distance / 2) * dir },\n },\n slideRight: {\n initial: { opacity: initialOpacity, x: -distance * dir },\n animate: { opacity: 1, x: 0 },\n exit: { opacity: 0, x: (-distance / 2) * dir },\n },\n elastic: {\n initial: {\n opacity: initialOpacity,\n scale: initialScale,\n y: distance / 2,\n },\n animate: { opacity: 1, scale: 1, y: 0 },\n exit: { opacity: 0, scale: 0.8, y: distance / 4 },\n },\n bounce: {\n initial: { opacity: initialOpacity, scale: initialScale, y: -distance },\n animate: { opacity: 1, scale: 1, y: 0 },\n exit: { opacity: 0, scale: 0.5, y: -distance / 2 },\n },\n flip: {\n initial: { opacity: initialOpacity, rotateX: -90 * dir, scale: 0.9 },\n animate: { opacity: 1, rotateX: 0, scale: 1 },\n exit: { opacity: 0, rotateX: 90 * dir, scale: 0.9 },\n },\n zoom: {\n initial: { opacity: initialOpacity, scale: 0, rotate: -10 * dir },\n animate: { opacity: 1, scale: 1, rotate: 0 },\n exit: { opacity: 0, scale: 0.5, rotate: 5 * dir },\n },\n custom: {\n initial: { opacity: initialOpacity },\n animate: { opacity: 1 },\n exit: { opacity: 0 },\n },\n };\n\n return presets[preset];\n};\n\nexport const AnimatedContent = ({\n children,\n preset = \"fade\",\n direction = \"vertical\",\n ease = \"easeOut\",\n exitEase,\n reverse = false,\n animateOpacity = true,\n distance = 50,\n duration = 0.5,\n delay = 0,\n initialOpacity = 0,\n initialScale = 0.9,\n threshold = 0.1,\n disappearAfter = 0,\n disappearDuration = 0.3,\n triggerOnView = false,\n triggerOnce = true,\n className = \"\",\n as = \"div\",\n}: AnimatedContentProps) => {\n const ref = useRef<HTMLDivElement>(null);\n const isInView = useInView(ref, {\n once: triggerOnce,\n amount: threshold,\n });\n const [isVisible, setIsVisible] = useState(!triggerOnView);\n const [hasDisappeared, setHasDisappeared] = useState(false);\n\n // Handle view-triggered animation\n useEffect(() => {\n if (triggerOnView && isInView && !isVisible) {\n setIsVisible(true);\n }\n }, [isInView, triggerOnView, isVisible]);\n\n // Handle disappear after timeout\n useEffect(() => {\n if (disappearAfter > 0 && isVisible && !hasDisappeared) {\n const timer = setTimeout(() => {\n setHasDisappeared(true);\n }, disappearAfter * 1000);\n return () => clearTimeout(timer);\n }\n }, [disappearAfter, isVisible, hasDisappeared]);\n\n // Get animation config\n const opacity = animateOpacity ? initialOpacity : 1;\n const animation = getPresetAnimation(\n preset,\n distance,\n opacity,\n initialScale,\n reverse,\n );\n\n // Get transition config\n const springConfig = getSpringConfig(ease);\n const easingValue = easingMap[ease];\n\n const transition = springConfig || {\n duration,\n delay,\n ease: (typeof easingValue === \"string\" ? easingValue : easingValue) as any,\n };\n\n const exitTransition = exitEase\n ? { duration: disappearDuration, ease: easingMap[exitEase] }\n : { duration: disappearDuration };\n\n // Determine current animation state\n const shouldAnimate = triggerOnView ? isVisible : true;\n const currentState = hasDisappeared\n ? \"exit\"\n : shouldAnimate\n ? \"animate\"\n : \"initial\";\n\n const MotionComponent = (motion as any)[as] || motion.div;\n\n return (\n <MotionComponent\n ref={ref as any}\n className={className}\n initial={animation.initial}\n animate={\n currentState === \"animate\"\n ? animation.animate\n : currentState === \"exit\"\n ? animation.exit\n : animation.initial\n }\n transition={\n (currentState === \"exit\" ? exitTransition : transition) as any\n }\n style={{ perspective: preset === \"flip\" ? 1000 : undefined }}\n >\n {children}\n </MotionComponent>\n );\n};\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"animated-content-C1uNg1xO.mjs","names":[],"sources":["../../src/components/effects/animated-content/AnimatedContent.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\nimport { motion, useInView, type TargetAndTransition } from \"framer-motion\";\nimport type {\n AnimatedContentProps,\n AnimationPreset,\n AnimationEase,\n} from \"./types\";\n\n// Easing function mappings\nconst easingMap: Record<AnimationEase, number[] | string> = {\n linear: [0, 0, 1, 1],\n easeIn: [0.4, 0, 1, 1],\n easeOut: [0, 0, 0.2, 1],\n easeInOut: [0.4, 0, 0.2, 1],\n circIn: [0.55, 0, 1, 0.45],\n circOut: [0, 0.55, 0.45, 1],\n circInOut: [0.85, 0, 0.15, 1],\n backIn: [0.36, 0, 0.66, -0.56],\n backOut: [0.34, 1.56, 0.64, 1],\n backInOut: [0.68, -0.6, 0.32, 1.6],\n anticipate: \"anticipate\",\n bounce: \"easeOut\",\n elastic: \"easeOut\",\n};\n\n// Get spring config for bouncy/elastic animations\nconst getSpringConfig = (ease: AnimationEase) => {\n switch (ease) {\n case \"bounce\":\n return {\n type: \"spring\" as const,\n damping: 8,\n stiffness: 200,\n bounce: 0.5,\n };\n case \"elastic\":\n return { type: \"spring\" as const, damping: 10, stiffness: 100 };\n default:\n return null;\n }\n};\n\n// Preset animation configurations\nconst getPresetAnimation = (\n preset: AnimationPreset,\n distance: number,\n initialOpacity: number,\n initialScale: number,\n reverse: boolean,\n): {\n initial: TargetAndTransition;\n animate: TargetAndTransition;\n exit: TargetAndTransition;\n} => {\n const dir = reverse ? -1 : 1;\n\n const presets: Record<\n AnimationPreset,\n {\n initial: TargetAndTransition;\n animate: TargetAndTransition;\n exit: TargetAndTransition;\n }\n > = {\n fade: {\n initial: { opacity: initialOpacity },\n animate: { opacity: 1 },\n exit: { opacity: 0 },\n },\n scale: {\n initial: { opacity: initialOpacity, scale: initialScale },\n animate: { opacity: 1, scale: 1 },\n exit: { opacity: 0, scale: initialScale },\n },\n slideUp: {\n initial: { opacity: initialOpacity, y: distance * dir },\n animate: { opacity: 1, y: 0 },\n exit: { opacity: 0, y: (distance / 2) * dir },\n },\n slideDown: {\n initial: { opacity: initialOpacity, y: -distance * dir },\n animate: { opacity: 1, y: 0 },\n exit: { opacity: 0, y: (-distance / 2) * dir },\n },\n slideLeft: {\n initial: { opacity: initialOpacity, x: distance * dir },\n animate: { opacity: 1, x: 0 },\n exit: { opacity: 0, x: (distance / 2) * dir },\n },\n slideRight: {\n initial: { opacity: initialOpacity, x: -distance * dir },\n animate: { opacity: 1, x: 0 },\n exit: { opacity: 0, x: (-distance / 2) * dir },\n },\n elastic: {\n initial: {\n opacity: initialOpacity,\n scale: initialScale,\n y: distance / 2,\n },\n animate: { opacity: 1, scale: 1, y: 0 },\n exit: { opacity: 0, scale: 0.8, y: distance / 4 },\n },\n bounce: {\n initial: { opacity: initialOpacity, scale: initialScale, y: -distance },\n animate: { opacity: 1, scale: 1, y: 0 },\n exit: { opacity: 0, scale: 0.5, y: -distance / 2 },\n },\n flip: {\n initial: { opacity: initialOpacity, rotateX: -90 * dir, scale: 0.9 },\n animate: { opacity: 1, rotateX: 0, scale: 1 },\n exit: { opacity: 0, rotateX: 90 * dir, scale: 0.9 },\n },\n zoom: {\n initial: { opacity: initialOpacity, scale: 0, rotate: -10 * dir },\n animate: { opacity: 1, scale: 1, rotate: 0 },\n exit: { opacity: 0, scale: 0.5, rotate: 5 * dir },\n },\n custom: {\n initial: { opacity: initialOpacity },\n animate: { opacity: 1 },\n exit: { opacity: 0 },\n },\n };\n\n return presets[preset];\n};\n\nexport const AnimatedContent = ({\n children,\n preset = \"fade\",\n direction = \"vertical\",\n ease = \"easeOut\",\n exitEase,\n reverse = false,\n animateOpacity = true,\n distance = 50,\n duration = 0.5,\n delay = 0,\n initialOpacity = 0,\n initialScale = 0.9,\n threshold = 0.1,\n disappearAfter = 0,\n disappearDuration = 0.3,\n triggerOnView = false,\n triggerOnce = true,\n className = \"\",\n as = \"div\",\n}: AnimatedContentProps) => {\n const ref = useRef<HTMLDivElement>(null);\n const isInView = useInView(ref, {\n once: triggerOnce,\n amount: threshold,\n });\n const [isVisible, setIsVisible] = useState(!triggerOnView);\n const [hasDisappeared, setHasDisappeared] = useState(false);\n\n // Handle view-triggered animation\n useEffect(() => {\n if (triggerOnView && isInView && !isVisible) {\n setIsVisible(true);\n }\n }, [isInView, triggerOnView, isVisible]);\n\n // Handle disappear after timeout\n useEffect(() => {\n if (disappearAfter > 0 && isVisible && !hasDisappeared) {\n const timer = setTimeout(() => {\n setHasDisappeared(true);\n }, disappearAfter * 1000);\n return () => clearTimeout(timer);\n }\n }, [disappearAfter, isVisible, hasDisappeared]);\n\n // Get animation config\n const opacity = animateOpacity ? initialOpacity : 1;\n const animation = getPresetAnimation(\n preset,\n distance,\n opacity,\n initialScale,\n reverse,\n );\n\n // Get transition config\n const springConfig = getSpringConfig(ease);\n const easingValue = easingMap[ease];\n\n const transition = springConfig || {\n duration,\n delay,\n ease: (typeof easingValue === \"string\" ? easingValue : easingValue) as any,\n };\n\n const exitTransition = exitEase\n ? { duration: disappearDuration, ease: easingMap[exitEase] }\n : { duration: disappearDuration };\n\n // Determine current animation state\n const shouldAnimate = triggerOnView ? isVisible : true;\n const currentState = hasDisappeared\n ? \"exit\"\n : shouldAnimate\n ? \"animate\"\n : \"initial\";\n\n const MotionComponent = (motion as any)[as] || motion.div;\n\n return (\n <MotionComponent\n ref={ref as any}\n className={className}\n initial={animation.initial}\n animate={\n currentState === \"animate\"\n ? animation.animate\n : currentState === \"exit\"\n ? animation.exit\n : animation.initial\n }\n transition={\n (currentState === \"exit\" ? exitTransition : transition) as any\n }\n style={{ perspective: preset === \"flip\" ? 1000 : undefined }}\n >\n {children}\n </MotionComponent>\n );\n};\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"animated-content-bK6xp-vc.mjs","names":[],"sources":["../../src/components/effects/animated-content/AnimatedContent.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\nimport { motion, useInView, type TargetAndTransition } from \"framer-motion\";\nimport type {\n AnimatedContentProps,\n AnimationPreset,\n AnimationEase,\n} from \"./types\";\n\n// Easing function mappings\nconst easingMap: Record<AnimationEase, number[] | string> = {\n linear: [0, 0, 1, 1],\n easeIn: [0.4, 0, 1, 1],\n easeOut: [0, 0, 0.2, 1],\n easeInOut: [0.4, 0, 0.2, 1],\n circIn: [0.55, 0, 1, 0.45],\n circOut: [0, 0.55, 0.45, 1],\n circInOut: [0.85, 0, 0.15, 1],\n backIn: [0.36, 0, 0.66, -0.56],\n backOut: [0.34, 1.56, 0.64, 1],\n backInOut: [0.68, -0.6, 0.32, 1.6],\n anticipate: \"anticipate\",\n bounce: \"easeOut\",\n elastic: \"easeOut\",\n};\n\n// Get spring config for bouncy/elastic animations\nconst getSpringConfig = (ease: AnimationEase) => {\n switch (ease) {\n case \"bounce\":\n return {\n type: \"spring\" as const,\n damping: 8,\n stiffness: 200,\n bounce: 0.5,\n };\n case \"elastic\":\n return { type: \"spring\" as const, damping: 10, stiffness: 100 };\n default:\n return null;\n }\n};\n\n// Preset animation configurations\nconst getPresetAnimation = (\n preset: AnimationPreset,\n distance: number,\n initialOpacity: number,\n initialScale: number,\n reverse: boolean,\n): {\n initial: TargetAndTransition;\n animate: TargetAndTransition;\n exit: TargetAndTransition;\n} => {\n const dir = reverse ? -1 : 1;\n\n const presets: Record<\n AnimationPreset,\n {\n initial: TargetAndTransition;\n animate: TargetAndTransition;\n exit: TargetAndTransition;\n }\n > = {\n fade: {\n initial: { opacity: initialOpacity },\n animate: { opacity: 1 },\n exit: { opacity: 0 },\n },\n scale: {\n initial: { opacity: initialOpacity, scale: initialScale },\n animate: { opacity: 1, scale: 1 },\n exit: { opacity: 0, scale: initialScale },\n },\n slideUp: {\n initial: { opacity: initialOpacity, y: distance * dir },\n animate: { opacity: 1, y: 0 },\n exit: { opacity: 0, y: (distance / 2) * dir },\n },\n slideDown: {\n initial: { opacity: initialOpacity, y: -distance * dir },\n animate: { opacity: 1, y: 0 },\n exit: { opacity: 0, y: (-distance / 2) * dir },\n },\n slideLeft: {\n initial: { opacity: initialOpacity, x: distance * dir },\n animate: { opacity: 1, x: 0 },\n exit: { opacity: 0, x: (distance / 2) * dir },\n },\n slideRight: {\n initial: { opacity: initialOpacity, x: -distance * dir },\n animate: { opacity: 1, x: 0 },\n exit: { opacity: 0, x: (-distance / 2) * dir },\n },\n elastic: {\n initial: {\n opacity: initialOpacity,\n scale: initialScale,\n y: distance / 2,\n },\n animate: { opacity: 1, scale: 1, y: 0 },\n exit: { opacity: 0, scale: 0.8, y: distance / 4 },\n },\n bounce: {\n initial: { opacity: initialOpacity, scale: initialScale, y: -distance },\n animate: { opacity: 1, scale: 1, y: 0 },\n exit: { opacity: 0, scale: 0.5, y: -distance / 2 },\n },\n flip: {\n initial: { opacity: initialOpacity, rotateX: -90 * dir, scale: 0.9 },\n animate: { opacity: 1, rotateX: 0, scale: 1 },\n exit: { opacity: 0, rotateX: 90 * dir, scale: 0.9 },\n },\n zoom: {\n initial: { opacity: initialOpacity, scale: 0, rotate: -10 * dir },\n animate: { opacity: 1, scale: 1, rotate: 0 },\n exit: { opacity: 0, scale: 0.5, rotate: 5 * dir },\n },\n custom: {\n initial: { opacity: initialOpacity },\n animate: { opacity: 1 },\n exit: { opacity: 0 },\n },\n };\n\n return presets[preset];\n};\n\nexport const AnimatedContent = ({\n children,\n preset = \"fade\",\n direction = \"vertical\",\n ease = \"easeOut\",\n exitEase,\n reverse = false,\n animateOpacity = true,\n distance = 50,\n duration = 0.5,\n delay = 0,\n initialOpacity = 0,\n initialScale = 0.9,\n threshold = 0.1,\n disappearAfter = 0,\n disappearDuration = 0.3,\n triggerOnView = false,\n triggerOnce = true,\n className = \"\",\n as = \"div\",\n}: AnimatedContentProps) => {\n const ref = useRef<HTMLDivElement>(null);\n const isInView = useInView(ref, {\n once: triggerOnce,\n amount: threshold,\n });\n const [isVisible, setIsVisible] = useState(!triggerOnView);\n const [hasDisappeared, setHasDisappeared] = useState(false);\n\n // Handle view-triggered animation\n useEffect(() => {\n if (triggerOnView && isInView && !isVisible) {\n setIsVisible(true);\n }\n }, [isInView, triggerOnView, isVisible]);\n\n // Handle disappear after timeout\n useEffect(() => {\n if (disappearAfter > 0 && isVisible && !hasDisappeared) {\n const timer = setTimeout(() => {\n setHasDisappeared(true);\n }, disappearAfter * 1000);\n return () => clearTimeout(timer);\n }\n }, [disappearAfter, isVisible, hasDisappeared]);\n\n // Get animation config\n const opacity = animateOpacity ? initialOpacity : 1;\n const animation = getPresetAnimation(\n preset,\n distance,\n opacity,\n initialScale,\n reverse,\n );\n\n // Get transition config\n const springConfig = getSpringConfig(ease);\n const easingValue = easingMap[ease];\n\n const transition = springConfig || {\n duration,\n delay,\n ease: (typeof easingValue === \"string\" ? easingValue : easingValue) as any,\n };\n\n const exitTransition = exitEase\n ? { duration: disappearDuration, ease: easingMap[exitEase] }\n : { duration: disappearDuration };\n\n // Determine current animation state\n const shouldAnimate = triggerOnView ? isVisible : true;\n const currentState = hasDisappeared\n ? \"exit\"\n : shouldAnimate\n ? \"animate\"\n : \"initial\";\n\n const MotionComponent = (motion as any)[as] || motion.div;\n\n return (\n <MotionComponent\n ref={ref as any}\n className={className}\n initial={animation.initial}\n animate={\n currentState === \"animate\"\n ? animation.animate\n : currentState === \"exit\"\n ? animation.exit\n : animation.initial\n }\n transition={\n (currentState === \"exit\" ? exitTransition : transition) as any\n }\n style={{ perspective: preset === \"flip\" ? 1000 : undefined }}\n >\n {children}\n </MotionComponent>\n );\n};\n"],"mappings":"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"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
const require_chunk = require("./chunk-B_GkZjkl.cjs");
|
|
2
2
|
let react = require("react");
|
|
3
|
-
react = require_chunk.__toESM(react);
|
|
3
|
+
react = require_chunk.__toESM(react, 1);
|
|
4
4
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
5
5
|
let three = require("three");
|
|
6
|
-
three = require_chunk.__toESM(three);
|
|
6
|
+
three = require_chunk.__toESM(three, 1);
|
|
7
7
|
//#region src/components/effects/ascii-text/ASCIIText.tsx
|
|
8
8
|
var vertexShader = `
|
|
9
9
|
varying vec2 vUv;
|
|
@@ -516,4 +516,4 @@ Object.defineProperty(exports, "ASCIIText", {
|
|
|
516
516
|
}
|
|
517
517
|
});
|
|
518
518
|
|
|
519
|
-
//# sourceMappingURL=ascii-text-
|
|
519
|
+
//# sourceMappingURL=ascii-text-BP-BBy0-.cjs.map
|