@feugene/granularity 0.9.4 → 0.11.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 +44 -45
- package/dist/GrButtonGroup.css +1 -1
- package/dist/GrFormFile.css +1 -1
- package/dist/GrIcon.css +1 -1
- package/dist/GrLoading.css +1 -1
- package/dist/GrSkeleton.css +1 -1
- package/dist/GrToaster.css +1 -0
- package/dist/GrTree.css +1 -1
- package/dist/chunks/{adapter-BqqjEZGU.js.map → adapter-CAOxmn2G.js.map} +1 -1
- package/dist/chunks/arrow-up-C_G4jg8M.js.map +1 -0
- package/dist/chunks/{classTokens-BPeBXNzu.js.map → classTokens-BzazaERD.js.map} +1 -1
- package/dist/chunks/{config-B_nSBc7W.js → config-1uSYl98Y.js} +5 -5
- package/dist/chunks/{config-B_nSBc7W.js.map → config-1uSYl98Y.js.map} +1 -1
- package/dist/chunks/{config-DaHI5bD_2.js.map → config-8Pcutu1j2.js.map} +1 -1
- package/dist/chunks/{config-DoBk_CzG.js.map → config-B0qIpo8m.js.map} +1 -1
- package/dist/chunks/{config-BY81UKv0.js → config-B7IIWGt_2.js} +3 -3
- package/dist/chunks/config-B7IIWGt_2.js.map +1 -0
- package/dist/chunks/{config-DbghHyY_.js.map → config-BEegFP74.js.map} +1 -1
- package/dist/chunks/{config-72sW9Bag2.js → config-BIRO0vDJ2.js} +6 -6
- package/dist/chunks/{config-72sW9Bag2.js.map → config-BIRO0vDJ2.js.map} +1 -1
- package/dist/chunks/{config-Dzd6BzIN2.js.map → config-BLHqZhy-2.js.map} +1 -1
- package/dist/chunks/{config-BV4vBzdm.js.map → config-BNu8lFQB.js.map} +1 -1
- package/dist/chunks/config-BOlr7qw7.js +106 -0
- package/dist/chunks/config-BOlr7qw7.js.map +1 -0
- package/dist/chunks/{config-B1kFmhpM.js.map → config-BUHuGBik.js.map} +1 -1
- package/dist/chunks/{config-DF_RlCIO.js.map → config-BWGGp7uV.js.map} +1 -1
- package/dist/chunks/config-BX1JTrkV2.js +14 -0
- package/dist/chunks/config-BX1JTrkV2.js.map +1 -0
- package/dist/chunks/{config-BduXEXjt.js.map → config-BXtAmU3s.js.map} +1 -1
- package/dist/chunks/{config-O1_FTqD3.js.map → config-Bah4oHwL.js.map} +1 -1
- package/dist/chunks/{config-Br_qI3Za.js → config-C49QUoJL.js} +3 -3
- package/dist/chunks/config-C49QUoJL.js.map +1 -0
- package/dist/chunks/{config-3I3vqDW4.js → config-C4snOIXg.js} +1 -1
- package/dist/chunks/{config-3I3vqDW4.js.map → config-C4snOIXg.js.map} +1 -1
- package/dist/chunks/{config-CdJpnjDj.js → config-C7NpDrfO.js} +5 -5
- package/dist/chunks/{config-CdJpnjDj.js.map → config-C7NpDrfO.js.map} +1 -1
- package/dist/chunks/{config-DSBlHQVa.js.map → config-C86UzUYf.js.map} +1 -1
- package/dist/chunks/{config-BgBWt9-A.js.map → config-C9AcVDkv.js.map} +1 -1
- package/dist/chunks/{config-BeQuykDk2.js.map → config-CGHLoBlH2.js.map} +1 -1
- package/dist/chunks/{config-ChQxl75m.js.map → config-CThzliFi.js.map} +1 -1
- package/dist/chunks/{config-DmjwIqx1.js.map → config-Cb2PAlSD.js.map} +1 -1
- package/dist/chunks/{config-BnWSHTEU.js → config-ClhKPJvg.js} +5 -5
- package/dist/chunks/{config-BnWSHTEU.js.map → config-ClhKPJvg.js.map} +1 -1
- package/dist/chunks/{config-d386uO3O.js → config-Cpi9Mh2J.js} +3 -3
- package/dist/chunks/{config-d386uO3O.js.map → config-Cpi9Mh2J.js.map} +1 -1
- package/dist/chunks/{config-Cp_XHsze.js → config-CrG1XiE7.js} +4 -4
- package/dist/chunks/{config-Cp_XHsze.js.map → config-CrG1XiE7.js.map} +1 -1
- package/dist/chunks/{config-C5OwJM3-.js → config-CziwTDDL.js} +3 -3
- package/dist/chunks/{config-C5OwJM3-.js.map → config-CziwTDDL.js.map} +1 -1
- package/dist/chunks/{config-BbKroFtR.js.map → config-D7GZO-Dx.js.map} +1 -1
- package/dist/chunks/{config-CUwF4E4R.js.map → config-DBmdgoVf.js.map} +1 -1
- package/dist/chunks/{config-C9MblwGq.js.map → config-DICOd-2X.js.map} +1 -1
- package/dist/chunks/{config-C6zT56Jc2.js → config-DUcu1D68.js} +3 -3
- package/dist/chunks/config-DUcu1D68.js.map +1 -0
- package/dist/chunks/{config-D4s_QWVP.js → config-D_R56_gT.js} +5 -5
- package/dist/chunks/{config-D4s_QWVP.js.map → config-D_R56_gT.js.map} +1 -1
- package/dist/chunks/{config-_3De4HFf.js → config-DezDih8_.js} +4 -4
- package/dist/chunks/config-DezDih8_.js.map +1 -0
- package/dist/chunks/{config-CFf7xaG1.js → config-DnvPqu4g.js} +3 -3
- package/dist/chunks/{config-CFf7xaG1.js.map → config-DnvPqu4g.js.map} +1 -1
- package/dist/chunks/{config-D6Oe3blW2.js.map → config-DpqOnJiz2.js.map} +1 -1
- package/dist/chunks/{config-V3LF-b_F.js.map → config-Dxuwwepq.js.map} +1 -1
- package/dist/chunks/{config-CvGdaXvH.js.map → config-HZto2PVy.js.map} +1 -1
- package/dist/chunks/{config-BOdu-O_B.js.map → config-JOtB4mzs.js.map} +1 -1
- package/dist/chunks/{config-iuMz79Mg.js.map → config-JpHA4Xx0.js.map} +1 -1
- package/dist/chunks/{config-CetsgpaZ2.js → config-LGrZIdaZ2.js} +1 -1
- package/dist/chunks/{config-CetsgpaZ2.js.map → config-LGrZIdaZ2.js.map} +1 -1
- package/dist/chunks/{config-Dcb7xK-C.js.map → config-PFg39mYo.js.map} +1 -1
- package/dist/chunks/{config-CU_CBd0k.js → config-QYGvEBu5.js} +2 -2
- package/dist/chunks/{config-CU_CBd0k.js.map → config-QYGvEBu5.js.map} +1 -1
- package/dist/chunks/{config-BU0olrvr.js.map → config-QaIc_gRa.js.map} +1 -1
- package/dist/chunks/{config-vcDVCYXo.js.map → config-U4m9PSql.js.map} +1 -1
- package/dist/chunks/{config-Ci9nXGUV.js.map → config-ZiXWIRBX.js.map} +1 -1
- package/dist/chunks/{config-B2YTEe_h.js → config-eYLZYOUS2.js} +63 -63
- package/dist/chunks/config-eYLZYOUS2.js.map +1 -0
- package/dist/chunks/{config-Bcf-8XlK2.js.map → config-ipvU0lzP2.js.map} +1 -1
- package/dist/chunks/{config-B61cX08u.js → config-jBp9wVv-.js} +4 -4
- package/dist/chunks/{config-B61cX08u.js.map → config-jBp9wVv-.js.map} +1 -1
- package/dist/chunks/{config-D5ek7VSi.js.map → config-xR4XVmcy.js.map} +1 -1
- package/dist/chunks/{dialogShared-BtXUk6Zc.js.map → dialogShared-CxW62PQE.js.map} +1 -1
- package/dist/chunks/en-BdtiS2d3.js +138 -0
- package/dist/chunks/en-BdtiS2d3.js.map +1 -0
- package/dist/chunks/es-BGRMZbe9.js +138 -0
- package/dist/chunks/es-BGRMZbe9.js.map +1 -0
- package/dist/chunks/{es-Bx3Kuy6z.js → es-DBhctWg-.js} +3 -3
- package/dist/chunks/{es-Bx3Kuy6z.js.map → es-DBhctWg-.js.map} +1 -1
- package/dist/chunks/{fileValidation-c_iBg74s.js → fileValidation-C3WFaWU2.js} +2 -1
- package/dist/chunks/{fileValidation-c_iBg74s.js.map → fileValidation-C3WFaWU2.js.map} +1 -1
- package/dist/chunks/{grBadgeStyles-Cq0hH2Ls.js → grBadgeStyles-DrycBuKT.js} +13 -13
- package/dist/chunks/grBadgeStyles-DrycBuKT.js.map +1 -0
- package/dist/chunks/grButtonStyles-C7Yga_Q1.js +191 -0
- package/dist/chunks/grButtonStyles-C7Yga_Q1.js.map +1 -0
- package/dist/chunks/grDropdownStyles-B_-DKytw.js +35 -0
- package/dist/chunks/grDropdownStyles-B_-DKytw.js.map +1 -0
- package/dist/chunks/{grLoadingStyles-DmI-SJ3i.js.map → grLoadingStyles-R5sreH__.js.map} +1 -1
- package/dist/chunks/{grModalStyles-DS1Vl6EW.js → grModalStyles-DWd3i05Q.js} +7 -7
- package/dist/chunks/grModalStyles-DWd3i05Q.js.map +1 -0
- package/dist/chunks/{grSelectStyles-pUt19VGy.js → grSelectStyles-CLK5hRd3.js} +3 -3
- package/dist/chunks/grSelectStyles-CLK5hRd3.js.map +1 -0
- package/dist/chunks/{grStyle-CUaTmpyW.js → grStyle-Blc9otAx.js} +6 -6
- package/dist/chunks/grStyle-Blc9otAx.js.map +1 -0
- package/dist/chunks/{granularityI18n-LcJ88Vce.js → granularityI18n-DoV7Ca2m.js} +18 -3
- package/dist/chunks/granularityI18n-DoV7Ca2m.js.map +1 -0
- package/dist/chunks/info-Be2OccTu.js.map +1 -0
- package/dist/chunks/loader-circle-CfVLz7lb.js.map +1 -0
- package/dist/chunks/ru-BFCnOiML.js +138 -0
- package/dist/chunks/ru-BFCnOiML.js.map +1 -0
- package/dist/chunks/{safelist-_UVzJrgE2.js → safelist-CkF4v7DC.js} +3 -3
- package/dist/chunks/safelist-CkF4v7DC.js.map +1 -0
- package/dist/chunks/{safelist-DccvJqCE.js → safelist-Do2RtzLB.js} +3 -3
- package/dist/chunks/{safelist-DccvJqCE.js.map → safelist-Do2RtzLB.js.map} +1 -1
- package/dist/chunks/shared-ChvcQgDl.js +168 -0
- package/dist/chunks/shared-ChvcQgDl.js.map +1 -0
- package/dist/chunks/{transition-mJ3PZCHH.js → transition-TLFw4KBn.js} +26 -12
- package/dist/chunks/{transition-mJ3PZCHH.js.map → transition-TLFw4KBn.js.map} +1 -1
- package/dist/chunks/useAddonMeasurement-DM0akF4C.js +65 -0
- package/dist/chunks/useAddonMeasurement-DM0akF4C.js.map +1 -0
- package/dist/chunks/useEscapeToClose-C2t_S1gh.js +27 -0
- package/dist/chunks/useEscapeToClose-C2t_S1gh.js.map +1 -0
- package/dist/chunks/useFloating-DtM6TyE4.js +1249 -0
- package/dist/chunks/useFloating-DtM6TyE4.js.map +1 -0
- package/dist/chunks/x-2KXnqxiD.js.map +1 -0
- package/dist/chunks/x-circle-BCBURwyX.js.map +1 -0
- package/dist/components/GrAlert/chunks/{GrAlert-HyCjYJeL.js → GrAlert-DPJSU_fG.js} +40 -37
- package/dist/components/GrAlert/chunks/GrAlert-DPJSU_fG.js.map +1 -0
- package/dist/components/GrAlert/index.js +2 -2
- package/dist/components/GrAvatar/chunks/{GrAvatar-BjnPKNAL.js → GrAvatar-96CpTCq5.js} +2 -2
- package/dist/components/GrAvatar/chunks/{GrAvatar-BjnPKNAL.js.map → GrAvatar-96CpTCq5.js.map} +1 -1
- package/dist/components/GrAvatar/index.js +2 -2
- package/dist/components/GrBadge/chunks/{GrBadge-Cs_cVfuO.js → GrBadge-B77XlaqE.js} +3 -3
- package/dist/components/GrBadge/chunks/{GrBadge-Cs_cVfuO.js.map → GrBadge-B77XlaqE.js.map} +1 -1
- package/dist/components/GrBadge/index.js +2 -2
- package/dist/components/GrBadgeWrap/chunks/{GrBadgeWrap-BEnE9DyJ.js → GrBadgeWrap-CcktMOdg.js} +2 -2
- package/dist/components/GrBadgeWrap/chunks/{GrBadgeWrap-BEnE9DyJ.js.map → GrBadgeWrap-CcktMOdg.js.map} +1 -1
- package/dist/components/GrBadgeWrap/index.js +2 -2
- package/dist/components/GrBottomNav/chunks/{GrBottomNav-XPHwd7UQ.js.map → GrBottomNav-usuMgG8_.js.map} +1 -1
- package/dist/components/GrBottomNav/index.js +2 -2
- package/dist/components/GrButton/chunks/GrButton-BlffdeJr.js +124 -0
- package/dist/components/GrButton/chunks/GrButton-BlffdeJr.js.map +1 -0
- package/dist/components/GrButton/index.js +4 -4
- package/dist/components/GrButtonGroup/chunks/{GrButtonGroup-CPOH6V-P.js → GrButtonGroup-Bs9dEKfA.js} +1 -1
- package/dist/components/GrButtonGroup/chunks/GrButtonGroup-Bs9dEKfA.js.map +1 -0
- package/dist/components/GrButtonGroup/index.js +2 -2
- package/dist/components/GrCard/chunks/{GrCard-6yk1RRAQ.js → GrCard-DUNMkuHW.js} +3 -3
- package/dist/components/GrCard/chunks/GrCard-DUNMkuHW.js.map +1 -0
- package/dist/components/GrCard/index.js +2 -2
- package/dist/components/GrCheckbox/chunks/{GrCheckbox-Bt3d7ckE.js → GrCheckbox-DJhzZZdO.js} +66 -18
- package/dist/components/GrCheckbox/chunks/GrCheckbox-DJhzZZdO.js.map +1 -0
- package/dist/components/GrCheckbox/index.js +2 -2
- package/dist/components/GrCollapse/chunks/{GrCollapse-CU94BTAR.js → GrCollapse-CPPLh_xU.js} +12 -12
- package/dist/components/GrCollapse/chunks/{GrCollapse-CU94BTAR.js.map → GrCollapse-CPPLh_xU.js.map} +1 -1
- package/dist/components/GrCollapse/index.js +2 -2
- package/dist/components/GrConfirmDialog/chunks/{GrConfirmDialog-Br6WJkLE.js → GrConfirmDialog-BWYKCsHd.js} +20 -14
- package/dist/components/GrConfirmDialog/chunks/GrConfirmDialog-BWYKCsHd.js.map +1 -0
- package/dist/components/GrConfirmDialog/index.js +2 -2
- package/dist/components/GrDataTable/chunks/{GrDataTable-ClcYiyc8.js → GrDataTable-ptbARmJ3.js} +7 -7
- package/dist/components/GrDataTable/chunks/{GrDataTable-ClcYiyc8.js.map → GrDataTable-ptbARmJ3.js.map} +1 -1
- package/dist/components/GrDataTable/index.js +2 -2
- package/dist/components/GrDialog/chunks/{GrDialog-C7XLxp8e.js → GrDialog-5DAS-1Lb.js} +14 -12
- package/dist/components/GrDialog/chunks/GrDialog-5DAS-1Lb.js.map +1 -0
- package/dist/components/GrDialog/index.js +3 -3
- package/dist/components/GrDialogService/chunks/GrDialogService-DY_fmaMu.js +425 -0
- package/dist/components/GrDialogService/chunks/GrDialogService-DY_fmaMu.js.map +1 -0
- package/dist/components/GrDialogService/index.js +3 -0
- package/dist/components/GrDrawer/chunks/{GrDrawer-BW3wtI7h.js → GrDrawer-D1kzsjXN.js} +19 -15
- package/dist/components/GrDrawer/chunks/GrDrawer-D1kzsjXN.js.map +1 -0
- package/dist/components/GrDrawer/index.js +2 -2
- package/dist/components/GrDropdown/chunks/GrDropdown-BXb5Cxxf.js +95 -0
- package/dist/components/GrDropdown/chunks/GrDropdown-BXb5Cxxf.js.map +1 -0
- package/dist/components/GrDropdown/index.js +2 -2
- package/dist/components/GrDropdownMenu/chunks/{GrDropdownMenu-CLPwbiyG.js → GrDropdownMenu-DFEJLPcV.js} +10 -10
- package/dist/components/GrDropdownMenu/chunks/{GrDropdownMenu-CLPwbiyG.js.map → GrDropdownMenu-DFEJLPcV.js.map} +1 -1
- package/dist/components/GrDropdownMenu/index.js +2 -2
- package/dist/components/GrEmptyState/chunks/{GrEmptyState-Dj2V5GaX.js → GrEmptyState-CA3BiTV7.js} +3 -3
- package/dist/components/GrEmptyState/chunks/{GrEmptyState-Dj2V5GaX.js.map → GrEmptyState-CA3BiTV7.js.map} +1 -1
- package/dist/components/GrEmptyState/index.js +2 -2
- package/dist/components/GrFileUpload/chunks/{GrFileUpload-BEKNB1RM.js → GrFileUpload-DvWPpiJS.js} +26 -23
- package/dist/components/GrFileUpload/chunks/GrFileUpload-DvWPpiJS.js.map +1 -0
- package/dist/components/GrFileUpload/index.js +3 -3
- package/dist/components/GrFormField/chunks/{GrFormField-U7c_aDPJ.js → GrFormField-BujNQrw8.js} +1 -1
- package/dist/components/GrFormField/chunks/{GrFormField-U7c_aDPJ.js.map → GrFormField-BujNQrw8.js.map} +1 -1
- package/dist/components/GrFormField/index.js +2 -2
- package/dist/components/GrFormFile/chunks/{GrFormFile-CIleXnfr.js → GrFormFile-CXcqqdvV.js} +38 -31
- package/dist/components/GrFormFile/chunks/GrFormFile-CXcqqdvV.js.map +1 -0
- package/dist/components/GrFormFile/index.js +2 -2
- package/dist/components/GrFormSection/chunks/{GrFormSection-DpGhY7MX.js → GrFormSection-Ce21jcgo.js} +1 -1
- package/dist/components/GrFormSection/chunks/{GrFormSection-DpGhY7MX.js.map → GrFormSection-Ce21jcgo.js.map} +1 -1
- package/dist/components/GrFormSection/index.js +2 -2
- package/dist/components/GrIcon/chunks/{GrIcon-BV7RBU_0.js → GrIcon-D9AWQLk2.js} +3 -3
- package/dist/components/GrIcon/chunks/{GrIcon-BV7RBU_0.js.map → GrIcon-D9AWQLk2.js.map} +1 -1
- package/dist/components/GrIcon/index.js +2 -2
- package/dist/components/GrImageViewer/chunks/{GrImageViewer-CsvXQHM9.js → GrImageViewer-OCUIrNh2.js} +44 -33
- package/dist/components/GrImageViewer/chunks/GrImageViewer-OCUIrNh2.js.map +1 -0
- package/dist/components/GrImageViewer/index.js +2 -2
- package/dist/components/GrInput/chunks/{GrInput-gwFQ1sk4.js → GrInput-C8pOJgCi.js} +43 -66
- package/dist/components/GrInput/chunks/GrInput-C8pOJgCi.js.map +1 -0
- package/dist/components/GrInput/index.js +2 -2
- package/dist/components/GrInputTag/chunks/{GrInputTag-Dcj3F6rQ.js → GrInputTag-zMgFqp2g.js} +27 -24
- package/dist/components/GrInputTag/chunks/GrInputTag-zMgFqp2g.js.map +1 -0
- package/dist/components/GrInputTag/index.js +2 -2
- package/dist/components/GrLink/chunks/{GrLink-BMwn2iJ9.js → GrLink-CYUe-Q8k.js} +14 -7
- package/dist/components/GrLink/chunks/GrLink-CYUe-Q8k.js.map +1 -0
- package/dist/components/GrLink/index.js +2 -2
- package/dist/components/GrList/chunks/{GrList-D8nM1FuV.js → GrList-Dx772Ns4.js} +1 -1
- package/dist/components/GrList/chunks/{GrList-D8nM1FuV.js.map → GrList-Dx772Ns4.js.map} +1 -1
- package/dist/components/GrList/index.js +2 -2
- package/dist/components/GrLoading/chunks/{GrLoading-mfyfghxs.js → GrLoading--X_7rdbb.js} +7 -7
- package/dist/components/GrLoading/chunks/{GrLoading-mfyfghxs.js.map → GrLoading--X_7rdbb.js.map} +1 -1
- package/dist/components/GrLoading/index.js +2 -2
- package/dist/components/GrModal/chunks/{GrModal-lh0lOmoi.js → GrModal-BkjW9jZS.js} +7 -7
- package/dist/components/GrModal/chunks/{GrModal-lh0lOmoi.js.map → GrModal-BkjW9jZS.js.map} +1 -1
- package/dist/components/GrModal/index.js +3 -3
- package/dist/components/GrNavbar/chunks/{GrNavbar-BH7XiF9q.js → GrNavbar-DW3MiIIf.js} +6 -6
- package/dist/components/GrNavbar/chunks/{GrNavbar-BH7XiF9q.js.map → GrNavbar-DW3MiIIf.js.map} +1 -1
- package/dist/components/GrNavbar/index.js +2 -2
- package/dist/components/GrNumberInput/chunks/{GrNumberInput-YIWhV85S.js → GrNumberInput-CldPIWQx.js} +51 -61
- package/dist/components/GrNumberInput/chunks/GrNumberInput-CldPIWQx.js.map +1 -0
- package/dist/components/GrNumberInput/index.js +2 -2
- package/dist/components/GrPagination/chunks/GrPagination-Bu9wv6it.js +165 -0
- package/dist/components/GrPagination/chunks/GrPagination-Bu9wv6it.js.map +1 -0
- package/dist/components/GrPagination/index.js +2 -2
- package/dist/components/GrProgressBar/chunks/{GrProgressBar-C2HdYjp4.js → GrProgressBar-CC3z-Zqp.js} +3 -3
- package/dist/components/GrProgressBar/chunks/{GrProgressBar-C2HdYjp4.js.map → GrProgressBar-CC3z-Zqp.js.map} +1 -1
- package/dist/components/GrProgressBar/index.js +2 -2
- package/dist/components/GrPromptDialog/chunks/{GrPromptDialog-BV4EW3XO.js → GrPromptDialog-TmWXbpEP.js} +31 -23
- package/dist/components/GrPromptDialog/chunks/GrPromptDialog-TmWXbpEP.js.map +1 -0
- package/dist/components/GrPromptDialog/index.js +2 -2
- package/dist/components/GrRadio/chunks/{GrRadio-IFU9Hiu2.js → GrRadio-CPTixXaY.js} +6 -6
- package/dist/components/GrRadio/chunks/{GrRadio-IFU9Hiu2.js.map → GrRadio-CPTixXaY.js.map} +1 -1
- package/dist/components/GrRadio/index.js +2 -2
- package/dist/components/GrRadioGroup/chunks/{GrRadioGroup-C8IcJuuF.js → GrRadioGroup-vKZCbkCp.js} +3 -3
- package/dist/components/GrRadioGroup/chunks/{GrRadioGroup-C8IcJuuF.js.map → GrRadioGroup-vKZCbkCp.js.map} +1 -1
- package/dist/components/GrRadioGroup/index.js +2 -2
- package/dist/components/GrResponseErrorBanner/chunks/{GrResponseErrorBanner-BMvXREcv.js → GrResponseErrorBanner-BWJNe2gr.js} +21 -18
- package/dist/components/GrResponseErrorBanner/chunks/GrResponseErrorBanner-BWJNe2gr.js.map +1 -0
- package/dist/components/GrResponseErrorBanner/chunks/{GrResponseErrorBanner-CzdTh4gd.js → GrResponseErrorBanner-Cdu9ekK9.js} +5 -5
- package/dist/components/GrResponseErrorBanner/chunks/{GrResponseErrorBanner-CzdTh4gd.js.map → GrResponseErrorBanner-Cdu9ekK9.js.map} +1 -1
- package/dist/components/GrResponseErrorBanner/index.js +2 -2
- package/dist/components/GrSegmented/chunks/{GrSegmented-BRmwBsEG.js → GrSegmented-C1y0UXpQ.js} +5 -5
- package/dist/components/GrSegmented/chunks/{GrSegmented-BRmwBsEG.js.map → GrSegmented-C1y0UXpQ.js.map} +1 -1
- package/dist/components/GrSegmented/index.js +2 -2
- package/dist/components/GrSelect/chunks/{GrSelect-CnHdbPlf.js → GrSelect-RShK21lK.js} +106 -112
- package/dist/components/GrSelect/chunks/GrSelect-RShK21lK.js.map +1 -0
- package/dist/components/GrSelect/index.js +2 -2
- package/dist/components/GrSidebar/chunks/GrSidebar-DkWozzwA.js +238 -0
- package/dist/components/GrSidebar/chunks/GrSidebar-DkWozzwA.js.map +1 -0
- package/dist/components/GrSidebar/index.js +3 -3
- package/dist/components/GrSkeleton/chunks/{GrSkeleton-URyMkBqI.js → GrSkeleton-DsN-_CDZ.js} +1 -1
- package/dist/components/GrSkeleton/chunks/{GrSkeleton-URyMkBqI.js.map → GrSkeleton-DsN-_CDZ.js.map} +1 -1
- package/dist/components/GrSkeleton/index.js +2 -2
- package/dist/components/GrSwitch/chunks/{GrSwitch-29h0QhMO.js → GrSwitch-DAioyccZ.js} +10 -10
- package/dist/components/GrSwitch/chunks/{GrSwitch-29h0QhMO.js.map → GrSwitch-DAioyccZ.js.map} +1 -1
- package/dist/components/GrSwitch/index.js +2 -2
- package/dist/components/GrTable/chunks/{GrTable-dTWUxzRm.js → GrTable-Db3hRnKA.js} +3 -3
- package/dist/components/GrTable/chunks/{GrTable-dTWUxzRm.js.map → GrTable-Db3hRnKA.js.map} +1 -1
- package/dist/components/GrTable/index.js +2 -2
- package/dist/components/GrTabs/chunks/{GrTabs-D3ntDdtg.js → GrTabs-Z-FDJUr_.js} +3 -3
- package/dist/components/GrTabs/chunks/{GrTabs-D3ntDdtg.js.map → GrTabs-Z-FDJUr_.js.map} +1 -1
- package/dist/components/GrTabs/index.js +2 -2
- package/dist/components/GrTextarea/chunks/{GrTextarea-Cv6r2GuC.js → GrTextarea-D56YxhKq.js} +3 -3
- package/dist/components/GrTextarea/chunks/{GrTextarea-Cv6r2GuC.js.map → GrTextarea-D56YxhKq.js.map} +1 -1
- package/dist/components/GrTextarea/index.js +2 -2
- package/dist/components/GrToaster/chunks/GrToaster-eI8YvnIo.js +189 -0
- package/dist/components/GrToaster/chunks/GrToaster-eI8YvnIo.js.map +1 -0
- package/dist/components/GrToaster/index.js +2 -2
- package/dist/components/GrTooltip/chunks/GrTooltip-BeyZ8ssR.js +109 -0
- package/dist/components/GrTooltip/chunks/GrTooltip-BeyZ8ssR.js.map +1 -0
- package/dist/components/GrTooltip/index.js +2 -2
- package/dist/components/GrTree/chunks/{GrTree-B2SMU5Py.js → GrTree-D3ODe2dB.js} +40 -35
- package/dist/components/GrTree/chunks/GrTree-D3ODe2dB.js.map +1 -0
- package/dist/components/GrTree/index.js +2 -2
- package/dist/components/GrTreeSelect/chunks/{GrTreeSelect-C1abr5uH.js → GrTreeSelect-B2xBKs5Q.js} +21 -49
- package/dist/components/GrTreeSelect/chunks/GrTreeSelect-B2xBKs5Q.js.map +1 -0
- package/dist/components/GrTreeSelect/index.js +2 -2
- package/dist/composables/useTheme.js +48 -8
- package/dist/composables/useTheme.js.map +1 -1
- package/dist/composables/useToast.js +88 -26
- package/dist/composables/useToast.js.map +1 -1
- package/dist/directives/autofocus.js.map +1 -1
- package/dist/directives/autosize.js.map +1 -1
- package/dist/directives/clickOutside.js.map +1 -1
- package/dist/directives/dropzone.js +6 -5
- package/dist/directives/dropzone.js.map +1 -1
- package/dist/directives/hotkey.js +24 -7
- package/dist/directives/hotkey.js.map +1 -1
- package/dist/directives/loading.js +2 -2
- package/dist/directives/loading.js.map +1 -1
- package/dist/fileValidation/index.js +1 -1
- package/dist/granular-provider-node.js +7 -7
- package/dist/granular-provider-node.js.map +1 -1
- package/dist/granular-provider.js +1 -1
- package/dist/granular-provider.js.map +1 -1
- package/dist/i18n/all.js +1 -1
- package/dist/i18n/all.js.map +1 -1
- package/dist/i18n/index.js +2 -2
- package/dist/index.js +109 -534
- package/dist/index.js.map +1 -1
- package/dist/styles/base.css +32 -0
- package/dist/styles/index.css +15 -0
- package/dist/styles/preflight.css +29 -0
- package/dist/styles/themes/dark.css +107 -0
- package/dist/styles/themes/light.css +98 -0
- package/dist/styles/tokens.css +135 -0
- package/dist/types/src/components/GrButton/GrButton.vue.d.ts +25 -2
- package/dist/types/src/components/GrCheckbox/GrCheckbox.vue.d.ts +7 -2
- package/dist/types/src/components/GrConfirmDialog/GrConfirmDialog.vue.d.ts +8 -8
- package/dist/types/src/components/GrDataTable/GrDataTable.vue.d.ts +1 -1
- package/dist/types/src/components/GrDialog/GrDialog.vue.d.ts +2 -2
- package/dist/types/src/components/GrDialog/GrDialogHeader.vue.d.ts +2 -2
- package/dist/types/src/components/GrDrawer/GrDrawer.vue.d.ts +2 -2
- package/dist/types/src/components/GrDropdown/grDropdownStyles.d.ts +3 -2
- package/dist/types/src/components/GrDropdownMenu/GrDropdownMenu.vue.d.ts +2 -2
- package/dist/types/src/components/GrDropdownMenu/GrDropdownMenuGroup.vue.d.ts +1 -1
- package/dist/types/src/components/GrDropdownMenu/GrDropdownMenuList.vue.d.ts +2 -2
- package/dist/types/src/components/GrFileUpload/GrFileUpload.vue.d.ts +5 -5
- package/dist/types/src/components/GrFormFile/GrFormFile.vue.d.ts +11 -11
- package/dist/types/src/components/GrImageViewer/GrImageViewer.vue.d.ts +18 -18
- package/dist/types/src/components/GrInput/GrInput.vue.d.ts +14 -0
- package/dist/types/src/components/GrInput/grInputStyles.d.ts +3 -3
- package/dist/types/src/components/GrInputTag/GrInputTag.vue.d.ts +2 -2
- package/dist/types/src/components/GrLink/GrLink.vue.d.ts +11 -5
- package/dist/types/src/components/GrLink/grLinkStyles.d.ts +31 -3
- package/dist/types/src/components/GrLink/index.d.ts +1 -1
- package/dist/types/src/components/GrLoading/GrLoading.vue.d.ts +1 -1
- package/dist/types/src/components/GrModal/grModalStyles.d.ts +2 -2
- package/dist/types/src/components/GrNumberInput/GrNumberInput.vue.d.ts +17 -4
- package/dist/types/src/components/GrPagination/GrPagination.vue.d.ts +13 -1
- package/dist/types/src/components/GrPromptDialog/GrPromptDialog.vue.d.ts +12 -12
- package/dist/types/src/components/GrSegmented/GrSegmented.vue.d.ts +2 -2
- package/dist/types/src/components/GrSegmented/grSegmentedStyles.d.ts +5 -5
- package/dist/types/src/components/GrSelect/GrSelect.vue.d.ts +7 -7
- package/dist/types/src/components/GrSelect/grSelectStyles.d.ts +2 -1
- package/dist/types/src/components/GrSidebar/GrSidebar.vue.d.ts +33 -10
- package/dist/types/src/components/GrSidebar/GrSidebarItem.vue.d.ts +64 -0
- package/dist/types/src/components/GrSidebar/index.d.ts +1 -0
- package/dist/types/src/components/GrSidebar/sidebarContext.d.ts +9 -0
- package/dist/types/src/components/GrSwitch/GrSwitch.vue.d.ts +1 -1
- package/dist/types/src/components/GrSwitch/grSwitchStyles.d.ts +2 -2
- package/dist/types/src/components/GrToaster/GrToaster.vue.d.ts +9 -4
- package/dist/types/src/components/GrTree/GrTree.vue.d.ts +1 -1
- package/dist/types/src/components/GrTreeSelect/GrTreeSelect.vue.d.ts +2 -2
- package/dist/types/src/components/GrTreeSelect/grTreeSelectStyles.d.ts +1 -1
- package/dist/types/src/components/GrTreeSelect/grTreeSelectTypes.d.ts +1 -1
- package/dist/types/src/composables/internal/useAddonMeasurement.d.ts +18 -0
- package/dist/types/src/composables/internal/useEscapeToClose.d.ts +11 -0
- package/dist/types/src/composables/internal/useFloating.d.ts +53 -0
- package/dist/types/src/composables/useTheme.d.ts +5 -2
- package/dist/types/src/composables/useToast.d.ts +33 -1
- package/dist/types/src/directives/hotkey.d.ts +14 -0
- package/dist/types/src/granular-provider/shared.d.ts +1 -3
- package/dist/types/src/i18n/messages/en.d.ts +132 -0
- package/dist/types/src/i18n/messages/es.d.ts +132 -0
- package/dist/types/src/i18n/messages/ru.d.ts +132 -0
- package/dist/types/src/index.d.ts +2 -2
- package/dist/vue/index.js.map +1 -1
- package/dist/web-types.json +4673 -0
- package/package.json +33 -19
- package/dist/chunks/arrow-up-DZdIrpaF.js.map +0 -1
- package/dist/chunks/config-B2YTEe_h.js.map +0 -1
- package/dist/chunks/config-BY81UKv0.js.map +0 -1
- package/dist/chunks/config-Br_qI3Za.js.map +0 -1
- package/dist/chunks/config-C6zT56Jc2.js.map +0 -1
- package/dist/chunks/config-CpMYmvVT.js +0 -59
- package/dist/chunks/config-CpMYmvVT.js.map +0 -1
- package/dist/chunks/config-_3De4HFf.js.map +0 -1
- package/dist/chunks/en-foQA8imU.js +0 -65
- package/dist/chunks/en-foQA8imU.js.map +0 -1
- package/dist/chunks/es-DZFSojYL.js +0 -65
- package/dist/chunks/es-DZFSojYL.js.map +0 -1
- package/dist/chunks/grBadgeStyles-Cq0hH2Ls.js.map +0 -1
- package/dist/chunks/grButtonStyles-DKuXUemw.js +0 -191
- package/dist/chunks/grButtonStyles-DKuXUemw.js.map +0 -1
- package/dist/chunks/grDropdownStyles-B41mVR1H.js +0 -32
- package/dist/chunks/grDropdownStyles-B41mVR1H.js.map +0 -1
- package/dist/chunks/grModalStyles-DS1Vl6EW.js.map +0 -1
- package/dist/chunks/grSelectStyles-pUt19VGy.js.map +0 -1
- package/dist/chunks/grStyle-CUaTmpyW.js.map +0 -1
- package/dist/chunks/granularityI18n-LcJ88Vce.js.map +0 -1
- package/dist/chunks/info-C0bHmdZq.js.map +0 -1
- package/dist/chunks/loader-circle-BUntgosj.js.map +0 -1
- package/dist/chunks/ru-LhkPpPIl.js +0 -65
- package/dist/chunks/ru-LhkPpPIl.js.map +0 -1
- package/dist/chunks/safelist-_UVzJrgE2.js.map +0 -1
- package/dist/chunks/shared-BiqXd5MW.js +0 -169
- package/dist/chunks/shared-BiqXd5MW.js.map +0 -1
- package/dist/chunks/x-Pa6C2hwi.js.map +0 -1
- package/dist/chunks/x-circle-DQSlBLmX.js.map +0 -1
- package/dist/components/GrAlert/chunks/GrAlert-HyCjYJeL.js.map +0 -1
- package/dist/components/GrButton/chunks/GrButton-CPDKonoB.js +0 -83
- package/dist/components/GrButton/chunks/GrButton-CPDKonoB.js.map +0 -1
- package/dist/components/GrButtonGroup/chunks/GrButtonGroup-CPOH6V-P.js.map +0 -1
- package/dist/components/GrCard/chunks/GrCard-6yk1RRAQ.js.map +0 -1
- package/dist/components/GrCheckbox/chunks/GrCheckbox-Bt3d7ckE.js.map +0 -1
- package/dist/components/GrConfirmDialog/chunks/GrConfirmDialog-Br6WJkLE.js.map +0 -1
- package/dist/components/GrDialog/chunks/GrDialog-C7XLxp8e.js.map +0 -1
- package/dist/components/GrDrawer/chunks/GrDrawer-BW3wtI7h.js.map +0 -1
- package/dist/components/GrDropdown/chunks/GrDropdown-DOvHKnih.js +0 -151
- package/dist/components/GrDropdown/chunks/GrDropdown-DOvHKnih.js.map +0 -1
- package/dist/components/GrFileUpload/chunks/GrFileUpload-BEKNB1RM.js.map +0 -1
- package/dist/components/GrFormFile/chunks/GrFormFile-CIleXnfr.js.map +0 -1
- package/dist/components/GrImageViewer/chunks/GrImageViewer-CsvXQHM9.js.map +0 -1
- package/dist/components/GrInput/chunks/GrInput-gwFQ1sk4.js.map +0 -1
- package/dist/components/GrInputTag/chunks/GrInputTag-Dcj3F6rQ.js.map +0 -1
- package/dist/components/GrLink/chunks/GrLink-BMwn2iJ9.js.map +0 -1
- package/dist/components/GrNumberInput/chunks/GrNumberInput-YIWhV85S.js.map +0 -1
- package/dist/components/GrPagination/chunks/GrPagination-BNDEqM8_.js +0 -114
- package/dist/components/GrPagination/chunks/GrPagination-BNDEqM8_.js.map +0 -1
- package/dist/components/GrPromptDialog/chunks/GrPromptDialog-BV4EW3XO.js.map +0 -1
- package/dist/components/GrResponseErrorBanner/chunks/GrResponseErrorBanner-BMvXREcv.js.map +0 -1
- package/dist/components/GrSelect/chunks/GrSelect-CnHdbPlf.js.map +0 -1
- package/dist/components/GrSidebar/chunks/GrSidebar-BpBtAGBs.js +0 -44
- package/dist/components/GrSidebar/chunks/GrSidebar-BpBtAGBs.js.map +0 -1
- package/dist/components/GrToaster/chunks/GrToaster-DluJmR5D.js +0 -171
- package/dist/components/GrToaster/chunks/GrToaster-DluJmR5D.js.map +0 -1
- package/dist/components/GrTooltip/chunks/GrTooltip-B7I1AVIC.js +0 -55
- package/dist/components/GrTooltip/chunks/GrTooltip-B7I1AVIC.js.map +0 -1
- package/dist/components/GrTree/chunks/GrTree-B2SMU5Py.js.map +0 -1
- package/dist/components/GrTreeSelect/chunks/GrTreeSelect-C1abr5uH.js.map +0 -1
- /package/dist/chunks/{_plugin-vue_export-helper-DQR7Sy7Q.js → _plugin-vue_export-helper-BOaGB7Aw.js} +0 -0
- /package/dist/chunks/{adapter-BqqjEZGU.js → adapter-CAOxmn2G.js} +0 -0
- /package/dist/chunks/{arrow-up-DZdIrpaF.js → arrow-up-C_G4jg8M.js} +0 -0
- /package/dist/chunks/{classTokens-BPeBXNzu.js → classTokens-BzazaERD.js} +0 -0
- /package/dist/chunks/{config-DaHI5bD_2.js → config-8Pcutu1j2.js} +0 -0
- /package/dist/chunks/{config-DoBk_CzG.js → config-B0qIpo8m.js} +0 -0
- /package/dist/chunks/{config-DbghHyY_.js → config-BEegFP74.js} +0 -0
- /package/dist/chunks/{config-Dzd6BzIN2.js → config-BLHqZhy-2.js} +0 -0
- /package/dist/chunks/{config-BV4vBzdm.js → config-BNu8lFQB.js} +0 -0
- /package/dist/chunks/{config-B1kFmhpM.js → config-BUHuGBik.js} +0 -0
- /package/dist/chunks/{config-DF_RlCIO.js → config-BWGGp7uV.js} +0 -0
- /package/dist/chunks/{config-BduXEXjt.js → config-BXtAmU3s.js} +0 -0
- /package/dist/chunks/{config-O1_FTqD3.js → config-Bah4oHwL.js} +0 -0
- /package/dist/chunks/{config-DSBlHQVa.js → config-C86UzUYf.js} +0 -0
- /package/dist/chunks/{config-BgBWt9-A.js → config-C9AcVDkv.js} +0 -0
- /package/dist/chunks/{config-BeQuykDk2.js → config-CGHLoBlH2.js} +0 -0
- /package/dist/chunks/{config-ChQxl75m.js → config-CThzliFi.js} +0 -0
- /package/dist/chunks/{config-DmjwIqx1.js → config-Cb2PAlSD.js} +0 -0
- /package/dist/chunks/{config-BbKroFtR.js → config-D7GZO-Dx.js} +0 -0
- /package/dist/chunks/{config-CUwF4E4R.js → config-DBmdgoVf.js} +0 -0
- /package/dist/chunks/{config-C9MblwGq.js → config-DICOd-2X.js} +0 -0
- /package/dist/chunks/{config-D6Oe3blW2.js → config-DpqOnJiz2.js} +0 -0
- /package/dist/chunks/{config-V3LF-b_F.js → config-Dxuwwepq.js} +0 -0
- /package/dist/chunks/{config-CvGdaXvH.js → config-HZto2PVy.js} +0 -0
- /package/dist/chunks/{config-BOdu-O_B.js → config-JOtB4mzs.js} +0 -0
- /package/dist/chunks/{config-iuMz79Mg.js → config-JpHA4Xx0.js} +0 -0
- /package/dist/chunks/{config-Dcb7xK-C.js → config-PFg39mYo.js} +0 -0
- /package/dist/chunks/{config-BU0olrvr.js → config-QaIc_gRa.js} +0 -0
- /package/dist/chunks/{config-vcDVCYXo.js → config-U4m9PSql.js} +0 -0
- /package/dist/chunks/{config-Ci9nXGUV.js → config-ZiXWIRBX.js} +0 -0
- /package/dist/chunks/{config-Bcf-8XlK2.js → config-ipvU0lzP2.js} +0 -0
- /package/dist/chunks/{config-D5ek7VSi.js → config-xR4XVmcy.js} +0 -0
- /package/dist/chunks/{dialogShared-BtXUk6Zc.js → dialogShared-CxW62PQE.js} +0 -0
- /package/dist/chunks/{grLoadingStyles-DmI-SJ3i.js → grLoadingStyles-R5sreH__.js} +0 -0
- /package/dist/chunks/{info-C0bHmdZq.js → info-Be2OccTu.js} +0 -0
- /package/dist/chunks/{loader-circle-BUntgosj.js → loader-circle-CfVLz7lb.js} +0 -0
- /package/dist/chunks/{x-Pa6C2hwi.js → x-2KXnqxiD.js} +0 -0
- /package/dist/chunks/{x-circle-DQSlBLmX.js → x-circle-BCBURwyX.js} +0 -0
- /package/dist/components/GrBottomNav/chunks/{GrBottomNav-XPHwd7UQ.js → GrBottomNav-usuMgG8_.js} +0 -0
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"GrConfirmDialog-Br6WJkLE.js","names":[],"sources":["../../../../src/components/GrConfirmDialog/GrConfirmDialog.vue","../../../../src/components/GrConfirmDialog/GrConfirmDialog.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * GrConfirmDialog — DS-примитив диалога подтверждения поверх `GrDialog`.\n *\n * Синхронизирован с `GrDialog`/`GrPromptDialog` по набору проп-проксирования:\n * `size`, `closeOnBackdrop`, `closeOnEsc`, `showHeader`, `showCloseButton`,\n * `headerConfig`, `footerConfig`, `bodyConfig`, `closeLabel`.\n *\n * Клик по «Confirm»/«Cancel» эмитит одноимённое событие и закрывает диалог\n * через `update:modelValue`.\n */\nimport { computed } from 'vue'\n\nimport GrButton from '../GrButton/GrButton.vue'\nimport GrDialog from '../GrDialog/GrDialog.vue'\nimport GrResponseErrorBanner from '../GrResponseErrorBanner/GrResponseErrorBanner.vue'\nimport type { GrButtonSize, GrButtonTone, GrButtonVariant } from '../GrButton'\nimport type { GrDialogSectionConfig, GrDialogSize } from '../GrDialog'\nimport type { ResponseErrorInfo } from '../GrResponseErrorBanner'\n\nexport interface GrConfirmDialogProps {\n modelValue: boolean\n title?: string\n description?: string\n closeOnBackdrop?: boolean\n closeOnEsc?: boolean\n showHeader?: boolean\n showCloseButton?: boolean\n size?: GrDialogSize\n headerConfig?: GrDialogSectionConfig\n footerConfig?: GrDialogSectionConfig\n bodyConfig?: GrDialogSectionConfig\n /** A11y-лейбл кнопки закрытия (i18n). */\n closeLabel?: string\n buttonSize?: GrButtonSize\n confirmText?: string\n cancelText?: string\n confirmVariant?: GrButtonVariant\n confirmTone?: GrButtonTone\n /**\n * Структура ошибки ответа сервера для показа в теле диалога\n * (через `GrResponseErrorBanner`). Используется императивным\n * `useDialogService` для async-`onConfirm`. `null` — блок скрыт.\n */\n error?: ResponseErrorInfo | null\n /** Состояние загрузки кнопки Confirm (async-`onConfirm` in-flight). */\n confirmLoading?: boolean\n /** Принудительно дизейблит кнопку Confirm. */\n confirmDisabled?: boolean\n /**\n * Закрывать ли диалог автоматически по клику Confirm. По умолчанию `true`\n * (историческое поведение). `false` — отдаёт управление закрытием наружу\n * (нужно `useDialogService`, который ждёт результат async-`onConfirm`).\n */\n closeOnConfirm?: boolean\n}\n\nconst props = withDefaults(defineProps<GrConfirmDialogProps>(), {\n title: 'Confirm',\n description: undefined,\n closeOnBackdrop: true,\n closeOnEsc: true,\n showHeader: true,\n showCloseButton: true,\n size: 'md',\n headerConfig: undefined,\n footerConfig: undefined,\n bodyConfig: undefined,\n closeLabel: 'Close',\n buttonSize: undefined,\n confirmText: 'Confirm',\n cancelText: 'Cancel',\n confirmVariant: 'primary',\n confirmTone: 'primary',\n error: null,\n confirmLoading: false,\n confirmDisabled: false,\n closeOnConfirm: true,\n})\n\nconst emit = defineEmits<{\n (e: 'update:modelValue', value: boolean): void\n (e: 'confirm'): void\n (e: 'cancel'): void\n}>()\n\nconst open = computed({\n get: () => props.modelValue,\n set: (value: boolean) => emit('update:modelValue', value),\n})\n\nfunction onCancel(): void {\n emit('cancel')\n emit('update:modelValue', false)\n}\n\nfunction onConfirm(): void {\n emit('confirm')\n if (props.closeOnConfirm)\n emit('update:modelValue', false)\n}\n</script>\n\n<template>\n <GrDialog\n v-model=\"open\"\n :title=\"title\"\n :size=\"size\"\n :close-on-backdrop=\"closeOnBackdrop\"\n :close-on-esc=\"closeOnEsc\"\n :show-header=\"showHeader\"\n :show-close-button=\"showCloseButton\"\n :header-config=\"headerConfig\"\n :footer-config=\"footerConfig\"\n :body-config=\"bodyConfig\"\n :close-label=\"closeLabel\"\n >\n <div class=\"grid gap-4\">\n <slot>\n <div v-if=\"description\" class=\"text-[14px] text-[var(--muted-fg)]\">\n {{ description }}\n </div>\n </slot>\n\n <slot name=\"error\" :error=\"error\">\n <GrResponseErrorBanner v-if=\"error\" :error=\"error\" :can-dismiss=\"false\" />\n </slot>\n </div>\n\n <template #footer>\n <slot name=\"footer\">\n <div class=\"flex items-center justify-end gap-3\">\n <GrButton data-testid=\"ds-confirm-cancel\" variant=\"outline\" :size=\"buttonSize\" @click=\"onCancel\">\n {{ cancelText }}\n </GrButton>\n <GrButton\n data-testid=\"ds-confirm-confirm\"\n :variant=\"confirmVariant\"\n :tone=\"confirmTone\"\n :size=\"buttonSize\"\n :loading=\"confirmLoading\"\n :disabled=\"confirmDisabled\"\n @click=\"onConfirm\"\n >\n {{ confirmText }}\n </GrButton>\n </div>\n </slot>\n </template>\n </GrDialog>\n</template>\n","<script setup lang=\"ts\">\n/**\n * GrConfirmDialog — DS-примитив диалога подтверждения поверх `GrDialog`.\n *\n * Синхронизирован с `GrDialog`/`GrPromptDialog` по набору проп-проксирования:\n * `size`, `closeOnBackdrop`, `closeOnEsc`, `showHeader`, `showCloseButton`,\n * `headerConfig`, `footerConfig`, `bodyConfig`, `closeLabel`.\n *\n * Клик по «Confirm»/«Cancel» эмитит одноимённое событие и закрывает диалог\n * через `update:modelValue`.\n */\nimport { computed } from 'vue'\n\nimport GrButton from '../GrButton/GrButton.vue'\nimport GrDialog from '../GrDialog/GrDialog.vue'\nimport GrResponseErrorBanner from '../GrResponseErrorBanner/GrResponseErrorBanner.vue'\nimport type { GrButtonSize, GrButtonTone, GrButtonVariant } from '../GrButton'\nimport type { GrDialogSectionConfig, GrDialogSize } from '../GrDialog'\nimport type { ResponseErrorInfo } from '../GrResponseErrorBanner'\n\nexport interface GrConfirmDialogProps {\n modelValue: boolean\n title?: string\n description?: string\n closeOnBackdrop?: boolean\n closeOnEsc?: boolean\n showHeader?: boolean\n showCloseButton?: boolean\n size?: GrDialogSize\n headerConfig?: GrDialogSectionConfig\n footerConfig?: GrDialogSectionConfig\n bodyConfig?: GrDialogSectionConfig\n /** A11y-лейбл кнопки закрытия (i18n). */\n closeLabel?: string\n buttonSize?: GrButtonSize\n confirmText?: string\n cancelText?: string\n confirmVariant?: GrButtonVariant\n confirmTone?: GrButtonTone\n /**\n * Структура ошибки ответа сервера для показа в теле диалога\n * (через `GrResponseErrorBanner`). Используется императивным\n * `useDialogService` для async-`onConfirm`. `null` — блок скрыт.\n */\n error?: ResponseErrorInfo | null\n /** Состояние загрузки кнопки Confirm (async-`onConfirm` in-flight). */\n confirmLoading?: boolean\n /** Принудительно дизейблит кнопку Confirm. */\n confirmDisabled?: boolean\n /**\n * Закрывать ли диалог автоматически по клику Confirm. По умолчанию `true`\n * (историческое поведение). `false` — отдаёт управление закрытием наружу\n * (нужно `useDialogService`, который ждёт результат async-`onConfirm`).\n */\n closeOnConfirm?: boolean\n}\n\nconst props = withDefaults(defineProps<GrConfirmDialogProps>(), {\n title: 'Confirm',\n description: undefined,\n closeOnBackdrop: true,\n closeOnEsc: true,\n showHeader: true,\n showCloseButton: true,\n size: 'md',\n headerConfig: undefined,\n footerConfig: undefined,\n bodyConfig: undefined,\n closeLabel: 'Close',\n buttonSize: undefined,\n confirmText: 'Confirm',\n cancelText: 'Cancel',\n confirmVariant: 'primary',\n confirmTone: 'primary',\n error: null,\n confirmLoading: false,\n confirmDisabled: false,\n closeOnConfirm: true,\n})\n\nconst emit = defineEmits<{\n (e: 'update:modelValue', value: boolean): void\n (e: 'confirm'): void\n (e: 'cancel'): void\n}>()\n\nconst open = computed({\n get: () => props.modelValue,\n set: (value: boolean) => emit('update:modelValue', value),\n})\n\nfunction onCancel(): void {\n emit('cancel')\n emit('update:modelValue', false)\n}\n\nfunction onConfirm(): void {\n emit('confirm')\n if (props.closeOnConfirm)\n emit('update:modelValue', false)\n}\n</script>\n\n<template>\n <GrDialog\n v-model=\"open\"\n :title=\"title\"\n :size=\"size\"\n :close-on-backdrop=\"closeOnBackdrop\"\n :close-on-esc=\"closeOnEsc\"\n :show-header=\"showHeader\"\n :show-close-button=\"showCloseButton\"\n :header-config=\"headerConfig\"\n :footer-config=\"footerConfig\"\n :body-config=\"bodyConfig\"\n :close-label=\"closeLabel\"\n >\n <div class=\"grid gap-4\">\n <slot>\n <div v-if=\"description\" class=\"text-[14px] text-[var(--muted-fg)]\">\n {{ description }}\n </div>\n </slot>\n\n <slot name=\"error\" :error=\"error\">\n <GrResponseErrorBanner v-if=\"error\" :error=\"error\" :can-dismiss=\"false\" />\n </slot>\n </div>\n\n <template #footer>\n <slot name=\"footer\">\n <div class=\"flex items-center justify-end gap-3\">\n <GrButton data-testid=\"ds-confirm-cancel\" variant=\"outline\" :size=\"buttonSize\" @click=\"onCancel\">\n {{ cancelText }}\n </GrButton>\n <GrButton\n data-testid=\"ds-confirm-confirm\"\n :variant=\"confirmVariant\"\n :tone=\"confirmTone\"\n :size=\"buttonSize\"\n :loading=\"confirmLoading\"\n :disabled=\"confirmDisabled\"\n @click=\"onConfirm\"\n >\n {{ confirmText }}\n </GrButton>\n </div>\n </slot>\n </template>\n </GrDialog>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAyDA,MAAM,QAAQ;EAuBd,MAAM,OAAO;EAMb,MAAM,OAAO,SAAS;GACpB,WAAW,MAAM;GACjB,MAAM,UAAmB,KAAK,qBAAqB,MAAM;GAC1D,CAAA;EAED,SAAS,WAAiB;AACxB,QAAK,SAAQ;AACb,QAAK,qBAAqB,MAAK;;EAGjC,SAAS,YAAkB;AACzB,QAAK,UAAS;AACd,OAAI,MAAM,eACR,MAAK,qBAAqB,MAAK;;;uBAKjC,YA6CW,kBAAA;gBA5CA,KAAA;sEAAI,QAAA;IACZ,OAAO,QAAA;IACP,MAAM,QAAA;IACN,qBAAmB,QAAA;IACnB,gBAAc,QAAA;IACd,eAAa,QAAA;IACb,qBAAmB,QAAA;IACnB,iBAAe,QAAA;IACf,iBAAe,QAAA;IACf,eAAa,QAAA;IACb,eAAa,QAAA;;IAcH,QAAM,cAkBR,CAjBP,WAiBO,KAAA,QAAA,UAAA,EAAA,QAAA,CAhBL,mBAeM,OAfN,YAeM,CAdJ,YAEW,kBAAA;KAFD,eAAY;KAAoB,SAAQ;KAAW,MAAM,QAAA;KAAa,SAAO;;4BACrE,CAAA,gBAAA,gBAAb,QAAA,WAAU,EAAA,EAAA,CAAA,CAAA;;qBAEf,YAUW,kBAAA;KATT,eAAY;KACX,SAAS,QAAA;KACT,MAAM,QAAA;KACN,MAAM,QAAA;KACN,SAAS,QAAA;KACT,UAAU,QAAA;KACV,SAAO;;4BAES,CAAA,gBAAA,gBAAd,QAAA,YAAW,EAAA,EAAA,CAAA,CAAA;;;;;;;;;2BAjBhB,CAVN,mBAUM,OAVN,YAUM,CATJ,WAIO,KAAA,QAAA,WAAA,EAAA,QAAA,CAHM,QAAA,eAAA,WAAA,EAAX,mBAEM,OAFN,YAEM,gBADD,QAAA,YAAW,EAAA,EAAA,IAAA,mBAAA,IAAA,KAAA,CAAA,CAAA,EAIlB,WAEO,KAAA,QAAA,SAAA,EAFa,OAAO,QAAA,OAAK,QAEzB,CADwB,QAAA,SAAA,WAAA,EAA7B,YAA0E,+BAAA;;KAArC,OAAO,QAAA;KAAQ,eAAa"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"GrDialog-C7XLxp8e.js","names":["$emit","$emit"],"sources":["../../../../src/components/GrDialog/GrDialogFooter.vue","../../../../src/components/GrDialog/GrDialogFooter.vue","../../../../src/components/GrDialog/GrDialogCloseButton.vue","../../../../src/components/GrDialog/GrDialogCloseButton.vue","../../../../src/components/GrDialog/GrDialogHeader.vue","../../../../src/components/GrDialog/GrDialogHeader.vue","../../../../src/components/GrDialog/GrDialog.vue","../../../../src/components/GrDialog/GrDialog.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\n\nimport {\n DEFAULT_GR_DIALOG_FOOTER_CONFIG,\n resolveGrDialogSectionConfig,\n type GrDialogSectionConfig,\n} from './dialogShared'\n\nexport interface GrDialogFooterProps {\n config?: GrDialogSectionConfig\n}\n\nconst props = withDefaults(defineProps<GrDialogFooterProps>(), {\n config: undefined,\n})\n\nconst resolvedConfig = computed(() => resolveGrDialogSectionConfig(props.config, DEFAULT_GR_DIALOG_FOOTER_CONFIG))\n\nconst rootClass = computed(() => [\n resolvedConfig.value.paddingX,\n resolvedConfig.value.paddingY,\n resolvedConfig.value.bordered ? 'border-t border-[var(--brd)]' : '',\n])\n</script>\n\n<template>\n <div data-ds-dialog-footer :class=\"rootClass\">\n <slot />\n </div>\n</template>","<script setup lang=\"ts\">\nimport { computed } from 'vue'\n\nimport {\n DEFAULT_GR_DIALOG_FOOTER_CONFIG,\n resolveGrDialogSectionConfig,\n type GrDialogSectionConfig,\n} from './dialogShared'\n\nexport interface GrDialogFooterProps {\n config?: GrDialogSectionConfig\n}\n\nconst props = withDefaults(defineProps<GrDialogFooterProps>(), {\n config: undefined,\n})\n\nconst resolvedConfig = computed(() => resolveGrDialogSectionConfig(props.config, DEFAULT_GR_DIALOG_FOOTER_CONFIG))\n\nconst rootClass = computed(() => [\n resolvedConfig.value.paddingX,\n resolvedConfig.value.paddingY,\n resolvedConfig.value.bordered ? 'border-t border-[var(--brd)]' : '',\n])\n</script>\n\n<template>\n <div data-ds-dialog-footer :class=\"rootClass\">\n <slot />\n </div>\n</template>","<script setup lang=\"ts\">\nimport { computed, useAttrs } from 'vue'\n\nimport GrButton from '../GrButton/GrButton.vue'\nimport IconClose from '~icons/lucide/x'\n\ndefineOptions({\n inheritAttrs: false,\n})\n\n// A11y-лейбл: берём из атрибутов (родитель прокидывает `:aria-label=\"closeLabel\"`)\n// или используем дефолт. Не хардкодим английское \"Close\" — DS должен быть i18n-friendly.\nconst attrs = useAttrs()\nconst ariaLabel = computed(() => (attrs['aria-label'] as string | undefined) ?? 'Close')\n\ndefineEmits<{\n (e: 'click'): void\n}>()\n</script>\n\n<template>\n <GrButton\n v-bind=\"attrs\"\n data-ds-dialog-close\n variant=\"ghost\"\n size=\"sm\"\n square\n :aria-label=\"ariaLabel\"\n @click=\"$emit('click')\"\n >\n <IconClose class=\"h-4 w-4\" aria-hidden=\"true\" />\n </GrButton>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, useAttrs } from 'vue'\n\nimport GrButton from '../GrButton/GrButton.vue'\nimport IconClose from '~icons/lucide/x'\n\ndefineOptions({\n inheritAttrs: false,\n})\n\n// A11y-лейбл: берём из атрибутов (родитель прокидывает `:aria-label=\"closeLabel\"`)\n// или используем дефолт. Не хардкодим английское \"Close\" — DS должен быть i18n-friendly.\nconst attrs = useAttrs()\nconst ariaLabel = computed(() => (attrs['aria-label'] as string | undefined) ?? 'Close')\n\ndefineEmits<{\n (e: 'click'): void\n}>()\n</script>\n\n<template>\n <GrButton\n v-bind=\"attrs\"\n data-ds-dialog-close\n variant=\"ghost\"\n size=\"sm\"\n square\n :aria-label=\"ariaLabel\"\n @click=\"$emit('click')\"\n >\n <IconClose class=\"h-4 w-4\" aria-hidden=\"true\" />\n </GrButton>\n</template>\n","<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { DialogTitle } from '@headlessui/vue'\n\nimport GrDialogCloseButton from './GrDialogCloseButton.vue'\nimport {\n DEFAULT_GR_DIALOG_HEADER_CONFIG,\n type GrDialogSectionConfig,\n resolveGrDialogSectionConfig,\n resolveGrDialogTitle,\n} from './dialogShared'\n\nexport interface GrDialogHeaderProps {\n title?: string\n showCloseButton?: boolean\n config?: GrDialogSectionConfig\n /** A11y-лейбл кнопки закрытия (i18n). */\n closeLabel?: string\n}\n\nconst props = withDefaults(defineProps<GrDialogHeaderProps>(), {\n title: undefined,\n showCloseButton: true,\n config: undefined,\n closeLabel: 'Close',\n})\n\nconst slots = defineSlots<{\n default?: (props: { title?: string }) => any\n}>()\n\ndefineEmits<{\n (e: 'close'): void\n}>()\n\nconst resolvedTitle = computed(() => resolveGrDialogTitle(props.title))\n\nconst resolvedConfig = computed(() =>\n resolveGrDialogSectionConfig(props.config, DEFAULT_GR_DIALOG_HEADER_CONFIG),\n)\n\nconst rootClass = computed(() => [\n resolvedConfig.value.paddingX,\n resolvedConfig.value.paddingY,\n resolvedConfig.value.bordered ? 'border-b border-[var(--brd)]' : '',\n 'flex items-center justify-between gap-4',\n])\n\n// Видимый `DialogTitle` рендерим только когда нет пользовательского слота:\n// если слот `#header` задан, a11y-title отдаётся через `GrModal #title`\n// на уровне `GrDialog` (см. JSDoc у `GrDialog.vue`).\nconst showVisibleTitle = computed(() => !slots.default && !!resolvedTitle.value)\n</script>\n\n<template>\n <div data-ds-dialog-header :class=\"rootClass\">\n <template v-if=\"slots.default\">\n <div class=\"flex-1 min-w-0 flex items-center\">\n <slot :title=\"resolvedTitle\" />\n </div>\n </template>\n <DialogTitle\n v-else-if=\"showVisibleTitle\"\n as=\"div\"\n class=\"flex-1 min-w-0 text-[14px] font-700\"\n >\n {{ resolvedTitle }}\n </DialogTitle>\n <div v-else class=\"flex-1 min-w-0\" />\n <GrDialogCloseButton\n v-if=\"showCloseButton\"\n :aria-label=\"closeLabel\"\n @click=\"$emit('close')\"\n />\n </div>\n</template>\n","<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { DialogTitle } from '@headlessui/vue'\n\nimport GrDialogCloseButton from './GrDialogCloseButton.vue'\nimport {\n DEFAULT_GR_DIALOG_HEADER_CONFIG,\n type GrDialogSectionConfig,\n resolveGrDialogSectionConfig,\n resolveGrDialogTitle,\n} from './dialogShared'\n\nexport interface GrDialogHeaderProps {\n title?: string\n showCloseButton?: boolean\n config?: GrDialogSectionConfig\n /** A11y-лейбл кнопки закрытия (i18n). */\n closeLabel?: string\n}\n\nconst props = withDefaults(defineProps<GrDialogHeaderProps>(), {\n title: undefined,\n showCloseButton: true,\n config: undefined,\n closeLabel: 'Close',\n})\n\nconst slots = defineSlots<{\n default?: (props: { title?: string }) => any\n}>()\n\ndefineEmits<{\n (e: 'close'): void\n}>()\n\nconst resolvedTitle = computed(() => resolveGrDialogTitle(props.title))\n\nconst resolvedConfig = computed(() =>\n resolveGrDialogSectionConfig(props.config, DEFAULT_GR_DIALOG_HEADER_CONFIG),\n)\n\nconst rootClass = computed(() => [\n resolvedConfig.value.paddingX,\n resolvedConfig.value.paddingY,\n resolvedConfig.value.bordered ? 'border-b border-[var(--brd)]' : '',\n 'flex items-center justify-between gap-4',\n])\n\n// Видимый `DialogTitle` рендерим только когда нет пользовательского слота:\n// если слот `#header` задан, a11y-title отдаётся через `GrModal #title`\n// на уровне `GrDialog` (см. JSDoc у `GrDialog.vue`).\nconst showVisibleTitle = computed(() => !slots.default && !!resolvedTitle.value)\n</script>\n\n<template>\n <div data-ds-dialog-header :class=\"rootClass\">\n <template v-if=\"slots.default\">\n <div class=\"flex-1 min-w-0 flex items-center\">\n <slot :title=\"resolvedTitle\" />\n </div>\n </template>\n <DialogTitle\n v-else-if=\"showVisibleTitle\"\n as=\"div\"\n class=\"flex-1 min-w-0 text-[14px] font-700\"\n >\n {{ resolvedTitle }}\n </DialogTitle>\n <div v-else class=\"flex-1 min-w-0\" />\n <GrDialogCloseButton\n v-if=\"showCloseButton\"\n :aria-label=\"closeLabel\"\n @click=\"$emit('close')\"\n />\n </div>\n</template>\n","<script setup lang=\"ts\">\n/**\n * GrDialog — DS-примитив диалога поверх `GrModal`.\n *\n * Архитектурно:\n * - ширина/радиус/скролл-лок/Esc/бэкдроп — ответственность `GrModal`;\n * - заголовок/подвал/кнопка закрытия/паддинги секций — ответственность `GrDialog`.\n *\n * A11y: ровно один `DialogTitle` на открытое окно.\n * - Если хедер отображается без слота `#header` — видимый `DialogTitle` рендерит\n * `GrDialogHeader`.\n * - В остальных случаях (`!showHeader`, либо `showHeader` со слотом `#header`)\n * `GrDialog` отдаёт sr-only title в слот `#title` у `GrModal`, чтобы\n * HeadlessUI корректно проставил `aria-labelledby` на панель.\n */\nimport { computed } from 'vue'\n\nimport GrModal from '../GrModal/GrModal.vue'\nimport GrDialogFooter from './GrDialogFooter.vue'\nimport GrDialogHeader from './GrDialogHeader.vue'\nimport {\n DEFAULT_GR_DIALOG_BODY_CONFIG,\n type GrDialogSectionConfig,\n type GrDialogSize,\n resolveGrDialogSectionConfig,\n resolveGrDialogTitle,\n} from './dialogShared'\n\nexport interface GrDialogProps {\n modelValue: boolean\n title?: string\n closeOnBackdrop?: boolean\n closeOnEsc?: boolean\n showHeader?: boolean\n showCloseButton?: boolean\n size?: GrDialogSize\n headerConfig?: GrDialogSectionConfig\n footerConfig?: GrDialogSectionConfig\n bodyConfig?: GrDialogSectionConfig\n /** A11y-лейбл кнопки закрытия (i18n). */\n closeLabel?: string\n}\n\nconst props = withDefaults(defineProps<GrDialogProps>(), {\n title: undefined,\n closeOnBackdrop: true,\n closeOnEsc: true,\n showHeader: true,\n showCloseButton: true,\n size: 'md',\n headerConfig: undefined,\n footerConfig: undefined,\n bodyConfig: undefined,\n closeLabel: 'Close',\n})\n\nconst emit = defineEmits<{\n (e: 'update:modelValue', value: boolean): void\n}>()\n\nconst slots = defineSlots<{\n default?: () => any\n header?: (props: { title?: string }) => any\n footer?: () => any\n}>()\n\nconst resolvedTitle = computed(() => resolveGrDialogTitle(props.title))\n\nconst bodyClass = computed(() => {\n const cfg = resolveGrDialogSectionConfig(props.bodyConfig, DEFAULT_GR_DIALOG_BODY_CONFIG)\n return [cfg.paddingX, cfg.paddingY]\n})\n\n// Нужен ли sr-only title через `GrModal #title`:\n// - `!showHeader` — вообще нет заголовка в разметке;\n// - `showHeader && $slots.header` — кастомный хедер не обязан содержать DialogTitle.\n// В обоих случаях даём HeadlessUI a11y-title, не дублируя его визуально.\nconst useModalSrOnlyTitle = computed(\n () => !!resolvedTitle.value && (!props.showHeader || !!slots.header),\n)\n\nfunction close(): void {\n emit('update:modelValue', false)\n}\n</script>\n\n<template>\n <GrModal\n :model-value=\"modelValue\"\n :size=\"size\"\n :close-on-backdrop=\"closeOnBackdrop\"\n :close-on-esc=\"closeOnEsc\"\n @update:model-value=\"emit('update:modelValue', $event)\"\n >\n <template v-if=\"useModalSrOnlyTitle\" #title>\n <span class=\"sr-only\">{{ resolvedTitle }}</span>\n </template>\n\n <div class=\"overflow-hidden rounded-[inherit]\">\n <GrDialogHeader\n v-if=\"showHeader\"\n :title=\"resolvedTitle\"\n :show-close-button=\"showCloseButton\"\n :config=\"headerConfig\"\n :close-label=\"closeLabel\"\n @close=\"close\"\n >\n <template v-if=\"slots.header\" #default=\"slotProps\">\n <slot name=\"header\" v-bind=\"slotProps\" />\n </template>\n </GrDialogHeader>\n\n <div :class=\"bodyClass\">\n <slot />\n </div>\n\n <GrDialogFooter v-if=\"slots.footer\" :config=\"footerConfig\">\n <slot name=\"footer\" />\n </GrDialogFooter>\n </div>\n </GrModal>\n</template>\n","<script setup lang=\"ts\">\n/**\n * GrDialog — DS-примитив диалога поверх `GrModal`.\n *\n * Архитектурно:\n * - ширина/радиус/скролл-лок/Esc/бэкдроп — ответственность `GrModal`;\n * - заголовок/подвал/кнопка закрытия/паддинги секций — ответственность `GrDialog`.\n *\n * A11y: ровно один `DialogTitle` на открытое окно.\n * - Если хедер отображается без слота `#header` — видимый `DialogTitle` рендерит\n * `GrDialogHeader`.\n * - В остальных случаях (`!showHeader`, либо `showHeader` со слотом `#header`)\n * `GrDialog` отдаёт sr-only title в слот `#title` у `GrModal`, чтобы\n * HeadlessUI корректно проставил `aria-labelledby` на панель.\n */\nimport { computed } from 'vue'\n\nimport GrModal from '../GrModal/GrModal.vue'\nimport GrDialogFooter from './GrDialogFooter.vue'\nimport GrDialogHeader from './GrDialogHeader.vue'\nimport {\n DEFAULT_GR_DIALOG_BODY_CONFIG,\n type GrDialogSectionConfig,\n type GrDialogSize,\n resolveGrDialogSectionConfig,\n resolveGrDialogTitle,\n} from './dialogShared'\n\nexport interface GrDialogProps {\n modelValue: boolean\n title?: string\n closeOnBackdrop?: boolean\n closeOnEsc?: boolean\n showHeader?: boolean\n showCloseButton?: boolean\n size?: GrDialogSize\n headerConfig?: GrDialogSectionConfig\n footerConfig?: GrDialogSectionConfig\n bodyConfig?: GrDialogSectionConfig\n /** A11y-лейбл кнопки закрытия (i18n). */\n closeLabel?: string\n}\n\nconst props = withDefaults(defineProps<GrDialogProps>(), {\n title: undefined,\n closeOnBackdrop: true,\n closeOnEsc: true,\n showHeader: true,\n showCloseButton: true,\n size: 'md',\n headerConfig: undefined,\n footerConfig: undefined,\n bodyConfig: undefined,\n closeLabel: 'Close',\n})\n\nconst emit = defineEmits<{\n (e: 'update:modelValue', value: boolean): void\n}>()\n\nconst slots = defineSlots<{\n default?: () => any\n header?: (props: { title?: string }) => any\n footer?: () => any\n}>()\n\nconst resolvedTitle = computed(() => resolveGrDialogTitle(props.title))\n\nconst bodyClass = computed(() => {\n const cfg = resolveGrDialogSectionConfig(props.bodyConfig, DEFAULT_GR_DIALOG_BODY_CONFIG)\n return [cfg.paddingX, cfg.paddingY]\n})\n\n// Нужен ли sr-only title через `GrModal #title`:\n// - `!showHeader` — вообще нет заголовка в разметке;\n// - `showHeader && $slots.header` — кастомный хедер не обязан содержать DialogTitle.\n// В обоих случаях даём HeadlessUI a11y-title, не дублируя его визуально.\nconst useModalSrOnlyTitle = computed(\n () => !!resolvedTitle.value && (!props.showHeader || !!slots.header),\n)\n\nfunction close(): void {\n emit('update:modelValue', false)\n}\n</script>\n\n<template>\n <GrModal\n :model-value=\"modelValue\"\n :size=\"size\"\n :close-on-backdrop=\"closeOnBackdrop\"\n :close-on-esc=\"closeOnEsc\"\n @update:model-value=\"emit('update:modelValue', $event)\"\n >\n <template v-if=\"useModalSrOnlyTitle\" #title>\n <span class=\"sr-only\">{{ resolvedTitle }}</span>\n </template>\n\n <div class=\"overflow-hidden rounded-[inherit]\">\n <GrDialogHeader\n v-if=\"showHeader\"\n :title=\"resolvedTitle\"\n :show-close-button=\"showCloseButton\"\n :config=\"headerConfig\"\n :close-label=\"closeLabel\"\n @close=\"close\"\n >\n <template v-if=\"slots.header\" #default=\"slotProps\">\n <slot name=\"header\" v-bind=\"slotProps\" />\n </template>\n </GrDialogHeader>\n\n <div :class=\"bodyClass\">\n <slot />\n </div>\n\n <GrDialogFooter v-if=\"slots.footer\" :config=\"footerConfig\">\n <slot name=\"footer\" />\n </GrDialogFooter>\n </div>\n </GrModal>\n</template>\n"],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"GrDrawer-BW3wtI7h.js","names":["$slots"],"sources":["../../../../src/components/GrDrawer/GrDrawer.vue","../../../../src/components/GrDrawer/GrDrawer.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, useId } from 'vue'\nimport { Dialog, DialogPanel, DialogTitle, TransitionChild, TransitionRoot } from '@headlessui/vue'\n\nimport GrButton from '../GrButton/GrButton.vue'\nimport GrIcon from '../GrIcon/GrIcon.vue'\nimport {\n grDrawerPanelClass,\n grDrawerPanelEnterFrom,\n type GrDrawerSide,\n type GrDrawerSize,\n} from './grDrawerStyles'\n\nimport IconClose from '~icons/lucide/x'\n\nexport interface GrDrawerProps {\n /** Контроль открытия через v-model. */\n modelValue: boolean\n /** Заголовок; если передан — покажется в хедере. Можно переопределить слотом `#title`. */\n title?: string\n /** Закрывать при клике по бэкдропу / через HeadlessUI close. */\n closeOnBackdrop?: boolean\n /** Закрывать по Esc. */\n closeOnEsc?: boolean\n /** Сторона, с которой выезжает панель. */\n side?: GrDrawerSide\n /** Размер панели. */\n size?: GrDrawerSize\n /** i18n-friendly aria-label для кнопки закрытия. */\n closeLabel?: string\n}\n\nconst props = withDefaults(defineProps<GrDrawerProps>(), {\n title: undefined,\n closeOnBackdrop: true,\n closeOnEsc: true,\n side: 'right',\n size: 'md',\n closeLabel: 'Close',\n})\n\nconst emit = defineEmits<{\n (e: 'update:modelValue', value: boolean): void\n}>()\n\nconst titleId = useId()\n\nconst panelClass = computed(() => {\n return grDrawerPanelClass({ side: props.side, size: props.size })\n})\n\nconst panelEnterFrom = computed(() => grDrawerPanelEnterFrom(props.side))\n\nfunction close(): void {\n emit('update:modelValue', false)\n}\n\nfunction onDialogClose(): void {\n if (!props.closeOnBackdrop) return\n close()\n}\n\nfunction onOverlayClick(): void {\n if (!props.closeOnBackdrop) return\n close()\n}\n\nfunction onKeydown(e: KeyboardEvent): void {\n if (e.key !== 'Escape') return\n if (!props.closeOnEsc) return\n e.stopPropagation()\n e.preventDefault()\n close()\n}\n</script>\n\n<template>\n <teleport to=\"body\">\n <TransitionRoot :show=\"modelValue\" as=\"template\">\n <Dialog\n as=\"div\"\n data-ds-drawer\n class=\"fixed inset-0 z-50\"\n :static=\"true\"\n :aria-labelledby=\"titleId\"\n @close=\"onDialogClose\"\n @keydown=\"onKeydown\"\n >\n <div class=\"fixed inset-0\">\n <TransitionChild\n as=\"template\"\n enter=\"duration-200 ease-out\"\n enter-from=\"opacity-0\"\n enter-to=\"opacity-100\"\n leave=\"duration-150 ease-in\"\n leave-from=\"opacity-100\"\n leave-to=\"opacity-0\"\n >\n <div\n data-ds-drawer-overlay\n class=\"fixed inset-0 bg-black/40\"\n aria-hidden=\"true\"\n @click=\"onOverlayClick\"\n />\n </TransitionChild>\n\n <TransitionChild\n as=\"template\"\n enter=\"duration-200 ease-out\"\n :enter-from=\"panelEnterFrom\"\n enter-to=\"translate-x-0\"\n leave=\"duration-150 ease-in\"\n leave-from=\"translate-x-0\"\n :leave-to=\"panelEnterFrom\"\n >\n <DialogPanel\n data-ds-drawer-panel\n tabindex=\"-1\"\n class=\"fixed inset-y-0 flex flex-col\"\n :class=\"panelClass\"\n >\n <div\n data-ds-drawer-header\n class=\"px-5 py-4 border-b border-[var(--brd)] flex items-center justify-between gap-4\"\n >\n <DialogTitle :id=\"titleId\" as=\"div\" data-ds-drawer-title class=\"text-[14px] font-700 min-w-0 truncate\">\n <slot name=\"title\">\n {{ title ?? 'Drawer' }}\n </slot>\n </DialogTitle>\n\n <GrButton\n variant=\"ghost\"\n size=\"sm\"\n square\n :aria-label=\"closeLabel\"\n @click=\"close\"\n >\n <GrIcon size=\"sm\" aria-hidden=\"true\">\n <IconClose />\n </GrIcon>\n </GrButton>\n </div>\n\n <div data-ds-drawer-body class=\"flex-1 overflow-y-auto\">\n <div class=\"p-5\">\n <slot />\n </div>\n </div>\n\n <div\n v-if=\"$slots.footer\"\n data-ds-drawer-footer\n class=\"px-5 py-4 border-t border-[var(--brd)]\"\n >\n <slot name=\"footer\" />\n </div>\n </DialogPanel>\n </TransitionChild>\n </div>\n </Dialog>\n </TransitionRoot>\n </teleport>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, useId } from 'vue'\nimport { Dialog, DialogPanel, DialogTitle, TransitionChild, TransitionRoot } from '@headlessui/vue'\n\nimport GrButton from '../GrButton/GrButton.vue'\nimport GrIcon from '../GrIcon/GrIcon.vue'\nimport {\n grDrawerPanelClass,\n grDrawerPanelEnterFrom,\n type GrDrawerSide,\n type GrDrawerSize,\n} from './grDrawerStyles'\n\nimport IconClose from '~icons/lucide/x'\n\nexport interface GrDrawerProps {\n /** Контроль открытия через v-model. */\n modelValue: boolean\n /** Заголовок; если передан — покажется в хедере. Можно переопределить слотом `#title`. */\n title?: string\n /** Закрывать при клике по бэкдропу / через HeadlessUI close. */\n closeOnBackdrop?: boolean\n /** Закрывать по Esc. */\n closeOnEsc?: boolean\n /** Сторона, с которой выезжает панель. */\n side?: GrDrawerSide\n /** Размер панели. */\n size?: GrDrawerSize\n /** i18n-friendly aria-label для кнопки закрытия. */\n closeLabel?: string\n}\n\nconst props = withDefaults(defineProps<GrDrawerProps>(), {\n title: undefined,\n closeOnBackdrop: true,\n closeOnEsc: true,\n side: 'right',\n size: 'md',\n closeLabel: 'Close',\n})\n\nconst emit = defineEmits<{\n (e: 'update:modelValue', value: boolean): void\n}>()\n\nconst titleId = useId()\n\nconst panelClass = computed(() => {\n return grDrawerPanelClass({ side: props.side, size: props.size })\n})\n\nconst panelEnterFrom = computed(() => grDrawerPanelEnterFrom(props.side))\n\nfunction close(): void {\n emit('update:modelValue', false)\n}\n\nfunction onDialogClose(): void {\n if (!props.closeOnBackdrop) return\n close()\n}\n\nfunction onOverlayClick(): void {\n if (!props.closeOnBackdrop) return\n close()\n}\n\nfunction onKeydown(e: KeyboardEvent): void {\n if (e.key !== 'Escape') return\n if (!props.closeOnEsc) return\n e.stopPropagation()\n e.preventDefault()\n close()\n}\n</script>\n\n<template>\n <teleport to=\"body\">\n <TransitionRoot :show=\"modelValue\" as=\"template\">\n <Dialog\n as=\"div\"\n data-ds-drawer\n class=\"fixed inset-0 z-50\"\n :static=\"true\"\n :aria-labelledby=\"titleId\"\n @close=\"onDialogClose\"\n @keydown=\"onKeydown\"\n >\n <div class=\"fixed inset-0\">\n <TransitionChild\n as=\"template\"\n enter=\"duration-200 ease-out\"\n enter-from=\"opacity-0\"\n enter-to=\"opacity-100\"\n leave=\"duration-150 ease-in\"\n leave-from=\"opacity-100\"\n leave-to=\"opacity-0\"\n >\n <div\n data-ds-drawer-overlay\n class=\"fixed inset-0 bg-black/40\"\n aria-hidden=\"true\"\n @click=\"onOverlayClick\"\n />\n </TransitionChild>\n\n <TransitionChild\n as=\"template\"\n enter=\"duration-200 ease-out\"\n :enter-from=\"panelEnterFrom\"\n enter-to=\"translate-x-0\"\n leave=\"duration-150 ease-in\"\n leave-from=\"translate-x-0\"\n :leave-to=\"panelEnterFrom\"\n >\n <DialogPanel\n data-ds-drawer-panel\n tabindex=\"-1\"\n class=\"fixed inset-y-0 flex flex-col\"\n :class=\"panelClass\"\n >\n <div\n data-ds-drawer-header\n class=\"px-5 py-4 border-b border-[var(--brd)] flex items-center justify-between gap-4\"\n >\n <DialogTitle :id=\"titleId\" as=\"div\" data-ds-drawer-title class=\"text-[14px] font-700 min-w-0 truncate\">\n <slot name=\"title\">\n {{ title ?? 'Drawer' }}\n </slot>\n </DialogTitle>\n\n <GrButton\n variant=\"ghost\"\n size=\"sm\"\n square\n :aria-label=\"closeLabel\"\n @click=\"close\"\n >\n <GrIcon size=\"sm\" aria-hidden=\"true\">\n <IconClose />\n </GrIcon>\n </GrButton>\n </div>\n\n <div data-ds-drawer-body class=\"flex-1 overflow-y-auto\">\n <div class=\"p-5\">\n <slot />\n </div>\n </div>\n\n <div\n v-if=\"$slots.footer\"\n data-ds-drawer-footer\n class=\"px-5 py-4 border-t border-[var(--brd)]\"\n >\n <slot name=\"footer\" />\n </div>\n </DialogPanel>\n </TransitionChild>\n </div>\n </Dialog>\n </TransitionRoot>\n </teleport>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAgCA,MAAM,QAAQ;EASd,MAAM,OAAO;EAIb,MAAM,UAAU,OAAM;EAEtB,MAAM,aAAa,eAAe;AAChC,UAAO,mBAAmB;IAAE,MAAM,MAAM;IAAM,MAAM,MAAM;IAAM,CAAA;IACjE;EAED,MAAM,iBAAiB,eAAe,uBAAuB,MAAM,KAAK,CAAA;EAExE,SAAS,QAAc;AACrB,QAAK,qBAAqB,MAAK;;EAGjC,SAAS,gBAAsB;AAC7B,OAAI,CAAC,MAAM,gBAAiB;AAC5B,UAAM;;EAGR,SAAS,iBAAuB;AAC9B,OAAI,CAAC,MAAM,gBAAiB;AAC5B,UAAM;;EAGR,SAAS,UAAU,GAAwB;AACzC,OAAI,EAAE,QAAQ,SAAU;AACxB,OAAI,CAAC,MAAM,WAAY;AACvB,KAAE,iBAAgB;AAClB,KAAE,gBAAe;AACjB,UAAM;;;uBAKN,YAqFW,UAAA,EArFD,IAAG,QAAM,EAAA,CACjB,YAmFiB,MAAA,GAAA,EAAA;IAnFA,MAAM,QAAA;IAAY,IAAG;;2BAkF3B,CAjFT,YAiFS,MAAA,GAAA,EAAA;KAhFP,IAAG;KACH,kBAAA;KACA,OAAM;KACL,QAAQ;KACR,mBAAiB,MAAA,QAAO;KACxB,SAAO;KACE;;4BAyEJ,CAvEN,mBAuEM,OAvEN,YAuEM,CAtEJ,YAekB,MAAA,GAAA,EAAA;MAdhB,IAAG;MACH,OAAM;MACN,cAAW;MACX,YAAS;MACT,OAAM;MACN,cAAW;MACX,YAAS;;6BAOP,CALF,mBAKE,OAAA;OAJA,0BAAA;OACA,OAAM;OACN,eAAY;OACX,SAAO;;;SAIZ,YAoDkB,MAAA,GAAA,EAAA;MAnDhB,IAAG;MACH,OAAM;MACL,cAAY,eAAA;MACb,YAAS;MACT,OAAM;MACN,cAAW;MACV,YAAU,eAAA;;6BA4CG,CA1Cd,YA0Cc,MAAA,GAAA,EAAA;OAzCZ,wBAAA;OACA,UAAS;OACT,OAAK,eAAA,CAAC,iCACE,WAAA,MAAU,CAAA;;8BAuBZ;QArBN,mBAqBM,OArBN,YAqBM,CAjBJ,YAIc,MAAA,GAAA,EAAA;SAJA,IAAI,MAAA,QAAO;SAAE,IAAG;SAAM,wBAAA;SAAqB,OAAM;;gCAGtD,CAFP,WAEO,KAAA,QAAA,SAAA,EAAA,QAAA,CAAA,gBAAA,gBADF,QAAA,SAAK,SAAA,EAAA,EAAA,CAAA,CAAA,CAAA,CAAA;;uBAIZ,YAUW,kBAAA;SATT,SAAQ;SACR,MAAK;SACL,QAAA;SACC,cAAY,QAAA;SACZ,SAAO;;gCAIC,CAFT,YAES,gBAAA;UAFD,MAAK;UAAK,eAAY;;iCACf,CAAb,YAAa,MAAA,UAAA,CAAA,CAAA,CAAA;;;;;QAKnB,mBAIM,OAJN,YAIM,CAHJ,mBAEM,OAFN,YAEM,CADJ,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA,CAAA,CAAA;QAKJA,KAAAA,OAAO,UAAA,WAAA,EADf,mBAMM,OANN,YAMM,CADJ,WAAsB,KAAA,QAAA,SAAA,CAAA,CAAA,IAAA,mBAAA,IAAA,KAAA"}
|
|
@@ -1,151 +0,0 @@
|
|
|
1
|
-
import { vClickOutside } from "../../../directives/clickOutside.js";
|
|
2
|
-
import { i as grDropdownWidthClass, n as grDropdownAlignmentClass, r as grDropdownContentClass } from "../../../chunks/grDropdownStyles-B41mVR1H.js";
|
|
3
|
-
import { Teleport, Transition, computed, createBlock, createElementBlock, createElementVNode, createVNode, defineComponent, normalizeClass, normalizeStyle, onUnmounted, openBlock, ref, renderSlot, unref, vShow, watch, withCtx, withDirectives } from "vue";
|
|
4
|
-
//#region src/components/GrDropdown/GrDropdown.vue?vue&type=script&setup=true&lang.ts
|
|
5
|
-
var _hoisted_1 = { "data-ds-dropdown": "" };
|
|
6
|
-
//#endregion
|
|
7
|
-
//#region src/components/GrDropdown/GrDropdown.vue
|
|
8
|
-
var GrDropdown_default = /* @__PURE__ */ defineComponent({
|
|
9
|
-
__name: "GrDropdown",
|
|
10
|
-
props: {
|
|
11
|
-
align: { default: "right" },
|
|
12
|
-
width: { default: "48" },
|
|
13
|
-
closeOnContentClick: {
|
|
14
|
-
type: Boolean,
|
|
15
|
-
default: true
|
|
16
|
-
},
|
|
17
|
-
contentClass: { default: "" },
|
|
18
|
-
teleportTo: { default: "body" }
|
|
19
|
-
},
|
|
20
|
-
setup(__props) {
|
|
21
|
-
const props = __props;
|
|
22
|
-
const open = ref(false);
|
|
23
|
-
const rootEl = ref(null);
|
|
24
|
-
const panelEl = ref(null);
|
|
25
|
-
const clickOutsideExclude = [() => panelEl.value];
|
|
26
|
-
const panelStyle = ref({
|
|
27
|
-
left: "0px",
|
|
28
|
-
top: "0px",
|
|
29
|
-
zIndex: "2147483647"
|
|
30
|
-
});
|
|
31
|
-
let syncFrame = 0;
|
|
32
|
-
function cancelPanelPositionSync() {
|
|
33
|
-
if (typeof window === "undefined") return;
|
|
34
|
-
if (!syncFrame) return;
|
|
35
|
-
window.cancelAnimationFrame(syncFrame);
|
|
36
|
-
syncFrame = 0;
|
|
37
|
-
}
|
|
38
|
-
function syncPanelPosition() {
|
|
39
|
-
if (typeof window === "undefined") return;
|
|
40
|
-
const root = rootEl.value;
|
|
41
|
-
if (!root) return;
|
|
42
|
-
const rootRect = root.getBoundingClientRect();
|
|
43
|
-
panelStyle.value = {
|
|
44
|
-
left: `${(() => {
|
|
45
|
-
if (props.align === "right") return rootRect.right;
|
|
46
|
-
if (props.align === "center") return rootRect.left + rootRect.width / 2;
|
|
47
|
-
return rootRect.left;
|
|
48
|
-
})()}px`,
|
|
49
|
-
top: `${rootRect.bottom + 8}px`,
|
|
50
|
-
zIndex: "2147483647"
|
|
51
|
-
};
|
|
52
|
-
}
|
|
53
|
-
function schedulePanelPositionSync() {
|
|
54
|
-
if (typeof window === "undefined") return;
|
|
55
|
-
if (syncFrame) return;
|
|
56
|
-
syncFrame = window.requestAnimationFrame(() => {
|
|
57
|
-
syncFrame = 0;
|
|
58
|
-
if (open.value) syncPanelPosition();
|
|
59
|
-
});
|
|
60
|
-
}
|
|
61
|
-
function bindPanelPositionListeners() {
|
|
62
|
-
if (typeof window === "undefined") return;
|
|
63
|
-
window.addEventListener("resize", schedulePanelPositionSync);
|
|
64
|
-
window.addEventListener("scroll", schedulePanelPositionSync, true);
|
|
65
|
-
}
|
|
66
|
-
function unbindPanelPositionListeners() {
|
|
67
|
-
if (typeof window === "undefined") return;
|
|
68
|
-
window.removeEventListener("resize", schedulePanelPositionSync);
|
|
69
|
-
window.removeEventListener("scroll", schedulePanelPositionSync, true);
|
|
70
|
-
}
|
|
71
|
-
function toggle() {
|
|
72
|
-
open.value = !open.value;
|
|
73
|
-
}
|
|
74
|
-
function close() {
|
|
75
|
-
open.value = false;
|
|
76
|
-
}
|
|
77
|
-
function closeOnEscape(e) {
|
|
78
|
-
if (e.key === "Escape") close();
|
|
79
|
-
}
|
|
80
|
-
watch(open, (isOpen) => {
|
|
81
|
-
if (typeof document === "undefined") return;
|
|
82
|
-
document.removeEventListener("keydown", closeOnEscape);
|
|
83
|
-
unbindPanelPositionListeners();
|
|
84
|
-
cancelPanelPositionSync();
|
|
85
|
-
if (isOpen) document.addEventListener("keydown", closeOnEscape);
|
|
86
|
-
if (!isOpen) return;
|
|
87
|
-
bindPanelPositionListeners();
|
|
88
|
-
syncPanelPosition();
|
|
89
|
-
}, { immediate: true });
|
|
90
|
-
watch(() => props.align, () => {
|
|
91
|
-
if (open.value) schedulePanelPositionSync();
|
|
92
|
-
});
|
|
93
|
-
onUnmounted(() => {
|
|
94
|
-
if (typeof document === "undefined") return;
|
|
95
|
-
document.removeEventListener("keydown", closeOnEscape);
|
|
96
|
-
unbindPanelPositionListeners();
|
|
97
|
-
cancelPanelPositionSync();
|
|
98
|
-
});
|
|
99
|
-
const widthClass = computed(() => grDropdownWidthClass(props.width));
|
|
100
|
-
const contentClasses = computed(() => grDropdownContentClass(props.contentClass));
|
|
101
|
-
const panelClasses = computed(() => {
|
|
102
|
-
return [
|
|
103
|
-
"fixed z-50",
|
|
104
|
-
widthClass.value,
|
|
105
|
-
grDropdownAlignmentClass(props.align)
|
|
106
|
-
].filter(Boolean);
|
|
107
|
-
});
|
|
108
|
-
function onContentClick() {
|
|
109
|
-
if (props.closeOnContentClick) close();
|
|
110
|
-
}
|
|
111
|
-
return (_ctx, _cache) => {
|
|
112
|
-
return openBlock(), createElementBlock("div", _hoisted_1, [withDirectives((openBlock(), createElementBlock("div", {
|
|
113
|
-
ref_key: "rootEl",
|
|
114
|
-
ref: rootEl,
|
|
115
|
-
"data-ds-dropdown-trigger": "",
|
|
116
|
-
class: "inline-block max-w-full",
|
|
117
|
-
onClick: toggle
|
|
118
|
-
}, [renderSlot(_ctx.$slots, "trigger", {
|
|
119
|
-
open: open.value,
|
|
120
|
-
toggle,
|
|
121
|
-
close
|
|
122
|
-
})])), [[unref(vClickOutside), {
|
|
123
|
-
handler: close,
|
|
124
|
-
enabled: open.value,
|
|
125
|
-
exclude: clickOutsideExclude
|
|
126
|
-
}]]), (openBlock(), createBlock(Teleport, { to: __props.teleportTo }, [createVNode(Transition, {
|
|
127
|
-
"enter-active-class": "transition ease-out duration-150",
|
|
128
|
-
"enter-from-class": "transform opacity-0 scale-95",
|
|
129
|
-
"enter-to-class": "transform opacity-100 scale-100",
|
|
130
|
-
"leave-active-class": "transition ease-in duration-100",
|
|
131
|
-
"leave-from-class": "transform opacity-100 scale-100",
|
|
132
|
-
"leave-to-class": "transform opacity-0 scale-95"
|
|
133
|
-
}, {
|
|
134
|
-
default: withCtx(() => [withDirectives(createElementVNode("div", {
|
|
135
|
-
ref_key: "panelEl",
|
|
136
|
-
ref: panelEl,
|
|
137
|
-
"data-ds-dropdown-panel": "",
|
|
138
|
-
class: normalizeClass(panelClasses.value),
|
|
139
|
-
style: normalizeStyle(panelStyle.value),
|
|
140
|
-
onClick: onContentClick
|
|
141
|
-
}, [createElementVNode("div", {
|
|
142
|
-
"data-ds-dropdown-content": "",
|
|
143
|
-
class: normalizeClass(contentClasses.value)
|
|
144
|
-
}, [renderSlot(_ctx.$slots, "content", { close })], 2)], 6), [[vShow, open.value]])]),
|
|
145
|
-
_: 3
|
|
146
|
-
})], 8, ["to"]))]);
|
|
147
|
-
};
|
|
148
|
-
}
|
|
149
|
-
});
|
|
150
|
-
//#endregion
|
|
151
|
-
export { GrDropdown_default as t };
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"GrDropdown-DOvHKnih.js","names":[],"sources":["../../../../src/components/GrDropdown/GrDropdown.vue","../../../../src/components/GrDropdown/GrDropdown.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, onUnmounted, ref, watch } from 'vue'\n\nimport { vClickOutside } from '../../directives'\nimport {\n grDropdownAlignmentClass,\n grDropdownContentClass,\n grDropdownWidthClass,\n type GrDropdownAlign,\n type GrDropdownWidth,\n} from './grDropdownStyles'\n\nexport interface GrDropdownProps {\n /** Выравнивание панели относительно триггера. */\n align?: GrDropdownAlign\n /** Ширина панели (tailwind-токены `w-*` или `auto`). */\n width?: GrDropdownWidth\n /** Закрывать панель по клику внутри content. */\n closeOnContentClick?: boolean\n /** Дополнительные классы контейнера content. */\n contentClass?: string\n /** Куда телепортировать панель (`body` по умолчанию). */\n teleportTo?: string | HTMLElement\n}\n\nconst props = withDefaults(defineProps<GrDropdownProps>(), {\n align: 'right',\n width: '48',\n closeOnContentClick: true,\n contentClass: '',\n teleportTo: 'body',\n})\n\nconst open = ref(false)\nconst rootEl = ref<HTMLElement | null>(null)\nconst panelEl = ref<HTMLElement | null>(null)\nconst clickOutsideExclude = [() => panelEl.value]\nconst panelStyle = ref<Record<string, string>>({\n left: '0px',\n top: '0px',\n zIndex: '2147483647',\n})\nlet syncFrame = 0\n\nfunction cancelPanelPositionSync(): void {\n if (typeof window === 'undefined') return\n if (!syncFrame) return\n\n window.cancelAnimationFrame(syncFrame)\n syncFrame = 0\n}\n\nfunction syncPanelPosition(): void {\n if (typeof window === 'undefined') return\n\n const root = rootEl.value\n if (!root) return\n\n const rootRect = root.getBoundingClientRect()\n const left = (() => {\n if (props.align === 'right') return rootRect.right\n if (props.align === 'center') return rootRect.left + (rootRect.width / 2)\n return rootRect.left\n })()\n\n panelStyle.value = {\n left: `${left}px`,\n top: `${rootRect.bottom + 8}px`,\n zIndex: '2147483647',\n }\n}\n\nfunction schedulePanelPositionSync(): void {\n if (typeof window === 'undefined') return\n if (syncFrame) return\n\n syncFrame = window.requestAnimationFrame(() => {\n syncFrame = 0\n\n if (open.value) {\n syncPanelPosition()\n }\n })\n}\n\nfunction bindPanelPositionListeners(): void {\n if (typeof window === 'undefined') return\n window.addEventListener('resize', schedulePanelPositionSync)\n window.addEventListener('scroll', schedulePanelPositionSync, true)\n}\n\nfunction unbindPanelPositionListeners(): void {\n if (typeof window === 'undefined') return\n window.removeEventListener('resize', schedulePanelPositionSync)\n window.removeEventListener('scroll', schedulePanelPositionSync, true)\n}\n\nfunction toggle(): void {\n open.value = !open.value\n}\n\nfunction close(): void {\n open.value = false\n}\n\nfunction closeOnEscape(e: KeyboardEvent): void {\n if (e.key === 'Escape') close()\n}\n\nwatch(\n open,\n (isOpen) => {\n if (typeof document === 'undefined') return\n\n document.removeEventListener('keydown', closeOnEscape)\n unbindPanelPositionListeners()\n cancelPanelPositionSync()\n if (isOpen) document.addEventListener('keydown', closeOnEscape)\n\n if (!isOpen) return\n\n bindPanelPositionListeners()\n syncPanelPosition()\n },\n { immediate: true },\n)\n\nwatch(\n () => props.align,\n () => {\n if (open.value) {\n schedulePanelPositionSync()\n }\n },\n)\n\nonUnmounted(() => {\n if (typeof document === 'undefined') return\n document.removeEventListener('keydown', closeOnEscape)\n unbindPanelPositionListeners()\n cancelPanelPositionSync()\n})\n\nconst widthClass = computed(() => grDropdownWidthClass(props.width))\n\nconst contentClasses = computed(() => grDropdownContentClass(props.contentClass))\n\nconst panelClasses = computed(() => {\n return ['fixed z-50', widthClass.value, grDropdownAlignmentClass(props.align)].filter(Boolean)\n})\n\nfunction onContentClick(): void {\n if (props.closeOnContentClick) {\n close()\n }\n}\n</script>\n\n<template>\n <div data-ds-dropdown>\n <div\n ref=\"rootEl\"\n v-click-outside=\"{ handler: close, enabled: open, exclude: clickOutsideExclude }\"\n data-ds-dropdown-trigger\n class=\"inline-block max-w-full\"\n @click=\"toggle\"\n >\n <slot name=\"trigger\" :open=\"open\" :toggle=\"toggle\" :close=\"close\" />\n </div>\n\n <teleport :to=\"teleportTo\">\n <transition\n enter-active-class=\"transition ease-out duration-150\"\n enter-from-class=\"transform opacity-0 scale-95\"\n enter-to-class=\"transform opacity-100 scale-100\"\n leave-active-class=\"transition ease-in duration-100\"\n leave-from-class=\"transform opacity-100 scale-100\"\n leave-to-class=\"transform opacity-0 scale-95\"\n >\n <div\n v-show=\"open\"\n ref=\"panelEl\"\n data-ds-dropdown-panel\n :class=\"panelClasses\"\n :style=\"panelStyle\"\n @click=\"onContentClick\"\n >\n <div data-ds-dropdown-content :class=\"contentClasses\">\n <slot name=\"content\" :close=\"close\" />\n </div>\n </div>\n </transition>\n </teleport>\n </div>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, onUnmounted, ref, watch } from 'vue'\n\nimport { vClickOutside } from '../../directives'\nimport {\n grDropdownAlignmentClass,\n grDropdownContentClass,\n grDropdownWidthClass,\n type GrDropdownAlign,\n type GrDropdownWidth,\n} from './grDropdownStyles'\n\nexport interface GrDropdownProps {\n /** Выравнивание панели относительно триггера. */\n align?: GrDropdownAlign\n /** Ширина панели (tailwind-токены `w-*` или `auto`). */\n width?: GrDropdownWidth\n /** Закрывать панель по клику внутри content. */\n closeOnContentClick?: boolean\n /** Дополнительные классы контейнера content. */\n contentClass?: string\n /** Куда телепортировать панель (`body` по умолчанию). */\n teleportTo?: string | HTMLElement\n}\n\nconst props = withDefaults(defineProps<GrDropdownProps>(), {\n align: 'right',\n width: '48',\n closeOnContentClick: true,\n contentClass: '',\n teleportTo: 'body',\n})\n\nconst open = ref(false)\nconst rootEl = ref<HTMLElement | null>(null)\nconst panelEl = ref<HTMLElement | null>(null)\nconst clickOutsideExclude = [() => panelEl.value]\nconst panelStyle = ref<Record<string, string>>({\n left: '0px',\n top: '0px',\n zIndex: '2147483647',\n})\nlet syncFrame = 0\n\nfunction cancelPanelPositionSync(): void {\n if (typeof window === 'undefined') return\n if (!syncFrame) return\n\n window.cancelAnimationFrame(syncFrame)\n syncFrame = 0\n}\n\nfunction syncPanelPosition(): void {\n if (typeof window === 'undefined') return\n\n const root = rootEl.value\n if (!root) return\n\n const rootRect = root.getBoundingClientRect()\n const left = (() => {\n if (props.align === 'right') return rootRect.right\n if (props.align === 'center') return rootRect.left + (rootRect.width / 2)\n return rootRect.left\n })()\n\n panelStyle.value = {\n left: `${left}px`,\n top: `${rootRect.bottom + 8}px`,\n zIndex: '2147483647',\n }\n}\n\nfunction schedulePanelPositionSync(): void {\n if (typeof window === 'undefined') return\n if (syncFrame) return\n\n syncFrame = window.requestAnimationFrame(() => {\n syncFrame = 0\n\n if (open.value) {\n syncPanelPosition()\n }\n })\n}\n\nfunction bindPanelPositionListeners(): void {\n if (typeof window === 'undefined') return\n window.addEventListener('resize', schedulePanelPositionSync)\n window.addEventListener('scroll', schedulePanelPositionSync, true)\n}\n\nfunction unbindPanelPositionListeners(): void {\n if (typeof window === 'undefined') return\n window.removeEventListener('resize', schedulePanelPositionSync)\n window.removeEventListener('scroll', schedulePanelPositionSync, true)\n}\n\nfunction toggle(): void {\n open.value = !open.value\n}\n\nfunction close(): void {\n open.value = false\n}\n\nfunction closeOnEscape(e: KeyboardEvent): void {\n if (e.key === 'Escape') close()\n}\n\nwatch(\n open,\n (isOpen) => {\n if (typeof document === 'undefined') return\n\n document.removeEventListener('keydown', closeOnEscape)\n unbindPanelPositionListeners()\n cancelPanelPositionSync()\n if (isOpen) document.addEventListener('keydown', closeOnEscape)\n\n if (!isOpen) return\n\n bindPanelPositionListeners()\n syncPanelPosition()\n },\n { immediate: true },\n)\n\nwatch(\n () => props.align,\n () => {\n if (open.value) {\n schedulePanelPositionSync()\n }\n },\n)\n\nonUnmounted(() => {\n if (typeof document === 'undefined') return\n document.removeEventListener('keydown', closeOnEscape)\n unbindPanelPositionListeners()\n cancelPanelPositionSync()\n})\n\nconst widthClass = computed(() => grDropdownWidthClass(props.width))\n\nconst contentClasses = computed(() => grDropdownContentClass(props.contentClass))\n\nconst panelClasses = computed(() => {\n return ['fixed z-50', widthClass.value, grDropdownAlignmentClass(props.align)].filter(Boolean)\n})\n\nfunction onContentClick(): void {\n if (props.closeOnContentClick) {\n close()\n }\n}\n</script>\n\n<template>\n <div data-ds-dropdown>\n <div\n ref=\"rootEl\"\n v-click-outside=\"{ handler: close, enabled: open, exclude: clickOutsideExclude }\"\n data-ds-dropdown-trigger\n class=\"inline-block max-w-full\"\n @click=\"toggle\"\n >\n <slot name=\"trigger\" :open=\"open\" :toggle=\"toggle\" :close=\"close\" />\n </div>\n\n <teleport :to=\"teleportTo\">\n <transition\n enter-active-class=\"transition ease-out duration-150\"\n enter-from-class=\"transform opacity-0 scale-95\"\n enter-to-class=\"transform opacity-100 scale-100\"\n leave-active-class=\"transition ease-in duration-100\"\n leave-from-class=\"transform opacity-100 scale-100\"\n leave-to-class=\"transform opacity-0 scale-95\"\n >\n <div\n v-show=\"open\"\n ref=\"panelEl\"\n data-ds-dropdown-panel\n :class=\"panelClasses\"\n :style=\"panelStyle\"\n @click=\"onContentClick\"\n >\n <div data-ds-dropdown-content :class=\"contentClasses\">\n <slot name=\"content\" :close=\"close\" />\n </div>\n </div>\n </transition>\n </teleport>\n </div>\n</template>\n"],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"GrFileUpload-BEKNB1RM.js","names":["$slots"],"sources":["../../../../src/components/GrFileUpload/uploadViaXhr.ts","../../../../src/components/GrFileUpload/uploadState.ts","../../../../src/components/GrFileUpload/GrFileUpload.vue","../../../../src/components/GrFileUpload/GrFileUpload.vue"],"sourcesContent":["/**\n * Загрузка файлов через `XMLHttpRequest` с поддержкой прогресса аплоада и\n * отмены по `AbortSignal`. Используется в `GrFileUpload` для ветки `action`,\n * а также может применяться пользователем напрямую в `request`-загрузчике.\n */\n\nexport type GrUploadExtraDataValue = string | Blob\n\nexport type GrUploadExtraData = Record<string, GrUploadExtraDataValue | GrUploadExtraDataValue[]>\n\nexport interface GrUploadProgressInfo {\n /** Процент `0..100`. Для запросов без `lengthComputable` значение `0` и `indeterminate = true`. */\n percent: number\n loaded: number\n total: number\n indeterminate: boolean\n}\n\nexport interface UploadViaXhrOptions {\n url: string\n files: File[]\n name: string\n headers?: Record<string, string>\n withCredentials?: boolean\n extraData?: GrUploadExtraData\n signal: AbortSignal\n onProgress?: (info: GrUploadProgressInfo) => void\n}\n\nexport class GrUploadAbortError extends Error {\n constructor(message = 'Upload aborted') {\n super(message)\n this.name = 'GrUploadAbortError'\n }\n}\n\nexport class GrUploadHttpError extends Error {\n status: number\n payload: unknown\n\n constructor(status: number, payload: unknown) {\n super(`Upload failed with status ${status}`)\n this.name = 'GrUploadHttpError'\n this.status = status\n this.payload = payload\n }\n}\n\nfunction appendExtraFormData(body: FormData, extraData: GrUploadExtraData | undefined) {\n if (!extraData) return\n\n for (const [key, value] of Object.entries(extraData)) {\n if (Array.isArray(value)) {\n for (const entry of value) body.append(key, entry)\n continue\n }\n\n body.append(key, value)\n }\n}\n\nfunction parseResponse(xhr: XMLHttpRequest): unknown {\n const contentType = xhr.getResponseHeader('content-type') ?? ''\n const raw = xhr.responseText\n\n if (contentType.includes('application/json')) {\n try {\n return JSON.parse(raw)\n } catch {\n return raw\n }\n }\n\n return raw\n}\n\nexport function uploadViaXhr(options: UploadViaXhrOptions): Promise<unknown> {\n const { url, files, name, headers, withCredentials, extraData, signal, onProgress } = options\n\n return new Promise<unknown>((resolve, reject) => {\n if (signal.aborted) {\n reject(new GrUploadAbortError())\n return\n }\n\n const body = new FormData()\n for (const file of files) body.append(name, file)\n appendExtraFormData(body, extraData)\n\n const xhr = new XMLHttpRequest()\n xhr.open('POST', url, true)\n xhr.withCredentials = !!withCredentials\n\n if (headers) {\n for (const [key, value] of Object.entries(headers))\n xhr.setRequestHeader(key, value)\n }\n\n const onAbort = () => {\n try {\n xhr.abort()\n } catch {\n /* ignore */\n }\n }\n\n signal.addEventListener('abort', onAbort)\n\n const cleanup = () => {\n signal.removeEventListener('abort', onAbort)\n }\n\n if (onProgress) {\n xhr.upload.addEventListener('progress', (event) => {\n const indeterminate = !event.lengthComputable\n const total = indeterminate ? 0 : event.total\n const loaded = indeterminate ? 0 : event.loaded\n const percent = indeterminate || total === 0 ? 0 : Math.min(100, (loaded / total) * 100)\n onProgress({ percent, loaded, total, indeterminate })\n })\n }\n\n xhr.addEventListener('load', () => {\n cleanup()\n const payload = parseResponse(xhr)\n const status = xhr.status\n\n if (status >= 200 && status < 300) {\n if (onProgress) onProgress({ percent: 100, loaded: 1, total: 1, indeterminate: false })\n resolve(payload)\n return\n }\n\n reject(new GrUploadHttpError(status, payload))\n })\n\n xhr.addEventListener('error', () => {\n cleanup()\n reject(new Error('Network error during upload'))\n })\n\n xhr.addEventListener('abort', () => {\n cleanup()\n reject(new GrUploadAbortError())\n })\n\n xhr.send(body)\n })\n}\n","/**\n * Состояние процесса загрузки в `GrFileUpload`.\n *\n * Используется как для внутреннего управления UI, так и пробрасывается наружу\n * через scoped-слоты (`progress`, `default`) и `defineExpose`.\n */\n\nexport type GrUploadPhase = 'idle' | 'uploading' | 'success' | 'error'\n\nexport interface GrUploadStateIdle {\n phase: 'idle'\n percent: 0\n indeterminate: false\n loaded: 0\n total: 0\n}\n\nexport interface GrUploadStateUploading {\n phase: 'uploading'\n percent: number\n indeterminate: boolean\n loaded: number\n total: number\n}\n\nexport interface GrUploadStateSuccess {\n phase: 'success'\n percent: 100\n indeterminate: false\n loaded: number\n total: number\n}\n\nexport interface GrUploadStateError {\n phase: 'error'\n percent: number\n indeterminate: false\n loaded: number\n total: number\n error: unknown\n}\n\nexport type GrUploadState =\n | GrUploadStateIdle\n | GrUploadStateUploading\n | GrUploadStateSuccess\n | GrUploadStateError\n\nexport const GR_UPLOAD_STATE_IDLE: GrUploadStateIdle = Object.freeze({\n phase: 'idle',\n percent: 0,\n indeterminate: false,\n loaded: 0,\n total: 0,\n})\n","<script setup lang=\"ts\">\nimport { Comment, computed, Fragment, nextTick, reactive, ref, Text, useSlots, type VNode } from 'vue'\n\nimport IconArrowUp from '~icons/lucide/arrow-up'\n\nimport GrIcon from '../GrIcon/GrIcon.vue'\nimport GrProgressBar from '../GrProgressBar/GrProgressBar.vue'\nimport type { GrProgressBarTone } from '../GrProgressBar/grStyle'\nimport type { FileValidator, FileValidatorSource } from '../../fileValidation'\nimport type { GrUploadProgressInfo } from './uploadViaXhr'\nimport type { GrUploadState } from './uploadState'\n\nimport { FileValidationError, runFileValidators } from '../../fileValidation'\nimport { GrUploadAbortError, uploadViaXhr } from './uploadViaXhr'\nimport { GR_UPLOAD_STATE_IDLE } from './uploadState'\n\nexport type GrFileUploadExtraDataValue = string | Blob\n\nexport type GrFileUploadExtraData = Record<string, GrFileUploadExtraDataValue | GrFileUploadExtraDataValue[]>\n\nexport type GrFileUploadRequestCtx = {\n signal: AbortSignal\n extraData?: GrFileUploadExtraData\n /**\n * Колбэк прогресса аплоада. Пользовательский `request` (например, axios)\n * должен вызывать его из `onUploadProgress`, чтобы `GrFileUpload` отображал\n * прогресс через слот `progress` / дефолтный `GrProgressBar`.\n */\n onProgress?: (info: GrUploadProgressInfo) => void\n}\n\nexport type GrFileUploadRequest = (files: File[], ctx: GrFileUploadRequestCtx) => Promise<any>\n\n/**\n * Пропы `GrFileUpload`.\n *\n * Либо `action` (URL для POST multipart/form-data), либо `request` — кастомный\n * загрузчик (например, через axios). Если переданы оба — приоритет у `request`.\n *\n * `placeholder` — надпись в дефолтном UI-варианте (без слота default).\n */\nexport interface GrFileUploadProps {\n action?: string\n request?: GrFileUploadRequest\n name?: string\n multiple?: boolean\n limit?: number\n onExceed?: (files: File[], limit: number) => void\n beforeUpload?: (file: File) => boolean | Promise<unknown>\n validators?: FileValidator[]\n disabled?: boolean\n headers?: Record<string, string>\n withCredentials?: boolean\n showFileList?: boolean\n uploadExtraData?: (files: File[]) => GrFileUploadExtraData | undefined\n /** i18n: надпись-подсказка в дефолтном UI. */\n placeholder?: string\n /** Показывать дефолтный прогресс-бар (если не используется слот `progress`). */\n showProgress?: boolean\n /** Цветовой тон полосы прогресса в фазе `uploading`. */\n progressTone?: GrProgressBarTone\n /** aria-label для прогресс-бара. */\n progressLabel?: string\n /** Через сколько мс после `success` скрыть прогресс-бар. `0` — не скрывать. */\n hideProgressOnSuccess?: number\n}\n\nconst props = withDefaults(\n defineProps<GrFileUploadProps>(),\n {\n action: undefined,\n request: undefined,\n name: 'file',\n multiple: false,\n limit: undefined,\n onExceed: undefined,\n beforeUpload: undefined,\n validators: undefined,\n disabled: false,\n headers: undefined,\n withCredentials: false,\n showFileList: false,\n uploadExtraData: undefined,\n placeholder: 'Drag files here or click to select',\n showProgress: true,\n progressTone: 'primary',\n progressLabel: 'Upload progress',\n hideProgressOnSuccess: 800,\n },\n)\n\nconst emit = defineEmits<{\n (e: 'success', payload: any): void\n (e: 'error', error: unknown): void\n (e: 'progress', percent: number, info?: GrUploadProgressInfo): void\n (e: 'change', files: File[]): void\n (e: 'stateChange', state: GrUploadState): void\n}>()\n\nconst slots = useSlots()\n\nfunction flattenSlotNodes(nodes: VNode[]): VNode[] {\n const out: VNode[] = []\n\n for (const node of nodes) {\n if (node.type === Fragment && Array.isArray(node.children)) {\n out.push(...flattenSlotNodes(node.children as VNode[]))\n continue\n }\n\n out.push(node)\n }\n\n return out\n}\n\nfunction isWhitespaceTextNode(node: VNode): boolean {\n if (node.type !== Text) return false\n return typeof node.children === 'string' && node.children.trim().length === 0\n}\n\nfunction slotIsTextOnly(nodes: VNode[]): boolean {\n const flat = flattenSlotNodes(nodes)\n const meaningful = flat.filter(node => node.type !== Comment && !isWhitespaceTextNode(node))\n\n if (meaningful.length === 0) return true\n\n for (const node of meaningful) {\n if (node.type !== Text) return false\n }\n\n return true\n}\n\nconst defaultSlotNodes = computed(() => {\n return slots.default ? flattenSlotNodes(slots.default({} as any)) : []\n})\n\nconst hasCustomUi = computed(() => {\n return !!slots.default && !slotIsTextOnly(defaultSlotNodes.value)\n})\n\nconst inputRef = ref<HTMLInputElement | null>(null)\nconst isOver = ref(false)\nlet overCounter = 0\n\nconst lastFiles = ref<File[]>([])\n\nconst state = reactive<GrUploadState>({ ...GR_UPLOAD_STATE_IDLE }) as GrUploadState\n\nlet activeController: AbortController | null = null\nlet hideSuccessTimer: ReturnType<typeof setTimeout> | null = null\n\nfunction clearHideSuccessTimer() {\n if (hideSuccessTimer !== null) {\n clearTimeout(hideSuccessTimer)\n hideSuccessTimer = null\n }\n}\n\nfunction assignState(next: GrUploadState) {\n // мутируем через Object.assign, чтобы сохранить reactive ссылку\n for (const key of Object.keys(state) as (keyof GrUploadState)[])\n delete (state as any)[key]\n Object.assign(state, next)\n emit('stateChange', state as GrUploadState)\n}\n\nfunction setStateIdle() {\n assignState({ ...GR_UPLOAD_STATE_IDLE })\n}\n\nfunction setStateUploading(info?: GrUploadProgressInfo) {\n assignState({\n phase: 'uploading',\n percent: info?.percent ?? 0,\n indeterminate: info?.indeterminate ?? true,\n loaded: info?.loaded ?? 0,\n total: info?.total ?? 0,\n })\n}\n\nfunction setStateSuccess(info: { loaded: number, total: number }) {\n assignState({\n phase: 'success',\n percent: 100,\n indeterminate: false,\n loaded: info.loaded,\n total: info.total,\n })\n}\n\nfunction setStateError(error: unknown) {\n const prev = state\n assignState({\n phase: 'error',\n percent: prev.phase === 'uploading' ? prev.percent : 0,\n indeterminate: false,\n loaded: prev.phase === 'uploading' ? prev.loaded : 0,\n total: prev.phase === 'uploading' ? prev.total : 0,\n error,\n })\n}\n\nfunction handleProgress(info: GrUploadProgressInfo) {\n if (state.phase !== 'uploading') return\n assignState({\n phase: 'uploading',\n percent: info.percent,\n indeterminate: info.indeterminate,\n loaded: info.loaded,\n total: info.total,\n })\n emit('progress', info.percent, info)\n}\n\nconst tabIndex = computed(() => (props.disabled ? -1 : 0))\n\nconst hiddenInputStyle = {\n position: 'fixed',\n top: '-9999px',\n left: '-9999px',\n width: '1px',\n height: '1px',\n opacity: '0',\n overflow: 'hidden',\n pointerEvents: 'none',\n} as const satisfies Record<string, string>\n\nfunction setOver(next: boolean) {\n if (isOver.value === next) return\n isOver.value = next\n}\n\nfunction openDialog() {\n if (props.disabled) return\n inputRef.value?.click()\n}\n\nfunction abort() {\n activeController?.abort()\n activeController = null\n}\n\nfunction normalizeLimit(limit: number | undefined): number | undefined {\n if (typeof limit !== 'number') return undefined\n if (!Number.isFinite(limit)) return undefined\n if (limit <= 0) return undefined\n return Math.floor(limit)\n}\n\n\nasync function uploadViaAction(files: File[], signal: AbortSignal, extraData: GrFileUploadExtraData | undefined) {\n if (!props.action) throw new Error('GrFileUpload: either `action` or `request` must be provided')\n\n return uploadViaXhr({\n url: props.action,\n files,\n name: props.name,\n headers: props.headers,\n withCredentials: props.withCredentials,\n extraData,\n signal,\n onProgress: handleProgress,\n })\n}\n\nasync function runBeforeUpload(files: File[]): Promise<'ok' | { aborted: true; reason: unknown }> {\n if (!props.beforeUpload) return 'ok'\n\n for (const file of files) {\n try {\n const result = props.beforeUpload(file)\n\n if (result === false) {\n return { aborted: true, reason: new Error('Upload aborted by beforeUpload') }\n }\n\n if (result && typeof (result as any).then === 'function')\n await result\n } catch (error) {\n return { aborted: true, reason: error }\n }\n }\n\n return 'ok'\n}\n\nasync function handleFiles(files: File[], source: FileValidatorSource = 'input') {\n if (props.disabled) return\n if (!files.length) return\n\n const normalizedLimit = normalizeLimit(props.limit)\n if (props.multiple && normalizedLimit && files.length > normalizedLimit) {\n props.onExceed?.(files, normalizedLimit)\n emit('error', new Error(`Too many files selected, limit=${normalizedLimit}`))\n return\n }\n\n const { files: valid, issues } = await runFileValidators(files, props.validators ?? [], {\n source,\n multiple: props.multiple,\n })\n\n if (issues.length > 0) {\n emit('error', new FileValidationError(issues, valid))\n return\n }\n\n if (!valid.length) return\n\n lastFiles.value = valid\n\n const before = await runBeforeUpload(valid)\n if (before !== 'ok') {\n emit('error', before.reason)\n return\n }\n\n let extraData: GrFileUploadExtraData | undefined\n try {\n extraData = props.uploadExtraData?.(valid)\n } catch (error) {\n emit('error', error)\n return\n }\n\n abort()\n clearHideSuccessTimer()\n\n const controller = new AbortController()\n activeController = controller\n\n setStateUploading()\n emit('progress', 0, { percent: 0, loaded: 0, total: 0, indeterminate: true })\n\n try {\n const payload = props.request\n ? await props.request(valid, { signal: controller.signal, extraData, onProgress: handleProgress })\n : await uploadViaAction(valid, controller.signal, extraData)\n\n const finalLoaded = state.phase === 'uploading' ? state.total || state.loaded : 0\n setStateSuccess({ loaded: finalLoaded, total: finalLoaded })\n emit('success', payload)\n emit('change', valid)\n emit('progress', 100, { percent: 100, loaded: finalLoaded, total: finalLoaded, indeterminate: false })\n\n if (props.hideProgressOnSuccess && props.hideProgressOnSuccess > 0) {\n hideSuccessTimer = setTimeout(() => {\n if (state.phase === 'success') setStateIdle()\n hideSuccessTimer = null\n }, props.hideProgressOnSuccess)\n }\n } catch (error) {\n if (error instanceof GrUploadAbortError) {\n setStateIdle()\n } else {\n setStateError(error)\n }\n emit('error', error)\n } finally {\n if (activeController === controller) activeController = null\n }\n}\n\nfunction onDragEnter(event: DragEvent) {\n if (hasCustomUi.value) return\n if (props.disabled) return\n event.preventDefault()\n overCounter += 1\n setOver(true)\n}\n\nfunction onDragOver(event: DragEvent) {\n if (hasCustomUi.value) return\n if (props.disabled) return\n event.preventDefault()\n if (event.dataTransfer) event.dataTransfer.dropEffect = 'copy'\n}\n\nfunction onDragLeave(event: DragEvent) {\n if (hasCustomUi.value) return\n if (props.disabled) return\n event.preventDefault()\n overCounter = Math.max(0, overCounter - 1)\n if (overCounter === 0) setOver(false)\n}\n\nfunction onDrop(event: DragEvent) {\n if (hasCustomUi.value) return\n if (props.disabled) return\n event.preventDefault()\n overCounter = 0\n setOver(false)\n\n const files = event.dataTransfer?.files ? Array.prototype.slice.call(event.dataTransfer.files) as File[] : []\n void handleFiles(files, 'drop')\n}\n\nasync function onInputChange(event: Event) {\n if (props.disabled) return\n\n const target = event.target as HTMLInputElement | null\n const files = target?.files ? Array.prototype.slice.call(target.files) as File[] : []\n\n if (target) target.value = ''\n\n await nextTick()\n await handleFiles(files, 'input')\n}\n\nfunction onKeydown(event: KeyboardEvent) {\n if (hasCustomUi.value) return\n if (props.disabled) return\n\n if (event.key === 'Enter' || event.key === ' ') {\n event.preventDefault()\n openDialog()\n }\n}\n\nfunction onRootClick() {\n if (hasCustomUi.value) return\n openDialog()\n}\n\nfunction onRootKeydown(event: KeyboardEvent) {\n if (hasCustomUi.value) return\n onKeydown(event)\n}\n\nconst effectiveProgressTone = computed<GrProgressBarTone>(() => {\n if (state.phase === 'error') return 'danger'\n if (state.phase === 'success') return 'success'\n return props.progressTone\n})\n\nconst progressVisible = computed(() => state.phase !== 'idle')\nconst progressPercent = computed(() => (state.phase === 'uploading' && state.indeterminate ? 0 : state.percent))\nconst progressText = computed(() => {\n if (state.phase === 'uploading' && state.indeterminate) return ''\n return `${Math.round(progressPercent.value)}%`\n})\n\ndefineExpose({\n uploadFiles: handleFiles,\n abort,\n openDialog,\n state,\n})\n</script>\n\n<template>\n <div\n data-ds-file-upload\n :role=\"hasCustomUi ? undefined : 'button'\"\n :tabindex=\"hasCustomUi ? undefined : tabIndex\"\n :aria-disabled=\"hasCustomUi ? undefined : disabled ? 'true' : 'false'\"\n :class=\"\n hasCustomUi\n ? 'inline-block'\n : [\n 'relative w-full rounded-[var(--ds-radius-lg)] border border-dashed border-[var(--brd)] bg-[var(--card)] px-5 py-6 outline-none transition',\n disabled\n ? 'opacity-60 cursor-not-allowed'\n : 'cursor-pointer hover:bg-[var(--muted)] focus-visible:ring-2 focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2 focus-visible:ring-offset-[var(--bg)]',\n isOver && !disabled ? 'border-[var(--ring)] bg-[var(--muted)]' : '',\n ]\n \"\n @click=\"onRootClick\"\n @keydown=\"onRootKeydown\"\n @dragenter=\"onDragEnter\"\n @dragover=\"onDragOver\"\n @dragleave=\"onDragLeave\"\n @drop=\"onDrop\"\n >\n <input\n ref=\"inputRef\"\n data-ds-file-upload-input\n :style=\"hiddenInputStyle\"\n type=\"file\"\n tabindex=\"-1\"\n aria-hidden=\"true\"\n :name=\"name\"\n :multiple=\"multiple\"\n :disabled=\"disabled\"\n @change=\"onInputChange\"\n >\n\n <slot\n v-if=\"hasCustomUi\"\n :open-dialog=\"openDialog\"\n :abort=\"abort\"\n :disabled=\"disabled\"\n :files=\"lastFiles\"\n :is-over=\"isOver\"\n :state=\"state\"\n />\n\n <div v-else class=\"flex items-start gap-4\">\n <div\n data-ds-file-upload-icon\n class=\"h-12 w-12 shrink-0 rounded-[12px] bg-[var(--muted)] border border-[var(--brd)] flex items-center justify-center\"\n aria-hidden=\"true\"\n >\n <GrIcon class=\"h-6 w-6 text-[var(--muted-fg)]\">\n <IconArrowUp />\n </GrIcon>\n </div>\n\n <div class=\"min-w-0\">\n <div data-ds-file-upload-label class=\"text-[14px] font-700\">\n <slot name=\"label\">\n <slot>\n {{ placeholder }}\n </slot>\n </slot>\n </div>\n\n <div v-if=\"$slots.tip\" data-ds-file-upload-tip class=\"mt-1 text-[13px] text-[var(--muted-fg)]\">\n <slot name=\"tip\" />\n </div>\n <div v-else class=\"mt-1 text-[13px] text-[var(--muted-fg)]\" />\n\n <ul v-if=\"showFileList && lastFiles.length\" data-ds-file-upload-list class=\"mt-3 space-y-1\">\n <li\n v-for=\"file in lastFiles\"\n :key=\"file.name\"\n data-ds-file-upload-item\n class=\"text-[13px]\"\n >\n <span class=\"font-600\">{{ file.name }}</span>\n <span class=\"text-[var(--muted-fg)]\"> · {{ Math.ceil(file.size / 1024) }} KB</span>\n </li>\n </ul>\n\n <slot\n v-if=\"showProgress || $slots.progress\"\n name=\"progress\"\n :state=\"state\"\n :percent=\"state.percent\"\n :indeterminate=\"state.phase === 'uploading' && state.indeterminate\"\n :phase=\"state.phase\"\n :files=\"lastFiles\"\n :abort=\"abort\"\n >\n <div\n v-if=\"showProgress\"\n data-ds-file-upload-progress\n class=\"mt-3 transition-opacity duration-150\"\n :class=\"progressVisible ? 'opacity-100' : 'opacity-0 pointer-events-none'\"\n :aria-hidden=\"!progressVisible\"\n >\n <div class=\"flex items-center gap-2\">\n <GrProgressBar\n :value=\"progressPercent\"\n :tone=\"effectiveProgressTone\"\n :aria-label=\"progressLabel\"\n />\n <span\n data-ds-file-upload-progress-text\n class=\"text-[12px] text-[var(--muted-fg)] tabular-nums min-w-[3ch] text-right\"\n >{{ progressText }}</span>\n </div>\n </div>\n </slot>\n </div>\n </div>\n </div>\n</template>","<script setup lang=\"ts\">\nimport { Comment, computed, Fragment, nextTick, reactive, ref, Text, useSlots, type VNode } from 'vue'\n\nimport IconArrowUp from '~icons/lucide/arrow-up'\n\nimport GrIcon from '../GrIcon/GrIcon.vue'\nimport GrProgressBar from '../GrProgressBar/GrProgressBar.vue'\nimport type { GrProgressBarTone } from '../GrProgressBar/grStyle'\nimport type { FileValidator, FileValidatorSource } from '../../fileValidation'\nimport type { GrUploadProgressInfo } from './uploadViaXhr'\nimport type { GrUploadState } from './uploadState'\n\nimport { FileValidationError, runFileValidators } from '../../fileValidation'\nimport { GrUploadAbortError, uploadViaXhr } from './uploadViaXhr'\nimport { GR_UPLOAD_STATE_IDLE } from './uploadState'\n\nexport type GrFileUploadExtraDataValue = string | Blob\n\nexport type GrFileUploadExtraData = Record<string, GrFileUploadExtraDataValue | GrFileUploadExtraDataValue[]>\n\nexport type GrFileUploadRequestCtx = {\n signal: AbortSignal\n extraData?: GrFileUploadExtraData\n /**\n * Колбэк прогресса аплоада. Пользовательский `request` (например, axios)\n * должен вызывать его из `onUploadProgress`, чтобы `GrFileUpload` отображал\n * прогресс через слот `progress` / дефолтный `GrProgressBar`.\n */\n onProgress?: (info: GrUploadProgressInfo) => void\n}\n\nexport type GrFileUploadRequest = (files: File[], ctx: GrFileUploadRequestCtx) => Promise<any>\n\n/**\n * Пропы `GrFileUpload`.\n *\n * Либо `action` (URL для POST multipart/form-data), либо `request` — кастомный\n * загрузчик (например, через axios). Если переданы оба — приоритет у `request`.\n *\n * `placeholder` — надпись в дефолтном UI-варианте (без слота default).\n */\nexport interface GrFileUploadProps {\n action?: string\n request?: GrFileUploadRequest\n name?: string\n multiple?: boolean\n limit?: number\n onExceed?: (files: File[], limit: number) => void\n beforeUpload?: (file: File) => boolean | Promise<unknown>\n validators?: FileValidator[]\n disabled?: boolean\n headers?: Record<string, string>\n withCredentials?: boolean\n showFileList?: boolean\n uploadExtraData?: (files: File[]) => GrFileUploadExtraData | undefined\n /** i18n: надпись-подсказка в дефолтном UI. */\n placeholder?: string\n /** Показывать дефолтный прогресс-бар (если не используется слот `progress`). */\n showProgress?: boolean\n /** Цветовой тон полосы прогресса в фазе `uploading`. */\n progressTone?: GrProgressBarTone\n /** aria-label для прогресс-бара. */\n progressLabel?: string\n /** Через сколько мс после `success` скрыть прогресс-бар. `0` — не скрывать. */\n hideProgressOnSuccess?: number\n}\n\nconst props = withDefaults(\n defineProps<GrFileUploadProps>(),\n {\n action: undefined,\n request: undefined,\n name: 'file',\n multiple: false,\n limit: undefined,\n onExceed: undefined,\n beforeUpload: undefined,\n validators: undefined,\n disabled: false,\n headers: undefined,\n withCredentials: false,\n showFileList: false,\n uploadExtraData: undefined,\n placeholder: 'Drag files here or click to select',\n showProgress: true,\n progressTone: 'primary',\n progressLabel: 'Upload progress',\n hideProgressOnSuccess: 800,\n },\n)\n\nconst emit = defineEmits<{\n (e: 'success', payload: any): void\n (e: 'error', error: unknown): void\n (e: 'progress', percent: number, info?: GrUploadProgressInfo): void\n (e: 'change', files: File[]): void\n (e: 'stateChange', state: GrUploadState): void\n}>()\n\nconst slots = useSlots()\n\nfunction flattenSlotNodes(nodes: VNode[]): VNode[] {\n const out: VNode[] = []\n\n for (const node of nodes) {\n if (node.type === Fragment && Array.isArray(node.children)) {\n out.push(...flattenSlotNodes(node.children as VNode[]))\n continue\n }\n\n out.push(node)\n }\n\n return out\n}\n\nfunction isWhitespaceTextNode(node: VNode): boolean {\n if (node.type !== Text) return false\n return typeof node.children === 'string' && node.children.trim().length === 0\n}\n\nfunction slotIsTextOnly(nodes: VNode[]): boolean {\n const flat = flattenSlotNodes(nodes)\n const meaningful = flat.filter(node => node.type !== Comment && !isWhitespaceTextNode(node))\n\n if (meaningful.length === 0) return true\n\n for (const node of meaningful) {\n if (node.type !== Text) return false\n }\n\n return true\n}\n\nconst defaultSlotNodes = computed(() => {\n return slots.default ? flattenSlotNodes(slots.default({} as any)) : []\n})\n\nconst hasCustomUi = computed(() => {\n return !!slots.default && !slotIsTextOnly(defaultSlotNodes.value)\n})\n\nconst inputRef = ref<HTMLInputElement | null>(null)\nconst isOver = ref(false)\nlet overCounter = 0\n\nconst lastFiles = ref<File[]>([])\n\nconst state = reactive<GrUploadState>({ ...GR_UPLOAD_STATE_IDLE }) as GrUploadState\n\nlet activeController: AbortController | null = null\nlet hideSuccessTimer: ReturnType<typeof setTimeout> | null = null\n\nfunction clearHideSuccessTimer() {\n if (hideSuccessTimer !== null) {\n clearTimeout(hideSuccessTimer)\n hideSuccessTimer = null\n }\n}\n\nfunction assignState(next: GrUploadState) {\n // мутируем через Object.assign, чтобы сохранить reactive ссылку\n for (const key of Object.keys(state) as (keyof GrUploadState)[])\n delete (state as any)[key]\n Object.assign(state, next)\n emit('stateChange', state as GrUploadState)\n}\n\nfunction setStateIdle() {\n assignState({ ...GR_UPLOAD_STATE_IDLE })\n}\n\nfunction setStateUploading(info?: GrUploadProgressInfo) {\n assignState({\n phase: 'uploading',\n percent: info?.percent ?? 0,\n indeterminate: info?.indeterminate ?? true,\n loaded: info?.loaded ?? 0,\n total: info?.total ?? 0,\n })\n}\n\nfunction setStateSuccess(info: { loaded: number, total: number }) {\n assignState({\n phase: 'success',\n percent: 100,\n indeterminate: false,\n loaded: info.loaded,\n total: info.total,\n })\n}\n\nfunction setStateError(error: unknown) {\n const prev = state\n assignState({\n phase: 'error',\n percent: prev.phase === 'uploading' ? prev.percent : 0,\n indeterminate: false,\n loaded: prev.phase === 'uploading' ? prev.loaded : 0,\n total: prev.phase === 'uploading' ? prev.total : 0,\n error,\n })\n}\n\nfunction handleProgress(info: GrUploadProgressInfo) {\n if (state.phase !== 'uploading') return\n assignState({\n phase: 'uploading',\n percent: info.percent,\n indeterminate: info.indeterminate,\n loaded: info.loaded,\n total: info.total,\n })\n emit('progress', info.percent, info)\n}\n\nconst tabIndex = computed(() => (props.disabled ? -1 : 0))\n\nconst hiddenInputStyle = {\n position: 'fixed',\n top: '-9999px',\n left: '-9999px',\n width: '1px',\n height: '1px',\n opacity: '0',\n overflow: 'hidden',\n pointerEvents: 'none',\n} as const satisfies Record<string, string>\n\nfunction setOver(next: boolean) {\n if (isOver.value === next) return\n isOver.value = next\n}\n\nfunction openDialog() {\n if (props.disabled) return\n inputRef.value?.click()\n}\n\nfunction abort() {\n activeController?.abort()\n activeController = null\n}\n\nfunction normalizeLimit(limit: number | undefined): number | undefined {\n if (typeof limit !== 'number') return undefined\n if (!Number.isFinite(limit)) return undefined\n if (limit <= 0) return undefined\n return Math.floor(limit)\n}\n\n\nasync function uploadViaAction(files: File[], signal: AbortSignal, extraData: GrFileUploadExtraData | undefined) {\n if (!props.action) throw new Error('GrFileUpload: either `action` or `request` must be provided')\n\n return uploadViaXhr({\n url: props.action,\n files,\n name: props.name,\n headers: props.headers,\n withCredentials: props.withCredentials,\n extraData,\n signal,\n onProgress: handleProgress,\n })\n}\n\nasync function runBeforeUpload(files: File[]): Promise<'ok' | { aborted: true; reason: unknown }> {\n if (!props.beforeUpload) return 'ok'\n\n for (const file of files) {\n try {\n const result = props.beforeUpload(file)\n\n if (result === false) {\n return { aborted: true, reason: new Error('Upload aborted by beforeUpload') }\n }\n\n if (result && typeof (result as any).then === 'function')\n await result\n } catch (error) {\n return { aborted: true, reason: error }\n }\n }\n\n return 'ok'\n}\n\nasync function handleFiles(files: File[], source: FileValidatorSource = 'input') {\n if (props.disabled) return\n if (!files.length) return\n\n const normalizedLimit = normalizeLimit(props.limit)\n if (props.multiple && normalizedLimit && files.length > normalizedLimit) {\n props.onExceed?.(files, normalizedLimit)\n emit('error', new Error(`Too many files selected, limit=${normalizedLimit}`))\n return\n }\n\n const { files: valid, issues } = await runFileValidators(files, props.validators ?? [], {\n source,\n multiple: props.multiple,\n })\n\n if (issues.length > 0) {\n emit('error', new FileValidationError(issues, valid))\n return\n }\n\n if (!valid.length) return\n\n lastFiles.value = valid\n\n const before = await runBeforeUpload(valid)\n if (before !== 'ok') {\n emit('error', before.reason)\n return\n }\n\n let extraData: GrFileUploadExtraData | undefined\n try {\n extraData = props.uploadExtraData?.(valid)\n } catch (error) {\n emit('error', error)\n return\n }\n\n abort()\n clearHideSuccessTimer()\n\n const controller = new AbortController()\n activeController = controller\n\n setStateUploading()\n emit('progress', 0, { percent: 0, loaded: 0, total: 0, indeterminate: true })\n\n try {\n const payload = props.request\n ? await props.request(valid, { signal: controller.signal, extraData, onProgress: handleProgress })\n : await uploadViaAction(valid, controller.signal, extraData)\n\n const finalLoaded = state.phase === 'uploading' ? state.total || state.loaded : 0\n setStateSuccess({ loaded: finalLoaded, total: finalLoaded })\n emit('success', payload)\n emit('change', valid)\n emit('progress', 100, { percent: 100, loaded: finalLoaded, total: finalLoaded, indeterminate: false })\n\n if (props.hideProgressOnSuccess && props.hideProgressOnSuccess > 0) {\n hideSuccessTimer = setTimeout(() => {\n if (state.phase === 'success') setStateIdle()\n hideSuccessTimer = null\n }, props.hideProgressOnSuccess)\n }\n } catch (error) {\n if (error instanceof GrUploadAbortError) {\n setStateIdle()\n } else {\n setStateError(error)\n }\n emit('error', error)\n } finally {\n if (activeController === controller) activeController = null\n }\n}\n\nfunction onDragEnter(event: DragEvent) {\n if (hasCustomUi.value) return\n if (props.disabled) return\n event.preventDefault()\n overCounter += 1\n setOver(true)\n}\n\nfunction onDragOver(event: DragEvent) {\n if (hasCustomUi.value) return\n if (props.disabled) return\n event.preventDefault()\n if (event.dataTransfer) event.dataTransfer.dropEffect = 'copy'\n}\n\nfunction onDragLeave(event: DragEvent) {\n if (hasCustomUi.value) return\n if (props.disabled) return\n event.preventDefault()\n overCounter = Math.max(0, overCounter - 1)\n if (overCounter === 0) setOver(false)\n}\n\nfunction onDrop(event: DragEvent) {\n if (hasCustomUi.value) return\n if (props.disabled) return\n event.preventDefault()\n overCounter = 0\n setOver(false)\n\n const files = event.dataTransfer?.files ? Array.prototype.slice.call(event.dataTransfer.files) as File[] : []\n void handleFiles(files, 'drop')\n}\n\nasync function onInputChange(event: Event) {\n if (props.disabled) return\n\n const target = event.target as HTMLInputElement | null\n const files = target?.files ? Array.prototype.slice.call(target.files) as File[] : []\n\n if (target) target.value = ''\n\n await nextTick()\n await handleFiles(files, 'input')\n}\n\nfunction onKeydown(event: KeyboardEvent) {\n if (hasCustomUi.value) return\n if (props.disabled) return\n\n if (event.key === 'Enter' || event.key === ' ') {\n event.preventDefault()\n openDialog()\n }\n}\n\nfunction onRootClick() {\n if (hasCustomUi.value) return\n openDialog()\n}\n\nfunction onRootKeydown(event: KeyboardEvent) {\n if (hasCustomUi.value) return\n onKeydown(event)\n}\n\nconst effectiveProgressTone = computed<GrProgressBarTone>(() => {\n if (state.phase === 'error') return 'danger'\n if (state.phase === 'success') return 'success'\n return props.progressTone\n})\n\nconst progressVisible = computed(() => state.phase !== 'idle')\nconst progressPercent = computed(() => (state.phase === 'uploading' && state.indeterminate ? 0 : state.percent))\nconst progressText = computed(() => {\n if (state.phase === 'uploading' && state.indeterminate) return ''\n return `${Math.round(progressPercent.value)}%`\n})\n\ndefineExpose({\n uploadFiles: handleFiles,\n abort,\n openDialog,\n state,\n})\n</script>\n\n<template>\n <div\n data-ds-file-upload\n :role=\"hasCustomUi ? undefined : 'button'\"\n :tabindex=\"hasCustomUi ? undefined : tabIndex\"\n :aria-disabled=\"hasCustomUi ? undefined : disabled ? 'true' : 'false'\"\n :class=\"\n hasCustomUi\n ? 'inline-block'\n : [\n 'relative w-full rounded-[var(--ds-radius-lg)] border border-dashed border-[var(--brd)] bg-[var(--card)] px-5 py-6 outline-none transition',\n disabled\n ? 'opacity-60 cursor-not-allowed'\n : 'cursor-pointer hover:bg-[var(--muted)] focus-visible:ring-2 focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2 focus-visible:ring-offset-[var(--bg)]',\n isOver && !disabled ? 'border-[var(--ring)] bg-[var(--muted)]' : '',\n ]\n \"\n @click=\"onRootClick\"\n @keydown=\"onRootKeydown\"\n @dragenter=\"onDragEnter\"\n @dragover=\"onDragOver\"\n @dragleave=\"onDragLeave\"\n @drop=\"onDrop\"\n >\n <input\n ref=\"inputRef\"\n data-ds-file-upload-input\n :style=\"hiddenInputStyle\"\n type=\"file\"\n tabindex=\"-1\"\n aria-hidden=\"true\"\n :name=\"name\"\n :multiple=\"multiple\"\n :disabled=\"disabled\"\n @change=\"onInputChange\"\n >\n\n <slot\n v-if=\"hasCustomUi\"\n :open-dialog=\"openDialog\"\n :abort=\"abort\"\n :disabled=\"disabled\"\n :files=\"lastFiles\"\n :is-over=\"isOver\"\n :state=\"state\"\n />\n\n <div v-else class=\"flex items-start gap-4\">\n <div\n data-ds-file-upload-icon\n class=\"h-12 w-12 shrink-0 rounded-[12px] bg-[var(--muted)] border border-[var(--brd)] flex items-center justify-center\"\n aria-hidden=\"true\"\n >\n <GrIcon class=\"h-6 w-6 text-[var(--muted-fg)]\">\n <IconArrowUp />\n </GrIcon>\n </div>\n\n <div class=\"min-w-0\">\n <div data-ds-file-upload-label class=\"text-[14px] font-700\">\n <slot name=\"label\">\n <slot>\n {{ placeholder }}\n </slot>\n </slot>\n </div>\n\n <div v-if=\"$slots.tip\" data-ds-file-upload-tip class=\"mt-1 text-[13px] text-[var(--muted-fg)]\">\n <slot name=\"tip\" />\n </div>\n <div v-else class=\"mt-1 text-[13px] text-[var(--muted-fg)]\" />\n\n <ul v-if=\"showFileList && lastFiles.length\" data-ds-file-upload-list class=\"mt-3 space-y-1\">\n <li\n v-for=\"file in lastFiles\"\n :key=\"file.name\"\n data-ds-file-upload-item\n class=\"text-[13px]\"\n >\n <span class=\"font-600\">{{ file.name }}</span>\n <span class=\"text-[var(--muted-fg)]\"> · {{ Math.ceil(file.size / 1024) }} KB</span>\n </li>\n </ul>\n\n <slot\n v-if=\"showProgress || $slots.progress\"\n name=\"progress\"\n :state=\"state\"\n :percent=\"state.percent\"\n :indeterminate=\"state.phase === 'uploading' && state.indeterminate\"\n :phase=\"state.phase\"\n :files=\"lastFiles\"\n :abort=\"abort\"\n >\n <div\n v-if=\"showProgress\"\n data-ds-file-upload-progress\n class=\"mt-3 transition-opacity duration-150\"\n :class=\"progressVisible ? 'opacity-100' : 'opacity-0 pointer-events-none'\"\n :aria-hidden=\"!progressVisible\"\n >\n <div class=\"flex items-center gap-2\">\n <GrProgressBar\n :value=\"progressPercent\"\n :tone=\"effectiveProgressTone\"\n :aria-label=\"progressLabel\"\n />\n <span\n data-ds-file-upload-progress-text\n class=\"text-[12px] text-[var(--muted-fg)] tabular-nums min-w-[3ch] text-right\"\n >{{ progressText }}</span>\n </div>\n </div>\n </slot>\n </div>\n </div>\n </div>\n</template>"],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"GrFormFile-CIleXnfr.js","names":[],"sources":["../../../../src/components/GrFormFile/GrFormFile.vue","../../../../src/components/GrFormFile/GrFormFile.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, nextTick, ref, watch } from 'vue'\n\nimport IconUpload from '~icons/lucide/upload'\nimport IconX from '~icons/lucide/x'\n\nimport GrButton from '../GrButton/GrButton.vue'\nimport GrIcon from '../GrIcon/GrIcon.vue'\nimport { vDropzone } from '../../directives'\nimport { acceptValidator, FileValidationError, runFileValidators } from '../../fileValidation'\nimport type { FileValidationIssue, FileValidator } from '../../fileValidation'\n\ndefineOptions({\n name: 'GrFormFile',\n})\n\nexport type GrFormFileError = FileValidationIssue\n\n/**\n * Пропы `GrFormFile` — форма-поле для выбора файлов с встроенной валидацией,\n * drag&drop (через `v-dropzone`) и списком выбранных файлов.\n *\n * Все `*Text`/`placeholder` — i18n-friendly, принимают готовые строки локали.\n */\nexport interface GrFormFileProps {\n modelValue: File | File[] | null\n multiple?: boolean\n disabled?: boolean\n /** W3C `accept` для `<input type=\"file\">` + sugar к `acceptValidator(...)`. */\n accept?: string\n validators?: FileValidator[]\n uploadText?: string\n changeText?: string\n removeText?: string\n clearAllText?: string\n placeholder?: string\n /** Дополнительная (кастомная) валидация на стороне потребителя. */\n validate?: (files: File[]) => GrFormFileError[] | Promise<GrFormFileError[]>\n}\n\nconst props = withDefaults(\n defineProps<GrFormFileProps>(),\n {\n multiple: false,\n disabled: false,\n accept: undefined,\n uploadText: 'Upload file',\n changeText: 'Change file',\n removeText: 'Remove',\n clearAllText: 'Clear all',\n placeholder: 'No files selected',\n validators: undefined,\n validate: undefined,\n },\n)\n\nconst emit = defineEmits<{\n (e: 'update:modelValue', value: File | File[] | null): void\n (e: 'change', value: File | File[] | null): void\n (e: 'clear'): void\n (e: 'validation', errors: GrFormFileError[]): void\n (e: 'update:errors', errors: GrFormFileError[]): void\n}>()\n\nconst inputRef = ref<HTMLInputElement | null>(null)\nconst localErrors = ref<GrFormFileError[]>([])\n\nconst files = computed<File[]>(() => {\n if (props.multiple) {\n return Array.isArray(props.modelValue) ? props.modelValue : []\n }\n\n return props.modelValue instanceof File ? [props.modelValue] : []\n})\n\nconst hasFiles = computed(() => files.value.length > 0)\n\nfunction clearInputValue() {\n if (!inputRef.value) return\n inputRef.value.value = ''\n}\n\nfunction setErrors(next: GrFormFileError[]) {\n localErrors.value = next\n emit('validation', next)\n emit('update:errors', next)\n}\n\nfunction clearErrors() {\n if (localErrors.value.length === 0) return\n setErrors([])\n}\n\nfunction openDialog() {\n if (props.disabled) return\n inputRef.value?.click()\n}\n\nfunction emitModel(nextFiles: File[]) {\n const value: File | File[] | null = props.multiple\n ? nextFiles\n : (nextFiles[0] ?? null)\n\n emit('update:modelValue', value)\n emit('change', value)\n}\n\nasync function applyFiles(nextFiles: File[]) {\n const isPromiseLike = (value: unknown): value is PromiseLike<any> => {\n return !!value && typeof (value as any).then === 'function'\n }\n\n const customValidator: FileValidator | undefined = props.validate\n ? async ({ files }) => (await props.validate?.(files)) ?? []\n : undefined\n\n const validators: FileValidator[] = [\n acceptValidator(props.accept),\n ...(props.validators ?? []),\n ...(customValidator ? [customValidator] : []),\n ]\n\n const res = runFileValidators(nextFiles, validators, {\n source: 'input',\n multiple: props.multiple,\n })\n\n const { files: picked, issues } = isPromiseLike(res) ? await res : res\n\n if (issues.length > 0) {\n setErrors(issues)\n clearInputValue()\n await nextTick()\n return\n }\n\n clearErrors()\n emitModel(picked)\n clearInputValue()\n await nextTick()\n}\n\nasync function onInputChange(event: Event) {\n if (props.disabled) return\n\n const target = event.target as HTMLInputElement | null\n const nextFiles = target?.files ? Array.prototype.slice.call(target.files) as File[] : []\n\n // Reset value so selecting the same file twice triggers change.\n if (target) target.value = ''\n await nextTick()\n\n await applyFiles(nextFiles)\n}\n\nfunction clearAll() {\n if (props.disabled) return\n clearErrors()\n clearInputValue()\n emit('clear')\n\n emit('update:modelValue', props.multiple ? [] : null)\n emit('change', props.multiple ? [] : null)\n}\n\nfunction removeAt(index: number) {\n if (props.disabled) return\n if (!props.multiple) {\n clearAll()\n return\n }\n\n const next = files.value.slice()\n next.splice(index, 1)\n\n emit('update:modelValue', next)\n emit('change', next)\n}\n\nfunction issueMessage(issue: GrFormFileError): string {\n if (issue.fileName) return `${issue.fileName}: ${issue.message}`\n return issue.message\n}\n\nconst dropzone = computed(() => {\n const customValidator: FileValidator | undefined = props.validate\n ? async ({ files }) => (await props.validate?.(files)) ?? []\n : undefined\n\n const validators: FileValidator[] = [\n acceptValidator(props.accept),\n ...(props.validators ?? []),\n ...(customValidator ? [customValidator] : []),\n ]\n\n return {\n enabled: !props.disabled,\n multiple: props.multiple,\n validators,\n onFiles: async (dropped: File[]) => {\n // `v-dropzone` уже выполнил валидаторы и нормализацию по `multiple`.\n clearErrors()\n emitModel(dropped)\n clearInputValue()\n await nextTick()\n },\n onError: (error: unknown) => {\n if (error instanceof FileValidationError) {\n setErrors(error.issues)\n }\n else {\n setErrors([\n {\n code: 'accept',\n message: 'Failed to validate dropped files',\n },\n ])\n }\n },\n }\n})\n\nwatch(\n () => props.modelValue,\n (value) => {\n if (!inputRef.value) return\n\n if (!value || (Array.isArray(value) && value.length === 0)) {\n // Позволяет выбрать тот же файл снова после внешнего сброса.\n inputRef.value.value = ''\n }\n },\n)\n</script>\n\n<template>\n <div\n v-dropzone=\"dropzone\"\n data-ds-form-file\n class=\"rounded-[var(--ds-radius-md)]\"\n :class=\"disabled ? 'opacity-60 cursor-not-allowed' : ''\"\n >\n <input\n ref=\"inputRef\"\n data-ds-form-file-input\n type=\"file\"\n tabindex=\"-1\"\n aria-hidden=\"true\"\n class=\"absolute opacity-0 w-px h-px pointer-events-none\"\n :multiple=\"multiple\"\n :accept=\"accept\"\n :disabled=\"disabled\"\n @change=\"onInputChange\"\n >\n\n <div class=\"flex flex-col gap-2\">\n <div class=\"flex flex-wrap items-center gap-3\">\n <GrButton\n variant=\"secondary\"\n size=\"sm\"\n data-ds-form-file-upload-btn\n :disabled=\"disabled\"\n @click.prevent=\"openDialog\"\n >\n <GrIcon size=\"sm\" aria-hidden=\"true\">\n <IconUpload />\n </GrIcon>\n <span class=\"ml-2\">{{ hasFiles ? changeText : uploadText }}</span>\n </GrButton>\n\n <GrButton\n v-if=\"hasFiles && !multiple\"\n variant=\"secondary\"\n size=\"sm\"\n data-ds-form-file-clear-btn\n :disabled=\"disabled\"\n @click.prevent=\"clearAll\"\n >\n <GrIcon size=\"sm\" aria-hidden=\"true\">\n <IconX />\n </GrIcon>\n <span class=\"ml-2\">{{ removeText }}</span>\n </GrButton>\n\n <GrButton\n v-if=\"multiple && hasFiles\"\n variant=\"secondary\"\n size=\"sm\"\n data-ds-form-file-clear-all-btn\n :disabled=\"disabled\"\n @click.prevent=\"clearAll\"\n >\n <GrIcon size=\"sm\" aria-hidden=\"true\">\n <IconX />\n </GrIcon>\n <span class=\"ml-2\">{{ clearAllText }}</span>\n </GrButton>\n\n <span\n v-if=\"!multiple && hasFiles\"\n class=\"text-sm text-[var(--muted-fg)] truncate max-w-[240px]\"\n data-ds-form-file-single-name\n :title=\"files[0]?.name\"\n >\n {{ files[0]?.name }}\n </span>\n\n <span\n v-if=\"!hasFiles\"\n class=\"text-sm text-[var(--muted-fg)]\"\n data-ds-form-file-placeholder\n >\n {{ placeholder }}\n </span>\n </div>\n\n <div v-if=\"multiple && hasFiles\" class=\"flex flex-col gap-2\">\n <div\n v-for=\"(file, index) in files\"\n :key=\"`${file.name}-${file.size}-${index}`\"\n class=\"flex items-center gap-2\"\n data-ds-form-file-item\n >\n <span\n class=\"text-sm text-[var(--muted-fg)] truncate max-w-[240px]\"\n :title=\"file.name\"\n data-ds-form-file-item-name\n >\n {{ file.name }}\n </span>\n\n <button\n type=\"button\"\n class=\"text-xs text-[var(--muted-fg)] hover:text-[var(--fg)]\"\n data-ds-form-file-item-remove\n :disabled=\"disabled\"\n @click.prevent=\"removeAt(index)\"\n >\n {{ removeText }}\n </button>\n </div>\n </div>\n\n <slot name=\"errors\" :errors=\"localErrors\">\n <div v-if=\"localErrors.length\" class=\"text-sm text-[var(--ds-danger)]\" data-ds-form-file-errors>\n <div v-for=\"(e, i) in localErrors\" :key=\"i\" data-ds-form-file-error>\n {{ issueMessage(e) }}\n </div>\n </div>\n </slot>\n </div>\n </div>\n</template>\n\n<style scoped>\n[data-ds-form-file].ds-dropzone--over {\n outline: 2px solid var(--ring);\n outline-offset: 2px;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed, nextTick, ref, watch } from 'vue'\n\nimport IconUpload from '~icons/lucide/upload'\nimport IconX from '~icons/lucide/x'\n\nimport GrButton from '../GrButton/GrButton.vue'\nimport GrIcon from '../GrIcon/GrIcon.vue'\nimport { vDropzone } from '../../directives'\nimport { acceptValidator, FileValidationError, runFileValidators } from '../../fileValidation'\nimport type { FileValidationIssue, FileValidator } from '../../fileValidation'\n\ndefineOptions({\n name: 'GrFormFile',\n})\n\nexport type GrFormFileError = FileValidationIssue\n\n/**\n * Пропы `GrFormFile` — форма-поле для выбора файлов с встроенной валидацией,\n * drag&drop (через `v-dropzone`) и списком выбранных файлов.\n *\n * Все `*Text`/`placeholder` — i18n-friendly, принимают готовые строки локали.\n */\nexport interface GrFormFileProps {\n modelValue: File | File[] | null\n multiple?: boolean\n disabled?: boolean\n /** W3C `accept` для `<input type=\"file\">` + sugar к `acceptValidator(...)`. */\n accept?: string\n validators?: FileValidator[]\n uploadText?: string\n changeText?: string\n removeText?: string\n clearAllText?: string\n placeholder?: string\n /** Дополнительная (кастомная) валидация на стороне потребителя. */\n validate?: (files: File[]) => GrFormFileError[] | Promise<GrFormFileError[]>\n}\n\nconst props = withDefaults(\n defineProps<GrFormFileProps>(),\n {\n multiple: false,\n disabled: false,\n accept: undefined,\n uploadText: 'Upload file',\n changeText: 'Change file',\n removeText: 'Remove',\n clearAllText: 'Clear all',\n placeholder: 'No files selected',\n validators: undefined,\n validate: undefined,\n },\n)\n\nconst emit = defineEmits<{\n (e: 'update:modelValue', value: File | File[] | null): void\n (e: 'change', value: File | File[] | null): void\n (e: 'clear'): void\n (e: 'validation', errors: GrFormFileError[]): void\n (e: 'update:errors', errors: GrFormFileError[]): void\n}>()\n\nconst inputRef = ref<HTMLInputElement | null>(null)\nconst localErrors = ref<GrFormFileError[]>([])\n\nconst files = computed<File[]>(() => {\n if (props.multiple) {\n return Array.isArray(props.modelValue) ? props.modelValue : []\n }\n\n return props.modelValue instanceof File ? [props.modelValue] : []\n})\n\nconst hasFiles = computed(() => files.value.length > 0)\n\nfunction clearInputValue() {\n if (!inputRef.value) return\n inputRef.value.value = ''\n}\n\nfunction setErrors(next: GrFormFileError[]) {\n localErrors.value = next\n emit('validation', next)\n emit('update:errors', next)\n}\n\nfunction clearErrors() {\n if (localErrors.value.length === 0) return\n setErrors([])\n}\n\nfunction openDialog() {\n if (props.disabled) return\n inputRef.value?.click()\n}\n\nfunction emitModel(nextFiles: File[]) {\n const value: File | File[] | null = props.multiple\n ? nextFiles\n : (nextFiles[0] ?? null)\n\n emit('update:modelValue', value)\n emit('change', value)\n}\n\nasync function applyFiles(nextFiles: File[]) {\n const isPromiseLike = (value: unknown): value is PromiseLike<any> => {\n return !!value && typeof (value as any).then === 'function'\n }\n\n const customValidator: FileValidator | undefined = props.validate\n ? async ({ files }) => (await props.validate?.(files)) ?? []\n : undefined\n\n const validators: FileValidator[] = [\n acceptValidator(props.accept),\n ...(props.validators ?? []),\n ...(customValidator ? [customValidator] : []),\n ]\n\n const res = runFileValidators(nextFiles, validators, {\n source: 'input',\n multiple: props.multiple,\n })\n\n const { files: picked, issues } = isPromiseLike(res) ? await res : res\n\n if (issues.length > 0) {\n setErrors(issues)\n clearInputValue()\n await nextTick()\n return\n }\n\n clearErrors()\n emitModel(picked)\n clearInputValue()\n await nextTick()\n}\n\nasync function onInputChange(event: Event) {\n if (props.disabled) return\n\n const target = event.target as HTMLInputElement | null\n const nextFiles = target?.files ? Array.prototype.slice.call(target.files) as File[] : []\n\n // Reset value so selecting the same file twice triggers change.\n if (target) target.value = ''\n await nextTick()\n\n await applyFiles(nextFiles)\n}\n\nfunction clearAll() {\n if (props.disabled) return\n clearErrors()\n clearInputValue()\n emit('clear')\n\n emit('update:modelValue', props.multiple ? [] : null)\n emit('change', props.multiple ? [] : null)\n}\n\nfunction removeAt(index: number) {\n if (props.disabled) return\n if (!props.multiple) {\n clearAll()\n return\n }\n\n const next = files.value.slice()\n next.splice(index, 1)\n\n emit('update:modelValue', next)\n emit('change', next)\n}\n\nfunction issueMessage(issue: GrFormFileError): string {\n if (issue.fileName) return `${issue.fileName}: ${issue.message}`\n return issue.message\n}\n\nconst dropzone = computed(() => {\n const customValidator: FileValidator | undefined = props.validate\n ? async ({ files }) => (await props.validate?.(files)) ?? []\n : undefined\n\n const validators: FileValidator[] = [\n acceptValidator(props.accept),\n ...(props.validators ?? []),\n ...(customValidator ? [customValidator] : []),\n ]\n\n return {\n enabled: !props.disabled,\n multiple: props.multiple,\n validators,\n onFiles: async (dropped: File[]) => {\n // `v-dropzone` уже выполнил валидаторы и нормализацию по `multiple`.\n clearErrors()\n emitModel(dropped)\n clearInputValue()\n await nextTick()\n },\n onError: (error: unknown) => {\n if (error instanceof FileValidationError) {\n setErrors(error.issues)\n }\n else {\n setErrors([\n {\n code: 'accept',\n message: 'Failed to validate dropped files',\n },\n ])\n }\n },\n }\n})\n\nwatch(\n () => props.modelValue,\n (value) => {\n if (!inputRef.value) return\n\n if (!value || (Array.isArray(value) && value.length === 0)) {\n // Позволяет выбрать тот же файл снова после внешнего сброса.\n inputRef.value.value = ''\n }\n },\n)\n</script>\n\n<template>\n <div\n v-dropzone=\"dropzone\"\n data-ds-form-file\n class=\"rounded-[var(--ds-radius-md)]\"\n :class=\"disabled ? 'opacity-60 cursor-not-allowed' : ''\"\n >\n <input\n ref=\"inputRef\"\n data-ds-form-file-input\n type=\"file\"\n tabindex=\"-1\"\n aria-hidden=\"true\"\n class=\"absolute opacity-0 w-px h-px pointer-events-none\"\n :multiple=\"multiple\"\n :accept=\"accept\"\n :disabled=\"disabled\"\n @change=\"onInputChange\"\n >\n\n <div class=\"flex flex-col gap-2\">\n <div class=\"flex flex-wrap items-center gap-3\">\n <GrButton\n variant=\"secondary\"\n size=\"sm\"\n data-ds-form-file-upload-btn\n :disabled=\"disabled\"\n @click.prevent=\"openDialog\"\n >\n <GrIcon size=\"sm\" aria-hidden=\"true\">\n <IconUpload />\n </GrIcon>\n <span class=\"ml-2\">{{ hasFiles ? changeText : uploadText }}</span>\n </GrButton>\n\n <GrButton\n v-if=\"hasFiles && !multiple\"\n variant=\"secondary\"\n size=\"sm\"\n data-ds-form-file-clear-btn\n :disabled=\"disabled\"\n @click.prevent=\"clearAll\"\n >\n <GrIcon size=\"sm\" aria-hidden=\"true\">\n <IconX />\n </GrIcon>\n <span class=\"ml-2\">{{ removeText }}</span>\n </GrButton>\n\n <GrButton\n v-if=\"multiple && hasFiles\"\n variant=\"secondary\"\n size=\"sm\"\n data-ds-form-file-clear-all-btn\n :disabled=\"disabled\"\n @click.prevent=\"clearAll\"\n >\n <GrIcon size=\"sm\" aria-hidden=\"true\">\n <IconX />\n </GrIcon>\n <span class=\"ml-2\">{{ clearAllText }}</span>\n </GrButton>\n\n <span\n v-if=\"!multiple && hasFiles\"\n class=\"text-sm text-[var(--muted-fg)] truncate max-w-[240px]\"\n data-ds-form-file-single-name\n :title=\"files[0]?.name\"\n >\n {{ files[0]?.name }}\n </span>\n\n <span\n v-if=\"!hasFiles\"\n class=\"text-sm text-[var(--muted-fg)]\"\n data-ds-form-file-placeholder\n >\n {{ placeholder }}\n </span>\n </div>\n\n <div v-if=\"multiple && hasFiles\" class=\"flex flex-col gap-2\">\n <div\n v-for=\"(file, index) in files\"\n :key=\"`${file.name}-${file.size}-${index}`\"\n class=\"flex items-center gap-2\"\n data-ds-form-file-item\n >\n <span\n class=\"text-sm text-[var(--muted-fg)] truncate max-w-[240px]\"\n :title=\"file.name\"\n data-ds-form-file-item-name\n >\n {{ file.name }}\n </span>\n\n <button\n type=\"button\"\n class=\"text-xs text-[var(--muted-fg)] hover:text-[var(--fg)]\"\n data-ds-form-file-item-remove\n :disabled=\"disabled\"\n @click.prevent=\"removeAt(index)\"\n >\n {{ removeText }}\n </button>\n </div>\n </div>\n\n <slot name=\"errors\" :errors=\"localErrors\">\n <div v-if=\"localErrors.length\" class=\"text-sm text-[var(--ds-danger)]\" data-ds-form-file-errors>\n <div v-for=\"(e, i) in localErrors\" :key=\"i\" data-ds-form-file-error>\n {{ issueMessage(e) }}\n </div>\n </div>\n </slot>\n </div>\n </div>\n</template>\n\n<style scoped>\n[data-ds-form-file].ds-dropzone--over {\n outline: 2px solid var(--ring);\n outline-offset: 2px;\n}\n</style>\n"],"mappings":"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"}
|