@jenesei-software/jenesei-kit-react 1.3.19 → 1.3.21
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/build/area-BG04bpxi.cjs +2 -0
- package/build/area-BG04bpxi.cjs.map +1 -0
- package/build/{area-CD8KKIM0.js → area-D4BoNEmX.js} +2 -2
- package/build/{area-CD8KKIM0.js.map → area-D4BoNEmX.js.map} +1 -1
- package/build/area-occQcGnD.js +19 -0
- package/build/area-occQcGnD.js.map +1 -0
- package/build/area-outside.cjs.js +1 -1
- package/build/area-outside.es.js +1 -1
- package/build/{area-Dup_lUb9.cjs → area-pCo19R2g.cjs} +2 -2
- package/build/{area-Dup_lUb9.cjs.map → area-pCo19R2g.cjs.map} +1 -1
- package/build/area-preview.cjs.js +1 -1
- package/build/area-preview.es.js +1 -1
- package/build/area-scroll.cjs.js +1 -1
- package/build/area-scroll.es.js +3 -2
- package/build/area-scroll.es.js.map +1 -1
- package/build/area-skeleton.cjs.js +1 -1
- package/build/area-skeleton.d.ts +6 -1
- package/build/area-skeleton.es.js +1 -1
- package/build/area-smooth.cjs.js +1 -1
- package/build/area-smooth.es.js +1 -1
- package/build/{area-BWxBop5m.js → area.styles-BSqCfPE4.js} +3 -18
- package/build/area.styles-BSqCfPE4.js.map +1 -0
- package/build/area.styles-BuceLNra.cjs +27 -0
- package/build/area.styles-BuceLNra.cjs.map +1 -0
- package/build/build-info.txt +3 -3
- package/build/{component-GKvpOWlO.cjs → component-5Utdcc2G.cjs} +7 -7
- package/build/{component-GKvpOWlO.cjs.map → component-5Utdcc2G.cjs.map} +1 -1
- package/build/component-86oA9dYz.cjs +2 -0
- package/build/component-86oA9dYz.cjs.map +1 -0
- package/build/{component.styles-0apMzB81.js → component-B--Ljzf8.js} +5 -75
- package/build/component-B--Ljzf8.js.map +1 -0
- package/build/component-Bq9jd15r.cjs +2 -0
- package/build/component-Bq9jd15r.cjs.map +1 -0
- package/build/{component.styles-euSUJAiA.js → component-C3BrgaVs.js} +5 -38
- package/build/component-C3BrgaVs.js.map +1 -0
- package/build/component-C7SV3z2B.js +10 -0
- package/build/component-C7SV3z2B.js.map +1 -0
- package/build/{component.styles-CwTYpBx_.js → component-C9TJVTRc.js} +11 -64
- package/build/component-C9TJVTRc.js.map +1 -0
- package/build/{component-6hRanOkU.cjs → component-CLqcB5mM.cjs} +2 -2
- package/build/{component-6hRanOkU.cjs.map → component-CLqcB5mM.cjs.map} +1 -1
- package/build/{component-B80It4vM.js → component-CS7C3l76.js} +5 -5
- package/build/component-CS7C3l76.js.map +1 -0
- package/build/{component-DpVp9dB1.js → component-CUiqQLEQ.js} +2 -2
- package/build/{component-DpVp9dB1.js.map → component-CUiqQLEQ.js.map} +1 -1
- package/build/{component.styles-AEJ_tw7Y.js → component-CWIsglCv.js} +4 -25
- package/build/component-CWIsglCv.js.map +1 -0
- package/build/component-CZPL9hGj.cjs +2 -0
- package/build/component-CZPL9hGj.cjs.map +1 -0
- package/build/{component-8NOxwZJO.cjs → component-Cc8X-Z80.cjs} +2 -2
- package/build/{component-8NOxwZJO.cjs.map → component-Cc8X-Z80.cjs.map} +1 -1
- package/build/{component.styles-KBaixm0o.js → component-CeZFnxeP.js} +4 -56
- package/build/component-CeZFnxeP.js.map +1 -0
- package/build/component-Cp8VTqb2.js +21 -0
- package/build/component-Cp8VTqb2.js.map +1 -0
- package/build/{component-CKBpm4U4.js → component-CqQpLjWf.js} +2 -3
- package/build/{component-CKBpm4U4.js.map → component-CqQpLjWf.js.map} +1 -1
- package/build/component-DAMiuCOk.js +39 -0
- package/build/component-DAMiuCOk.js.map +1 -0
- package/build/component-DBZIl6Pf.cjs +2 -0
- package/build/component-DBZIl6Pf.cjs.map +1 -0
- package/build/component-DC6wk9OC.cjs +2 -0
- package/build/component-DC6wk9OC.cjs.map +1 -0
- package/build/{component-mzzOCXSx.js → component-DEZX8aBs.js} +2 -2
- package/build/{component-mzzOCXSx.js.map → component-DEZX8aBs.js.map} +1 -1
- package/build/component-DgtdqEgO.cjs +2 -0
- package/build/component-DgtdqEgO.cjs.map +1 -0
- package/build/component-Dt1QKoQc.cjs +2 -0
- package/build/component-Dt1QKoQc.cjs.map +1 -0
- package/build/component-DvuH4WLo.cjs +2 -0
- package/build/component-DvuH4WLo.cjs.map +1 -0
- package/build/{component.styles-C4Bz4OTl.js → component-HpOulBAQ.js} +5 -17
- package/build/component-HpOulBAQ.js.map +1 -0
- package/build/component-O7HvTkOa.js +64 -0
- package/build/component-O7HvTkOa.js.map +1 -0
- package/build/component-PvY4ZuKa.cjs +2 -0
- package/build/component-PvY4ZuKa.cjs.map +1 -0
- package/build/component-SobV8wHk.cjs +2 -0
- package/build/component-SobV8wHk.cjs.map +1 -0
- package/build/component-VZLVznEM.cjs +2 -0
- package/build/component-VZLVznEM.cjs.map +1 -0
- package/build/component-accordion.cjs.js +1 -1
- package/build/component-accordion.d.ts +1 -1
- package/build/component-accordion.es.js +3 -2
- package/build/component-accordion.es.js.map +1 -1
- package/build/component-button-group.cjs.js +1 -1
- package/build/component-button-group.es.js +4 -3
- package/build/component-button-group.es.js.map +1 -1
- package/build/component-button.cjs.js +1 -1
- package/build/component-button.es.js +3 -3
- package/build/component-checkbox-group.cjs.js +1 -1
- package/build/component-checkbox-group.es.js +8 -7
- package/build/component-checkbox-group.es.js.map +1 -1
- package/build/component-checkbox.cjs.js +1 -1
- package/build/component-checkbox.es.js +6 -5
- package/build/component-checkbox.es.js.map +1 -1
- package/build/component-date-picker.cjs.js +1 -1
- package/build/component-date-picker.es.js +15 -14
- package/build/component-date-picker.es.js.map +1 -1
- package/build/component-icon.cjs.js +1 -1
- package/build/component-icon.d.ts +16 -3
- package/build/component-icon.es.js +6 -5
- package/build/component-image-button.cjs.js +1 -1
- package/build/component-image-button.es.js +1 -1
- package/build/component-image-select.cjs.js +1 -1
- package/build/component-image-select.es.js +8 -7
- package/build/component-image-select.es.js.map +1 -1
- package/build/component-image-slider.cjs.js +1 -1
- package/build/component-image-slider.es.js +5 -4
- package/build/component-image-slider.es.js.map +1 -1
- package/build/component-image.cjs.js +1 -1
- package/build/component-image.es.js +3 -2
- package/build/component-image.es.js.map +1 -1
- package/build/component-input-otp.cjs.js +1 -1
- package/build/component-input-otp.es.js +5 -4
- package/build/component-input-otp.es.js.map +1 -1
- package/build/component-input.cjs.js +1 -1
- package/build/component-input.es.js +15 -15
- package/build/component-iyi7lqrB.cjs +2 -0
- package/build/{component-Bj7sLW9s.cjs.map → component-iyi7lqrB.cjs.map} +1 -1
- package/build/component-map.cjs.js +1 -1
- package/build/component-map.es.js +13 -12
- package/build/component-map.es.js.map +1 -1
- package/build/component-pagination.cjs.js +1 -1
- package/build/component-pagination.es.js +1 -1
- package/build/component-range.cjs.js +1 -1
- package/build/component-range.es.js +5 -4
- package/build/component-range.es.js.map +1 -1
- package/build/component-ripple.cjs.js +1 -1
- package/build/component-select.cjs.js +1 -1
- package/build/component-select.d.ts +1 -1
- package/build/component-select.es.js +18 -18
- package/build/component-separator.cjs.js +1 -1
- package/build/component-separator.es.js +3 -2
- package/build/component-separator.es.js.map +1 -1
- package/build/component-stack.cjs.js +1 -1
- package/build/component-stack.es.js +1 -1
- package/build/component-textarea.cjs.js +1 -1
- package/build/component-textarea.es.js +5 -5
- package/build/component-toggle.cjs.js +1 -1
- package/build/component-toggle.es.js +4 -3
- package/build/component-toggle.es.js.map +1 -1
- package/build/component-tooltip.cjs.js +1 -1
- package/build/component-tooltip.es.js +9 -9
- package/build/component-typography.cjs.js +1 -1
- package/build/component-typography.es.js +6 -6
- package/build/component.components-Cck7T25y.cjs +2 -0
- package/build/component.components-Cck7T25y.cjs.map +1 -0
- package/build/{component.components-C9TkSqTp.js → component.components-NP2aSgyb.js} +8 -43
- package/build/component.components-NP2aSgyb.js.map +1 -0
- package/build/{component.constants-C8li5_tq.js → component.constants-3UuU_a__.js} +3 -3
- package/build/{component.constants-C8li5_tq.js.map → component.constants-3UuU_a__.js.map} +1 -1
- package/build/{component.constants-CnMky3Ym.js → component.constants-B0mODNks.js} +9 -35
- package/build/component.constants-B0mODNks.js.map +1 -0
- package/build/component.constants-CoFHa30V.cjs +2 -0
- package/build/{component.constants-B-ZMDpFv.cjs.map → component.constants-CoFHa30V.cjs.map} +1 -1
- package/build/component.constants-vNAPiC5p.cjs +2 -0
- package/build/component.constants-vNAPiC5p.cjs.map +1 -0
- package/build/component.styles-CD6ZzRrk.cjs +14 -0
- package/build/component.styles-CD6ZzRrk.cjs.map +1 -0
- package/build/{component.styles-BnJjm_ES.js → component.styles-SZ5VuhNG.js} +2 -19
- package/build/component.styles-SZ5VuhNG.js.map +1 -0
- package/build/component.types-BRZsYWlH.cjs +2 -0
- package/build/component.types-BRZsYWlH.cjs.map +1 -0
- package/build/{component.types-BoTWSvjd.js → component.types-Cysm3D4v.js} +5 -214
- package/build/component.types-Cysm3D4v.js.map +1 -0
- package/build/consts.cjs.js +1 -1
- package/build/consts.cjs.js.map +1 -1
- package/build/consts.d.ts +18 -16
- package/build/consts.es.js +28 -26
- package/build/consts.es.js.map +1 -1
- package/build/{context.functions-CQ9GerPb.js → context-B1DS5U6M.js} +3 -33
- package/build/{context.functions-CQ9GerPb.js.map → context-B1DS5U6M.js.map} +1 -1
- package/build/{context.functions-BD15C8_y.js → context-BxU5kwVR.js} +3 -33
- package/build/context-BxU5kwVR.js.map +1 -0
- package/build/{context.hooks-BzMTkJNv.js → context-CU_dgoUl.js} +3 -11
- package/build/context-CU_dgoUl.js.map +1 -0
- package/build/context-Cr9zS5ai.cjs +2 -0
- package/build/context-Cr9zS5ai.cjs.map +1 -0
- package/build/context-_4lcMeym.cjs +2 -0
- package/build/context-_4lcMeym.cjs.map +1 -0
- package/build/context-app.cjs.js +1 -1
- package/build/context-app.es.js +18 -17
- package/build/context-app.es.js.map +1 -1
- package/build/context-cookie.cjs.js +1 -1
- package/build/context-cookie.es.js +2 -1
- package/build/context-cookie.es.js.map +1 -1
- package/build/context-dialog.cjs.js +1 -1
- package/build/context-dialog.es.js +13 -12
- package/build/context-dialog.es.js.map +1 -1
- package/build/context-geolocation.cjs.js +1 -1
- package/build/context-geolocation.es.js +2 -1
- package/build/context-geolocation.es.js.map +1 -1
- package/build/context-local-storage.cjs.js +1 -1
- package/build/context-local-storage.es.js +2 -1
- package/build/context-local-storage.es.js.map +1 -1
- package/build/context-q6vhN54o.cjs +2 -0
- package/build/{context.functions-ohI9H54j.cjs.map → context-q6vhN54o.cjs.map} +1 -1
- package/build/context-sonner.cjs.js +1 -1
- package/build/context-sonner.es.js +18 -17
- package/build/context-sonner.es.js.map +1 -1
- package/build/context.constants-BVl2x1gR.js +8556 -0
- package/build/context.constants-BVl2x1gR.js.map +1 -0
- package/build/context.constants-BgXWD3zz.cjs +32 -0
- package/build/context.constants-BgXWD3zz.cjs.map +1 -0
- package/build/{context.constants-BCpaUfFz.js → context.constants-D-s5XvZX.js} +14 -52
- package/build/context.constants-D-s5XvZX.js.map +1 -0
- package/build/context.constants-YhrMPIvq.cjs +1750 -0
- package/build/context.constants-YhrMPIvq.cjs.map +1 -0
- package/build/context.functions-54_96FIi.js +36 -0
- package/build/context.functions-54_96FIi.js.map +1 -0
- package/build/context.functions-Bk5xMi0w.cjs +2 -0
- package/build/context.functions-Bk5xMi0w.cjs.map +1 -0
- package/build/context.functions-BoRkDnCa.cjs +2 -0
- package/build/context.functions-BoRkDnCa.cjs.map +1 -0
- package/build/context.functions-X5gRRpKi.js +35 -0
- package/build/context.functions-X5gRRpKi.js.map +1 -0
- package/build/context.hooks-99wJ8TBG.cjs +2 -0
- package/build/context.hooks-99wJ8TBG.cjs.map +1 -0
- package/build/context.hooks-B16qxQQY.cjs +2 -0
- package/build/context.hooks-B16qxQQY.cjs.map +1 -0
- package/build/context.hooks-DjwMqRSt.js +13 -0
- package/build/context.hooks-DjwMqRSt.js.map +1 -0
- package/build/context.hooks-Dkb5yK8Z.cjs +2 -0
- package/build/context.hooks-Dkb5yK8Z.cjs.map +1 -0
- package/build/context.hooks-KS9z3sac.js +13 -0
- package/build/context.hooks-KS9z3sac.js.map +1 -0
- package/build/context.hooks-OTo7Znss.cjs +2 -0
- package/build/context.hooks-OTo7Znss.cjs.map +1 -0
- package/build/context.hooks-fo2TeZoK.js +44 -0
- package/build/context.hooks-fo2TeZoK.js.map +1 -0
- package/build/context.hooks-uRILnzQk.js +13 -0
- package/build/context.hooks-uRILnzQk.js.map +1 -0
- package/build/index.cjs.js +1 -1
- package/build/index.d.ts +38 -24
- package/build/index.es.js +282 -283
- package/build/index.es.js.map +1 -1
- package/build/style-error.cjs.js +1 -1
- package/build/style-error.es.js +4 -4
- package/build/style-theme.cjs.js +1 -1
- package/build/style-theme.es.js +13 -13
- package/build/types.d.ts +3 -3
- package/build/{use-CnGHh8iL.js → use-BI2JJFUm.js} +8 -9
- package/build/{use-CnGHh8iL.js.map → use-BI2JJFUm.js.map} +1 -1
- package/build/{use-BLwltPMc.cjs → use-CtF6jyms.cjs} +3 -3
- package/build/{use-BLwltPMc.cjs.map → use-CtF6jyms.cjs.map} +1 -1
- package/package.json +1 -1
- package/build/area-BDMDiVi1.js +0 -68
- package/build/area-BDMDiVi1.js.map +0 -1
- package/build/area-BWxBop5m.js.map +0 -1
- package/build/area-Bopd6mWj.cjs +0 -2
- package/build/area-Bopd6mWj.cjs.map +0 -1
- package/build/area-CmCMHnRA.cjs +0 -27
- package/build/area-CmCMHnRA.cjs.map +0 -1
- package/build/area-Cvp3eBBo.js +0 -114
- package/build/area-Cvp3eBBo.js.map +0 -1
- package/build/area-DqLK4RX5.cjs +0 -40
- package/build/area-DqLK4RX5.cjs.map +0 -1
- package/build/component-5o60aes-.cjs +0 -52
- package/build/component-5o60aes-.cjs.map +0 -1
- package/build/component-B80It4vM.js.map +0 -1
- package/build/component-BfppCwz9.cjs +0 -88
- package/build/component-BfppCwz9.cjs.map +0 -1
- package/build/component-Bj7sLW9s.cjs +0 -2
- package/build/component-BxetIWe6.cjs +0 -245
- package/build/component-BxetIWe6.cjs.map +0 -1
- package/build/component-ClnOIQaN.js +0 -66
- package/build/component-ClnOIQaN.js.map +0 -1
- package/build/component-b4tMFkpE.cjs +0 -2
- package/build/component-b4tMFkpE.cjs.map +0 -1
- package/build/component-eqTj4VVc.js +0 -728
- package/build/component-eqTj4VVc.js.map +0 -1
- package/build/component-jPLOz52P.js +0 -186
- package/build/component-jPLOz52P.js.map +0 -1
- package/build/component.components-BZX00SGG.cjs +0 -16
- package/build/component.components-BZX00SGG.cjs.map +0 -1
- package/build/component.components-C9TkSqTp.js.map +0 -1
- package/build/component.constants-B-ZMDpFv.cjs +0 -2
- package/build/component.constants-CnMky3Ym.js.map +0 -1
- package/build/component.constants-Dg6JcWmd.cjs +0 -22
- package/build/component.constants-Dg6JcWmd.cjs.map +0 -1
- package/build/component.styles-0apMzB81.js.map +0 -1
- package/build/component.styles-AEJ_tw7Y.js.map +0 -1
- package/build/component.styles-BO8xaSCQ.cjs +0 -65
- package/build/component.styles-BO8xaSCQ.cjs.map +0 -1
- package/build/component.styles-BVQQkX5c.cjs +0 -57
- package/build/component.styles-BVQQkX5c.cjs.map +0 -1
- package/build/component.styles-BYG4iVCR.cjs +0 -10
- package/build/component.styles-BYG4iVCR.cjs.map +0 -1
- package/build/component.styles-BZ9QLlOU.cjs +0 -39
- package/build/component.styles-BZ9QLlOU.cjs.map +0 -1
- package/build/component.styles-BnJjm_ES.js.map +0 -1
- package/build/component.styles-BviHtzJH.cjs +0 -22
- package/build/component.styles-BviHtzJH.cjs.map +0 -1
- package/build/component.styles-C4Bz4OTl.js.map +0 -1
- package/build/component.styles-C8ONgWei.cjs +0 -47
- package/build/component.styles-C8ONgWei.cjs.map +0 -1
- package/build/component.styles-CHqowxsZ.js +0 -81
- package/build/component.styles-CHqowxsZ.js.map +0 -1
- package/build/component.styles-CLn52hJD.cjs +0 -14
- package/build/component.styles-CLn52hJD.cjs.map +0 -1
- package/build/component.styles-CXyyc0xg.cjs +0 -32
- package/build/component.styles-CXyyc0xg.cjs.map +0 -1
- package/build/component.styles-CtZeOnGH.js +0 -120
- package/build/component.styles-CtZeOnGH.js.map +0 -1
- package/build/component.styles-CwTYpBx_.js.map +0 -1
- package/build/component.styles-CxlbZwr4.cjs +0 -225
- package/build/component.styles-CxlbZwr4.cjs.map +0 -1
- package/build/component.styles-CyCy2ymw.cjs +0 -21
- package/build/component.styles-CyCy2ymw.cjs.map +0 -1
- package/build/component.styles-DWDGLfbF.js +0 -137
- package/build/component.styles-DWDGLfbF.js.map +0 -1
- package/build/component.styles-DqJURuJl.js +0 -1370
- package/build/component.styles-DqJURuJl.js.map +0 -1
- package/build/component.styles-FMHm5NHm.cjs +0 -99
- package/build/component.styles-FMHm5NHm.cjs.map +0 -1
- package/build/component.styles-Hx-MJSWX.cjs +0 -137
- package/build/component.styles-Hx-MJSWX.cjs.map +0 -1
- package/build/component.styles-KBaixm0o.js.map +0 -1
- package/build/component.styles-SZTM0cRW.js +0 -1046
- package/build/component.styles-SZTM0cRW.js.map +0 -1
- package/build/component.styles-_keFf_Qj.cjs +0 -13
- package/build/component.styles-_keFf_Qj.cjs.map +0 -1
- package/build/component.styles-cMafDDpP.js +0 -233
- package/build/component.styles-cMafDDpP.js.map +0 -1
- package/build/component.styles-euSUJAiA.js.map +0 -1
- package/build/component.types-BoTWSvjd.js.map +0 -1
- package/build/component.types-WiRcl02d.cjs +0 -176
- package/build/component.types-WiRcl02d.cjs.map +0 -1
- package/build/context.constants-BCpaUfFz.js.map +0 -1
- package/build/context.constants-BLQ_1jZI.cjs +0 -32
- package/build/context.constants-BLQ_1jZI.cjs.map +0 -1
- package/build/context.constants-Cio0nsYA.js +0 -393
- package/build/context.constants-Cio0nsYA.js.map +0 -1
- package/build/context.constants-y9s5VGN2.cjs +0 -99
- package/build/context.constants-y9s5VGN2.cjs.map +0 -1
- package/build/context.functions-80N-5MqM.cjs +0 -2
- package/build/context.functions-80N-5MqM.cjs.map +0 -1
- package/build/context.functions-BD15C8_y.js.map +0 -1
- package/build/context.functions-ohI9H54j.cjs +0 -2
- package/build/context.hooks-BIIK-2HN.js +0 -527
- package/build/context.hooks-BIIK-2HN.js.map +0 -1
- package/build/context.hooks-BzMTkJNv.js.map +0 -1
- package/build/context.hooks-DNnrgKb0.cjs +0 -72
- package/build/context.hooks-DNnrgKb0.cjs.map +0 -1
- package/build/context.hooks-u408Pxw8.cjs +0 -2
- package/build/context.hooks-u408Pxw8.cjs.map +0 -1
- package/build/floating-ui.react-Byi6bLb1.js +0 -1818
- package/build/floating-ui.react-Byi6bLb1.js.map +0 -1
- package/build/floating-ui.react-DZzvtpim.cjs +0 -2
- package/build/floating-ui.react-DZzvtpim.cjs.map +0 -1
- package/build/style-BzxSHZDV.js +0 -61
- package/build/style-BzxSHZDV.js.map +0 -1
- package/build/style-D8DUzG0C.cjs +0 -32
- package/build/style-D8DUzG0C.cjs.map +0 -1
- package/build/theme.global-BzunMIsv.js +0 -1318
- package/build/theme.global-BzunMIsv.js.map +0 -1
- package/build/theme.global-D67h5YeA.cjs +0 -173
- package/build/theme.global-D67h5YeA.cjs.map +0 -1
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"component.constants-CnMky3Ym.js","sources":["../src/components/image-slider/component.styles.tsx","../src/hooks/use-image-slider/use.tsx","../src/components/image-slider/component.tsx","../src/components/image-slider/component.constants.tsx"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled from 'styled-components';\n\nexport const SliderImage = styled(motion.div)`\n display: flex;\n position: absolute;\n height: 100%;\n width: 100%;\n touch-action: pan-y;\n &:hover {\n cursor: grab;\n }\n\n &:active {\n cursor: grabbing;\n }\n`;\n\nexport const SliderDot = styled(motion.div)`\n width: 6px;\n height: 6px;\n background-color: ${(props) => props.theme.palette.whiteStandard};\n border-radius: 5px;\n opacity: 0.8;\n cursor: pointer;\n`;\n","import { Button } from '@local/components/button';\nimport { Image } from '@local/components/image';\nimport { ImageSliderProps, SliderDot, SliderImage } from '@local/components/image-slider';\nimport { Stack } from '@local/components/stack';\nimport { Typography } from '@local/components/typography';\nimport { useDialog, useDialogProps } from '@local/contexts/context-dialog';\nimport { KEY_SIZE_DATA } from '@local/theme';\n\nimport { AnimatePresence, PanInfo, Variants } from 'framer-motion';\nimport { FC, useCallback, useEffect, useMemo, useState } from 'react';\n\nimport { useImageSliderProps } from '.';\n\nexport const useImageSlider = (props: useImageSliderProps) => {\n const { onIndexChange } = props;\n\n const size = useMemo(() => KEY_SIZE_DATA[props.size], [props.size]);\n const br = useMemo(() => `${size.radius}px`, [size.radius]);\n\n const images = useMemo(() => props.images, [props.images]);\n\n const [{ activeImageId, direction }, setActiveImage] = useState({\n activeImageId: images?.[0]?.id ?? null,\n direction: 0,\n });\n const isLengthOne = useMemo(() => images?.length === 1, [images]);\n const isLengthZero = useMemo(() => images?.length === 0, [images]);\n\n const activeImageIndex = useMemo(() => images.findIndex((img) => img.id === activeImageId), [activeImageId, images]);\n\n const swipeToImage = useCallback(\n (swipeDirection: number) => {\n const currentIndex = images.findIndex((img) => img.id === activeImageId);\n const nextIndex = (currentIndex + swipeDirection + images.length) % images.length;\n setActiveImage({ activeImageId: images[nextIndex].id, direction: swipeDirection });\n },\n [activeImageId, images],\n );\n const dragEndHandler = useCallback(\n (dragInfo: PanInfo) => {\n const { offset, velocity } = dragInfo;\n const swipeThreshold = 50;\n const swipePower = Math.abs(offset.x) * velocity.x;\n\n if (swipePower > 500 || offset.x > swipeThreshold) {\n swipeToImage(-1);\n } else if (swipePower < -500 || offset.x < -swipeThreshold) {\n swipeToImage(1);\n }\n },\n [swipeToImage],\n );\n const skipToImage = useCallback(\n (imageId: number) => {\n const currentIndex = images.findIndex((img) => img.id === activeImageId);\n const newIndex = images.findIndex((img) => img.id === imageId);\n if (newIndex === -1 || newIndex === currentIndex) return;\n\n const direction = newIndex > currentIndex ? 1 : -1;\n setActiveImage({ activeImageId: imageId, direction });\n },\n [activeImageId, images],\n );\n\n useEffect(() => {\n if (activeImageId) onIndexChange?.(activeImageId);\n }, [activeImageId, onIndexChange]);\n\n const { add } = useDialog<ComponentHandleAddProps>({\n br: br,\n dragEndHandler: dragEndHandler,\n images: images,\n children: props.children,\n activeImageIndex: activeImageIndex,\n activeImageId: activeImageId,\n swipeToImage: swipeToImage,\n skipToImage: skipToImage,\n direction: direction,\n aspect: props.imageSettings.aspect,\n genre: props.genre,\n size: props.size,\n failedToLoad: props.locales.failedToLoad,\n isLengthOne: isLengthOne,\n propsDialog: {\n borderRadius: br,\n padding: '0',\n background: 'whiteStandard',\n },\n });\n const handleAdd = useCallback(() => {\n add({\n content: (params, remove) => <ComponentHandleAdd params={params} remove={remove} />,\n });\n }, [add]);\n\n return {\n isLengthZero,\n direction,\n activeImageId,\n isLengthOne,\n dragEndHandler,\n activeImageIndex,\n swipeToImage,\n skipToImage,\n handleAdd,\n };\n};\nconst sliderVariants: Variants = {\n initial: (direction) => ({\n x: direction > 0 ? '100%' : '-100%',\n scale: 1,\n opacity: 0,\n }),\n active: { x: 0, scale: 1, opacity: 1 },\n exit: (direction) => ({\n x: direction > 0 ? '-100%' : '100%',\n scale: 1,\n opacity: 0.2,\n }),\n};\nconst sliderTransition = {\n duration: 0.3,\n ease: [0.56, 0.03, 0.12, 1.04],\n};\n\ntype ComponentHandleAddProps = {\n br?: string;\n dragEndHandler: (dragInfo: PanInfo) => void;\n images: ImageSliderProps['images'];\n children?: ImageSliderProps['children'];\n activeImageIndex: number;\n activeImageId: number | null;\n swipeToImage: (swipeDirection: number) => void;\n skipToImage: (imageId: number) => void;\n direction: number;\n aspect: number;\n failedToLoad: string;\n isLengthOne: boolean;\n} & Pick<ImageSliderProps, 'genre' | 'size'>;\n\nconst ComponentHandleAdd: FC<{\n params?: useDialogProps<ComponentHandleAddProps>;\n remove?: () => void;\n}> = ({ params, remove }) => {\n return (\n <Stack\n sx={{\n default: {\n position: 'relative',\n overflow: 'hidden',\n aspectRatio: `${params?.aspect! * 2} / 2`,\n width: 'auto',\n maxWidth: '70dvw',\n height: '85dvh',\n borderRadius: params?.br,\n },\n tablet: {\n maxWidth: '95dvw',\n },\n }}\n >\n <AnimatePresence initial={false} custom={params?.direction}>\n <SliderImage\n key={params?.activeImageId}\n style={{\n overflow: 'hidden',\n borderRadius: params?.br,\n }}\n custom={params?.direction}\n variants={sliderVariants}\n initial='initial'\n animate='active'\n exit='exit'\n transition={sliderTransition}\n {...(!params?.isLengthOne\n ? {\n drag: 'x',\n dragConstraints: { left: 0, right: 0 },\n dragElastic: 0.5,\n onDragEnd: (_, dragInfo) => params?.dragEndHandler(dragInfo),\n }\n : {})}\n >\n <Image\n sxStack={(theme) => ({\n default: {\n width: '100%',\n height: '100%',\n alignItems: 'center',\n justifyContent: 'center',\n backgroundColor: theme.palette.black10,\n position: 'absolute',\n pointerEvents: 'none',\n },\n })}\n isShowBeforeImage\n sxImage={{\n default: {\n objectFit: 'contain',\n },\n }}\n alt={(params?.images ?? [])?.[params?.activeImageIndex ?? 0]?.imageSrc}\n src={(params?.images ?? [])?.[params?.activeImageIndex ?? 0]?.imageSrc}\n componentFallback={\n <Typography\n sx={{\n default: {\n variant: 'h6',\n },\n }}\n >\n {params?.failedToLoad}\n </Typography>\n }\n />\n {(params?.images ?? [])?.[params?.activeImageIndex ?? 0]?.children}\n </SliderImage>\n </AnimatePresence>\n {typeof params?.children === 'function' ? params?.children?.({ isDialog: true }) : params?.children}\n\n <Button\n sx={{\n default: {\n position: 'absolute',\n bottom: 15,\n right: 15,\n },\n }}\n genre={params?.genre ?? 'product'}\n size={params?.size ?? 'medium'}\n icons={[\n {\n type: 'id',\n name: 'Arrow4',\n },\n ]}\n isWidthAsHeight\n isHiddenBorder\n isRadius\n onClick={() => remove?.()}\n />\n {!params?.isLengthOne ? (\n <>\n <Stack\n sx={{\n default: {\n position: 'absolute',\n bottom: 15,\n left: 15,\n gap: '8px',\n },\n }}\n >\n <Button\n genre={params?.genre ?? 'product'}\n size={params?.size ?? 'medium'}\n icons={[\n {\n type: 'id',\n name: 'Arrow4',\n turn: 90,\n },\n ]}\n isWidthAsHeight\n isHiddenBorder\n isPlaystationEffect\n isRadius\n onClick={() => params?.swipeToImage?.(-1)}\n />\n <Button\n genre={params?.genre ?? 'product'}\n size={params?.size ?? 'medium'}\n icons={[\n {\n type: 'id',\n name: 'Arrow4',\n turn: -90,\n },\n ]}\n isWidthAsHeight\n isHiddenBorder\n isPlaystationEffect\n isRadius\n onClick={() => params?.swipeToImage?.(1)}\n />\n </Stack>\n <Stack\n sx={{\n default: {\n position: 'absolute',\n bottom: 15,\n left: '50%',\n transform: 'translateX(-50%)',\n gap: '4px',\n },\n }}\n >\n {(params?.images ?? [])?.map((i) => (\n <SliderDot\n onClick={() => params?.skipToImage?.(i.id)}\n key={i.id}\n initial={false}\n animate={{\n scale: params?.activeImageId === i.id ? 1.5 : 1,\n opacity: params?.activeImageId === i.id ? 1 : 0.5,\n }}\n />\n ))}\n </Stack>\n </>\n ) : null}\n </Stack>\n );\n};\n","import { useImageSlider } from '@local/hooks/use-image-slider';\nimport { KEY_SIZE_DATA } from '@local/theme';\n\nimport { AnimatePresence, Variants } from 'framer-motion';\nimport { FC, useMemo } from 'react';\n\nimport { Button } from '../button';\nimport { Icon } from '../icon';\nimport { Image } from '../image';\nimport { Stack, StackMotion } from '../stack';\nimport { Typography } from '../typography';\nimport { ImageSliderProps, SliderDot, SliderImage } from '.';\n\nexport const ImageSlider: FC<ImageSliderProps> = (props) => {\n const { onIndexChange } = props;\n const images = useMemo(() => props.images, [props.images]);\n const size = useMemo(() => KEY_SIZE_DATA[props.size], [props.size]);\n const br = useMemo(() => `${size.radius}px`, [size.radius]);\n\n const {\n isLengthZero,\n direction,\n activeImageId,\n isLengthOne,\n dragEndHandler,\n activeImageIndex,\n swipeToImage,\n skipToImage,\n handleAdd,\n } = useImageSlider({\n genre: props.genre,\n size: props.size,\n images: images,\n imageSettings: props.imageSettings,\n locales: props.locales,\n onIndexChange: onIndexChange,\n children: props.children,\n });\n return (\n <StackMotion\n {...props.propsStack}\n sx={(theme) => ({\n ...props.propsStack?.sx,\n default: {\n borderRadius: br,\n flexDirection: 'column',\n alignItems: 'center',\n overflow: 'hidden',\n width: 'auto',\n maxWidth: '70dvw',\n height: '85dvh',\n ...(props.propsStack?.sx\n ? typeof props.propsStack?.sx === 'function'\n ? props.propsStack?.sx(theme).default\n : props.propsStack?.sx.default\n : {}),\n },\n tablet: {\n maxWidth: '95dvw',\n ...(props.propsStack?.sx\n ? typeof props.propsStack?.sx === 'function'\n ? props.propsStack?.sx(theme).tablet\n : props.propsStack?.sx.tablet\n : {}),\n },\n })}\n >\n {props.isLoading ? (\n <Stack\n sx={{\n default: {\n width: '100%',\n height: '100%',\n position: 'relative',\n overflow: 'hidden',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n },\n }}\n >\n <Icon size='large' type='loading' color='blueFocus' name='Line' />\n </Stack>\n ) : !isLengthZero ? (\n <Stack\n sx={{\n default: {\n width: '100%',\n height: '100%',\n position: 'relative',\n overflow: 'hidden',\n },\n }}\n >\n <AnimatePresence initial={false} custom={direction}>\n <SliderImage\n key={activeImageId}\n style={{\n overflow: 'hidden',\n borderRadius: br,\n }}\n custom={direction}\n variants={sliderVariants}\n initial='initial'\n animate='active'\n exit='exit'\n transition={sliderTransition}\n {...(!isLengthOne\n ? {\n drag: 'x',\n dragConstraints: { left: 0, right: 0 },\n dragElastic: 0.5,\n onDragEnd: (_, dragInfo) => dragEndHandler(dragInfo),\n }\n : {})}\n >\n <Image\n sxStack={(theme) => ({\n default: {\n width: '100%',\n height: '100%',\n alignItems: 'center',\n justifyContent: 'center',\n backgroundColor: theme.palette.black10,\n position: 'absolute',\n pointerEvents: 'none',\n },\n })}\n alt={images[activeImageIndex]?.imageSrc}\n src={images[activeImageIndex]?.imageSrc}\n componentFallback={\n <Typography\n sx={{\n default: {\n variant: 'h6',\n },\n }}\n >\n {props.locales.failedToLoad}\n </Typography>\n }\n />\n {images[activeImageIndex]?.children}\n </SliderImage>\n </AnimatePresence>\n {typeof props?.children === 'function' ? props?.children?.({ isDialog: false }) : props?.children}\n\n {!isLengthOne && (\n <>\n <Button\n sx={{\n default: {\n position: 'absolute',\n top: '50%',\n left: 5,\n transform: 'translateY(-50%)',\n },\n }}\n genre={props.genre}\n size={props.size}\n icons={[\n {\n type: 'id',\n name: 'Arrow4',\n turn: 90,\n },\n ]}\n isWidthAsHeight\n isHiddenBorder\n isRadius\n onClick={() => swipeToImage(-1)}\n />\n <Button\n sx={{\n default: {\n position: 'absolute',\n top: '50%',\n right: 5,\n transform: 'translateY(-50%)',\n },\n }}\n genre={props.genre}\n size={props.size}\n icons={[\n {\n type: 'id',\n name: 'Arrow4',\n turn: -90,\n },\n ]}\n isWidthAsHeight\n isHiddenBorder\n isRadius\n onClick={() => swipeToImage(1)}\n />\n <Stack\n sx={{\n default: {\n position: 'absolute',\n bottom: 5,\n left: '50%',\n transform: 'translateX(-50%)',\n gap: '4px',\n },\n }}\n >\n {images.map((i) => (\n <SliderDot\n onClick={() => skipToImage(i.id)}\n key={i.id}\n initial={false}\n animate={{\n scale: activeImageId === i.id ? 1.5 : 1,\n opacity: activeImageId === i.id ? 1 : 0.5,\n }}\n />\n ))}\n </Stack>\n </>\n )}\n\n <Button\n sx={{\n default: {\n position: 'absolute',\n bottom: 5,\n right: 5,\n },\n }}\n genre={props.genre}\n size={props.size}\n icons={[\n {\n type: 'id',\n name: 'Activity',\n },\n ]}\n isWidthAsHeight\n isHiddenBorder\n isRadius\n onClick={() => handleAdd()}\n />\n </Stack>\n ) : (\n <Stack\n sx={{\n default: {\n width: '100%',\n height: '100%',\n position: 'relative',\n overflow: 'hidden',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n },\n }}\n >\n <Typography\n sx={{\n default: {\n variant: 'h6',\n },\n }}\n >\n {props.locales.noImagesAvailable}\n </Typography>\n </Stack>\n )}\n </StackMotion>\n );\n};\nconst sliderVariants: Variants = {\n initial: (direction) => ({\n x: direction > 0 ? '100%' : '-100%',\n scale: 1,\n opacity: 0,\n }),\n active: { x: 0, scale: 1, opacity: 1 },\n exit: (direction) => ({\n x: direction > 0 ? '-100%' : '100%',\n scale: 1,\n opacity: 0.2,\n }),\n};\nconst sliderTransition = {\n duration: 0.3,\n ease: [0.56, 0.03, 0.12, 1.04],\n};\n","import 'styled-components';\n\nimport { ImageSliderProps } from '.';\nimport { Button } from '../button';\nimport { Stack } from '../stack';\n\nexport const IMAGES: ImageSliderProps['images'] = [\n {\n id: 0,\n children: (\n <Stack\n sx={{\n default: {\n justifyContent: 'flex-start',\n padding: '5px',\n flexGrow: 1,\n },\n }}\n >\n <Button\n isHiddenBorder\n isDisabled\n genre='realebail-white'\n size='medium'\n sxTypography={{ default: { weight: 700 } }}\n >\n Los Angeles\n </Button>\n </Stack>\n ),\n imageSrc:\n 'https://drupal-prod.visitcalifornia.com/sites/default/files/styles/fluid_1920/public/2020-06/VC_PlacesToVisit_LosAngelesCounty_RF_1170794243.jpg.webp?itok=46pJYz8v',\n },\n {\n id: 1,\n children: (\n <Stack\n sx={{\n default: {\n justifyContent: 'flex-start',\n padding: '5px',\n flexGrow: 1,\n },\n }}\n >\n <Button\n isHiddenBorder\n isDisabled\n genre='realebail-white'\n size='medium'\n sxTypography={{ default: { weight: 700 } }}\n >\n Los Angeles\n </Button>\n </Stack>\n ),\n imageSrc:\n 'https://images.unsplash.com/flagged/photo-1575555201693-7cd442b8023f?fm=jpg&q=60&w=3000&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8bG9zJTIwYW5nZWxlc3xlbnwwfHwwfHx8MA%3D%3D',\n },\n {\n id: 2,\n children: (\n <Stack\n sx={{\n default: {\n justifyContent: 'flex-start',\n padding: '5px',\n flexGrow: 1,\n },\n }}\n >\n <Button\n isHiddenBorder\n isDisabled\n genre='realebail-white'\n size='medium'\n sxTypography={{ default: { weight: 700 } }}\n >\n Los Angeles\n </Button>\n </Stack>\n ),\n imageSrc:\n 'https://img.goodfon.com/original/2048x1319/8/29/ssha-kaliforniia-los-andzheles-los-angeles-doma-neboskreby-s.jpg',\n },\n {\n id: 3,\n children: (\n <Stack\n sx={{\n default: {\n justifyContent: 'flex-start',\n padding: '5px',\n flexGrow: 1,\n },\n }}\n >\n <Button\n isHiddenBorder\n isDisabled\n genre='realebail-white'\n size='medium'\n sxTypography={{ default: { weight: 700 } }}\n >\n Los Angeles\n </Button>\n </Stack>\n ),\n imageSrc:\n 'https://images.pexels.com/photos/2231756/pexels-photo-2231756.jpeg?auto=compress&cs=tinysrgb&dpr=2&w=500',\n },\n {\n id: 4,\n children: (\n <Stack\n sx={{\n default: {\n justifyContent: 'flex-start',\n padding: '5px',\n flexGrow: 1,\n },\n }}\n >\n <Button\n isHiddenBorder\n isDisabled\n genre='realebail-white'\n size='medium'\n sxTypography={{ default: { weight: 700 } }}\n >\n Los Angeles\n </Button>\n </Stack>\n ),\n imageSrc:\n 'https://images.pexels.com/photos/1813157/pexels-photo-1813157.jpeg?auto=compress&cs=tinysrgb&dpr=2&w=500',\n },\n];\n"],"names":["direction","jsx","sliderVariants","sliderTransition","jsxs","Fragment","_a","_b","_c","_d"],"mappings":"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"}
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
"use strict";const e=require("./jsx-runtime-BcGej2Kr.cjs"),i=require("./component-BfppCwz9.cjs"),t=require("./component.styles-BYG4iVCR.cjs"),s=require("framer-motion"),n=require("styled-components"),o=require("./component-GKvpOWlO.cjs"),a=require("./component-BxetIWe6.cjs"),l=require("./context.constants-BLQ_1jZI.cjs"),d=require("./theme.global-D67h5YeA.cjs"),r=require("react"),u=require("./component.styles-BviHtzJH.cjs"),c=n(s.motion.div)`
|
|
2
|
-
display: flex;
|
|
3
|
-
position: absolute;
|
|
4
|
-
height: 100%;
|
|
5
|
-
width: 100%;
|
|
6
|
-
touch-action: pan-y;
|
|
7
|
-
&:hover {
|
|
8
|
-
cursor: grab;
|
|
9
|
-
}
|
|
10
|
-
|
|
11
|
-
&:active {
|
|
12
|
-
cursor: grabbing;
|
|
13
|
-
}
|
|
14
|
-
`,x=n(s.motion.div)`
|
|
15
|
-
width: 6px;
|
|
16
|
-
height: 6px;
|
|
17
|
-
background-color: ${e=>e.theme.palette.whiteStandard};
|
|
18
|
-
border-radius: 5px;
|
|
19
|
-
opacity: 0.8;
|
|
20
|
-
cursor: pointer;
|
|
21
|
-
`,p={initial:e=>({x:e>0?"100%":"-100%",scale:1,opacity:0}),active:{x:0,scale:1,opacity:1},exit:e=>({x:e>0?"-100%":"100%",scale:1,opacity:.2})},m={duration:.3,ease:[.56,.03,.12,1.04]},g=({params:n,remove:l})=>{var d,r,u,g,h,v,f,j;return e.jsxRuntimeExports.jsxs(o.Stack,{sx:{default:{position:"relative",overflow:"hidden",aspectRatio:2*(null==n?void 0:n.aspect)+" / 2",width:"auto",maxWidth:"70dvw",height:"85dvh",borderRadius:null==n?void 0:n.br},tablet:{maxWidth:"95dvw"}},children:[e.jsxRuntimeExports.jsx(s.AnimatePresence,{initial:!1,custom:null==n?void 0:n.direction,children:e.jsxRuntimeExports.jsxs(c,{style:{overflow:"hidden",borderRadius:null==n?void 0:n.br},custom:null==n?void 0:n.direction,variants:p,initial:"initial",animate:"active",exit:"exit",transition:m,...(null==n?void 0:n.isLengthOne)?{}:{drag:"x",dragConstraints:{left:0,right:0},dragElastic:.5,onDragEnd:(e,i)=>null==n?void 0:n.dragEndHandler(i)},children:[e.jsxRuntimeExports.jsx(t.Image,{sxStack:e=>({default:{width:"100%",height:"100%",alignItems:"center",justifyContent:"center",backgroundColor:e.palette.black10,position:"absolute",pointerEvents:"none"}}),isShowBeforeImage:!0,sxImage:{default:{objectFit:"contain"}},alt:null==(r=null==(d=(null==n?void 0:n.images)??[])?void 0:d[(null==n?void 0:n.activeImageIndex)??0])?void 0:r.imageSrc,src:null==(g=null==(u=(null==n?void 0:n.images)??[])?void 0:u[(null==n?void 0:n.activeImageIndex)??0])?void 0:g.imageSrc,componentFallback:e.jsxRuntimeExports.jsx(a.Typography,{sx:{default:{variant:"h6"}},children:null==n?void 0:n.failedToLoad})}),null==(v=null==(h=(null==n?void 0:n.images)??[])?void 0:h[(null==n?void 0:n.activeImageIndex)??0])?void 0:v.children]},null==n?void 0:n.activeImageId)}),"function"==typeof(null==n?void 0:n.children)?null==(f=null==n?void 0:n.children)?void 0:f.call(n,{isDialog:!0}):null==n?void 0:n.children,e.jsxRuntimeExports.jsx(i.Button,{sx:{default:{position:"absolute",bottom:15,right:15}},genre:(null==n?void 0:n.genre)??"product",size:(null==n?void 0:n.size)??"medium",icons:[{type:"id",name:"Arrow4"}],isWidthAsHeight:!0,isHiddenBorder:!0,isRadius:!0,onClick:()=>null==l?void 0:l()}),(null==n?void 0:n.isLengthOne)?null:e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsxs(o.Stack,{sx:{default:{position:"absolute",bottom:15,left:15,gap:"8px"}},children:[e.jsxRuntimeExports.jsx(i.Button,{genre:(null==n?void 0:n.genre)??"product",size:(null==n?void 0:n.size)??"medium",icons:[{type:"id",name:"Arrow4",turn:90}],isWidthAsHeight:!0,isHiddenBorder:!0,isPlaystationEffect:!0,isRadius:!0,onClick:()=>{var e;return null==(e=null==n?void 0:n.swipeToImage)?void 0:e.call(n,-1)}}),e.jsxRuntimeExports.jsx(i.Button,{genre:(null==n?void 0:n.genre)??"product",size:(null==n?void 0:n.size)??"medium",icons:[{type:"id",name:"Arrow4",turn:-90}],isWidthAsHeight:!0,isHiddenBorder:!0,isPlaystationEffect:!0,isRadius:!0,onClick:()=>{var e;return null==(e=null==n?void 0:n.swipeToImage)?void 0:e.call(n,1)}})]}),e.jsxRuntimeExports.jsx(o.Stack,{sx:{default:{position:"absolute",bottom:15,left:"50%",transform:"translateX(-50%)",gap:"4px"}},children:null==(j=(null==n?void 0:n.images)??[])?void 0:j.map(i=>e.jsxRuntimeExports.jsx(x,{onClick:()=>{var e;return null==(e=null==n?void 0:n.skipToImage)?void 0:e.call(n,i.id)},initial:!1,animate:{scale:(null==n?void 0:n.activeImageId)===i.id?1.5:1,opacity:(null==n?void 0:n.activeImageId)===i.id?1:.5}},i.id))})]})]})},h={initial:e=>({x:e>0?"100%":"-100%",scale:1,opacity:0}),active:{x:0,scale:1,opacity:1},exit:e=>({x:e>0?"-100%":"100%",scale:1,opacity:.2})},v={duration:.3,ease:[.56,.03,.12,1.04]},f=[{id:0,children:e.jsxRuntimeExports.jsx(o.Stack,{sx:{default:{justifyContent:"flex-start",padding:"5px",flexGrow:1}},children:e.jsxRuntimeExports.jsx(i.Button,{isHiddenBorder:!0,isDisabled:!0,genre:"realebail-white",size:"medium",sxTypography:{default:{weight:700}},children:"Los Angeles"})}),imageSrc:"https://drupal-prod.visitcalifornia.com/sites/default/files/styles/fluid_1920/public/2020-06/VC_PlacesToVisit_LosAngelesCounty_RF_1170794243.jpg.webp?itok=46pJYz8v"},{id:1,children:e.jsxRuntimeExports.jsx(o.Stack,{sx:{default:{justifyContent:"flex-start",padding:"5px",flexGrow:1}},children:e.jsxRuntimeExports.jsx(i.Button,{isHiddenBorder:!0,isDisabled:!0,genre:"realebail-white",size:"medium",sxTypography:{default:{weight:700}},children:"Los Angeles"})}),imageSrc:"https://images.unsplash.com/flagged/photo-1575555201693-7cd442b8023f?fm=jpg&q=60&w=3000&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8bG9zJTIwYW5nZWxlc3xlbnwwfHwwfHx8MA%3D%3D"},{id:2,children:e.jsxRuntimeExports.jsx(o.Stack,{sx:{default:{justifyContent:"flex-start",padding:"5px",flexGrow:1}},children:e.jsxRuntimeExports.jsx(i.Button,{isHiddenBorder:!0,isDisabled:!0,genre:"realebail-white",size:"medium",sxTypography:{default:{weight:700}},children:"Los Angeles"})}),imageSrc:"https://img.goodfon.com/original/2048x1319/8/29/ssha-kaliforniia-los-andzheles-los-angeles-doma-neboskreby-s.jpg"},{id:3,children:e.jsxRuntimeExports.jsx(o.Stack,{sx:{default:{justifyContent:"flex-start",padding:"5px",flexGrow:1}},children:e.jsxRuntimeExports.jsx(i.Button,{isHiddenBorder:!0,isDisabled:!0,genre:"realebail-white",size:"medium",sxTypography:{default:{weight:700}},children:"Los Angeles"})}),imageSrc:"https://images.pexels.com/photos/2231756/pexels-photo-2231756.jpeg?auto=compress&cs=tinysrgb&dpr=2&w=500"},{id:4,children:e.jsxRuntimeExports.jsx(o.Stack,{sx:{default:{justifyContent:"flex-start",padding:"5px",flexGrow:1}},children:e.jsxRuntimeExports.jsx(i.Button,{isHiddenBorder:!0,isDisabled:!0,genre:"realebail-white",size:"medium",sxTypography:{default:{weight:700}},children:"Los Angeles"})}),imageSrc:"https://images.pexels.com/photos/1813157/pexels-photo-1813157.jpeg?auto=compress&cs=tinysrgb&dpr=2&w=500"}];exports.IMAGES=f,exports.ImageSlider=n=>{var p,m,f,j;const{onIndexChange:b}=n,I=r.useMemo(()=>n.images,[n.images]),y=r.useMemo(()=>d.KEY_SIZE_DATA[n.size],[n.size]),E=r.useMemo(()=>`${y.radius}px`,[y.radius]),{isLengthZero:w,direction:R,activeImageId:k,isLengthOne:S,dragEndHandler:z,activeImageIndex:A,swipeToImage:C,skipToImage:T,handleAdd:B}=(i=>{var t;const{onIndexChange:s}=i,n=r.useMemo(()=>d.KEY_SIZE_DATA[i.size],[i.size]),o=r.useMemo(()=>`${n.radius}px`,[n.radius]),a=r.useMemo(()=>i.images,[i.images]),[{activeImageId:u,direction:c},x]=r.useState({activeImageId:(null==(t=null==a?void 0:a[0])?void 0:t.id)??null,direction:0}),p=r.useMemo(()=>1===(null==a?void 0:a.length),[a]),m=r.useMemo(()=>0===(null==a?void 0:a.length),[a]),h=r.useMemo(()=>a.findIndex(e=>e.id===u),[u,a]),v=r.useCallback(e=>{const i=(a.findIndex(e=>e.id===u)+e+a.length)%a.length;x({activeImageId:a[i].id,direction:e})},[u,a]),f=r.useCallback(e=>{const{offset:i,velocity:t}=e,s=Math.abs(i.x)*t.x;s>500||i.x>50?v(-1):(s<-500||i.x<-50)&&v(1)},[v]),j=r.useCallback(e=>{const i=a.findIndex(e=>e.id===u),t=a.findIndex(i=>i.id===e);-1!==t&&t!==i&&x({activeImageId:e,direction:t>i?1:-1})},[u,a]);r.useEffect(()=>{u&&(null==s||s(u))},[u,s]);const{add:b}=l.useDialog({br:o,dragEndHandler:f,images:a,children:i.children,activeImageIndex:h,activeImageId:u,swipeToImage:v,skipToImage:j,direction:c,aspect:i.imageSettings.aspect,genre:i.genre,size:i.size,failedToLoad:i.locales.failedToLoad,isLengthOne:p,propsDialog:{borderRadius:o,padding:"0",background:"whiteStandard"}}),I=r.useCallback(()=>{b({content:(i,t)=>e.jsxRuntimeExports.jsx(g,{params:i,remove:t})})},[b]);return{isLengthZero:m,direction:c,activeImageId:u,isLengthOne:p,dragEndHandler:f,activeImageIndex:h,swipeToImage:v,skipToImage:j,handleAdd:I}})({genre:n.genre,size:n.size,images:I,imageSettings:n.imageSettings,locales:n.locales,onIndexChange:b,children:n.children});return e.jsxRuntimeExports.jsx(o.StackMotion,{...n.propsStack,sx:e=>{var i,t,s,o,a,l,d,r,u;return{...null==(i=n.propsStack)?void 0:i.sx,default:{borderRadius:E,flexDirection:"column",alignItems:"center",overflow:"hidden",width:"auto",maxWidth:"70dvw",height:"85dvh",...(null==(t=n.propsStack)?void 0:t.sx)?"function"==typeof(null==(s=n.propsStack)?void 0:s.sx)?null==(o=n.propsStack)?void 0:o.sx(e).default:null==(a=n.propsStack)?void 0:a.sx.default:{}},tablet:{maxWidth:"95dvw",...(null==(l=n.propsStack)?void 0:l.sx)?"function"==typeof(null==(d=n.propsStack)?void 0:d.sx)?null==(r=n.propsStack)?void 0:r.sx(e).tablet:null==(u=n.propsStack)?void 0:u.sx.tablet:{}}}},children:n.isLoading?e.jsxRuntimeExports.jsx(o.Stack,{sx:{default:{width:"100%",height:"100%",position:"relative",overflow:"hidden",display:"flex",alignItems:"center",justifyContent:"center"}},children:e.jsxRuntimeExports.jsx(u.Icon,{size:"large",type:"loading",color:"blueFocus",name:"Line"})}):w?e.jsxRuntimeExports.jsx(o.Stack,{sx:{default:{width:"100%",height:"100%",position:"relative",overflow:"hidden",display:"flex",alignItems:"center",justifyContent:"center"}},children:e.jsxRuntimeExports.jsx(a.Typography,{sx:{default:{variant:"h6"}},children:n.locales.noImagesAvailable})}):e.jsxRuntimeExports.jsxs(o.Stack,{sx:{default:{width:"100%",height:"100%",position:"relative",overflow:"hidden"}},children:[e.jsxRuntimeExports.jsx(s.AnimatePresence,{initial:!1,custom:R,children:e.jsxRuntimeExports.jsxs(c,{style:{overflow:"hidden",borderRadius:E},custom:R,variants:h,initial:"initial",animate:"active",exit:"exit",transition:v,...S?{}:{drag:"x",dragConstraints:{left:0,right:0},dragElastic:.5,onDragEnd:(e,i)=>z(i)},children:[e.jsxRuntimeExports.jsx(t.Image,{sxStack:e=>({default:{width:"100%",height:"100%",alignItems:"center",justifyContent:"center",backgroundColor:e.palette.black10,position:"absolute",pointerEvents:"none"}}),alt:null==(p=I[A])?void 0:p.imageSrc,src:null==(m=I[A])?void 0:m.imageSrc,componentFallback:e.jsxRuntimeExports.jsx(a.Typography,{sx:{default:{variant:"h6"}},children:n.locales.failedToLoad})}),null==(f=I[A])?void 0:f.children]},k)}),"function"==typeof(null==n?void 0:n.children)?null==(j=null==n?void 0:n.children)?void 0:j.call(n,{isDialog:!1}):null==n?void 0:n.children,!S&&e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx(i.Button,{sx:{default:{position:"absolute",top:"50%",left:5,transform:"translateY(-50%)"}},genre:n.genre,size:n.size,icons:[{type:"id",name:"Arrow4",turn:90}],isWidthAsHeight:!0,isHiddenBorder:!0,isRadius:!0,onClick:()=>C(-1)}),e.jsxRuntimeExports.jsx(i.Button,{sx:{default:{position:"absolute",top:"50%",right:5,transform:"translateY(-50%)"}},genre:n.genre,size:n.size,icons:[{type:"id",name:"Arrow4",turn:-90}],isWidthAsHeight:!0,isHiddenBorder:!0,isRadius:!0,onClick:()=>C(1)}),e.jsxRuntimeExports.jsx(o.Stack,{sx:{default:{position:"absolute",bottom:5,left:"50%",transform:"translateX(-50%)",gap:"4px"}},children:I.map(i=>e.jsxRuntimeExports.jsx(x,{onClick:()=>T(i.id),initial:!1,animate:{scale:k===i.id?1.5:1,opacity:k===i.id?1:.5}},i.id))})]}),e.jsxRuntimeExports.jsx(i.Button,{sx:{default:{position:"absolute",bottom:5,right:5}},genre:n.genre,size:n.size,icons:[{type:"id",name:"Activity"}],isWidthAsHeight:!0,isHiddenBorder:!0,isRadius:!0,onClick:()=>B()})]})})},exports.SliderDot=x,exports.SliderImage=c;
|
|
22
|
-
//# sourceMappingURL=component.constants-Dg6JcWmd.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"component.constants-Dg6JcWmd.cjs","sources":["../src/components/image-slider/component.styles.tsx","../src/hooks/use-image-slider/use.tsx","../src/components/image-slider/component.tsx","../src/components/image-slider/component.constants.tsx"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled from 'styled-components';\n\nexport const SliderImage = styled(motion.div)`\n display: flex;\n position: absolute;\n height: 100%;\n width: 100%;\n touch-action: pan-y;\n &:hover {\n cursor: grab;\n }\n\n &:active {\n cursor: grabbing;\n }\n`;\n\nexport const SliderDot = styled(motion.div)`\n width: 6px;\n height: 6px;\n background-color: ${(props) => props.theme.palette.whiteStandard};\n border-radius: 5px;\n opacity: 0.8;\n cursor: pointer;\n`;\n","import { Button } from '@local/components/button';\nimport { Image } from '@local/components/image';\nimport { ImageSliderProps, SliderDot, SliderImage } from '@local/components/image-slider';\nimport { Stack } from '@local/components/stack';\nimport { Typography } from '@local/components/typography';\nimport { useDialog, useDialogProps } from '@local/contexts/context-dialog';\nimport { KEY_SIZE_DATA } from '@local/theme';\n\nimport { AnimatePresence, PanInfo, Variants } from 'framer-motion';\nimport { FC, useCallback, useEffect, useMemo, useState } from 'react';\n\nimport { useImageSliderProps } from '.';\n\nexport const useImageSlider = (props: useImageSliderProps) => {\n const { onIndexChange } = props;\n\n const size = useMemo(() => KEY_SIZE_DATA[props.size], [props.size]);\n const br = useMemo(() => `${size.radius}px`, [size.radius]);\n\n const images = useMemo(() => props.images, [props.images]);\n\n const [{ activeImageId, direction }, setActiveImage] = useState({\n activeImageId: images?.[0]?.id ?? null,\n direction: 0,\n });\n const isLengthOne = useMemo(() => images?.length === 1, [images]);\n const isLengthZero = useMemo(() => images?.length === 0, [images]);\n\n const activeImageIndex = useMemo(() => images.findIndex((img) => img.id === activeImageId), [activeImageId, images]);\n\n const swipeToImage = useCallback(\n (swipeDirection: number) => {\n const currentIndex = images.findIndex((img) => img.id === activeImageId);\n const nextIndex = (currentIndex + swipeDirection + images.length) % images.length;\n setActiveImage({ activeImageId: images[nextIndex].id, direction: swipeDirection });\n },\n [activeImageId, images],\n );\n const dragEndHandler = useCallback(\n (dragInfo: PanInfo) => {\n const { offset, velocity } = dragInfo;\n const swipeThreshold = 50;\n const swipePower = Math.abs(offset.x) * velocity.x;\n\n if (swipePower > 500 || offset.x > swipeThreshold) {\n swipeToImage(-1);\n } else if (swipePower < -500 || offset.x < -swipeThreshold) {\n swipeToImage(1);\n }\n },\n [swipeToImage],\n );\n const skipToImage = useCallback(\n (imageId: number) => {\n const currentIndex = images.findIndex((img) => img.id === activeImageId);\n const newIndex = images.findIndex((img) => img.id === imageId);\n if (newIndex === -1 || newIndex === currentIndex) return;\n\n const direction = newIndex > currentIndex ? 1 : -1;\n setActiveImage({ activeImageId: imageId, direction });\n },\n [activeImageId, images],\n );\n\n useEffect(() => {\n if (activeImageId) onIndexChange?.(activeImageId);\n }, [activeImageId, onIndexChange]);\n\n const { add } = useDialog<ComponentHandleAddProps>({\n br: br,\n dragEndHandler: dragEndHandler,\n images: images,\n children: props.children,\n activeImageIndex: activeImageIndex,\n activeImageId: activeImageId,\n swipeToImage: swipeToImage,\n skipToImage: skipToImage,\n direction: direction,\n aspect: props.imageSettings.aspect,\n genre: props.genre,\n size: props.size,\n failedToLoad: props.locales.failedToLoad,\n isLengthOne: isLengthOne,\n propsDialog: {\n borderRadius: br,\n padding: '0',\n background: 'whiteStandard',\n },\n });\n const handleAdd = useCallback(() => {\n add({\n content: (params, remove) => <ComponentHandleAdd params={params} remove={remove} />,\n });\n }, [add]);\n\n return {\n isLengthZero,\n direction,\n activeImageId,\n isLengthOne,\n dragEndHandler,\n activeImageIndex,\n swipeToImage,\n skipToImage,\n handleAdd,\n };\n};\nconst sliderVariants: Variants = {\n initial: (direction) => ({\n x: direction > 0 ? '100%' : '-100%',\n scale: 1,\n opacity: 0,\n }),\n active: { x: 0, scale: 1, opacity: 1 },\n exit: (direction) => ({\n x: direction > 0 ? '-100%' : '100%',\n scale: 1,\n opacity: 0.2,\n }),\n};\nconst sliderTransition = {\n duration: 0.3,\n ease: [0.56, 0.03, 0.12, 1.04],\n};\n\ntype ComponentHandleAddProps = {\n br?: string;\n dragEndHandler: (dragInfo: PanInfo) => void;\n images: ImageSliderProps['images'];\n children?: ImageSliderProps['children'];\n activeImageIndex: number;\n activeImageId: number | null;\n swipeToImage: (swipeDirection: number) => void;\n skipToImage: (imageId: number) => void;\n direction: number;\n aspect: number;\n failedToLoad: string;\n isLengthOne: boolean;\n} & Pick<ImageSliderProps, 'genre' | 'size'>;\n\nconst ComponentHandleAdd: FC<{\n params?: useDialogProps<ComponentHandleAddProps>;\n remove?: () => void;\n}> = ({ params, remove }) => {\n return (\n <Stack\n sx={{\n default: {\n position: 'relative',\n overflow: 'hidden',\n aspectRatio: `${params?.aspect! * 2} / 2`,\n width: 'auto',\n maxWidth: '70dvw',\n height: '85dvh',\n borderRadius: params?.br,\n },\n tablet: {\n maxWidth: '95dvw',\n },\n }}\n >\n <AnimatePresence initial={false} custom={params?.direction}>\n <SliderImage\n key={params?.activeImageId}\n style={{\n overflow: 'hidden',\n borderRadius: params?.br,\n }}\n custom={params?.direction}\n variants={sliderVariants}\n initial='initial'\n animate='active'\n exit='exit'\n transition={sliderTransition}\n {...(!params?.isLengthOne\n ? {\n drag: 'x',\n dragConstraints: { left: 0, right: 0 },\n dragElastic: 0.5,\n onDragEnd: (_, dragInfo) => params?.dragEndHandler(dragInfo),\n }\n : {})}\n >\n <Image\n sxStack={(theme) => ({\n default: {\n width: '100%',\n height: '100%',\n alignItems: 'center',\n justifyContent: 'center',\n backgroundColor: theme.palette.black10,\n position: 'absolute',\n pointerEvents: 'none',\n },\n })}\n isShowBeforeImage\n sxImage={{\n default: {\n objectFit: 'contain',\n },\n }}\n alt={(params?.images ?? [])?.[params?.activeImageIndex ?? 0]?.imageSrc}\n src={(params?.images ?? [])?.[params?.activeImageIndex ?? 0]?.imageSrc}\n componentFallback={\n <Typography\n sx={{\n default: {\n variant: 'h6',\n },\n }}\n >\n {params?.failedToLoad}\n </Typography>\n }\n />\n {(params?.images ?? [])?.[params?.activeImageIndex ?? 0]?.children}\n </SliderImage>\n </AnimatePresence>\n {typeof params?.children === 'function' ? params?.children?.({ isDialog: true }) : params?.children}\n\n <Button\n sx={{\n default: {\n position: 'absolute',\n bottom: 15,\n right: 15,\n },\n }}\n genre={params?.genre ?? 'product'}\n size={params?.size ?? 'medium'}\n icons={[\n {\n type: 'id',\n name: 'Arrow4',\n },\n ]}\n isWidthAsHeight\n isHiddenBorder\n isRadius\n onClick={() => remove?.()}\n />\n {!params?.isLengthOne ? (\n <>\n <Stack\n sx={{\n default: {\n position: 'absolute',\n bottom: 15,\n left: 15,\n gap: '8px',\n },\n }}\n >\n <Button\n genre={params?.genre ?? 'product'}\n size={params?.size ?? 'medium'}\n icons={[\n {\n type: 'id',\n name: 'Arrow4',\n turn: 90,\n },\n ]}\n isWidthAsHeight\n isHiddenBorder\n isPlaystationEffect\n isRadius\n onClick={() => params?.swipeToImage?.(-1)}\n />\n <Button\n genre={params?.genre ?? 'product'}\n size={params?.size ?? 'medium'}\n icons={[\n {\n type: 'id',\n name: 'Arrow4',\n turn: -90,\n },\n ]}\n isWidthAsHeight\n isHiddenBorder\n isPlaystationEffect\n isRadius\n onClick={() => params?.swipeToImage?.(1)}\n />\n </Stack>\n <Stack\n sx={{\n default: {\n position: 'absolute',\n bottom: 15,\n left: '50%',\n transform: 'translateX(-50%)',\n gap: '4px',\n },\n }}\n >\n {(params?.images ?? [])?.map((i) => (\n <SliderDot\n onClick={() => params?.skipToImage?.(i.id)}\n key={i.id}\n initial={false}\n animate={{\n scale: params?.activeImageId === i.id ? 1.5 : 1,\n opacity: params?.activeImageId === i.id ? 1 : 0.5,\n }}\n />\n ))}\n </Stack>\n </>\n ) : null}\n </Stack>\n );\n};\n","import { useImageSlider } from '@local/hooks/use-image-slider';\nimport { KEY_SIZE_DATA } from '@local/theme';\n\nimport { AnimatePresence, Variants } from 'framer-motion';\nimport { FC, useMemo } from 'react';\n\nimport { Button } from '../button';\nimport { Icon } from '../icon';\nimport { Image } from '../image';\nimport { Stack, StackMotion } from '../stack';\nimport { Typography } from '../typography';\nimport { ImageSliderProps, SliderDot, SliderImage } from '.';\n\nexport const ImageSlider: FC<ImageSliderProps> = (props) => {\n const { onIndexChange } = props;\n const images = useMemo(() => props.images, [props.images]);\n const size = useMemo(() => KEY_SIZE_DATA[props.size], [props.size]);\n const br = useMemo(() => `${size.radius}px`, [size.radius]);\n\n const {\n isLengthZero,\n direction,\n activeImageId,\n isLengthOne,\n dragEndHandler,\n activeImageIndex,\n swipeToImage,\n skipToImage,\n handleAdd,\n } = useImageSlider({\n genre: props.genre,\n size: props.size,\n images: images,\n imageSettings: props.imageSettings,\n locales: props.locales,\n onIndexChange: onIndexChange,\n children: props.children,\n });\n return (\n <StackMotion\n {...props.propsStack}\n sx={(theme) => ({\n ...props.propsStack?.sx,\n default: {\n borderRadius: br,\n flexDirection: 'column',\n alignItems: 'center',\n overflow: 'hidden',\n width: 'auto',\n maxWidth: '70dvw',\n height: '85dvh',\n ...(props.propsStack?.sx\n ? typeof props.propsStack?.sx === 'function'\n ? props.propsStack?.sx(theme).default\n : props.propsStack?.sx.default\n : {}),\n },\n tablet: {\n maxWidth: '95dvw',\n ...(props.propsStack?.sx\n ? typeof props.propsStack?.sx === 'function'\n ? props.propsStack?.sx(theme).tablet\n : props.propsStack?.sx.tablet\n : {}),\n },\n })}\n >\n {props.isLoading ? (\n <Stack\n sx={{\n default: {\n width: '100%',\n height: '100%',\n position: 'relative',\n overflow: 'hidden',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n },\n }}\n >\n <Icon size='large' type='loading' color='blueFocus' name='Line' />\n </Stack>\n ) : !isLengthZero ? (\n <Stack\n sx={{\n default: {\n width: '100%',\n height: '100%',\n position: 'relative',\n overflow: 'hidden',\n },\n }}\n >\n <AnimatePresence initial={false} custom={direction}>\n <SliderImage\n key={activeImageId}\n style={{\n overflow: 'hidden',\n borderRadius: br,\n }}\n custom={direction}\n variants={sliderVariants}\n initial='initial'\n animate='active'\n exit='exit'\n transition={sliderTransition}\n {...(!isLengthOne\n ? {\n drag: 'x',\n dragConstraints: { left: 0, right: 0 },\n dragElastic: 0.5,\n onDragEnd: (_, dragInfo) => dragEndHandler(dragInfo),\n }\n : {})}\n >\n <Image\n sxStack={(theme) => ({\n default: {\n width: '100%',\n height: '100%',\n alignItems: 'center',\n justifyContent: 'center',\n backgroundColor: theme.palette.black10,\n position: 'absolute',\n pointerEvents: 'none',\n },\n })}\n alt={images[activeImageIndex]?.imageSrc}\n src={images[activeImageIndex]?.imageSrc}\n componentFallback={\n <Typography\n sx={{\n default: {\n variant: 'h6',\n },\n }}\n >\n {props.locales.failedToLoad}\n </Typography>\n }\n />\n {images[activeImageIndex]?.children}\n </SliderImage>\n </AnimatePresence>\n {typeof props?.children === 'function' ? props?.children?.({ isDialog: false }) : props?.children}\n\n {!isLengthOne && (\n <>\n <Button\n sx={{\n default: {\n position: 'absolute',\n top: '50%',\n left: 5,\n transform: 'translateY(-50%)',\n },\n }}\n genre={props.genre}\n size={props.size}\n icons={[\n {\n type: 'id',\n name: 'Arrow4',\n turn: 90,\n },\n ]}\n isWidthAsHeight\n isHiddenBorder\n isRadius\n onClick={() => swipeToImage(-1)}\n />\n <Button\n sx={{\n default: {\n position: 'absolute',\n top: '50%',\n right: 5,\n transform: 'translateY(-50%)',\n },\n }}\n genre={props.genre}\n size={props.size}\n icons={[\n {\n type: 'id',\n name: 'Arrow4',\n turn: -90,\n },\n ]}\n isWidthAsHeight\n isHiddenBorder\n isRadius\n onClick={() => swipeToImage(1)}\n />\n <Stack\n sx={{\n default: {\n position: 'absolute',\n bottom: 5,\n left: '50%',\n transform: 'translateX(-50%)',\n gap: '4px',\n },\n }}\n >\n {images.map((i) => (\n <SliderDot\n onClick={() => skipToImage(i.id)}\n key={i.id}\n initial={false}\n animate={{\n scale: activeImageId === i.id ? 1.5 : 1,\n opacity: activeImageId === i.id ? 1 : 0.5,\n }}\n />\n ))}\n </Stack>\n </>\n )}\n\n <Button\n sx={{\n default: {\n position: 'absolute',\n bottom: 5,\n right: 5,\n },\n }}\n genre={props.genre}\n size={props.size}\n icons={[\n {\n type: 'id',\n name: 'Activity',\n },\n ]}\n isWidthAsHeight\n isHiddenBorder\n isRadius\n onClick={() => handleAdd()}\n />\n </Stack>\n ) : (\n <Stack\n sx={{\n default: {\n width: '100%',\n height: '100%',\n position: 'relative',\n overflow: 'hidden',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n },\n }}\n >\n <Typography\n sx={{\n default: {\n variant: 'h6',\n },\n }}\n >\n {props.locales.noImagesAvailable}\n </Typography>\n </Stack>\n )}\n </StackMotion>\n );\n};\nconst sliderVariants: Variants = {\n initial: (direction) => ({\n x: direction > 0 ? '100%' : '-100%',\n scale: 1,\n opacity: 0,\n }),\n active: { x: 0, scale: 1, opacity: 1 },\n exit: (direction) => ({\n x: direction > 0 ? '-100%' : '100%',\n scale: 1,\n opacity: 0.2,\n }),\n};\nconst sliderTransition = {\n duration: 0.3,\n ease: [0.56, 0.03, 0.12, 1.04],\n};\n","import 'styled-components';\n\nimport { ImageSliderProps } from '.';\nimport { Button } from '../button';\nimport { Stack } from '../stack';\n\nexport const IMAGES: ImageSliderProps['images'] = [\n {\n id: 0,\n children: (\n <Stack\n sx={{\n default: {\n justifyContent: 'flex-start',\n padding: '5px',\n flexGrow: 1,\n },\n }}\n >\n <Button\n isHiddenBorder\n isDisabled\n genre='realebail-white'\n size='medium'\n sxTypography={{ default: { weight: 700 } }}\n >\n Los Angeles\n </Button>\n </Stack>\n ),\n imageSrc:\n 'https://drupal-prod.visitcalifornia.com/sites/default/files/styles/fluid_1920/public/2020-06/VC_PlacesToVisit_LosAngelesCounty_RF_1170794243.jpg.webp?itok=46pJYz8v',\n },\n {\n id: 1,\n children: (\n <Stack\n sx={{\n default: {\n justifyContent: 'flex-start',\n padding: '5px',\n flexGrow: 1,\n },\n }}\n >\n <Button\n isHiddenBorder\n isDisabled\n genre='realebail-white'\n size='medium'\n sxTypography={{ default: { weight: 700 } }}\n >\n Los Angeles\n </Button>\n </Stack>\n ),\n imageSrc:\n 'https://images.unsplash.com/flagged/photo-1575555201693-7cd442b8023f?fm=jpg&q=60&w=3000&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8bG9zJTIwYW5nZWxlc3xlbnwwfHwwfHx8MA%3D%3D',\n },\n {\n id: 2,\n children: (\n <Stack\n sx={{\n default: {\n justifyContent: 'flex-start',\n padding: '5px',\n flexGrow: 1,\n },\n }}\n >\n <Button\n isHiddenBorder\n isDisabled\n genre='realebail-white'\n size='medium'\n sxTypography={{ default: { weight: 700 } }}\n >\n Los Angeles\n </Button>\n </Stack>\n ),\n imageSrc:\n 'https://img.goodfon.com/original/2048x1319/8/29/ssha-kaliforniia-los-andzheles-los-angeles-doma-neboskreby-s.jpg',\n },\n {\n id: 3,\n children: (\n <Stack\n sx={{\n default: {\n justifyContent: 'flex-start',\n padding: '5px',\n flexGrow: 1,\n },\n }}\n >\n <Button\n isHiddenBorder\n isDisabled\n genre='realebail-white'\n size='medium'\n sxTypography={{ default: { weight: 700 } }}\n >\n Los Angeles\n </Button>\n </Stack>\n ),\n imageSrc:\n 'https://images.pexels.com/photos/2231756/pexels-photo-2231756.jpeg?auto=compress&cs=tinysrgb&dpr=2&w=500',\n },\n {\n id: 4,\n children: (\n <Stack\n sx={{\n default: {\n justifyContent: 'flex-start',\n padding: '5px',\n flexGrow: 1,\n },\n }}\n >\n <Button\n isHiddenBorder\n isDisabled\n genre='realebail-white'\n size='medium'\n sxTypography={{ default: { weight: 700 } }}\n >\n Los Angeles\n </Button>\n </Stack>\n ),\n imageSrc:\n 'https://images.pexels.com/photos/1813157/pexels-photo-1813157.jpeg?auto=compress&cs=tinysrgb&dpr=2&w=500',\n },\n];\n"],"names":["SliderImage","styled","motion","div","SliderDot","props","theme","palette","whiteStandard","sliderVariants","initial","direction","x","scale","opacity","active","exit","sliderTransition","duration","ease","ComponentHandleAdd","params","remove","jsxs","Stack","sx","default","position","overflow","aspectRatio","aspect","width","maxWidth","height","borderRadius","br","tablet","children","jsx","AnimatePresence","custom","style","variants","animate","transition","isLengthOne","drag","dragConstraints","left","right","dragElastic","onDragEnd","_","dragInfo","dragEndHandler","Image","sxStack","alignItems","justifyContent","backgroundColor","black10","pointerEvents","isShowBeforeImage","sxImage","objectFit","alt","_b","images","_a","activeImageIndex","imageSrc","src","_d","_c","componentFallback","Typography","variant","failedToLoad","_f","_e","activeImageId","_g","call","isDialog","Button","bottom","genre","size","icons","type","name","isWidthAsHeight","isHiddenBorder","isRadius","onClick","Fragment","gap","turn","isPlaystationEffect","swipeToImage","transform","map","i","skipToImage","id","IMAGES","padding","flexGrow","isDisabled","sxTypography","weight","onIndexChange","useMemo","KEY_SIZE_DATA","radius","isLengthZero","handleAdd","setActiveImage","useState","length","findIndex","img","useCallback","swipeDirection","nextIndex","offset","velocity","swipePower","Math","abs","imageId","currentIndex","newIndex","useEffect","add","useDialog","imageSettings","locales","propsDialog","background","content","useImageSlider","StackMotion","propsStack","flexDirection","_h","_i","isLoading","display","Icon","color","noImagesAvailable","top"],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"component.styles-0apMzB81.js","sources":["../src/components/checkbox/component.tsx","../src/components/checkbox/component.styles.ts"],"sourcesContent":["import { ErrorMessage } from '@local/styles/error';\nimport { KEY_SIZE_DATA } from '@local/theme';\n\nimport { FC, useCallback, useMemo } from 'react';\nimport { useTheme } from 'styled-components';\n\nimport { Icon } from '../icon';\nimport { Ripple } from '../ripple';\nimport { CheckboxProps, CheckboxWrapper } from '.';\n\nexport const Checkbox: FC<CheckboxProps> = (props) => {\n const handleOnClick = useCallback(\n (checked: boolean) => {\n props.onChange?.(checked);\n },\n [props.onChange],\n );\n const theme = useTheme();\n const children = useMemo(\n () => (\n <>\n <Icon\n {...(props.checked ? props.view.true : props.view.false)}\n size={(props.checked ? props.view.true : props.view.false).size ?? props.size}\n />\n {props.children && props.children}\n </>\n ),\n [props.checked, props.children, props.size, props.view],\n );\n const LoadingComponent = <Icon size={props.size} type='loading' name='Line' />;\n\n return (\n <>\n <CheckboxWrapper\n type='button'\n $genre={props.genre}\n $error={props.error}\n $view={props.view}\n $font={{\n size: props.font?.size ?? KEY_SIZE_DATA[props.size].font,\n weight: props.font?.weight ?? 700,\n family: props.font?.family ?? theme.font.family,\n height: props.font?.height,\n }}\n $checked={props.checked}\n $isWidthAsHeight={props.isWidthAsHeight}\n $size={props.size}\n $isDisabled={props.isDisabled}\n $isHiddenBorder={props.isHiddenBorder}\n $isNotBackground={props.isNotBackground}\n $sx={props.sx}\n $sxTypography={props.sxTypography}\n $isDisabledOutline={props.isDisabled ?? props.isDisabledOutline}\n $isOutlineBoxShadow={props.isOutlineBoxShadow}\n $isReadOnly={props.isReadOnly}\n disabled={props.isDisabled}\n tabIndex={0}\n onClick={() => !props.isDisabled && handleOnClick(!props.checked)}\n >\n <Ripple color={theme.colors.checkbox[props.genre].color.rest} isDisabled={props.isDisabled} />\n {props.isOnlyLoading ? (\n props.isLoading ? (\n LoadingComponent\n ) : (\n children\n )\n ) : (\n <>\n {children}\n {props.isLoading && LoadingComponent}\n </>\n )}\n </CheckboxWrapper>\n {props?.error ? (\n <ErrorMessage\n {...props.error}\n size={props?.error.size ?? props.size}\n font={{\n size: 12,\n weight: 400,\n family: props.font?.family ?? theme.font.family,\n }}\n />\n ) : null}\n </>\n );\n};\n","import { addSXTypography } from '@local/components/typography';\nimport { addDisabled, addFont, addOutline, addTransition } from '@local/styles/add';\nimport { addError } from '@local/styles/error';\nimport { addSX } from '@local/styles/sx';\nimport { IThemeSizePropertyDefault, KEY_SIZE_DATA } from '@local/theme';\n\nimport styled, { css } from 'styled-components';\n\nimport { addRippleDefault } from '../ripple';\nimport { StyledCheckboxProps } from '.';\n\n/****************************************** Size *************************************************/\nexport const CheckboxSize = css<StyledCheckboxProps>`\n ${(props) => CheckboxSizeConstructor({ ...KEY_SIZE_DATA[props.$size], isWidthAsHeight: props.$isWidthAsHeight })};\n`;\nexport const CheckboxSizeConstructor = (\n props: IThemeSizePropertyDefault & {\n isWidthAsHeight?: boolean;\n },\n) => css`\n height: ${props.height}px;\n min-height: ${props.height}px;\n border-radius: ${props.radius}px;\n gap: ${props.padding - 2}px;\n padding: ${props.padding - 4}px;\n ${\n props.isWidthAsHeight &&\n css`\n width: ${props.height}px;\n min-width: ${props.height}px;\n padding: 0px;\n `\n };\n`;\n\n/****************************************** Genre *************************************************/\nexport const CheckboxGenre = css<StyledCheckboxProps>`\n ${(props) => css`\n background: ${props.theme.colors.checkbox[props.$genre].background.rest};\n border-color: ${props.theme.colors.checkbox[props.$genre].border.rest};\n color: ${props.theme.colors.checkbox[props.$genre].color.rest};\n &:hover {\n background: ${props.theme.colors.checkbox[props.$genre].background.hover};\n border-color: ${props.theme.colors.checkbox[props.$genre].border.hover};\n color: ${props.theme.colors.checkbox[props.$genre].color.hover};\n }\n `};\n`;\n\n/****************************************** Disabled *************************************************/\nconst addCheckboxDisabled = css<StyledCheckboxProps>`\n ${addDisabled};\n ${(props) =>\n props.$isDisabled\n ? css`\n background: ${props.theme.colors.checkbox[props.$genre].background.rest} !important;\n border-color: ${props.theme.colors.checkbox[props.$genre].border.rest} !important;\n color: ${props.theme.colors.checkbox[props.$genre].color.rest} !important;\n `\n : ''}\n`;\n\n/****************************************** HiddenBorder *************************************************/\nconst CheckboxHiddenBorder = css<StyledCheckboxProps>`\n ${(props) =>\n props.$isHiddenBorder &&\n css`\n border-color: transparent !important;\n `}\n`;\n\n/****************************************** Default *************************************************/\nexport const CheckboxWrapper = styled.button<StyledCheckboxProps>`\n display: flex;\n align-items: center;\n justify-content: flex-start;\n border: 1px solid transparent;\n user-select: none;\n cursor: pointer;\n background-color: ${(props) => props.$isNotBackground && 'transparent'};\n\n ${addRippleDefault};\n ${addTransition};\n ${CheckboxGenre};\n ${CheckboxHiddenBorder};\n ${CheckboxSize};\n ${addCheckboxDisabled}\n ${addOutline};\n ${addFont};\n ${addError};\n ${addSXTypography};\n ${addSX};\n`;\n"],"names":["_a","jsxs","Fragment","jsx"],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"component.styles-AEJ_tw7Y.js","sources":["../src/components/input-otp/component.tsx","../src/components/input-otp/component.styles.ts"],"sourcesContent":["import { ErrorMessage } from '@local/styles/error';\n\nimport { ClipboardEvent, FocusEvent, KeyboardEvent, useCallback, useRef, useState } from 'react';\n\nimport { Input } from '../input';\nimport { InputOTPProps, InputOTPWrapper } from '.';\n\nexport const InputOTP = (props: InputOTPProps) => {\n const [otp, setOtp] = useState<string[]>(new Array(props.length).fill(''));\n const inputsRef = useRef<(HTMLInputElement | null)[]>([]);\n const wrapperRef = useRef<HTMLDivElement | null>(null);\n\n const handlePaste = useCallback(\n (index: number, e: ClipboardEvent<HTMLInputElement>) => {\n e.preventDefault();\n\n const pasteData = e.clipboardData.getData('Text');\n const digits = pasteData.replace(/\\D/g, '').split('');\n\n if (!digits.length) return;\n\n setOtp((prevOtp) => {\n const newOtp = [...prevOtp];\n let currentIndex = index;\n\n for (let i = 0; i < digits.length && currentIndex < newOtp.length; i++) {\n newOtp[currentIndex] = digits[i];\n currentIndex++;\n }\n\n const joined = newOtp.join('');\n\n props.onChange?.(joined);\n\n if (newOtp.every((char) => char !== '')) {\n props.onComplete?.(joined);\n }\n\n setTimeout(() => {\n const firstEmpty = newOtp.findIndex((char) => char === '');\n if (firstEmpty !== -1) {\n inputsRef.current[firstEmpty]?.focus();\n } else if (currentIndex < newOtp.length) {\n inputsRef.current[currentIndex]?.focus();\n }\n }, 0);\n\n return newOtp;\n });\n },\n [props],\n );\n\n const handleChange = useCallback(\n (index: number, value: string) => {\n if (!/^\\d*$/.test(value)) return;\n\n setOtp((prevOtp) => {\n const newOtp = [...prevOtp];\n newOtp[index] = value.slice(-1);\n\n if (props.onChange) {\n props.onChange(newOtp.join(''));\n }\n\n if (newOtp.every((char) => char !== '')) {\n props.onComplete?.(newOtp.join(''));\n }\n\n if (value && index < prevOtp.length - 1) {\n setTimeout(() => {\n inputsRef.current[index + 1]?.focus();\n }, 0);\n }\n\n return newOtp;\n });\n },\n [props],\n );\n\n const handleKeyDown = (index: number, e: KeyboardEvent<HTMLInputElement>) => {\n const input = inputsRef.current[index];\n\n if (!input) return;\n\n if (e.key === 'ArrowRight') {\n const nextIndex = index < otp.length - 1 ? index + 1 : 0;\n const nextInput = inputsRef.current[nextIndex];\n\n if (nextInput) {\n nextInput.focus();\n setTimeout(() => nextInput.setSelectionRange(0, nextInput.value.length), 0);\n }\n }\n\n if (e.key === 'ArrowLeft') {\n const prevIndex = index > 0 ? index - 1 : otp.length - 1;\n const prevInput = inputsRef.current[prevIndex];\n\n if (prevInput) {\n prevInput.focus();\n setTimeout(() => prevInput.setSelectionRange(0, prevInput.value.length), 0);\n }\n }\n\n if (e.key === 'Backspace') {\n if (input.value) {\n setTimeout(() => input.setSelectionRange(0, input.value.length), 0);\n } else if (index > 0) {\n setTimeout(() => {\n const prevInput = inputsRef.current[index - 1];\n if (prevInput) {\n prevInput.focus();\n prevInput.setSelectionRange(0, prevInput.value.length);\n }\n }, 0);\n }\n }\n };\n\n const handleFocusInput = useCallback((e: FocusEvent<HTMLInputElement>) => {\n setTimeout(() => e.target.setSelectionRange(0, e.target.value.length), 0);\n }, []);\n return (\n <>\n <InputOTPWrapper\n $error={props.error}\n $size={props.size}\n id={props.id}\n ref={wrapperRef}\n onBlur={(e) => {\n setTimeout(() => {\n if (wrapperRef.current && !wrapperRef.current.contains(document.activeElement)) {\n props.onBlur?.(e);\n }\n }, 0);\n }}\n onFocus={(e) => {\n setTimeout(() => {\n if (wrapperRef.current?.contains(document.activeElement)) {\n props.onFocus?.(e);\n }\n }, 0);\n }}\n $sx={props.sx}\n >\n {otp.map((digit, index) => (\n <Input\n isWidthAsHeight\n key={index}\n tabIndex={index + 1}\n ref={(el) => {\n inputsRef.current[index] = el;\n }}\n variety='standard'\n type='text'\n inputMode='numeric'\n maxLength={1}\n value={digit}\n onFocus={handleFocusInput}\n onPaste={(e) => handlePaste(index, e)}\n onChange={(value) => handleChange(index, value)}\n onKeyDown={(e) => handleKeyDown(index, e)}\n genre={props.genre}\n size={props.size}\n font={props.font}\n />\n ))}\n </InputOTPWrapper>\n {props?.error ? (\n <ErrorMessage\n {...props.error}\n size={props?.error.size ?? props.size}\n font={{\n size: 12,\n weight: 400,\n family: props.font?.family,\n }}\n />\n ) : null}\n </>\n );\n};\n","import styled, { css } from 'styled-components';\n\nimport { addSX } from '@local/styles/sx';\nimport { IThemeSizePropertyDefault, KEY_SIZE_DATA } from '@local/theme';\n\nimport { InputOTPWrapperProps } from '.';\n\n/****************************************** Size *************************************************/\nexport const InputOTPSize = css<InputOTPWrapperProps>`\n ${(props) => InputOTPSizeConstructor({ ...KEY_SIZE_DATA[props.$size], ...props })};\n`;\nexport const InputOTPSizeConstructor = (props: IThemeSizePropertyDefault & InputOTPWrapperProps) => css`\n gap: ${props.padding - 2}px;\n width: 100%;\n`;\n\nexport const InputOTPWrapper = styled.div<InputOTPWrapperProps>`\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n ${InputOTPSize};\n ${addSX};\n`;\n"],"names":["_a","_b","jsxs","Fragment","jsx"],"mappings":"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"}
|
|
@@ -1,65 +0,0 @@
|
|
|
1
|
-
"use strict";const e=require("./jsx-runtime-BcGej2Kr.cjs"),r=require("./theme.global-D67h5YeA.cjs"),o=require("react"),t=require("./style-Df37KnoJ.cjs"),s=require("./style-D8DUzG0C.cjs"),i=require("framer-motion"),n=require("styled-components"),a=n.css`
|
|
2
|
-
${e=>n.css`
|
|
3
|
-
height: ${r.KEY_SIZE_DATA_TOGGLE[e.$size].height}px;
|
|
4
|
-
width: ${r.KEY_SIZE_DATA_TOGGLE[e.$size].width}px;
|
|
5
|
-
padding: ${r.KEY_SIZE_DATA_TOGGLE[e.$size].padding}px;
|
|
6
|
-
border-radius: 100px;
|
|
7
|
-
`};
|
|
8
|
-
`,l=n.css`
|
|
9
|
-
${e=>n.css`
|
|
10
|
-
height: ${r.KEY_SIZE_DATA_TOGGLE[e.$size].thumb}px;
|
|
11
|
-
width: ${r.KEY_SIZE_DATA_TOGGLE[e.$size].thumb}px;
|
|
12
|
-
border-radius: 100px;
|
|
13
|
-
`}
|
|
14
|
-
`,c=n(i.motion.div)`
|
|
15
|
-
cursor: pointer;
|
|
16
|
-
border: 1px solid transparent;
|
|
17
|
-
|
|
18
|
-
display: flex;
|
|
19
|
-
align-items: center;
|
|
20
|
-
|
|
21
|
-
${a};
|
|
22
|
-
${t.addTransition};
|
|
23
|
-
${t.addOutline};
|
|
24
|
-
${t.addDisabled};
|
|
25
|
-
|
|
26
|
-
${e=>e.$value?n.css`
|
|
27
|
-
background: ${e.theme.colors.toggle[e.$genre].active.rest.track};
|
|
28
|
-
border-color: ${e.theme.colors.toggle[e.$genre].active.rest.border};
|
|
29
|
-
justify-content: flex-start;
|
|
30
|
-
&:hover {
|
|
31
|
-
background: ${e.theme.colors.toggle[e.$genre].active.hover.track};
|
|
32
|
-
border-color: ${e.theme.colors.toggle[e.$genre].active.hover.border};
|
|
33
|
-
}
|
|
34
|
-
`:n.css`
|
|
35
|
-
background: ${e.theme.colors.toggle[e.$genre].unActive.rest.track};
|
|
36
|
-
border-color: ${e.theme.colors.toggle[e.$genre].unActive.rest.border};
|
|
37
|
-
justify-content: flex-start;
|
|
38
|
-
&:hover {
|
|
39
|
-
background: ${e.theme.colors.toggle[e.$genre].unActive.hover.track};
|
|
40
|
-
border-color: ${e.theme.colors.toggle[e.$genre].unActive.hover.border};
|
|
41
|
-
}
|
|
42
|
-
`};
|
|
43
|
-
|
|
44
|
-
${s.addError};
|
|
45
|
-
`,d=n(i.motion.div)`
|
|
46
|
-
${l};
|
|
47
|
-
${t.addTransition};
|
|
48
|
-
|
|
49
|
-
${e=>e.$value?n.css`
|
|
50
|
-
background: ${e.theme.colors.toggle[e.$genre].active.rest.thumb};
|
|
51
|
-
box-shadow: ${e.theme.colors.toggle[e.$genre].active.rest.thumbBoxShadow};
|
|
52
|
-
&:hover {
|
|
53
|
-
background: ${e.theme.colors.toggle[e.$genre].active.hover.thumb};
|
|
54
|
-
box-shadow: ${e.theme.colors.toggle[e.$genre].active.hover.thumbBoxShadow};
|
|
55
|
-
}
|
|
56
|
-
`:n.css`
|
|
57
|
-
background: ${e.theme.colors.toggle[e.$genre].unActive.rest.thumb};
|
|
58
|
-
box-shadow: ${e.theme.colors.toggle[e.$genre].unActive.rest.thumbBoxShadow};
|
|
59
|
-
&:hover {
|
|
60
|
-
background: ${e.theme.colors.toggle[e.$genre].unActive.hover.thumb};
|
|
61
|
-
box-shadow: ${e.theme.colors.toggle[e.$genre].unActive.hover.thumbBoxShadow};
|
|
62
|
-
}
|
|
63
|
-
`}
|
|
64
|
-
`;exports.Toggle=t=>{const s=o.useMemo(()=>({tap:{width:r.KEY_SIZE_DATA_TOGGLE[t.size].thumb+4,translateX:t.value?r.KEY_SIZE_DATA_TOGGLE[t.size].width-r.KEY_SIZE_DATA_TOGGLE[t.size].thumb-3*r.KEY_SIZE_DATA_TOGGLE[t.size].padding-4:0,transition:{duration:.05}},checked:{translateX:r.KEY_SIZE_DATA_TOGGLE[t.size].width-r.KEY_SIZE_DATA_TOGGLE[t.size].thumb-3*r.KEY_SIZE_DATA_TOGGLE[t.size].padding,transition:{ease:"circInOut",duration:.05}},unchecked:{translateX:0,transition:{ease:"circInOut",duration:.05}}}),[t.size,t.value]);return e.jsxRuntimeExports.jsx(c,{$genre:t.genre,$isDisabled:t.isDisabled,$isDisabledOutline:t.isDisabled??t.isDisabledOutline,$isOutlineBoxShadow:t.isOutlineBoxShadow,$isReadOnly:t.isReadOnly,$value:t.value,$size:t.size,$error:t.error,tabIndex:0,onClick:()=>{var e;return null==(e=t.onChange)?void 0:e.call(t,!t.value)},whileTap:"tap",animate:t.value?"checked":"unchecked",onKeyDown:e=>{var r;"Enter"===e.key&&(null==(r=t.onChange)||r.call(t,!t.value))},children:e.jsxRuntimeExports.jsx(d,{variants:s,$genre:t.genre,$isDisabled:t.isDisabled,$value:t.value,$size:t.size,$error:t.error})})},exports.ToggleCenter=d,exports.ToggleWrapper=c;
|
|
65
|
-
//# sourceMappingURL=component.styles-BO8xaSCQ.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"component.styles-BO8xaSCQ.cjs","sources":["../src/components/toggle/component.styles.ts","../src/components/toggle/component.tsx"],"sourcesContent":["import { addDisabled, addOutline, addTransition } from '@local/styles/add';\nimport { addError } from '@local/styles/error';\nimport { KEY_SIZE_DATA_TOGGLE } from '@local/theme';\n\nimport { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\n\nimport { StyledToggleProps } from '.';\n\n/****************************************** Add *************************************************/\nconst addToggleWrapperSize = css<StyledToggleProps>`\n ${(props) => css`\n height: ${KEY_SIZE_DATA_TOGGLE[props.$size].height}px;\n width: ${KEY_SIZE_DATA_TOGGLE[props.$size].width}px;\n padding: ${KEY_SIZE_DATA_TOGGLE[props.$size].padding}px;\n border-radius: 100px;\n `};\n`;\n\nconst addToggleCenterSize = css<StyledToggleProps>`\n ${(props) => css`\n height: ${KEY_SIZE_DATA_TOGGLE[props.$size].thumb}px;\n width: ${KEY_SIZE_DATA_TOGGLE[props.$size].thumb}px;\n border-radius: 100px;\n `}\n`;\n/****************************************** Standard *************************************************/\nexport const ToggleWrapper = styled(motion.div)<StyledToggleProps>`\n cursor: pointer;\n border: 1px solid transparent;\n\n display: flex;\n align-items: center;\n\n ${addToggleWrapperSize};\n ${addTransition};\n ${addOutline};\n ${addDisabled};\n\n ${(props) =>\n props.$value\n ? css`\n background: ${props.theme.colors.toggle[props.$genre].active.rest.track};\n border-color: ${props.theme.colors.toggle[props.$genre].active.rest.border};\n justify-content: flex-start;\n &:hover {\n background: ${props.theme.colors.toggle[props.$genre].active.hover.track};\n border-color: ${props.theme.colors.toggle[props.$genre].active.hover.border};\n }\n `\n : css`\n background: ${props.theme.colors.toggle[props.$genre].unActive.rest.track};\n border-color: ${props.theme.colors.toggle[props.$genre].unActive.rest.border};\n justify-content: flex-start;\n &:hover {\n background: ${props.theme.colors.toggle[props.$genre].unActive.hover.track};\n border-color: ${props.theme.colors.toggle[props.$genre].unActive.hover.border};\n }\n `};\n\n ${addError};\n`;\n\nexport const ToggleCenter = styled(motion.div)<StyledToggleProps>`\n ${addToggleCenterSize};\n ${addTransition};\n\n ${(props) =>\n props.$value\n ? css`\n background: ${props.theme.colors.toggle[props.$genre].active.rest.thumb};\n box-shadow: ${props.theme.colors.toggle[props.$genre].active.rest.thumbBoxShadow};\n &:hover {\n background: ${props.theme.colors.toggle[props.$genre].active.hover.thumb};\n box-shadow: ${props.theme.colors.toggle[props.$genre].active.hover.thumbBoxShadow};\n }\n `\n : css`\n background: ${props.theme.colors.toggle[props.$genre].unActive.rest.thumb};\n box-shadow: ${props.theme.colors.toggle[props.$genre].unActive.rest.thumbBoxShadow};\n &:hover {\n background: ${props.theme.colors.toggle[props.$genre].unActive.hover.thumb};\n box-shadow: ${props.theme.colors.toggle[props.$genre].unActive.hover.thumbBoxShadow};\n }\n `}\n`;\n","import { KEY_SIZE_DATA_TOGGLE } from '@local/theme';\n\nimport { useMemo } from 'react';\n\nimport { ToggleCenter, ToggleProps, ToggleWrapper } from '.';\n\nexport const Toggle = (props: ToggleProps) => {\n const toggleVariants = useMemo(\n () => ({\n tap: {\n width: KEY_SIZE_DATA_TOGGLE[props.size].thumb + 4,\n translateX: props.value\n ? KEY_SIZE_DATA_TOGGLE[props.size].width -\n KEY_SIZE_DATA_TOGGLE[props.size].thumb -\n KEY_SIZE_DATA_TOGGLE[props.size].padding * 3 -\n 4\n : 0,\n transition: {\n duration: 0.05,\n },\n },\n checked: {\n translateX:\n KEY_SIZE_DATA_TOGGLE[props.size].width -\n KEY_SIZE_DATA_TOGGLE[props.size].thumb -\n KEY_SIZE_DATA_TOGGLE[props.size].padding * 3,\n transition: { ease: 'circInOut', duration: 0.05 },\n },\n unchecked: {\n translateX: 0,\n transition: { ease: 'circInOut', duration: 0.05 },\n },\n }),\n [props.size, props.value],\n );\n\n return (\n <ToggleWrapper\n $genre={props.genre}\n $isDisabled={props.isDisabled}\n $isDisabledOutline={props.isDisabled ?? props.isDisabledOutline}\n $isOutlineBoxShadow={props.isOutlineBoxShadow}\n $isReadOnly={props.isReadOnly}\n $value={props.value}\n $size={props.size}\n $error={props.error}\n tabIndex={0}\n onClick={() => props.onChange?.(!props.value)}\n whileTap='tap'\n animate={props.value ? 'checked' : 'unchecked'}\n onKeyDown={(e) => {\n if (e.key === 'Enter') props.onChange?.(!props.value);\n }}\n >\n <ToggleCenter\n variants={toggleVariants}\n $genre={props.genre}\n $isDisabled={props.isDisabled}\n $value={props.value}\n $size={props.size}\n $error={props.error}\n />\n </ToggleWrapper>\n );\n};\n"],"names":["addToggleWrapperSize","css","props","KEY_SIZE_DATA_TOGGLE","$size","height","width","padding","addToggleCenterSize","thumb","ToggleWrapper","styled","motion","div","addTransition","addOutline","addDisabled","$value","theme","colors","toggle","$genre","active","rest","track","border","hover","unActive","addError","ToggleCenter","thumbBoxShadow","toggleVariants","useMemo","tap","size","translateX","value","transition","duration","checked","ease","unchecked","jsx","genre","$isDisabled","isDisabled","$isDisabledOutline","isDisabledOutline","$isOutlineBoxShadow","isOutlineBoxShadow","$isReadOnly","isReadOnly","$error","error","tabIndex","onClick","_a","onChange","call","whileTap","animate","onKeyDown","e","key","children","variants"],"mappings":"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"}
|
|
@@ -1,57 +0,0 @@
|
|
|
1
|
-
"use strict";const e=require("./jsx-runtime-BcGej2Kr.cjs"),r=require("./style-D8DUzG0C.cjs"),s=require("./theme.global-D67h5YeA.cjs"),o=require("react"),i=require("styled-components"),t=require("./component.styles-BviHtzJH.cjs"),n=require("./component.styles-Dpg-__rn.cjs"),c=require("./component-6hRanOkU.cjs"),d=require("./component-BxetIWe6.cjs"),l=require("./style-Df37KnoJ.cjs"),a=require("./style-fRZ6xrVp.cjs"),h=i.css`
|
|
2
|
-
${e=>x({...s.KEY_SIZE_DATA[e.$size],isWidthAsHeight:e.$isWidthAsHeight})};
|
|
3
|
-
`,x=e=>i.css`
|
|
4
|
-
height: ${e.height}px;
|
|
5
|
-
min-height: ${e.height}px;
|
|
6
|
-
border-radius: ${e.radius}px;
|
|
7
|
-
gap: ${e.padding-2}px;
|
|
8
|
-
padding: ${e.padding-4}px;
|
|
9
|
-
${e.isWidthAsHeight&&i.css`
|
|
10
|
-
width: ${e.height}px;
|
|
11
|
-
min-width: ${e.height}px;
|
|
12
|
-
padding: 0px;
|
|
13
|
-
`};
|
|
14
|
-
`,u=i.css`
|
|
15
|
-
${e=>i.css`
|
|
16
|
-
background: ${e.theme.colors.checkbox[e.$genre].background.rest};
|
|
17
|
-
border-color: ${e.theme.colors.checkbox[e.$genre].border.rest};
|
|
18
|
-
color: ${e.theme.colors.checkbox[e.$genre].color.rest};
|
|
19
|
-
&:hover {
|
|
20
|
-
background: ${e.theme.colors.checkbox[e.$genre].background.hover};
|
|
21
|
-
border-color: ${e.theme.colors.checkbox[e.$genre].border.hover};
|
|
22
|
-
color: ${e.theme.colors.checkbox[e.$genre].color.hover};
|
|
23
|
-
}
|
|
24
|
-
`};
|
|
25
|
-
`,$=i.css`
|
|
26
|
-
${l.addDisabled};
|
|
27
|
-
${e=>e.$isDisabled?i.css`
|
|
28
|
-
background: ${e.theme.colors.checkbox[e.$genre].background.rest} !important;
|
|
29
|
-
border-color: ${e.theme.colors.checkbox[e.$genre].border.rest} !important;
|
|
30
|
-
color: ${e.theme.colors.checkbox[e.$genre].color.rest} !important;
|
|
31
|
-
`:""}
|
|
32
|
-
`,p=i.css`
|
|
33
|
-
${e=>e.$isHiddenBorder&&i.css`
|
|
34
|
-
border-color: transparent !important;
|
|
35
|
-
`}
|
|
36
|
-
`,g=i.button`
|
|
37
|
-
display: flex;
|
|
38
|
-
align-items: center;
|
|
39
|
-
justify-content: flex-start;
|
|
40
|
-
border: 1px solid transparent;
|
|
41
|
-
user-select: none;
|
|
42
|
-
cursor: pointer;
|
|
43
|
-
background-color: ${e=>e.$isNotBackground&&"transparent"};
|
|
44
|
-
|
|
45
|
-
${n.addRippleDefault};
|
|
46
|
-
${l.addTransition};
|
|
47
|
-
${u};
|
|
48
|
-
${p};
|
|
49
|
-
${h};
|
|
50
|
-
${$}
|
|
51
|
-
${l.addOutline};
|
|
52
|
-
${l.addFont};
|
|
53
|
-
${r.addError};
|
|
54
|
-
${d.addSXTypography};
|
|
55
|
-
${a.addSX};
|
|
56
|
-
`;exports.Checkbox=n=>{var d,l,a,h,x;const u=o.useCallback(e=>{var r;null==(r=n.onChange)||r.call(n,e)},[n.onChange]),$=i.useTheme(),p=o.useMemo(()=>e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx(t.Icon,{...n.checked?n.view.true:n.view.false,size:(n.checked?n.view.true:n.view.false).size??n.size}),n.children&&n.children]}),[n.checked,n.children,n.size,n.view]),b=e.jsxRuntimeExports.jsx(t.Icon,{size:n.size,type:"loading",name:"Line"});return e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsxs(g,{type:"button",$genre:n.genre,$error:n.error,$view:n.view,$font:{size:(null==(d=n.font)?void 0:d.size)??s.KEY_SIZE_DATA[n.size].font,weight:(null==(l=n.font)?void 0:l.weight)??700,family:(null==(a=n.font)?void 0:a.family)??$.font.family,height:null==(h=n.font)?void 0:h.height},$checked:n.checked,$isWidthAsHeight:n.isWidthAsHeight,$size:n.size,$isDisabled:n.isDisabled,$isHiddenBorder:n.isHiddenBorder,$isNotBackground:n.isNotBackground,$sx:n.sx,$sxTypography:n.sxTypography,$isDisabledOutline:n.isDisabled??n.isDisabledOutline,$isOutlineBoxShadow:n.isOutlineBoxShadow,$isReadOnly:n.isReadOnly,disabled:n.isDisabled,tabIndex:0,onClick:()=>!n.isDisabled&&u(!n.checked),children:[e.jsxRuntimeExports.jsx(c.Ripple,{color:$.colors.checkbox[n.genre].color.rest,isDisabled:n.isDisabled}),n.isOnlyLoading?n.isLoading?b:p:e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[p,n.isLoading&&b]})]}),(null==n?void 0:n.error)?e.jsxRuntimeExports.jsx(r.ErrorMessage,{...n.error,size:(null==n?void 0:n.error.size)??n.size,font:{size:12,weight:400,family:(null==(x=n.font)?void 0:x.family)??$.font.family}}):null]})},exports.CheckboxGenre=u,exports.CheckboxSize=h,exports.CheckboxSizeConstructor=x,exports.CheckboxWrapper=g;
|
|
57
|
-
//# sourceMappingURL=component.styles-BVQQkX5c.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"component.styles-BVQQkX5c.cjs","sources":["../src/components/checkbox/component.styles.ts","../src/components/checkbox/component.tsx"],"sourcesContent":["import { addSXTypography } from '@local/components/typography';\nimport { addDisabled, addFont, addOutline, addTransition } from '@local/styles/add';\nimport { addError } from '@local/styles/error';\nimport { addSX } from '@local/styles/sx';\nimport { IThemeSizePropertyDefault, KEY_SIZE_DATA } from '@local/theme';\n\nimport styled, { css } from 'styled-components';\n\nimport { addRippleDefault } from '../ripple';\nimport { StyledCheckboxProps } from '.';\n\n/****************************************** Size *************************************************/\nexport const CheckboxSize = css<StyledCheckboxProps>`\n ${(props) => CheckboxSizeConstructor({ ...KEY_SIZE_DATA[props.$size], isWidthAsHeight: props.$isWidthAsHeight })};\n`;\nexport const CheckboxSizeConstructor = (\n props: IThemeSizePropertyDefault & {\n isWidthAsHeight?: boolean;\n },\n) => css`\n height: ${props.height}px;\n min-height: ${props.height}px;\n border-radius: ${props.radius}px;\n gap: ${props.padding - 2}px;\n padding: ${props.padding - 4}px;\n ${\n props.isWidthAsHeight &&\n css`\n width: ${props.height}px;\n min-width: ${props.height}px;\n padding: 0px;\n `\n };\n`;\n\n/****************************************** Genre *************************************************/\nexport const CheckboxGenre = css<StyledCheckboxProps>`\n ${(props) => css`\n background: ${props.theme.colors.checkbox[props.$genre].background.rest};\n border-color: ${props.theme.colors.checkbox[props.$genre].border.rest};\n color: ${props.theme.colors.checkbox[props.$genre].color.rest};\n &:hover {\n background: ${props.theme.colors.checkbox[props.$genre].background.hover};\n border-color: ${props.theme.colors.checkbox[props.$genre].border.hover};\n color: ${props.theme.colors.checkbox[props.$genre].color.hover};\n }\n `};\n`;\n\n/****************************************** Disabled *************************************************/\nconst addCheckboxDisabled = css<StyledCheckboxProps>`\n ${addDisabled};\n ${(props) =>\n props.$isDisabled\n ? css`\n background: ${props.theme.colors.checkbox[props.$genre].background.rest} !important;\n border-color: ${props.theme.colors.checkbox[props.$genre].border.rest} !important;\n color: ${props.theme.colors.checkbox[props.$genre].color.rest} !important;\n `\n : ''}\n`;\n\n/****************************************** HiddenBorder *************************************************/\nconst CheckboxHiddenBorder = css<StyledCheckboxProps>`\n ${(props) =>\n props.$isHiddenBorder &&\n css`\n border-color: transparent !important;\n `}\n`;\n\n/****************************************** Default *************************************************/\nexport const CheckboxWrapper = styled.button<StyledCheckboxProps>`\n display: flex;\n align-items: center;\n justify-content: flex-start;\n border: 1px solid transparent;\n user-select: none;\n cursor: pointer;\n background-color: ${(props) => props.$isNotBackground && 'transparent'};\n\n ${addRippleDefault};\n ${addTransition};\n ${CheckboxGenre};\n ${CheckboxHiddenBorder};\n ${CheckboxSize};\n ${addCheckboxDisabled}\n ${addOutline};\n ${addFont};\n ${addError};\n ${addSXTypography};\n ${addSX};\n`;\n","import { ErrorMessage } from '@local/styles/error';\nimport { KEY_SIZE_DATA } from '@local/theme';\n\nimport { FC, useCallback, useMemo } from 'react';\nimport { useTheme } from 'styled-components';\n\nimport { Icon } from '../icon';\nimport { Ripple } from '../ripple';\nimport { CheckboxProps, CheckboxWrapper } from '.';\n\nexport const Checkbox: FC<CheckboxProps> = (props) => {\n const handleOnClick = useCallback(\n (checked: boolean) => {\n props.onChange?.(checked);\n },\n [props.onChange],\n );\n const theme = useTheme();\n const children = useMemo(\n () => (\n <>\n <Icon\n {...(props.checked ? props.view.true : props.view.false)}\n size={(props.checked ? props.view.true : props.view.false).size ?? props.size}\n />\n {props.children && props.children}\n </>\n ),\n [props.checked, props.children, props.size, props.view],\n );\n const LoadingComponent = <Icon size={props.size} type='loading' name='Line' />;\n\n return (\n <>\n <CheckboxWrapper\n type='button'\n $genre={props.genre}\n $error={props.error}\n $view={props.view}\n $font={{\n size: props.font?.size ?? KEY_SIZE_DATA[props.size].font,\n weight: props.font?.weight ?? 700,\n family: props.font?.family ?? theme.font.family,\n height: props.font?.height,\n }}\n $checked={props.checked}\n $isWidthAsHeight={props.isWidthAsHeight}\n $size={props.size}\n $isDisabled={props.isDisabled}\n $isHiddenBorder={props.isHiddenBorder}\n $isNotBackground={props.isNotBackground}\n $sx={props.sx}\n $sxTypography={props.sxTypography}\n $isDisabledOutline={props.isDisabled ?? props.isDisabledOutline}\n $isOutlineBoxShadow={props.isOutlineBoxShadow}\n $isReadOnly={props.isReadOnly}\n disabled={props.isDisabled}\n tabIndex={0}\n onClick={() => !props.isDisabled && handleOnClick(!props.checked)}\n >\n <Ripple color={theme.colors.checkbox[props.genre].color.rest} isDisabled={props.isDisabled} />\n {props.isOnlyLoading ? (\n props.isLoading ? (\n LoadingComponent\n ) : (\n children\n )\n ) : (\n <>\n {children}\n {props.isLoading && LoadingComponent}\n </>\n )}\n </CheckboxWrapper>\n {props?.error ? (\n <ErrorMessage\n {...props.error}\n size={props?.error.size ?? props.size}\n font={{\n size: 12,\n weight: 400,\n family: props.font?.family ?? theme.font.family,\n }}\n />\n ) : null}\n </>\n );\n};\n"],"names":["CheckboxSize","css","props","CheckboxSizeConstructor","KEY_SIZE_DATA","$size","isWidthAsHeight","$isWidthAsHeight","height","radius","padding","CheckboxGenre","theme","colors","checkbox","$genre","background","rest","border","color","hover","addCheckboxDisabled","addDisabled","$isDisabled","CheckboxHiddenBorder","$isHiddenBorder","CheckboxWrapper","styled","button","$isNotBackground","addRippleDefault","addTransition","addOutline","addFont","addError","addSXTypography","addSX","handleOnClick","useCallback","checked","_a","onChange","call","useTheme","children","useMemo","jsxs","Fragment","jsx","Icon","view","true","false","size","LoadingComponent","type","name","genre","$error","error","$view","$font","font","weight","_b","family","_c","_d","$checked","isDisabled","isHiddenBorder","isNotBackground","$sx","sx","$sxTypography","sxTypography","$isDisabledOutline","isDisabledOutline","$isOutlineBoxShadow","isOutlineBoxShadow","$isReadOnly","isReadOnly","disabled","tabIndex","onClick","Ripple","isOnlyLoading","isLoading","ErrorMessage","_e"],"mappings":"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"}
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
"use strict";const e=require("./jsx-runtime-BcGej2Kr.cjs"),t=require("./area-DqLK4RX5.cjs"),r=require("./component-GKvpOWlO.cjs"),s=require("react"),n=require("styled-components"),o=require("./style-Df37KnoJ.cjs"),i=require("./style-fRZ6xrVp.cjs"),a=n.img`
|
|
2
|
-
position: absolute;
|
|
3
|
-
width: 100%;
|
|
4
|
-
height: 100%;
|
|
5
|
-
object-fit: cover;
|
|
6
|
-
opacity: ${e=>e.$isPending?0:1};
|
|
7
|
-
${o.addTransition};
|
|
8
|
-
${i.addSX};
|
|
9
|
-
`;exports.Image=o=>{const[i,c]=s.useState(!0),[l,u]=s.useState(!1);s.useEffect(()=>{if(!o.src)return;const e=new window.Image;return e.onload=()=>{c(!1),u(!1)},e.onerror=()=>{c(!1),u(!0)},e.src=o.src,e.complete&&(e.naturalWidth>0?(c(!1),u(!1)):(c(!1),u(!0))),()=>{e.onload=null,e.onerror=null,c(!0),u(!1)}},[o.src]);const d=n.useTheme(),{default:x,...g}=(null==o?void 0:o.sxStack)?"function"==typeof(null==o?void 0:o.sxStack)?o.sxStack(d):o.sxStack:{};return e.jsxRuntimeExports.jsxs(r.Stack,{sx:{default:{position:"relative",overflow:"hidden",...o.isShowBeforeImage?{"&::before":{width:"100%",height:"100%",content:'""',position:"absolute",inset:0,backgroundImage:`url(${o.src})`,backgroundRepeat:"no-repeat",backgroundSize:"cover",backgroundPosition:"center",filter:"blur(20px)",transform:"scale(1.1)",zIndex:0}}:{},...x},...g},children:[l?null:o.componentLoading||i?e.jsxRuntimeExports.jsx(t.Skeleton,{visible:!0,sx:{default:{width:"100%",height:"100%"}}}):null,!l&&e.jsxRuntimeExports.jsx(a,{loading:"lazy",$isPending:i,src:o.src,alt:o.alt,$sx:o.sxImage}),l&&o.componentFallback||null]})},exports.ImageIMG=a;
|
|
10
|
-
//# sourceMappingURL=component.styles-BYG4iVCR.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"component.styles-BYG4iVCR.cjs","sources":["../src/components/image/component.styles.tsx","../src/components/image/component.tsx"],"sourcesContent":["import { addTransition } from '@local/styles/add';\nimport { addSX } from '@local/styles/sx';\n\nimport styled from 'styled-components';\n\nimport { ImageIMGProps } from '.';\n\nexport const ImageIMG = styled.img<ImageIMGProps>`\n position: absolute;\n width: 100%;\n height: 100%;\n object-fit: cover;\n opacity: ${(props) => (props.$isPending ? 0 : 1)};\n ${addTransition};\n ${addSX};\n`;\n","import { Skeleton } from '@local/areas/skeleton';\nimport { Stack } from '@local/components/stack';\n\nimport { FC, useEffect, useState } from 'react';\nimport { useTheme } from 'styled-components';\n\nimport { ImageIMG, ImageProps } from '.';\n\nexport const Image: FC<ImageProps> = (props) => {\n const [isPending, setIsPending] = useState(true);\n const [isError, setIsError] = useState(false);\n\n useEffect(() => {\n if (!props.src) return;\n\n const img = new (window.Image as { new (width?: number, height?: number): HTMLImageElement })();\n\n img.onload = () => {\n setIsPending(false);\n setIsError(false);\n };\n\n img.onerror = () => {\n setIsPending(false);\n setIsError(true);\n };\n\n img.src = props.src;\n\n if (img.complete) {\n if (img.naturalWidth > 0) {\n setIsPending(false);\n setIsError(false);\n } else {\n setIsPending(false);\n setIsError(true);\n }\n }\n\n return () => {\n img.onload = null;\n img.onerror = null;\n setIsPending(true);\n setIsError(false);\n };\n }, [props.src]);\n const theme = useTheme();\n const { default: defaultSx, ...rest } = props?.sxStack\n ? typeof props?.sxStack === 'function'\n ? props.sxStack(theme)\n : props.sxStack\n : {};\n\n return (\n <Stack\n sx={{\n default: {\n position: 'relative',\n overflow: 'hidden',\n ...(props.isShowBeforeImage\n ? {\n '&::before': {\n width: '100%',\n height: '100%',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n backgroundImage: `url(${props.src})`,\n backgroundRepeat: 'no-repeat',\n backgroundSize: 'cover',\n backgroundPosition: 'center',\n filter: 'blur(20px)',\n transform: 'scale(1.1)',\n zIndex: 0,\n },\n }\n : {}),\n ...defaultSx,\n },\n ...rest,\n }}\n >\n {!isError ? (\n props.componentLoading || isPending ? (\n <Skeleton\n visible\n sx={{\n default: {\n width: '100%',\n height: '100%',\n },\n }}\n />\n ) : null\n ) : null}\n {!isError && (\n <ImageIMG loading='lazy' $isPending={isPending} src={props.src} alt={props.alt} $sx={props.sxImage} />\n )}\n {isError ? props.componentFallback || null : null}\n </Stack>\n );\n};\n"],"names":["ImageIMG","styled","img","props","$isPending","addTransition","addSX","isPending","setIsPending","useState","isError","setIsError","useEffect","src","window","Image","onload","onerror","complete","naturalWidth","theme","useTheme","default","defaultSx","rest","sxStack","jsxs","Stack","sx","position","overflow","isShowBeforeImage","width","height","content","inset","backgroundImage","backgroundRepeat","backgroundSize","backgroundPosition","filter","transform","zIndex","children","componentLoading","jsx","Skeleton","visible","loading","alt","$sx","sxImage","componentFallback"],"mappings":"wPAOaA,EAAWC,EAAOC,GAAA;;;;;aAKjBC,GAAWA,EAAMC,WAAa,EAAI;IAC5CC;IACAC;gBCNkCH,IACpC,MAAOI,EAAWC,GAAgBC,EAAAA,UAAS,IACpCC,EAASC,GAAcF,EAAAA,UAAS,GAEvCG,EAAAA,UAAU,KACR,IAAKT,EAAMU,IAAK,OAEhB,MAAMX,EAAM,IAAKY,OAAOC,MAwBxB,OAtBAb,EAAIc,OAAS,KACXR,GAAa,GACbG,GAAW,IAGbT,EAAIe,QAAU,KACZT,GAAa,GACbG,GAAW,IAGbT,EAAIW,IAAMV,EAAMU,IAEZX,EAAIgB,WACFhB,EAAIiB,aAAe,GACrBX,GAAa,GACbG,GAAW,KAEXH,GAAa,GACbG,GAAW,KAIR,KACLT,EAAIc,OAAS,KACbd,EAAIe,QAAU,KACdT,GAAa,GACbG,GAAW,KAEZ,CAACR,EAAMU,MACV,MAAMO,EAAQC,EAAAA,YACNC,QAASC,KAAcC,UAASrB,WAAOsB,SACjB,mBAAnB,MAAAtB,OAAA,EAAAA,EAAOsB,SACZtB,EAAMsB,QAAQL,GACdjB,EAAMsB,QACR,CAAA,EAEJ,SACEC,kBAAAA,KAACC,EAAAA,MAAA,CACCC,GAAI,CACFN,QAAS,CACPO,SAAU,WACVC,SAAU,YACN3B,EAAM4B,kBACN,CACE,YAAa,CACXC,MAAO,OACPC,OAAQ,OACRC,QAAS,KACTL,SAAU,WACVM,MAAO,EACPC,gBAAiB,OAAOjC,EAAMU,OAC9BwB,iBAAkB,YAClBC,eAAgB,QAChBC,mBAAoB,SACpBC,OAAQ,aACRC,UAAW,aACXC,OAAQ,IAGZ,CAAA,KACDnB,MAEFC,GAGJmB,SAAA,CAACjC,EAYE,KAXFP,EAAMyC,kBAAoBrC,IACxBsC,kBAAAA,IAACC,EAAAA,SAAA,CACCC,SAAO,EACPnB,GAAI,CACFN,QAAS,CACPU,MAAO,OACPC,OAAQ,WAIZ,MAEJvB,GACAmC,EAAAA,kBAAAA,IAAC7C,EAAA,CAASgD,QAAQ,OAAO5C,WAAYG,EAAWM,IAAKV,EAAMU,IAAKoC,IAAK9C,EAAM8C,IAAKC,IAAK/C,EAAMgD,UAE5FzC,GAAUP,EAAMiD,mBAA4B"}
|
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
"use strict";const e=require("./jsx-runtime-BcGej2Kr.cjs"),t=require("./consts.cjs.js"),s=require("./use-BLwltPMc.cjs"),i=require("./component-BfppCwz9.cjs"),r=require("./component.styles-BYG4iVCR.cjs"),o=require("./component-GKvpOWlO.cjs"),n=require("styled-components"),a=require("./component-BxetIWe6.cjs"),l=require("./context.constants-BLQ_1jZI.cjs"),d=require("./theme.global-D67h5YeA.cjs"),u=require("react"),c=require("./style-D8DUzG0C.cjs"),g=require("framer-motion"),p=require("./style-fRZ6xrVp.cjs"),m=n.css`
|
|
2
|
-
${e=>n.css`
|
|
3
|
-
background: ${e.theme.colors.imageSelect[e.$genre].background.rest};
|
|
4
|
-
color: ${e.theme.colors.imageSelect[e.$genre].color.rest};
|
|
5
|
-
&:active {
|
|
6
|
-
background: ${e.theme.colors.imageSelect[e.$genre].background.rest};
|
|
7
|
-
color: ${e.theme.colors.imageSelect[e.$genre].color.rest};
|
|
8
|
-
}
|
|
9
|
-
&:focus-visible {
|
|
10
|
-
background: ${e.theme.colors.imageSelect[e.$genre].background.rest};
|
|
11
|
-
color: ${e.theme.colors.imageSelect[e.$genre].color.rest};
|
|
12
|
-
}
|
|
13
|
-
`};
|
|
14
|
-
`,x=n.css`
|
|
15
|
-
${e=>h(d.KEY_SIZE_DATA[e.$size])};
|
|
16
|
-
`,h=e=>n.css`
|
|
17
|
-
padding: ${e.padding}px;
|
|
18
|
-
border-radius: ${e.radius}px;
|
|
19
|
-
`,f=n.css`
|
|
20
|
-
${e=>j(d.KEY_SIZE_DATA[e.$size])};
|
|
21
|
-
`,j=e=>n.css`
|
|
22
|
-
gap: ${e.padding-2}px;
|
|
23
|
-
`,S=n.div`
|
|
24
|
-
display: flex;
|
|
25
|
-
flex-direction: column;
|
|
26
|
-
width: 100%;
|
|
27
|
-
${f};
|
|
28
|
-
${c.addError};
|
|
29
|
-
${p.addSX};
|
|
30
|
-
`,b=n(g.motion.div)`
|
|
31
|
-
border: 2px dashed;
|
|
32
|
-
|
|
33
|
-
display: flex;
|
|
34
|
-
flex-direction: column;
|
|
35
|
-
width: 100%;
|
|
36
|
-
${m}
|
|
37
|
-
${x}
|
|
38
|
-
`;exports.ImageSelect=p=>{const{onChange:m}=p,x=u.useMemo(()=>d.KEY_SIZE_DATA[p.size],[p.size]),[h,f]=u.useState(p.images||[]),[j,v]=u.useState(!1),y=u.useRef(null),$=n.useTheme(),E=u.useCallback(e=>{e&&f(t=>{const s=e.map((e,s)=>({...e,index:t.length+s})),i=[...t,...s];return null==m||m(i),i})},[m]),z=()=>{var e;null==(e=y.current)||e.click()},{handleAddFiles:R}=s.useImageCrop({onSave:E,locale:p.locale,dialog:{button:{genre:p.propsButton.default.genre,size:p.propsButton.default.size},buttonDelete:{genre:p.propsButton.delete.genre,size:p.propsButton.delete.size}},imageSettings:{maxSize:p.imageSettings.maxSize,maxCount:p.imageSettings.maxCount-h.length,aspect:p.imageSettings.aspect},refInput:y}),{handleAdd:k}=(t=>{const s=u.useMemo(()=>d.KEY_SIZE_DATA[t.size],[t.size]),n=u.useMemo(()=>`${s.radius}px`,[s.radius]),{add:c}=l.useDialog({br:n,propsDialog:{borderRadius:n,padding:"0",background:"whiteStandard"}});return{handleAdd:u.useCallback(s=>{c({content:(n,l)=>e.jsxRuntimeExports.jsxs(o.Stack,{sx:{default:{position:"relative",overflow:"hidden",aspectRatio:2*t.imageSettings.aspect+" / 2",width:"auto",maxWidth:"70dvw",height:"85dvh",borderRadius:null==n?void 0:n.br},tablet:{maxWidth:"95dvw"}},children:[e.jsxRuntimeExports.jsx(r.Image,{sxStack:e=>({default:{width:"100%",height:"100%",alignItems:"center",justifyContent:"center",backgroundColor:e.palette.black10,position:"absolute",pointerEvents:"none"}}),isShowBeforeImage:!0,sxImage:{default:{objectFit:"contain"}},alt:null==s?void 0:s.imageSrc,src:null==s?void 0:s.imageSrc,componentFallback:e.jsxRuntimeExports.jsx(a.Typography,{sx:{default:{variant:"h6"}},children:t.locale.imageFallback})}),e.jsxRuntimeExports.jsx(i.Button,{sx:{default:{position:"absolute",bottom:15,right:15}},genre:"realebail-white",size:"small",icons:[{type:"id",name:"Arrow4"}],isWidthAsHeight:!0,isHiddenBorder:!0,isRadius:!0,onClick:()=>null==l?void 0:l()})]})})},[c,t.imageSettings.aspect,t.locale.imageFallback])}})({size:p.size,locale:p.locale,imageSettings:p.imageSettings,genre:p.genre});return u.useEffect(()=>{f(p.images||[])},[p.images]),e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsxs(S,{$genre:p.genre,$size:p.size,id:p.id,$sx:p.sx,$error:p.error,children:[e.jsxRuntimeExports.jsxs(b,{onDrop:e=>{(e=>{var t;e.preventDefault(),(null==(t=e.dataTransfer.files)?void 0:t.length)&&R(e.dataTransfer.files)})(e),v(!1)},onDragOver:e=>e.preventDefault(),onDragEnter:()=>v(!0),onDragLeave:()=>v(!1),animate:{borderColor:j?$.colors.imageSelect[p.genre].border.hover:$.colors.imageSelect[p.genre].border.rest},transition:{duration:.3},$genre:p.genre,$size:p.size,children:[e.jsxRuntimeExports.jsxs(g.motion.div,{transition:{layout:{duration:.3,ease:"easeInOut",type:"spring"}},layout:!0,style:{display:"flex",flexWrap:"wrap",gap:x.padding-2+"px"},children:[h.map(t=>t.url&&e.jsxRuntimeExports.jsxs(g.motion.div,{style:{position:"relative",width:`${p.imageSettings.width}px`,height:`${p.imageSettings.height}px`,userSelect:"none",overflow:"hidden",borderRadius:`${x.radius}px`,flexGrow:1},layout:!0,transition:{layout:{duration:.3,ease:"easeInOut",type:"spring"}},children:[e.jsxRuntimeExports.jsx(r.Image,{sxStack:e=>({default:{width:"100%",height:"100%",alignItems:"center",justifyContent:"center",backgroundColor:e.palette.black10,position:"absolute",pointerEvents:"none"}}),isShowBeforeImage:p.isContain,sxImage:{default:{objectFit:p.isContain?"contain":"cover"}},alt:t.name||"image",src:t.url,componentFallback:e.jsxRuntimeExports.jsx(a.Typography,{sx:{default:{variant:"h6"}},children:p.locale.imageFallback})}),e.jsxRuntimeExports.jsx(i.Button,{sx:{default:{position:"absolute",top:5,right:5}},genre:p.genre,size:"small",icons:[{type:"id",name:"Close"}],isWidthAsHeight:!0,isHiddenBorder:!0,isRadius:!0,onClick:()=>{return e=t.id,void f(t=>{const s=t.filter(t=>t.id!==e);return null==m||m(s),s});var e}}),e.jsxRuntimeExports.jsx(i.Button,{sx:{default:{position:"absolute",bottom:5,right:5}},genre:p.genre,size:"small",icons:[{type:"id",name:"Activity"}],isWidthAsHeight:!0,isHiddenBorder:!0,isRadius:!0,onClick:()=>t.url&&k({id:t.id,imageSrc:t.url})})]},t.id)),0===h.length?e.jsxRuntimeExports.jsx("div",{onClick:z,style:{position:"relative",width:`${p.imageSettings.width}px`,height:`${p.imageSettings.height}px`,userSelect:"none",overflow:"hidden",borderRadius:`${x.radius}px`,flexGrow:1,display:"flex",alignItems:"center",justifyContent:"center",textAlign:"center",cursor:"pointer"},children:e.jsxRuntimeExports.jsx(a.Typography,{style:{color:$.colors.imageSelect[p.genre].color.rest},sx:{default:{}},children:p.locale.dragAndDrop})},"empty"):null]}),e.jsxRuntimeExports.jsx("input",{ref:y,type:"file",accept:t.ImageSupportedFormatsForInput,multiple:!0,style:{display:"none"},onChange:e=>{e.target.files&&R(e.target.files)}})]}),e.jsxRuntimeExports.jsxs(o.Stack,{sx:{default:{flexGrow:1,gap:x.padding-2+"px"}},children:[e.jsxRuntimeExports.jsx(i.Button,{type:"button",genre:p.genre,size:p.size,sx:{default:{flexGrow:3}},isRadius:!0,onClick:z,children:p.locale.buttonAdd}),e.jsxRuntimeExports.jsx(i.Button,{isRadius:!0,type:"button",sx:{default:{flexGrow:1}},onClick:()=>{f(p.defaultImages||[]),null==m||m(p.defaultImages||[])},genre:p.genre,size:p.size,children:p.locale.buttonReset})]})]}),(null==p?void 0:p.error)?e.jsxRuntimeExports.jsx(c.ErrorMessage,{...p.error,size:(null==p?void 0:p.error.size)??p.size,font:{size:12,weight:400,family:$.font.family}}):null]})},exports.ImageSelectListSize=x,exports.ImageSelectListSizeConstructor=h,exports.ImageSelectListWrapper=b,exports.ImageSelectSize=f,exports.ImageSelectSizeConstructor=j,exports.ImageSelectWrapper=S;
|
|
39
|
-
//# sourceMappingURL=component.styles-BZ9QLlOU.cjs.map
|