erp-pro-ui 0.2.6 → 0.2.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/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/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 +7 -0
- package/dist/catalog.cjs.map +1 -1
- package/dist/catalog.d.ts +13 -1
- package/dist/catalog.d.ts.map +1 -1
- package/dist/catalog.mjs +7 -0
- package/dist/catalog.mjs.map +1 -1
- package/dist/charts.cjs +1 -1
- package/dist/charts.mjs +1 -1
- package/dist/checkbox.cjs +1 -1
- package/dist/checkbox.mjs +1 -1
- package/dist/chip.cjs +1 -1
- package/dist/chip.mjs +1 -1
- package/dist/chroma-grid.cjs +1 -1
- package/dist/chroma-grid.mjs +1 -1
- package/dist/chunks/{Drawer-Y0_sJni5.mjs → Drawer-BhTTQV8Q.mjs} +2 -2
- package/dist/chunks/{Drawer-Y0_sJni5.mjs.map → Drawer-BhTTQV8Q.mjs.map} +1 -1
- package/dist/chunks/{Drawer-D72Xi2Gq.cjs → Drawer-C_DLqrus.cjs} +2 -3
- package/dist/chunks/{Drawer-D72Xi2Gq.cjs.map → Drawer-C_DLqrus.cjs.map} +1 -1
- package/dist/chunks/{DropdownMenu-BQ4WlaGp.mjs → DropdownMenu-B18BI5l7.mjs} +2 -2
- package/dist/chunks/{DropdownMenu-BQ4WlaGp.mjs.map → DropdownMenu-B18BI5l7.mjs.map} +1 -1
- package/dist/chunks/{DropdownMenu-yh04burS.cjs → DropdownMenu-CEmlmX7P.cjs} +2 -3
- package/dist/chunks/{DropdownMenu-yh04burS.cjs.map → DropdownMenu-CEmlmX7P.cjs.map} +1 -1
- package/dist/chunks/{HoverBorderGradient-DEtm3owk.mjs → HoverBorderGradient-CGKcviEd.mjs} +2 -2
- package/dist/chunks/{HoverBorderGradient-DEtm3owk.mjs.map → HoverBorderGradient-CGKcviEd.mjs.map} +1 -1
- package/dist/chunks/{HoverBorderGradient-DMMyr2L3.cjs → HoverBorderGradient-DTKasFZO.cjs} +2 -3
- package/dist/chunks/{HoverBorderGradient-DMMyr2L3.cjs.map → HoverBorderGradient-DTKasFZO.cjs.map} +1 -1
- package/dist/chunks/{SunToMoonButton-BOKHzC1H.mjs → SunToMoonButton-DIMK53fW.mjs} +2 -2
- package/dist/chunks/{SunToMoonButton-BOKHzC1H.mjs.map → SunToMoonButton-DIMK53fW.mjs.map} +1 -1
- package/dist/chunks/{SunToMoonButton-gX4Kk_5B.cjs → SunToMoonButton-DUuIqw22.cjs} +2 -3
- package/dist/chunks/{SunToMoonButton-gX4Kk_5B.cjs.map → SunToMoonButton-DUuIqw22.cjs.map} +1 -1
- package/dist/chunks/{Tooltip-nnaiqJTT.cjs → Tooltip-1yPGRJ2Q.cjs} +1 -2
- package/dist/chunks/{Tooltip-nnaiqJTT.cjs.map → Tooltip-1yPGRJ2Q.cjs.map} +1 -1
- package/dist/chunks/{Tooltip-LbOKP__2.mjs → Tooltip-CEj-I4JO.mjs} +1 -1
- package/dist/chunks/{Tooltip-LbOKP__2.mjs.map → Tooltip-CEj-I4JO.mjs.map} +1 -1
- package/dist/chunks/{accordion-CLcjNX_X.mjs → accordion-Cf-Q3rec.mjs} +2 -2
- package/dist/chunks/{accordion-CLcjNX_X.mjs.map → accordion-Cf-Q3rec.mjs.map} +1 -1
- package/dist/chunks/{accordion-Bj3Sj0mC.cjs → accordion-X4PNqWkW.cjs} +2 -3
- package/dist/chunks/{accordion-Bj3Sj0mC.cjs.map → accordion-X4PNqWkW.cjs.map} +1 -1
- package/dist/chunks/{alert-BBA4Sh4e.cjs → alert-BEMULPIi.cjs} +2 -3
- package/dist/chunks/{alert-BBA4Sh4e.cjs.map → alert-BEMULPIi.cjs.map} +1 -1
- package/dist/chunks/{alert-oUz79MGc.mjs → alert-GImBqaCY.mjs} +2 -2
- package/dist/chunks/{alert-oUz79MGc.mjs.map → alert-GImBqaCY.mjs.map} +1 -1
- package/dist/chunks/{animated-content-CiNJLgbq.mjs → animated-content-Bp-Yt0_7.mjs} +1 -1
- package/dist/chunks/{animated-content-CiNJLgbq.mjs.map → animated-content-Bp-Yt0_7.mjs.map} +1 -1
- package/dist/chunks/{animated-content-B3wbiWQI.cjs → animated-content-tSHXDZq2.cjs} +1 -2
- package/dist/chunks/{animated-content-B3wbiWQI.cjs.map → animated-content-tSHXDZq2.cjs.map} +1 -1
- package/dist/chunks/{ascii-text-KwVE41Hw.cjs → ascii-text-Ctua6ucZ.cjs} +2 -2
- package/dist/chunks/{ascii-text-KwVE41Hw.cjs.map → ascii-text-Ctua6ucZ.cjs.map} +1 -1
- package/dist/chunks/{ascii-text-C6JegLhP.mjs → ascii-text-QyP7JU7g.mjs} +1 -1
- package/dist/chunks/{ascii-text-C6JegLhP.mjs.map → ascii-text-QyP7JU7g.mjs.map} +1 -1
- package/dist/chunks/{background-gradient-animation-CTc2ZR74.mjs → background-gradient-animation-CZUD_aq2.mjs} +2 -2
- package/dist/chunks/{background-gradient-animation-CTc2ZR74.mjs.map → background-gradient-animation-CZUD_aq2.mjs.map} +1 -1
- package/dist/chunks/{background-gradient-animation-1LZY3DYT.cjs → background-gradient-animation-PvM0i88k.cjs} +2 -3
- package/dist/chunks/{background-gradient-animation-1LZY3DYT.cjs.map → background-gradient-animation-PvM0i88k.cjs.map} +1 -1
- package/dist/chunks/{button-IDShmQqA.mjs → button-CAU9ej3h.mjs} +2 -2
- package/dist/chunks/{button-IDShmQqA.mjs.map → button-CAU9ej3h.mjs.map} +1 -1
- package/dist/chunks/{button-uD87K76W.cjs → button-D2ZYmVda.cjs} +2 -3
- package/dist/chunks/{button-uD87K76W.cjs.map → button-D2ZYmVda.cjs.map} +1 -1
- package/dist/chunks/{button-hover-border-gradient-DGZqd8je.cjs → button-hover-border-gradient-D12Zjmd3.cjs} +2 -3
- package/dist/chunks/{button-hover-border-gradient-DGZqd8je.cjs.map → button-hover-border-gradient-D12Zjmd3.cjs.map} +1 -1
- package/dist/chunks/{button-hover-border-gradient-B2ebbDek.mjs → button-hover-border-gradient-VNEg4V0o.mjs} +2 -2
- package/dist/chunks/{button-hover-border-gradient-B2ebbDek.mjs.map → button-hover-border-gradient-VNEg4V0o.mjs.map} +1 -1
- package/dist/chunks/calendar-BlUhssD4.mjs +203 -0
- package/dist/chunks/calendar-BlUhssD4.mjs.map +1 -0
- package/dist/chunks/calendar-CdKKhdx5.cjs +208 -0
- package/dist/chunks/calendar-CdKKhdx5.cjs.map +1 -0
- package/dist/chunks/{card-Cuud0jIt.cjs → card-C_Qr7E6E.cjs} +1 -2
- package/dist/chunks/{card-Cuud0jIt.cjs.map → card-C_Qr7E6E.cjs.map} +1 -1
- package/dist/chunks/{card-DNeC6jqk.mjs → card-DYHDNCPK.mjs} +1 -1
- package/dist/chunks/{card-DNeC6jqk.mjs.map → card-DYHDNCPK.mjs.map} +1 -1
- package/dist/chunks/{carousel-xHkrV_pt.cjs → carousel-DtOJEbEU.cjs} +4 -5
- package/dist/chunks/{carousel-xHkrV_pt.cjs.map → carousel-DtOJEbEU.cjs.map} +1 -1
- package/dist/chunks/{carousel-Dpe5QLJK.mjs → carousel-eeqWZZHE.mjs} +4 -4
- package/dist/chunks/{carousel-Dpe5QLJK.mjs.map → carousel-eeqWZZHE.mjs.map} +1 -1
- package/dist/chunks/{chartStyles-BADmRKZo.cjs → chartStyles-2mTluDoo.cjs} +1 -1
- package/dist/chunks/{chartStyles-BADmRKZo.cjs.map → chartStyles-2mTluDoo.cjs.map} +1 -1
- package/dist/chunks/{chartStyles-DPXgYmGn.mjs → chartStyles-DrHVYS5N.mjs} +1 -1
- package/dist/chunks/{chartStyles-DPXgYmGn.mjs.map → chartStyles-DrHVYS5N.mjs.map} +1 -1
- package/dist/chunks/{charts-COx3IbI2.cjs → charts-DMu4zp8j.cjs} +4 -4
- package/dist/chunks/{charts-COx3IbI2.cjs.map → charts-DMu4zp8j.cjs.map} +1 -1
- package/dist/chunks/{charts-C-KQ3Nk5.mjs → charts-DlskmT1J.mjs} +3 -3
- package/dist/chunks/{charts-C-KQ3Nk5.mjs.map → charts-DlskmT1J.mjs.map} +1 -1
- package/dist/chunks/{checkbox-Y04NlzB8.mjs → checkbox-D7EJQbqC.mjs} +1 -1
- package/dist/chunks/{checkbox-Y04NlzB8.mjs.map → checkbox-D7EJQbqC.mjs.map} +1 -1
- package/dist/chunks/{checkbox-CDknzh89.cjs → checkbox-Lw2UqyNE.cjs} +1 -2
- package/dist/chunks/{checkbox-CDknzh89.cjs.map → checkbox-Lw2UqyNE.cjs.map} +1 -1
- package/dist/chunks/{chip-sfQlzrbo.cjs → chip-D5i9VT9O.cjs} +4 -5
- package/dist/chunks/{chip-sfQlzrbo.cjs.map → chip-D5i9VT9O.cjs.map} +1 -1
- package/dist/chunks/{chip-B3j6R6sO.mjs → chip-DBlSQcqR.mjs} +4 -4
- package/dist/chunks/{chip-B3j6R6sO.mjs.map → chip-DBlSQcqR.mjs.map} +1 -1
- package/dist/chunks/{chroma-grid-Bp55pKEm.cjs → chroma-grid-CTDtdFUm.cjs} +2 -3
- package/dist/chunks/{chroma-grid-Bp55pKEm.cjs.map → chroma-grid-CTDtdFUm.cjs.map} +1 -1
- package/dist/chunks/{chroma-grid-BHS9qAn_.mjs → chroma-grid-DuLTfGVP.mjs} +2 -2
- package/dist/chunks/{chroma-grid-BHS9qAn_.mjs.map → chroma-grid-DuLTfGVP.mjs.map} +1 -1
- package/dist/chunks/{color-palette-Duud5Iqq.cjs → color-palette-DQQ9UV0N.cjs} +2 -2
- package/dist/chunks/{color-palette-Duud5Iqq.cjs.map → color-palette-DQQ9UV0N.cjs.map} +1 -1
- package/dist/chunks/{color-palette-D9Qlw2Cx.mjs → color-palette-G1HUXWJP.mjs} +1 -1
- package/dist/chunks/{color-palette-D9Qlw2Cx.mjs.map → color-palette-G1HUXWJP.mjs.map} +1 -1
- package/dist/chunks/{combobox-C3a2iogC.cjs → combobox-CkNzH1YV.cjs} +6 -6
- package/dist/chunks/{combobox-C3a2iogC.cjs.map → combobox-CkNzH1YV.cjs.map} +1 -1
- package/dist/chunks/{combobox-neBItbtz.mjs → combobox-xNmFFHd6.mjs} +5 -5
- package/dist/chunks/{combobox-neBItbtz.mjs.map → combobox-xNmFFHd6.mjs.map} +1 -1
- package/dist/chunks/dashboard-cards-Bww66_5K.cjs +6570 -0
- package/dist/chunks/dashboard-cards-Bww66_5K.cjs.map +1 -0
- package/dist/chunks/dashboard-cards-lnifLEyj.mjs +6385 -0
- package/dist/chunks/dashboard-cards-lnifLEyj.mjs.map +1 -0
- package/dist/chunks/{data-table-BZEiSZI2.cjs → data-table-BCVbzkLo.cjs} +16 -17
- package/dist/chunks/{data-table-BZEiSZI2.cjs.map → data-table-BCVbzkLo.cjs.map} +1 -1
- package/dist/chunks/{data-table-EfGKkerd.mjs → data-table-C25KHEn4.mjs} +14 -15
- package/dist/chunks/{data-table-EfGKkerd.mjs.map → data-table-C25KHEn4.mjs.map} +1 -1
- package/dist/chunks/date-picker--cqsgsIV.mjs +587 -0
- package/dist/chunks/date-picker--cqsgsIV.mjs.map +1 -0
- package/dist/chunks/date-picker-BJQdFyqr.cjs +592 -0
- package/dist/chunks/date-picker-BJQdFyqr.cjs.map +1 -0
- package/dist/chunks/{dialog-B60BjJz0.mjs → dialog-BHIeG3Sg.mjs} +3 -3
- package/dist/chunks/{dialog-B60BjJz0.mjs.map → dialog-BHIeG3Sg.mjs.map} +1 -1
- package/dist/chunks/{dialog-i9LdkXmF.cjs → dialog-CLKU0cXX.cjs} +3 -4
- package/dist/chunks/{dialog-i9LdkXmF.cjs.map → dialog-CLKU0cXX.cjs.map} +1 -1
- package/dist/chunks/draggable-grid-2L_eHKfp.cjs +245 -0
- package/dist/chunks/draggable-grid-2L_eHKfp.cjs.map +1 -0
- package/dist/chunks/draggable-grid-IuCMSOsE.mjs +240 -0
- package/dist/chunks/draggable-grid-IuCMSOsE.mjs.map +1 -0
- package/dist/chunks/{event-calendar-BbFOUDov.mjs → event-calendar-CO2doGJW.mjs} +11 -11
- package/dist/chunks/{event-calendar-BbFOUDov.mjs.map → event-calendar-CO2doGJW.mjs.map} +1 -1
- package/dist/chunks/{event-calendar-Bljd_7PI.cjs → event-calendar-CvficOuV.cjs} +11 -12
- package/dist/chunks/{event-calendar-Bljd_7PI.cjs.map → event-calendar-CvficOuV.cjs.map} +1 -1
- package/dist/chunks/{form-DGwdlSW2.cjs → form-DARN6jtX.cjs} +1 -2
- package/dist/chunks/{form-DGwdlSW2.cjs.map → form-DARN6jtX.cjs.map} +1 -1
- package/dist/chunks/{form-CDc9UM3r.mjs → form-DNuFklNR.mjs} +1 -1
- package/dist/chunks/{form-CDc9UM3r.mjs.map → form-DNuFklNR.mjs.map} +1 -1
- package/dist/chunks/{gradual-blur-BNYVlqb1.cjs → gradual-blur-BBLbpXD4.cjs} +2 -3
- package/dist/chunks/{gradual-blur-BNYVlqb1.cjs.map → gradual-blur-BBLbpXD4.cjs.map} +1 -1
- package/dist/chunks/{gradual-blur-Bw2KNmXb.mjs → gradual-blur-BPx2MSWI.mjs} +2 -2
- package/dist/chunks/{gradual-blur-Bw2KNmXb.mjs.map → gradual-blur-BPx2MSWI.mjs.map} +1 -1
- package/dist/chunks/{hover-card-G66SUyjq.mjs → hover-card-BkVHGXz6.mjs} +1 -1
- package/dist/chunks/{hover-card-G66SUyjq.mjs.map → hover-card-BkVHGXz6.mjs.map} +1 -1
- package/dist/chunks/{hover-card-Dp6Y2h2J.cjs → hover-card-DwZFtu8w.cjs} +1 -2
- package/dist/chunks/{hover-card-Dp6Y2h2J.cjs.map → hover-card-DwZFtu8w.cjs.map} +1 -1
- package/dist/chunks/{icons-ub9iu-JG.cjs → icons-Ci8yEvvF.cjs} +48 -2
- package/dist/chunks/icons-Ci8yEvvF.cjs.map +1 -0
- package/dist/chunks/{icons-JzMKLygv.mjs → icons-CkVHNbbN.mjs} +43 -2
- package/dist/chunks/icons-CkVHNbbN.mjs.map +1 -0
- package/dist/chunks/{input-CRc3MKb_.mjs → input-B-XSdnfh.mjs} +4 -4
- package/dist/chunks/{input-CRc3MKb_.mjs.map → input-B-XSdnfh.mjs.map} +1 -1
- package/dist/chunks/{input-DMTwz27q.cjs → input-EH7x0pQY.cjs} +4 -5
- package/dist/chunks/{input-DMTwz27q.cjs.map → input-EH7x0pQY.cjs.map} +1 -1
- package/dist/chunks/{label-Bc_r54NU.mjs → label-CcsncrKQ.mjs} +1 -1
- package/dist/chunks/{label-Bc_r54NU.mjs.map → label-CcsncrKQ.mjs.map} +1 -1
- package/dist/chunks/{label-B5Ugq0Nk.cjs → label-Du-5H7wd.cjs} +1 -2
- package/dist/chunks/{label-B5Ugq0Nk.cjs.map → label-Du-5H7wd.cjs.map} +1 -1
- package/dist/chunks/{loading-ll2L6lc7.mjs → loading-2Lh_355V.mjs} +2 -2
- package/dist/chunks/{loading-ll2L6lc7.mjs.map → loading-2Lh_355V.mjs.map} +1 -1
- package/dist/chunks/{loading-DZKJc3e7.cjs → loading-DeGHTDO2.cjs} +2 -3
- package/dist/chunks/{loading-DZKJc3e7.cjs.map → loading-DeGHTDO2.cjs.map} +1 -1
- package/dist/chunks/{multi-select-combobox-C_8sxaiL.mjs → multi-select-combobox-BOdKmPj2.mjs} +4 -4
- package/dist/chunks/{multi-select-combobox-C_8sxaiL.mjs.map → multi-select-combobox-BOdKmPj2.mjs.map} +1 -1
- package/dist/chunks/{multi-select-combobox-CFJGq1hn.cjs → multi-select-combobox-PPYRcaPg.cjs} +5 -5
- package/dist/chunks/{multi-select-combobox-CFJGq1hn.cjs.map → multi-select-combobox-PPYRcaPg.cjs.map} +1 -1
- package/dist/chunks/{otp-input-BpcTJOmU.mjs → otp-input--_itTXaL.mjs} +1 -1
- package/dist/chunks/{otp-input-BpcTJOmU.mjs.map → otp-input--_itTXaL.mjs.map} +1 -1
- package/dist/chunks/{otp-input-B5-tuc0q.cjs → otp-input-Dgw_47Z7.cjs} +1 -2
- package/dist/chunks/{otp-input-B5-tuc0q.cjs.map → otp-input-Dgw_47Z7.cjs.map} +1 -1
- package/dist/chunks/{overlay-DzE_GyYf.cjs → overlay-15EzdrIu.cjs} +1 -2
- package/dist/chunks/{overlay-DzE_GyYf.cjs.map → overlay-15EzdrIu.cjs.map} +1 -1
- package/dist/chunks/{overlay-CG1dMYtO.mjs → overlay-BMbhF-EC.mjs} +1 -1
- package/dist/chunks/{overlay-CG1dMYtO.mjs.map → overlay-BMbhF-EC.mjs.map} +1 -1
- package/dist/chunks/{password-strength-meter-_o1T1HLO.cjs → password-strength-meter-Be1c-dnK.cjs} +2 -3
- package/dist/chunks/{password-strength-meter-_o1T1HLO.cjs.map → password-strength-meter-Be1c-dnK.cjs.map} +1 -1
- package/dist/chunks/{password-strength-meter-CH6uQAuK.mjs → password-strength-meter-Q1Qr-4tz.mjs} +2 -2
- package/dist/chunks/{password-strength-meter-CH6uQAuK.mjs.map → password-strength-meter-Q1Qr-4tz.mjs.map} +1 -1
- package/dist/chunks/{progress-bar-FfdFVvTT.cjs → progress-bar-BsnX079N.cjs} +3 -3
- package/dist/chunks/{progress-bar-FfdFVvTT.cjs.map → progress-bar-BsnX079N.cjs.map} +1 -1
- package/dist/chunks/{progress-bar-BAvRSW1b.mjs → progress-bar-l5WpbpZf.mjs} +2 -2
- package/dist/chunks/{progress-bar-BAvRSW1b.mjs.map → progress-bar-l5WpbpZf.mjs.map} +1 -1
- package/dist/chunks/{radio-BMOnxnUS.mjs → radio-B94_TGtz.mjs} +2 -2
- package/dist/chunks/{radio-BMOnxnUS.mjs.map → radio-B94_TGtz.mjs.map} +1 -1
- package/dist/chunks/{radio-wagafWwx.cjs → radio-W_NiS_dO.cjs} +2 -3
- package/dist/chunks/{radio-wagafWwx.cjs.map → radio-W_NiS_dO.cjs.map} +1 -1
- package/dist/chunks/{select-zFFyNmlY.cjs → select-C5lkcrSB.cjs} +5 -6
- package/dist/chunks/{select-zFFyNmlY.cjs.map → select-C5lkcrSB.cjs.map} +1 -1
- package/dist/chunks/{select--DeSgPdn.mjs → select-DnSSxddm.mjs} +5 -5
- package/dist/chunks/{select--DeSgPdn.mjs.map → select-DnSSxddm.mjs.map} +1 -1
- package/dist/chunks/{sidebar-oemmRzCL.mjs → sidebar-C3Sx87wD.mjs} +10 -11
- package/dist/chunks/{sidebar-oemmRzCL.mjs.map → sidebar-C3Sx87wD.mjs.map} +1 -1
- package/dist/chunks/{sidebar-Cq7UbKJT.cjs → sidebar-DDRWkz5k.cjs} +10 -12
- package/dist/chunks/{sidebar-Cq7UbKJT.cjs.map → sidebar-DDRWkz5k.cjs.map} +1 -1
- package/dist/chunks/{skeleton-DWvVc17T.cjs → skeleton-B2u9c1xJ.cjs} +2 -3
- package/dist/chunks/{skeleton-DWvVc17T.cjs.map → skeleton-B2u9c1xJ.cjs.map} +1 -1
- package/dist/chunks/{skeleton-BsDMlWZG.mjs → skeleton-DVAlrOq2.mjs} +2 -2
- package/dist/chunks/{skeleton-BsDMlWZG.mjs.map → skeleton-DVAlrOq2.mjs.map} +1 -1
- package/dist/chunks/{spinners-DlMcokJa.mjs → spinners-BQtIp2ov.mjs} +2 -2
- package/dist/chunks/{spinners-DlMcokJa.mjs.map → spinners-BQtIp2ov.mjs.map} +1 -1
- package/dist/chunks/{spinners-DBAJliAj.cjs → spinners-BiebALzS.cjs} +2 -3
- package/dist/chunks/{spinners-DBAJliAj.cjs.map → spinners-BiebALzS.cjs.map} +1 -1
- package/dist/chunks/{splash-cursor-CQ6_HwHV.cjs → splash-cursor-8b7ORB2k.cjs} +2 -3
- package/dist/chunks/{splash-cursor-CQ6_HwHV.cjs.map → splash-cursor-8b7ORB2k.cjs.map} +1 -1
- package/dist/chunks/{splash-cursor-Bb7LSzaO.mjs → splash-cursor-CeZffMed.mjs} +2 -2
- package/dist/chunks/{splash-cursor-Bb7LSzaO.mjs.map → splash-cursor-CeZffMed.mjs.map} +1 -1
- package/dist/chunks/{spotlight-card-COfSD7ns.cjs → spotlight-card-BQjp7hO1.cjs} +2 -3
- package/dist/chunks/{spotlight-card-COfSD7ns.cjs.map → spotlight-card-BQjp7hO1.cjs.map} +1 -1
- package/dist/chunks/{spotlight-card-Bs0iiSLc.mjs → spotlight-card-DiPtBCAK.mjs} +2 -2
- package/dist/chunks/{spotlight-card-Bs0iiSLc.mjs.map → spotlight-card-DiPtBCAK.mjs.map} +1 -1
- package/dist/chunks/{stepper-CTteR-Kj.cjs → stepper-BuhQfQTH.cjs} +5 -6
- package/dist/chunks/{stepper-CTteR-Kj.cjs.map → stepper-BuhQfQTH.cjs.map} +1 -1
- package/dist/chunks/{stepper-B9NdZ6ZV.mjs → stepper-CVNcexxq.mjs} +5 -5
- package/dist/chunks/{stepper-B9NdZ6ZV.mjs.map → stepper-CVNcexxq.mjs.map} +1 -1
- package/dist/chunks/{sun-to-moon-button-lt-1vmWm.cjs → sun-to-moon-button-BzYGFhrg.cjs} +4 -5
- package/dist/chunks/{sun-to-moon-button-lt-1vmWm.cjs.map → sun-to-moon-button-BzYGFhrg.cjs.map} +1 -1
- package/dist/chunks/{sun-to-moon-button-DWHDpP5B.mjs → sun-to-moon-button-CRXBMFZb.mjs} +4 -4
- package/dist/chunks/{sun-to-moon-button-DWHDpP5B.mjs.map → sun-to-moon-button-CRXBMFZb.mjs.map} +1 -1
- package/dist/chunks/{switch-BbFl5b4t.cjs → switch-CEoT3MgX.cjs} +1 -2
- package/dist/chunks/{switch-BbFl5b4t.cjs.map → switch-CEoT3MgX.cjs.map} +1 -1
- package/dist/chunks/{switch--68scepb.mjs → switch-DUnNe4xP.mjs} +1 -1
- package/dist/chunks/{switch--68scepb.mjs.map → switch-DUnNe4xP.mjs.map} +1 -1
- package/dist/chunks/{textarea-U_JeSWI3.cjs → textarea-Bschfj24.cjs} +2 -3
- package/dist/chunks/{textarea-U_JeSWI3.cjs.map → textarea-Bschfj24.cjs.map} +1 -1
- package/dist/chunks/{textarea-CEj9voUJ.mjs → textarea-CfeKo5HA.mjs} +2 -2
- package/dist/chunks/{textarea-CEj9voUJ.mjs.map → textarea-CfeKo5HA.mjs.map} +1 -1
- package/dist/chunks/{theme-koPrLKQv.mjs → theme-BXML6jHE.mjs} +1 -1
- package/dist/chunks/{theme-koPrLKQv.mjs.map → theme-BXML6jHE.mjs.map} +1 -1
- package/dist/chunks/{theme-D6B-FaoE.cjs → theme-BzTaXYZ8.cjs} +1 -2
- package/dist/chunks/{theme-D6B-FaoE.cjs.map → theme-BzTaXYZ8.cjs.map} +1 -1
- package/dist/chunks/{toast-CyY8VZN7.mjs → toast-D1W0BvoH.mjs} +2 -2
- package/dist/chunks/{toast-CyY8VZN7.mjs.map → toast-D1W0BvoH.mjs.map} +1 -1
- package/dist/chunks/{toast-2yq4Q7-q.cjs → toast-DL8svc6q.cjs} +2 -3
- package/dist/chunks/{toast-2yq4Q7-q.cjs.map → toast-DL8svc6q.cjs.map} +1 -1
- package/dist/chunks/{truncated-text-CswjmrHZ.cjs → truncated-text-D0t4atw5.cjs} +3 -3
- package/dist/chunks/{truncated-text-CswjmrHZ.cjs.map → truncated-text-D0t4atw5.cjs.map} +1 -1
- package/dist/chunks/{truncated-text-DUYTW1KP.mjs → truncated-text-DIkg-8Vo.mjs} +2 -2
- package/dist/chunks/{truncated-text-DUYTW1KP.mjs.map → truncated-text-DIkg-8Vo.mjs.map} +1 -1
- package/dist/chunks/{typography-CFIiYk1d.cjs → typography-C5fYwhp2.cjs} +3 -3
- package/dist/chunks/{typography-CFIiYk1d.cjs.map → typography-C5fYwhp2.cjs.map} +1 -1
- package/dist/chunks/{typography-DHE9sUZ8.mjs → typography-Czi7t5y4.mjs} +2 -2
- package/dist/chunks/{typography-DHE9sUZ8.mjs.map → typography-Czi7t5y4.mjs.map} +1 -1
- package/dist/chunks/{utils-LRbEQHYs.cjs → utils-CoA0q63n.cjs} +84 -4
- package/dist/chunks/utils-CoA0q63n.cjs.map +1 -0
- package/dist/chunks/{utils-7S0u48mU.mjs → utils-Dc7j29ec.mjs} +84 -4
- package/dist/chunks/utils-Dc7j29ec.mjs.map +1 -0
- package/dist/color-palette.cjs +1 -1
- package/dist/color-palette.mjs +1 -1
- package/dist/combobox.cjs +1 -1
- package/dist/combobox.mjs +1 -1
- package/dist/components/data-display/dashboard-cards/AIFeatureAdoptionCard.d.ts +26 -0
- package/dist/components/data-display/dashboard-cards/AIFeatureAdoptionCard.d.ts.map +1 -0
- package/dist/components/data-display/dashboard-cards/AIInsightsCard.d.ts +30 -0
- package/dist/components/data-display/dashboard-cards/AIInsightsCard.d.ts.map +1 -0
- package/dist/components/data-display/dashboard-cards/AcquisitionChannelCard.d.ts +24 -0
- package/dist/components/data-display/dashboard-cards/AcquisitionChannelCard.d.ts.map +1 -0
- package/dist/components/data-display/dashboard-cards/BarBreakdownCard.d.ts +49 -0
- package/dist/components/data-display/dashboard-cards/BarBreakdownCard.d.ts.map +1 -0
- package/dist/components/data-display/dashboard-cards/CustomerLifecycleCard.d.ts +24 -0
- package/dist/components/data-display/dashboard-cards/CustomerLifecycleCard.d.ts.map +1 -0
- package/dist/components/data-display/dashboard-cards/EarningReportsTabsCard.d.ts +111 -2
- package/dist/components/data-display/dashboard-cards/EarningReportsTabsCard.d.ts.map +1 -1
- package/dist/components/data-display/dashboard-cards/FinancialPLCard.d.ts +78 -0
- package/dist/components/data-display/dashboard-cards/FinancialPLCard.d.ts.map +1 -0
- package/dist/components/data-display/dashboard-cards/InventoryCards.d.ts +44 -0
- package/dist/components/data-display/dashboard-cards/InventoryCards.d.ts.map +1 -0
- package/dist/components/data-display/dashboard-cards/PaymentSummaryCard.d.ts +45 -0
- package/dist/components/data-display/dashboard-cards/PaymentSummaryCard.d.ts.map +1 -0
- package/dist/components/data-display/dashboard-cards/SalesHeatmapCard.d.ts +36 -0
- package/dist/components/data-display/dashboard-cards/SalesHeatmapCard.d.ts.map +1 -0
- package/dist/components/data-display/dashboard-cards/SeatUtilizationCard.d.ts +22 -0
- package/dist/components/data-display/dashboard-cards/SeatUtilizationCard.d.ts.map +1 -0
- package/dist/components/data-display/dashboard-cards/SubscriptionHealthCard.d.ts +23 -0
- package/dist/components/data-display/dashboard-cards/SubscriptionHealthCard.d.ts.map +1 -0
- package/dist/components/data-display/dashboard-cards/ToolUsageOverviewCard.d.ts +22 -0
- package/dist/components/data-display/dashboard-cards/ToolUsageOverviewCard.d.ts.map +1 -0
- package/dist/components/data-display/dashboard-cards/TopPlansCard.d.ts +23 -0
- package/dist/components/data-display/dashboard-cards/TopPlansCard.d.ts.map +1 -0
- package/dist/components/data-display/dashboard-cards/TopSellingItemsCard.d.ts +42 -0
- package/dist/components/data-display/dashboard-cards/TopSellingItemsCard.d.ts.map +1 -0
- package/dist/components/data-display/dashboard-cards/TopToolsCard.d.ts +22 -0
- package/dist/components/data-display/dashboard-cards/TopToolsCard.d.ts.map +1 -0
- package/dist/components/data-display/dashboard-cards/_PLCardHeader.d.ts +63 -0
- package/dist/components/data-display/dashboard-cards/_PLCardHeader.d.ts.map +1 -0
- package/dist/components/data-display/dashboard-cards/_PLCharts.d.ts +33 -0
- package/dist/components/data-display/dashboard-cards/_PLCharts.d.ts.map +1 -0
- package/dist/components/data-display/dashboard-cards/_PLKpiStrip.d.ts +11 -0
- package/dist/components/data-display/dashboard-cards/_PLKpiStrip.d.ts.map +1 -0
- package/dist/components/data-display/dashboard-cards/_PLOverview.d.ts +9 -0
- package/dist/components/data-display/dashboard-cards/_PLOverview.d.ts.map +1 -0
- package/dist/components/data-display/dashboard-cards/_TabTooltip.d.ts +8 -0
- package/dist/components/data-display/dashboard-cards/_TabTooltip.d.ts.map +1 -0
- package/dist/components/data-display/dashboard-cards/index.d.ts +32 -1
- package/dist/components/data-display/dashboard-cards/index.d.ts.map +1 -1
- package/dist/components/forms/calendar/Calendar.d.ts +1 -1
- package/dist/components/forms/calendar/Calendar.d.ts.map +1 -1
- package/dist/components/forms/calendar/types.d.ts +6 -0
- package/dist/components/forms/calendar/types.d.ts.map +1 -1
- package/dist/components/forms/date-picker/DatePicker.d.ts.map +1 -1
- package/dist/components/layout/draggable-grid/DraggableGrid.d.ts +20 -0
- package/dist/components/layout/draggable-grid/DraggableGrid.d.ts.map +1 -0
- package/dist/components/layout/draggable-grid/index.d.ts +3 -0
- package/dist/components/layout/draggable-grid/index.d.ts.map +1 -0
- package/dist/components/navigation/sidebar/DashboardSidebarShell.d.ts.map +1 -1
- package/dist/dashboard-cards.cjs +16 -1
- package/dist/dashboard-cards.mjs +2 -2
- package/dist/data-table.cjs +1 -1
- package/dist/data-table.mjs +1 -1
- package/dist/date-picker.cjs +1 -1
- package/dist/date-picker.mjs +1 -1
- package/dist/dialog.cjs +1 -1
- package/dist/dialog.mjs +1 -1
- package/dist/docs.cjs +13 -0
- package/dist/docs.cjs.map +1 -1
- package/dist/docs.d.ts.map +1 -1
- package/dist/docs.mjs +13 -0
- package/dist/docs.mjs.map +1 -1
- package/dist/draggable-grid.cjs +3 -0
- package/dist/draggable-grid.d.ts +2 -0
- package/dist/draggable-grid.mjs +2 -0
- package/dist/drawer.cjs +1 -1
- package/dist/drawer.mjs +1 -1
- package/dist/event-calendar.cjs +1 -1
- package/dist/event-calendar.mjs +1 -1
- package/dist/form.cjs +1 -1
- package/dist/form.mjs +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 +2 -3
- package/dist/icons.mjs +1 -2
- package/dist/index.cjs +71 -56
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +7 -2
- package/dist/index.d.ts.map +1 -1
- package/dist/index.mjs +55 -55
- 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 +1 -1
- package/dist/progress-bar.mjs +1 -1
- 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/sidebar.cjs +1 -1
- package/dist/sidebar.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 -2
- 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/tooltip.cjs +1 -1
- package/dist/tooltip.mjs +1 -1
- package/dist/truncated-text.cjs +1 -1
- package/dist/truncated-text.mjs +1 -1
- package/dist/typography.cjs +1 -1
- package/dist/typography.mjs +1 -1
- package/dist/utils.cjs +1 -1
- package/dist/utils.mjs +1 -1
- package/package.json +34 -13
- package/dist/chunks/EllipsisVerticalIcon-BJw3MNkg.cjs +0 -51
- package/dist/chunks/EllipsisVerticalIcon-BJw3MNkg.cjs.map +0 -1
- package/dist/chunks/EllipsisVerticalIcon-C2b2KMfE.mjs +0 -45
- package/dist/chunks/EllipsisVerticalIcon-C2b2KMfE.mjs.map +0 -1
- package/dist/chunks/calendar-DCkikZYb.cjs +0 -184
- package/dist/chunks/calendar-DCkikZYb.cjs.map +0 -1
- package/dist/chunks/calendar-FxAmm_ao.mjs +0 -178
- package/dist/chunks/calendar-FxAmm_ao.mjs.map +0 -1
- package/dist/chunks/dashboard-cards-BnPt0gDW.mjs +0 -2428
- package/dist/chunks/dashboard-cards-BnPt0gDW.mjs.map +0 -1
- package/dist/chunks/dashboard-cards-DNWJPKRu.cjs +0 -2524
- package/dist/chunks/dashboard-cards-DNWJPKRu.cjs.map +0 -1
- package/dist/chunks/date-picker-3IDSmb9Z.mjs +0 -228
- package/dist/chunks/date-picker-3IDSmb9Z.mjs.map +0 -1
- package/dist/chunks/date-picker-_EVYpGga.cjs +0 -234
- package/dist/chunks/date-picker-_EVYpGga.cjs.map +0 -1
- package/dist/chunks/icons-JzMKLygv.mjs.map +0 -1
- package/dist/chunks/icons-ub9iu-JG.cjs.map +0 -1
- package/dist/chunks/utils-7S0u48mU.mjs.map +0 -1
- package/dist/chunks/utils-LRbEQHYs.cjs.map +0 -1
- /package/dist/chunks/{chunk-B_GkZjkl.cjs → chunk-D6vf50IK.cjs} +0 -0
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
require("./chunk-B_GkZjkl.cjs");
|
|
2
1
|
let react = require("react");
|
|
3
2
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
4
3
|
let framer_motion = require("framer-motion");
|
|
@@ -295,4 +294,4 @@ Object.defineProperty(exports, "AnimatedContent", {
|
|
|
295
294
|
}
|
|
296
295
|
});
|
|
297
296
|
|
|
298
|
-
//# sourceMappingURL=animated-content-
|
|
297
|
+
//# sourceMappingURL=animated-content-tSHXDZq2.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"animated-content-B3wbiWQI.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-tSHXDZq2.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,4 +1,4 @@
|
|
|
1
|
-
const require_chunk = require("./chunk-
|
|
1
|
+
const require_chunk = require("./chunk-D6vf50IK.cjs");
|
|
2
2
|
let react = require("react");
|
|
3
3
|
react = require_chunk.__toESM(react, 1);
|
|
4
4
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
@@ -518,4 +518,4 @@ Object.defineProperty(exports, "ASCIIText", {
|
|
|
518
518
|
}
|
|
519
519
|
});
|
|
520
520
|
|
|
521
|
-
//# sourceMappingURL=ascii-text-
|
|
521
|
+
//# sourceMappingURL=ascii-text-Ctua6ucZ.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ascii-text-KwVE41Hw.cjs","names":[],"sources":["../../src/components/effects/ascii-text/ASCIIText.tsx"],"sourcesContent":["import React, { useRef, useEffect } from \"react\";\nimport * as THREE from \"three\";\n\nconst vertexShader = `\nvarying vec2 vUv;\nuniform float uTime;\nuniform float mouse;\nuniform float uEnableWaves;\n\nvoid main() {\n vUv = uv;\n float time = uTime * 5.;\n\n float waveFactor = uEnableWaves;\n\n vec3 transformed = position;\n\n transformed.x += sin(time + position.y) * 0.5 * waveFactor;\n transformed.y += cos(time + position.z) * 0.15 * waveFactor;\n transformed.z += sin(time + position.x) * waveFactor;\n\n gl_Position = projectionMatrix * modelViewMatrix * vec4(transformed, 1.0);\n}\n`;\n\nconst fragmentShader = `\nvarying vec2 vUv;\nuniform float mouse;\nuniform float uTime;\nuniform sampler2D uTexture;\n\nvoid main() {\n float time = uTime;\n vec2 pos = vUv;\n \n float move = sin(time + mouse) * 0.01;\n float r = texture2D(uTexture, pos + cos(time * 2. - time + pos.x) * .01).r;\n float g = texture2D(uTexture, pos + tan(time * .5 + pos.x - time) * .01).g;\n float b = texture2D(uTexture, pos - cos(time * 2. + time + pos.y) * .01).b;\n float a = texture2D(uTexture, pos).a;\n gl_FragColor = vec4(r, g, b, a);\n}\n`;\n\nconst PX_RATIO = typeof window !== \"undefined\" ? window.devicePixelRatio : 1;\n\nconst resolvedCanvasColorCache = new Map<string, string>();\n\nconst getThemeSignature = () => {\n if (typeof document === \"undefined\") return \"\";\n\n const root = document.documentElement;\n return [\n root.getAttribute(\"data-brand\") ?? \"\",\n root.getAttribute(\"data-mode\") ?? \"\",\n root.getAttribute(\"data-theme\") ?? \"\",\n ].join(\"|\");\n};\n\nconst resolveCanvasColor = (value: string): string => {\n if (typeof document === \"undefined\") return value;\n if (!value.includes(\"var(\") && !value.includes(\"color-mix(\")) return value;\n\n const cacheKey = `${getThemeSignature()}::${value}`;\n const cachedValue = resolvedCanvasColorCache.get(cacheKey);\n if (cachedValue) {\n return cachedValue;\n }\n\n const probe = document.createElement(\"span\");\n probe.style.color = value;\n probe.style.position = \"fixed\";\n probe.style.pointerEvents = \"none\";\n probe.style.opacity = \"0\";\n document.body.appendChild(probe);\n const resolvedValue = getComputedStyle(probe).color || value;\n document.body.removeChild(probe);\n resolvedCanvasColorCache.set(cacheKey, resolvedValue);\n return resolvedValue;\n};\n\ninterface AsciiFilterOptions {\n fontSize?: number;\n fontFamily?: string;\n charset?: string;\n invert?: boolean;\n}\n\nclass AsciiFilter {\n renderer: THREE.WebGLRenderer;\n domElement: HTMLDivElement;\n pre: HTMLPreElement;\n canvas: HTMLCanvasElement;\n context: CanvasRenderingContext2D;\n deg: number;\n invert: boolean;\n fontSize: number;\n fontFamily: string;\n charset: string;\n width: number = 0;\n height: number = 0;\n cols: number = 0;\n rows: number = 0;\n center: { x: number; y: number } = { x: 0, y: 0 };\n mouse: { x: number; y: number } = { x: 0, y: 0 };\n\n constructor(\n renderer: THREE.WebGLRenderer,\n { fontSize, fontFamily, charset, invert }: AsciiFilterOptions = {},\n ) {\n this.renderer = renderer;\n this.domElement = document.createElement(\"div\");\n this.domElement.style.position = \"absolute\";\n this.domElement.style.top = \"0\";\n this.domElement.style.left = \"0\";\n this.domElement.style.width = \"100%\";\n this.domElement.style.height = \"100%\";\n\n this.pre = document.createElement(\"pre\");\n this.domElement.appendChild(this.pre);\n\n this.canvas = document.createElement(\"canvas\");\n const ctx = this.canvas.getContext(\"2d\");\n if (!ctx) throw new Error(\"Could not get 2d context\");\n this.context = ctx;\n this.domElement.appendChild(this.canvas);\n\n this.deg = 0;\n this.invert = invert ?? true;\n this.fontSize = fontSize ?? 12;\n this.fontFamily = fontFamily ?? \"'Courier New', monospace\";\n this.charset =\n charset ??\n \" .'`^\\\",:;Il!i~+_-?][}{1)(|/tfjrxnuvczXYUJCLQ0OZmwqpdbkhao*#MW&8%B@$\";\n\n this.context.imageSmoothingEnabled = false;\n\n this.onMouseMove = this.onMouseMove.bind(this);\n document.addEventListener(\"mousemove\", this.onMouseMove);\n }\n\n setSize(width: number, height: number) {\n this.width = width;\n this.height = height;\n this.renderer.setSize(width, height);\n this.reset();\n\n this.center = { x: width / 2, y: height / 2 };\n this.mouse = { x: this.center.x, y: this.center.y };\n }\n\n reset() {\n this.context.font = `${this.fontSize}px ${this.fontFamily}`;\n const charWidth = this.context.measureText(\"A\").width;\n\n this.cols = Math.floor(\n this.width / (this.fontSize * (charWidth / this.fontSize)),\n );\n this.rows = Math.floor(this.height / this.fontSize);\n\n this.canvas.width = this.cols;\n this.canvas.height = this.rows;\n this.pre.style.fontFamily = this.fontFamily;\n this.pre.style.fontSize = `${this.fontSize}px`;\n this.pre.style.margin = \"0\";\n this.pre.style.padding = \"0\";\n this.pre.style.lineHeight = \"1em\";\n this.pre.style.position = \"absolute\";\n this.pre.style.left = \"0\";\n this.pre.style.top = \"0\";\n this.pre.style.zIndex = \"9\";\n this.pre.style.backgroundAttachment = \"fixed\";\n this.pre.style.mixBlendMode = \"difference\";\n }\n\n render(scene: THREE.Scene, camera: THREE.Camera) {\n this.renderer.render(scene, camera);\n\n const w = this.canvas.width;\n const h = this.canvas.height;\n this.context.clearRect(0, 0, w, h);\n if (this.context && w && h) {\n this.context.drawImage(this.renderer.domElement, 0, 0, w, h);\n }\n\n this.asciify(this.context, w, h);\n this.hue();\n }\n\n onMouseMove(e: MouseEvent) {\n this.mouse = { x: e.clientX * PX_RATIO, y: e.clientY * PX_RATIO };\n }\n\n get dx() {\n return this.mouse.x - this.center.x;\n }\n\n get dy() {\n return this.mouse.y - this.center.y;\n }\n\n hue() {\n const deg = (Math.atan2(this.dy, this.dx) * 180) / Math.PI;\n this.deg += (deg - this.deg) * 0.075;\n this.domElement.style.filter = `hue-rotate(${this.deg.toFixed(1)}deg)`;\n }\n\n asciify(ctx: CanvasRenderingContext2D, w: number, h: number) {\n if (w && h) {\n const imgData = ctx.getImageData(0, 0, w, h).data;\n let str = \"\";\n for (let y = 0; y < h; y++) {\n for (let x = 0; x < w; x++) {\n const i = x * 4 + y * 4 * w;\n const [r, g, b, a] = [\n imgData[i],\n imgData[i + 1],\n imgData[i + 2],\n imgData[i + 3],\n ];\n\n if (a === 0) {\n str += \" \";\n continue;\n }\n\n const gray = (0.3 * r + 0.6 * g + 0.1 * b) / 255;\n let idx = Math.floor((1 - gray) * (this.charset.length - 1));\n if (this.invert) idx = this.charset.length - idx - 1;\n str += this.charset[idx];\n }\n str += \"\\n\";\n }\n this.pre.innerHTML = str;\n }\n }\n\n dispose() {\n document.removeEventListener(\"mousemove\", this.onMouseMove);\n }\n}\n\ninterface CanvasTxtOptions {\n fontSize?: number;\n fontFamily?: string;\n color?: string;\n}\n\nclass CanvasTxt {\n canvas: HTMLCanvasElement;\n context: CanvasRenderingContext2D;\n txt: string;\n fontSize: number;\n fontFamily: string;\n color: string;\n font: string;\n\n constructor(\n txt: string,\n {\n fontSize = 200,\n fontFamily = \"Arial\",\n color = \"var(--ds-color-fg)\",\n }: CanvasTxtOptions = {},\n ) {\n this.canvas = document.createElement(\"canvas\");\n const ctx = this.canvas.getContext(\"2d\");\n if (!ctx) throw new Error(\"Could not get 2d context\");\n this.context = ctx;\n this.txt = txt;\n this.fontSize = fontSize;\n this.fontFamily = fontFamily;\n this.color = color;\n\n this.font = `600 ${this.fontSize}px ${this.fontFamily}`;\n }\n\n resize() {\n this.context.font = this.font;\n const metrics = this.context.measureText(this.txt);\n\n const textWidth = Math.ceil(metrics.width) + 20;\n const textHeight =\n Math.ceil(\n metrics.actualBoundingBoxAscent + metrics.actualBoundingBoxDescent,\n ) + 20;\n\n this.canvas.width = textWidth;\n this.canvas.height = textHeight;\n }\n\n render() {\n this.context.clearRect(0, 0, this.canvas.width, this.canvas.height);\n this.context.fillStyle = resolveCanvasColor(this.color);\n this.context.font = this.font;\n\n const metrics = this.context.measureText(this.txt);\n const yPos = 10 + metrics.actualBoundingBoxAscent;\n\n this.context.fillText(this.txt, 10, yPos);\n }\n\n get width() {\n return this.canvas.width;\n }\n\n get height() {\n return this.canvas.height;\n }\n\n get texture() {\n return this.canvas;\n }\n}\n\ninterface CanvAsciiOptions {\n text: string;\n asciiFontSize: number;\n textFontSize: number;\n textColor: string;\n planeBaseHeight: number;\n enableWaves: boolean;\n}\n\nclass CanvAscii {\n textString: string;\n asciiFontSize: number;\n textFontSize: number;\n textColor: string;\n planeBaseHeight: number;\n container: HTMLElement;\n width: number;\n height: number;\n enableWaves: boolean;\n camera: THREE.PerspectiveCamera;\n scene: THREE.Scene;\n mouse: { x: number; y: number };\n textCanvas!: CanvasTxt;\n texture!: THREE.CanvasTexture;\n geometry!: THREE.PlaneGeometry;\n material!: THREE.ShaderMaterial;\n mesh!: THREE.Mesh;\n renderer!: THREE.WebGLRenderer;\n filter!: AsciiFilter;\n center: { x: number; y: number } = { x: 0, y: 0 };\n animationFrameId: number = 0;\n\n constructor(\n {\n text,\n asciiFontSize,\n textFontSize,\n textColor,\n planeBaseHeight,\n enableWaves,\n }: CanvAsciiOptions,\n containerElem: HTMLElement,\n width: number,\n height: number,\n ) {\n this.textString = text;\n this.asciiFontSize = asciiFontSize;\n this.textFontSize = textFontSize;\n this.textColor = textColor;\n this.planeBaseHeight = planeBaseHeight;\n this.container = containerElem;\n this.width = width;\n this.height = height;\n this.enableWaves = enableWaves;\n\n this.camera = new THREE.PerspectiveCamera(\n 45,\n this.width / this.height,\n 1,\n 1000,\n );\n this.camera.position.z = 30;\n\n this.scene = new THREE.Scene();\n this.mouse = { x: 0, y: 0 };\n\n this.onMouseMove = this.onMouseMove.bind(this);\n\n this.setMesh();\n this.setRenderer();\n }\n\n setMesh() {\n this.textCanvas = new CanvasTxt(this.textString, {\n fontSize: this.textFontSize,\n fontFamily: \"IBM Plex Mono\",\n color: this.textColor,\n });\n this.textCanvas.resize();\n this.textCanvas.render();\n\n this.texture = new THREE.CanvasTexture(this.textCanvas.texture);\n this.texture.minFilter = THREE.NearestFilter;\n\n const textAspect = this.textCanvas.width / this.textCanvas.height;\n const baseH = this.planeBaseHeight;\n const planeW = baseH * textAspect;\n const planeH = baseH;\n\n this.geometry = new THREE.PlaneGeometry(planeW, planeH, 36, 36);\n this.material = new THREE.ShaderMaterial({\n vertexShader,\n fragmentShader,\n transparent: true,\n uniforms: {\n uTime: { value: 0 },\n mouse: { value: 1.0 },\n uTexture: { value: this.texture },\n uEnableWaves: { value: this.enableWaves ? 1.0 : 0.0 },\n },\n });\n\n this.mesh = new THREE.Mesh(this.geometry, this.material);\n this.scene.add(this.mesh);\n }\n\n setRenderer() {\n this.renderer = new THREE.WebGLRenderer({ antialias: false, alpha: true });\n this.renderer.setPixelRatio(1);\n this.renderer.setClearColor(0x000000, 0);\n\n this.filter = new AsciiFilter(this.renderer, {\n fontFamily: \"IBM Plex Mono\",\n fontSize: this.asciiFontSize,\n invert: true,\n });\n\n this.container.appendChild(this.filter.domElement);\n this.setSize(this.width, this.height);\n\n this.container.addEventListener(\"mousemove\", this.onMouseMove);\n this.container.addEventListener(\"touchmove\", this.onMouseMove);\n }\n\n setSize(w: number, h: number) {\n this.width = w;\n this.height = h;\n\n this.camera.aspect = w / h;\n this.camera.updateProjectionMatrix();\n\n this.filter.setSize(w, h);\n\n this.center = { x: w / 2, y: h / 2 };\n }\n\n load() {\n this.animate();\n }\n\n onMouseMove(evt: any) {\n const e = evt.touches ? evt.touches[0] : evt;\n const bounds = this.container.getBoundingClientRect();\n const x = e.clientX - bounds.left;\n const y = e.clientY - bounds.top;\n this.mouse = { x, y };\n }\n\n animate() {\n const animateFrame = () => {\n this.animationFrameId = requestAnimationFrame(animateFrame);\n this.render();\n };\n animateFrame();\n }\n\n render() {\n const time = new Date().getTime() * 0.001;\n\n this.textCanvas.render();\n this.texture.needsUpdate = true;\n\n (this.mesh.material as any).uniforms.uTime.value = Math.sin(time);\n\n this.updateRotation();\n this.filter.render(this.scene, this.camera);\n }\n\n updateRotation() {\n const map = (\n n: number,\n start: number,\n stop: number,\n start2: number,\n stop2: number,\n ) => {\n return ((n - start) / (stop - start)) * (stop2 - start2) + start2;\n };\n\n const x = map(this.mouse.y, 0, this.height, 0.5, -0.5);\n const y = map(this.mouse.x, 0, this.width, -0.5, 0.5);\n\n this.mesh.rotation.x += (x - this.mesh.rotation.x) * 0.05;\n this.mesh.rotation.y += (y - this.mesh.rotation.y) * 0.05;\n }\n\n clear() {\n this.scene.traverse((obj: THREE.Object3D) => {\n if (obj instanceof THREE.Mesh) {\n if (Array.isArray(obj.material)) {\n obj.material.forEach((m: THREE.Material) => m.dispose());\n } else if (obj.material instanceof THREE.Material) {\n obj.material.dispose();\n }\n obj.geometry.dispose();\n }\n });\n this.scene.clear();\n }\n\n dispose() {\n cancelAnimationFrame(this.animationFrameId);\n this.filter.dispose();\n if (this.filter.domElement.parentNode === this.container) {\n this.container.removeChild(this.filter.domElement);\n }\n this.container.removeEventListener(\"mousemove\", this.onMouseMove);\n this.container.removeEventListener(\"touchmove\", this.onMouseMove);\n this.clear();\n this.renderer.dispose();\n }\n}\n\nexport interface ASCIITextProps {\n text?: string;\n asciiFontSize?: number;\n textFontSize?: number;\n textColor?: string;\n planeBaseHeight?: number;\n enableWaves?: boolean;\n className?: string;\n style?: React.CSSProperties;\n}\n\nexport const ASCIIText: React.FC<ASCIITextProps> = ({\n text = \"David!\",\n asciiFontSize = 8,\n textFontSize = 200,\n textColor = \"var(--ds-color-fg)\",\n planeBaseHeight = 8,\n enableWaves = true,\n className = \"\",\n style = {},\n}) => {\n const containerRef = useRef<HTMLDivElement>(null);\n const asciiRef = useRef<CanvAscii | null>(null);\n\n useEffect(() => {\n if (!containerRef.current) return;\n\n const { width, height } = containerRef.current.getBoundingClientRect();\n\n const initAscii = (w: number, h: number) => {\n if (asciiRef.current) asciiRef.current.dispose();\n asciiRef.current = new CanvAscii(\n {\n text,\n asciiFontSize,\n textFontSize,\n textColor,\n planeBaseHeight,\n enableWaves,\n },\n containerRef.current!,\n w,\n h,\n );\n asciiRef.current.load();\n };\n\n if (width === 0 || height === 0) {\n const observer = new IntersectionObserver(\n ([entry]) => {\n if (\n entry.isIntersecting &&\n entry.boundingClientRect.width > 0 &&\n entry.boundingClientRect.height > 0\n ) {\n initAscii(\n entry.boundingClientRect.width,\n entry.boundingClientRect.height,\n );\n observer.disconnect();\n }\n },\n { threshold: 0.1 },\n );\n\n observer.observe(containerRef.current);\n\n return () => {\n observer.disconnect();\n if (asciiRef.current) {\n asciiRef.current.dispose();\n }\n };\n }\n\n initAscii(width, height);\n\n const ro = new ResizeObserver((entries) => {\n if (!entries[0] || !asciiRef.current) return;\n const { width: w, height: h } = entries[0].contentRect;\n if (w > 0 && h > 0) {\n asciiRef.current.setSize(w, h);\n }\n });\n ro.observe(containerRef.current);\n\n return () => {\n ro.disconnect();\n if (asciiRef.current) {\n asciiRef.current.dispose();\n }\n };\n }, [\n text,\n asciiFontSize,\n textFontSize,\n textColor,\n planeBaseHeight,\n enableWaves,\n ]);\n\n return (\n <div\n ref={containerRef}\n className={`ascii-text-container ${className}`}\n style={{\n position: \"absolute\",\n width: \"100%\",\n height: \"100%\",\n ...style,\n }}\n >\n <style>{`\n @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@500&display=swap');\n\n .ascii-text-container canvas {\n position: absolute;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n image-rendering: optimizeSpeed;\n image-rendering: -moz-crisp-edges;\n image-rendering: -o-crisp-edges;\n image-rendering: -webkit-optimize-contrast;\n image-rendering: optimize-contrast;\n image-rendering: crisp-edges;\n image-rendering: pixelated;\n }\n\n .ascii-text-container pre {\n margin: 0;\n user-select: none;\n padding: 0;\n line-height: 1em;\n text-align: left;\n position: absolute;\n left: 0;\n top: 0;\n background-image: radial-gradient(circle, var(--ds-color-accent) 0%, var(--ds-color-accent-hover) 50%, var(--ds-color-warning) 100%);\n background-attachment: fixed;\n -webkit-text-fill-color: transparent;\n -webkit-background-clip: text;\n background-clip: text;\n z-index: 9;\n mix-blend-mode: difference;\n }\n `}</style>\n </div>\n );\n};\n\nexport default ASCIIText;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ascii-text-Ctua6ucZ.cjs","names":[],"sources":["../../src/components/effects/ascii-text/ASCIIText.tsx"],"sourcesContent":["import React, { useRef, useEffect } from \"react\";\nimport * as THREE from \"three\";\n\nconst vertexShader = `\nvarying vec2 vUv;\nuniform float uTime;\nuniform float mouse;\nuniform float uEnableWaves;\n\nvoid main() {\n vUv = uv;\n float time = uTime * 5.;\n\n float waveFactor = uEnableWaves;\n\n vec3 transformed = position;\n\n transformed.x += sin(time + position.y) * 0.5 * waveFactor;\n transformed.y += cos(time + position.z) * 0.15 * waveFactor;\n transformed.z += sin(time + position.x) * waveFactor;\n\n gl_Position = projectionMatrix * modelViewMatrix * vec4(transformed, 1.0);\n}\n`;\n\nconst fragmentShader = `\nvarying vec2 vUv;\nuniform float mouse;\nuniform float uTime;\nuniform sampler2D uTexture;\n\nvoid main() {\n float time = uTime;\n vec2 pos = vUv;\n \n float move = sin(time + mouse) * 0.01;\n float r = texture2D(uTexture, pos + cos(time * 2. - time + pos.x) * .01).r;\n float g = texture2D(uTexture, pos + tan(time * .5 + pos.x - time) * .01).g;\n float b = texture2D(uTexture, pos - cos(time * 2. + time + pos.y) * .01).b;\n float a = texture2D(uTexture, pos).a;\n gl_FragColor = vec4(r, g, b, a);\n}\n`;\n\nconst PX_RATIO = typeof window !== \"undefined\" ? window.devicePixelRatio : 1;\n\nconst resolvedCanvasColorCache = new Map<string, string>();\n\nconst getThemeSignature = () => {\n if (typeof document === \"undefined\") return \"\";\n\n const root = document.documentElement;\n return [\n root.getAttribute(\"data-brand\") ?? \"\",\n root.getAttribute(\"data-mode\") ?? \"\",\n root.getAttribute(\"data-theme\") ?? \"\",\n ].join(\"|\");\n};\n\nconst resolveCanvasColor = (value: string): string => {\n if (typeof document === \"undefined\") return value;\n if (!value.includes(\"var(\") && !value.includes(\"color-mix(\")) return value;\n\n const cacheKey = `${getThemeSignature()}::${value}`;\n const cachedValue = resolvedCanvasColorCache.get(cacheKey);\n if (cachedValue) {\n return cachedValue;\n }\n\n const probe = document.createElement(\"span\");\n probe.style.color = value;\n probe.style.position = \"fixed\";\n probe.style.pointerEvents = \"none\";\n probe.style.opacity = \"0\";\n document.body.appendChild(probe);\n const resolvedValue = getComputedStyle(probe).color || value;\n document.body.removeChild(probe);\n resolvedCanvasColorCache.set(cacheKey, resolvedValue);\n return resolvedValue;\n};\n\ninterface AsciiFilterOptions {\n fontSize?: number;\n fontFamily?: string;\n charset?: string;\n invert?: boolean;\n}\n\nclass AsciiFilter {\n renderer: THREE.WebGLRenderer;\n domElement: HTMLDivElement;\n pre: HTMLPreElement;\n canvas: HTMLCanvasElement;\n context: CanvasRenderingContext2D;\n deg: number;\n invert: boolean;\n fontSize: number;\n fontFamily: string;\n charset: string;\n width: number = 0;\n height: number = 0;\n cols: number = 0;\n rows: number = 0;\n center: { x: number; y: number } = { x: 0, y: 0 };\n mouse: { x: number; y: number } = { x: 0, y: 0 };\n\n constructor(\n renderer: THREE.WebGLRenderer,\n { fontSize, fontFamily, charset, invert }: AsciiFilterOptions = {},\n ) {\n this.renderer = renderer;\n this.domElement = document.createElement(\"div\");\n this.domElement.style.position = \"absolute\";\n this.domElement.style.top = \"0\";\n this.domElement.style.left = \"0\";\n this.domElement.style.width = \"100%\";\n this.domElement.style.height = \"100%\";\n\n this.pre = document.createElement(\"pre\");\n this.domElement.appendChild(this.pre);\n\n this.canvas = document.createElement(\"canvas\");\n const ctx = this.canvas.getContext(\"2d\");\n if (!ctx) throw new Error(\"Could not get 2d context\");\n this.context = ctx;\n this.domElement.appendChild(this.canvas);\n\n this.deg = 0;\n this.invert = invert ?? true;\n this.fontSize = fontSize ?? 12;\n this.fontFamily = fontFamily ?? \"'Courier New', monospace\";\n this.charset =\n charset ??\n \" .'`^\\\",:;Il!i~+_-?][}{1)(|/tfjrxnuvczXYUJCLQ0OZmwqpdbkhao*#MW&8%B@$\";\n\n this.context.imageSmoothingEnabled = false;\n\n this.onMouseMove = this.onMouseMove.bind(this);\n document.addEventListener(\"mousemove\", this.onMouseMove);\n }\n\n setSize(width: number, height: number) {\n this.width = width;\n this.height = height;\n this.renderer.setSize(width, height);\n this.reset();\n\n this.center = { x: width / 2, y: height / 2 };\n this.mouse = { x: this.center.x, y: this.center.y };\n }\n\n reset() {\n this.context.font = `${this.fontSize}px ${this.fontFamily}`;\n const charWidth = this.context.measureText(\"A\").width;\n\n this.cols = Math.floor(\n this.width / (this.fontSize * (charWidth / this.fontSize)),\n );\n this.rows = Math.floor(this.height / this.fontSize);\n\n this.canvas.width = this.cols;\n this.canvas.height = this.rows;\n this.pre.style.fontFamily = this.fontFamily;\n this.pre.style.fontSize = `${this.fontSize}px`;\n this.pre.style.margin = \"0\";\n this.pre.style.padding = \"0\";\n this.pre.style.lineHeight = \"1em\";\n this.pre.style.position = \"absolute\";\n this.pre.style.left = \"0\";\n this.pre.style.top = \"0\";\n this.pre.style.zIndex = \"9\";\n this.pre.style.backgroundAttachment = \"fixed\";\n this.pre.style.mixBlendMode = \"difference\";\n }\n\n render(scene: THREE.Scene, camera: THREE.Camera) {\n this.renderer.render(scene, camera);\n\n const w = this.canvas.width;\n const h = this.canvas.height;\n this.context.clearRect(0, 0, w, h);\n if (this.context && w && h) {\n this.context.drawImage(this.renderer.domElement, 0, 0, w, h);\n }\n\n this.asciify(this.context, w, h);\n this.hue();\n }\n\n onMouseMove(e: MouseEvent) {\n this.mouse = { x: e.clientX * PX_RATIO, y: e.clientY * PX_RATIO };\n }\n\n get dx() {\n return this.mouse.x - this.center.x;\n }\n\n get dy() {\n return this.mouse.y - this.center.y;\n }\n\n hue() {\n const deg = (Math.atan2(this.dy, this.dx) * 180) / Math.PI;\n this.deg += (deg - this.deg) * 0.075;\n this.domElement.style.filter = `hue-rotate(${this.deg.toFixed(1)}deg)`;\n }\n\n asciify(ctx: CanvasRenderingContext2D, w: number, h: number) {\n if (w && h) {\n const imgData = ctx.getImageData(0, 0, w, h).data;\n let str = \"\";\n for (let y = 0; y < h; y++) {\n for (let x = 0; x < w; x++) {\n const i = x * 4 + y * 4 * w;\n const [r, g, b, a] = [\n imgData[i],\n imgData[i + 1],\n imgData[i + 2],\n imgData[i + 3],\n ];\n\n if (a === 0) {\n str += \" \";\n continue;\n }\n\n const gray = (0.3 * r + 0.6 * g + 0.1 * b) / 255;\n let idx = Math.floor((1 - gray) * (this.charset.length - 1));\n if (this.invert) idx = this.charset.length - idx - 1;\n str += this.charset[idx];\n }\n str += \"\\n\";\n }\n this.pre.innerHTML = str;\n }\n }\n\n dispose() {\n document.removeEventListener(\"mousemove\", this.onMouseMove);\n }\n}\n\ninterface CanvasTxtOptions {\n fontSize?: number;\n fontFamily?: string;\n color?: string;\n}\n\nclass CanvasTxt {\n canvas: HTMLCanvasElement;\n context: CanvasRenderingContext2D;\n txt: string;\n fontSize: number;\n fontFamily: string;\n color: string;\n font: string;\n\n constructor(\n txt: string,\n {\n fontSize = 200,\n fontFamily = \"Arial\",\n color = \"var(--ds-color-fg)\",\n }: CanvasTxtOptions = {},\n ) {\n this.canvas = document.createElement(\"canvas\");\n const ctx = this.canvas.getContext(\"2d\");\n if (!ctx) throw new Error(\"Could not get 2d context\");\n this.context = ctx;\n this.txt = txt;\n this.fontSize = fontSize;\n this.fontFamily = fontFamily;\n this.color = color;\n\n this.font = `600 ${this.fontSize}px ${this.fontFamily}`;\n }\n\n resize() {\n this.context.font = this.font;\n const metrics = this.context.measureText(this.txt);\n\n const textWidth = Math.ceil(metrics.width) + 20;\n const textHeight =\n Math.ceil(\n metrics.actualBoundingBoxAscent + metrics.actualBoundingBoxDescent,\n ) + 20;\n\n this.canvas.width = textWidth;\n this.canvas.height = textHeight;\n }\n\n render() {\n this.context.clearRect(0, 0, this.canvas.width, this.canvas.height);\n this.context.fillStyle = resolveCanvasColor(this.color);\n this.context.font = this.font;\n\n const metrics = this.context.measureText(this.txt);\n const yPos = 10 + metrics.actualBoundingBoxAscent;\n\n this.context.fillText(this.txt, 10, yPos);\n }\n\n get width() {\n return this.canvas.width;\n }\n\n get height() {\n return this.canvas.height;\n }\n\n get texture() {\n return this.canvas;\n }\n}\n\ninterface CanvAsciiOptions {\n text: string;\n asciiFontSize: number;\n textFontSize: number;\n textColor: string;\n planeBaseHeight: number;\n enableWaves: boolean;\n}\n\nclass CanvAscii {\n textString: string;\n asciiFontSize: number;\n textFontSize: number;\n textColor: string;\n planeBaseHeight: number;\n container: HTMLElement;\n width: number;\n height: number;\n enableWaves: boolean;\n camera: THREE.PerspectiveCamera;\n scene: THREE.Scene;\n mouse: { x: number; y: number };\n textCanvas!: CanvasTxt;\n texture!: THREE.CanvasTexture;\n geometry!: THREE.PlaneGeometry;\n material!: THREE.ShaderMaterial;\n mesh!: THREE.Mesh;\n renderer!: THREE.WebGLRenderer;\n filter!: AsciiFilter;\n center: { x: number; y: number } = { x: 0, y: 0 };\n animationFrameId: number = 0;\n\n constructor(\n {\n text,\n asciiFontSize,\n textFontSize,\n textColor,\n planeBaseHeight,\n enableWaves,\n }: CanvAsciiOptions,\n containerElem: HTMLElement,\n width: number,\n height: number,\n ) {\n this.textString = text;\n this.asciiFontSize = asciiFontSize;\n this.textFontSize = textFontSize;\n this.textColor = textColor;\n this.planeBaseHeight = planeBaseHeight;\n this.container = containerElem;\n this.width = width;\n this.height = height;\n this.enableWaves = enableWaves;\n\n this.camera = new THREE.PerspectiveCamera(\n 45,\n this.width / this.height,\n 1,\n 1000,\n );\n this.camera.position.z = 30;\n\n this.scene = new THREE.Scene();\n this.mouse = { x: 0, y: 0 };\n\n this.onMouseMove = this.onMouseMove.bind(this);\n\n this.setMesh();\n this.setRenderer();\n }\n\n setMesh() {\n this.textCanvas = new CanvasTxt(this.textString, {\n fontSize: this.textFontSize,\n fontFamily: \"IBM Plex Mono\",\n color: this.textColor,\n });\n this.textCanvas.resize();\n this.textCanvas.render();\n\n this.texture = new THREE.CanvasTexture(this.textCanvas.texture);\n this.texture.minFilter = THREE.NearestFilter;\n\n const textAspect = this.textCanvas.width / this.textCanvas.height;\n const baseH = this.planeBaseHeight;\n const planeW = baseH * textAspect;\n const planeH = baseH;\n\n this.geometry = new THREE.PlaneGeometry(planeW, planeH, 36, 36);\n this.material = new THREE.ShaderMaterial({\n vertexShader,\n fragmentShader,\n transparent: true,\n uniforms: {\n uTime: { value: 0 },\n mouse: { value: 1.0 },\n uTexture: { value: this.texture },\n uEnableWaves: { value: this.enableWaves ? 1.0 : 0.0 },\n },\n });\n\n this.mesh = new THREE.Mesh(this.geometry, this.material);\n this.scene.add(this.mesh);\n }\n\n setRenderer() {\n this.renderer = new THREE.WebGLRenderer({ antialias: false, alpha: true });\n this.renderer.setPixelRatio(1);\n this.renderer.setClearColor(0x000000, 0);\n\n this.filter = new AsciiFilter(this.renderer, {\n fontFamily: \"IBM Plex Mono\",\n fontSize: this.asciiFontSize,\n invert: true,\n });\n\n this.container.appendChild(this.filter.domElement);\n this.setSize(this.width, this.height);\n\n this.container.addEventListener(\"mousemove\", this.onMouseMove);\n this.container.addEventListener(\"touchmove\", this.onMouseMove);\n }\n\n setSize(w: number, h: number) {\n this.width = w;\n this.height = h;\n\n this.camera.aspect = w / h;\n this.camera.updateProjectionMatrix();\n\n this.filter.setSize(w, h);\n\n this.center = { x: w / 2, y: h / 2 };\n }\n\n load() {\n this.animate();\n }\n\n onMouseMove(evt: any) {\n const e = evt.touches ? evt.touches[0] : evt;\n const bounds = this.container.getBoundingClientRect();\n const x = e.clientX - bounds.left;\n const y = e.clientY - bounds.top;\n this.mouse = { x, y };\n }\n\n animate() {\n const animateFrame = () => {\n this.animationFrameId = requestAnimationFrame(animateFrame);\n this.render();\n };\n animateFrame();\n }\n\n render() {\n const time = new Date().getTime() * 0.001;\n\n this.textCanvas.render();\n this.texture.needsUpdate = true;\n\n (this.mesh.material as any).uniforms.uTime.value = Math.sin(time);\n\n this.updateRotation();\n this.filter.render(this.scene, this.camera);\n }\n\n updateRotation() {\n const map = (\n n: number,\n start: number,\n stop: number,\n start2: number,\n stop2: number,\n ) => {\n return ((n - start) / (stop - start)) * (stop2 - start2) + start2;\n };\n\n const x = map(this.mouse.y, 0, this.height, 0.5, -0.5);\n const y = map(this.mouse.x, 0, this.width, -0.5, 0.5);\n\n this.mesh.rotation.x += (x - this.mesh.rotation.x) * 0.05;\n this.mesh.rotation.y += (y - this.mesh.rotation.y) * 0.05;\n }\n\n clear() {\n this.scene.traverse((obj: THREE.Object3D) => {\n if (obj instanceof THREE.Mesh) {\n if (Array.isArray(obj.material)) {\n obj.material.forEach((m: THREE.Material) => m.dispose());\n } else if (obj.material instanceof THREE.Material) {\n obj.material.dispose();\n }\n obj.geometry.dispose();\n }\n });\n this.scene.clear();\n }\n\n dispose() {\n cancelAnimationFrame(this.animationFrameId);\n this.filter.dispose();\n if (this.filter.domElement.parentNode === this.container) {\n this.container.removeChild(this.filter.domElement);\n }\n this.container.removeEventListener(\"mousemove\", this.onMouseMove);\n this.container.removeEventListener(\"touchmove\", this.onMouseMove);\n this.clear();\n this.renderer.dispose();\n }\n}\n\nexport interface ASCIITextProps {\n text?: string;\n asciiFontSize?: number;\n textFontSize?: number;\n textColor?: string;\n planeBaseHeight?: number;\n enableWaves?: boolean;\n className?: string;\n style?: React.CSSProperties;\n}\n\nexport const ASCIIText: React.FC<ASCIITextProps> = ({\n text = \"David!\",\n asciiFontSize = 8,\n textFontSize = 200,\n textColor = \"var(--ds-color-fg)\",\n planeBaseHeight = 8,\n enableWaves = true,\n className = \"\",\n style = {},\n}) => {\n const containerRef = useRef<HTMLDivElement>(null);\n const asciiRef = useRef<CanvAscii | null>(null);\n\n useEffect(() => {\n if (!containerRef.current) return;\n\n const { width, height } = containerRef.current.getBoundingClientRect();\n\n const initAscii = (w: number, h: number) => {\n if (asciiRef.current) asciiRef.current.dispose();\n asciiRef.current = new CanvAscii(\n {\n text,\n asciiFontSize,\n textFontSize,\n textColor,\n planeBaseHeight,\n enableWaves,\n },\n containerRef.current!,\n w,\n h,\n );\n asciiRef.current.load();\n };\n\n if (width === 0 || height === 0) {\n const observer = new IntersectionObserver(\n ([entry]) => {\n if (\n entry.isIntersecting &&\n entry.boundingClientRect.width > 0 &&\n entry.boundingClientRect.height > 0\n ) {\n initAscii(\n entry.boundingClientRect.width,\n entry.boundingClientRect.height,\n );\n observer.disconnect();\n }\n },\n { threshold: 0.1 },\n );\n\n observer.observe(containerRef.current);\n\n return () => {\n observer.disconnect();\n if (asciiRef.current) {\n asciiRef.current.dispose();\n }\n };\n }\n\n initAscii(width, height);\n\n const ro = new ResizeObserver((entries) => {\n if (!entries[0] || !asciiRef.current) return;\n const { width: w, height: h } = entries[0].contentRect;\n if (w > 0 && h > 0) {\n asciiRef.current.setSize(w, h);\n }\n });\n ro.observe(containerRef.current);\n\n return () => {\n ro.disconnect();\n if (asciiRef.current) {\n asciiRef.current.dispose();\n }\n };\n }, [\n text,\n asciiFontSize,\n textFontSize,\n textColor,\n planeBaseHeight,\n enableWaves,\n ]);\n\n return (\n <div\n ref={containerRef}\n className={`ascii-text-container ${className}`}\n style={{\n position: \"absolute\",\n width: \"100%\",\n height: \"100%\",\n ...style,\n }}\n >\n <style>{`\n @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@500&display=swap');\n\n .ascii-text-container canvas {\n position: absolute;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n image-rendering: optimizeSpeed;\n image-rendering: -moz-crisp-edges;\n image-rendering: -o-crisp-edges;\n image-rendering: -webkit-optimize-contrast;\n image-rendering: optimize-contrast;\n image-rendering: crisp-edges;\n image-rendering: pixelated;\n }\n\n .ascii-text-container pre {\n margin: 0;\n user-select: none;\n padding: 0;\n line-height: 1em;\n text-align: left;\n position: absolute;\n left: 0;\n top: 0;\n background-image: radial-gradient(circle, var(--ds-color-accent) 0%, var(--ds-color-accent-hover) 50%, var(--ds-color-warning) 100%);\n background-attachment: fixed;\n -webkit-text-fill-color: transparent;\n -webkit-background-clip: text;\n background-clip: text;\n z-index: 9;\n mix-blend-mode: difference;\n }\n `}</style>\n </div>\n );\n};\n\nexport default ASCIIText;\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ascii-text-C6JegLhP.mjs","names":[],"sources":["../../src/components/effects/ascii-text/ASCIIText.tsx"],"sourcesContent":["import React, { useRef, useEffect } from \"react\";\nimport * as THREE from \"three\";\n\nconst vertexShader = `\nvarying vec2 vUv;\nuniform float uTime;\nuniform float mouse;\nuniform float uEnableWaves;\n\nvoid main() {\n vUv = uv;\n float time = uTime * 5.;\n\n float waveFactor = uEnableWaves;\n\n vec3 transformed = position;\n\n transformed.x += sin(time + position.y) * 0.5 * waveFactor;\n transformed.y += cos(time + position.z) * 0.15 * waveFactor;\n transformed.z += sin(time + position.x) * waveFactor;\n\n gl_Position = projectionMatrix * modelViewMatrix * vec4(transformed, 1.0);\n}\n`;\n\nconst fragmentShader = `\nvarying vec2 vUv;\nuniform float mouse;\nuniform float uTime;\nuniform sampler2D uTexture;\n\nvoid main() {\n float time = uTime;\n vec2 pos = vUv;\n \n float move = sin(time + mouse) * 0.01;\n float r = texture2D(uTexture, pos + cos(time * 2. - time + pos.x) * .01).r;\n float g = texture2D(uTexture, pos + tan(time * .5 + pos.x - time) * .01).g;\n float b = texture2D(uTexture, pos - cos(time * 2. + time + pos.y) * .01).b;\n float a = texture2D(uTexture, pos).a;\n gl_FragColor = vec4(r, g, b, a);\n}\n`;\n\nconst PX_RATIO = typeof window !== \"undefined\" ? window.devicePixelRatio : 1;\n\nconst resolvedCanvasColorCache = new Map<string, string>();\n\nconst getThemeSignature = () => {\n if (typeof document === \"undefined\") return \"\";\n\n const root = document.documentElement;\n return [\n root.getAttribute(\"data-brand\") ?? \"\",\n root.getAttribute(\"data-mode\") ?? \"\",\n root.getAttribute(\"data-theme\") ?? \"\",\n ].join(\"|\");\n};\n\nconst resolveCanvasColor = (value: string): string => {\n if (typeof document === \"undefined\") return value;\n if (!value.includes(\"var(\") && !value.includes(\"color-mix(\")) return value;\n\n const cacheKey = `${getThemeSignature()}::${value}`;\n const cachedValue = resolvedCanvasColorCache.get(cacheKey);\n if (cachedValue) {\n return cachedValue;\n }\n\n const probe = document.createElement(\"span\");\n probe.style.color = value;\n probe.style.position = \"fixed\";\n probe.style.pointerEvents = \"none\";\n probe.style.opacity = \"0\";\n document.body.appendChild(probe);\n const resolvedValue = getComputedStyle(probe).color || value;\n document.body.removeChild(probe);\n resolvedCanvasColorCache.set(cacheKey, resolvedValue);\n return resolvedValue;\n};\n\ninterface AsciiFilterOptions {\n fontSize?: number;\n fontFamily?: string;\n charset?: string;\n invert?: boolean;\n}\n\nclass AsciiFilter {\n renderer: THREE.WebGLRenderer;\n domElement: HTMLDivElement;\n pre: HTMLPreElement;\n canvas: HTMLCanvasElement;\n context: CanvasRenderingContext2D;\n deg: number;\n invert: boolean;\n fontSize: number;\n fontFamily: string;\n charset: string;\n width: number = 0;\n height: number = 0;\n cols: number = 0;\n rows: number = 0;\n center: { x: number; y: number } = { x: 0, y: 0 };\n mouse: { x: number; y: number } = { x: 0, y: 0 };\n\n constructor(\n renderer: THREE.WebGLRenderer,\n { fontSize, fontFamily, charset, invert }: AsciiFilterOptions = {},\n ) {\n this.renderer = renderer;\n this.domElement = document.createElement(\"div\");\n this.domElement.style.position = \"absolute\";\n this.domElement.style.top = \"0\";\n this.domElement.style.left = \"0\";\n this.domElement.style.width = \"100%\";\n this.domElement.style.height = \"100%\";\n\n this.pre = document.createElement(\"pre\");\n this.domElement.appendChild(this.pre);\n\n this.canvas = document.createElement(\"canvas\");\n const ctx = this.canvas.getContext(\"2d\");\n if (!ctx) throw new Error(\"Could not get 2d context\");\n this.context = ctx;\n this.domElement.appendChild(this.canvas);\n\n this.deg = 0;\n this.invert = invert ?? true;\n this.fontSize = fontSize ?? 12;\n this.fontFamily = fontFamily ?? \"'Courier New', monospace\";\n this.charset =\n charset ??\n \" .'`^\\\",:;Il!i~+_-?][}{1)(|/tfjrxnuvczXYUJCLQ0OZmwqpdbkhao*#MW&8%B@$\";\n\n this.context.imageSmoothingEnabled = false;\n\n this.onMouseMove = this.onMouseMove.bind(this);\n document.addEventListener(\"mousemove\", this.onMouseMove);\n }\n\n setSize(width: number, height: number) {\n this.width = width;\n this.height = height;\n this.renderer.setSize(width, height);\n this.reset();\n\n this.center = { x: width / 2, y: height / 2 };\n this.mouse = { x: this.center.x, y: this.center.y };\n }\n\n reset() {\n this.context.font = `${this.fontSize}px ${this.fontFamily}`;\n const charWidth = this.context.measureText(\"A\").width;\n\n this.cols = Math.floor(\n this.width / (this.fontSize * (charWidth / this.fontSize)),\n );\n this.rows = Math.floor(this.height / this.fontSize);\n\n this.canvas.width = this.cols;\n this.canvas.height = this.rows;\n this.pre.style.fontFamily = this.fontFamily;\n this.pre.style.fontSize = `${this.fontSize}px`;\n this.pre.style.margin = \"0\";\n this.pre.style.padding = \"0\";\n this.pre.style.lineHeight = \"1em\";\n this.pre.style.position = \"absolute\";\n this.pre.style.left = \"0\";\n this.pre.style.top = \"0\";\n this.pre.style.zIndex = \"9\";\n this.pre.style.backgroundAttachment = \"fixed\";\n this.pre.style.mixBlendMode = \"difference\";\n }\n\n render(scene: THREE.Scene, camera: THREE.Camera) {\n this.renderer.render(scene, camera);\n\n const w = this.canvas.width;\n const h = this.canvas.height;\n this.context.clearRect(0, 0, w, h);\n if (this.context && w && h) {\n this.context.drawImage(this.renderer.domElement, 0, 0, w, h);\n }\n\n this.asciify(this.context, w, h);\n this.hue();\n }\n\n onMouseMove(e: MouseEvent) {\n this.mouse = { x: e.clientX * PX_RATIO, y: e.clientY * PX_RATIO };\n }\n\n get dx() {\n return this.mouse.x - this.center.x;\n }\n\n get dy() {\n return this.mouse.y - this.center.y;\n }\n\n hue() {\n const deg = (Math.atan2(this.dy, this.dx) * 180) / Math.PI;\n this.deg += (deg - this.deg) * 0.075;\n this.domElement.style.filter = `hue-rotate(${this.deg.toFixed(1)}deg)`;\n }\n\n asciify(ctx: CanvasRenderingContext2D, w: number, h: number) {\n if (w && h) {\n const imgData = ctx.getImageData(0, 0, w, h).data;\n let str = \"\";\n for (let y = 0; y < h; y++) {\n for (let x = 0; x < w; x++) {\n const i = x * 4 + y * 4 * w;\n const [r, g, b, a] = [\n imgData[i],\n imgData[i + 1],\n imgData[i + 2],\n imgData[i + 3],\n ];\n\n if (a === 0) {\n str += \" \";\n continue;\n }\n\n const gray = (0.3 * r + 0.6 * g + 0.1 * b) / 255;\n let idx = Math.floor((1 - gray) * (this.charset.length - 1));\n if (this.invert) idx = this.charset.length - idx - 1;\n str += this.charset[idx];\n }\n str += \"\\n\";\n }\n this.pre.innerHTML = str;\n }\n }\n\n dispose() {\n document.removeEventListener(\"mousemove\", this.onMouseMove);\n }\n}\n\ninterface CanvasTxtOptions {\n fontSize?: number;\n fontFamily?: string;\n color?: string;\n}\n\nclass CanvasTxt {\n canvas: HTMLCanvasElement;\n context: CanvasRenderingContext2D;\n txt: string;\n fontSize: number;\n fontFamily: string;\n color: string;\n font: string;\n\n constructor(\n txt: string,\n {\n fontSize = 200,\n fontFamily = \"Arial\",\n color = \"var(--ds-color-fg)\",\n }: CanvasTxtOptions = {},\n ) {\n this.canvas = document.createElement(\"canvas\");\n const ctx = this.canvas.getContext(\"2d\");\n if (!ctx) throw new Error(\"Could not get 2d context\");\n this.context = ctx;\n this.txt = txt;\n this.fontSize = fontSize;\n this.fontFamily = fontFamily;\n this.color = color;\n\n this.font = `600 ${this.fontSize}px ${this.fontFamily}`;\n }\n\n resize() {\n this.context.font = this.font;\n const metrics = this.context.measureText(this.txt);\n\n const textWidth = Math.ceil(metrics.width) + 20;\n const textHeight =\n Math.ceil(\n metrics.actualBoundingBoxAscent + metrics.actualBoundingBoxDescent,\n ) + 20;\n\n this.canvas.width = textWidth;\n this.canvas.height = textHeight;\n }\n\n render() {\n this.context.clearRect(0, 0, this.canvas.width, this.canvas.height);\n this.context.fillStyle = resolveCanvasColor(this.color);\n this.context.font = this.font;\n\n const metrics = this.context.measureText(this.txt);\n const yPos = 10 + metrics.actualBoundingBoxAscent;\n\n this.context.fillText(this.txt, 10, yPos);\n }\n\n get width() {\n return this.canvas.width;\n }\n\n get height() {\n return this.canvas.height;\n }\n\n get texture() {\n return this.canvas;\n }\n}\n\ninterface CanvAsciiOptions {\n text: string;\n asciiFontSize: number;\n textFontSize: number;\n textColor: string;\n planeBaseHeight: number;\n enableWaves: boolean;\n}\n\nclass CanvAscii {\n textString: string;\n asciiFontSize: number;\n textFontSize: number;\n textColor: string;\n planeBaseHeight: number;\n container: HTMLElement;\n width: number;\n height: number;\n enableWaves: boolean;\n camera: THREE.PerspectiveCamera;\n scene: THREE.Scene;\n mouse: { x: number; y: number };\n textCanvas!: CanvasTxt;\n texture!: THREE.CanvasTexture;\n geometry!: THREE.PlaneGeometry;\n material!: THREE.ShaderMaterial;\n mesh!: THREE.Mesh;\n renderer!: THREE.WebGLRenderer;\n filter!: AsciiFilter;\n center: { x: number; y: number } = { x: 0, y: 0 };\n animationFrameId: number = 0;\n\n constructor(\n {\n text,\n asciiFontSize,\n textFontSize,\n textColor,\n planeBaseHeight,\n enableWaves,\n }: CanvAsciiOptions,\n containerElem: HTMLElement,\n width: number,\n height: number,\n ) {\n this.textString = text;\n this.asciiFontSize = asciiFontSize;\n this.textFontSize = textFontSize;\n this.textColor = textColor;\n this.planeBaseHeight = planeBaseHeight;\n this.container = containerElem;\n this.width = width;\n this.height = height;\n this.enableWaves = enableWaves;\n\n this.camera = new THREE.PerspectiveCamera(\n 45,\n this.width / this.height,\n 1,\n 1000,\n );\n this.camera.position.z = 30;\n\n this.scene = new THREE.Scene();\n this.mouse = { x: 0, y: 0 };\n\n this.onMouseMove = this.onMouseMove.bind(this);\n\n this.setMesh();\n this.setRenderer();\n }\n\n setMesh() {\n this.textCanvas = new CanvasTxt(this.textString, {\n fontSize: this.textFontSize,\n fontFamily: \"IBM Plex Mono\",\n color: this.textColor,\n });\n this.textCanvas.resize();\n this.textCanvas.render();\n\n this.texture = new THREE.CanvasTexture(this.textCanvas.texture);\n this.texture.minFilter = THREE.NearestFilter;\n\n const textAspect = this.textCanvas.width / this.textCanvas.height;\n const baseH = this.planeBaseHeight;\n const planeW = baseH * textAspect;\n const planeH = baseH;\n\n this.geometry = new THREE.PlaneGeometry(planeW, planeH, 36, 36);\n this.material = new THREE.ShaderMaterial({\n vertexShader,\n fragmentShader,\n transparent: true,\n uniforms: {\n uTime: { value: 0 },\n mouse: { value: 1.0 },\n uTexture: { value: this.texture },\n uEnableWaves: { value: this.enableWaves ? 1.0 : 0.0 },\n },\n });\n\n this.mesh = new THREE.Mesh(this.geometry, this.material);\n this.scene.add(this.mesh);\n }\n\n setRenderer() {\n this.renderer = new THREE.WebGLRenderer({ antialias: false, alpha: true });\n this.renderer.setPixelRatio(1);\n this.renderer.setClearColor(0x000000, 0);\n\n this.filter = new AsciiFilter(this.renderer, {\n fontFamily: \"IBM Plex Mono\",\n fontSize: this.asciiFontSize,\n invert: true,\n });\n\n this.container.appendChild(this.filter.domElement);\n this.setSize(this.width, this.height);\n\n this.container.addEventListener(\"mousemove\", this.onMouseMove);\n this.container.addEventListener(\"touchmove\", this.onMouseMove);\n }\n\n setSize(w: number, h: number) {\n this.width = w;\n this.height = h;\n\n this.camera.aspect = w / h;\n this.camera.updateProjectionMatrix();\n\n this.filter.setSize(w, h);\n\n this.center = { x: w / 2, y: h / 2 };\n }\n\n load() {\n this.animate();\n }\n\n onMouseMove(evt: any) {\n const e = evt.touches ? evt.touches[0] : evt;\n const bounds = this.container.getBoundingClientRect();\n const x = e.clientX - bounds.left;\n const y = e.clientY - bounds.top;\n this.mouse = { x, y };\n }\n\n animate() {\n const animateFrame = () => {\n this.animationFrameId = requestAnimationFrame(animateFrame);\n this.render();\n };\n animateFrame();\n }\n\n render() {\n const time = new Date().getTime() * 0.001;\n\n this.textCanvas.render();\n this.texture.needsUpdate = true;\n\n (this.mesh.material as any).uniforms.uTime.value = Math.sin(time);\n\n this.updateRotation();\n this.filter.render(this.scene, this.camera);\n }\n\n updateRotation() {\n const map = (\n n: number,\n start: number,\n stop: number,\n start2: number,\n stop2: number,\n ) => {\n return ((n - start) / (stop - start)) * (stop2 - start2) + start2;\n };\n\n const x = map(this.mouse.y, 0, this.height, 0.5, -0.5);\n const y = map(this.mouse.x, 0, this.width, -0.5, 0.5);\n\n this.mesh.rotation.x += (x - this.mesh.rotation.x) * 0.05;\n this.mesh.rotation.y += (y - this.mesh.rotation.y) * 0.05;\n }\n\n clear() {\n this.scene.traverse((obj: THREE.Object3D) => {\n if (obj instanceof THREE.Mesh) {\n if (Array.isArray(obj.material)) {\n obj.material.forEach((m: THREE.Material) => m.dispose());\n } else if (obj.material instanceof THREE.Material) {\n obj.material.dispose();\n }\n obj.geometry.dispose();\n }\n });\n this.scene.clear();\n }\n\n dispose() {\n cancelAnimationFrame(this.animationFrameId);\n this.filter.dispose();\n if (this.filter.domElement.parentNode === this.container) {\n this.container.removeChild(this.filter.domElement);\n }\n this.container.removeEventListener(\"mousemove\", this.onMouseMove);\n this.container.removeEventListener(\"touchmove\", this.onMouseMove);\n this.clear();\n this.renderer.dispose();\n }\n}\n\nexport interface ASCIITextProps {\n text?: string;\n asciiFontSize?: number;\n textFontSize?: number;\n textColor?: string;\n planeBaseHeight?: number;\n enableWaves?: boolean;\n className?: string;\n style?: React.CSSProperties;\n}\n\nexport const ASCIIText: React.FC<ASCIITextProps> = ({\n text = \"David!\",\n asciiFontSize = 8,\n textFontSize = 200,\n textColor = \"var(--ds-color-fg)\",\n planeBaseHeight = 8,\n enableWaves = true,\n className = \"\",\n style = {},\n}) => {\n const containerRef = useRef<HTMLDivElement>(null);\n const asciiRef = useRef<CanvAscii | null>(null);\n\n useEffect(() => {\n if (!containerRef.current) return;\n\n const { width, height } = containerRef.current.getBoundingClientRect();\n\n const initAscii = (w: number, h: number) => {\n if (asciiRef.current) asciiRef.current.dispose();\n asciiRef.current = new CanvAscii(\n {\n text,\n asciiFontSize,\n textFontSize,\n textColor,\n planeBaseHeight,\n enableWaves,\n },\n containerRef.current!,\n w,\n h,\n );\n asciiRef.current.load();\n };\n\n if (width === 0 || height === 0) {\n const observer = new IntersectionObserver(\n ([entry]) => {\n if (\n entry.isIntersecting &&\n entry.boundingClientRect.width > 0 &&\n entry.boundingClientRect.height > 0\n ) {\n initAscii(\n entry.boundingClientRect.width,\n entry.boundingClientRect.height,\n );\n observer.disconnect();\n }\n },\n { threshold: 0.1 },\n );\n\n observer.observe(containerRef.current);\n\n return () => {\n observer.disconnect();\n if (asciiRef.current) {\n asciiRef.current.dispose();\n }\n };\n }\n\n initAscii(width, height);\n\n const ro = new ResizeObserver((entries) => {\n if (!entries[0] || !asciiRef.current) return;\n const { width: w, height: h } = entries[0].contentRect;\n if (w > 0 && h > 0) {\n asciiRef.current.setSize(w, h);\n }\n });\n ro.observe(containerRef.current);\n\n return () => {\n ro.disconnect();\n if (asciiRef.current) {\n asciiRef.current.dispose();\n }\n };\n }, [\n text,\n asciiFontSize,\n textFontSize,\n textColor,\n planeBaseHeight,\n enableWaves,\n ]);\n\n return (\n <div\n ref={containerRef}\n className={`ascii-text-container ${className}`}\n style={{\n position: \"absolute\",\n width: \"100%\",\n height: \"100%\",\n ...style,\n }}\n >\n <style>{`\n @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@500&display=swap');\n\n .ascii-text-container canvas {\n position: absolute;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n image-rendering: optimizeSpeed;\n image-rendering: -moz-crisp-edges;\n image-rendering: -o-crisp-edges;\n image-rendering: -webkit-optimize-contrast;\n image-rendering: optimize-contrast;\n image-rendering: crisp-edges;\n image-rendering: pixelated;\n }\n\n .ascii-text-container pre {\n margin: 0;\n user-select: none;\n padding: 0;\n line-height: 1em;\n text-align: left;\n position: absolute;\n left: 0;\n top: 0;\n background-image: radial-gradient(circle, var(--ds-color-accent) 0%, var(--ds-color-accent-hover) 50%, var(--ds-color-warning) 100%);\n background-attachment: fixed;\n -webkit-text-fill-color: transparent;\n -webkit-background-clip: text;\n background-clip: text;\n z-index: 9;\n mix-blend-mode: difference;\n }\n `}</style>\n </div>\n );\n};\n\nexport default ASCIIText;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ascii-text-QyP7JU7g.mjs","names":[],"sources":["../../src/components/effects/ascii-text/ASCIIText.tsx"],"sourcesContent":["import React, { useRef, useEffect } from \"react\";\nimport * as THREE from \"three\";\n\nconst vertexShader = `\nvarying vec2 vUv;\nuniform float uTime;\nuniform float mouse;\nuniform float uEnableWaves;\n\nvoid main() {\n vUv = uv;\n float time = uTime * 5.;\n\n float waveFactor = uEnableWaves;\n\n vec3 transformed = position;\n\n transformed.x += sin(time + position.y) * 0.5 * waveFactor;\n transformed.y += cos(time + position.z) * 0.15 * waveFactor;\n transformed.z += sin(time + position.x) * waveFactor;\n\n gl_Position = projectionMatrix * modelViewMatrix * vec4(transformed, 1.0);\n}\n`;\n\nconst fragmentShader = `\nvarying vec2 vUv;\nuniform float mouse;\nuniform float uTime;\nuniform sampler2D uTexture;\n\nvoid main() {\n float time = uTime;\n vec2 pos = vUv;\n \n float move = sin(time + mouse) * 0.01;\n float r = texture2D(uTexture, pos + cos(time * 2. - time + pos.x) * .01).r;\n float g = texture2D(uTexture, pos + tan(time * .5 + pos.x - time) * .01).g;\n float b = texture2D(uTexture, pos - cos(time * 2. + time + pos.y) * .01).b;\n float a = texture2D(uTexture, pos).a;\n gl_FragColor = vec4(r, g, b, a);\n}\n`;\n\nconst PX_RATIO = typeof window !== \"undefined\" ? window.devicePixelRatio : 1;\n\nconst resolvedCanvasColorCache = new Map<string, string>();\n\nconst getThemeSignature = () => {\n if (typeof document === \"undefined\") return \"\";\n\n const root = document.documentElement;\n return [\n root.getAttribute(\"data-brand\") ?? \"\",\n root.getAttribute(\"data-mode\") ?? \"\",\n root.getAttribute(\"data-theme\") ?? \"\",\n ].join(\"|\");\n};\n\nconst resolveCanvasColor = (value: string): string => {\n if (typeof document === \"undefined\") return value;\n if (!value.includes(\"var(\") && !value.includes(\"color-mix(\")) return value;\n\n const cacheKey = `${getThemeSignature()}::${value}`;\n const cachedValue = resolvedCanvasColorCache.get(cacheKey);\n if (cachedValue) {\n return cachedValue;\n }\n\n const probe = document.createElement(\"span\");\n probe.style.color = value;\n probe.style.position = \"fixed\";\n probe.style.pointerEvents = \"none\";\n probe.style.opacity = \"0\";\n document.body.appendChild(probe);\n const resolvedValue = getComputedStyle(probe).color || value;\n document.body.removeChild(probe);\n resolvedCanvasColorCache.set(cacheKey, resolvedValue);\n return resolvedValue;\n};\n\ninterface AsciiFilterOptions {\n fontSize?: number;\n fontFamily?: string;\n charset?: string;\n invert?: boolean;\n}\n\nclass AsciiFilter {\n renderer: THREE.WebGLRenderer;\n domElement: HTMLDivElement;\n pre: HTMLPreElement;\n canvas: HTMLCanvasElement;\n context: CanvasRenderingContext2D;\n deg: number;\n invert: boolean;\n fontSize: number;\n fontFamily: string;\n charset: string;\n width: number = 0;\n height: number = 0;\n cols: number = 0;\n rows: number = 0;\n center: { x: number; y: number } = { x: 0, y: 0 };\n mouse: { x: number; y: number } = { x: 0, y: 0 };\n\n constructor(\n renderer: THREE.WebGLRenderer,\n { fontSize, fontFamily, charset, invert }: AsciiFilterOptions = {},\n ) {\n this.renderer = renderer;\n this.domElement = document.createElement(\"div\");\n this.domElement.style.position = \"absolute\";\n this.domElement.style.top = \"0\";\n this.domElement.style.left = \"0\";\n this.domElement.style.width = \"100%\";\n this.domElement.style.height = \"100%\";\n\n this.pre = document.createElement(\"pre\");\n this.domElement.appendChild(this.pre);\n\n this.canvas = document.createElement(\"canvas\");\n const ctx = this.canvas.getContext(\"2d\");\n if (!ctx) throw new Error(\"Could not get 2d context\");\n this.context = ctx;\n this.domElement.appendChild(this.canvas);\n\n this.deg = 0;\n this.invert = invert ?? true;\n this.fontSize = fontSize ?? 12;\n this.fontFamily = fontFamily ?? \"'Courier New', monospace\";\n this.charset =\n charset ??\n \" .'`^\\\",:;Il!i~+_-?][}{1)(|/tfjrxnuvczXYUJCLQ0OZmwqpdbkhao*#MW&8%B@$\";\n\n this.context.imageSmoothingEnabled = false;\n\n this.onMouseMove = this.onMouseMove.bind(this);\n document.addEventListener(\"mousemove\", this.onMouseMove);\n }\n\n setSize(width: number, height: number) {\n this.width = width;\n this.height = height;\n this.renderer.setSize(width, height);\n this.reset();\n\n this.center = { x: width / 2, y: height / 2 };\n this.mouse = { x: this.center.x, y: this.center.y };\n }\n\n reset() {\n this.context.font = `${this.fontSize}px ${this.fontFamily}`;\n const charWidth = this.context.measureText(\"A\").width;\n\n this.cols = Math.floor(\n this.width / (this.fontSize * (charWidth / this.fontSize)),\n );\n this.rows = Math.floor(this.height / this.fontSize);\n\n this.canvas.width = this.cols;\n this.canvas.height = this.rows;\n this.pre.style.fontFamily = this.fontFamily;\n this.pre.style.fontSize = `${this.fontSize}px`;\n this.pre.style.margin = \"0\";\n this.pre.style.padding = \"0\";\n this.pre.style.lineHeight = \"1em\";\n this.pre.style.position = \"absolute\";\n this.pre.style.left = \"0\";\n this.pre.style.top = \"0\";\n this.pre.style.zIndex = \"9\";\n this.pre.style.backgroundAttachment = \"fixed\";\n this.pre.style.mixBlendMode = \"difference\";\n }\n\n render(scene: THREE.Scene, camera: THREE.Camera) {\n this.renderer.render(scene, camera);\n\n const w = this.canvas.width;\n const h = this.canvas.height;\n this.context.clearRect(0, 0, w, h);\n if (this.context && w && h) {\n this.context.drawImage(this.renderer.domElement, 0, 0, w, h);\n }\n\n this.asciify(this.context, w, h);\n this.hue();\n }\n\n onMouseMove(e: MouseEvent) {\n this.mouse = { x: e.clientX * PX_RATIO, y: e.clientY * PX_RATIO };\n }\n\n get dx() {\n return this.mouse.x - this.center.x;\n }\n\n get dy() {\n return this.mouse.y - this.center.y;\n }\n\n hue() {\n const deg = (Math.atan2(this.dy, this.dx) * 180) / Math.PI;\n this.deg += (deg - this.deg) * 0.075;\n this.domElement.style.filter = `hue-rotate(${this.deg.toFixed(1)}deg)`;\n }\n\n asciify(ctx: CanvasRenderingContext2D, w: number, h: number) {\n if (w && h) {\n const imgData = ctx.getImageData(0, 0, w, h).data;\n let str = \"\";\n for (let y = 0; y < h; y++) {\n for (let x = 0; x < w; x++) {\n const i = x * 4 + y * 4 * w;\n const [r, g, b, a] = [\n imgData[i],\n imgData[i + 1],\n imgData[i + 2],\n imgData[i + 3],\n ];\n\n if (a === 0) {\n str += \" \";\n continue;\n }\n\n const gray = (0.3 * r + 0.6 * g + 0.1 * b) / 255;\n let idx = Math.floor((1 - gray) * (this.charset.length - 1));\n if (this.invert) idx = this.charset.length - idx - 1;\n str += this.charset[idx];\n }\n str += \"\\n\";\n }\n this.pre.innerHTML = str;\n }\n }\n\n dispose() {\n document.removeEventListener(\"mousemove\", this.onMouseMove);\n }\n}\n\ninterface CanvasTxtOptions {\n fontSize?: number;\n fontFamily?: string;\n color?: string;\n}\n\nclass CanvasTxt {\n canvas: HTMLCanvasElement;\n context: CanvasRenderingContext2D;\n txt: string;\n fontSize: number;\n fontFamily: string;\n color: string;\n font: string;\n\n constructor(\n txt: string,\n {\n fontSize = 200,\n fontFamily = \"Arial\",\n color = \"var(--ds-color-fg)\",\n }: CanvasTxtOptions = {},\n ) {\n this.canvas = document.createElement(\"canvas\");\n const ctx = this.canvas.getContext(\"2d\");\n if (!ctx) throw new Error(\"Could not get 2d context\");\n this.context = ctx;\n this.txt = txt;\n this.fontSize = fontSize;\n this.fontFamily = fontFamily;\n this.color = color;\n\n this.font = `600 ${this.fontSize}px ${this.fontFamily}`;\n }\n\n resize() {\n this.context.font = this.font;\n const metrics = this.context.measureText(this.txt);\n\n const textWidth = Math.ceil(metrics.width) + 20;\n const textHeight =\n Math.ceil(\n metrics.actualBoundingBoxAscent + metrics.actualBoundingBoxDescent,\n ) + 20;\n\n this.canvas.width = textWidth;\n this.canvas.height = textHeight;\n }\n\n render() {\n this.context.clearRect(0, 0, this.canvas.width, this.canvas.height);\n this.context.fillStyle = resolveCanvasColor(this.color);\n this.context.font = this.font;\n\n const metrics = this.context.measureText(this.txt);\n const yPos = 10 + metrics.actualBoundingBoxAscent;\n\n this.context.fillText(this.txt, 10, yPos);\n }\n\n get width() {\n return this.canvas.width;\n }\n\n get height() {\n return this.canvas.height;\n }\n\n get texture() {\n return this.canvas;\n }\n}\n\ninterface CanvAsciiOptions {\n text: string;\n asciiFontSize: number;\n textFontSize: number;\n textColor: string;\n planeBaseHeight: number;\n enableWaves: boolean;\n}\n\nclass CanvAscii {\n textString: string;\n asciiFontSize: number;\n textFontSize: number;\n textColor: string;\n planeBaseHeight: number;\n container: HTMLElement;\n width: number;\n height: number;\n enableWaves: boolean;\n camera: THREE.PerspectiveCamera;\n scene: THREE.Scene;\n mouse: { x: number; y: number };\n textCanvas!: CanvasTxt;\n texture!: THREE.CanvasTexture;\n geometry!: THREE.PlaneGeometry;\n material!: THREE.ShaderMaterial;\n mesh!: THREE.Mesh;\n renderer!: THREE.WebGLRenderer;\n filter!: AsciiFilter;\n center: { x: number; y: number } = { x: 0, y: 0 };\n animationFrameId: number = 0;\n\n constructor(\n {\n text,\n asciiFontSize,\n textFontSize,\n textColor,\n planeBaseHeight,\n enableWaves,\n }: CanvAsciiOptions,\n containerElem: HTMLElement,\n width: number,\n height: number,\n ) {\n this.textString = text;\n this.asciiFontSize = asciiFontSize;\n this.textFontSize = textFontSize;\n this.textColor = textColor;\n this.planeBaseHeight = planeBaseHeight;\n this.container = containerElem;\n this.width = width;\n this.height = height;\n this.enableWaves = enableWaves;\n\n this.camera = new THREE.PerspectiveCamera(\n 45,\n this.width / this.height,\n 1,\n 1000,\n );\n this.camera.position.z = 30;\n\n this.scene = new THREE.Scene();\n this.mouse = { x: 0, y: 0 };\n\n this.onMouseMove = this.onMouseMove.bind(this);\n\n this.setMesh();\n this.setRenderer();\n }\n\n setMesh() {\n this.textCanvas = new CanvasTxt(this.textString, {\n fontSize: this.textFontSize,\n fontFamily: \"IBM Plex Mono\",\n color: this.textColor,\n });\n this.textCanvas.resize();\n this.textCanvas.render();\n\n this.texture = new THREE.CanvasTexture(this.textCanvas.texture);\n this.texture.minFilter = THREE.NearestFilter;\n\n const textAspect = this.textCanvas.width / this.textCanvas.height;\n const baseH = this.planeBaseHeight;\n const planeW = baseH * textAspect;\n const planeH = baseH;\n\n this.geometry = new THREE.PlaneGeometry(planeW, planeH, 36, 36);\n this.material = new THREE.ShaderMaterial({\n vertexShader,\n fragmentShader,\n transparent: true,\n uniforms: {\n uTime: { value: 0 },\n mouse: { value: 1.0 },\n uTexture: { value: this.texture },\n uEnableWaves: { value: this.enableWaves ? 1.0 : 0.0 },\n },\n });\n\n this.mesh = new THREE.Mesh(this.geometry, this.material);\n this.scene.add(this.mesh);\n }\n\n setRenderer() {\n this.renderer = new THREE.WebGLRenderer({ antialias: false, alpha: true });\n this.renderer.setPixelRatio(1);\n this.renderer.setClearColor(0x000000, 0);\n\n this.filter = new AsciiFilter(this.renderer, {\n fontFamily: \"IBM Plex Mono\",\n fontSize: this.asciiFontSize,\n invert: true,\n });\n\n this.container.appendChild(this.filter.domElement);\n this.setSize(this.width, this.height);\n\n this.container.addEventListener(\"mousemove\", this.onMouseMove);\n this.container.addEventListener(\"touchmove\", this.onMouseMove);\n }\n\n setSize(w: number, h: number) {\n this.width = w;\n this.height = h;\n\n this.camera.aspect = w / h;\n this.camera.updateProjectionMatrix();\n\n this.filter.setSize(w, h);\n\n this.center = { x: w / 2, y: h / 2 };\n }\n\n load() {\n this.animate();\n }\n\n onMouseMove(evt: any) {\n const e = evt.touches ? evt.touches[0] : evt;\n const bounds = this.container.getBoundingClientRect();\n const x = e.clientX - bounds.left;\n const y = e.clientY - bounds.top;\n this.mouse = { x, y };\n }\n\n animate() {\n const animateFrame = () => {\n this.animationFrameId = requestAnimationFrame(animateFrame);\n this.render();\n };\n animateFrame();\n }\n\n render() {\n const time = new Date().getTime() * 0.001;\n\n this.textCanvas.render();\n this.texture.needsUpdate = true;\n\n (this.mesh.material as any).uniforms.uTime.value = Math.sin(time);\n\n this.updateRotation();\n this.filter.render(this.scene, this.camera);\n }\n\n updateRotation() {\n const map = (\n n: number,\n start: number,\n stop: number,\n start2: number,\n stop2: number,\n ) => {\n return ((n - start) / (stop - start)) * (stop2 - start2) + start2;\n };\n\n const x = map(this.mouse.y, 0, this.height, 0.5, -0.5);\n const y = map(this.mouse.x, 0, this.width, -0.5, 0.5);\n\n this.mesh.rotation.x += (x - this.mesh.rotation.x) * 0.05;\n this.mesh.rotation.y += (y - this.mesh.rotation.y) * 0.05;\n }\n\n clear() {\n this.scene.traverse((obj: THREE.Object3D) => {\n if (obj instanceof THREE.Mesh) {\n if (Array.isArray(obj.material)) {\n obj.material.forEach((m: THREE.Material) => m.dispose());\n } else if (obj.material instanceof THREE.Material) {\n obj.material.dispose();\n }\n obj.geometry.dispose();\n }\n });\n this.scene.clear();\n }\n\n dispose() {\n cancelAnimationFrame(this.animationFrameId);\n this.filter.dispose();\n if (this.filter.domElement.parentNode === this.container) {\n this.container.removeChild(this.filter.domElement);\n }\n this.container.removeEventListener(\"mousemove\", this.onMouseMove);\n this.container.removeEventListener(\"touchmove\", this.onMouseMove);\n this.clear();\n this.renderer.dispose();\n }\n}\n\nexport interface ASCIITextProps {\n text?: string;\n asciiFontSize?: number;\n textFontSize?: number;\n textColor?: string;\n planeBaseHeight?: number;\n enableWaves?: boolean;\n className?: string;\n style?: React.CSSProperties;\n}\n\nexport const ASCIIText: React.FC<ASCIITextProps> = ({\n text = \"David!\",\n asciiFontSize = 8,\n textFontSize = 200,\n textColor = \"var(--ds-color-fg)\",\n planeBaseHeight = 8,\n enableWaves = true,\n className = \"\",\n style = {},\n}) => {\n const containerRef = useRef<HTMLDivElement>(null);\n const asciiRef = useRef<CanvAscii | null>(null);\n\n useEffect(() => {\n if (!containerRef.current) return;\n\n const { width, height } = containerRef.current.getBoundingClientRect();\n\n const initAscii = (w: number, h: number) => {\n if (asciiRef.current) asciiRef.current.dispose();\n asciiRef.current = new CanvAscii(\n {\n text,\n asciiFontSize,\n textFontSize,\n textColor,\n planeBaseHeight,\n enableWaves,\n },\n containerRef.current!,\n w,\n h,\n );\n asciiRef.current.load();\n };\n\n if (width === 0 || height === 0) {\n const observer = new IntersectionObserver(\n ([entry]) => {\n if (\n entry.isIntersecting &&\n entry.boundingClientRect.width > 0 &&\n entry.boundingClientRect.height > 0\n ) {\n initAscii(\n entry.boundingClientRect.width,\n entry.boundingClientRect.height,\n );\n observer.disconnect();\n }\n },\n { threshold: 0.1 },\n );\n\n observer.observe(containerRef.current);\n\n return () => {\n observer.disconnect();\n if (asciiRef.current) {\n asciiRef.current.dispose();\n }\n };\n }\n\n initAscii(width, height);\n\n const ro = new ResizeObserver((entries) => {\n if (!entries[0] || !asciiRef.current) return;\n const { width: w, height: h } = entries[0].contentRect;\n if (w > 0 && h > 0) {\n asciiRef.current.setSize(w, h);\n }\n });\n ro.observe(containerRef.current);\n\n return () => {\n ro.disconnect();\n if (asciiRef.current) {\n asciiRef.current.dispose();\n }\n };\n }, [\n text,\n asciiFontSize,\n textFontSize,\n textColor,\n planeBaseHeight,\n enableWaves,\n ]);\n\n return (\n <div\n ref={containerRef}\n className={`ascii-text-container ${className}`}\n style={{\n position: \"absolute\",\n width: \"100%\",\n height: \"100%\",\n ...style,\n }}\n >\n <style>{`\n @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@500&display=swap');\n\n .ascii-text-container canvas {\n position: absolute;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n image-rendering: optimizeSpeed;\n image-rendering: -moz-crisp-edges;\n image-rendering: -o-crisp-edges;\n image-rendering: -webkit-optimize-contrast;\n image-rendering: optimize-contrast;\n image-rendering: crisp-edges;\n image-rendering: pixelated;\n }\n\n .ascii-text-container pre {\n margin: 0;\n user-select: none;\n padding: 0;\n line-height: 1em;\n text-align: left;\n position: absolute;\n left: 0;\n top: 0;\n background-image: radial-gradient(circle, var(--ds-color-accent) 0%, var(--ds-color-accent-hover) 50%, var(--ds-color-warning) 100%);\n background-attachment: fixed;\n -webkit-text-fill-color: transparent;\n -webkit-background-clip: text;\n background-clip: text;\n z-index: 9;\n mix-blend-mode: difference;\n }\n `}</style>\n </div>\n );\n};\n\nexport default ASCIIText;\n"],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { n as mergeClassNames } from "./utils-
|
|
1
|
+
import { n as mergeClassNames } from "./utils-Dc7j29ec.mjs";
|
|
2
2
|
import { useEffect, useRef, useState } from "react";
|
|
3
3
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
4
4
|
//#region src/components/effects/background-gradient-animation/BackgroundGradientAnimation.tsx
|
|
@@ -141,4 +141,4 @@ function BackgroundGradientAnimationDemo() {
|
|
|
141
141
|
//#endregion
|
|
142
142
|
export { BackgroundGradientAnimation as n, BackgroundGradientAnimationDemo as t };
|
|
143
143
|
|
|
144
|
-
//# sourceMappingURL=background-gradient-animation-
|
|
144
|
+
//# sourceMappingURL=background-gradient-animation-CZUD_aq2.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"background-gradient-animation-
|
|
1
|
+
{"version":3,"file":"background-gradient-animation-CZUD_aq2.mjs","names":[],"sources":["../../src/components/effects/background-gradient-animation/BackgroundGradientAnimation.tsx","../../src/components/effects/background-gradient-animation/BackgroundGradientAnimationDemo.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\nimport { mergeClassNames } from \"../../../utils\";\n\nexport interface BackgroundGradientAnimationProps {\n gradientBackgroundStart?: string;\n gradientBackgroundEnd?: string;\n firstColor?: string;\n secondColor?: string;\n thirdColor?: string;\n fourthColor?: string;\n fifthColor?: string;\n pointerColor?: string;\n size?: string;\n blendingValue?: string;\n children?: React.ReactNode;\n className?: string;\n interactive?: boolean;\n containerClassName?: string;\n}\n\nexport const BackgroundGradientAnimation = ({\n gradientBackgroundStart = \"rgb(108, 0, 162)\",\n gradientBackgroundEnd = \"rgb(0, 17, 82)\",\n firstColor = \"18, 113, 255\",\n secondColor = \"221, 74, 255\",\n thirdColor = \"100, 220, 255\",\n fourthColor = \"200, 50, 50\",\n fifthColor = \"180, 180, 50\",\n pointerColor = \"140, 100, 255\",\n size = \"80%\",\n blendingValue = \"hard-light\",\n children,\n className,\n interactive = true,\n containerClassName,\n}: BackgroundGradientAnimationProps) => {\n const interactiveRef = useRef<HTMLDivElement>(null);\n const containerRef = useRef<HTMLDivElement>(null);\n\n const currentPositionRef = useRef({ x: 0, y: 0 });\n const targetPositionRef = useRef({ x: 0, y: 0 });\n\n useEffect(() => {\n if (!interactive) {\n return;\n }\n\n let animationFrameId = 0;\n\n const move = () => {\n const interactiveElement = interactiveRef.current;\n\n if (interactiveElement) {\n const currentPosition = currentPositionRef.current;\n const targetPosition = targetPositionRef.current;\n\n currentPosition.x += (targetPosition.x - currentPosition.x) / 20;\n currentPosition.y += (targetPosition.y - currentPosition.y) / 20;\n\n interactiveElement.style.transform = `translate(${Math.round(\n currentPosition.x,\n )}px, ${Math.round(currentPosition.y)}px)`;\n }\n\n animationFrameId = window.requestAnimationFrame(move);\n };\n\n animationFrameId = window.requestAnimationFrame(move);\n\n return () => {\n window.cancelAnimationFrame(animationFrameId);\n };\n }, [interactive]);\n\n const handleMouseMove = (event: React.MouseEvent<HTMLDivElement>) => {\n if (interactiveRef.current) {\n const rect = interactiveRef.current.getBoundingClientRect();\n targetPositionRef.current = {\n x: event.clientX - rect.left,\n y: event.clientY - rect.top,\n };\n }\n };\n\n const [isSafari] = useState(() =>\n typeof navigator !== \"undefined\"\n ? /^((?!chrome|android).)*safari/i.test(navigator.userAgent)\n : false,\n );\n\n const blobStyle = (\n color: string,\n _animationClass: string,\n transformOrigin: string,\n opacity: number = 1,\n ): React.CSSProperties => ({\n position: \"absolute\",\n width: size,\n height: size,\n top: `calc(50% - ${size} / 2)`,\n left: `calc(50% - ${size} / 2)`,\n background: `radial-gradient(circle at center, rgba(${color}, 0.8) 0, rgba(${color}, 0) 50%) no-repeat`,\n mixBlendMode: blendingValue as React.CSSProperties[\"mixBlendMode\"],\n transformOrigin,\n opacity,\n });\n\n return (\n <div\n ref={containerRef}\n className={mergeClassNames(\n \"h-screen w-screen relative overflow-hidden top-0 left-0\",\n containerClassName,\n )}\n style={{\n background: `linear-gradient(40deg, ${gradientBackgroundStart}, ${gradientBackgroundEnd})`,\n }}\n >\n <svg className=\"hidden\">\n <defs>\n <filter id=\"blurMe\">\n <feGaussianBlur\n in=\"SourceGraphic\"\n stdDeviation=\"10\"\n result=\"blur\"\n />\n <feColorMatrix\n in=\"blur\"\n mode=\"matrix\"\n values=\"1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 18 -8\"\n result=\"goo\"\n />\n <feBlend in=\"SourceGraphic\" in2=\"goo\" />\n </filter>\n </defs>\n </svg>\n <div className={mergeClassNames(\"\", className)}>{children}</div>\n <div\n className=\"h-full w-full\"\n style={{\n filter: isSafari ? \"blur(24px)\" : \"url(#blurMe) blur(40px)\",\n }}\n >\n {/* First blob */}\n <div\n className=\"ui:animate-gradient-first\"\n style={blobStyle(\n firstColor,\n \"animate-gradient-first\",\n \"center center\",\n )}\n />\n {/* Second blob */}\n <div\n className=\"ui:animate-gradient-second\"\n style={blobStyle(\n secondColor,\n \"animate-gradient-second\",\n \"calc(50% - 400px)\",\n )}\n />\n {/* Third blob */}\n <div\n className=\"ui:animate-gradient-third\"\n style={blobStyle(\n thirdColor,\n \"animate-gradient-third\",\n \"calc(50% + 400px)\",\n )}\n />\n {/* Fourth blob */}\n <div\n className=\"ui:animate-gradient-fourth\"\n style={blobStyle(\n fourthColor,\n \"animate-gradient-fourth\",\n \"calc(50% - 200px)\",\n 0.7,\n )}\n />\n {/* Fifth blob */}\n <div\n className=\"ui:animate-gradient-fifth\"\n style={blobStyle(\n fifthColor,\n \"animate-gradient-fifth\",\n \"calc(50% - 800px) calc(50% + 800px)\",\n )}\n />\n\n {interactive && (\n <div\n ref={interactiveRef}\n onMouseMove={handleMouseMove}\n className=\"absolute w-full h-full\"\n style={{\n top: \"-50%\",\n left: \"-50%\",\n willChange: \"transform\",\n opacity: 0.7,\n background: `radial-gradient(circle at center, rgba(${pointerColor}, 0.8) 0, rgba(${pointerColor}, 0) 50%) no-repeat`,\n mixBlendMode:\n blendingValue as React.CSSProperties[\"mixBlendMode\"],\n }}\n />\n )}\n </div>\n </div>\n );\n};\n","import { BackgroundGradientAnimation } from \"./BackgroundGradientAnimation\";\n\nexport default function BackgroundGradientAnimationDemo() {\n return (\n <BackgroundGradientAnimation>\n <div className=\"ui:absolute ui:z-50 ui:inset-0 ui:flex ui:items-center ui:justify-center ui:text-ds-on-accent ui:font-bold ui:px-4 ui:pointer-events-none ui:text-3xl ui:text-center md:ui:text-4xl lg:ui:text-7xl\">\n <p className=\"ui:bg-clip-text ui:text-transparent ui:drop-shadow-2xl ui:bg-gradient-to-b ui:from-ds-on-accent ui:to-ds-on-accent/35\">\n Gradients X Animations\n </p>\n </div>\n </BackgroundGradientAnimation>\n );\n}\n"],"mappings":"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"}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
require("./
|
|
2
|
-
const require_utils = require("./utils-LRbEQHYs.cjs");
|
|
1
|
+
const require_utils = require("./utils-CoA0q63n.cjs");
|
|
3
2
|
let react = require("react");
|
|
4
3
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
5
4
|
//#region src/components/effects/background-gradient-animation/BackgroundGradientAnimation.tsx
|
|
@@ -153,4 +152,4 @@ Object.defineProperty(exports, "BackgroundGradientAnimationDemo", {
|
|
|
153
152
|
}
|
|
154
153
|
});
|
|
155
154
|
|
|
156
|
-
//# sourceMappingURL=background-gradient-animation-
|
|
155
|
+
//# sourceMappingURL=background-gradient-animation-PvM0i88k.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"background-gradient-animation-
|
|
1
|
+
{"version":3,"file":"background-gradient-animation-PvM0i88k.cjs","names":[],"sources":["../../src/components/effects/background-gradient-animation/BackgroundGradientAnimation.tsx","../../src/components/effects/background-gradient-animation/BackgroundGradientAnimationDemo.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\nimport { mergeClassNames } from \"../../../utils\";\n\nexport interface BackgroundGradientAnimationProps {\n gradientBackgroundStart?: string;\n gradientBackgroundEnd?: string;\n firstColor?: string;\n secondColor?: string;\n thirdColor?: string;\n fourthColor?: string;\n fifthColor?: string;\n pointerColor?: string;\n size?: string;\n blendingValue?: string;\n children?: React.ReactNode;\n className?: string;\n interactive?: boolean;\n containerClassName?: string;\n}\n\nexport const BackgroundGradientAnimation = ({\n gradientBackgroundStart = \"rgb(108, 0, 162)\",\n gradientBackgroundEnd = \"rgb(0, 17, 82)\",\n firstColor = \"18, 113, 255\",\n secondColor = \"221, 74, 255\",\n thirdColor = \"100, 220, 255\",\n fourthColor = \"200, 50, 50\",\n fifthColor = \"180, 180, 50\",\n pointerColor = \"140, 100, 255\",\n size = \"80%\",\n blendingValue = \"hard-light\",\n children,\n className,\n interactive = true,\n containerClassName,\n}: BackgroundGradientAnimationProps) => {\n const interactiveRef = useRef<HTMLDivElement>(null);\n const containerRef = useRef<HTMLDivElement>(null);\n\n const currentPositionRef = useRef({ x: 0, y: 0 });\n const targetPositionRef = useRef({ x: 0, y: 0 });\n\n useEffect(() => {\n if (!interactive) {\n return;\n }\n\n let animationFrameId = 0;\n\n const move = () => {\n const interactiveElement = interactiveRef.current;\n\n if (interactiveElement) {\n const currentPosition = currentPositionRef.current;\n const targetPosition = targetPositionRef.current;\n\n currentPosition.x += (targetPosition.x - currentPosition.x) / 20;\n currentPosition.y += (targetPosition.y - currentPosition.y) / 20;\n\n interactiveElement.style.transform = `translate(${Math.round(\n currentPosition.x,\n )}px, ${Math.round(currentPosition.y)}px)`;\n }\n\n animationFrameId = window.requestAnimationFrame(move);\n };\n\n animationFrameId = window.requestAnimationFrame(move);\n\n return () => {\n window.cancelAnimationFrame(animationFrameId);\n };\n }, [interactive]);\n\n const handleMouseMove = (event: React.MouseEvent<HTMLDivElement>) => {\n if (interactiveRef.current) {\n const rect = interactiveRef.current.getBoundingClientRect();\n targetPositionRef.current = {\n x: event.clientX - rect.left,\n y: event.clientY - rect.top,\n };\n }\n };\n\n const [isSafari] = useState(() =>\n typeof navigator !== \"undefined\"\n ? /^((?!chrome|android).)*safari/i.test(navigator.userAgent)\n : false,\n );\n\n const blobStyle = (\n color: string,\n _animationClass: string,\n transformOrigin: string,\n opacity: number = 1,\n ): React.CSSProperties => ({\n position: \"absolute\",\n width: size,\n height: size,\n top: `calc(50% - ${size} / 2)`,\n left: `calc(50% - ${size} / 2)`,\n background: `radial-gradient(circle at center, rgba(${color}, 0.8) 0, rgba(${color}, 0) 50%) no-repeat`,\n mixBlendMode: blendingValue as React.CSSProperties[\"mixBlendMode\"],\n transformOrigin,\n opacity,\n });\n\n return (\n <div\n ref={containerRef}\n className={mergeClassNames(\n \"h-screen w-screen relative overflow-hidden top-0 left-0\",\n containerClassName,\n )}\n style={{\n background: `linear-gradient(40deg, ${gradientBackgroundStart}, ${gradientBackgroundEnd})`,\n }}\n >\n <svg className=\"hidden\">\n <defs>\n <filter id=\"blurMe\">\n <feGaussianBlur\n in=\"SourceGraphic\"\n stdDeviation=\"10\"\n result=\"blur\"\n />\n <feColorMatrix\n in=\"blur\"\n mode=\"matrix\"\n values=\"1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 18 -8\"\n result=\"goo\"\n />\n <feBlend in=\"SourceGraphic\" in2=\"goo\" />\n </filter>\n </defs>\n </svg>\n <div className={mergeClassNames(\"\", className)}>{children}</div>\n <div\n className=\"h-full w-full\"\n style={{\n filter: isSafari ? \"blur(24px)\" : \"url(#blurMe) blur(40px)\",\n }}\n >\n {/* First blob */}\n <div\n className=\"ui:animate-gradient-first\"\n style={blobStyle(\n firstColor,\n \"animate-gradient-first\",\n \"center center\",\n )}\n />\n {/* Second blob */}\n <div\n className=\"ui:animate-gradient-second\"\n style={blobStyle(\n secondColor,\n \"animate-gradient-second\",\n \"calc(50% - 400px)\",\n )}\n />\n {/* Third blob */}\n <div\n className=\"ui:animate-gradient-third\"\n style={blobStyle(\n thirdColor,\n \"animate-gradient-third\",\n \"calc(50% + 400px)\",\n )}\n />\n {/* Fourth blob */}\n <div\n className=\"ui:animate-gradient-fourth\"\n style={blobStyle(\n fourthColor,\n \"animate-gradient-fourth\",\n \"calc(50% - 200px)\",\n 0.7,\n )}\n />\n {/* Fifth blob */}\n <div\n className=\"ui:animate-gradient-fifth\"\n style={blobStyle(\n fifthColor,\n \"animate-gradient-fifth\",\n \"calc(50% - 800px) calc(50% + 800px)\",\n )}\n />\n\n {interactive && (\n <div\n ref={interactiveRef}\n onMouseMove={handleMouseMove}\n className=\"absolute w-full h-full\"\n style={{\n top: \"-50%\",\n left: \"-50%\",\n willChange: \"transform\",\n opacity: 0.7,\n background: `radial-gradient(circle at center, rgba(${pointerColor}, 0.8) 0, rgba(${pointerColor}, 0) 50%) no-repeat`,\n mixBlendMode:\n blendingValue as React.CSSProperties[\"mixBlendMode\"],\n }}\n />\n )}\n </div>\n </div>\n );\n};\n","import { BackgroundGradientAnimation } from \"./BackgroundGradientAnimation\";\n\nexport default function BackgroundGradientAnimationDemo() {\n return (\n <BackgroundGradientAnimation>\n <div className=\"ui:absolute ui:z-50 ui:inset-0 ui:flex ui:items-center ui:justify-center ui:text-ds-on-accent ui:font-bold ui:px-4 ui:pointer-events-none ui:text-3xl ui:text-center md:ui:text-4xl lg:ui:text-7xl\">\n <p className=\"ui:bg-clip-text ui:text-transparent ui:drop-shadow-2xl ui:bg-gradient-to-b ui:from-ds-on-accent ui:to-ds-on-accent/35\">\n Gradients X Animations\n </p>\n </div>\n </BackgroundGradientAnimation>\n );\n}\n"],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { n as mergeClassNames } from "./utils-
|
|
1
|
+
import { n as mergeClassNames } from "./utils-Dc7j29ec.mjs";
|
|
2
2
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
3
|
//#region src/components/forms/button/Button.tsx
|
|
4
4
|
var baseClasses = `
|
|
@@ -41,4 +41,4 @@ var Button = ({ primary = false, variant, size = "medium", backgroundColor, labe
|
|
|
41
41
|
//#endregion
|
|
42
42
|
export { Button as t };
|
|
43
43
|
|
|
44
|
-
//# sourceMappingURL=button-
|
|
44
|
+
//# sourceMappingURL=button-CAU9ej3h.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button-
|
|
1
|
+
{"version":3,"file":"button-CAU9ej3h.mjs","names":[],"sources":["../../src/components/forms/button/Button.tsx"],"sourcesContent":["import type { ButtonProps, ButtonVariant } from \"./types\";\n\nimport { mergeClassNames } from \"../../../utils\";\n\nconst baseClasses = `\n inline-flex\n items-center\n justify-center\n gap-2\n cursor-pointer\n rounded-lg\n font-semibold\n leading-none\n transition-all\n duration-200\n ease-in-out\n active:scale-99\n hover:opacity-90\n disabled:opacity-50\n disabled:cursor-not-allowed\n`;\nconst variantClassMap = {\n primary: \"bg-ds-accent hover:bg-ds-accent-hover text-ds-on-accent shadow-2\",\n secondary:\n \"bg-ds-surface-1 border border-ds-border-2 text-ds-1 shadow-1 hover:border-ds-border-1 hover:bg-ds-canvas\",\n tertiary:\n \"bg-transparent text-ds-1 shadow-none hover:bg-ds-canvas/70 hover:text-ds-1 border border-transparent\",\n} satisfies Record<ButtonVariant, string>;\nconst sizeClassMap = {\n small: \"py-2 px-3 text-xs\",\n medium: \"py-2.5 px-4 text-sm\",\n large: \"py-3 px-6 text-base\",\n};\n\nexport const Button = ({\n primary = false,\n variant,\n size = \"medium\",\n backgroundColor,\n label,\n children,\n type = \"button\",\n className = \"\",\n ...props\n}: ButtonProps) => {\n const resolvedVariant = variant ?? (primary ? \"primary\" : \"secondary\");\n const variantClasses = variantClassMap[resolvedVariant];\n const sizeClasses =\n sizeClassMap[size as keyof typeof sizeClassMap] || sizeClassMap.medium;\n\n return (\n <button\n type={type}\n className={mergeClassNames(baseClasses, variantClasses, sizeClasses, className)}\n style={backgroundColor ? { backgroundColor } : undefined}\n {...props}\n >\n {children}\n {label && <span>{label}</span>}\n </button>\n );\n};\n"],"mappings":";;;AAIA,IAAM,cAAc;;;;;;;;;;;;;;;;;AAiBpB,IAAM,kBAAkB;CACtB,SAAS;CACT,WACE;CACF,UACE;AACJ;AACA,IAAM,eAAe;CACnB,OAAO;CACP,QAAQ;CACR,OAAO;AACT;AAEA,IAAa,UAAU,EACrB,UAAU,OACV,SACA,OAAO,UACP,iBACA,OACA,UACA,OAAO,UACP,YAAY,IACZ,GAAG,YACc;CAEjB,MAAM,iBAAiB,gBADC,YAAY,UAAU,YAAY;CAK1D,OACE,qBAAC,UAAD;EACQ;EACN,WAAW,gBAAgB,aAAa,gBAL1C,aAAa,SAAsC,aAAa,QAKO,SAAS;EAC9E,OAAO,kBAAkB,EAAE,gBAAgB,IAAI,KAAA;EAC/C,GAAI;YAJN,CAMG,UACA,SAAS,oBAAC,QAAD,EAAA,UAAO,MAAY,CAAA,CACvB;;AAEZ"}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
require("./
|
|
2
|
-
const require_utils = require("./utils-LRbEQHYs.cjs");
|
|
1
|
+
const require_utils = require("./utils-CoA0q63n.cjs");
|
|
3
2
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
4
3
|
//#region src/components/forms/button/Button.tsx
|
|
5
4
|
var baseClasses = `
|
|
@@ -47,4 +46,4 @@ Object.defineProperty(exports, "Button", {
|
|
|
47
46
|
}
|
|
48
47
|
});
|
|
49
48
|
|
|
50
|
-
//# sourceMappingURL=button-
|
|
49
|
+
//# sourceMappingURL=button-D2ZYmVda.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button-
|
|
1
|
+
{"version":3,"file":"button-D2ZYmVda.cjs","names":[],"sources":["../../src/components/forms/button/Button.tsx"],"sourcesContent":["import type { ButtonProps, ButtonVariant } from \"./types\";\n\nimport { mergeClassNames } from \"../../../utils\";\n\nconst baseClasses = `\n inline-flex\n items-center\n justify-center\n gap-2\n cursor-pointer\n rounded-lg\n font-semibold\n leading-none\n transition-all\n duration-200\n ease-in-out\n active:scale-99\n hover:opacity-90\n disabled:opacity-50\n disabled:cursor-not-allowed\n`;\nconst variantClassMap = {\n primary: \"bg-ds-accent hover:bg-ds-accent-hover text-ds-on-accent shadow-2\",\n secondary:\n \"bg-ds-surface-1 border border-ds-border-2 text-ds-1 shadow-1 hover:border-ds-border-1 hover:bg-ds-canvas\",\n tertiary:\n \"bg-transparent text-ds-1 shadow-none hover:bg-ds-canvas/70 hover:text-ds-1 border border-transparent\",\n} satisfies Record<ButtonVariant, string>;\nconst sizeClassMap = {\n small: \"py-2 px-3 text-xs\",\n medium: \"py-2.5 px-4 text-sm\",\n large: \"py-3 px-6 text-base\",\n};\n\nexport const Button = ({\n primary = false,\n variant,\n size = \"medium\",\n backgroundColor,\n label,\n children,\n type = \"button\",\n className = \"\",\n ...props\n}: ButtonProps) => {\n const resolvedVariant = variant ?? (primary ? \"primary\" : \"secondary\");\n const variantClasses = variantClassMap[resolvedVariant];\n const sizeClasses =\n sizeClassMap[size as keyof typeof sizeClassMap] || sizeClassMap.medium;\n\n return (\n <button\n type={type}\n className={mergeClassNames(baseClasses, variantClasses, sizeClasses, className)}\n style={backgroundColor ? { backgroundColor } : undefined}\n {...props}\n >\n {children}\n {label && <span>{label}</span>}\n </button>\n );\n};\n"],"mappings":";;;AAIA,IAAM,cAAc;;;;;;;;;;;;;;;;;AAiBpB,IAAM,kBAAkB;CACtB,SAAS;CACT,WACE;CACF,UACE;AACJ;AACA,IAAM,eAAe;CACnB,OAAO;CACP,QAAQ;CACR,OAAO;AACT;AAEA,IAAa,UAAU,EACrB,UAAU,OACV,SACA,OAAO,UACP,iBACA,OACA,UACA,OAAO,UACP,YAAY,IACZ,GAAG,YACc;CAEjB,MAAM,iBAAiB,gBADC,YAAY,UAAU,YAAY;CAK1D,OACE,iBAAA,GAAA,kBAAA,MAAC,UAAD;EACQ;EACN,WAAW,cAAA,gBAAgB,aAAa,gBAL1C,aAAa,SAAsC,aAAa,QAKO,SAAS;EAC9E,OAAO,kBAAkB,EAAE,gBAAgB,IAAI,KAAA;EAC/C,GAAI;YAJN,CAMG,UACA,SAAS,iBAAA,GAAA,kBAAA,KAAC,QAAD,EAAA,UAAO,MAAY,CAAA,CACvB;;AAEZ"}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
require("./
|
|
2
|
-
const require_HoverBorderGradient = require("./HoverBorderGradient-DMMyr2L3.cjs");
|
|
1
|
+
const require_HoverBorderGradient = require("./HoverBorderGradient-DTKasFZO.cjs");
|
|
3
2
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
4
3
|
//#region src/components/effects/button-hover-border-gradient/ButtonHoverBorderGradient.tsx
|
|
5
4
|
var ButtonHoverBorderGradient = ({ children, ...props }) => {
|
|
@@ -21,4 +20,4 @@ Object.defineProperty(exports, "ButtonHoverBorderGradient", {
|
|
|
21
20
|
}
|
|
22
21
|
});
|
|
23
22
|
|
|
24
|
-
//# sourceMappingURL=button-hover-border-gradient-
|
|
23
|
+
//# sourceMappingURL=button-hover-border-gradient-D12Zjmd3.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button-hover-border-gradient-
|
|
1
|
+
{"version":3,"file":"button-hover-border-gradient-D12Zjmd3.cjs","names":[],"sources":["../../src/components/effects/button-hover-border-gradient/ButtonHoverBorderGradient.tsx"],"sourcesContent":["import { HoverBorderGradient } from \"../hover-border-gradient/HoverBorderGradient\";\n\ninterface ButtonHoverBorderGradientProps {\n children?: React.ReactNode;\n}\n\nexport const ButtonHoverBorderGradient: React.FC<\n ButtonHoverBorderGradientProps\n> = ({ children, ...props }) => {\n return (\n <div className=\"m-40 flex justify-center text-center\" {...props}>\n <HoverBorderGradient\n containerClassName=\"rounded\"\n className=\"flex items-center space-x-2 bg-ds-surface-1 text-ds-1\"\n >\n {children}\n </HoverBorderGradient>\n </div>\n );\n};\n"],"mappings":";;;AAMA,IAAa,6BAER,EAAE,UAAU,GAAG,YAAY;CAC9B,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EAAK,WAAU;EAAuC,GAAI;YACxD,iBAAA,GAAA,kBAAA,KAAC,4BAAA,qBAAD;GACE,oBAAmB;GACnB,WAAU;GAET;EACkB,CAAA;CAClB,CAAA;AAET"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { t as HoverBorderGradient } from "./HoverBorderGradient-
|
|
1
|
+
import { t as HoverBorderGradient } from "./HoverBorderGradient-CGKcviEd.mjs";
|
|
2
2
|
import { jsx } from "react/jsx-runtime";
|
|
3
3
|
//#region src/components/effects/button-hover-border-gradient/ButtonHoverBorderGradient.tsx
|
|
4
4
|
var ButtonHoverBorderGradient = ({ children, ...props }) => {
|
|
@@ -15,4 +15,4 @@ var ButtonHoverBorderGradient = ({ children, ...props }) => {
|
|
|
15
15
|
//#endregion
|
|
16
16
|
export { ButtonHoverBorderGradient as t };
|
|
17
17
|
|
|
18
|
-
//# sourceMappingURL=button-hover-border-gradient-
|
|
18
|
+
//# sourceMappingURL=button-hover-border-gradient-VNEg4V0o.mjs.map
|