@banzamel/mineralui 1.5.0 → 1.6.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -1
- package/dist/{MAvatar-lCDowKeG.js → MAvatar-CnBVN71i.js} +2 -2
- package/dist/{MAvatar-lCDowKeG.js.map → MAvatar-CnBVN71i.js.map} +1 -1
- package/dist/{MAvatar-DMNwEhrd.cjs → MAvatar-DGEQqUss.cjs} +2 -2
- package/dist/{MAvatar-DMNwEhrd.cjs.map → MAvatar-DGEQqUss.cjs.map} +1 -1
- package/dist/{MBadge-CuVY4TXo.js → MBadge-C_vK2JdM.js} +1 -1
- package/dist/{MBadge-CuVY4TXo.js.map → MBadge-C_vK2JdM.js.map} +1 -1
- package/dist/{MBadge-DmIO-oEJ.cjs → MBadge-DcIPfPH1.cjs} +1 -1
- package/dist/{MBadge-DmIO-oEJ.cjs.map → MBadge-DcIPfPH1.cjs.map} +1 -1
- package/dist/{MButton-JumA31vM.js → MButton-BpSZUhpY.js} +1 -1
- package/dist/{MButton-JumA31vM.js.map → MButton-BpSZUhpY.js.map} +1 -1
- package/dist/{MButton-DTblkF4v.cjs → MButton-LUNWBBOV.cjs} +1 -1
- package/dist/{MButton-DTblkF4v.cjs.map → MButton-LUNWBBOV.cjs.map} +1 -1
- package/dist/{MCheckbox-DYrfb_bW.js → MCheckbox-CNz73bQC.js} +1 -1
- package/dist/{MCheckbox-DYrfb_bW.js.map → MCheckbox-CNz73bQC.js.map} +1 -1
- package/dist/{MCheckbox-DbHXmu1a.cjs → MCheckbox-PzknJeM2.cjs} +1 -1
- package/dist/{MCheckbox-DbHXmu1a.cjs.map → MCheckbox-PzknJeM2.cjs.map} +1 -1
- package/dist/{MCookieBootstrap-D1OGFCC7.js → MCookieBootstrap-CNYLvKjW.js} +1 -1
- package/dist/{MCookieBootstrap-D1OGFCC7.js.map → MCookieBootstrap-CNYLvKjW.js.map} +1 -1
- package/dist/{MCookieBootstrap-ByObqs4o.cjs → MCookieBootstrap-DSOT4FQo.cjs} +1 -1
- package/dist/{MCookieBootstrap-ByObqs4o.cjs.map → MCookieBootstrap-DSOT4FQo.cjs.map} +1 -1
- package/dist/{MDataTable-CEGkEf5L.js → MDataTable-AH5Tnirs.js} +6 -6
- package/dist/{MDataTable-CEGkEf5L.js.map → MDataTable-AH5Tnirs.js.map} +1 -1
- package/dist/{MDataTable-BSuwd0gb.cjs → MDataTable-Bq6UoNJX.cjs} +2 -2
- package/dist/{MDataTable-BSuwd0gb.cjs.map → MDataTable-Bq6UoNJX.cjs.map} +1 -1
- package/dist/{MDrawer-BCjiepJO.js → MDrawer-C08QXXC4.js} +4 -4
- package/dist/{MDrawer-BCjiepJO.js.map → MDrawer-C08QXXC4.js.map} +1 -1
- package/dist/{MDrawer-YhA79aS4.cjs → MDrawer-DRqMsjMt.cjs} +2 -2
- package/dist/{MDrawer-YhA79aS4.cjs.map → MDrawer-DRqMsjMt.cjs.map} +1 -1
- package/dist/{MDropdownMenu-CVp1LFgZ.js → MDropdownMenu-CMnBt-wO.js} +2 -2
- package/dist/{MDropdownMenu-CVp1LFgZ.js.map → MDropdownMenu-CMnBt-wO.js.map} +1 -1
- package/dist/{MDropdownMenu-BRL0Vcq_.cjs → MDropdownMenu-CymCQqyP.cjs} +2 -2
- package/dist/{MDropdownMenu-BRL0Vcq_.cjs.map → MDropdownMenu-CymCQqyP.cjs.map} +1 -1
- package/dist/{MHeading-qOPIM4dL.js → MHeading-BvpWyvjj.js} +2 -2
- package/dist/{MHeading-qOPIM4dL.js.map → MHeading-BvpWyvjj.js.map} +1 -1
- package/dist/{MHeading-4vfYPN_i.cjs → MHeading-DHT1gORD.cjs} +2 -2
- package/dist/{MHeading-4vfYPN_i.cjs.map → MHeading-DHT1gORD.cjs.map} +1 -1
- package/dist/MImage-BQs91GK-.js +252 -0
- package/dist/MImage-BQs91GK-.js.map +1 -0
- package/dist/MImage-CxeuH-cT.cjs +2 -0
- package/dist/MImage-CxeuH-cT.cjs.map +1 -0
- package/dist/MInline-D9p9Sazp.cjs +2 -0
- package/dist/MInline-D9p9Sazp.cjs.map +1 -0
- package/dist/MInline-DA_ehefx.js +39 -0
- package/dist/MInline-DA_ehefx.js.map +1 -0
- package/dist/{MInput-DkbdeGQW.cjs → MInput-DDZ71Qqn.cjs} +2 -2
- package/dist/{MInput-DkbdeGQW.cjs.map → MInput-DDZ71Qqn.cjs.map} +1 -1
- package/dist/{MInput-3ynY4aGD.js → MInput-l3MY93Su.js} +3 -3
- package/dist/{MInput-3ynY4aGD.js.map → MInput-l3MY93Su.js.map} +1 -1
- package/dist/{MInputCVC-BO251yU6.js → MInputCVC-CN91scmw.js} +4 -4
- package/dist/{MInputCVC-BO251yU6.js.map → MInputCVC-CN91scmw.js.map} +1 -1
- package/dist/{MInputCVC-NSy1SkiZ.cjs → MInputCVC-Sp2uZ5aO.cjs} +2 -2
- package/dist/{MInputCVC-NSy1SkiZ.cjs.map → MInputCVC-Sp2uZ5aO.cjs.map} +1 -1
- package/dist/{MInputSearch-CQQIKYMt.cjs → MInputSearch-30o4bcDC.cjs} +2 -2
- package/dist/{MInputSearch-CQQIKYMt.cjs.map → MInputSearch-30o4bcDC.cjs.map} +1 -1
- package/dist/{MInputSearch-BT0OqlE_.js → MInputSearch-CdPfJ4v_.js} +3 -3
- package/dist/{MInputSearch-BT0OqlE_.js.map → MInputSearch-CdPfJ4v_.js.map} +1 -1
- package/dist/{MLink-Cytb3UVc.js → MLink-CRUWGES-.js} +1 -1
- package/dist/{MLink-Cytb3UVc.js.map → MLink-CRUWGES-.js.map} +1 -1
- package/dist/{MLink-B6Az9m2B.cjs → MLink-U_wAUuz1.cjs} +1 -1
- package/dist/{MLink-B6Az9m2B.cjs.map → MLink-U_wAUuz1.cjs.map} +1 -1
- package/dist/{MModal-BTOS_Xrs.js → MModal-CHSo5gKE.js} +3 -3
- package/dist/{MModal-BTOS_Xrs.js.map → MModal-CHSo5gKE.js.map} +1 -1
- package/dist/{MModal-BhYBOKUh.cjs → MModal-Czy-rR--.cjs} +2 -2
- package/dist/{MModal-BhYBOKUh.cjs.map → MModal-Czy-rR--.cjs.map} +1 -1
- package/dist/{MPagination-4X0we8Ab.cjs → MPagination-73z0sQvf.cjs} +2 -2
- package/dist/{MPagination-4X0we8Ab.cjs.map → MPagination-73z0sQvf.cjs.map} +1 -1
- package/dist/{MPagination-Bz35UIbt.js → MPagination-DdT1uNzD.js} +7 -7
- package/dist/{MPagination-Bz35UIbt.js.map → MPagination-DdT1uNzD.js.map} +1 -1
- package/dist/{MPopover-DHc3otwX.js → MPopover-3tjz5lKh.js} +2 -2
- package/dist/{MPopover-DHc3otwX.js.map → MPopover-3tjz5lKh.js.map} +1 -1
- package/dist/{MPopover-C03jl1zd.cjs → MPopover-BW23_1Dl.cjs} +2 -2
- package/dist/{MPopover-C03jl1zd.cjs.map → MPopover-BW23_1Dl.cjs.map} +1 -1
- package/dist/{MPortal-xGHZKLX5.cjs → MPortal-DE3pL2Xl.cjs} +1 -1
- package/dist/{MPortal-xGHZKLX5.cjs.map → MPortal-DE3pL2Xl.cjs.map} +1 -1
- package/dist/{MPortal-CHoRxTlE.js → MPortal-Dqlkh3hw.js} +1 -1
- package/dist/{MPortal-CHoRxTlE.js.map → MPortal-Dqlkh3hw.js.map} +1 -1
- package/dist/{MQrCode-blzcp1yz.cjs → MQrCode-CMoru4dD.cjs} +2 -2
- package/dist/{MQrCode-blzcp1yz.cjs.map → MQrCode-CMoru4dD.cjs.map} +1 -1
- package/dist/{MQrCode-Dmgh8fzs.js → MQrCode-DK5-SBhN.js} +11 -11
- package/dist/{MQrCode-Dmgh8fzs.js.map → MQrCode-DK5-SBhN.js.map} +1 -1
- package/dist/{MSkeleton-CQEnuIos.cjs → MSkeleton-B0Mxe3L7.cjs} +2 -2
- package/dist/{MSkeleton-CQEnuIos.cjs.map → MSkeleton-B0Mxe3L7.cjs.map} +1 -1
- package/dist/{MSkeleton-CJIlxsCx.js → MSkeleton-Bqq_XJn8.js} +2 -2
- package/dist/{MSkeleton-CJIlxsCx.js.map → MSkeleton-Bqq_XJn8.js.map} +1 -1
- package/dist/{MSlider-DuTnRaK_.js → MSlider-ByVuoFFc.js} +1 -1
- package/dist/{MSlider-DuTnRaK_.js.map → MSlider-ByVuoFFc.js.map} +1 -1
- package/dist/{MSlider-B4K6bkIs.cjs → MSlider-sH2Vt9Lw.cjs} +1 -1
- package/dist/{MSlider-B4K6bkIs.cjs.map → MSlider-sH2Vt9Lw.cjs.map} +1 -1
- package/dist/{MSparkline-7ycEh2eZ.cjs → MSparkline-B-ld7hJu.cjs} +1 -1
- package/dist/{MSparkline-7ycEh2eZ.cjs.map → MSparkline-B-ld7hJu.cjs.map} +1 -1
- package/dist/{MSparkline-Dz4K9Vx9.js → MSparkline-DbtdM0W6.js} +1 -1
- package/dist/{MSparkline-Dz4K9Vx9.js.map → MSparkline-DbtdM0W6.js.map} +1 -1
- package/dist/MStack-BWarX5O9.js +39 -0
- package/dist/MStack-BWarX5O9.js.map +1 -0
- package/dist/MStack-Cy2GplIA.cjs +2 -0
- package/dist/MStack-Cy2GplIA.cjs.map +1 -0
- package/dist/{MSubText-D-wde4hz.js → MSubText-C9VizSn9.js} +2 -2
- package/dist/{MSubText-D-wde4hz.js.map → MSubText-C9VizSn9.js.map} +1 -1
- package/dist/{MSubText-DjtJHCSy.cjs → MSubText-DP9WYlwz.cjs} +2 -2
- package/dist/{MSubText-DjtJHCSy.cjs.map → MSubText-DP9WYlwz.cjs.map} +1 -1
- package/dist/MSurface-C467dVMQ.cjs +2 -0
- package/dist/MSurface-C467dVMQ.cjs.map +1 -0
- package/dist/MSurface-DfZ1Zy1-.js +39 -0
- package/dist/MSurface-DfZ1Zy1-.js.map +1 -0
- package/dist/{MTag-D_mw488_.cjs → MTag-DXqkBvqx.cjs} +2 -2
- package/dist/{MTag-D_mw488_.cjs.map → MTag-DXqkBvqx.cjs.map} +1 -1
- package/dist/{MTag-CGns3Rk2.js → MTag-N-tYZ915.js} +3 -3
- package/dist/{MTag-CGns3Rk2.js.map → MTag-N-tYZ915.js.map} +1 -1
- package/dist/{MText-C0VxNQCE.js → MText-B7_HjPym.js} +2 -2
- package/dist/{MText-C0VxNQCE.js.map → MText-B7_HjPym.js.map} +1 -1
- package/dist/{MText-rSgurLeq.cjs → MText-COzub3y4.cjs} +2 -2
- package/dist/{MText-rSgurLeq.cjs.map → MText-COzub3y4.cjs.map} +1 -1
- package/dist/{MTimeAgo-ecmmkLeM.js → MTimeAgo-D1G2yovw.js} +2 -2
- package/dist/{MTimeAgo-ecmmkLeM.js.map → MTimeAgo-D1G2yovw.js.map} +1 -1
- package/dist/{MTimeAgo-BesEN_u2.cjs → MTimeAgo-DWwXs48z.cjs} +2 -2
- package/dist/{MTimeAgo-BesEN_u2.cjs.map → MTimeAgo-DWwXs48z.cjs.map} +1 -1
- package/dist/{MToggle-DV0lHLSE.cjs → MToggle-Cm3f6gm4.cjs} +1 -1
- package/dist/{MToggle-DV0lHLSE.cjs.map → MToggle-Cm3f6gm4.cjs.map} +1 -1
- package/dist/{MToggle-DXw8qz0m.js → MToggle-D0DrQirB.js} +1 -1
- package/dist/{MToggle-DXw8qz0m.js.map → MToggle-D0DrQirB.js.map} +1 -1
- package/dist/{MTooltip-Ce1cs9e3.cjs → MTooltip-C3PeHgV3.cjs} +2 -2
- package/dist/{MTooltip-Ce1cs9e3.cjs.map → MTooltip-C3PeHgV3.cjs.map} +1 -1
- package/dist/{MTooltip-BW4hHnEf.js → MTooltip-w6Aj044c.js} +2 -2
- package/dist/{MTooltip-BW4hHnEf.js.map → MTooltip-w6Aj044c.js.map} +1 -1
- package/dist/{cards-DFUONqA1.cjs → cards-B75QM9JW.cjs} +2 -2
- package/dist/{cards-DFUONqA1.cjs.map → cards-B75QM9JW.cjs.map} +1 -1
- package/dist/{cards-D45hG2rJ.js → cards-BKi8MxNx.js} +272 -272
- package/dist/{cards-D45hG2rJ.js.map → cards-BKi8MxNx.js.map} +1 -1
- package/dist/cards.cjs +1 -1
- package/dist/cards.js +2 -2
- package/dist/components/display/MReveal/MReveal.d.ts +2 -0
- package/dist/components/display/MReveal/MReveal.types.d.ts +14 -0
- package/dist/components/display/MReveal/index.d.ts +2 -0
- package/dist/components/display/index.d.ts +2 -0
- package/dist/components/layout/MInline/MInline.d.ts +1 -1
- package/dist/components/layout/MInline/MInline.types.d.ts +0 -2
- package/dist/components/layout/MSection/MSection.d.ts +1 -1
- package/dist/components/layout/MSection/MSection.types.d.ts +0 -2
- package/dist/components/layout/MStack/MStack.d.ts +1 -1
- package/dist/components/layout/MStack/MStack.types.d.ts +0 -2
- package/dist/components/layout/MSurface/MSurface.d.ts +1 -1
- package/dist/components/layout/MSurface/MSurface.types.d.ts +0 -2
- package/dist/components/media/MGallery/MGallery.d.ts +1 -1
- package/dist/components/media/MGallery/MGallery.types.d.ts +3 -0
- package/dist/components/media/MImage/MImage.d.ts +1 -1
- package/dist/components/media/MImage/MImage.types.d.ts +4 -0
- package/dist/components/media/MMediaLightbox/MMediaLightbox.d.ts +14 -0
- package/dist/components/media/index.d.ts +1 -0
- package/dist/components/media/mediaInteraction.d.ts +3 -0
- package/dist/components/media/mediaPreviewRegistry.d.ts +7 -0
- package/dist/{controls-CkndCsX9.cjs → controls-B7wV_kjJ.cjs} +2 -2
- package/dist/{controls-CkndCsX9.cjs.map → controls-B7wV_kjJ.cjs.map} +1 -1
- package/dist/{controls-DY0O5P1b.js → controls-BEi-0mf4.js} +3 -3
- package/dist/{controls-DY0O5P1b.js.map → controls-BEi-0mf4.js.map} +1 -1
- package/dist/controls.cjs +1 -1
- package/dist/controls.js +5 -5
- package/dist/cookie-consent-bootstrap.cjs +1 -1
- package/dist/cookie-consent-bootstrap.js +1 -1
- package/dist/{data-BKhx0T2n.cjs → data-DHkccnSN.cjs} +2 -2
- package/dist/{data-BKhx0T2n.cjs.map → data-DHkccnSN.cjs.map} +1 -1
- package/dist/{data-Coc1KFVp.js → data-DKrj_Hx6.js} +737 -737
- package/dist/{data-Coc1KFVp.js.map → data-DKrj_Hx6.js.map} +1 -1
- package/dist/data.cjs +1 -1
- package/dist/data.js +3 -3
- package/dist/display-BoXtzMg5.cjs +3 -0
- package/dist/display-BoXtzMg5.cjs.map +1 -0
- package/dist/{display-CZO1cOXZ.js → display-Xqa2Qns3.js} +111 -40
- package/dist/display-Xqa2Qns3.js.map +1 -0
- package/dist/display.cjs +1 -1
- package/dist/display.js +4 -4
- package/dist/{dropdowns-y3B9jSZf.js → dropdowns-BKnXb1XJ.js} +58 -58
- package/dist/{dropdowns-y3B9jSZf.js.map → dropdowns-BKnXb1XJ.js.map} +1 -1
- package/dist/{dropdowns-CI4qUI4Q.cjs → dropdowns-cRrLY8FG.cjs} +2 -2
- package/dist/{dropdowns-CI4qUI4Q.cjs.map → dropdowns-cRrLY8FG.cjs.map} +1 -1
- package/dist/dropdowns.cjs +1 -1
- package/dist/dropdowns.js +1 -1
- package/dist/{feedback-5T-NKzak.js → feedback-CIXmm0XT.js} +28 -28
- package/dist/{feedback-5T-NKzak.js.map → feedback-CIXmm0XT.js.map} +1 -1
- package/dist/{feedback-Cfi3ON4a.cjs → feedback-DiMptPJy.cjs} +2 -2
- package/dist/{feedback-Cfi3ON4a.cjs.map → feedback-DiMptPJy.cjs.map} +1 -1
- package/dist/feedback.cjs +1 -1
- package/dist/feedback.js +6 -6
- package/dist/{form-g7ns3G0R.cjs → form-DABPazeN.cjs} +1 -1
- package/dist/{form-g7ns3G0R.cjs.map → form-DABPazeN.cjs.map} +1 -1
- package/dist/{form-ClvMlxiX.js → form-DZJxDW59.js} +1 -1
- package/dist/{form-ClvMlxiX.js.map → form-DZJxDW59.js.map} +1 -1
- package/dist/form.cjs +1 -1
- package/dist/form.js +1 -1
- package/dist/{frameworkTexts-khAIsKS9.cjs → frameworkTexts-DPX5T2x3.cjs} +1 -1
- package/dist/{frameworkTexts-khAIsKS9.cjs.map → frameworkTexts-DPX5T2x3.cjs.map} +1 -1
- package/dist/{frameworkTexts-Brl68Lwf.js → frameworkTexts-DzujbRBe.js} +1 -1
- package/dist/{frameworkTexts-Brl68Lwf.js.map → frameworkTexts-DzujbRBe.js.map} +1 -1
- package/dist/icons/MIconV2Scenes.d.ts +2 -1
- package/dist/icons/glyphs/MBrandIconsV2.d.ts +2 -0
- package/dist/icons/index.d.ts +1 -0
- package/dist/icons-BJCV7W0L.cjs +2 -0
- package/dist/icons-BJCV7W0L.cjs.map +1 -0
- package/dist/{icons-DZr7JKf6.js → icons-DlNO04xH.js} +335 -239
- package/dist/icons-DlNO04xH.js.map +1 -0
- package/dist/icons.cjs +1 -1
- package/dist/icons.js +2 -2
- package/dist/index.cjs +1 -1
- package/dist/index.d.ts +0 -2
- package/dist/index.js +56 -57
- package/dist/{inputs-Cj6ITRad.js → inputs-CmpB6eyB.js} +157 -157
- package/dist/{inputs-Cj6ITRad.js.map → inputs-CmpB6eyB.js.map} +1 -1
- package/dist/{inputs-BIqwv3qy.cjs → inputs-EZBwxk7j.cjs} +2 -2
- package/dist/{inputs-BIqwv3qy.cjs.map → inputs-EZBwxk7j.cjs.map} +1 -1
- package/dist/inputs.cjs +1 -1
- package/dist/inputs.js +4 -4
- package/dist/{layout-Cu2u9xLW.js → layout-D72Y7VcW.js} +238 -241
- package/dist/{layout-Cu2u9xLW.js.map → layout-D72Y7VcW.js.map} +1 -1
- package/dist/layout-DZiWboju.cjs +2 -0
- package/dist/layout-DZiWboju.cjs.map +1 -0
- package/dist/layout.cjs +1 -1
- package/dist/layout.js +5 -5
- package/dist/{layoutProps-DbnX4zRp.cjs → layoutProps-Ck4VtGm9.cjs} +1 -1
- package/dist/{layoutProps-DbnX4zRp.cjs.map → layoutProps-Ck4VtGm9.cjs.map} +1 -1
- package/dist/{layoutProps-Cwq4EXTV.js → layoutProps-Cl6d1KmH.js} +1 -1
- package/dist/{layoutProps-Cwq4EXTV.js.map → layoutProps-Cl6d1KmH.js.map} +1 -1
- package/dist/{locale-CS1-IY_I.js → locale-BNyzqXAU.js} +1 -1
- package/dist/{locale-CS1-IY_I.js.map → locale-BNyzqXAU.js.map} +1 -1
- package/dist/{locale-DAkrtKuT.cjs → locale-DIwV_GfN.cjs} +1 -1
- package/dist/{locale-DAkrtKuT.cjs.map → locale-DIwV_GfN.cjs.map} +1 -1
- package/dist/media-BlGY91Na.js +431 -0
- package/dist/media-BlGY91Na.js.map +1 -0
- package/dist/media-p643cb02.cjs +2 -0
- package/dist/media-p643cb02.cjs.map +1 -0
- package/dist/media.cjs +1 -1
- package/dist/media.js +3 -3
- package/dist/{overlays-DlQem0xt.js → overlays-51pBvlf9.js} +6 -6
- package/dist/{overlays-DlQem0xt.js.map → overlays-51pBvlf9.js.map} +1 -1
- package/dist/{overlays-pT3iozjm.cjs → overlays-8htlWp07.cjs} +2 -2
- package/dist/{overlays-pT3iozjm.cjs.map → overlays-8htlWp07.cjs.map} +1 -1
- package/dist/overlays.cjs +1 -1
- package/dist/overlays.js +5 -5
- package/dist/primitives.cjs +1 -1
- package/dist/primitives.js +2 -2
- package/dist/{prism-bash-oC8SHnvZ.cjs → prism-bash-DSVvpDwH.cjs} +1 -1
- package/dist/{prism-bash-oC8SHnvZ.cjs.map → prism-bash-DSVvpDwH.cjs.map} +1 -1
- package/dist/{prism-bash-Xs-n623m.js → prism-bash-GQKgVScr.js} +1 -1
- package/dist/{prism-bash-Xs-n623m.js.map → prism-bash-GQKgVScr.js.map} +1 -1
- package/dist/{prism-clike-CrtZga9r.js → prism-clike-D3g4BfTi.js} +1 -1
- package/dist/{prism-clike-CrtZga9r.js.map → prism-clike-D3g4BfTi.js.map} +1 -1
- package/dist/{prism-clike-BHy7LBAZ.cjs → prism-clike-wkj9YeLx.cjs} +1 -1
- package/dist/{prism-clike-BHy7LBAZ.cjs.map → prism-clike-wkj9YeLx.cjs.map} +1 -1
- package/dist/{prism-core-DsZQ3wSm.js → prism-core-DV2K1D4T.js} +1 -1
- package/dist/{prism-core-DsZQ3wSm.js.map → prism-core-DV2K1D4T.js.map} +1 -1
- package/dist/{prism-core-Z2NDHfPM.cjs → prism-core-LzKRJzwD.cjs} +1 -1
- package/dist/{prism-core-Z2NDHfPM.cjs.map → prism-core-LzKRJzwD.cjs.map} +1 -1
- package/dist/{prism-css-DNZzCmaG.js → prism-css-4cDqr1x6.js} +1 -1
- package/dist/{prism-css-DNZzCmaG.js.map → prism-css-4cDqr1x6.js.map} +1 -1
- package/dist/{prism-css-CtHScmdk.cjs → prism-css-BZZ6kh29.cjs} +1 -1
- package/dist/{prism-css-CtHScmdk.cjs.map → prism-css-BZZ6kh29.cjs.map} +1 -1
- package/dist/{prism-javascript-DVQ8iSSP.cjs → prism-javascript-CMvYmmlX.cjs} +1 -1
- package/dist/{prism-javascript-DVQ8iSSP.cjs.map → prism-javascript-CMvYmmlX.cjs.map} +1 -1
- package/dist/{prism-javascript-tgrsDJvl.js → prism-javascript-zm5iB3gQ.js} +1 -1
- package/dist/{prism-javascript-tgrsDJvl.js.map → prism-javascript-zm5iB3gQ.js.map} +1 -1
- package/dist/{prism-json-DdyAX9Pp.js → prism-json-BJI5f6tN.js} +1 -1
- package/dist/{prism-json-DdyAX9Pp.js.map → prism-json-BJI5f6tN.js.map} +1 -1
- package/dist/{prism-json-D3AIyrc5.cjs → prism-json-D_zmeAHJ.cjs} +1 -1
- package/dist/{prism-json-D3AIyrc5.cjs.map → prism-json-D_zmeAHJ.cjs.map} +1 -1
- package/dist/{prism-jsx-CnFRZYK4.cjs → prism-jsx-Byyxdkmw.cjs} +1 -1
- package/dist/{prism-jsx-CnFRZYK4.cjs.map → prism-jsx-Byyxdkmw.cjs.map} +1 -1
- package/dist/{prism-jsx-WafGh0eg.js → prism-jsx-Dk33B94U.js} +1 -1
- package/dist/{prism-jsx-WafGh0eg.js.map → prism-jsx-Dk33B94U.js.map} +1 -1
- package/dist/{prism-markup-BsZlEnsE.cjs → prism-markup-7d9NWx3c.cjs} +1 -1
- package/dist/{prism-markup-BsZlEnsE.cjs.map → prism-markup-7d9NWx3c.cjs.map} +1 -1
- package/dist/{prism-markup-3wgbeWT0.js → prism-markup-Cj0PLFM8.js} +1 -1
- package/dist/{prism-markup-3wgbeWT0.js.map → prism-markup-Cj0PLFM8.js.map} +1 -1
- package/dist/{prism-markup-templating-Vn_U79T9.cjs → prism-markup-templating-BM_XViUy.cjs} +1 -1
- package/dist/{prism-markup-templating-Vn_U79T9.cjs.map → prism-markup-templating-BM_XViUy.cjs.map} +1 -1
- package/dist/{prism-markup-templating-DwntZfmY.js → prism-markup-templating-Dc6p1a24.js} +1 -1
- package/dist/{prism-markup-templating-DwntZfmY.js.map → prism-markup-templating-Dc6p1a24.js.map} +1 -1
- package/dist/{prism-php-CizDps-m.js → prism-php-CGE55yTu.js} +1 -1
- package/dist/{prism-php-CizDps-m.js.map → prism-php-CGE55yTu.js.map} +1 -1
- package/dist/{prism-php-DDMsSDeI.cjs → prism-php-C_g4bp0C.cjs} +1 -1
- package/dist/{prism-php-DDMsSDeI.cjs.map → prism-php-C_g4bp0C.cjs.map} +1 -1
- package/dist/{prism-tsx-DDg7MuNh.cjs → prism-tsx-Buubi-AJ.cjs} +1 -1
- package/dist/{prism-tsx-DDg7MuNh.cjs.map → prism-tsx-Buubi-AJ.cjs.map} +1 -1
- package/dist/{prism-tsx-BFlaUgcE.js → prism-tsx-CueLxs1r.js} +1 -1
- package/dist/{prism-tsx-BFlaUgcE.js.map → prism-tsx-CueLxs1r.js.map} +1 -1
- package/dist/{prism-typescript-DYi8QiPX.cjs → prism-typescript-Cj7wU8T7.cjs} +1 -1
- package/dist/{prism-typescript-DYi8QiPX.cjs.map → prism-typescript-Cj7wU8T7.cjs.map} +1 -1
- package/dist/{prism-typescript-Br2XvXsL.js → prism-typescript-DC-urVo-.js} +1 -1
- package/dist/{prism-typescript-Br2XvXsL.js.map → prism-typescript-DC-urVo-.js.map} +1 -1
- package/dist/style-runtime.cjs +1 -1
- package/dist/style-runtime.js +1 -1
- package/dist/styles.css +1 -1
- package/dist/{typography-B_xK5Q_j.cjs → typography-D1s-QFlb.cjs} +2 -2
- package/dist/{typography-B_xK5Q_j.cjs.map → typography-D1s-QFlb.cjs.map} +1 -1
- package/dist/{typography-C3BBQ_9r.js → typography-FCWA0UOB.js} +2 -2
- package/dist/{typography-C3BBQ_9r.js.map → typography-FCWA0UOB.js.map} +1 -1
- package/dist/typography.cjs +1 -1
- package/dist/typography.js +5 -5
- package/dist/utils.cjs +1 -1
- package/dist/utils.entry.d.ts +0 -2
- package/dist/utils.js +1 -2
- package/package.json +1 -1
- package/dist/MImage-DXy-dHas.cjs +0 -2
- package/dist/MImage-DXy-dHas.cjs.map +0 -1
- package/dist/MImage-Dp81HSZr.js +0 -53
- package/dist/MImage-Dp81HSZr.js.map +0 -1
- package/dist/MInline-CnxH6VZx.js +0 -41
- package/dist/MInline-CnxH6VZx.js.map +0 -1
- package/dist/MInline-DYy3IhF-.cjs +0 -2
- package/dist/MInline-DYy3IhF-.cjs.map +0 -1
- package/dist/MStack-8qZI36jT.js +0 -41
- package/dist/MStack-8qZI36jT.js.map +0 -1
- package/dist/MStack-BcEwA2sk.cjs +0 -2
- package/dist/MStack-BcEwA2sk.cjs.map +0 -1
- package/dist/MSurface-DWl0groZ.cjs +0 -2
- package/dist/MSurface-DWl0groZ.cjs.map +0 -1
- package/dist/MSurface-DnwfNn3F.js +0 -41
- package/dist/MSurface-DnwfNn3F.js.map +0 -1
- package/dist/display-Bt0G6RPk.cjs +0 -3
- package/dist/display-Bt0G6RPk.cjs.map +0 -1
- package/dist/display-CZO1cOXZ.js.map +0 -1
- package/dist/icons-BhZaama4.cjs +0 -2
- package/dist/icons-BhZaama4.cjs.map +0 -1
- package/dist/icons-DZr7JKf6.js.map +0 -1
- package/dist/layout-DZXYG0TB.cjs +0 -2
- package/dist/layout-DZXYG0TB.cjs.map +0 -1
- package/dist/media-CWx--sZw.cjs +0 -2
- package/dist/media-CWx--sZw.cjs.map +0 -1
- package/dist/media-fmOnjugH.js +0 -408
- package/dist/media-fmOnjugH.js.map +0 -1
- package/dist/useReveal-DVwtH8Dl.cjs +0 -2
- package/dist/useReveal-DVwtH8Dl.cjs.map +0 -1
- package/dist/useReveal-JAiIFTia.js +0 -23
- package/dist/useReveal-JAiIFTia.js.map +0 -1
- package/dist/utils/useReveal.d.ts +0 -2
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
require(`./chunk-350yNsax.cjs`);const e=require(`./icons-
|
|
2
|
-
//# sourceMappingURL=MInput-
|
|
1
|
+
require(`./chunk-350yNsax.cjs`);const e=require(`./icons-BJCV7W0L.cjs`),t=require(`./cn-DYFxgzi2.cjs`),n=require(`./useGhostText-D1DbIs-n.cjs`),r=require(`./useInteractionEffect-CYHGHV1e.cjs`),i=require(`./MButton-LUNWBBOV.cjs`);let a=require(`react`),o=require(`react/jsx-runtime`);function s(e){return e==null?``:e.toString()}function c(e,t){let[n,r]=(0,a.useState)(()=>s(t)),i=e!==void 0;return{isControlled:i,currentValue:i?s(e):n,setCurrentValue:(0,a.useCallback)(e=>{i||r(e)},[i])}}var l=(0,a.forwardRef)(function({type:s=`text`,value:l,defaultValue:u,name:d,id:f,placeholder:p,disabled:m=!1,readOnly:h=!1,required:g=!1,autoFocus:_=!1,autoComplete:v,inputMode:y,variant:ee=`outlined`,size:te=`md`,color:b,fullWidth:ne=!1,rounded:re=!1,label:x,helperText:S,errorText:C,startIcon:w,endIcon:T,clearable:E=!1,error:D=!1,success:O=!1,maxLength:k,showCharCount:A=!1,onChange:j,onFocus:M,onBlur:N,onKeyDown:P,onClear:F,ghostOptions:I,ghostMinChars:ie=2,onGhostAccept:L,loading:R=!1,clickEffect:z=`ripple`,rippleColor:B,className:ae,style:oe,inputClassName:V,labelClassName:se},H){let[U,W]=(0,a.useState)(!1),G=(0,a.useRef)(null),{effectClassName:ce,effectLayer:le,handlePointerDown:ue}=r.t({effect:z,disabled:m||h,color:B}),{isControlled:de,currentValue:K,setCurrentValue:q}=c(l,u),J=n.t({options:I??[],value:K,minChars:ie}),Y=D||!!C,fe=K.length>0,X=Y?`color-error`:b?`color-${b}`:void 0,Z=(0,a.useCallback)(e=>{W(!0),M?.(e)},[M]),Q=(0,a.useCallback)(e=>{W(!1),N?.(e)},[N]),$=(0,a.useCallback)(e=>{q(e.target.value),j?.(e),J.reset()},[j,q,J.reset]),pe=(0,a.useCallback)(e=>{if(I&&J.hint&&J.onKeyDown(e)){let e=J.accept();q(e.value),L?.(e.value);let t=H?.current??G.current;t&&((Object.getOwnPropertyDescriptor(HTMLInputElement.prototype,`value`)?.set)?.call(t,e.value),t.dispatchEvent(new Event(`input`,{bubbles:!0})));return}P?.(e)},[I,J,q,L,P,H]),me=(0,a.useCallback)(()=>{q(``);let e=H?.current??G.current;e&&((Object.getOwnPropertyDescriptor(HTMLInputElement.prototype,`value`)?.set)?.call(e,``),e.dispatchEvent(new Event(`input`,{bubbles:!0}))),F?.(),e?.focus()},[F,H,q]),he=t.t(`container`,`field-${ee}`,`field-${te}`,U&&`focused`,Y&&`input-error`,O&&!Y&&`input-success`,X,m&&`disabled`,re&&`rounded`,ce);return(0,o.jsxs)(`div`,{className:t.t(`input`,X,ne&&`full-width`,ae),style:oe,children:[x&&(0,o.jsx)(`label`,{htmlFor:f,className:t.t(`field-label`,U&&`focused`,Y&&`error`,O&&!Y&&`success`,g&&`required`,se),children:x}),(0,o.jsxs)(`div`,{className:he,onPointerDown:ue,children:[le,w&&(0,o.jsx)(`span`,{className:`start-icon`,children:w}),I?(0,o.jsxs)(`div`,{className:`ghost-text-field`,children:[(0,o.jsx)(`input`,{ref:H??G,type:s,value:K,name:d,id:f,placeholder:p,disabled:m,readOnly:h,required:g,autoFocus:_,autoComplete:v??`off`,inputMode:y,maxLength:k,className:t.t(`field`,V),onChange:$,onFocus:Z,onBlur:Q,onKeyDown:pe,"aria-invalid":Y||void 0,"aria-describedby":C?`${f}-error`:S?`${f}-helper`:void 0}),U&&J.hint&&(0,o.jsxs)(`span`,{className:`ghost-text-overlay`,"aria-hidden":`true`,children:[(0,o.jsx)(`span`,{className:`ghost-text-typed`,children:K}),(0,o.jsx)(`span`,{className:`ghost-text-hint`,children:J.hint})]})]}):(0,o.jsx)(`input`,{ref:H??G,type:s,value:K,name:d,id:f,placeholder:p,disabled:m,readOnly:h,required:g,autoFocus:_,autoComplete:v,inputMode:y,maxLength:k,className:t.t(`field`,V),onChange:$,onFocus:Z,onBlur:Q,onKeyDown:P,"aria-invalid":Y||void 0,"aria-describedby":C?`${f}-error`:S?`${f}-helper`:void 0}),R&&(0,o.jsx)(i.r,{size:`sm`,color:b}),E&&fe&&!R&&!m&&(0,o.jsx)(`button`,{type:`button`,className:`clear-btn clear-btn-base`,onClick:me,tabIndex:-1,"aria-label":`Clear input`,children:(0,o.jsx)(e.Li,{})}),T&&!R&&(0,o.jsx)(`span`,{className:`end-icon`,children:T})]}),(C||S||A)&&(0,o.jsxs)(`div`,{className:`bottom-row`,children:[(0,o.jsxs)(`span`,{children:[C&&(0,o.jsx)(`span`,{id:f?`${f}-error`:void 0,className:`field-error`,role:`alert`,children:C}),!C&&S&&(0,o.jsx)(`span`,{id:f?`${f}-helper`:void 0,className:`field-helper`,children:S})]}),A&&k&&(0,o.jsxs)(`span`,{className:t.t(`char-count`,K.length>k&&`over`),children:[K.length,`/`,k]})]})]})});Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return c}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return l}});
|
|
2
|
+
//# sourceMappingURL=MInput-DDZ71Qqn.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MInput-DkbdeGQW.cjs","names":[],"sources":["../src/utils/useControllableString.ts","../src/components/inputs/MInput/MInput.tsx"],"sourcesContent":["import {useCallback, useState} from 'react'\n\ntype ControllableStringLike = string | number | readonly string[] | null | undefined\n\n// Normalize mixed input values so text-like controls always work with strings.\nfunction normalizeStringValue(value: ControllableStringLike) {\n if (value === null || value === undefined) {\n return ''\n }\n\n return value.toString()\n}\n\n// Share controlled and uncontrolled string state logic between text-like primitives.\nexport function useControllableString(value: ControllableStringLike, defaultValue?: ControllableStringLike) {\n const [internalValue, setInternalValue] = useState(() => normalizeStringValue(defaultValue))\n const isControlled = value !== undefined\n const currentValue = isControlled ? normalizeStringValue(value) : internalValue\n\n const setCurrentValue = useCallback(\n (nextValue: string) => {\n if (!isControlled) {\n setInternalValue(nextValue)\n }\n },\n [isControlled]\n )\n\n return {\n isControlled,\n currentValue,\n setCurrentValue,\n }\n}\n","import {forwardRef, useCallback, useRef, useState} from 'react'\nimport type * as React from 'react'\nimport type {MInputProps} from './MInput.types'\nimport {cn} from '../../../utils/cn'\nimport {useControllableString} from '../../../utils/useControllableString'\nimport {useInteractionEffect} from '../../../utils/useInteractionEffect'\nimport {useGhostText} from '../../../utils/useGhostText'\nimport {MSpinner} from '../../feedback'\nimport {MCloseIcon} from '../../../icons'\nimport './MInput.css'\n\n// Render the base text input used by all specialized input wrappers.\nexport const MInput = forwardRef<HTMLInputElement, MInputProps>(function MInput(\n {\n type = 'text',\n value,\n defaultValue,\n name,\n id,\n placeholder,\n disabled = false,\n readOnly = false,\n required = false,\n autoFocus = false,\n autoComplete,\n inputMode,\n variant = 'outlined',\n size = 'md',\n color,\n fullWidth = false,\n rounded = false,\n label,\n helperText,\n errorText,\n startIcon,\n endIcon,\n clearable = false,\n error = false,\n success = false,\n maxLength,\n showCharCount = false,\n onChange,\n onFocus,\n onBlur,\n onKeyDown,\n onClear,\n ghostOptions,\n ghostMinChars = 2,\n onGhostAccept,\n loading = false,\n clickEffect = 'ripple',\n rippleColor,\n className,\n style,\n inputClassName,\n labelClassName,\n },\n ref\n) {\n const [focused, setFocused] = useState(false)\n const inputRef = useRef<HTMLInputElement>(null)\n const {effectClassName, effectLayer, handlePointerDown} = useInteractionEffect<HTMLDivElement>({\n effect: clickEffect,\n disabled: disabled || readOnly,\n color: rippleColor,\n })\n\n const {isControlled, currentValue, setCurrentValue} = useControllableString(value, defaultValue)\n const ghost = useGhostText({\n options: ghostOptions ?? [],\n value: currentValue,\n minChars: ghostMinChars,\n })\n const hasError = error || !!errorText\n const hasContent = currentValue.length > 0\n const resolvedColorClass = hasError ? 'color-error' : color ? `color-${color}` : undefined\n\n // Mirror focus state so the wrapper can style the input consistently.\n const handleFocus = useCallback(\n (event: React.FocusEvent<HTMLInputElement>) => {\n setFocused(true)\n onFocus?.(event)\n },\n [onFocus]\n )\n\n // Clear focus styles before delegating to the caller.\n const handleBlur = useCallback(\n (event: React.FocusEvent<HTMLInputElement>) => {\n setFocused(false)\n onBlur?.(event)\n },\n [onBlur]\n )\n\n // Keep uncontrolled usage working without blocking controlled integrations.\n const handleChange = useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n setCurrentValue(event.target.value)\n onChange?.(event)\n ghost.reset()\n },\n [onChange, setCurrentValue, ghost.reset]\n )\n\n // Intercept keyboard events for ghost text acceptance before delegating.\n const handleKeyDown = useCallback(\n (event: React.KeyboardEvent<HTMLInputElement>) => {\n if (ghostOptions && ghost.hint) {\n const accepted = ghost.onKeyDown(event)\n if (accepted) {\n const result = ghost.accept()\n setCurrentValue(result.value)\n onGhostAccept?.(result.value)\n // Fire synthetic change so controlled parents stay in sync.\n const input = (ref as React.RefObject<HTMLInputElement>)?.current ?? inputRef.current\n if (input) {\n const nativeSet = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, 'value')?.set\n nativeSet?.call(input, result.value)\n input.dispatchEvent(new Event('input', {bubbles: true}))\n }\n return\n }\n }\n onKeyDown?.(event)\n },\n [ghostOptions, ghost, setCurrentValue, onGhostAccept, onKeyDown, ref]\n )\n\n // Reset the visible value while preserving focus for quick repeated input.\n const handleClear = useCallback(() => {\n setCurrentValue('')\n\n const input = (ref as React.RefObject<HTMLInputElement>)?.current ?? inputRef.current\n if (input) {\n const nativeSet = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, 'value')?.set\n nativeSet?.call(input, '')\n input.dispatchEvent(new Event('input', {bubbles: true}))\n }\n\n onClear?.()\n input?.focus()\n }, [onClear, ref, setCurrentValue])\n\n const containerClasses = cn(\n 'container',\n `field-${variant}`,\n `field-${size}`,\n focused && 'focused',\n hasError && 'input-error',\n success && !hasError && 'input-success',\n resolvedColorClass,\n disabled && 'disabled',\n rounded && 'rounded',\n effectClassName\n )\n\n return (\n <div className={cn('input', resolvedColorClass, fullWidth && 'full-width', className)} style={style}>\n {label && (\n <label\n htmlFor={id}\n className={cn(\n 'field-label',\n focused && 'focused',\n hasError && 'error',\n success && !hasError && 'success',\n required && 'required',\n labelClassName\n )}\n >\n {label}\n </label>\n )}\n\n <div className={containerClasses} onPointerDown={handlePointerDown}>\n {effectLayer}\n {startIcon && <span className=\"start-icon\">{startIcon}</span>}\n\n {ghostOptions ? (\n <div className=\"ghost-text-field\">\n <input\n ref={ref ?? inputRef}\n type={type}\n value={currentValue}\n name={name}\n id={id}\n placeholder={placeholder}\n disabled={disabled}\n readOnly={readOnly}\n required={required}\n autoFocus={autoFocus}\n autoComplete={autoComplete ?? 'off'}\n inputMode={inputMode}\n maxLength={maxLength}\n className={cn('field', inputClassName)}\n onChange={handleChange}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n aria-invalid={hasError || undefined}\n aria-describedby={errorText ? `${id}-error` : helperText ? `${id}-helper` : undefined}\n />\n {focused && ghost.hint && (\n <span className=\"ghost-text-overlay\" aria-hidden=\"true\">\n <span className=\"ghost-text-typed\">{currentValue}</span>\n <span className=\"ghost-text-hint\">{ghost.hint}</span>\n </span>\n )}\n </div>\n ) : (\n <input\n ref={ref ?? inputRef}\n type={type}\n value={currentValue}\n name={name}\n id={id}\n placeholder={placeholder}\n disabled={disabled}\n readOnly={readOnly}\n required={required}\n autoFocus={autoFocus}\n autoComplete={autoComplete}\n inputMode={inputMode}\n maxLength={maxLength}\n className={cn('field', inputClassName)}\n onChange={handleChange}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onKeyDown={onKeyDown}\n aria-invalid={hasError || undefined}\n aria-describedby={errorText ? `${id}-error` : helperText ? `${id}-helper` : undefined}\n />\n )}\n\n {loading && <MSpinner size=\"sm\" color={color} />}\n\n {clearable && hasContent && !loading && !disabled && (\n <button\n type=\"button\"\n className=\"clear-btn clear-btn-base\"\n onClick={handleClear}\n tabIndex={-1}\n aria-label=\"Clear input\"\n >\n <MCloseIcon />\n </button>\n )}\n\n {endIcon && !loading && <span className=\"end-icon\">{endIcon}</span>}\n </div>\n\n {(errorText || helperText || showCharCount) && (\n <div className=\"bottom-row\">\n <span>\n {errorText && (\n <span id={id ? `${id}-error` : undefined} className=\"field-error\" role=\"alert\">\n {errorText}\n </span>\n )}\n {!errorText && helperText && (\n <span id={id ? `${id}-helper` : undefined} className=\"field-helper\">\n {helperText}\n </span>\n )}\n </span>\n {showCharCount && maxLength && (\n <span className={cn('char-count', currentValue.length > maxLength && 'over')}>\n {currentValue.length}/{maxLength}\n </span>\n )}\n </div>\n )}\n </div>\n )\n})\n"],"mappings":"2RAKA,SAAS,EAAqB,EAA+B,CAKzD,OAJI,GAAU,KACH,GAGJ,EAAM,UAAU,CAI3B,SAAgB,EAAsB,EAA+B,EAAuC,CACxG,GAAM,CAAC,EAAe,IAAA,EAAA,EAAA,cAAmC,EAAqB,EAAa,CAAC,CACtF,EAAe,IAAU,IAAA,GAY/B,MAAO,CACH,eACA,aAbiB,EAAe,EAAqB,EAAM,CAAG,EAc9D,iBAAA,EAAA,EAAA,aAXC,GAAsB,CACd,GACD,EAAiB,EAAU,EAGnC,CAAC,EAAa,CACjB,CAMA,CCpBL,IAAa,GAAA,EAAA,EAAA,YAAmD,SAC5D,CACI,OAAO,OACP,QACA,eACA,OACA,KACA,cACA,WAAW,GACX,WAAW,GACX,WAAW,GACX,YAAY,GACZ,eACA,YACA,WAAU,WACV,QAAO,KACP,QACA,aAAY,GACZ,WAAU,GACV,QACA,aACA,YACA,YACA,UACA,YAAY,GACZ,QAAQ,GACR,UAAU,GACV,YACA,gBAAgB,GAChB,WACA,UACA,SACA,YACA,UACA,eACA,iBAAgB,EAChB,gBACA,UAAU,GACV,cAAc,SACd,cACA,aACA,SACA,iBACA,mBAEJ,EACF,CACE,GAAM,CAAC,EAAS,IAAA,EAAA,EAAA,UAAuB,GAAM,CACvC,GAAA,EAAA,EAAA,QAAoC,KAAK,CACzC,CAAC,mBAAiB,eAAa,sBAAqB,EAAA,EAAqC,CAC3F,OAAQ,EACR,SAAU,GAAY,EACtB,MAAO,EACV,CAAC,CAEI,CAAC,gBAAc,eAAc,mBAAmB,EAAsB,EAAO,EAAa,CAC1F,EAAQ,EAAA,EAAa,CACvB,QAAS,GAAgB,EAAE,CAC3B,MAAO,EACP,SAAU,GACb,CAAC,CACI,EAAW,GAAS,CAAC,CAAC,EACtB,GAAa,EAAa,OAAS,EACnC,EAAqB,EAAW,cAAgB,EAAQ,SAAS,IAAU,IAAA,GAG3E,GAAA,EAAA,EAAA,aACD,GAA8C,CAC3C,EAAW,GAAK,CAChB,IAAU,EAAM,EAEpB,CAAC,EAAQ,CACZ,CAGK,GAAA,EAAA,EAAA,aACD,GAA8C,CAC3C,EAAW,GAAM,CACjB,IAAS,EAAM,EAEnB,CAAC,EAAO,CACX,CAGK,GAAA,EAAA,EAAA,aACD,GAA+C,CAC5C,EAAgB,EAAM,OAAO,MAAM,CACnC,IAAW,EAAM,CACjB,EAAM,OAAO,EAEjB,CAAC,EAAU,EAAiB,EAAM,MAAM,CAC3C,CAGK,IAAA,EAAA,EAAA,aACD,GAAiD,CAC9C,GAAI,GAAgB,EAAM,MACL,EAAM,UAAU,EAAM,CACzB,CACV,IAAM,EAAS,EAAM,QAAQ,CAC7B,EAAgB,EAAO,MAAM,CAC7B,IAAgB,EAAO,MAAM,CAE7B,IAAM,EAAS,GAA2C,SAAW,EAAS,QAC1E,KACkB,OAAO,yBAAyB,iBAAiB,UAAW,QAAQ,EAAE,MAC7E,KAAK,EAAO,EAAO,MAAM,CACpC,EAAM,cAAc,IAAI,MAAM,QAAS,CAAC,QAAS,GAAK,CAAC,CAAC,EAE5D,OAGR,IAAY,EAAM,EAEtB,CAAC,EAAc,EAAO,EAAiB,EAAe,EAAW,EAAI,CACxE,CAGK,IAAA,EAAA,EAAA,iBAAgC,CAClC,EAAgB,GAAG,CAEnB,IAAM,EAAS,GAA2C,SAAW,EAAS,QAC1E,KACkB,OAAO,yBAAyB,iBAAiB,UAAW,QAAQ,EAAE,MAC7E,KAAK,EAAO,GAAG,CAC1B,EAAM,cAAc,IAAI,MAAM,QAAS,CAAC,QAAS,GAAK,CAAC,CAAC,EAG5D,KAAW,CACX,GAAO,OAAO,EACf,CAAC,EAAS,EAAK,EAAgB,CAAC,CAE7B,GAAmB,EAAA,EACrB,YACA,SAAS,KACT,SAAS,KACT,GAAW,UACX,GAAY,cACZ,GAAW,CAAC,GAAY,gBACxB,EACA,GAAY,WACZ,IAAW,UACX,GACH,CAED,OACI,EAAA,EAAA,MAAC,MAAD,CAAK,UAAW,EAAA,EAAG,QAAS,EAAoB,IAAa,aAAc,GAAU,CAAS,kBAA9F,CACK,IACG,EAAA,EAAA,KAAC,QAAD,CACI,QAAS,EACT,UAAW,EAAA,EACP,cACA,GAAW,UACX,GAAY,QACZ,GAAW,CAAC,GAAY,UACxB,GAAY,WACZ,GACH,UAEA,EACG,CAAA,EAGZ,EAAA,EAAA,MAAC,MAAD,CAAK,UAAW,GAAkB,cAAe,YAAjD,CACK,GACA,IAAa,EAAA,EAAA,KAAC,OAAD,CAAM,UAAU,sBAAc,EAAiB,CAAA,CAE5D,GACG,EAAA,EAAA,MAAC,MAAD,CAAK,UAAU,4BAAf,EACI,EAAA,EAAA,KAAC,QAAD,CACI,IAAK,GAAO,EACN,OACN,MAAO,EACD,OACF,KACS,cACH,WACA,WACA,WACC,YACX,aAAc,GAAgB,MACnB,YACA,YACX,UAAW,EAAA,EAAG,QAAS,EAAe,CACtC,SAAU,EACV,QAAS,EACT,OAAQ,EACR,UAAW,GACX,eAAc,GAAY,IAAA,GAC1B,mBAAkB,EAAY,GAAG,EAAG,QAAU,EAAa,GAAG,EAAG,SAAW,IAAA,GAC9E,CAAA,CACD,GAAW,EAAM,OACd,EAAA,EAAA,MAAC,OAAD,CAAM,UAAU,qBAAqB,cAAY,gBAAjD,EACI,EAAA,EAAA,KAAC,OAAD,CAAM,UAAU,4BAAoB,EAAoB,CAAA,EACxD,EAAA,EAAA,KAAC,OAAD,CAAM,UAAU,2BAAmB,EAAM,KAAY,CAAA,CAClD,GAET,IAEN,EAAA,EAAA,KAAC,QAAD,CACI,IAAK,GAAO,EACN,OACN,MAAO,EACD,OACF,KACS,cACH,WACA,WACA,WACC,YACG,eACH,YACA,YACX,UAAW,EAAA,EAAG,QAAS,EAAe,CACtC,SAAU,EACV,QAAS,EACT,OAAQ,EACG,YACX,eAAc,GAAY,IAAA,GAC1B,mBAAkB,EAAY,GAAG,EAAG,QAAU,EAAa,GAAG,EAAG,SAAW,IAAA,GAC9E,CAAA,CAGL,IAAW,EAAA,EAAA,KAAC,EAAA,EAAD,CAAU,KAAK,KAAY,QAAS,CAAA,CAE/C,GAAa,IAAc,CAAC,GAAW,CAAC,IACrC,EAAA,EAAA,KAAC,SAAD,CACI,KAAK,SACL,UAAU,2BACV,QAAS,GACT,SAAU,GACV,aAAW,wBAEX,EAAA,EAAA,KAAC,EAAA,GAAD,EAAc,CAAA,CACT,CAAA,CAGZ,GAAW,CAAC,IAAW,EAAA,EAAA,KAAC,OAAD,CAAM,UAAU,oBAAY,EAAe,CAAA,CACjE,IAEJ,GAAa,GAAc,KACzB,EAAA,EAAA,MAAC,MAAD,CAAK,UAAU,sBAAf,EACI,EAAA,EAAA,MAAC,OAAD,CAAA,SAAA,CACK,IACG,EAAA,EAAA,KAAC,OAAD,CAAM,GAAI,EAAK,GAAG,EAAG,QAAU,IAAA,GAAW,UAAU,cAAc,KAAK,iBAClE,EACE,CAAA,CAEV,CAAC,GAAa,IACX,EAAA,EAAA,KAAC,OAAD,CAAM,GAAI,EAAK,GAAG,EAAG,SAAW,IAAA,GAAW,UAAU,wBAChD,EACE,CAAA,CAER,CAAA,CAAA,CACN,GAAiB,IACd,EAAA,EAAA,MAAC,OAAD,CAAM,UAAW,EAAA,EAAG,aAAc,EAAa,OAAS,GAAa,OAAO,UAA5E,CACK,EAAa,OAAO,IAAE,EACpB,GAET,GAER,IAEZ"}
|
|
1
|
+
{"version":3,"file":"MInput-DDZ71Qqn.cjs","names":[],"sources":["../src/utils/useControllableString.ts","../src/components/inputs/MInput/MInput.tsx"],"sourcesContent":["import {useCallback, useState} from 'react'\n\ntype ControllableStringLike = string | number | readonly string[] | null | undefined\n\n// Normalize mixed input values so text-like controls always work with strings.\nfunction normalizeStringValue(value: ControllableStringLike) {\n if (value === null || value === undefined) {\n return ''\n }\n\n return value.toString()\n}\n\n// Share controlled and uncontrolled string state logic between text-like primitives.\nexport function useControllableString(value: ControllableStringLike, defaultValue?: ControllableStringLike) {\n const [internalValue, setInternalValue] = useState(() => normalizeStringValue(defaultValue))\n const isControlled = value !== undefined\n const currentValue = isControlled ? normalizeStringValue(value) : internalValue\n\n const setCurrentValue = useCallback(\n (nextValue: string) => {\n if (!isControlled) {\n setInternalValue(nextValue)\n }\n },\n [isControlled]\n )\n\n return {\n isControlled,\n currentValue,\n setCurrentValue,\n }\n}\n","import {forwardRef, useCallback, useRef, useState} from 'react'\nimport type * as React from 'react'\nimport type {MInputProps} from './MInput.types'\nimport {cn} from '../../../utils/cn'\nimport {useControllableString} from '../../../utils/useControllableString'\nimport {useInteractionEffect} from '../../../utils/useInteractionEffect'\nimport {useGhostText} from '../../../utils/useGhostText'\nimport {MSpinner} from '../../feedback'\nimport {MCloseIcon} from '../../../icons'\nimport './MInput.css'\n\n// Render the base text input used by all specialized input wrappers.\nexport const MInput = forwardRef<HTMLInputElement, MInputProps>(function MInput(\n {\n type = 'text',\n value,\n defaultValue,\n name,\n id,\n placeholder,\n disabled = false,\n readOnly = false,\n required = false,\n autoFocus = false,\n autoComplete,\n inputMode,\n variant = 'outlined',\n size = 'md',\n color,\n fullWidth = false,\n rounded = false,\n label,\n helperText,\n errorText,\n startIcon,\n endIcon,\n clearable = false,\n error = false,\n success = false,\n maxLength,\n showCharCount = false,\n onChange,\n onFocus,\n onBlur,\n onKeyDown,\n onClear,\n ghostOptions,\n ghostMinChars = 2,\n onGhostAccept,\n loading = false,\n clickEffect = 'ripple',\n rippleColor,\n className,\n style,\n inputClassName,\n labelClassName,\n },\n ref\n) {\n const [focused, setFocused] = useState(false)\n const inputRef = useRef<HTMLInputElement>(null)\n const {effectClassName, effectLayer, handlePointerDown} = useInteractionEffect<HTMLDivElement>({\n effect: clickEffect,\n disabled: disabled || readOnly,\n color: rippleColor,\n })\n\n const {isControlled, currentValue, setCurrentValue} = useControllableString(value, defaultValue)\n const ghost = useGhostText({\n options: ghostOptions ?? [],\n value: currentValue,\n minChars: ghostMinChars,\n })\n const hasError = error || !!errorText\n const hasContent = currentValue.length > 0\n const resolvedColorClass = hasError ? 'color-error' : color ? `color-${color}` : undefined\n\n // Mirror focus state so the wrapper can style the input consistently.\n const handleFocus = useCallback(\n (event: React.FocusEvent<HTMLInputElement>) => {\n setFocused(true)\n onFocus?.(event)\n },\n [onFocus]\n )\n\n // Clear focus styles before delegating to the caller.\n const handleBlur = useCallback(\n (event: React.FocusEvent<HTMLInputElement>) => {\n setFocused(false)\n onBlur?.(event)\n },\n [onBlur]\n )\n\n // Keep uncontrolled usage working without blocking controlled integrations.\n const handleChange = useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n setCurrentValue(event.target.value)\n onChange?.(event)\n ghost.reset()\n },\n [onChange, setCurrentValue, ghost.reset]\n )\n\n // Intercept keyboard events for ghost text acceptance before delegating.\n const handleKeyDown = useCallback(\n (event: React.KeyboardEvent<HTMLInputElement>) => {\n if (ghostOptions && ghost.hint) {\n const accepted = ghost.onKeyDown(event)\n if (accepted) {\n const result = ghost.accept()\n setCurrentValue(result.value)\n onGhostAccept?.(result.value)\n // Fire synthetic change so controlled parents stay in sync.\n const input = (ref as React.RefObject<HTMLInputElement>)?.current ?? inputRef.current\n if (input) {\n const nativeSet = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, 'value')?.set\n nativeSet?.call(input, result.value)\n input.dispatchEvent(new Event('input', {bubbles: true}))\n }\n return\n }\n }\n onKeyDown?.(event)\n },\n [ghostOptions, ghost, setCurrentValue, onGhostAccept, onKeyDown, ref]\n )\n\n // Reset the visible value while preserving focus for quick repeated input.\n const handleClear = useCallback(() => {\n setCurrentValue('')\n\n const input = (ref as React.RefObject<HTMLInputElement>)?.current ?? inputRef.current\n if (input) {\n const nativeSet = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, 'value')?.set\n nativeSet?.call(input, '')\n input.dispatchEvent(new Event('input', {bubbles: true}))\n }\n\n onClear?.()\n input?.focus()\n }, [onClear, ref, setCurrentValue])\n\n const containerClasses = cn(\n 'container',\n `field-${variant}`,\n `field-${size}`,\n focused && 'focused',\n hasError && 'input-error',\n success && !hasError && 'input-success',\n resolvedColorClass,\n disabled && 'disabled',\n rounded && 'rounded',\n effectClassName\n )\n\n return (\n <div className={cn('input', resolvedColorClass, fullWidth && 'full-width', className)} style={style}>\n {label && (\n <label\n htmlFor={id}\n className={cn(\n 'field-label',\n focused && 'focused',\n hasError && 'error',\n success && !hasError && 'success',\n required && 'required',\n labelClassName\n )}\n >\n {label}\n </label>\n )}\n\n <div className={containerClasses} onPointerDown={handlePointerDown}>\n {effectLayer}\n {startIcon && <span className=\"start-icon\">{startIcon}</span>}\n\n {ghostOptions ? (\n <div className=\"ghost-text-field\">\n <input\n ref={ref ?? inputRef}\n type={type}\n value={currentValue}\n name={name}\n id={id}\n placeholder={placeholder}\n disabled={disabled}\n readOnly={readOnly}\n required={required}\n autoFocus={autoFocus}\n autoComplete={autoComplete ?? 'off'}\n inputMode={inputMode}\n maxLength={maxLength}\n className={cn('field', inputClassName)}\n onChange={handleChange}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n aria-invalid={hasError || undefined}\n aria-describedby={errorText ? `${id}-error` : helperText ? `${id}-helper` : undefined}\n />\n {focused && ghost.hint && (\n <span className=\"ghost-text-overlay\" aria-hidden=\"true\">\n <span className=\"ghost-text-typed\">{currentValue}</span>\n <span className=\"ghost-text-hint\">{ghost.hint}</span>\n </span>\n )}\n </div>\n ) : (\n <input\n ref={ref ?? inputRef}\n type={type}\n value={currentValue}\n name={name}\n id={id}\n placeholder={placeholder}\n disabled={disabled}\n readOnly={readOnly}\n required={required}\n autoFocus={autoFocus}\n autoComplete={autoComplete}\n inputMode={inputMode}\n maxLength={maxLength}\n className={cn('field', inputClassName)}\n onChange={handleChange}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onKeyDown={onKeyDown}\n aria-invalid={hasError || undefined}\n aria-describedby={errorText ? `${id}-error` : helperText ? `${id}-helper` : undefined}\n />\n )}\n\n {loading && <MSpinner size=\"sm\" color={color} />}\n\n {clearable && hasContent && !loading && !disabled && (\n <button\n type=\"button\"\n className=\"clear-btn clear-btn-base\"\n onClick={handleClear}\n tabIndex={-1}\n aria-label=\"Clear input\"\n >\n <MCloseIcon />\n </button>\n )}\n\n {endIcon && !loading && <span className=\"end-icon\">{endIcon}</span>}\n </div>\n\n {(errorText || helperText || showCharCount) && (\n <div className=\"bottom-row\">\n <span>\n {errorText && (\n <span id={id ? `${id}-error` : undefined} className=\"field-error\" role=\"alert\">\n {errorText}\n </span>\n )}\n {!errorText && helperText && (\n <span id={id ? `${id}-helper` : undefined} className=\"field-helper\">\n {helperText}\n </span>\n )}\n </span>\n {showCharCount && maxLength && (\n <span className={cn('char-count', currentValue.length > maxLength && 'over')}>\n {currentValue.length}/{maxLength}\n </span>\n )}\n </div>\n )}\n </div>\n )\n})\n"],"mappings":"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"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { Li as e } from "./icons-DlNO04xH.js";
|
|
2
2
|
import { t } from "./cn-CUSXNnjF.js";
|
|
3
3
|
import { t as n } from "./useGhostText-BJZKdZpw.js";
|
|
4
4
|
import { t as r } from "./useInteractionEffect-ClkU3aH5.js";
|
|
5
|
-
import { r as i } from "./MButton-
|
|
5
|
+
import { r as i } from "./MButton-BpSZUhpY.js";
|
|
6
6
|
import { forwardRef as a, useCallback as o, useRef as ee, useState as s } from "react";
|
|
7
7
|
import { jsx as c, jsxs as l } from "react/jsx-runtime";
|
|
8
8
|
//#region src/utils/useControllableString.ts
|
|
@@ -183,4 +183,4 @@ var f = a(function({ type: a = "text", value: u, defaultValue: f, name: p, id: m
|
|
|
183
183
|
//#endregion
|
|
184
184
|
export { d as n, f as t };
|
|
185
185
|
|
|
186
|
-
//# sourceMappingURL=MInput-
|
|
186
|
+
//# sourceMappingURL=MInput-l3MY93Su.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MInput-3ynY4aGD.js","names":[],"sources":["../src/utils/useControllableString.ts","../src/components/inputs/MInput/MInput.tsx"],"sourcesContent":["import {useCallback, useState} from 'react'\n\ntype ControllableStringLike = string | number | readonly string[] | null | undefined\n\n// Normalize mixed input values so text-like controls always work with strings.\nfunction normalizeStringValue(value: ControllableStringLike) {\n if (value === null || value === undefined) {\n return ''\n }\n\n return value.toString()\n}\n\n// Share controlled and uncontrolled string state logic between text-like primitives.\nexport function useControllableString(value: ControllableStringLike, defaultValue?: ControllableStringLike) {\n const [internalValue, setInternalValue] = useState(() => normalizeStringValue(defaultValue))\n const isControlled = value !== undefined\n const currentValue = isControlled ? normalizeStringValue(value) : internalValue\n\n const setCurrentValue = useCallback(\n (nextValue: string) => {\n if (!isControlled) {\n setInternalValue(nextValue)\n }\n },\n [isControlled]\n )\n\n return {\n isControlled,\n currentValue,\n setCurrentValue,\n }\n}\n","import {forwardRef, useCallback, useRef, useState} from 'react'\nimport type * as React from 'react'\nimport type {MInputProps} from './MInput.types'\nimport {cn} from '../../../utils/cn'\nimport {useControllableString} from '../../../utils/useControllableString'\nimport {useInteractionEffect} from '../../../utils/useInteractionEffect'\nimport {useGhostText} from '../../../utils/useGhostText'\nimport {MSpinner} from '../../feedback'\nimport {MCloseIcon} from '../../../icons'\nimport './MInput.css'\n\n// Render the base text input used by all specialized input wrappers.\nexport const MInput = forwardRef<HTMLInputElement, MInputProps>(function MInput(\n {\n type = 'text',\n value,\n defaultValue,\n name,\n id,\n placeholder,\n disabled = false,\n readOnly = false,\n required = false,\n autoFocus = false,\n autoComplete,\n inputMode,\n variant = 'outlined',\n size = 'md',\n color,\n fullWidth = false,\n rounded = false,\n label,\n helperText,\n errorText,\n startIcon,\n endIcon,\n clearable = false,\n error = false,\n success = false,\n maxLength,\n showCharCount = false,\n onChange,\n onFocus,\n onBlur,\n onKeyDown,\n onClear,\n ghostOptions,\n ghostMinChars = 2,\n onGhostAccept,\n loading = false,\n clickEffect = 'ripple',\n rippleColor,\n className,\n style,\n inputClassName,\n labelClassName,\n },\n ref\n) {\n const [focused, setFocused] = useState(false)\n const inputRef = useRef<HTMLInputElement>(null)\n const {effectClassName, effectLayer, handlePointerDown} = useInteractionEffect<HTMLDivElement>({\n effect: clickEffect,\n disabled: disabled || readOnly,\n color: rippleColor,\n })\n\n const {isControlled, currentValue, setCurrentValue} = useControllableString(value, defaultValue)\n const ghost = useGhostText({\n options: ghostOptions ?? [],\n value: currentValue,\n minChars: ghostMinChars,\n })\n const hasError = error || !!errorText\n const hasContent = currentValue.length > 0\n const resolvedColorClass = hasError ? 'color-error' : color ? `color-${color}` : undefined\n\n // Mirror focus state so the wrapper can style the input consistently.\n const handleFocus = useCallback(\n (event: React.FocusEvent<HTMLInputElement>) => {\n setFocused(true)\n onFocus?.(event)\n },\n [onFocus]\n )\n\n // Clear focus styles before delegating to the caller.\n const handleBlur = useCallback(\n (event: React.FocusEvent<HTMLInputElement>) => {\n setFocused(false)\n onBlur?.(event)\n },\n [onBlur]\n )\n\n // Keep uncontrolled usage working without blocking controlled integrations.\n const handleChange = useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n setCurrentValue(event.target.value)\n onChange?.(event)\n ghost.reset()\n },\n [onChange, setCurrentValue, ghost.reset]\n )\n\n // Intercept keyboard events for ghost text acceptance before delegating.\n const handleKeyDown = useCallback(\n (event: React.KeyboardEvent<HTMLInputElement>) => {\n if (ghostOptions && ghost.hint) {\n const accepted = ghost.onKeyDown(event)\n if (accepted) {\n const result = ghost.accept()\n setCurrentValue(result.value)\n onGhostAccept?.(result.value)\n // Fire synthetic change so controlled parents stay in sync.\n const input = (ref as React.RefObject<HTMLInputElement>)?.current ?? inputRef.current\n if (input) {\n const nativeSet = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, 'value')?.set\n nativeSet?.call(input, result.value)\n input.dispatchEvent(new Event('input', {bubbles: true}))\n }\n return\n }\n }\n onKeyDown?.(event)\n },\n [ghostOptions, ghost, setCurrentValue, onGhostAccept, onKeyDown, ref]\n )\n\n // Reset the visible value while preserving focus for quick repeated input.\n const handleClear = useCallback(() => {\n setCurrentValue('')\n\n const input = (ref as React.RefObject<HTMLInputElement>)?.current ?? inputRef.current\n if (input) {\n const nativeSet = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, 'value')?.set\n nativeSet?.call(input, '')\n input.dispatchEvent(new Event('input', {bubbles: true}))\n }\n\n onClear?.()\n input?.focus()\n }, [onClear, ref, setCurrentValue])\n\n const containerClasses = cn(\n 'container',\n `field-${variant}`,\n `field-${size}`,\n focused && 'focused',\n hasError && 'input-error',\n success && !hasError && 'input-success',\n resolvedColorClass,\n disabled && 'disabled',\n rounded && 'rounded',\n effectClassName\n )\n\n return (\n <div className={cn('input', resolvedColorClass, fullWidth && 'full-width', className)} style={style}>\n {label && (\n <label\n htmlFor={id}\n className={cn(\n 'field-label',\n focused && 'focused',\n hasError && 'error',\n success && !hasError && 'success',\n required && 'required',\n labelClassName\n )}\n >\n {label}\n </label>\n )}\n\n <div className={containerClasses} onPointerDown={handlePointerDown}>\n {effectLayer}\n {startIcon && <span className=\"start-icon\">{startIcon}</span>}\n\n {ghostOptions ? (\n <div className=\"ghost-text-field\">\n <input\n ref={ref ?? inputRef}\n type={type}\n value={currentValue}\n name={name}\n id={id}\n placeholder={placeholder}\n disabled={disabled}\n readOnly={readOnly}\n required={required}\n autoFocus={autoFocus}\n autoComplete={autoComplete ?? 'off'}\n inputMode={inputMode}\n maxLength={maxLength}\n className={cn('field', inputClassName)}\n onChange={handleChange}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n aria-invalid={hasError || undefined}\n aria-describedby={errorText ? `${id}-error` : helperText ? `${id}-helper` : undefined}\n />\n {focused && ghost.hint && (\n <span className=\"ghost-text-overlay\" aria-hidden=\"true\">\n <span className=\"ghost-text-typed\">{currentValue}</span>\n <span className=\"ghost-text-hint\">{ghost.hint}</span>\n </span>\n )}\n </div>\n ) : (\n <input\n ref={ref ?? inputRef}\n type={type}\n value={currentValue}\n name={name}\n id={id}\n placeholder={placeholder}\n disabled={disabled}\n readOnly={readOnly}\n required={required}\n autoFocus={autoFocus}\n autoComplete={autoComplete}\n inputMode={inputMode}\n maxLength={maxLength}\n className={cn('field', inputClassName)}\n onChange={handleChange}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onKeyDown={onKeyDown}\n aria-invalid={hasError || undefined}\n aria-describedby={errorText ? `${id}-error` : helperText ? `${id}-helper` : undefined}\n />\n )}\n\n {loading && <MSpinner size=\"sm\" color={color} />}\n\n {clearable && hasContent && !loading && !disabled && (\n <button\n type=\"button\"\n className=\"clear-btn clear-btn-base\"\n onClick={handleClear}\n tabIndex={-1}\n aria-label=\"Clear input\"\n >\n <MCloseIcon />\n </button>\n )}\n\n {endIcon && !loading && <span className=\"end-icon\">{endIcon}</span>}\n </div>\n\n {(errorText || helperText || showCharCount) && (\n <div className=\"bottom-row\">\n <span>\n {errorText && (\n <span id={id ? `${id}-error` : undefined} className=\"field-error\" role=\"alert\">\n {errorText}\n </span>\n )}\n {!errorText && helperText && (\n <span id={id ? `${id}-helper` : undefined} className=\"field-helper\">\n {helperText}\n </span>\n )}\n </span>\n {showCharCount && maxLength && (\n <span className={cn('char-count', currentValue.length > maxLength && 'over')}>\n {currentValue.length}/{maxLength}\n </span>\n )}\n </div>\n )}\n </div>\n )\n})\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"MInput-l3MY93Su.js","names":[],"sources":["../src/utils/useControllableString.ts","../src/components/inputs/MInput/MInput.tsx"],"sourcesContent":["import {useCallback, useState} from 'react'\n\ntype ControllableStringLike = string | number | readonly string[] | null | undefined\n\n// Normalize mixed input values so text-like controls always work with strings.\nfunction normalizeStringValue(value: ControllableStringLike) {\n if (value === null || value === undefined) {\n return ''\n }\n\n return value.toString()\n}\n\n// Share controlled and uncontrolled string state logic between text-like primitives.\nexport function useControllableString(value: ControllableStringLike, defaultValue?: ControllableStringLike) {\n const [internalValue, setInternalValue] = useState(() => normalizeStringValue(defaultValue))\n const isControlled = value !== undefined\n const currentValue = isControlled ? normalizeStringValue(value) : internalValue\n\n const setCurrentValue = useCallback(\n (nextValue: string) => {\n if (!isControlled) {\n setInternalValue(nextValue)\n }\n },\n [isControlled]\n )\n\n return {\n isControlled,\n currentValue,\n setCurrentValue,\n }\n}\n","import {forwardRef, useCallback, useRef, useState} from 'react'\nimport type * as React from 'react'\nimport type {MInputProps} from './MInput.types'\nimport {cn} from '../../../utils/cn'\nimport {useControllableString} from '../../../utils/useControllableString'\nimport {useInteractionEffect} from '../../../utils/useInteractionEffect'\nimport {useGhostText} from '../../../utils/useGhostText'\nimport {MSpinner} from '../../feedback'\nimport {MCloseIcon} from '../../../icons'\nimport './MInput.css'\n\n// Render the base text input used by all specialized input wrappers.\nexport const MInput = forwardRef<HTMLInputElement, MInputProps>(function MInput(\n {\n type = 'text',\n value,\n defaultValue,\n name,\n id,\n placeholder,\n disabled = false,\n readOnly = false,\n required = false,\n autoFocus = false,\n autoComplete,\n inputMode,\n variant = 'outlined',\n size = 'md',\n color,\n fullWidth = false,\n rounded = false,\n label,\n helperText,\n errorText,\n startIcon,\n endIcon,\n clearable = false,\n error = false,\n success = false,\n maxLength,\n showCharCount = false,\n onChange,\n onFocus,\n onBlur,\n onKeyDown,\n onClear,\n ghostOptions,\n ghostMinChars = 2,\n onGhostAccept,\n loading = false,\n clickEffect = 'ripple',\n rippleColor,\n className,\n style,\n inputClassName,\n labelClassName,\n },\n ref\n) {\n const [focused, setFocused] = useState(false)\n const inputRef = useRef<HTMLInputElement>(null)\n const {effectClassName, effectLayer, handlePointerDown} = useInteractionEffect<HTMLDivElement>({\n effect: clickEffect,\n disabled: disabled || readOnly,\n color: rippleColor,\n })\n\n const {isControlled, currentValue, setCurrentValue} = useControllableString(value, defaultValue)\n const ghost = useGhostText({\n options: ghostOptions ?? [],\n value: currentValue,\n minChars: ghostMinChars,\n })\n const hasError = error || !!errorText\n const hasContent = currentValue.length > 0\n const resolvedColorClass = hasError ? 'color-error' : color ? `color-${color}` : undefined\n\n // Mirror focus state so the wrapper can style the input consistently.\n const handleFocus = useCallback(\n (event: React.FocusEvent<HTMLInputElement>) => {\n setFocused(true)\n onFocus?.(event)\n },\n [onFocus]\n )\n\n // Clear focus styles before delegating to the caller.\n const handleBlur = useCallback(\n (event: React.FocusEvent<HTMLInputElement>) => {\n setFocused(false)\n onBlur?.(event)\n },\n [onBlur]\n )\n\n // Keep uncontrolled usage working without blocking controlled integrations.\n const handleChange = useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n setCurrentValue(event.target.value)\n onChange?.(event)\n ghost.reset()\n },\n [onChange, setCurrentValue, ghost.reset]\n )\n\n // Intercept keyboard events for ghost text acceptance before delegating.\n const handleKeyDown = useCallback(\n (event: React.KeyboardEvent<HTMLInputElement>) => {\n if (ghostOptions && ghost.hint) {\n const accepted = ghost.onKeyDown(event)\n if (accepted) {\n const result = ghost.accept()\n setCurrentValue(result.value)\n onGhostAccept?.(result.value)\n // Fire synthetic change so controlled parents stay in sync.\n const input = (ref as React.RefObject<HTMLInputElement>)?.current ?? inputRef.current\n if (input) {\n const nativeSet = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, 'value')?.set\n nativeSet?.call(input, result.value)\n input.dispatchEvent(new Event('input', {bubbles: true}))\n }\n return\n }\n }\n onKeyDown?.(event)\n },\n [ghostOptions, ghost, setCurrentValue, onGhostAccept, onKeyDown, ref]\n )\n\n // Reset the visible value while preserving focus for quick repeated input.\n const handleClear = useCallback(() => {\n setCurrentValue('')\n\n const input = (ref as React.RefObject<HTMLInputElement>)?.current ?? inputRef.current\n if (input) {\n const nativeSet = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, 'value')?.set\n nativeSet?.call(input, '')\n input.dispatchEvent(new Event('input', {bubbles: true}))\n }\n\n onClear?.()\n input?.focus()\n }, [onClear, ref, setCurrentValue])\n\n const containerClasses = cn(\n 'container',\n `field-${variant}`,\n `field-${size}`,\n focused && 'focused',\n hasError && 'input-error',\n success && !hasError && 'input-success',\n resolvedColorClass,\n disabled && 'disabled',\n rounded && 'rounded',\n effectClassName\n )\n\n return (\n <div className={cn('input', resolvedColorClass, fullWidth && 'full-width', className)} style={style}>\n {label && (\n <label\n htmlFor={id}\n className={cn(\n 'field-label',\n focused && 'focused',\n hasError && 'error',\n success && !hasError && 'success',\n required && 'required',\n labelClassName\n )}\n >\n {label}\n </label>\n )}\n\n <div className={containerClasses} onPointerDown={handlePointerDown}>\n {effectLayer}\n {startIcon && <span className=\"start-icon\">{startIcon}</span>}\n\n {ghostOptions ? (\n <div className=\"ghost-text-field\">\n <input\n ref={ref ?? inputRef}\n type={type}\n value={currentValue}\n name={name}\n id={id}\n placeholder={placeholder}\n disabled={disabled}\n readOnly={readOnly}\n required={required}\n autoFocus={autoFocus}\n autoComplete={autoComplete ?? 'off'}\n inputMode={inputMode}\n maxLength={maxLength}\n className={cn('field', inputClassName)}\n onChange={handleChange}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n aria-invalid={hasError || undefined}\n aria-describedby={errorText ? `${id}-error` : helperText ? `${id}-helper` : undefined}\n />\n {focused && ghost.hint && (\n <span className=\"ghost-text-overlay\" aria-hidden=\"true\">\n <span className=\"ghost-text-typed\">{currentValue}</span>\n <span className=\"ghost-text-hint\">{ghost.hint}</span>\n </span>\n )}\n </div>\n ) : (\n <input\n ref={ref ?? inputRef}\n type={type}\n value={currentValue}\n name={name}\n id={id}\n placeholder={placeholder}\n disabled={disabled}\n readOnly={readOnly}\n required={required}\n autoFocus={autoFocus}\n autoComplete={autoComplete}\n inputMode={inputMode}\n maxLength={maxLength}\n className={cn('field', inputClassName)}\n onChange={handleChange}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onKeyDown={onKeyDown}\n aria-invalid={hasError || undefined}\n aria-describedby={errorText ? `${id}-error` : helperText ? `${id}-helper` : undefined}\n />\n )}\n\n {loading && <MSpinner size=\"sm\" color={color} />}\n\n {clearable && hasContent && !loading && !disabled && (\n <button\n type=\"button\"\n className=\"clear-btn clear-btn-base\"\n onClick={handleClear}\n tabIndex={-1}\n aria-label=\"Clear input\"\n >\n <MCloseIcon />\n </button>\n )}\n\n {endIcon && !loading && <span className=\"end-icon\">{endIcon}</span>}\n </div>\n\n {(errorText || helperText || showCharCount) && (\n <div className=\"bottom-row\">\n <span>\n {errorText && (\n <span id={id ? `${id}-error` : undefined} className=\"field-error\" role=\"alert\">\n {errorText}\n </span>\n )}\n {!errorText && helperText && (\n <span id={id ? `${id}-helper` : undefined} className=\"field-helper\">\n {helperText}\n </span>\n )}\n </span>\n {showCharCount && maxLength && (\n <span className={cn('char-count', currentValue.length > maxLength && 'over')}>\n {currentValue.length}/{maxLength}\n </span>\n )}\n </div>\n )}\n </div>\n )\n})\n"],"mappings":"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"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { Ii as e, Li as t, Ni as n } from "./icons-DlNO04xH.js";
|
|
2
2
|
import { t as r } from "./cn-CUSXNnjF.js";
|
|
3
|
-
import { n as i, t as a } from "./MInput-
|
|
4
|
-
import { i as o, r as s } from "./MDropdownMenu-
|
|
3
|
+
import { n as i, t as a } from "./MInput-l3MY93Su.js";
|
|
4
|
+
import { i as o, r as s } from "./MDropdownMenu-CMnBt-wO.js";
|
|
5
5
|
import { forwardRef as c, useCallback as l, useMemo as u, useRef as d, useState as f } from "react";
|
|
6
6
|
import { jsx as p, jsxs as m } from "react/jsx-runtime";
|
|
7
7
|
//#region src/components/inputs/MInputExpDate/MInputExpDate.tsx
|
|
@@ -317,4 +317,4 @@ var w = c(function({ length: t = 3, validateOnBlur: n = !0, validateOnChange: i
|
|
|
317
317
|
//#endregion
|
|
318
318
|
export { x as n, w as t };
|
|
319
319
|
|
|
320
|
-
//# sourceMappingURL=MInputCVC-
|
|
320
|
+
//# sourceMappingURL=MInputCVC-CN91scmw.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MInputCVC-BO251yU6.js","names":[],"sources":["../src/components/inputs/MInputExpDate/MInputExpDate.tsx","../src/components/inputs/MInputCVC/MInputCVC.tsx"],"sourcesContent":["import {forwardRef, useCallback, useMemo, useRef, useState} from 'react'\nimport type * as React from 'react'\nimport type {MInputExpDateProps} from './MInputExpDate.types'\nimport {cn} from '../../../utils/cn'\nimport {useControllableString} from '../../../utils/useControllableString'\nimport type {ValidationResult} from '../../../utils/validators'\nimport {MCloseIcon, MChevronDownIcon} from '../../../icons'\nimport {MDropdownItem, MDropdownMenu} from '../../overlays'\nimport '../MInput/MInput.css'\nimport './MInputExpDate.css'\n\nconst OK: ValidationResult = {valid: true}\n\nfunction stripDigits(value: string) {\n return value.replace(/\\D/g, '')\n}\n\nfunction padMonth(value?: string) {\n if (!value) {\n return ''\n }\n\n return value.padStart(2, '0').slice(0, 2)\n}\n\nfunction formatValue(month?: string, year?: string) {\n const resolvedMonth = padMonth(month)\n const resolvedYear = year?.slice(0, 4) ?? ''\n\n if (!resolvedMonth && !resolvedYear) {\n return ''\n }\n\n if (!resolvedYear) {\n return resolvedMonth\n }\n\n return `${resolvedMonth}/${resolvedYear}`\n}\n\nfunction parseValue(value: string) {\n const digits = stripDigits(value).slice(0, 6)\n\n return {\n month: digits.slice(0, 2),\n year: digits.slice(2, 6),\n }\n}\n\nfunction resolveYearBounds(minYear?: number, maxYear?: number) {\n const currentYear = new Date().getFullYear()\n const resolvedMinYear = Math.max(minYear ?? currentYear, currentYear)\n const resolvedMaxYear = Math.max(maxYear ?? currentYear + 20, resolvedMinYear)\n\n return {\n resolvedMinYear,\n resolvedMaxYear,\n }\n}\n\nfunction validateExpDate(\n value: string,\n {minYear, maxYear}: Pick<MInputExpDateProps, 'minYear' | 'maxYear'>\n): ValidationResult {\n if (!value) {\n return OK\n }\n\n const {month: monthValue, year: yearValue} = parseValue(value)\n\n if (monthValue.length !== 2 || yearValue.length !== 4) {\n return {valid: false, error: 'Expiration date is incomplete'}\n }\n\n const month = parseInt(monthValue, 10)\n const year = parseInt(yearValue, 10)\n const {resolvedMinYear, resolvedMaxYear} = resolveYearBounds(minYear, maxYear)\n\n if (Number.isNaN(month) || month < 1 || month > 12) {\n return {valid: false, error: 'Use a valid month'}\n }\n\n if (Number.isNaN(year)) {\n return {valid: false, error: 'Use a valid year'}\n }\n\n if (year < resolvedMinYear) {\n return {valid: false, error: `Year must be ${resolvedMinYear} or later`}\n }\n\n if (year > resolvedMaxYear) {\n return {valid: false, error: `Year must be ${resolvedMaxYear} or earlier`}\n }\n\n const now = new Date()\n const currentMonth = now.getMonth() + 1\n const currentYear = now.getFullYear()\n\n if (year < currentYear || (year === currentYear && month < currentMonth)) {\n return {valid: false, error: 'Card has expired'}\n }\n\n return OK\n}\n\nexport const MInputExpDate = forwardRef<HTMLInputElement, MInputExpDateProps>(function MInputExpDate(\n {\n validateOnBlur = true,\n validateOnChange = false,\n minYear,\n maxYear,\n onValidationChange,\n onValueChange,\n value,\n defaultValue,\n name,\n id,\n disabled = false,\n readOnly = false,\n required = false,\n autoFocus = false,\n variant = 'outlined',\n size = 'md',\n color,\n fullWidth = false,\n rounded = false,\n label,\n helperText,\n errorText,\n startIcon,\n endIcon,\n clearable = false,\n error = false,\n success,\n onChange,\n onFocus,\n onBlur,\n onClear,\n className,\n style,\n labelClassName,\n },\n ref\n) {\n const inputRef = useRef<HTMLInputElement>(null)\n const rootRef = useRef<HTMLDivElement>(null)\n const {currentValue, setCurrentValue} = useControllableString(value, defaultValue)\n const [validation, setValidation] = useState<ValidationResult>(OK)\n const [touched, setTouched] = useState(false)\n const [focused, setFocused] = useState(false)\n const [monthMenuOpen, setMonthMenuOpen] = useState(false)\n const [yearMenuOpen, setYearMenuOpen] = useState(false)\n\n const {month, year} = parseValue(currentValue)\n const hasContent = Boolean(month || year)\n const segmentDisabled = disabled || readOnly\n const {resolvedMinYear, resolvedMaxYear} = resolveYearBounds(minYear, maxYear)\n const yearOptions = useMemo(\n () => Array.from({length: resolvedMaxYear - resolvedMinYear + 1}, (_, index) => resolvedMinYear + index),\n [resolvedMaxYear, resolvedMinYear]\n )\n\n const runValidation = useCallback(\n (formattedValue: string) => {\n const result = validateExpDate(formattedValue, {minYear, maxYear})\n setValidation(result)\n onValidationChange?.(result)\n return result\n },\n [maxYear, minYear, onValidationChange]\n )\n\n const syncValue = useCallback(\n (formattedValue: string) => {\n setCurrentValue(formattedValue)\n onValueChange?.(stripDigits(formattedValue), formattedValue)\n\n const input = (ref as React.RefObject<HTMLInputElement>)?.current ?? inputRef.current\n if (input) {\n const nativeSet = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, 'value')?.set\n nativeSet?.call(input, formattedValue)\n input.dispatchEvent(new Event('input', {bubbles: true}))\n }\n },\n [onValueChange, ref, setCurrentValue]\n )\n\n const updateValue = useCallback(\n (nextMonth?: string, nextYear?: string) => {\n const formattedValue = formatValue(nextMonth, nextYear)\n syncValue(formattedValue)\n\n if (validateOnChange && touched) {\n runValidation(formattedValue)\n }\n },\n [runValidation, syncValue, touched, validateOnChange]\n )\n\n const focusHiddenInput = useCallback(() => {\n const input = (ref as React.RefObject<HTMLInputElement>)?.current ?? inputRef.current\n input?.focus()\n }, [ref])\n\n const handleRootFocus = useCallback(\n (event: React.FocusEvent<HTMLDivElement>) => {\n if (focused) {\n return\n }\n\n setFocused(true)\n const input = (ref as React.RefObject<HTMLInputElement>)?.current ?? inputRef.current\n if (input && event.target !== input) {\n onFocus?.(event as unknown as React.FocusEvent<HTMLInputElement>)\n }\n },\n [focused, onFocus, ref]\n )\n\n const handleRootBlur = useCallback(\n (event: React.FocusEvent<HTMLDivElement>) => {\n const nextTarget = event.relatedTarget as Node | null\n\n if (nextTarget && rootRef.current?.contains(nextTarget)) {\n return\n }\n\n setFocused(false)\n setTouched(true)\n\n if (validateOnBlur && currentValue) {\n runValidation(currentValue)\n }\n\n onBlur?.(event as unknown as React.FocusEvent<HTMLInputElement>)\n },\n [currentValue, onBlur, runValidation, validateOnBlur]\n )\n\n const handleSelectMonth = useCallback(\n (nextMonth: string) => {\n focusHiddenInput()\n updateValue(nextMonth, year)\n },\n [focusHiddenInput, updateValue, year]\n )\n\n const handleSelectYear = useCallback(\n (nextYear: string) => {\n focusHiddenInput()\n updateValue(month, nextYear)\n },\n [focusHiddenInput, month, updateValue]\n )\n\n const handleClear = useCallback(() => {\n syncValue('')\n setTouched(false)\n setValidation(OK)\n onValidationChange?.(OK)\n onClear?.()\n focusHiddenInput()\n }, [focusHiddenInput, onClear, onValidationChange, syncValue])\n\n const hasError = error || (touched && !validation.valid)\n const resolvedErrorText = errorText || (touched && !validation.valid ? validation.error : undefined)\n const isSuccess =\n !hasError && (success !== undefined ? success : touched && validation.valid && Boolean(month && year))\n const resolvedColorClass = hasError ? 'color-error' : color ? `color-${color}` : undefined\n\n const containerClasses = cn(\n 'container',\n `field-${variant}`,\n `field-${size}`,\n focused && 'focused',\n hasError && 'input-error',\n isSuccess && !hasError && 'input-success',\n resolvedColorClass,\n disabled && 'disabled',\n rounded && 'rounded'\n )\n\n const monthLabel = month || 'MM'\n const yearLabel = year || 'YYYY'\n\n return (\n <div\n ref={rootRef}\n className={cn('input', 'input-exp-date', resolvedColorClass, fullWidth && 'full-width', className)}\n style={style}\n onFocusCapture={handleRootFocus}\n onBlurCapture={handleRootBlur}\n >\n {label && (\n <label\n htmlFor={id}\n className={cn(\n 'field-label',\n focused && 'focused',\n hasError && 'error',\n isSuccess && !hasError && 'success',\n required && 'required',\n labelClassName\n )}\n >\n {label}\n </label>\n )}\n\n <div className={containerClasses} onClick={focusHiddenInput}>\n {startIcon && <span className=\"start-icon\">{startIcon}</span>}\n\n <input\n ref={ref ?? inputRef}\n type=\"text\"\n value={currentValue}\n name={name}\n id={id}\n readOnly\n required={required}\n autoFocus={autoFocus}\n className=\"input-exp-date-native\"\n tabIndex={-1}\n aria-hidden=\"true\"\n onChange={onChange}\n onFocus={onFocus}\n onBlur={onBlur}\n />\n\n <div className=\"input-exp-date-segments\" aria-label=\"Expiration date\">\n {segmentDisabled ? (\n <span className={cn('input-exp-date-trigger', !month && 'placeholder', 'static')}>\n <span>{monthLabel}</span>\n </span>\n ) : (\n <MDropdownMenu\n trigger={\n <span\n className={cn(\n 'input-exp-date-trigger',\n monthMenuOpen && 'open',\n !month && 'placeholder'\n )}\n onMouseDown={focusHiddenInput}\n >\n <span>{monthLabel}</span>\n <MChevronDownIcon size={16} />\n </span>\n }\n openOn=\"click\"\n closeOnSelect\n onOpenChange={setMonthMenuOpen}\n popoverClassName=\"input-exp-date-popover\"\n >\n {Array.from({length: 12}, (_, index) => {\n const option = String(index + 1).padStart(2, '0')\n\n return (\n <MDropdownItem\n key={option}\n label={option}\n active={month === option}\n onClick={() => handleSelectMonth(option)}\n />\n )\n })}\n </MDropdownMenu>\n )}\n\n <span className=\"input-exp-date-separator\">/</span>\n\n {segmentDisabled ? (\n <span className={cn('input-exp-date-trigger', !year && 'placeholder', 'static')}>\n <span>{yearLabel}</span>\n </span>\n ) : (\n <MDropdownMenu\n trigger={\n <span\n className={cn(\n 'input-exp-date-trigger',\n yearMenuOpen && 'open',\n !year && 'placeholder'\n )}\n onMouseDown={focusHiddenInput}\n >\n <span>{yearLabel}</span>\n <MChevronDownIcon size={16} />\n </span>\n }\n openOn=\"click\"\n closeOnSelect\n onOpenChange={setYearMenuOpen}\n popoverClassName=\"input-exp-date-popover\"\n >\n {yearOptions.map((option) => (\n <MDropdownItem\n key={option}\n label={String(option)}\n active={year === String(option)}\n onClick={() => handleSelectYear(String(option))}\n />\n ))}\n </MDropdownMenu>\n )}\n </div>\n\n {clearable && hasContent && !segmentDisabled && (\n <button\n type=\"button\"\n className=\"clear-btn clear-btn-base\"\n onClick={(event) => {\n event.stopPropagation()\n handleClear()\n }}\n tabIndex={-1}\n aria-label=\"Clear input\"\n >\n <MCloseIcon />\n </button>\n )}\n\n {endIcon && <span className=\"end-icon\">{endIcon}</span>}\n </div>\n\n {(resolvedErrorText || helperText) && (\n <div className=\"bottom-row\">\n <span>\n {resolvedErrorText && (\n <span id={id ? `${id}-error` : undefined} className=\"field-error\" role=\"alert\">\n {resolvedErrorText}\n </span>\n )}\n {!resolvedErrorText && helperText && (\n <span id={id ? `${id}-helper` : undefined} className=\"field-helper\">\n {helperText}\n </span>\n )}\n </span>\n </div>\n )}\n </div>\n )\n})\n","import {forwardRef, useCallback, useState} from 'react'\nimport type * as React from 'react'\nimport type {MInputCVCProps} from './MInputCVC.types'\nimport {MInput} from '../MInput'\nimport type {ValidationResult} from '../../../utils/validators'\nimport {MCheckIcon} from '../../../icons'\nimport {cn} from '../../../utils/cn'\nimport './MInputCVC.css'\n\nconst OK: ValidationResult = {valid: true}\n\nfunction stripDigits(value: string) {\n return value.replace(/\\D/g, '')\n}\n\nfunction validateCvc(value: string, length: 3 | 4): ValidationResult {\n if (!value) {\n return OK\n }\n\n const digits = stripDigits(value)\n\n if (digits.length !== length) {\n return {valid: false, error: `Security code must have ${length} digits`}\n }\n\n return OK\n}\n\nexport const MInputCVC = forwardRef<HTMLInputElement, MInputCVCProps>(function MInputCVC(\n {\n length = 3,\n validateOnBlur = true,\n validateOnChange = false,\n onValidationChange,\n onValueChange,\n value,\n defaultValue,\n onChange,\n onBlur,\n onKeyDown,\n error,\n errorText,\n success,\n placeholder,\n className,\n inputClassName,\n ...rest\n },\n ref\n) {\n const [internalValue, setInternalValue] = useState(() =>\n stripDigits(defaultValue?.toString() ?? '').slice(0, length)\n )\n const [validation, setValidation] = useState<ValidationResult>(OK)\n const [touched, setTouched] = useState(false)\n\n const currentValue = value !== undefined ? stripDigits(value.toString()).slice(0, length) : internalValue\n\n const runValidation = useCallback(\n (nextValue: string) => {\n const result = validateCvc(nextValue, length)\n setValidation(result)\n onValidationChange?.(result)\n return result\n },\n [length, onValidationChange]\n )\n\n const handleChange = useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n const nextValue = stripDigits(event.target.value).slice(0, length)\n\n if (value === undefined) {\n setInternalValue(nextValue)\n }\n\n onValueChange?.(nextValue)\n\n if (validateOnChange && touched) {\n runValidation(nextValue)\n }\n\n onChange?.(event)\n },\n [length, onChange, onValueChange, runValidation, touched, validateOnChange, value]\n )\n\n const handleBlur = useCallback(\n (event: React.FocusEvent<HTMLInputElement>) => {\n setTouched(true)\n\n if (validateOnBlur && currentValue) {\n runValidation(currentValue)\n }\n\n onBlur?.(event)\n },\n [currentValue, onBlur, runValidation, validateOnBlur]\n )\n\n const handleKeyDown = useCallback(\n (event: React.KeyboardEvent<HTMLInputElement>) => {\n if (['Backspace', 'Delete', 'Tab', 'ArrowLeft', 'ArrowRight', 'Home', 'End'].includes(event.key)) {\n onKeyDown?.(event)\n return\n }\n\n if (event.ctrlKey || event.metaKey) {\n onKeyDown?.(event)\n return\n }\n\n if (!/^\\d$/.test(event.key)) {\n event.preventDefault()\n }\n\n onKeyDown?.(event)\n },\n [onKeyDown]\n )\n\n const isError = error || (touched && !validation.valid)\n const resolvedErrorText = errorText || (touched && !validation.valid ? validation.error : undefined)\n const isSuccess = !isError && (success !== undefined ? success : touched && currentValue.length === length)\n const endIcon = isSuccess ? <MCheckIcon /> : undefined\n\n return (\n <MInput\n {...rest}\n ref={ref}\n type=\"text\"\n inputMode=\"numeric\"\n value={currentValue}\n onChange={handleChange}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n error={isError}\n errorText={resolvedErrorText}\n success={isSuccess}\n placeholder={placeholder ?? ''.padEnd(length, '0')}\n maxLength={length}\n endIcon={endIcon}\n inputClassName={cn('input-cvc-field', inputClassName)}\n className={className}\n />\n )\n})\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"MInputCVC-CN91scmw.js","names":[],"sources":["../src/components/inputs/MInputExpDate/MInputExpDate.tsx","../src/components/inputs/MInputCVC/MInputCVC.tsx"],"sourcesContent":["import {forwardRef, useCallback, useMemo, useRef, useState} from 'react'\nimport type * as React from 'react'\nimport type {MInputExpDateProps} from './MInputExpDate.types'\nimport {cn} from '../../../utils/cn'\nimport {useControllableString} from '../../../utils/useControllableString'\nimport type {ValidationResult} from '../../../utils/validators'\nimport {MCloseIcon, MChevronDownIcon} from '../../../icons'\nimport {MDropdownItem, MDropdownMenu} from '../../overlays'\nimport '../MInput/MInput.css'\nimport './MInputExpDate.css'\n\nconst OK: ValidationResult = {valid: true}\n\nfunction stripDigits(value: string) {\n return value.replace(/\\D/g, '')\n}\n\nfunction padMonth(value?: string) {\n if (!value) {\n return ''\n }\n\n return value.padStart(2, '0').slice(0, 2)\n}\n\nfunction formatValue(month?: string, year?: string) {\n const resolvedMonth = padMonth(month)\n const resolvedYear = year?.slice(0, 4) ?? ''\n\n if (!resolvedMonth && !resolvedYear) {\n return ''\n }\n\n if (!resolvedYear) {\n return resolvedMonth\n }\n\n return `${resolvedMonth}/${resolvedYear}`\n}\n\nfunction parseValue(value: string) {\n const digits = stripDigits(value).slice(0, 6)\n\n return {\n month: digits.slice(0, 2),\n year: digits.slice(2, 6),\n }\n}\n\nfunction resolveYearBounds(minYear?: number, maxYear?: number) {\n const currentYear = new Date().getFullYear()\n const resolvedMinYear = Math.max(minYear ?? currentYear, currentYear)\n const resolvedMaxYear = Math.max(maxYear ?? currentYear + 20, resolvedMinYear)\n\n return {\n resolvedMinYear,\n resolvedMaxYear,\n }\n}\n\nfunction validateExpDate(\n value: string,\n {minYear, maxYear}: Pick<MInputExpDateProps, 'minYear' | 'maxYear'>\n): ValidationResult {\n if (!value) {\n return OK\n }\n\n const {month: monthValue, year: yearValue} = parseValue(value)\n\n if (monthValue.length !== 2 || yearValue.length !== 4) {\n return {valid: false, error: 'Expiration date is incomplete'}\n }\n\n const month = parseInt(monthValue, 10)\n const year = parseInt(yearValue, 10)\n const {resolvedMinYear, resolvedMaxYear} = resolveYearBounds(minYear, maxYear)\n\n if (Number.isNaN(month) || month < 1 || month > 12) {\n return {valid: false, error: 'Use a valid month'}\n }\n\n if (Number.isNaN(year)) {\n return {valid: false, error: 'Use a valid year'}\n }\n\n if (year < resolvedMinYear) {\n return {valid: false, error: `Year must be ${resolvedMinYear} or later`}\n }\n\n if (year > resolvedMaxYear) {\n return {valid: false, error: `Year must be ${resolvedMaxYear} or earlier`}\n }\n\n const now = new Date()\n const currentMonth = now.getMonth() + 1\n const currentYear = now.getFullYear()\n\n if (year < currentYear || (year === currentYear && month < currentMonth)) {\n return {valid: false, error: 'Card has expired'}\n }\n\n return OK\n}\n\nexport const MInputExpDate = forwardRef<HTMLInputElement, MInputExpDateProps>(function MInputExpDate(\n {\n validateOnBlur = true,\n validateOnChange = false,\n minYear,\n maxYear,\n onValidationChange,\n onValueChange,\n value,\n defaultValue,\n name,\n id,\n disabled = false,\n readOnly = false,\n required = false,\n autoFocus = false,\n variant = 'outlined',\n size = 'md',\n color,\n fullWidth = false,\n rounded = false,\n label,\n helperText,\n errorText,\n startIcon,\n endIcon,\n clearable = false,\n error = false,\n success,\n onChange,\n onFocus,\n onBlur,\n onClear,\n className,\n style,\n labelClassName,\n },\n ref\n) {\n const inputRef = useRef<HTMLInputElement>(null)\n const rootRef = useRef<HTMLDivElement>(null)\n const {currentValue, setCurrentValue} = useControllableString(value, defaultValue)\n const [validation, setValidation] = useState<ValidationResult>(OK)\n const [touched, setTouched] = useState(false)\n const [focused, setFocused] = useState(false)\n const [monthMenuOpen, setMonthMenuOpen] = useState(false)\n const [yearMenuOpen, setYearMenuOpen] = useState(false)\n\n const {month, year} = parseValue(currentValue)\n const hasContent = Boolean(month || year)\n const segmentDisabled = disabled || readOnly\n const {resolvedMinYear, resolvedMaxYear} = resolveYearBounds(minYear, maxYear)\n const yearOptions = useMemo(\n () => Array.from({length: resolvedMaxYear - resolvedMinYear + 1}, (_, index) => resolvedMinYear + index),\n [resolvedMaxYear, resolvedMinYear]\n )\n\n const runValidation = useCallback(\n (formattedValue: string) => {\n const result = validateExpDate(formattedValue, {minYear, maxYear})\n setValidation(result)\n onValidationChange?.(result)\n return result\n },\n [maxYear, minYear, onValidationChange]\n )\n\n const syncValue = useCallback(\n (formattedValue: string) => {\n setCurrentValue(formattedValue)\n onValueChange?.(stripDigits(formattedValue), formattedValue)\n\n const input = (ref as React.RefObject<HTMLInputElement>)?.current ?? inputRef.current\n if (input) {\n const nativeSet = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, 'value')?.set\n nativeSet?.call(input, formattedValue)\n input.dispatchEvent(new Event('input', {bubbles: true}))\n }\n },\n [onValueChange, ref, setCurrentValue]\n )\n\n const updateValue = useCallback(\n (nextMonth?: string, nextYear?: string) => {\n const formattedValue = formatValue(nextMonth, nextYear)\n syncValue(formattedValue)\n\n if (validateOnChange && touched) {\n runValidation(formattedValue)\n }\n },\n [runValidation, syncValue, touched, validateOnChange]\n )\n\n const focusHiddenInput = useCallback(() => {\n const input = (ref as React.RefObject<HTMLInputElement>)?.current ?? inputRef.current\n input?.focus()\n }, [ref])\n\n const handleRootFocus = useCallback(\n (event: React.FocusEvent<HTMLDivElement>) => {\n if (focused) {\n return\n }\n\n setFocused(true)\n const input = (ref as React.RefObject<HTMLInputElement>)?.current ?? inputRef.current\n if (input && event.target !== input) {\n onFocus?.(event as unknown as React.FocusEvent<HTMLInputElement>)\n }\n },\n [focused, onFocus, ref]\n )\n\n const handleRootBlur = useCallback(\n (event: React.FocusEvent<HTMLDivElement>) => {\n const nextTarget = event.relatedTarget as Node | null\n\n if (nextTarget && rootRef.current?.contains(nextTarget)) {\n return\n }\n\n setFocused(false)\n setTouched(true)\n\n if (validateOnBlur && currentValue) {\n runValidation(currentValue)\n }\n\n onBlur?.(event as unknown as React.FocusEvent<HTMLInputElement>)\n },\n [currentValue, onBlur, runValidation, validateOnBlur]\n )\n\n const handleSelectMonth = useCallback(\n (nextMonth: string) => {\n focusHiddenInput()\n updateValue(nextMonth, year)\n },\n [focusHiddenInput, updateValue, year]\n )\n\n const handleSelectYear = useCallback(\n (nextYear: string) => {\n focusHiddenInput()\n updateValue(month, nextYear)\n },\n [focusHiddenInput, month, updateValue]\n )\n\n const handleClear = useCallback(() => {\n syncValue('')\n setTouched(false)\n setValidation(OK)\n onValidationChange?.(OK)\n onClear?.()\n focusHiddenInput()\n }, [focusHiddenInput, onClear, onValidationChange, syncValue])\n\n const hasError = error || (touched && !validation.valid)\n const resolvedErrorText = errorText || (touched && !validation.valid ? validation.error : undefined)\n const isSuccess =\n !hasError && (success !== undefined ? success : touched && validation.valid && Boolean(month && year))\n const resolvedColorClass = hasError ? 'color-error' : color ? `color-${color}` : undefined\n\n const containerClasses = cn(\n 'container',\n `field-${variant}`,\n `field-${size}`,\n focused && 'focused',\n hasError && 'input-error',\n isSuccess && !hasError && 'input-success',\n resolvedColorClass,\n disabled && 'disabled',\n rounded && 'rounded'\n )\n\n const monthLabel = month || 'MM'\n const yearLabel = year || 'YYYY'\n\n return (\n <div\n ref={rootRef}\n className={cn('input', 'input-exp-date', resolvedColorClass, fullWidth && 'full-width', className)}\n style={style}\n onFocusCapture={handleRootFocus}\n onBlurCapture={handleRootBlur}\n >\n {label && (\n <label\n htmlFor={id}\n className={cn(\n 'field-label',\n focused && 'focused',\n hasError && 'error',\n isSuccess && !hasError && 'success',\n required && 'required',\n labelClassName\n )}\n >\n {label}\n </label>\n )}\n\n <div className={containerClasses} onClick={focusHiddenInput}>\n {startIcon && <span className=\"start-icon\">{startIcon}</span>}\n\n <input\n ref={ref ?? inputRef}\n type=\"text\"\n value={currentValue}\n name={name}\n id={id}\n readOnly\n required={required}\n autoFocus={autoFocus}\n className=\"input-exp-date-native\"\n tabIndex={-1}\n aria-hidden=\"true\"\n onChange={onChange}\n onFocus={onFocus}\n onBlur={onBlur}\n />\n\n <div className=\"input-exp-date-segments\" aria-label=\"Expiration date\">\n {segmentDisabled ? (\n <span className={cn('input-exp-date-trigger', !month && 'placeholder', 'static')}>\n <span>{monthLabel}</span>\n </span>\n ) : (\n <MDropdownMenu\n trigger={\n <span\n className={cn(\n 'input-exp-date-trigger',\n monthMenuOpen && 'open',\n !month && 'placeholder'\n )}\n onMouseDown={focusHiddenInput}\n >\n <span>{monthLabel}</span>\n <MChevronDownIcon size={16} />\n </span>\n }\n openOn=\"click\"\n closeOnSelect\n onOpenChange={setMonthMenuOpen}\n popoverClassName=\"input-exp-date-popover\"\n >\n {Array.from({length: 12}, (_, index) => {\n const option = String(index + 1).padStart(2, '0')\n\n return (\n <MDropdownItem\n key={option}\n label={option}\n active={month === option}\n onClick={() => handleSelectMonth(option)}\n />\n )\n })}\n </MDropdownMenu>\n )}\n\n <span className=\"input-exp-date-separator\">/</span>\n\n {segmentDisabled ? (\n <span className={cn('input-exp-date-trigger', !year && 'placeholder', 'static')}>\n <span>{yearLabel}</span>\n </span>\n ) : (\n <MDropdownMenu\n trigger={\n <span\n className={cn(\n 'input-exp-date-trigger',\n yearMenuOpen && 'open',\n !year && 'placeholder'\n )}\n onMouseDown={focusHiddenInput}\n >\n <span>{yearLabel}</span>\n <MChevronDownIcon size={16} />\n </span>\n }\n openOn=\"click\"\n closeOnSelect\n onOpenChange={setYearMenuOpen}\n popoverClassName=\"input-exp-date-popover\"\n >\n {yearOptions.map((option) => (\n <MDropdownItem\n key={option}\n label={String(option)}\n active={year === String(option)}\n onClick={() => handleSelectYear(String(option))}\n />\n ))}\n </MDropdownMenu>\n )}\n </div>\n\n {clearable && hasContent && !segmentDisabled && (\n <button\n type=\"button\"\n className=\"clear-btn clear-btn-base\"\n onClick={(event) => {\n event.stopPropagation()\n handleClear()\n }}\n tabIndex={-1}\n aria-label=\"Clear input\"\n >\n <MCloseIcon />\n </button>\n )}\n\n {endIcon && <span className=\"end-icon\">{endIcon}</span>}\n </div>\n\n {(resolvedErrorText || helperText) && (\n <div className=\"bottom-row\">\n <span>\n {resolvedErrorText && (\n <span id={id ? `${id}-error` : undefined} className=\"field-error\" role=\"alert\">\n {resolvedErrorText}\n </span>\n )}\n {!resolvedErrorText && helperText && (\n <span id={id ? `${id}-helper` : undefined} className=\"field-helper\">\n {helperText}\n </span>\n )}\n </span>\n </div>\n )}\n </div>\n )\n})\n","import {forwardRef, useCallback, useState} from 'react'\nimport type * as React from 'react'\nimport type {MInputCVCProps} from './MInputCVC.types'\nimport {MInput} from '../MInput'\nimport type {ValidationResult} from '../../../utils/validators'\nimport {MCheckIcon} from '../../../icons'\nimport {cn} from '../../../utils/cn'\nimport './MInputCVC.css'\n\nconst OK: ValidationResult = {valid: true}\n\nfunction stripDigits(value: string) {\n return value.replace(/\\D/g, '')\n}\n\nfunction validateCvc(value: string, length: 3 | 4): ValidationResult {\n if (!value) {\n return OK\n }\n\n const digits = stripDigits(value)\n\n if (digits.length !== length) {\n return {valid: false, error: `Security code must have ${length} digits`}\n }\n\n return OK\n}\n\nexport const MInputCVC = forwardRef<HTMLInputElement, MInputCVCProps>(function MInputCVC(\n {\n length = 3,\n validateOnBlur = true,\n validateOnChange = false,\n onValidationChange,\n onValueChange,\n value,\n defaultValue,\n onChange,\n onBlur,\n onKeyDown,\n error,\n errorText,\n success,\n placeholder,\n className,\n inputClassName,\n ...rest\n },\n ref\n) {\n const [internalValue, setInternalValue] = useState(() =>\n stripDigits(defaultValue?.toString() ?? '').slice(0, length)\n )\n const [validation, setValidation] = useState<ValidationResult>(OK)\n const [touched, setTouched] = useState(false)\n\n const currentValue = value !== undefined ? stripDigits(value.toString()).slice(0, length) : internalValue\n\n const runValidation = useCallback(\n (nextValue: string) => {\n const result = validateCvc(nextValue, length)\n setValidation(result)\n onValidationChange?.(result)\n return result\n },\n [length, onValidationChange]\n )\n\n const handleChange = useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n const nextValue = stripDigits(event.target.value).slice(0, length)\n\n if (value === undefined) {\n setInternalValue(nextValue)\n }\n\n onValueChange?.(nextValue)\n\n if (validateOnChange && touched) {\n runValidation(nextValue)\n }\n\n onChange?.(event)\n },\n [length, onChange, onValueChange, runValidation, touched, validateOnChange, value]\n )\n\n const handleBlur = useCallback(\n (event: React.FocusEvent<HTMLInputElement>) => {\n setTouched(true)\n\n if (validateOnBlur && currentValue) {\n runValidation(currentValue)\n }\n\n onBlur?.(event)\n },\n [currentValue, onBlur, runValidation, validateOnBlur]\n )\n\n const handleKeyDown = useCallback(\n (event: React.KeyboardEvent<HTMLInputElement>) => {\n if (['Backspace', 'Delete', 'Tab', 'ArrowLeft', 'ArrowRight', 'Home', 'End'].includes(event.key)) {\n onKeyDown?.(event)\n return\n }\n\n if (event.ctrlKey || event.metaKey) {\n onKeyDown?.(event)\n return\n }\n\n if (!/^\\d$/.test(event.key)) {\n event.preventDefault()\n }\n\n onKeyDown?.(event)\n },\n [onKeyDown]\n )\n\n const isError = error || (touched && !validation.valid)\n const resolvedErrorText = errorText || (touched && !validation.valid ? validation.error : undefined)\n const isSuccess = !isError && (success !== undefined ? success : touched && currentValue.length === length)\n const endIcon = isSuccess ? <MCheckIcon /> : undefined\n\n return (\n <MInput\n {...rest}\n ref={ref}\n type=\"text\"\n inputMode=\"numeric\"\n value={currentValue}\n onChange={handleChange}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n error={isError}\n errorText={resolvedErrorText}\n success={isSuccess}\n placeholder={placeholder ?? ''.padEnd(length, '0')}\n maxLength={length}\n endIcon={endIcon}\n inputClassName={cn('input-cvc-field', inputClassName)}\n className={className}\n />\n )\n})\n"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
require(`./chunk-350yNsax.cjs`);const e=require(`./icons-
|
|
2
|
-
//# sourceMappingURL=MInputCVC-
|
|
1
|
+
require(`./chunk-350yNsax.cjs`);const e=require(`./icons-BJCV7W0L.cjs`),t=require(`./cn-DYFxgzi2.cjs`),n=require(`./MInput-DDZ71Qqn.cjs`),r=require(`./MDropdownMenu-CymCQqyP.cjs`);let i=require(`react`),a=require(`react/jsx-runtime`);var o={valid:!0};function s(e){return e.replace(/\D/g,``)}function c(e){return e?e.padStart(2,`0`).slice(0,2):``}function l(e,t){let n=c(e),r=t?.slice(0,4)??``;return!n&&!r?``:r?`${n}/${r}`:n}function u(e){let t=s(e).slice(0,6);return{month:t.slice(0,2),year:t.slice(2,6)}}function d(e,t){let n=new Date().getFullYear(),r=Math.max(e??n,n);return{resolvedMinYear:r,resolvedMaxYear:Math.max(t??n+20,r)}}function f(e,{minYear:t,maxYear:n}){if(!e)return o;let{month:r,year:i}=u(e);if(r.length!==2||i.length!==4)return{valid:!1,error:`Expiration date is incomplete`};let a=parseInt(r,10),s=parseInt(i,10),{resolvedMinYear:c,resolvedMaxYear:l}=d(t,n);if(Number.isNaN(a)||a<1||a>12)return{valid:!1,error:`Use a valid month`};if(Number.isNaN(s))return{valid:!1,error:`Use a valid year`};if(s<c)return{valid:!1,error:`Year must be ${c} or later`};if(s>l)return{valid:!1,error:`Year must be ${l} or earlier`};let f=new Date,p=f.getMonth()+1,m=f.getFullYear();return s<m||s===m&&a<p?{valid:!1,error:`Card has expired`}:o}var p=(0,i.forwardRef)(function({validateOnBlur:c=!0,validateOnChange:p=!1,minYear:m,maxYear:h,onValidationChange:g,onValueChange:_,value:ee,defaultValue:v,name:y,id:b,disabled:x=!1,readOnly:te=!1,required:S=!1,autoFocus:ne=!1,variant:re=`outlined`,size:ie=`md`,color:C,fullWidth:ae=!1,rounded:w=!1,label:T,helperText:E,errorText:D,startIcon:O,endIcon:k,clearable:oe=!1,error:A=!1,success:j,onChange:M,onFocus:N,onBlur:P,onClear:se,className:ce,style:le,labelClassName:ue},F){let I=(0,i.useRef)(null),de=(0,i.useRef)(null),{currentValue:L,setCurrentValue:fe}=n.n(ee,v),[R,z]=(0,i.useState)(o),[B,V]=(0,i.useState)(!1),[H,U]=(0,i.useState)(!1),[pe,me]=(0,i.useState)(!1),[he,ge]=(0,i.useState)(!1),{month:W,year:G}=u(L),_e=!!(W||G),K=x||te,{resolvedMinYear:q,resolvedMaxYear:ve}=d(m,h),ye=(0,i.useMemo)(()=>Array.from({length:ve-q+1},(e,t)=>q+t),[ve,q]),J=(0,i.useCallback)(e=>{let t=f(e,{minYear:m,maxYear:h});return z(t),g?.(t),t},[h,m,g]),Y=(0,i.useCallback)(e=>{fe(e),_?.(s(e),e);let t=F?.current??I.current;t&&((Object.getOwnPropertyDescriptor(HTMLInputElement.prototype,`value`)?.set)?.call(t,e),t.dispatchEvent(new Event(`input`,{bubbles:!0})))},[_,F,fe]),X=(0,i.useCallback)((e,t)=>{let n=l(e,t);Y(n),p&&B&&J(n)},[J,Y,B,p]),Z=(0,i.useCallback)(()=>{(F?.current??I.current)?.focus()},[F]),be=(0,i.useCallback)(e=>{if(H)return;U(!0);let t=F?.current??I.current;t&&e.target!==t&&N?.(e)},[H,N,F]),xe=(0,i.useCallback)(e=>{let t=e.relatedTarget;t&&de.current?.contains(t)||(U(!1),V(!0),c&&L&&J(L),P?.(e))},[L,P,J,c]),Se=(0,i.useCallback)(e=>{Z(),X(e,G)},[Z,X,G]),Ce=(0,i.useCallback)(e=>{Z(),X(W,e)},[Z,W,X]),we=(0,i.useCallback)(()=>{Y(``),V(!1),z(o),g?.(o),se?.(),Z()},[Z,se,g,Y]),Q=A||B&&!R.valid,$=D||(B&&!R.valid?R.error:void 0),Te=!Q&&(j===void 0?B&&R.valid&&!!(W&&G):j),Ee=Q?`color-error`:C?`color-${C}`:void 0,De=t.t(`container`,`field-${re}`,`field-${ie}`,H&&`focused`,Q&&`input-error`,Te&&!Q&&`input-success`,Ee,x&&`disabled`,w&&`rounded`),Oe=W||`MM`,ke=G||`YYYY`;return(0,a.jsxs)(`div`,{ref:de,className:t.t(`input`,`input-exp-date`,Ee,ae&&`full-width`,ce),style:le,onFocusCapture:be,onBlurCapture:xe,children:[T&&(0,a.jsx)(`label`,{htmlFor:b,className:t.t(`field-label`,H&&`focused`,Q&&`error`,Te&&!Q&&`success`,S&&`required`,ue),children:T}),(0,a.jsxs)(`div`,{className:De,onClick:Z,children:[O&&(0,a.jsx)(`span`,{className:`start-icon`,children:O}),(0,a.jsx)(`input`,{ref:F??I,type:`text`,value:L,name:y,id:b,readOnly:!0,required:S,autoFocus:ne,className:`input-exp-date-native`,tabIndex:-1,"aria-hidden":`true`,onChange:M,onFocus:N,onBlur:P}),(0,a.jsxs)(`div`,{className:`input-exp-date-segments`,"aria-label":`Expiration date`,children:[K?(0,a.jsx)(`span`,{className:t.t(`input-exp-date-trigger`,!W&&`placeholder`,`static`),children:(0,a.jsx)(`span`,{children:Oe})}):(0,a.jsx)(r.i,{trigger:(0,a.jsxs)(`span`,{className:t.t(`input-exp-date-trigger`,pe&&`open`,!W&&`placeholder`),onMouseDown:Z,children:[(0,a.jsx)(`span`,{children:Oe}),(0,a.jsx)(e.Ni,{size:16})]}),openOn:`click`,closeOnSelect:!0,onOpenChange:me,popoverClassName:`input-exp-date-popover`,children:Array.from({length:12},(e,t)=>{let n=String(t+1).padStart(2,`0`);return(0,a.jsx)(r.r,{label:n,active:W===n,onClick:()=>Se(n)},n)})}),(0,a.jsx)(`span`,{className:`input-exp-date-separator`,children:`/`}),K?(0,a.jsx)(`span`,{className:t.t(`input-exp-date-trigger`,!G&&`placeholder`,`static`),children:(0,a.jsx)(`span`,{children:ke})}):(0,a.jsx)(r.i,{trigger:(0,a.jsxs)(`span`,{className:t.t(`input-exp-date-trigger`,he&&`open`,!G&&`placeholder`),onMouseDown:Z,children:[(0,a.jsx)(`span`,{children:ke}),(0,a.jsx)(e.Ni,{size:16})]}),openOn:`click`,closeOnSelect:!0,onOpenChange:ge,popoverClassName:`input-exp-date-popover`,children:ye.map(e=>(0,a.jsx)(r.r,{label:String(e),active:G===String(e),onClick:()=>Ce(String(e))},e))})]}),oe&&_e&&!K&&(0,a.jsx)(`button`,{type:`button`,className:`clear-btn clear-btn-base`,onClick:e=>{e.stopPropagation(),we()},tabIndex:-1,"aria-label":`Clear input`,children:(0,a.jsx)(e.Li,{})}),k&&(0,a.jsx)(`span`,{className:`end-icon`,children:k})]}),($||E)&&(0,a.jsx)(`div`,{className:`bottom-row`,children:(0,a.jsxs)(`span`,{children:[$&&(0,a.jsx)(`span`,{id:b?`${b}-error`:void 0,className:`field-error`,role:`alert`,children:$}),!$&&E&&(0,a.jsx)(`span`,{id:b?`${b}-helper`:void 0,className:`field-helper`,children:E})]})})]})}),m={valid:!0};function h(e){return e.replace(/\D/g,``)}function g(e,t){return e?h(e).length===t?m:{valid:!1,error:`Security code must have ${t} digits`}:m}var _=(0,i.forwardRef)(function({length:r=3,validateOnBlur:o=!0,validateOnChange:s=!1,onValidationChange:c,onValueChange:l,value:u,defaultValue:d,onChange:f,onBlur:p,onKeyDown:_,error:ee,errorText:v,success:y,placeholder:b,className:x,inputClassName:te,...S},ne){let[re,ie]=(0,i.useState)(()=>h(d?.toString()??``).slice(0,r)),[C,ae]=(0,i.useState)(m),[w,T]=(0,i.useState)(!1),E=u===void 0?re:h(u.toString()).slice(0,r),D=(0,i.useCallback)(e=>{let t=g(e,r);return ae(t),c?.(t),t},[r,c]),O=(0,i.useCallback)(e=>{let t=h(e.target.value).slice(0,r);u===void 0&&ie(t),l?.(t),s&&w&&D(t),f?.(e)},[r,f,l,D,w,s,u]),k=(0,i.useCallback)(e=>{T(!0),o&&E&&D(E),p?.(e)},[E,p,D,o]),oe=(0,i.useCallback)(e=>{if([`Backspace`,`Delete`,`Tab`,`ArrowLeft`,`ArrowRight`,`Home`,`End`].includes(e.key)){_?.(e);return}if(e.ctrlKey||e.metaKey){_?.(e);return}/^\d$/.test(e.key)||e.preventDefault(),_?.(e)},[_]),A=ee||w&&!C.valid,j=v||(w&&!C.valid?C.error:void 0),M=!A&&(y===void 0?w&&E.length===r:y),N=M?(0,a.jsx)(e.Ii,{}):void 0;return(0,a.jsx)(n.t,{...S,ref:ne,type:`text`,inputMode:`numeric`,value:E,onChange:O,onBlur:k,onKeyDown:oe,error:A,errorText:j,success:M,placeholder:b??``.padEnd(r,`0`),maxLength:r,endIcon:N,inputClassName:t.t(`input-cvc-field`,te),className:x})});Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return p}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return _}});
|
|
2
|
+
//# sourceMappingURL=MInputCVC-Sp2uZ5aO.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MInputCVC-NSy1SkiZ.cjs","names":[],"sources":["../src/components/inputs/MInputExpDate/MInputExpDate.tsx","../src/components/inputs/MInputCVC/MInputCVC.tsx"],"sourcesContent":["import {forwardRef, useCallback, useMemo, useRef, useState} from 'react'\nimport type * as React from 'react'\nimport type {MInputExpDateProps} from './MInputExpDate.types'\nimport {cn} from '../../../utils/cn'\nimport {useControllableString} from '../../../utils/useControllableString'\nimport type {ValidationResult} from '../../../utils/validators'\nimport {MCloseIcon, MChevronDownIcon} from '../../../icons'\nimport {MDropdownItem, MDropdownMenu} from '../../overlays'\nimport '../MInput/MInput.css'\nimport './MInputExpDate.css'\n\nconst OK: ValidationResult = {valid: true}\n\nfunction stripDigits(value: string) {\n return value.replace(/\\D/g, '')\n}\n\nfunction padMonth(value?: string) {\n if (!value) {\n return ''\n }\n\n return value.padStart(2, '0').slice(0, 2)\n}\n\nfunction formatValue(month?: string, year?: string) {\n const resolvedMonth = padMonth(month)\n const resolvedYear = year?.slice(0, 4) ?? ''\n\n if (!resolvedMonth && !resolvedYear) {\n return ''\n }\n\n if (!resolvedYear) {\n return resolvedMonth\n }\n\n return `${resolvedMonth}/${resolvedYear}`\n}\n\nfunction parseValue(value: string) {\n const digits = stripDigits(value).slice(0, 6)\n\n return {\n month: digits.slice(0, 2),\n year: digits.slice(2, 6),\n }\n}\n\nfunction resolveYearBounds(minYear?: number, maxYear?: number) {\n const currentYear = new Date().getFullYear()\n const resolvedMinYear = Math.max(minYear ?? currentYear, currentYear)\n const resolvedMaxYear = Math.max(maxYear ?? currentYear + 20, resolvedMinYear)\n\n return {\n resolvedMinYear,\n resolvedMaxYear,\n }\n}\n\nfunction validateExpDate(\n value: string,\n {minYear, maxYear}: Pick<MInputExpDateProps, 'minYear' | 'maxYear'>\n): ValidationResult {\n if (!value) {\n return OK\n }\n\n const {month: monthValue, year: yearValue} = parseValue(value)\n\n if (monthValue.length !== 2 || yearValue.length !== 4) {\n return {valid: false, error: 'Expiration date is incomplete'}\n }\n\n const month = parseInt(monthValue, 10)\n const year = parseInt(yearValue, 10)\n const {resolvedMinYear, resolvedMaxYear} = resolveYearBounds(minYear, maxYear)\n\n if (Number.isNaN(month) || month < 1 || month > 12) {\n return {valid: false, error: 'Use a valid month'}\n }\n\n if (Number.isNaN(year)) {\n return {valid: false, error: 'Use a valid year'}\n }\n\n if (year < resolvedMinYear) {\n return {valid: false, error: `Year must be ${resolvedMinYear} or later`}\n }\n\n if (year > resolvedMaxYear) {\n return {valid: false, error: `Year must be ${resolvedMaxYear} or earlier`}\n }\n\n const now = new Date()\n const currentMonth = now.getMonth() + 1\n const currentYear = now.getFullYear()\n\n if (year < currentYear || (year === currentYear && month < currentMonth)) {\n return {valid: false, error: 'Card has expired'}\n }\n\n return OK\n}\n\nexport const MInputExpDate = forwardRef<HTMLInputElement, MInputExpDateProps>(function MInputExpDate(\n {\n validateOnBlur = true,\n validateOnChange = false,\n minYear,\n maxYear,\n onValidationChange,\n onValueChange,\n value,\n defaultValue,\n name,\n id,\n disabled = false,\n readOnly = false,\n required = false,\n autoFocus = false,\n variant = 'outlined',\n size = 'md',\n color,\n fullWidth = false,\n rounded = false,\n label,\n helperText,\n errorText,\n startIcon,\n endIcon,\n clearable = false,\n error = false,\n success,\n onChange,\n onFocus,\n onBlur,\n onClear,\n className,\n style,\n labelClassName,\n },\n ref\n) {\n const inputRef = useRef<HTMLInputElement>(null)\n const rootRef = useRef<HTMLDivElement>(null)\n const {currentValue, setCurrentValue} = useControllableString(value, defaultValue)\n const [validation, setValidation] = useState<ValidationResult>(OK)\n const [touched, setTouched] = useState(false)\n const [focused, setFocused] = useState(false)\n const [monthMenuOpen, setMonthMenuOpen] = useState(false)\n const [yearMenuOpen, setYearMenuOpen] = useState(false)\n\n const {month, year} = parseValue(currentValue)\n const hasContent = Boolean(month || year)\n const segmentDisabled = disabled || readOnly\n const {resolvedMinYear, resolvedMaxYear} = resolveYearBounds(minYear, maxYear)\n const yearOptions = useMemo(\n () => Array.from({length: resolvedMaxYear - resolvedMinYear + 1}, (_, index) => resolvedMinYear + index),\n [resolvedMaxYear, resolvedMinYear]\n )\n\n const runValidation = useCallback(\n (formattedValue: string) => {\n const result = validateExpDate(formattedValue, {minYear, maxYear})\n setValidation(result)\n onValidationChange?.(result)\n return result\n },\n [maxYear, minYear, onValidationChange]\n )\n\n const syncValue = useCallback(\n (formattedValue: string) => {\n setCurrentValue(formattedValue)\n onValueChange?.(stripDigits(formattedValue), formattedValue)\n\n const input = (ref as React.RefObject<HTMLInputElement>)?.current ?? inputRef.current\n if (input) {\n const nativeSet = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, 'value')?.set\n nativeSet?.call(input, formattedValue)\n input.dispatchEvent(new Event('input', {bubbles: true}))\n }\n },\n [onValueChange, ref, setCurrentValue]\n )\n\n const updateValue = useCallback(\n (nextMonth?: string, nextYear?: string) => {\n const formattedValue = formatValue(nextMonth, nextYear)\n syncValue(formattedValue)\n\n if (validateOnChange && touched) {\n runValidation(formattedValue)\n }\n },\n [runValidation, syncValue, touched, validateOnChange]\n )\n\n const focusHiddenInput = useCallback(() => {\n const input = (ref as React.RefObject<HTMLInputElement>)?.current ?? inputRef.current\n input?.focus()\n }, [ref])\n\n const handleRootFocus = useCallback(\n (event: React.FocusEvent<HTMLDivElement>) => {\n if (focused) {\n return\n }\n\n setFocused(true)\n const input = (ref as React.RefObject<HTMLInputElement>)?.current ?? inputRef.current\n if (input && event.target !== input) {\n onFocus?.(event as unknown as React.FocusEvent<HTMLInputElement>)\n }\n },\n [focused, onFocus, ref]\n )\n\n const handleRootBlur = useCallback(\n (event: React.FocusEvent<HTMLDivElement>) => {\n const nextTarget = event.relatedTarget as Node | null\n\n if (nextTarget && rootRef.current?.contains(nextTarget)) {\n return\n }\n\n setFocused(false)\n setTouched(true)\n\n if (validateOnBlur && currentValue) {\n runValidation(currentValue)\n }\n\n onBlur?.(event as unknown as React.FocusEvent<HTMLInputElement>)\n },\n [currentValue, onBlur, runValidation, validateOnBlur]\n )\n\n const handleSelectMonth = useCallback(\n (nextMonth: string) => {\n focusHiddenInput()\n updateValue(nextMonth, year)\n },\n [focusHiddenInput, updateValue, year]\n )\n\n const handleSelectYear = useCallback(\n (nextYear: string) => {\n focusHiddenInput()\n updateValue(month, nextYear)\n },\n [focusHiddenInput, month, updateValue]\n )\n\n const handleClear = useCallback(() => {\n syncValue('')\n setTouched(false)\n setValidation(OK)\n onValidationChange?.(OK)\n onClear?.()\n focusHiddenInput()\n }, [focusHiddenInput, onClear, onValidationChange, syncValue])\n\n const hasError = error || (touched && !validation.valid)\n const resolvedErrorText = errorText || (touched && !validation.valid ? validation.error : undefined)\n const isSuccess =\n !hasError && (success !== undefined ? success : touched && validation.valid && Boolean(month && year))\n const resolvedColorClass = hasError ? 'color-error' : color ? `color-${color}` : undefined\n\n const containerClasses = cn(\n 'container',\n `field-${variant}`,\n `field-${size}`,\n focused && 'focused',\n hasError && 'input-error',\n isSuccess && !hasError && 'input-success',\n resolvedColorClass,\n disabled && 'disabled',\n rounded && 'rounded'\n )\n\n const monthLabel = month || 'MM'\n const yearLabel = year || 'YYYY'\n\n return (\n <div\n ref={rootRef}\n className={cn('input', 'input-exp-date', resolvedColorClass, fullWidth && 'full-width', className)}\n style={style}\n onFocusCapture={handleRootFocus}\n onBlurCapture={handleRootBlur}\n >\n {label && (\n <label\n htmlFor={id}\n className={cn(\n 'field-label',\n focused && 'focused',\n hasError && 'error',\n isSuccess && !hasError && 'success',\n required && 'required',\n labelClassName\n )}\n >\n {label}\n </label>\n )}\n\n <div className={containerClasses} onClick={focusHiddenInput}>\n {startIcon && <span className=\"start-icon\">{startIcon}</span>}\n\n <input\n ref={ref ?? inputRef}\n type=\"text\"\n value={currentValue}\n name={name}\n id={id}\n readOnly\n required={required}\n autoFocus={autoFocus}\n className=\"input-exp-date-native\"\n tabIndex={-1}\n aria-hidden=\"true\"\n onChange={onChange}\n onFocus={onFocus}\n onBlur={onBlur}\n />\n\n <div className=\"input-exp-date-segments\" aria-label=\"Expiration date\">\n {segmentDisabled ? (\n <span className={cn('input-exp-date-trigger', !month && 'placeholder', 'static')}>\n <span>{monthLabel}</span>\n </span>\n ) : (\n <MDropdownMenu\n trigger={\n <span\n className={cn(\n 'input-exp-date-trigger',\n monthMenuOpen && 'open',\n !month && 'placeholder'\n )}\n onMouseDown={focusHiddenInput}\n >\n <span>{monthLabel}</span>\n <MChevronDownIcon size={16} />\n </span>\n }\n openOn=\"click\"\n closeOnSelect\n onOpenChange={setMonthMenuOpen}\n popoverClassName=\"input-exp-date-popover\"\n >\n {Array.from({length: 12}, (_, index) => {\n const option = String(index + 1).padStart(2, '0')\n\n return (\n <MDropdownItem\n key={option}\n label={option}\n active={month === option}\n onClick={() => handleSelectMonth(option)}\n />\n )\n })}\n </MDropdownMenu>\n )}\n\n <span className=\"input-exp-date-separator\">/</span>\n\n {segmentDisabled ? (\n <span className={cn('input-exp-date-trigger', !year && 'placeholder', 'static')}>\n <span>{yearLabel}</span>\n </span>\n ) : (\n <MDropdownMenu\n trigger={\n <span\n className={cn(\n 'input-exp-date-trigger',\n yearMenuOpen && 'open',\n !year && 'placeholder'\n )}\n onMouseDown={focusHiddenInput}\n >\n <span>{yearLabel}</span>\n <MChevronDownIcon size={16} />\n </span>\n }\n openOn=\"click\"\n closeOnSelect\n onOpenChange={setYearMenuOpen}\n popoverClassName=\"input-exp-date-popover\"\n >\n {yearOptions.map((option) => (\n <MDropdownItem\n key={option}\n label={String(option)}\n active={year === String(option)}\n onClick={() => handleSelectYear(String(option))}\n />\n ))}\n </MDropdownMenu>\n )}\n </div>\n\n {clearable && hasContent && !segmentDisabled && (\n <button\n type=\"button\"\n className=\"clear-btn clear-btn-base\"\n onClick={(event) => {\n event.stopPropagation()\n handleClear()\n }}\n tabIndex={-1}\n aria-label=\"Clear input\"\n >\n <MCloseIcon />\n </button>\n )}\n\n {endIcon && <span className=\"end-icon\">{endIcon}</span>}\n </div>\n\n {(resolvedErrorText || helperText) && (\n <div className=\"bottom-row\">\n <span>\n {resolvedErrorText && (\n <span id={id ? `${id}-error` : undefined} className=\"field-error\" role=\"alert\">\n {resolvedErrorText}\n </span>\n )}\n {!resolvedErrorText && helperText && (\n <span id={id ? `${id}-helper` : undefined} className=\"field-helper\">\n {helperText}\n </span>\n )}\n </span>\n </div>\n )}\n </div>\n )\n})\n","import {forwardRef, useCallback, useState} from 'react'\nimport type * as React from 'react'\nimport type {MInputCVCProps} from './MInputCVC.types'\nimport {MInput} from '../MInput'\nimport type {ValidationResult} from '../../../utils/validators'\nimport {MCheckIcon} from '../../../icons'\nimport {cn} from '../../../utils/cn'\nimport './MInputCVC.css'\n\nconst OK: ValidationResult = {valid: true}\n\nfunction stripDigits(value: string) {\n return value.replace(/\\D/g, '')\n}\n\nfunction validateCvc(value: string, length: 3 | 4): ValidationResult {\n if (!value) {\n return OK\n }\n\n const digits = stripDigits(value)\n\n if (digits.length !== length) {\n return {valid: false, error: `Security code must have ${length} digits`}\n }\n\n return OK\n}\n\nexport const MInputCVC = forwardRef<HTMLInputElement, MInputCVCProps>(function MInputCVC(\n {\n length = 3,\n validateOnBlur = true,\n validateOnChange = false,\n onValidationChange,\n onValueChange,\n value,\n defaultValue,\n onChange,\n onBlur,\n onKeyDown,\n error,\n errorText,\n success,\n placeholder,\n className,\n inputClassName,\n ...rest\n },\n ref\n) {\n const [internalValue, setInternalValue] = useState(() =>\n stripDigits(defaultValue?.toString() ?? '').slice(0, length)\n )\n const [validation, setValidation] = useState<ValidationResult>(OK)\n const [touched, setTouched] = useState(false)\n\n const currentValue = value !== undefined ? stripDigits(value.toString()).slice(0, length) : internalValue\n\n const runValidation = useCallback(\n (nextValue: string) => {\n const result = validateCvc(nextValue, length)\n setValidation(result)\n onValidationChange?.(result)\n return result\n },\n [length, onValidationChange]\n )\n\n const handleChange = useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n const nextValue = stripDigits(event.target.value).slice(0, length)\n\n if (value === undefined) {\n setInternalValue(nextValue)\n }\n\n onValueChange?.(nextValue)\n\n if (validateOnChange && touched) {\n runValidation(nextValue)\n }\n\n onChange?.(event)\n },\n [length, onChange, onValueChange, runValidation, touched, validateOnChange, value]\n )\n\n const handleBlur = useCallback(\n (event: React.FocusEvent<HTMLInputElement>) => {\n setTouched(true)\n\n if (validateOnBlur && currentValue) {\n runValidation(currentValue)\n }\n\n onBlur?.(event)\n },\n [currentValue, onBlur, runValidation, validateOnBlur]\n )\n\n const handleKeyDown = useCallback(\n (event: React.KeyboardEvent<HTMLInputElement>) => {\n if (['Backspace', 'Delete', 'Tab', 'ArrowLeft', 'ArrowRight', 'Home', 'End'].includes(event.key)) {\n onKeyDown?.(event)\n return\n }\n\n if (event.ctrlKey || event.metaKey) {\n onKeyDown?.(event)\n return\n }\n\n if (!/^\\d$/.test(event.key)) {\n event.preventDefault()\n }\n\n onKeyDown?.(event)\n },\n [onKeyDown]\n )\n\n const isError = error || (touched && !validation.valid)\n const resolvedErrorText = errorText || (touched && !validation.valid ? validation.error : undefined)\n const isSuccess = !isError && (success !== undefined ? success : touched && currentValue.length === length)\n const endIcon = isSuccess ? <MCheckIcon /> : undefined\n\n return (\n <MInput\n {...rest}\n ref={ref}\n type=\"text\"\n inputMode=\"numeric\"\n value={currentValue}\n onChange={handleChange}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n error={isError}\n errorText={resolvedErrorText}\n success={isSuccess}\n placeholder={placeholder ?? ''.padEnd(length, '0')}\n maxLength={length}\n endIcon={endIcon}\n inputClassName={cn('input-cvc-field', inputClassName)}\n className={className}\n />\n )\n})\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"MInputCVC-Sp2uZ5aO.cjs","names":[],"sources":["../src/components/inputs/MInputExpDate/MInputExpDate.tsx","../src/components/inputs/MInputCVC/MInputCVC.tsx"],"sourcesContent":["import {forwardRef, useCallback, useMemo, useRef, useState} from 'react'\nimport type * as React from 'react'\nimport type {MInputExpDateProps} from './MInputExpDate.types'\nimport {cn} from '../../../utils/cn'\nimport {useControllableString} from '../../../utils/useControllableString'\nimport type {ValidationResult} from '../../../utils/validators'\nimport {MCloseIcon, MChevronDownIcon} from '../../../icons'\nimport {MDropdownItem, MDropdownMenu} from '../../overlays'\nimport '../MInput/MInput.css'\nimport './MInputExpDate.css'\n\nconst OK: ValidationResult = {valid: true}\n\nfunction stripDigits(value: string) {\n return value.replace(/\\D/g, '')\n}\n\nfunction padMonth(value?: string) {\n if (!value) {\n return ''\n }\n\n return value.padStart(2, '0').slice(0, 2)\n}\n\nfunction formatValue(month?: string, year?: string) {\n const resolvedMonth = padMonth(month)\n const resolvedYear = year?.slice(0, 4) ?? ''\n\n if (!resolvedMonth && !resolvedYear) {\n return ''\n }\n\n if (!resolvedYear) {\n return resolvedMonth\n }\n\n return `${resolvedMonth}/${resolvedYear}`\n}\n\nfunction parseValue(value: string) {\n const digits = stripDigits(value).slice(0, 6)\n\n return {\n month: digits.slice(0, 2),\n year: digits.slice(2, 6),\n }\n}\n\nfunction resolveYearBounds(minYear?: number, maxYear?: number) {\n const currentYear = new Date().getFullYear()\n const resolvedMinYear = Math.max(minYear ?? currentYear, currentYear)\n const resolvedMaxYear = Math.max(maxYear ?? currentYear + 20, resolvedMinYear)\n\n return {\n resolvedMinYear,\n resolvedMaxYear,\n }\n}\n\nfunction validateExpDate(\n value: string,\n {minYear, maxYear}: Pick<MInputExpDateProps, 'minYear' | 'maxYear'>\n): ValidationResult {\n if (!value) {\n return OK\n }\n\n const {month: monthValue, year: yearValue} = parseValue(value)\n\n if (monthValue.length !== 2 || yearValue.length !== 4) {\n return {valid: false, error: 'Expiration date is incomplete'}\n }\n\n const month = parseInt(monthValue, 10)\n const year = parseInt(yearValue, 10)\n const {resolvedMinYear, resolvedMaxYear} = resolveYearBounds(minYear, maxYear)\n\n if (Number.isNaN(month) || month < 1 || month > 12) {\n return {valid: false, error: 'Use a valid month'}\n }\n\n if (Number.isNaN(year)) {\n return {valid: false, error: 'Use a valid year'}\n }\n\n if (year < resolvedMinYear) {\n return {valid: false, error: `Year must be ${resolvedMinYear} or later`}\n }\n\n if (year > resolvedMaxYear) {\n return {valid: false, error: `Year must be ${resolvedMaxYear} or earlier`}\n }\n\n const now = new Date()\n const currentMonth = now.getMonth() + 1\n const currentYear = now.getFullYear()\n\n if (year < currentYear || (year === currentYear && month < currentMonth)) {\n return {valid: false, error: 'Card has expired'}\n }\n\n return OK\n}\n\nexport const MInputExpDate = forwardRef<HTMLInputElement, MInputExpDateProps>(function MInputExpDate(\n {\n validateOnBlur = true,\n validateOnChange = false,\n minYear,\n maxYear,\n onValidationChange,\n onValueChange,\n value,\n defaultValue,\n name,\n id,\n disabled = false,\n readOnly = false,\n required = false,\n autoFocus = false,\n variant = 'outlined',\n size = 'md',\n color,\n fullWidth = false,\n rounded = false,\n label,\n helperText,\n errorText,\n startIcon,\n endIcon,\n clearable = false,\n error = false,\n success,\n onChange,\n onFocus,\n onBlur,\n onClear,\n className,\n style,\n labelClassName,\n },\n ref\n) {\n const inputRef = useRef<HTMLInputElement>(null)\n const rootRef = useRef<HTMLDivElement>(null)\n const {currentValue, setCurrentValue} = useControllableString(value, defaultValue)\n const [validation, setValidation] = useState<ValidationResult>(OK)\n const [touched, setTouched] = useState(false)\n const [focused, setFocused] = useState(false)\n const [monthMenuOpen, setMonthMenuOpen] = useState(false)\n const [yearMenuOpen, setYearMenuOpen] = useState(false)\n\n const {month, year} = parseValue(currentValue)\n const hasContent = Boolean(month || year)\n const segmentDisabled = disabled || readOnly\n const {resolvedMinYear, resolvedMaxYear} = resolveYearBounds(minYear, maxYear)\n const yearOptions = useMemo(\n () => Array.from({length: resolvedMaxYear - resolvedMinYear + 1}, (_, index) => resolvedMinYear + index),\n [resolvedMaxYear, resolvedMinYear]\n )\n\n const runValidation = useCallback(\n (formattedValue: string) => {\n const result = validateExpDate(formattedValue, {minYear, maxYear})\n setValidation(result)\n onValidationChange?.(result)\n return result\n },\n [maxYear, minYear, onValidationChange]\n )\n\n const syncValue = useCallback(\n (formattedValue: string) => {\n setCurrentValue(formattedValue)\n onValueChange?.(stripDigits(formattedValue), formattedValue)\n\n const input = (ref as React.RefObject<HTMLInputElement>)?.current ?? inputRef.current\n if (input) {\n const nativeSet = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, 'value')?.set\n nativeSet?.call(input, formattedValue)\n input.dispatchEvent(new Event('input', {bubbles: true}))\n }\n },\n [onValueChange, ref, setCurrentValue]\n )\n\n const updateValue = useCallback(\n (nextMonth?: string, nextYear?: string) => {\n const formattedValue = formatValue(nextMonth, nextYear)\n syncValue(formattedValue)\n\n if (validateOnChange && touched) {\n runValidation(formattedValue)\n }\n },\n [runValidation, syncValue, touched, validateOnChange]\n )\n\n const focusHiddenInput = useCallback(() => {\n const input = (ref as React.RefObject<HTMLInputElement>)?.current ?? inputRef.current\n input?.focus()\n }, [ref])\n\n const handleRootFocus = useCallback(\n (event: React.FocusEvent<HTMLDivElement>) => {\n if (focused) {\n return\n }\n\n setFocused(true)\n const input = (ref as React.RefObject<HTMLInputElement>)?.current ?? inputRef.current\n if (input && event.target !== input) {\n onFocus?.(event as unknown as React.FocusEvent<HTMLInputElement>)\n }\n },\n [focused, onFocus, ref]\n )\n\n const handleRootBlur = useCallback(\n (event: React.FocusEvent<HTMLDivElement>) => {\n const nextTarget = event.relatedTarget as Node | null\n\n if (nextTarget && rootRef.current?.contains(nextTarget)) {\n return\n }\n\n setFocused(false)\n setTouched(true)\n\n if (validateOnBlur && currentValue) {\n runValidation(currentValue)\n }\n\n onBlur?.(event as unknown as React.FocusEvent<HTMLInputElement>)\n },\n [currentValue, onBlur, runValidation, validateOnBlur]\n )\n\n const handleSelectMonth = useCallback(\n (nextMonth: string) => {\n focusHiddenInput()\n updateValue(nextMonth, year)\n },\n [focusHiddenInput, updateValue, year]\n )\n\n const handleSelectYear = useCallback(\n (nextYear: string) => {\n focusHiddenInput()\n updateValue(month, nextYear)\n },\n [focusHiddenInput, month, updateValue]\n )\n\n const handleClear = useCallback(() => {\n syncValue('')\n setTouched(false)\n setValidation(OK)\n onValidationChange?.(OK)\n onClear?.()\n focusHiddenInput()\n }, [focusHiddenInput, onClear, onValidationChange, syncValue])\n\n const hasError = error || (touched && !validation.valid)\n const resolvedErrorText = errorText || (touched && !validation.valid ? validation.error : undefined)\n const isSuccess =\n !hasError && (success !== undefined ? success : touched && validation.valid && Boolean(month && year))\n const resolvedColorClass = hasError ? 'color-error' : color ? `color-${color}` : undefined\n\n const containerClasses = cn(\n 'container',\n `field-${variant}`,\n `field-${size}`,\n focused && 'focused',\n hasError && 'input-error',\n isSuccess && !hasError && 'input-success',\n resolvedColorClass,\n disabled && 'disabled',\n rounded && 'rounded'\n )\n\n const monthLabel = month || 'MM'\n const yearLabel = year || 'YYYY'\n\n return (\n <div\n ref={rootRef}\n className={cn('input', 'input-exp-date', resolvedColorClass, fullWidth && 'full-width', className)}\n style={style}\n onFocusCapture={handleRootFocus}\n onBlurCapture={handleRootBlur}\n >\n {label && (\n <label\n htmlFor={id}\n className={cn(\n 'field-label',\n focused && 'focused',\n hasError && 'error',\n isSuccess && !hasError && 'success',\n required && 'required',\n labelClassName\n )}\n >\n {label}\n </label>\n )}\n\n <div className={containerClasses} onClick={focusHiddenInput}>\n {startIcon && <span className=\"start-icon\">{startIcon}</span>}\n\n <input\n ref={ref ?? inputRef}\n type=\"text\"\n value={currentValue}\n name={name}\n id={id}\n readOnly\n required={required}\n autoFocus={autoFocus}\n className=\"input-exp-date-native\"\n tabIndex={-1}\n aria-hidden=\"true\"\n onChange={onChange}\n onFocus={onFocus}\n onBlur={onBlur}\n />\n\n <div className=\"input-exp-date-segments\" aria-label=\"Expiration date\">\n {segmentDisabled ? (\n <span className={cn('input-exp-date-trigger', !month && 'placeholder', 'static')}>\n <span>{monthLabel}</span>\n </span>\n ) : (\n <MDropdownMenu\n trigger={\n <span\n className={cn(\n 'input-exp-date-trigger',\n monthMenuOpen && 'open',\n !month && 'placeholder'\n )}\n onMouseDown={focusHiddenInput}\n >\n <span>{monthLabel}</span>\n <MChevronDownIcon size={16} />\n </span>\n }\n openOn=\"click\"\n closeOnSelect\n onOpenChange={setMonthMenuOpen}\n popoverClassName=\"input-exp-date-popover\"\n >\n {Array.from({length: 12}, (_, index) => {\n const option = String(index + 1).padStart(2, '0')\n\n return (\n <MDropdownItem\n key={option}\n label={option}\n active={month === option}\n onClick={() => handleSelectMonth(option)}\n />\n )\n })}\n </MDropdownMenu>\n )}\n\n <span className=\"input-exp-date-separator\">/</span>\n\n {segmentDisabled ? (\n <span className={cn('input-exp-date-trigger', !year && 'placeholder', 'static')}>\n <span>{yearLabel}</span>\n </span>\n ) : (\n <MDropdownMenu\n trigger={\n <span\n className={cn(\n 'input-exp-date-trigger',\n yearMenuOpen && 'open',\n !year && 'placeholder'\n )}\n onMouseDown={focusHiddenInput}\n >\n <span>{yearLabel}</span>\n <MChevronDownIcon size={16} />\n </span>\n }\n openOn=\"click\"\n closeOnSelect\n onOpenChange={setYearMenuOpen}\n popoverClassName=\"input-exp-date-popover\"\n >\n {yearOptions.map((option) => (\n <MDropdownItem\n key={option}\n label={String(option)}\n active={year === String(option)}\n onClick={() => handleSelectYear(String(option))}\n />\n ))}\n </MDropdownMenu>\n )}\n </div>\n\n {clearable && hasContent && !segmentDisabled && (\n <button\n type=\"button\"\n className=\"clear-btn clear-btn-base\"\n onClick={(event) => {\n event.stopPropagation()\n handleClear()\n }}\n tabIndex={-1}\n aria-label=\"Clear input\"\n >\n <MCloseIcon />\n </button>\n )}\n\n {endIcon && <span className=\"end-icon\">{endIcon}</span>}\n </div>\n\n {(resolvedErrorText || helperText) && (\n <div className=\"bottom-row\">\n <span>\n {resolvedErrorText && (\n <span id={id ? `${id}-error` : undefined} className=\"field-error\" role=\"alert\">\n {resolvedErrorText}\n </span>\n )}\n {!resolvedErrorText && helperText && (\n <span id={id ? `${id}-helper` : undefined} className=\"field-helper\">\n {helperText}\n </span>\n )}\n </span>\n </div>\n )}\n </div>\n )\n})\n","import {forwardRef, useCallback, useState} from 'react'\nimport type * as React from 'react'\nimport type {MInputCVCProps} from './MInputCVC.types'\nimport {MInput} from '../MInput'\nimport type {ValidationResult} from '../../../utils/validators'\nimport {MCheckIcon} from '../../../icons'\nimport {cn} from '../../../utils/cn'\nimport './MInputCVC.css'\n\nconst OK: ValidationResult = {valid: true}\n\nfunction stripDigits(value: string) {\n return value.replace(/\\D/g, '')\n}\n\nfunction validateCvc(value: string, length: 3 | 4): ValidationResult {\n if (!value) {\n return OK\n }\n\n const digits = stripDigits(value)\n\n if (digits.length !== length) {\n return {valid: false, error: `Security code must have ${length} digits`}\n }\n\n return OK\n}\n\nexport const MInputCVC = forwardRef<HTMLInputElement, MInputCVCProps>(function MInputCVC(\n {\n length = 3,\n validateOnBlur = true,\n validateOnChange = false,\n onValidationChange,\n onValueChange,\n value,\n defaultValue,\n onChange,\n onBlur,\n onKeyDown,\n error,\n errorText,\n success,\n placeholder,\n className,\n inputClassName,\n ...rest\n },\n ref\n) {\n const [internalValue, setInternalValue] = useState(() =>\n stripDigits(defaultValue?.toString() ?? '').slice(0, length)\n )\n const [validation, setValidation] = useState<ValidationResult>(OK)\n const [touched, setTouched] = useState(false)\n\n const currentValue = value !== undefined ? stripDigits(value.toString()).slice(0, length) : internalValue\n\n const runValidation = useCallback(\n (nextValue: string) => {\n const result = validateCvc(nextValue, length)\n setValidation(result)\n onValidationChange?.(result)\n return result\n },\n [length, onValidationChange]\n )\n\n const handleChange = useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n const nextValue = stripDigits(event.target.value).slice(0, length)\n\n if (value === undefined) {\n setInternalValue(nextValue)\n }\n\n onValueChange?.(nextValue)\n\n if (validateOnChange && touched) {\n runValidation(nextValue)\n }\n\n onChange?.(event)\n },\n [length, onChange, onValueChange, runValidation, touched, validateOnChange, value]\n )\n\n const handleBlur = useCallback(\n (event: React.FocusEvent<HTMLInputElement>) => {\n setTouched(true)\n\n if (validateOnBlur && currentValue) {\n runValidation(currentValue)\n }\n\n onBlur?.(event)\n },\n [currentValue, onBlur, runValidation, validateOnBlur]\n )\n\n const handleKeyDown = useCallback(\n (event: React.KeyboardEvent<HTMLInputElement>) => {\n if (['Backspace', 'Delete', 'Tab', 'ArrowLeft', 'ArrowRight', 'Home', 'End'].includes(event.key)) {\n onKeyDown?.(event)\n return\n }\n\n if (event.ctrlKey || event.metaKey) {\n onKeyDown?.(event)\n return\n }\n\n if (!/^\\d$/.test(event.key)) {\n event.preventDefault()\n }\n\n onKeyDown?.(event)\n },\n [onKeyDown]\n )\n\n const isError = error || (touched && !validation.valid)\n const resolvedErrorText = errorText || (touched && !validation.valid ? validation.error : undefined)\n const isSuccess = !isError && (success !== undefined ? success : touched && currentValue.length === length)\n const endIcon = isSuccess ? <MCheckIcon /> : undefined\n\n return (\n <MInput\n {...rest}\n ref={ref}\n type=\"text\"\n inputMode=\"numeric\"\n value={currentValue}\n onChange={handleChange}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n error={isError}\n errorText={resolvedErrorText}\n success={isSuccess}\n placeholder={placeholder ?? ''.padEnd(length, '0')}\n maxLength={length}\n endIcon={endIcon}\n inputClassName={cn('input-cvc-field', inputClassName)}\n className={className}\n />\n )\n})\n"],"mappings":"0OAWA,IAAM,EAAuB,CAAC,MAAO,GAAK,CAE1C,SAAS,EAAY,EAAe,CAChC,OAAO,EAAM,QAAQ,MAAO,GAAG,CAGnC,SAAS,EAAS,EAAgB,CAK9B,OAJK,EAIE,EAAM,SAAS,EAAG,IAAI,CAAC,MAAM,EAAG,EAAE,CAH9B,GAMf,SAAS,EAAY,EAAgB,EAAe,CAChD,IAAM,EAAgB,EAAS,EAAM,CAC/B,EAAe,GAAM,MAAM,EAAG,EAAE,EAAI,GAU1C,MARI,CAAC,GAAiB,CAAC,EACZ,GAGN,EAIE,GAAG,EAAc,GAAG,IAHhB,EAMf,SAAS,EAAW,EAAe,CAC/B,IAAM,EAAS,EAAY,EAAM,CAAC,MAAM,EAAG,EAAE,CAE7C,MAAO,CACH,MAAO,EAAO,MAAM,EAAG,EAAE,CACzB,KAAM,EAAO,MAAM,EAAG,EAAE,CAC3B,CAGL,SAAS,EAAkB,EAAkB,EAAkB,CAC3D,IAAM,EAAc,IAAI,MAAM,CAAC,aAAa,CACtC,EAAkB,KAAK,IAAI,GAAW,EAAa,EAAY,CAGrE,MAAO,CACH,kBACA,gBAJoB,KAAK,IAAI,GAAW,EAAc,GAAI,EAAgB,CAK7E,CAGL,SAAS,EACL,EACA,CAAC,UAAS,WACM,CAChB,GAAI,CAAC,EACD,OAAO,EAGX,GAAM,CAAC,MAAO,EAAY,KAAM,GAAa,EAAW,EAAM,CAE9D,GAAI,EAAW,SAAW,GAAK,EAAU,SAAW,EAChD,MAAO,CAAC,MAAO,GAAO,MAAO,gCAAgC,CAGjE,IAAM,EAAQ,SAAS,EAAY,GAAG,CAChC,EAAO,SAAS,EAAW,GAAG,CAC9B,CAAC,kBAAiB,mBAAmB,EAAkB,EAAS,EAAQ,CAE9E,GAAI,OAAO,MAAM,EAAM,EAAI,EAAQ,GAAK,EAAQ,GAC5C,MAAO,CAAC,MAAO,GAAO,MAAO,oBAAoB,CAGrD,GAAI,OAAO,MAAM,EAAK,CAClB,MAAO,CAAC,MAAO,GAAO,MAAO,mBAAmB,CAGpD,GAAI,EAAO,EACP,MAAO,CAAC,MAAO,GAAO,MAAO,gBAAgB,EAAgB,WAAW,CAG5E,GAAI,EAAO,EACP,MAAO,CAAC,MAAO,GAAO,MAAO,gBAAgB,EAAgB,aAAa,CAG9E,IAAM,EAAM,IAAI,KACV,EAAe,EAAI,UAAU,CAAG,EAChC,EAAc,EAAI,aAAa,CAMrC,OAJI,EAAO,GAAgB,IAAS,GAAe,EAAQ,EAChD,CAAC,MAAO,GAAO,MAAO,mBAAmB,CAG7C,EAGX,IAAa,GAAA,EAAA,EAAA,YAAiE,SAC1E,CACI,iBAAiB,GACjB,mBAAmB,GACnB,UACA,UACA,qBACA,gBACA,SACA,eACA,OACA,KACA,WAAW,GACX,YAAW,GACX,WAAW,GACX,aAAY,GACZ,WAAU,WACV,QAAO,KACP,QACA,aAAY,GACZ,UAAU,GACV,QACA,aACA,YACA,YACA,UACA,aAAY,GACZ,QAAQ,GACR,UACA,WACA,UACA,SACA,WACA,aACA,SACA,mBAEJ,EACF,CACE,IAAM,GAAA,EAAA,EAAA,QAAoC,KAAK,CACzC,IAAA,EAAA,EAAA,QAAiC,KAAK,CACtC,CAAC,eAAc,oBAAmB,EAAA,EAAsB,GAAO,EAAa,CAC5E,CAAC,EAAY,IAAA,EAAA,EAAA,UAA4C,EAAG,CAC5D,CAAC,EAAS,IAAA,EAAA,EAAA,UAAuB,GAAM,CACvC,CAAC,EAAS,IAAA,EAAA,EAAA,UAAuB,GAAM,CACvC,CAAC,GAAe,KAAA,EAAA,EAAA,UAA6B,GAAM,CACnD,CAAC,GAAc,KAAA,EAAA,EAAA,UAA4B,GAAM,CAEjD,CAAC,QAAO,QAAQ,EAAW,EAAa,CACxC,GAAa,GAAQ,GAAS,GAC9B,EAAkB,GAAY,GAC9B,CAAC,kBAAiB,oBAAmB,EAAkB,EAAS,EAAQ,CACxE,IAAA,EAAA,EAAA,aACI,MAAM,KAAK,CAAC,OAAQ,GAAkB,EAAkB,EAAE,EAAG,EAAG,IAAU,EAAkB,EAAM,CACxG,CAAC,GAAiB,EAAgB,CACrC,CAEK,GAAA,EAAA,EAAA,aACD,GAA2B,CACxB,IAAM,EAAS,EAAgB,EAAgB,CAAC,UAAS,UAAQ,CAAC,CAGlE,OAFA,EAAc,EAAO,CACrB,IAAqB,EAAO,CACrB,GAEX,CAAC,EAAS,EAAS,EAAmB,CACzC,CAEK,GAAA,EAAA,EAAA,aACD,GAA2B,CACxB,GAAgB,EAAe,CAC/B,IAAgB,EAAY,EAAe,CAAE,EAAe,CAE5D,IAAM,EAAS,GAA2C,SAAW,EAAS,QAC1E,KACkB,OAAO,yBAAyB,iBAAiB,UAAW,QAAQ,EAAE,MAC7E,KAAK,EAAO,EAAe,CACtC,EAAM,cAAc,IAAI,MAAM,QAAS,CAAC,QAAS,GAAK,CAAC,CAAC,GAGhE,CAAC,EAAe,EAAK,GAAgB,CACxC,CAEK,GAAA,EAAA,EAAA,cACD,EAAoB,IAAsB,CACvC,IAAM,EAAiB,EAAY,EAAW,EAAS,CACvD,EAAU,EAAe,CAErB,GAAoB,GACpB,EAAc,EAAe,EAGrC,CAAC,EAAe,EAAW,EAAS,EAAiB,CACxD,CAEK,GAAA,EAAA,EAAA,iBAAqC,EACxB,GAA2C,SAAW,EAAS,UACvE,OAAO,EACf,CAAC,EAAI,CAAC,CAEH,IAAA,EAAA,EAAA,aACD,GAA4C,CACzC,GAAI,EACA,OAGJ,EAAW,GAAK,CAChB,IAAM,EAAS,GAA2C,SAAW,EAAS,QAC1E,GAAS,EAAM,SAAW,GAC1B,IAAU,EAAuD,EAGzE,CAAC,EAAS,EAAS,EAAI,CAC1B,CAEK,IAAA,EAAA,EAAA,aACD,GAA4C,CACzC,IAAM,EAAa,EAAM,cAErB,GAAc,GAAQ,SAAS,SAAS,EAAW,GAIvD,EAAW,GAAM,CACjB,EAAW,GAAK,CAEZ,GAAkB,GAClB,EAAc,EAAa,CAG/B,IAAS,EAAuD,GAEpE,CAAC,EAAc,EAAQ,EAAe,EAAe,CACxD,CAEK,IAAA,EAAA,EAAA,aACD,GAAsB,CACnB,GAAkB,CAClB,EAAY,EAAW,EAAK,EAEhC,CAAC,EAAkB,EAAa,EAAK,CACxC,CAEK,IAAA,EAAA,EAAA,aACD,GAAqB,CAClB,GAAkB,CAClB,EAAY,EAAO,EAAS,EAEhC,CAAC,EAAkB,EAAO,EAAY,CACzC,CAEK,IAAA,EAAA,EAAA,iBAAgC,CAClC,EAAU,GAAG,CACb,EAAW,GAAM,CACjB,EAAc,EAAG,CACjB,IAAqB,EAAG,CACxB,MAAW,CACX,GAAkB,EACnB,CAAC,EAAkB,GAAS,EAAoB,EAAU,CAAC,CAExD,EAAW,GAAU,GAAW,CAAC,EAAW,MAC5C,EAAoB,IAAc,GAAW,CAAC,EAAW,MAAQ,EAAW,MAAQ,IAAA,IACpF,GACF,CAAC,IAAa,IAAY,IAAA,GAAsB,GAAW,EAAW,OAAS,GAAQ,GAAS,GAA1D,GACpC,GAAqB,EAAW,cAAgB,EAAQ,SAAS,IAAU,IAAA,GAE3E,GAAmB,EAAA,EACrB,YACA,SAAS,KACT,SAAS,KACT,GAAW,UACX,GAAY,cACZ,IAAa,CAAC,GAAY,gBAC1B,GACA,GAAY,WACZ,GAAW,UACd,CAEK,GAAa,GAAS,KACtB,GAAY,GAAQ,OAE1B,OACI,EAAA,EAAA,MAAC,MAAD,CACI,IAAK,GACL,UAAW,EAAA,EAAG,QAAS,iBAAkB,GAAoB,IAAa,aAAc,GAAU,CAC3F,SACP,eAAgB,GAChB,cAAe,YALnB,CAOK,IACG,EAAA,EAAA,KAAC,QAAD,CACI,QAAS,EACT,UAAW,EAAA,EACP,cACA,GAAW,UACX,GAAY,QACZ,IAAa,CAAC,GAAY,UAC1B,GAAY,WACZ,GACH,UAEA,EACG,CAAA,EAGZ,EAAA,EAAA,MAAC,MAAD,CAAK,UAAW,GAAkB,QAAS,WAA3C,CACK,IAAa,EAAA,EAAA,KAAC,OAAD,CAAM,UAAU,sBAAc,EAAiB,CAAA,EAE7D,EAAA,EAAA,KAAC,QAAD,CACI,IAAK,GAAO,EACZ,KAAK,OACL,MAAO,EACD,OACF,KACJ,SAAA,GACU,WACC,aACX,UAAU,wBACV,SAAU,GACV,cAAY,OACF,WACD,UACD,SACV,CAAA,EAEF,EAAA,EAAA,MAAC,MAAD,CAAK,UAAU,0BAA0B,aAAW,2BAApD,CACK,GACG,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAA,EAAG,yBAA0B,CAAC,GAAS,cAAe,SAAS,WAC5E,EAAA,EAAA,KAAC,OAAD,CAAA,SAAO,GAAkB,CAAA,CACtB,CAAA,EAEP,EAAA,EAAA,KAAC,EAAA,EAAD,CACI,SACI,EAAA,EAAA,MAAC,OAAD,CACI,UAAW,EAAA,EACP,yBACA,IAAiB,OACjB,CAAC,GAAS,cACb,CACD,YAAa,WANjB,EAQI,EAAA,EAAA,KAAC,OAAD,CAAA,SAAO,GAAkB,CAAA,EACzB,EAAA,EAAA,KAAC,EAAA,GAAD,CAAkB,KAAM,GAAM,CAAA,CAC3B,GAEX,OAAO,QACP,cAAA,GACA,aAAc,GACd,iBAAiB,kCAEhB,MAAM,KAAK,CAAC,OAAQ,GAAG,EAAG,EAAG,IAAU,CACpC,IAAM,EAAS,OAAO,EAAQ,EAAE,CAAC,SAAS,EAAG,IAAI,CAEjD,OACI,EAAA,EAAA,KAAC,EAAA,EAAD,CAEI,MAAO,EACP,OAAQ,IAAU,EAClB,YAAe,GAAkB,EAAO,CAC1C,CAJO,EAIP,EAER,CACU,CAAA,EAGpB,EAAA,EAAA,KAAC,OAAD,CAAM,UAAU,oCAA2B,IAAQ,CAAA,CAElD,GACG,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAA,EAAG,yBAA0B,CAAC,GAAQ,cAAe,SAAS,WAC3E,EAAA,EAAA,KAAC,OAAD,CAAA,SAAO,GAAiB,CAAA,CACrB,CAAA,EAEP,EAAA,EAAA,KAAC,EAAA,EAAD,CACI,SACI,EAAA,EAAA,MAAC,OAAD,CACI,UAAW,EAAA,EACP,yBACA,IAAgB,OAChB,CAAC,GAAQ,cACZ,CACD,YAAa,WANjB,EAQI,EAAA,EAAA,KAAC,OAAD,CAAA,SAAO,GAAiB,CAAA,EACxB,EAAA,EAAA,KAAC,EAAA,GAAD,CAAkB,KAAM,GAAM,CAAA,CAC3B,GAEX,OAAO,QACP,cAAA,GACA,aAAc,GACd,iBAAiB,kCAEhB,GAAY,IAAK,IACd,EAAA,EAAA,KAAC,EAAA,EAAD,CAEI,MAAO,OAAO,EAAO,CACrB,OAAQ,IAAS,OAAO,EAAO,CAC/B,YAAe,GAAiB,OAAO,EAAO,CAAC,CACjD,CAJO,EAIP,CACJ,CACU,CAAA,CAElB,GAEL,IAAa,IAAc,CAAC,IACzB,EAAA,EAAA,KAAC,SAAD,CACI,KAAK,SACL,UAAU,2BACV,QAAU,GAAU,CAChB,EAAM,iBAAiB,CACvB,IAAa,EAEjB,SAAU,GACV,aAAW,wBAEX,EAAA,EAAA,KAAC,EAAA,GAAD,EAAc,CAAA,CACT,CAAA,CAGZ,IAAW,EAAA,EAAA,KAAC,OAAD,CAAM,UAAU,oBAAY,EAAe,CAAA,CACrD,IAEJ,GAAqB,KACnB,EAAA,EAAA,KAAC,MAAD,CAAK,UAAU,uBACX,EAAA,EAAA,MAAC,OAAD,CAAA,SAAA,CACK,IACG,EAAA,EAAA,KAAC,OAAD,CAAM,GAAI,EAAK,GAAG,EAAG,QAAU,IAAA,GAAW,UAAU,cAAc,KAAK,iBAClE,EACE,CAAA,CAEV,CAAC,GAAqB,IACnB,EAAA,EAAA,KAAC,OAAD,CAAM,GAAI,EAAK,GAAG,EAAG,SAAW,IAAA,GAAW,UAAU,wBAChD,EACE,CAAA,CAER,CAAA,CAAA,CACL,CAAA,CAER,IAEZ,CClbI,EAAuB,CAAC,MAAO,GAAK,CAE1C,SAAS,EAAY,EAAe,CAChC,OAAO,EAAM,QAAQ,MAAO,GAAG,CAGnC,SAAS,EAAY,EAAe,EAAiC,CAWjE,OAVK,EAIU,EAAY,EAAM,CAEtB,SAAW,EAIf,EAHI,CAAC,MAAO,GAAO,MAAO,2BAA2B,EAAO,SAAS,CANjE,EAYf,IAAa,GAAA,EAAA,EAAA,YAAyD,SAClE,CACI,SAAS,EACT,iBAAiB,GACjB,mBAAmB,GACnB,qBACA,gBACA,QACA,eACA,WACA,SACA,YACA,SACA,YACA,UACA,cACA,YACA,kBACA,GAAG,GAEP,GACF,CACE,GAAM,CAAC,GAAe,KAAA,EAAA,EAAA,cAClB,EAAY,GAAc,UAAU,EAAI,GAAG,CAAC,MAAM,EAAG,EAAO,CAC/D,CACK,CAAC,EAAY,KAAA,EAAA,EAAA,UAA4C,EAAG,CAC5D,CAAC,EAAS,IAAA,EAAA,EAAA,UAAuB,GAAM,CAEvC,EAAe,IAAU,IAAA,GAA6D,GAAjD,EAAY,EAAM,UAAU,CAAC,CAAC,MAAM,EAAG,EAAO,CAEnF,GAAA,EAAA,EAAA,aACD,GAAsB,CACnB,IAAM,EAAS,EAAY,EAAW,EAAO,CAG7C,OAFA,GAAc,EAAO,CACrB,IAAqB,EAAO,CACrB,GAEX,CAAC,EAAQ,EAAmB,CAC/B,CAEK,GAAA,EAAA,EAAA,aACD,GAA+C,CAC5C,IAAM,EAAY,EAAY,EAAM,OAAO,MAAM,CAAC,MAAM,EAAG,EAAO,CAE9D,IAAU,IAAA,IACV,GAAiB,EAAU,CAG/B,IAAgB,EAAU,CAEtB,GAAoB,GACpB,EAAc,EAAU,CAG5B,IAAW,EAAM,EAErB,CAAC,EAAQ,EAAU,EAAe,EAAe,EAAS,EAAkB,EAAM,CACrF,CAEK,GAAA,EAAA,EAAA,aACD,GAA8C,CAC3C,EAAW,GAAK,CAEZ,GAAkB,GAClB,EAAc,EAAa,CAG/B,IAAS,EAAM,EAEnB,CAAC,EAAc,EAAQ,EAAe,EAAe,CACxD,CAEK,IAAA,EAAA,EAAA,aACD,GAAiD,CAC9C,GAAI,CAAC,YAAa,SAAU,MAAO,YAAa,aAAc,OAAQ,MAAM,CAAC,SAAS,EAAM,IAAI,CAAE,CAC9F,IAAY,EAAM,CAClB,OAGJ,GAAI,EAAM,SAAW,EAAM,QAAS,CAChC,IAAY,EAAM,CAClB,OAGC,OAAO,KAAK,EAAM,IAAI,EACvB,EAAM,gBAAgB,CAG1B,IAAY,EAAM,EAEtB,CAAC,EAAU,CACd,CAEK,EAAU,IAAU,GAAW,CAAC,EAAW,MAC3C,EAAoB,IAAc,GAAW,CAAC,EAAW,MAAQ,EAAW,MAAQ,IAAA,IACpF,EAAY,CAAC,IAAY,IAAY,IAAA,GAAsB,GAAW,EAAa,SAAW,EAA7C,GACjD,EAAU,GAAY,EAAA,EAAA,KAAC,EAAA,GAAD,EAAc,CAAA,CAAG,IAAA,GAE7C,OACI,EAAA,EAAA,KAAC,EAAA,EAAD,CACI,GAAI,EACC,OACL,KAAK,OACL,UAAU,UACV,MAAO,EACP,SAAU,EACV,OAAQ,EACR,UAAW,GACX,MAAO,EACP,UAAW,EACX,QAAS,EACT,YAAa,GAAe,GAAG,OAAO,EAAQ,IAAI,CAClD,UAAW,EACF,UACT,eAAgB,EAAA,EAAG,kBAAmB,GAAe,CAC1C,YACb,CAAA,EAER"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
require(`./chunk-350yNsax.cjs`);const e=require(`./icons-
|
|
2
|
-
//# sourceMappingURL=MInputSearch-
|
|
1
|
+
require(`./chunk-350yNsax.cjs`);const e=require(`./icons-BJCV7W0L.cjs`),t=require(`./useGhostText-D1DbIs-n.cjs`),n=require(`./MInput-DDZ71Qqn.cjs`);let r=require(`react`),i=require(`react/jsx-runtime`);var a=(0,r.forwardRef)(function({debounceMs:a=300,onSearch:o,value:s,defaultValue:c,onChange:l,onKeyDown:u,onClear:d,clearable:f=!0,placeholder:p=`Search...`,...m},h){let[g,_]=(0,r.useState)(c?.toString()??``),v=s===void 0?g:s.toString(),y=t.r(e=>o?.(e),a),b=(0,r.useCallback)(e=>{s===void 0&&_(e.target.value),y(e.target.value),l?.(e)},[l,s,y]),x=(0,r.useCallback)(e=>{e.key===`Enter`&&o?.(v),u?.(e)},[v,o,u]),S=(0,r.useCallback)(()=>{s===void 0&&_(``),o?.(``),d?.()},[s,o,d]);return(0,i.jsx)(n.t,{...m,ref:h,type:`text`,value:v,onChange:b,onKeyDown:x,onClear:S,clearable:f,placeholder:p,startIcon:(0,i.jsx)(e.Ri,{})})});Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return a}});
|
|
2
|
+
//# sourceMappingURL=MInputSearch-30o4bcDC.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MInputSearch-
|
|
1
|
+
{"version":3,"file":"MInputSearch-30o4bcDC.cjs","names":[],"sources":["../src/components/inputs/MInputSearch/MInputSearch.tsx"],"sourcesContent":["import {useState, useCallback, forwardRef} from 'react'\nimport type * as React from 'react'\nimport type {MInputSearchProps} from './MInputSearch.types'\nimport {MInput} from '../MInput'\nimport {useDebouncedCallback} from '../../../utils/useDebounce'\nimport {MSearchIcon} from '../../../icons'\n\n// Extend the base input with debounced search callbacks and an inline clear action.\nexport const MInputSearch = forwardRef<HTMLInputElement, MInputSearchProps>(function MInputSearch(\n {\n debounceMs = 300,\n onSearch,\n value,\n defaultValue,\n onChange,\n onKeyDown,\n onClear,\n clearable = true,\n placeholder = 'Search...',\n ...rest\n },\n ref\n) {\n const [internalValue, setInternalValue] = useState(defaultValue?.toString() ?? '')\n const currentValue = value !== undefined ? value.toString() : internalValue\n\n const debouncedSearch = useDebouncedCallback((val: string) => onSearch?.(val), debounceMs)\n\n // Update local state and debounce search notifications while typing.\n const handleChange = useCallback(\n (e: React.ChangeEvent<HTMLInputElement>) => {\n if (value === undefined) {\n setInternalValue(e.target.value)\n }\n debouncedSearch(e.target.value)\n onChange?.(e)\n },\n [onChange, value, debouncedSearch]\n )\n\n // Run search immediately when the user confirms with Enter.\n const handleKeyDown = useCallback(\n (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === 'Enter') {\n onSearch?.(currentValue)\n }\n onKeyDown?.(e)\n },\n [currentValue, onSearch, onKeyDown]\n )\n\n // Clear both the visible field and the emitted search query.\n const handleClear = useCallback(() => {\n if (value === undefined) {\n setInternalValue('')\n }\n onSearch?.('')\n onClear?.()\n }, [value, onSearch, onClear])\n\n return (\n <MInput\n {...rest}\n ref={ref}\n type=\"text\"\n value={currentValue}\n onChange={handleChange}\n onKeyDown={handleKeyDown}\n onClear={handleClear}\n clearable={clearable}\n placeholder={placeholder}\n startIcon={<MSearchIcon />}\n />\n )\n})\n"],"mappings":"0MAQA,IAAa,GAAA,EAAA,EAAA,YAA+D,SACxE,CACI,aAAa,IACb,WACA,QACA,eACA,WACA,YACA,UACA,YAAY,GACZ,cAAc,YACd,GAAG,GAEP,EACF,CACE,GAAM,CAAC,EAAe,IAAA,EAAA,EAAA,UAA6B,GAAc,UAAU,EAAI,GAAG,CAC5E,EAAe,IAAU,IAAA,GAA+B,EAAnB,EAAM,UAAU,CAErD,EAAkB,EAAA,EAAsB,GAAgB,IAAW,EAAI,CAAE,EAAW,CAGpF,GAAA,EAAA,EAAA,aACD,GAA2C,CACpC,IAAU,IAAA,IACV,EAAiB,EAAE,OAAO,MAAM,CAEpC,EAAgB,EAAE,OAAO,MAAM,CAC/B,IAAW,EAAE,EAEjB,CAAC,EAAU,EAAO,EAAgB,CACrC,CAGK,GAAA,EAAA,EAAA,aACD,GAA6C,CACtC,EAAE,MAAQ,SACV,IAAW,EAAa,CAE5B,IAAY,EAAE,EAElB,CAAC,EAAc,EAAU,EAAU,CACtC,CAGK,GAAA,EAAA,EAAA,iBAAgC,CAC9B,IAAU,IAAA,IACV,EAAiB,GAAG,CAExB,IAAW,GAAG,CACd,KAAW,EACZ,CAAC,EAAO,EAAU,EAAQ,CAAC,CAE9B,OACI,EAAA,EAAA,KAAC,EAAA,EAAD,CACI,GAAI,EACC,MACL,KAAK,OACL,MAAO,EACP,SAAU,EACV,UAAW,EACX,QAAS,EACE,YACE,cACb,WAAW,EAAA,EAAA,KAAC,EAAA,GAAD,EAAe,CAAA,CAC5B,CAAA,EAER"}
|