@ryuzaki13/react-foundation-ui 1.2.4 → 1.2.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/chunks/radio-group-B9XjkcOy.js.map +1 -1
- package/dist/styles.css +1 -1
- package/dist/toggle/index.js.map +1 -1
- package/package.json +3 -3
- package/storybook-static/assets/{Badge-DX6C5wIH.js → Badge-BF_YR6xV.js} +1 -1
- package/storybook-static/assets/{Badge.stories-DKS6pQ3F.js → Badge.stories-BFSvBuGf.js} +1 -1
- package/storybook-static/assets/{Button-C3IcMeDr.js → Button-DI6wOTM7.js} +1 -1
- package/storybook-static/assets/{Button-Cq-0O5AX.js → Button-DYvP70oK.js} +1 -1
- package/storybook-static/assets/{Button.stories-Dnk-AqKG.js → Button.stories-BiQzoIrP.js} +1 -1
- package/storybook-static/assets/{CheckBox-WX9G5shZ.js → CheckBox-CS0rOTN7.js} +1 -1
- package/storybook-static/assets/{CheckBox-9wKIsKLs.js → CheckBox-CfKXKU4v.js} +1 -1
- package/storybook-static/assets/{CheckBox.stories-B_WVZ3FH.js → CheckBox.stories-C8SMoVuj.js} +1 -1
- package/storybook-static/assets/{Color-KMSTOMOX-D0ZzsTOt.js → Color-KMSTOMOX-C5d1F69R.js} +1 -1
- package/storybook-static/assets/{ContextMenu-DPHtCk5_.js → ContextMenu-BWOMwM1T.js} +1 -1
- package/storybook-static/assets/{ContextMenu.stories-4jt_t_Nl.js → ContextMenu.stories-CA00sUQt.js} +1 -1
- package/storybook-static/assets/{DateInput-YkKQmdSl.js → DateInput-BKr2L_zl.js} +1 -1
- package/storybook-static/assets/{DateInput-CEKedMdt.js → DateInput-BbkCHe27.js} +1 -1
- package/storybook-static/assets/{DateInput.stories-DXC5RYWE.js → DateInput.stories-CJGnhCiR.js} +1 -1
- package/storybook-static/assets/{DateRangePresetSelect-BG8l1ot-.js → DateRangePresetSelect-5OVfqIc_.js} +1 -1
- package/storybook-static/assets/{DateRangePresetSelect-BEaE-RDF.js → DateRangePresetSelect-BH9oi-dO.js} +1 -1
- package/storybook-static/assets/{DateRangePresetSelect.stories-B8Jnw_oB.js → DateRangePresetSelect.stories-C2f4Itxx.js} +1 -1
- package/storybook-static/assets/{Detail-Bdra8msx.js → Detail-DNjE_8Oj.js} +1 -1
- package/storybook-static/assets/{Detail.stories-BBKWN5vf.js → Detail.stories-IufkpH_4.js} +1 -1
- package/storybook-static/assets/{Dialog-CAn7ZeM6.js → Dialog-0w_W0UBz.js} +1 -1
- package/storybook-static/assets/{Dialog.stories-C7yXl0vm.js → Dialog.stories-_67SGh82.js} +1 -1
- package/storybook-static/assets/{Disclosure-Eu2rDIAf.js → Disclosure--JVKZyWJ.js} +1 -1
- package/storybook-static/assets/{Disclosure.stories-BpChqwKh.js → Disclosure.stories-Th8T0PUj.js} +1 -1
- package/storybook-static/assets/{DocsRenderer-JROSPFPF-tqfMgz4r.js → DocsRenderer-JROSPFPF-DLwDf2Zo.js} +2 -2
- package/storybook-static/assets/{DropZone-p9zzTvft.js → DropZone-BzPiDQeZ.js} +1 -1
- package/storybook-static/assets/{DropZone.stories-FbN3vCPf.js → DropZone.stories-Bu49NSVJ.js} +1 -1
- package/storybook-static/assets/{DropdownMenu-BzjvjLiZ.js → DropdownMenu-Bcrg1qHr.js} +1 -1
- package/storybook-static/assets/{ExpandableActionPanel.stories-CR0rSTsQ.js → ExpandableActionPanel.stories-RVXBbnyj.js} +1 -1
- package/storybook-static/assets/{Flex-C_MbUg6r.js → Flex-CXJVQ7iV.js} +1 -1
- package/storybook-static/assets/{Flex-qwafjx5A.js → Flex-GGgh6HSs.js} +1 -1
- package/storybook-static/assets/{Flex.stories-DTITKUsy.js → Flex.stories-D_fFJrsW.js} +1 -1
- package/storybook-static/assets/{Grid-XYanU6j8.js → Grid-C4-fxCy0.js} +1 -1
- package/storybook-static/assets/{Grid-Cn6IWZjD.js → Grid-vh3IGIQd.js} +1 -1
- package/storybook-static/assets/{Grid.stories-h85HB0JO.js → Grid.stories--x7HLm1q.js} +1 -1
- package/storybook-static/assets/{ImageCropper.stories-cLELnD1n.js → ImageCropper.stories-C2u8bHWN.js} +1 -1
- package/storybook-static/assets/{ImageRenderer-m9oBMooQ.js → ImageRenderer-mEqm-Dqi.js} +1 -1
- package/storybook-static/assets/{ImageRenderer.stories-DXvZpXT4.js → ImageRenderer.stories-CYRDsS3Z.js} +1 -1
- package/storybook-static/assets/{ImageView.stories-lxaMcYnr.js → ImageView.stories-C0ykBKDk.js} +1 -1
- package/storybook-static/assets/{ImageViewer.stories-BAQyxyCK.js → ImageViewer.stories-BusMvSz_.js} +2 -2
- package/storybook-static/assets/{ImageViewerRuntime-DCktYUPZ.js → ImageViewerRuntime-ZP6H6hET.js} +1 -1
- package/storybook-static/assets/{Input-et9I5HT7.js → Input-C-oHXpFa.js} +1 -1
- package/storybook-static/assets/{Input-Cd-pwQ8Q.js → Input-VtBvr4ox.js} +1 -1
- package/storybook-static/assets/{Input.stories-CsjIFYFQ.js → Input.stories-DjNJP6jZ.js} +1 -1
- package/storybook-static/assets/{InputDateTime-C0p08o5v.js → InputDateTime-B4QhXUqG.js} +1 -1
- package/storybook-static/assets/{InputDateTime.stories-Dis8pf5q.js → InputDateTime.stories-DQD1hY4X.js} +1 -1
- package/storybook-static/assets/{InputFile-bkAWfGTW.js → InputFile-D-_aZBxg.js} +1 -1
- package/storybook-static/assets/{InputFile.stories-BheC2aXW.js → InputFile.stories-CSC1SCs1.js} +1 -1
- package/storybook-static/assets/{InputFiles-CU_1Hcve.js → InputFiles-B9PdmFK9.js} +1 -1
- package/storybook-static/assets/{InputFiles-CwENM9DB.js → InputFiles-Ds1zu7US.js} +1 -1
- package/storybook-static/assets/{InputFiles.stories-CTcCgNgQ.js → InputFiles.stories-C-bGspU1.js} +1 -1
- package/storybook-static/assets/{InputImage-BMjVn69h.js → InputImage-khPwoIhV.js} +1 -1
- package/storybook-static/assets/{InputImage.stories-CaJbFp3K.js → InputImage.stories-CCa46Nzq.js} +1 -1
- package/storybook-static/assets/{LayoutPicker-Dk-EB9JY.js → LayoutPicker-BAAa_g3x.js} +1 -1
- package/storybook-static/assets/{LayoutPicker.stories-DXVhbrVk.js → LayoutPicker.stories-B1dO6RKC.js} +1 -1
- package/storybook-static/assets/{Listbox-zbVUMbxw.js → Listbox-C4HBbYNr.js} +1 -1
- package/storybook-static/assets/{Listbox.stories-CbGCR96t.js → Listbox.stories-BwJ6G_Mg.js} +1 -1
- package/storybook-static/assets/{Modal-hHrFT4TA.js → Modal-DXYu3gK_.js} +1 -1
- package/storybook-static/assets/{Modal.stories-BSsefS8U.js → Modal.stories-BfQSWo-S.js} +1 -1
- package/storybook-static/assets/{MultiSelect-BgQeVRdZ.js → MultiSelect-CEbf7bLL.js} +1 -1
- package/storybook-static/assets/{MultiSelect-NK9yi0YD.js → MultiSelect-ZiS4jg7j.js} +1 -1
- package/storybook-static/assets/{MultiSelect.stories-Dehifk12.js → MultiSelect.stories-OSUoI8LD.js} +1 -1
- package/storybook-static/assets/{NotificationsHost-D_unl67O.js → NotificationsHost-BxAkGSYp.js} +1 -1
- package/storybook-static/assets/{NotificationsHost.stories-BlgGC7M6.js → NotificationsHost.stories-DeTweOqX.js} +1 -1
- package/storybook-static/assets/{ODataMultiSelect-BzIPF3E7.js → ODataMultiSelect-C_BdWtjv.js} +1 -1
- package/storybook-static/assets/{ODataMultiSelect-C2zNSOWs.js → ODataMultiSelect-DOtG5b5p.js} +1 -1
- package/storybook-static/assets/{ODataMultiSelect.stories-DAMabeAm.js → ODataMultiSelect.stories-DZgOPx8i.js} +1 -1
- package/storybook-static/assets/{ODataSelect-DWg9_Z1y.js → ODataSelect-BK-HaXVe.js} +1 -1
- package/storybook-static/assets/{ODataSelect-xvjEKrUB.js → ODataSelect-CzsSdlmh.js} +1 -1
- package/storybook-static/assets/{ODataSelect.stories-BLVf1e2L.js → ODataSelect.stories-4fGnGP41.js} +1 -1
- package/storybook-static/assets/{ODataTreeMultiSelect-DTap26cR.js → ODataTreeMultiSelect-BBVM-8ki.js} +1 -1
- package/storybook-static/assets/{ODataTreeMultiSelect.stories--uSStNgG.js → ODataTreeMultiSelect.stories-CzufPwpi.js} +1 -1
- package/storybook-static/assets/{ODataTreeSelect-CAtfBcUy.js → ODataTreeSelect-DGwHzeKD.js} +1 -1
- package/storybook-static/assets/{ODataTreeSelect.stories-B-bZ8fzc.js → ODataTreeSelect.stories-jkE8YwLl.js} +1 -1
- package/storybook-static/assets/{PeriodSelect-ngRpDEN9.js → PeriodSelect-DIfJTfdB.js} +1 -1
- package/storybook-static/assets/{PeriodSelect.stories-CADogRfL.js → PeriodSelect.stories-BAMIsSGE.js} +1 -1
- package/storybook-static/assets/{Popover-DBXzHOrL.js → Popover-6znIdvNB.js} +1 -1
- package/storybook-static/assets/{Popover.stories-DO7aZodf.js → Popover.stories-AXvTs-mK.js} +1 -1
- package/storybook-static/assets/{PresetRangeDateInput-Cyvl5Y3I.js → PresetRangeDateInput-oSisVT1i.js} +1 -1
- package/storybook-static/assets/{PresetRangeDateInput.stories-B1u4ZhNP.js → PresetRangeDateInput.stories-CEu1DDCF.js} +1 -1
- package/storybook-static/assets/{RadioButton-y5_fz_XQ.js → RadioButton-BGlASGNa.js} +1 -1
- package/storybook-static/assets/{RadioButton.stories-Bh-tlBnM.js → RadioButton.stories-COLQdM1e.js} +1 -1
- package/storybook-static/assets/{RadioGroup-Dlnnjoe4.js → RadioGroup-C2AUzTxU.js} +1 -1
- package/storybook-static/assets/{RadioGroup-esbF3l7j.js → RadioGroup-Qfnk8dQO.js} +1 -1
- package/storybook-static/assets/{RadioGroup-D-J7t20C.css → RadioGroup-hi7uePOA.css} +1 -1
- package/storybook-static/assets/{RadioGroup.stories-BqEZhuaJ.js → RadioGroup.stories-C8ddz6t6.js} +1 -1
- package/storybook-static/assets/{Select-DcqW2_IZ.js → Select-BOgkP515.js} +1 -1
- package/storybook-static/assets/{Select-Bv3iWFP7.js → Select-CfXC3kDv.js} +1 -1
- package/storybook-static/assets/{Select.stories-B20NUqNY.js → Select.stories-ByNbkZdw.js} +1 -1
- package/storybook-static/assets/{SelectOptionContent-Ck2fNJ6o.js → SelectOptionContent-C3tgB8Dy.js} +1 -1
- package/storybook-static/assets/{SerializableSelect-BPeTjDSf.js → SerializableSelect-BuXvepIG.js} +1 -1
- package/storybook-static/assets/{SerializableSelect-ByGLukvF.js → SerializableSelect-C7WrrCz1.js} +1 -1
- package/storybook-static/assets/{SerializableSelect.stories-DOHXXYv0.js → SerializableSelect.stories-B1mK7D6g.js} +1 -1
- package/storybook-static/assets/{SingleDateTimeInput-CxscMHb1.js → SingleDateTimeInput-BkkBQM0V.js} +1 -1
- package/storybook-static/assets/{SingleDateTimeInput.stories-BZDY66wA.js → SingleDateTimeInput.stories-DCnQnNLe.js} +1 -1
- package/storybook-static/assets/{Slider-CZMdv796.js → Slider-Bi-_w_Lt.js} +1 -1
- package/storybook-static/assets/{Slider.stories-C36m1wEr.js → Slider.stories-BZJ1spgB.js} +1 -1
- package/storybook-static/assets/{SliderInput-SH9PdiMz.js → SliderInput-CCP08d7j.js} +1 -1
- package/storybook-static/assets/{SliderInput.stories-C3gjJOtX.js → SliderInput.stories-BIqyZKyF.js} +1 -1
- package/storybook-static/assets/{Sortable-CHwc20aw.js → Sortable-CrA3MIiN.js} +1 -1
- package/storybook-static/assets/{Sortable.stories-DK1SCHCV.js → Sortable.stories-CULILQbA.js} +1 -1
- package/storybook-static/assets/{Splitter-vVUO4o72.js → Splitter-Q7gof-78.js} +1 -1
- package/storybook-static/assets/{Splitter.stories-BKNoaEVD.js → Splitter.stories-DSkP_EnV.js} +1 -1
- package/storybook-static/assets/{StateSelect-CYaqvTz4.js → StateSelect-DClswKAK.js} +1 -1
- package/storybook-static/assets/{StateSelect.stories-BeyK6M2G.js → StateSelect.stories-CoUBhZeT.js} +1 -1
- package/storybook-static/assets/{Switch-DVLB16ST.js → Switch-D3d-7utL.js} +1 -1
- package/storybook-static/assets/{Switch.stories-Wxj_NIRj.js → Switch.stories-CBiv810D.js} +1 -1
- package/storybook-static/assets/{Table-BMqqA1xs.js → Table-BBWi4z9z.js} +1 -1
- package/storybook-static/assets/{Table.stories-BnN5fi21.js → Table.stories-DyksB7KO.js} +1 -1
- package/storybook-static/assets/{Tabs-Cn9BOXln.js → Tabs-BTI_vnhE.js} +1 -1
- package/storybook-static/assets/{Tabs.stories-C_1GlUPc.js → Tabs.stories-BtRnStqw.js} +1 -1
- package/storybook-static/assets/{TagInput.stories-Br7injkK.js → TagInput.stories-Bb__MtM6.js} +1 -1
- package/storybook-static/assets/{Textarea-BFUO_u8I.js → Textarea-B52Vh_xt.js} +1 -1
- package/storybook-static/assets/{Textarea.stories-BgdFfPrX.js → Textarea.stories-DvJ7sb9D.js} +1 -1
- package/storybook-static/assets/{TimePanel-Dnd8X0MX.js → TimePanel-B5xztB0K.js} +1 -1
- package/storybook-static/assets/{TimePanel.stories-InUnp5nr.js → TimePanel.stories-06TyPpQJ.js} +1 -1
- package/storybook-static/assets/Toggle-9G08CPe5.css +1 -0
- package/storybook-static/assets/{Toggle-DEobvqN8.js → Toggle-CkcafyNI.js} +1 -1
- package/storybook-static/assets/{Toggle.stories-1YiKv_RW.js → Toggle.stories-BTUFEVjs.js} +1 -1
- package/storybook-static/assets/{TreeMultiSelect-ho382vw4.js → TreeMultiSelect-CMrKE4N1.js} +1 -1
- package/storybook-static/assets/{TreeMultiSelect-DUVXqCtm.js → TreeMultiSelect-CoQ-vqxS.js} +1 -1
- package/storybook-static/assets/{TreeMultiSelect.stories-DwThJbBQ.js → TreeMultiSelect.stories-Dc1IZAee.js} +1 -1
- package/storybook-static/assets/{TreePickerBase-ConxEa4t.js → TreePickerBase-xKDnzQR_.js} +1 -1
- package/storybook-static/assets/{TreeSelect-NauPWhuH.js → TreeSelect-BLgkcb_I.js} +1 -1
- package/storybook-static/assets/{TreeSelect-CZJO9FTX.js → TreeSelect-Bd_WmDmc.js} +1 -1
- package/storybook-static/assets/{TreeSelect.stories-C9ACRAVn.js → TreeSelect.stories-N-FbNe6W.js} +1 -1
- package/storybook-static/assets/{TreeTable-BCkf-gqJ.js → TreeTable-dwNY6Pon.js} +1 -1
- package/storybook-static/assets/{TreeTable.stories-CXSRcXsE.js → TreeTable.stories-DCLa6mJm.js} +1 -1
- package/storybook-static/assets/{WithTooltip-7X4HQR7L-D0LOl3Mh.js → WithTooltip-7X4HQR7L-D2JhGs1w.js} +1 -1
- package/storybook-static/assets/{base-table-CgmLTIKK.js → base-table-BeZYmflf.js} +1 -1
- package/storybook-static/assets/{blocks-D9_wb7xA.js → blocks-D8vTJCXn.js} +6 -6
- package/storybook-static/assets/{button-gYHgDmlW.js → button-Cz3fiO2B.js} +1 -1
- package/storybook-static/assets/{check-box-C1ilRc9A.js → check-box-9iBlFoJu.js} +1 -1
- package/storybook-static/assets/{chunk-3LY4VQVK-DZA3RRO4.js → chunk-3LY4VQVK-CB9E5tjQ.js} +1 -1
- package/storybook-static/assets/{chunk-LITCR56V-BtlQu9MT.js → chunk-LITCR56V-DpYf_5IK.js} +1 -1
- package/storybook-static/assets/{contextMenu-BrcRBbks.js → contextMenu-BzZSIfMh.js} +1 -1
- package/storybook-static/assets/{error-BiKoqzNj.js → error-DI-le3_4.js} +1 -1
- package/storybook-static/assets/{flex-CdaT8HD1.js → flex-BriuFrFs.js} +1 -1
- package/storybook-static/assets/{floating-ui.react-xZFASsRU.js → floating-ui.react-CBVzHb-E.js} +1 -1
- package/storybook-static/assets/formatter-L2YTDE3Q-BQlCOI4x.js +1 -0
- package/storybook-static/assets/{formatters-BNCqERcz.js → formatters-DEfKcq5B.js} +2 -2
- package/storybook-static/assets/grid-Dtmb5H_R.js +1 -0
- package/storybook-static/assets/{hooks-CBL4T7C0.js → hooks-DlpluSIv.js} +1 -1
- package/storybook-static/assets/{iframe-BTynnNuO.js → iframe-YecJO4uV.js} +3 -3
- package/storybook-static/assets/{input-CFfmuFlh.js → input-CVG4hDFt.js} +1 -1
- package/storybook-static/assets/{lucide-react-B2Sw-JkK.js → lucide-react-DoqvsuDx.js} +1 -1
- package/storybook-static/assets/{mdx-react-shim-Bz94Q7wv.js → mdx-react-shim-B6MYoAcj.js} +1 -1
- package/storybook-static/assets/{media-hUTfXE4I.js → media-dT-v0KyQ.js} +1 -1
- package/storybook-static/assets/{misc-CPWifJww.js → misc-B81k0Tx5.js} +1 -1
- package/storybook-static/assets/{notifications-0XnLCBoc.js → notifications-CAn9BB3F.js} +1 -1
- package/storybook-static/assets/{odata-DO-MoXPn.js → odata-CCAAVsLr.js} +1 -1
- package/storybook-static/assets/odata-service-D0evRTVS.js +1 -0
- package/storybook-static/assets/{odataStoryFixtures-9jQS9H9Y.js → odataStoryFixtures-DePPyMUW.js} +1 -1
- package/storybook-static/assets/{picker-BOGXgJlf.js → picker-Cs_HmTIT.js} +1 -1
- package/storybook-static/assets/{popover--xBJFoxv.js → popover-CwLg1nVy.js} +1 -1
- package/storybook-static/assets/{preset-select-DiTREPwr.js → preset-select-LcK3ak1H.js} +1 -1
- package/storybook-static/assets/{react-18-BYq2CvxP.js → react-18-BAqYtx7S.js} +1 -1
- package/storybook-static/assets/{react-BC7rrhYL.js → react-DqGAnUZt.js} +1 -1
- package/storybook-static/assets/{react-dom-CECiKyg8.js → react-dom-Dp-mf7b2.js} +1 -1
- package/storybook-static/assets/select-D1j8twIv.js +1 -0
- package/storybook-static/assets/{slider-BsmP2ySb.js → slider-BUne_904.js} +1 -1
- package/storybook-static/assets/{sortable-he3TnAeg.js → sortable-BSyQxNy_.js} +1 -1
- package/storybook-static/assets/{syntaxhighlighter-RTCFPKCB-7HJ0JmlR.js → syntaxhighlighter-RTCFPKCB-yen8I1rd.js} +1 -1
- package/storybook-static/assets/{text-CobHpdr-.js → text-CQF6O5fh.js} +1 -1
- package/storybook-static/assets/{theming-BMN_kWyi.js → theming-DyCFqSDn.js} +1 -1
- package/storybook-static/assets/ui-imSUUVzJ.js +1 -0
- package/storybook-static/assets/{useODataSelectBase-CIi52-1O.js → useODataSelectBase-C9E-wcFt.js} +1 -1
- package/storybook-static/assets/{useODataTreeData-DUaWgVs7.js → useODataTreeData-CcHumE5U.js} +1 -1
- package/storybook-static/assets/{utils-BJ1bkCdU.js → utils-Bnd9AQDU.js} +1 -1
- package/storybook-static/iframe.html +1 -1
- package/storybook-static/project.json +1 -1
- package/storybook-static/assets/Toggle-DHulCX3T.css +0 -1
- package/storybook-static/assets/formatter-L2YTDE3Q-Cu2ThPoa.js +0 -1
- package/storybook-static/assets/grid-DuUYfT-l.js +0 -1
- package/storybook-static/assets/odata-service-DeMvWSOE.js +0 -1
- package/storybook-static/assets/select-BliKC98i.js +0 -1
- package/storybook-static/assets/ui-BYhfKLS0.js +0 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{a as e,c as t,i as n}from"./preload-helper-B45gAKPr.js";import{C as r}from"./iframe-
|
|
1
|
+
import{a as e,c as t,i as n}from"./preload-helper-B45gAKPr.js";import{C as r}from"./iframe-YecJO4uV.js";import{t as i}from"./jsx-runtime-BBQGix-2.js";import{a,i as o,n as s,r as c,s as l,t as u}from"./utils-Bnd9AQDU.js";import{t as d,wt as f}from"./lucide-react-DoqvsuDx.js";import{n as p,t as m}from"./ui.module-wFHXkJzp.js";function h(e,t,n){if(n){if(Array.isArray(t)&&t.length>0){let n=e.findIndex(e=>t.includes(e.value)&&!e.disabled);if(n>=0)return n}return c(e,y)}if(t!==void 0){let n=e.findIndex(e=>e.value===t&&!e.disabled);if(n>=0)return n}return c(e,y)}function g(e){let{value:t,defaultValue:n,multiple:r,focusOnMount:i,renderItem:o,getKey:d,options:m,onChange:g,id:b,...x}=e,S=t!==void 0,C=(0,_.useId)(),w=b??`${C}-listbox`,[T,E]=(0,_.useState)(n),D=(0,_.useRef)(null),[O,k]=(0,_.useState)(()=>h(m,t??n,r)),A=(0,_.useMemo)(()=>(S?t:T)??(r?[]:null),[T,S,r,t]),j=O,M=t=>{if(t.disabled)return;let n;if(e.multiple){let r=Array.isArray(A)?A:[];n=r.includes(t.value)?r.filter(e=>e!==t.value):[...r,t.value],e.onChange?.(n,t)}else n=t.value,e.onChange?.(n,t);S||E(n)};return(0,_.useEffect)(()=>{let e=D.current?.querySelectorAll(`[role="option"]`)[j];e&&e.scrollIntoView({block:`nearest`})},[j]),(0,_.useLayoutEffect)(()=>{i&&D.current?.focus()},[i]),(0,v.jsx)(`ul`,{ref:D,id:w,role:`listbox`,"aria-multiselectable":r||void 0,"aria-activedescendant":j>=0?`${w}-option-${j}`:void 0,tabIndex:0,onKeyDown:e=>{if(e.key===`ArrowDown`)e.preventDefault(),k(e=>u(m,e,1,y));else if(e.key===`ArrowUp`)e.preventDefault(),k(e=>u(m,e,-1,y));else if(e.key===`Home`)e.preventDefault(),k(c(m,y));else if(e.key===`End`)e.preventDefault(),k(l(m,y));else if(s(e,()=>{let e=m[j];e&&M(e)}))return},...x,className:a(p.uiPanel,`scrollable`),children:m.map((e,t)=>{let n=r?Array.isArray(A)&&A.includes(e.value):A===e.value,i=t===j;return(0,v.jsxs)(`li`,{id:`${w}-option-${t}`,role:`option`,"aria-selected":n,"aria-disabled":e.disabled||void 0,onMouseDown:n=>{n.preventDefault(),!e.disabled&&(k(t),M(e))},tabIndex:-1,className:a(p.uiPopupOption,e.disabled&&p.disabled,i&&p.uiPopupOptionActive,n&&p.selected),children:[n?(0,v.jsx)(f,{className:p.uiPopupOptionIcon}):(0,v.jsx)(`span`,{className:p.uiPopupOptionIcon}),(0,v.jsx)(`div`,{children:o?o(e,n,i):e.label??String(e.value)})]},d?d(e,t):t)})})}var _,v,y,b=n((()=>{_=t(r(),1),o(),d(),m(),v=i(),y=e=>e.disabled===!0,g.__docgenInfo={description:``,methods:[],displayName:`Listbox`}})),x=e({CustomRender:()=>O,MultiSelect:()=>D,SingleSelect:()=>E,__namedExportsOrder:()=>k,default:()=>T});function S(e){return e.multiple?(0,w.jsx)(g,{...e,multiple:!0}):(0,w.jsx)(g,{...e})}var C,w,T,E,D,O,k,A=n((()=>{C=t(r(),1),b(),w=i(),T={title:`Shared/UI/Listbox`,component:S,args:{options:[{id:`low`,label:`Низкий`},{id:`medium`,label:`Средний`},{id:`high`,label:`Высокий`},{id:`critical`,label:`Критический`,disabled:!0}],multiple:!1,value:`medium`,onChange:()=>{}},parameters:{atomicCanvas:!0,layout:`padded`},argTypes:{options:{description:`Массив доступных опций списка.`,control:!1},multiple:{description:`Режим множественного выбора.`,control:`boolean`},value:{description:`Текущее выбранное значение (или массив значений).`,control:!1},defaultValue:{description:`Начальное значение для uncontrolled-режима.`,control:!1},onChange:{description:`Вызывается при выборе опции.`,control:!1},focusOnMount:{description:`Автофокус списка при монтировании.`,control:`boolean`},renderItem:{description:`Кастомный рендер строки списка.`,control:!1},getKey:{description:`Функция генерации ключа для опции.`,control:!1},className:{description:`Дополнительный CSS-класс.`,control:`text`}}},E={render:e=>{let[t,n]=(0,C.useState)(`medium`);return(0,w.jsxs)(`div`,{style:{display:`grid`,gap:12,maxWidth:280},children:[(0,w.jsx)(S,{...e,multiple:!1,value:t,onChange:e=>{typeof e==`string`&&n(e)}}),(0,w.jsxs)(`div`,{children:[`Выбрано: `,t]})]})}},D={render:e=>{let[t,n]=(0,C.useState)([`low`,`high`]);return(0,w.jsxs)(`div`,{style:{display:`grid`,gap:12,maxWidth:320},children:[(0,w.jsx)(S,{...e,multiple:!0,value:t,onChange:e=>{Array.isArray(e)&&n(e)}}),(0,w.jsxs)(`div`,{children:[`Выбрано: `,t.join(`, `)||`пусто`]})]})},args:{multiple:!0}},O={render:e=>{let[t,n]=(0,C.useState)(`low`);return(0,w.jsx)(S,{...e,value:t,onChange:e=>{typeof e==`string`&&n(e)},renderItem:(e,t,n)=>(0,w.jsxs)(`div`,{style:{display:`flex`,justifyContent:`space-between`,width:`100%`,opacity:e.disabled?.5:1},children:[(0,w.jsx)(`span`,{children:e.label}),(0,w.jsx)(`span`,{children:t?`Выбрано`:n?`Фокус`:``})]})})}},E.parameters={...E.parameters,docs:{...E.parameters?.docs,source:{originalSource:`{
|
|
2
2
|
render: args => {
|
|
3
3
|
const [value, setValue] = useState<string>("medium");
|
|
4
4
|
return <div style={{
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{i as e}from"./preload-helper-B45gAKPr.js";import{E as t,a as n,d as r,f as i,l as a,m as o,n as s,p as c,r as l,u}from"./blocks-
|
|
1
|
+
import{i as e}from"./preload-helper-B45gAKPr.js";import{E as t,a as n,d as r,f as i,l as a,m as o,n as s,p as c,r as l,u}from"./blocks-D8vTJCXn.js";import{t as d}from"./jsx-runtime-BBQGix-2.js";import{t as f}from"./mdx-react-shim-B6MYoAcj.js";import{Controlled as p,ScrollableContent as m,Sizes as h,StackedModals as g,WithToolbarAndFooter as _,n as v,t as y}from"./Modal.stories-BfQSWo-S.js";function b(e){let o={code:`code`,h2:`h2`,h3:`h3`,li:`li`,p:`p`,pre:`pre`,ul:`ul`,...t(),...e.components};return(0,S.jsxs)(S.Fragment,{children:[(0,S.jsx)(a,{of:y,parameters:{docs:{toc:!0}}}),`
|
|
2
2
|
`,(0,S.jsx)(c,{children:`Modal`}),`
|
|
3
3
|
`,(0,S.jsx)(i,{children:`Составная модалка с контентом, toolbar и footer для пользовательских диалоговых сценариев`}),`
|
|
4
4
|
`,(0,S.jsx)(o.p,{children:`Modal уже имеет живые stories, а эта страница собирает их в структурированную документацию с краткими рекомендациями, примерами подключения и API.
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{a as e,c as t,i as n}from"./preload-helper-B45gAKPr.js";import{C as r}from"./iframe-BTynnNuO.js";import{t as i}from"./react-dom-CECiKyg8.js";import{t as a}from"./jsx-runtime-BBQGix-2.js";import{a as o,i as s}from"./utils-BJ1bkCdU.js";import{o as ee,t as c}from"./lucide-react-B2Sw-JkK.js";import{a as l,i as te,r as ne,s as re}from"./error-BiKoqzNj.js";import{o as u}from"./Flex-C_MbUg6r.js";import{t as d}from"./flex-CdaT8HD1.js";import{t as f}from"./Button-Cq-0O5AX.js";import{a as ie,i as ae,n as oe,t as p}from"./react-BC7rrhYL.js";import{t as m}from"./button-gYHgDmlW.js";import{t as h}from"./Input-Cd-pwQ8Q.js";import{t as g}from"./input-CFfmuFlh.js";import{i as se}from"./Grid-XYanU6j8.js";import{t as ce}from"./grid-DuUYfT-l.js";import{i as _,t as le}from"./misc-CPWifJww.js";var v,y,b,x,S,C,w,T,E,D,O,k,ue=n((()=>{v=`vGPUKV`,y=`O7gb7P`,b=`RVq8v3`,x=`PCSUAL`,S=`XDCHzq`,C=`t1kl8L`,w=`o3PEEB`,T=`WhUkxm`,E=`NDgdMi`,D=`JDlse5`,O=`FaDKSt`,k={modal:v,sm:y,md:b,lg:x,xl:S,xxl:C,inside:w,header:T,body:E,headerText:D,headerButton:O}})),de,fe,pe,me=n((()=>{de={hidden:{opacity:0,scale:.96,y:12},visible:{opacity:1,scale:1,y:0}},fe={duration:.18,ease:[.22,1,.36,1]},pe={duration:0}})),A,j,M,N=n((()=>{A=t(r(),1),j=(0,A.createContext)({modals:[],openModal:()=>{},closeModal:()=>{},isTopModal:()=>!1}),M=()=>(0,A.useContext)(j)})),P,F,I,L,R,z,B,he=n((()=>{P=t(r(),1),l(),s(),c(),p(),F=t(i(),1),m(),d(),ce(),le(),ue(),me(),N(),I=a(),L=({children:e,className:t})=>(0,I.jsx)(`div`,{className:o(`surface2 paddingMd borderBottom`,t),children:e}),L.displayName=`Modal.Toolbar`,R=({children:e,className:t,scrollable:n})=>(0,I.jsx)(`div`,{className:o(`paddingMd h100 overflowHidden`,t),children:n?(0,I.jsx)(_,{className:`h100`,children:e}):e}),R.displayName=`Modal.Content`,z=({children:e,className:t})=>(0,I.jsx)(`div`,{className:o(`surface2 borderTop paddingMd`,t),children:(0,I.jsx)(u,{gap:`sm`,align:`center`,justify:`end`,children:e})}),z.displayName=`Modal.Footer`,B=({isOpen:e,title:t,size:n=`sm`,height:r,onClose:i,children:a})=>{let s=(0,P.useId)(),c=(0,P.useId)(),{modals:l,openModal:u,closeModal:d,isTopModal:p}=M(),m=ae(),h=(0,P.useRef)(null),g=(0,P.useRef)(0),ce=e&&(l.length===0||p(s));(0,P.useEffect)(()=>{e&&(h.current=document.activeElement instanceof HTMLElement?document.activeElement:null)},[e]);let _=re({active:e||!1,trapFocus:!0,restoreFocus:!1});te({active:ce||!1,onDismiss:i,containerRef:_}),(0,P.useEffect)(()=>{e&&u(s)},[e,s,u]),(0,P.useEffect)(()=>()=>{window.cancelAnimationFrame(g.current),d(s)},[d,s]);function le(){d(s);let e=h.current;g.current=window.requestAnimationFrame(()=>{e?.isConnected&&e.focus(),h.current=null})}let v=ne(`modal-root`);if(!v)return null;let y=null,b=null,x=null,S=P.Children.toArray(a);for(let e of S)switch(e.type.displayName){case L.displayName:if(y)throw Error(`Modal: duplicate <Toolbar> found`);y=e;break;case z.displayName:if(x)throw Error(`Modal: duplicate <Footer> found`);x=e;break;case R.displayName:if(b)throw Error(`Modal: duplicate <Content> found`);b=e;break}return(0,F.createPortal)((0,I.jsx)(ie,{onExitComplete:le,children:e?(0,I.jsxs)(oe.div,{ref:_,className:o(k.modal,k[n]),style:{height:r},role:`dialog`,"aria-modal":`true`,"aria-labelledby":c,"aria-describedby":`${c}-content`,initial:`hidden`,animate:`visible`,exit:`hidden`,variants:de,transition:m?pe:fe,children:[(0,I.jsxs)(`div`,{className:o(k.header,y?``:`borderBottom`),children:[(0,I.jsx)(`h3`,{className:k.headerText,id:c,children:t}),(0,I.jsx)(f,{icon:(0,I.jsx)(ee,{}),className:k.headerButton,variant:`ghost`,"aria-label":`Закрыть модальное окно`,onClick:i})]}),(0,I.jsxs)(se,{id:`${c}-content`,templateRows:`${y?`auto`:``} 1fr ${x?`auto`:``}`.trim(),className:k.body,children:[y,b,x]})]}):null}),v)},L.__docgenInfo={description:``,methods:[],displayName:`Modal.Toolbar`,props:{children:{required:!0,tsType:{name:`ReactReactNode`,raw:`React.ReactNode`},description:``},className:{required:!1,tsType:{name:`string`},description:``}}},R.__docgenInfo={description:``,methods:[],displayName:`Modal.Content`,props:{children:{required:!0,tsType:{name:`ReactReactNode`,raw:`React.ReactNode`},description:``},className:{required:!1,tsType:{name:`string`},description:``},scrollable:{required:!1,tsType:{name:`boolean`},description:``}}},z.__docgenInfo={description:``,methods:[],displayName:`Modal.Footer`,props:{children:{required:!0,tsType:{name:`ReactReactNode`,raw:`React.ReactNode`},description:``},className:{required:!1,tsType:{name:`string`},description:``}}}}));function V({children:e,compensateScrollbar:t=!1}){let[n,r]=(0,H.useState)([]),i=(0,H.useRef)(0),a=(0,H.useRef)(0),o=(0,H.useRef)(``),s=(0,H.useRef)(!1),ee=(0,H.useCallback)(e=>{r(t=>[...t,e])},[]),c=(0,H.useCallback)(e=>{r(t=>t.filter(t=>t!==e))},[]),l=(0,H.useCallback)(e=>n[n.length-1]===e,[n]);return(0,H.useEffect)(()=>{let e=i.current===0;if(e&&n.length>0){let e=window.scrollY,r=document.querySelector(`#app-root`);a.current=Math.max(0,window.innerWidth-document.documentElement.clientWidth),o.current=document.body.style.paddingRight,document.body.style.position=`fixed`,document.body.style.top=`-${e}px`,document.body.style.width=`100%`,t&&(document.body.style.paddingRight=`${a.current}px`,s.current=!0),r?.setAttribute(`inert`,`true`),i.current=n.length;return}if(!e&&n.length>0&&t!==s.current&&(document.body.style.paddingRight=t?`${a.current}px`:o.current,s.current=t),!e&&n.length===0){let e=document.querySelector(`#app-root`),t=parseInt(document.body.style.top||`0`)*-1;document.body.style.position=``,document.body.style.top=``,document.body.style.width=``,s.current&&=(document.body.style.paddingRight=o.current,!1),e?.removeAttribute(`inert`),window.scrollTo({top:t,left:0,behavior:`instant`})}i.current=n.length},[t,n.length]),(0,U.jsx)(j.Provider,{value:{modals:n,openModal:ee,closeModal:c,isTopModal:l},children:e})}var H,U,ge=n((()=>{H=t(r(),1),N(),U=a(),V.__docgenInfo={description:`Провайдер для централизованного управления стеком модальных окон. Дает вложенным компонентам доступ к открытию и закрытию модалок через контекст.`,methods:[],displayName:`ModalManagerProvider`,props:{children:{required:!0,tsType:{name:`ReactReactNode`,raw:`React.ReactNode`},description:``},compensateScrollbar:{required:!1,tsType:{name:`boolean`},description:`Компенсирует исчезновение скроллбара правым padding у body.`,defaultValue:{value:`false`,computed:!1}}}}})),_e=n((()=>{he(),ge(),N()})),ve=e({Controlled:()=>J,ScrollableContent:()=>X,Sizes:()=>Z,StackedModals:()=>Q,WithToolbarAndFooter:()=>Y,__namedExportsOrder:()=>$,default:()=>q});function ye({children:e}){return(0,K.jsx)(`div`,{style:{minHeight:`60dvh`,padding:24,display:`flex`,alignItems:`center`,justifyContent:`center`},children:e})}function W(){let[e,t]=(0,G.useState)(`Алексей`),[n,r]=(0,G.useState)(`Департамент автоматизации бизнеса`);return(0,K.jsxs)(`div`,{style:{display:`grid`,gap:16},children:[(0,K.jsx)(h,{label:`Имя`,value:e,onChange:t,placeholder:`Введите имя`}),(0,K.jsx)(h,{label:`Подразделение`,value:n,onChange:r,placeholder:`Введите подразделение`}),(0,K.jsxs)(`div`,{style:{padding:12,borderRadius:8,background:`var(--surface-1)`,border:`1px solid var(--border-1)`},children:[`Текущие значения: `,e||`не указано`,`, `,n||`не указано`]})]})}var G,K,q,J,Y,X,Z,Q,$,be=n((()=>{G=t(r(),1),m(),g(),_e(),K=a(),q={title:`Shared/UI/Modal`,component:B,parameters:{atomicCanvas:!0,layout:`fullscreen`,docs:{description:{component:"Композиционная модалка с `Toolbar`, `Content` и `Footer`, поддержкой focus trap, возврата фокуса, закрытия по `Escape` и менеджером стека через `ModalManagerProvider`."}}},decorators:[e=>(0,K.jsx)(V,{children:(0,K.jsx)(ye,{children:e()})})],args:{isOpen:!1,title:`Редактирование профиля`,size:`md`,height:void 0,onClose:()=>{},children:(0,K.jsxs)(K.Fragment,{children:[(0,K.jsx)(R,{children:(0,K.jsx)(W,{})}),(0,K.jsxs)(z,{children:[(0,K.jsx)(f,{variant:`transparent`,children:`Отмена`}),(0,K.jsx)(f,{children:`Сохранить`})]})]})},argTypes:{isOpen:{description:`Управляет видимостью модального окна.`,control:`boolean`},title:{description:`Заголовок модального окна.`,control:`text`},size:{description:`Предустановленный размер модального окна.`,control:`inline-radio`,options:[`sm`,`md`,`lg`,`xl`,`inside`]},height:{description:`Явная высота body-области модалки.`,control:`text`},onClose:{description:"Вызывается при закрытии по кнопке, `Escape` или пользовательскому действию.",control:!1},children:{description:"Композиция из `ModalToolbar`, `ModalContent`, `ModalFooter`.",control:!1}}},J={name:`Управляемая модалка`,render:e=>{let[t,n]=(0,G.useState)(!1);return(0,K.jsxs)(K.Fragment,{children:[(0,K.jsx)(f,{onClick:()=>n(!0),children:`Открыть модалку`}),(0,K.jsxs)(B,{...e,isOpen:t,onClose:()=>n(!1),children:[(0,K.jsx)(R,{children:(0,K.jsx)(W,{})}),(0,K.jsxs)(z,{children:[(0,K.jsx)(f,{variant:`transparent`,onClick:()=>n(!1),children:`Отмена`}),(0,K.jsx)(f,{onClick:()=>n(!1),children:`Сохранить`})]})]})]})}},Y={name:`Полная композиция`,render:e=>{let[t,n]=(0,G.useState)(!1);return(0,K.jsxs)(K.Fragment,{children:[(0,K.jsx)(f,{onClick:()=>n(!0),children:`Открыть сценарий редактирования`}),(0,K.jsxs)(B,{...e,isOpen:t,onClose:()=>n(!1),height:`min(34rem, 70dvh)`,children:[(0,K.jsx)(L,{children:(0,K.jsxs)(`div`,{style:{display:`flex`,alignItems:`center`,justifyContent:`space-between`,gap:12,padding:12,borderRadius:8,background:`var(--surface-1)`,border:`1px solid var(--border-1)`},children:[(0,K.jsxs)(`div`,{children:[(0,K.jsx)(`div`,{style:{fontWeight:600},children:`Черновик обновлён автоматически`}),(0,K.jsx)(`div`,{style:{opacity:.72},children:`Последнее сохранение: 2 минуты назад`})]}),(0,K.jsx)(f,{variant:`transparent`,children:`Сбросить`})]})}),(0,K.jsx)(R,{children:(0,K.jsx)(W,{})}),(0,K.jsxs)(z,{children:[(0,K.jsx)(f,{variant:`transparent`,onClick:()=>n(!1),children:`Отмена`}),(0,K.jsx)(f,{variant:`success`,onClick:()=>n(!1),children:`Применить`})]})]})]})}},X={name:`Длинный контент`,render:e=>{let[t,n]=(0,G.useState)(!1);return(0,K.jsxs)(K.Fragment,{children:[(0,K.jsx)(f,{onClick:()=>n(!0),children:`Открыть длинный контент`}),(0,K.jsxs)(B,{...e,isOpen:t,onClose:()=>n(!1),size:`lg`,height:`min(38rem, 75dvh)`,title:`Журнал изменений`,children:[(0,K.jsx)(R,{children:(0,K.jsx)(`div`,{style:{display:`grid`,gap:12},children:Array.from({length:18},(e,t)=>(0,K.jsxs)(`div`,{style:{padding:12,borderRadius:8,border:`1px solid var(--border-1)`,background:`var(--surface-1)`},children:[(0,K.jsxs)(`div`,{style:{fontWeight:600},children:[`Событие #`,t+1]}),(0,K.jsx)(`div`,{style:{opacity:.72},children:`Пользователь обновил настройки карточки, изменил состав полей и подтвердил сохранение конфигурации.`})]},t))})}),(0,K.jsx)(z,{children:(0,K.jsx)(f,{onClick:()=>n(!1),children:`Закрыть`})})]})]})}},Z={name:`Размеры`,render:()=>{let[e,t]=(0,G.useState)(null);return(0,K.jsxs)(K.Fragment,{children:[(0,K.jsx)(`div`,{style:{display:`flex`,flexWrap:`wrap`,gap:12,justifyContent:`center`},children:[`sm`,`md`,`lg`,`xl`,`inside`].map(e=>(0,K.jsx)(f,{variant:`transparent`,onClick:()=>t(e),children:e.toUpperCase()},e))}),e&&(0,K.jsxs)(B,{isOpen:!0,onClose:()=>t(null),size:e,title:`Размер ${e.toUpperCase()}`,children:[(0,K.jsx)(R,{children:(0,K.jsxs)(`div`,{style:{display:`grid`,gap:12},children:[(0,K.jsx)(`div`,{children:`Этот сценарий помогает быстро сравнить ширину и поведение модалки для разных размеров.`}),(0,K.jsx)(`div`,{style:{opacity:.72},children:"Проверьте отступы, читабельность и поведение при `Escape`."})]})}),(0,K.jsx)(z,{children:(0,K.jsx)(f,{onClick:()=>t(null),children:`Понятно`})})]})]})}},Q={name:`Стек модалок`,render:e=>{let[t,n]=(0,G.useState)(!1),[r,i]=(0,G.useState)(!1);return(0,K.jsxs)(K.Fragment,{children:[(0,K.jsx)(f,{onClick:()=>n(!0),children:`Открыть первую модалку`}),(0,K.jsxs)(B,{...e,isOpen:t,onClose:()=>{i(!1),n(!1)},size:`lg`,title:`Первая модалка`,children:[(0,K.jsx)(R,{children:(0,K.jsxs)(`div`,{style:{display:`grid`,gap:16},children:[(0,K.jsx)(`div`,{children:"Откройте вторую модалку и проверьте, что `Escape` закрывает только верхний слой."}),(0,K.jsx)(f,{variant:`transparent`,onClick:()=>i(!0),children:`Открыть вторую модалку`})]})}),(0,K.jsx)(z,{children:(0,K.jsx)(f,{variant:`transparent`,onClick:()=>n(!1),children:`Закрыть первую`})})]}),(0,K.jsxs)(B,{isOpen:r,onClose:()=>i(!1),size:`sm`,title:`Вторая модалка`,children:[(0,K.jsx)(R,{children:(0,K.jsxs)(`div`,{style:{display:`grid`,gap:12},children:[(0,K.jsx)(`div`,{children:`Эта модалка должна считаться верхней в стеке.`}),(0,K.jsx)(h,{label:`Короткое поле`,value:`Фокус внутри`,onChange:()=>{}})]})}),(0,K.jsx)(z,{children:(0,K.jsx)(f,{onClick:()=>i(!1),children:`Закрыть вторую`})})]})]})}},J.parameters={...J.parameters,docs:{...J.parameters?.docs,source:{originalSource:`{
|
|
1
|
+
import{a as e,c as t,i as n}from"./preload-helper-B45gAKPr.js";import{C as r}from"./iframe-YecJO4uV.js";import{t as i}from"./react-dom-Dp-mf7b2.js";import{t as a}from"./jsx-runtime-BBQGix-2.js";import{a as o,i as s}from"./utils-Bnd9AQDU.js";import{o as ee,t as c}from"./lucide-react-DoqvsuDx.js";import{a as l,i as te,r as ne,s as re}from"./error-DI-le3_4.js";import{o as u}from"./Flex-CXJVQ7iV.js";import{t as d}from"./flex-BriuFrFs.js";import{t as f}from"./Button-DYvP70oK.js";import{a as ie,i as ae,n as oe,t as p}from"./react-DqGAnUZt.js";import{t as m}from"./button-Cz3fiO2B.js";import{t as h}from"./Input-VtBvr4ox.js";import{t as g}from"./input-CVG4hDFt.js";import{i as se}from"./Grid-C4-fxCy0.js";import{t as ce}from"./grid-Dtmb5H_R.js";import{i as _,t as le}from"./misc-B81k0Tx5.js";var v,y,b,x,S,C,w,T,E,D,O,k,ue=n((()=>{v=`vGPUKV`,y=`O7gb7P`,b=`RVq8v3`,x=`PCSUAL`,S=`XDCHzq`,C=`t1kl8L`,w=`o3PEEB`,T=`WhUkxm`,E=`NDgdMi`,D=`JDlse5`,O=`FaDKSt`,k={modal:v,sm:y,md:b,lg:x,xl:S,xxl:C,inside:w,header:T,body:E,headerText:D,headerButton:O}})),de,fe,pe,me=n((()=>{de={hidden:{opacity:0,scale:.96,y:12},visible:{opacity:1,scale:1,y:0}},fe={duration:.18,ease:[.22,1,.36,1]},pe={duration:0}})),A,j,M,N=n((()=>{A=t(r(),1),j=(0,A.createContext)({modals:[],openModal:()=>{},closeModal:()=>{},isTopModal:()=>!1}),M=()=>(0,A.useContext)(j)})),P,F,I,L,R,z,B,he=n((()=>{P=t(r(),1),l(),s(),c(),p(),F=t(i(),1),m(),d(),ce(),le(),ue(),me(),N(),I=a(),L=({children:e,className:t})=>(0,I.jsx)(`div`,{className:o(`surface2 paddingMd borderBottom`,t),children:e}),L.displayName=`Modal.Toolbar`,R=({children:e,className:t,scrollable:n})=>(0,I.jsx)(`div`,{className:o(`paddingMd h100 overflowHidden`,t),children:n?(0,I.jsx)(_,{className:`h100`,children:e}):e}),R.displayName=`Modal.Content`,z=({children:e,className:t})=>(0,I.jsx)(`div`,{className:o(`surface2 borderTop paddingMd`,t),children:(0,I.jsx)(u,{gap:`sm`,align:`center`,justify:`end`,children:e})}),z.displayName=`Modal.Footer`,B=({isOpen:e,title:t,size:n=`sm`,height:r,onClose:i,children:a})=>{let s=(0,P.useId)(),c=(0,P.useId)(),{modals:l,openModal:u,closeModal:d,isTopModal:p}=M(),m=ae(),h=(0,P.useRef)(null),g=(0,P.useRef)(0),ce=e&&(l.length===0||p(s));(0,P.useEffect)(()=>{e&&(h.current=document.activeElement instanceof HTMLElement?document.activeElement:null)},[e]);let _=re({active:e||!1,trapFocus:!0,restoreFocus:!1});te({active:ce||!1,onDismiss:i,containerRef:_}),(0,P.useEffect)(()=>{e&&u(s)},[e,s,u]),(0,P.useEffect)(()=>()=>{window.cancelAnimationFrame(g.current),d(s)},[d,s]);function le(){d(s);let e=h.current;g.current=window.requestAnimationFrame(()=>{e?.isConnected&&e.focus(),h.current=null})}let v=ne(`modal-root`);if(!v)return null;let y=null,b=null,x=null,S=P.Children.toArray(a);for(let e of S)switch(e.type.displayName){case L.displayName:if(y)throw Error(`Modal: duplicate <Toolbar> found`);y=e;break;case z.displayName:if(x)throw Error(`Modal: duplicate <Footer> found`);x=e;break;case R.displayName:if(b)throw Error(`Modal: duplicate <Content> found`);b=e;break}return(0,F.createPortal)((0,I.jsx)(ie,{onExitComplete:le,children:e?(0,I.jsxs)(oe.div,{ref:_,className:o(k.modal,k[n]),style:{height:r},role:`dialog`,"aria-modal":`true`,"aria-labelledby":c,"aria-describedby":`${c}-content`,initial:`hidden`,animate:`visible`,exit:`hidden`,variants:de,transition:m?pe:fe,children:[(0,I.jsxs)(`div`,{className:o(k.header,y?``:`borderBottom`),children:[(0,I.jsx)(`h3`,{className:k.headerText,id:c,children:t}),(0,I.jsx)(f,{icon:(0,I.jsx)(ee,{}),className:k.headerButton,variant:`ghost`,"aria-label":`Закрыть модальное окно`,onClick:i})]}),(0,I.jsxs)(se,{id:`${c}-content`,templateRows:`${y?`auto`:``} 1fr ${x?`auto`:``}`.trim(),className:k.body,children:[y,b,x]})]}):null}),v)},L.__docgenInfo={description:``,methods:[],displayName:`Modal.Toolbar`,props:{children:{required:!0,tsType:{name:`ReactReactNode`,raw:`React.ReactNode`},description:``},className:{required:!1,tsType:{name:`string`},description:``}}},R.__docgenInfo={description:``,methods:[],displayName:`Modal.Content`,props:{children:{required:!0,tsType:{name:`ReactReactNode`,raw:`React.ReactNode`},description:``},className:{required:!1,tsType:{name:`string`},description:``},scrollable:{required:!1,tsType:{name:`boolean`},description:``}}},z.__docgenInfo={description:``,methods:[],displayName:`Modal.Footer`,props:{children:{required:!0,tsType:{name:`ReactReactNode`,raw:`React.ReactNode`},description:``},className:{required:!1,tsType:{name:`string`},description:``}}}}));function V({children:e,compensateScrollbar:t=!1}){let[n,r]=(0,H.useState)([]),i=(0,H.useRef)(0),a=(0,H.useRef)(0),o=(0,H.useRef)(``),s=(0,H.useRef)(!1),ee=(0,H.useCallback)(e=>{r(t=>[...t,e])},[]),c=(0,H.useCallback)(e=>{r(t=>t.filter(t=>t!==e))},[]),l=(0,H.useCallback)(e=>n[n.length-1]===e,[n]);return(0,H.useEffect)(()=>{let e=i.current===0;if(e&&n.length>0){let e=window.scrollY,r=document.querySelector(`#app-root`);a.current=Math.max(0,window.innerWidth-document.documentElement.clientWidth),o.current=document.body.style.paddingRight,document.body.style.position=`fixed`,document.body.style.top=`-${e}px`,document.body.style.width=`100%`,t&&(document.body.style.paddingRight=`${a.current}px`,s.current=!0),r?.setAttribute(`inert`,`true`),i.current=n.length;return}if(!e&&n.length>0&&t!==s.current&&(document.body.style.paddingRight=t?`${a.current}px`:o.current,s.current=t),!e&&n.length===0){let e=document.querySelector(`#app-root`),t=parseInt(document.body.style.top||`0`)*-1;document.body.style.position=``,document.body.style.top=``,document.body.style.width=``,s.current&&=(document.body.style.paddingRight=o.current,!1),e?.removeAttribute(`inert`),window.scrollTo({top:t,left:0,behavior:`instant`})}i.current=n.length},[t,n.length]),(0,U.jsx)(j.Provider,{value:{modals:n,openModal:ee,closeModal:c,isTopModal:l},children:e})}var H,U,ge=n((()=>{H=t(r(),1),N(),U=a(),V.__docgenInfo={description:`Провайдер для централизованного управления стеком модальных окон. Дает вложенным компонентам доступ к открытию и закрытию модалок через контекст.`,methods:[],displayName:`ModalManagerProvider`,props:{children:{required:!0,tsType:{name:`ReactReactNode`,raw:`React.ReactNode`},description:``},compensateScrollbar:{required:!1,tsType:{name:`boolean`},description:`Компенсирует исчезновение скроллбара правым padding у body.`,defaultValue:{value:`false`,computed:!1}}}}})),_e=n((()=>{he(),ge(),N()})),ve=e({Controlled:()=>J,ScrollableContent:()=>X,Sizes:()=>Z,StackedModals:()=>Q,WithToolbarAndFooter:()=>Y,__namedExportsOrder:()=>$,default:()=>q});function ye({children:e}){return(0,K.jsx)(`div`,{style:{minHeight:`60dvh`,padding:24,display:`flex`,alignItems:`center`,justifyContent:`center`},children:e})}function W(){let[e,t]=(0,G.useState)(`Алексей`),[n,r]=(0,G.useState)(`Департамент автоматизации бизнеса`);return(0,K.jsxs)(`div`,{style:{display:`grid`,gap:16},children:[(0,K.jsx)(h,{label:`Имя`,value:e,onChange:t,placeholder:`Введите имя`}),(0,K.jsx)(h,{label:`Подразделение`,value:n,onChange:r,placeholder:`Введите подразделение`}),(0,K.jsxs)(`div`,{style:{padding:12,borderRadius:8,background:`var(--surface-1)`,border:`1px solid var(--border-1)`},children:[`Текущие значения: `,e||`не указано`,`, `,n||`не указано`]})]})}var G,K,q,J,Y,X,Z,Q,$,be=n((()=>{G=t(r(),1),m(),g(),_e(),K=a(),q={title:`Shared/UI/Modal`,component:B,parameters:{atomicCanvas:!0,layout:`fullscreen`,docs:{description:{component:"Композиционная модалка с `Toolbar`, `Content` и `Footer`, поддержкой focus trap, возврата фокуса, закрытия по `Escape` и менеджером стека через `ModalManagerProvider`."}}},decorators:[e=>(0,K.jsx)(V,{children:(0,K.jsx)(ye,{children:e()})})],args:{isOpen:!1,title:`Редактирование профиля`,size:`md`,height:void 0,onClose:()=>{},children:(0,K.jsxs)(K.Fragment,{children:[(0,K.jsx)(R,{children:(0,K.jsx)(W,{})}),(0,K.jsxs)(z,{children:[(0,K.jsx)(f,{variant:`transparent`,children:`Отмена`}),(0,K.jsx)(f,{children:`Сохранить`})]})]})},argTypes:{isOpen:{description:`Управляет видимостью модального окна.`,control:`boolean`},title:{description:`Заголовок модального окна.`,control:`text`},size:{description:`Предустановленный размер модального окна.`,control:`inline-radio`,options:[`sm`,`md`,`lg`,`xl`,`inside`]},height:{description:`Явная высота body-области модалки.`,control:`text`},onClose:{description:"Вызывается при закрытии по кнопке, `Escape` или пользовательскому действию.",control:!1},children:{description:"Композиция из `ModalToolbar`, `ModalContent`, `ModalFooter`.",control:!1}}},J={name:`Управляемая модалка`,render:e=>{let[t,n]=(0,G.useState)(!1);return(0,K.jsxs)(K.Fragment,{children:[(0,K.jsx)(f,{onClick:()=>n(!0),children:`Открыть модалку`}),(0,K.jsxs)(B,{...e,isOpen:t,onClose:()=>n(!1),children:[(0,K.jsx)(R,{children:(0,K.jsx)(W,{})}),(0,K.jsxs)(z,{children:[(0,K.jsx)(f,{variant:`transparent`,onClick:()=>n(!1),children:`Отмена`}),(0,K.jsx)(f,{onClick:()=>n(!1),children:`Сохранить`})]})]})]})}},Y={name:`Полная композиция`,render:e=>{let[t,n]=(0,G.useState)(!1);return(0,K.jsxs)(K.Fragment,{children:[(0,K.jsx)(f,{onClick:()=>n(!0),children:`Открыть сценарий редактирования`}),(0,K.jsxs)(B,{...e,isOpen:t,onClose:()=>n(!1),height:`min(34rem, 70dvh)`,children:[(0,K.jsx)(L,{children:(0,K.jsxs)(`div`,{style:{display:`flex`,alignItems:`center`,justifyContent:`space-between`,gap:12,padding:12,borderRadius:8,background:`var(--surface-1)`,border:`1px solid var(--border-1)`},children:[(0,K.jsxs)(`div`,{children:[(0,K.jsx)(`div`,{style:{fontWeight:600},children:`Черновик обновлён автоматически`}),(0,K.jsx)(`div`,{style:{opacity:.72},children:`Последнее сохранение: 2 минуты назад`})]}),(0,K.jsx)(f,{variant:`transparent`,children:`Сбросить`})]})}),(0,K.jsx)(R,{children:(0,K.jsx)(W,{})}),(0,K.jsxs)(z,{children:[(0,K.jsx)(f,{variant:`transparent`,onClick:()=>n(!1),children:`Отмена`}),(0,K.jsx)(f,{variant:`success`,onClick:()=>n(!1),children:`Применить`})]})]})]})}},X={name:`Длинный контент`,render:e=>{let[t,n]=(0,G.useState)(!1);return(0,K.jsxs)(K.Fragment,{children:[(0,K.jsx)(f,{onClick:()=>n(!0),children:`Открыть длинный контент`}),(0,K.jsxs)(B,{...e,isOpen:t,onClose:()=>n(!1),size:`lg`,height:`min(38rem, 75dvh)`,title:`Журнал изменений`,children:[(0,K.jsx)(R,{children:(0,K.jsx)(`div`,{style:{display:`grid`,gap:12},children:Array.from({length:18},(e,t)=>(0,K.jsxs)(`div`,{style:{padding:12,borderRadius:8,border:`1px solid var(--border-1)`,background:`var(--surface-1)`},children:[(0,K.jsxs)(`div`,{style:{fontWeight:600},children:[`Событие #`,t+1]}),(0,K.jsx)(`div`,{style:{opacity:.72},children:`Пользователь обновил настройки карточки, изменил состав полей и подтвердил сохранение конфигурации.`})]},t))})}),(0,K.jsx)(z,{children:(0,K.jsx)(f,{onClick:()=>n(!1),children:`Закрыть`})})]})]})}},Z={name:`Размеры`,render:()=>{let[e,t]=(0,G.useState)(null);return(0,K.jsxs)(K.Fragment,{children:[(0,K.jsx)(`div`,{style:{display:`flex`,flexWrap:`wrap`,gap:12,justifyContent:`center`},children:[`sm`,`md`,`lg`,`xl`,`inside`].map(e=>(0,K.jsx)(f,{variant:`transparent`,onClick:()=>t(e),children:e.toUpperCase()},e))}),e&&(0,K.jsxs)(B,{isOpen:!0,onClose:()=>t(null),size:e,title:`Размер ${e.toUpperCase()}`,children:[(0,K.jsx)(R,{children:(0,K.jsxs)(`div`,{style:{display:`grid`,gap:12},children:[(0,K.jsx)(`div`,{children:`Этот сценарий помогает быстро сравнить ширину и поведение модалки для разных размеров.`}),(0,K.jsx)(`div`,{style:{opacity:.72},children:"Проверьте отступы, читабельность и поведение при `Escape`."})]})}),(0,K.jsx)(z,{children:(0,K.jsx)(f,{onClick:()=>t(null),children:`Понятно`})})]})]})}},Q={name:`Стек модалок`,render:e=>{let[t,n]=(0,G.useState)(!1),[r,i]=(0,G.useState)(!1);return(0,K.jsxs)(K.Fragment,{children:[(0,K.jsx)(f,{onClick:()=>n(!0),children:`Открыть первую модалку`}),(0,K.jsxs)(B,{...e,isOpen:t,onClose:()=>{i(!1),n(!1)},size:`lg`,title:`Первая модалка`,children:[(0,K.jsx)(R,{children:(0,K.jsxs)(`div`,{style:{display:`grid`,gap:16},children:[(0,K.jsx)(`div`,{children:"Откройте вторую модалку и проверьте, что `Escape` закрывает только верхний слой."}),(0,K.jsx)(f,{variant:`transparent`,onClick:()=>i(!0),children:`Открыть вторую модалку`})]})}),(0,K.jsx)(z,{children:(0,K.jsx)(f,{variant:`transparent`,onClick:()=>n(!1),children:`Закрыть первую`})})]}),(0,K.jsxs)(B,{isOpen:r,onClose:()=>i(!1),size:`sm`,title:`Вторая модалка`,children:[(0,K.jsx)(R,{children:(0,K.jsxs)(`div`,{style:{display:`grid`,gap:12},children:[(0,K.jsx)(`div`,{children:`Эта модалка должна считаться верхней в стеке.`}),(0,K.jsx)(h,{label:`Короткое поле`,value:`Фокус внутри`,onChange:()=>{}})]})}),(0,K.jsx)(z,{children:(0,K.jsx)(f,{onClick:()=>i(!1),children:`Закрыть вторую`})})]})]})}},J.parameters={...J.parameters,docs:{...J.parameters?.docs,source:{originalSource:`{
|
|
2
2
|
name: "Управляемая модалка",
|
|
3
3
|
render: args => {
|
|
4
4
|
const [open, setOpen] = useState(false);
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{i as e}from"./preload-helper-B45gAKPr.js";import{E as t,a as n,d as r,f as i,l as a,m as o,n as s,p as c,r as l,u}from"./blocks-
|
|
1
|
+
import{i as e}from"./preload-helper-B45gAKPr.js";import{E as t,a as n,d as r,f as i,l as a,m as o,n as s,p as c,r as l,u}from"./blocks-D8vTJCXn.js";import{t as d}from"./jsx-runtime-BBQGix-2.js";import{t as f}from"./mdx-react-shim-B6MYoAcj.js";import{Basic as p,Empty as m,ErrorState as h,Loading as g,n as _,t as v}from"./MultiSelect.stories-OSUoI8LD.js";function y(e){let o={code:`code`,h2:`h2`,h3:`h3`,li:`li`,p:`p`,pre:`pre`,ul:`ul`,...t(),...e.components};return(0,x.jsxs)(x.Fragment,{children:[(0,x.jsx)(a,{of:v,parameters:{docs:{toc:!0}}}),`
|
|
2
2
|
`,(0,x.jsx)(c,{children:`MultiSelect`}),`
|
|
3
3
|
`,(0,x.jsx)(i,{children:`Мультиселект для локальных коллекций с токенами, поиском и состояниями загрузки`}),`
|
|
4
4
|
`,(0,x.jsx)(o.p,{children:`MultiSelect уже имеет живые stories, а эта страница собирает их в структурированную документацию с краткими рекомендациями, примерами подключения и API.
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{c as e,i as t}from"./preload-helper-B45gAKPr.js";import{C as n}from"./iframe-BTynnNuO.js";import{t as r}from"./jsx-runtime-BBQGix-2.js";import{a as i,i as a}from"./utils-BJ1bkCdU.js";import{o as ee,t as o}from"./lucide-react-B2Sw-JkK.js";import{i as s,t as c}from"./text-CobHpdr-.js";import{n as l,t as u}from"./ui.module-wFHXkJzp.js";import{t as te}from"./CheckBox-WX9G5shZ.js";import{D as ne,S as re,T as ie,a as d,b as f,d as p,g as m,l as ae,m as oe,r as se,s as ce,t as h,v as g,w as _}from"./picker-BOGXgJlf.js";import{n as v,t as le}from"./SelectOptionContent-Ck2fNJ6o.js";import{t as y}from"./check-box-C1ilRc9A.js";function b({item:e,textKey:t,codeKey:n,highlight:r}){return(0,x.jsx)(le,{label:e[t],code:n&&e[n],highlight:r})}var x,S=t((()=>{v(),x=r(),b.__docgenInfo={description:"Отдельная опция внутри `MultiSelect`. Отрисовывает состояние выбора и подсветку текста для найденных совпадений.",methods:[],displayName:`MultiSelectOption`,props:{item:{required:!0,tsType:{name:`CollectionItem`},description:``},textKey:{required:!0,tsType:{name:`string`},description:``},codeKey:{required:!1,tsType:{name:`string`},description:``},highlight:{required:!1,tsType:{name:`string`},description:``},selected:{required:!0,tsType:{name:`boolean`},description:``}}}})),C,w,T,E,D=t((()=>{C=`_9oSdQi`,w=`iobHig`,T=`yatXso`,E={multiSelect:C,multiSelectTokens:w,multiSelectToken:T}}));function O({value:e}){return e?(0,k.jsx)(`div`,{className:E.multiSelectTokens,children:(0,k.jsx)(`div`,{className:E.multiSelectToken,children:e})}):null}var k,A=t((()=>{D(),k=r(),O.__docgenInfo={description:"Токен выбранного значения в `MultiSelect`. Показывает выбранный элемент и кнопку его удаления из текущего набора.",methods:[],displayName:`MultiSelectToken`,props:{value:{required:!0,tsType:{name:`union`,raw:`string | undefined`,elements:[{name:`string`},{name:`undefined`}]},description:``}}}}));function j(e,t,n){if(n)return n;let r=e[0];return r?Object.keys(r).find(e=>e!==t)??t:t}function M(e,t,n){if(e.length===0)return;if(e.length>1)return`${e.length} элементов`;let r=j(e,t,n);return e[0]?.[r]??e[0]?.[t]}function ue(e){return function(t){return(0,N.jsx)(O,{value:M(t.selectedItems,e.codeKey,e.textKey)})}}function de(e){return(0,N.jsx)(f,{onSelectAll:e.selectAll,onDeselectAll:e.deselectAll})}function fe(e){return function(t,n){return(0,N.jsx)(b,{item:t,selected:n.selected,highlight:n.highlightQuery,textKey:j([t],e.codeKey,e.textKey),codeKey:e.hideCode?void 0:e.codeKey})}}var N,P=t((()=>{h(),S(),A(),N=r(),de.__docgenInfo={description:``,methods:[],displayName:`renderDefaultMultiSelectToolbar`,props:{selectedItems:{required:!0,tsType:{name:`Array`,elements:[{name:`CollectionItem`}],raw:`CollectionItem[]`},description:``},committedSelectedItems:{required:!0,tsType:{name:`Array`,elements:[{name:`CollectionItem`}],raw:`CollectionItem[]`},description:``},availableItems:{required:!0,tsType:{name:`Array`,elements:[{name:`CollectionItem`}],raw:`CollectionItem[]`},description:``},query:{required:!0,tsType:{name:`string`},description:``},open:{required:!0,tsType:{name:`boolean`},description:``},clearSelection:{required:!0,tsType:{name:`signature`,type:`function`,raw:`() => void`,signature:{arguments:[],return:{name:`void`}}},description:``},selectAll:{required:!0,tsType:{name:`signature`,type:`function`,raw:`() => void`,signature:{arguments:[],return:{name:`void`}}},description:``},deselectAll:{required:!0,tsType:{name:`signature`,type:`function`,raw:`() => void`,signature:{arguments:[],return:{name:`void`}}},description:``}}}}));function F({text:e,isError:t}){return(0,I.jsxs)(`div`,{className:l.uiPopupOption,children:[(0,I.jsx)(`span`,{className:l.uiPopupOptionIcon}),(0,I.jsx)(s,{color:t?`error`:`primary`,children:e})]})}var I,L=t((()=>{c(),u(),I=r(),F.__docgenInfo={description:"Скелетон строки опции для `MultiSelect`. Используется во время загрузки или при отображении ошибок получения списка.",methods:[],displayName:`MultiSelectOptionSkeleton`,props:{text:{required:!0,tsType:{name:`string`},description:``},isError:{required:!1,tsType:{name:`boolean`},description:``}}}}));function pe({isNoData:e,isLoading:t,error:n,children:r}){return e?(0,B.jsx)(g,{emptyState:(0,B.jsx)(F,{text:`Нет данных`})}):t?(0,B.jsx)(g,{loadingState:(0,B.jsx)(F,{text:`Загрузка...`})}):n?(0,B.jsx)(g,{errorState:(0,B.jsx)(F,{isError:!0,text:`Ошибка загрузки`})}):(0,B.jsx)(B.Fragment,{children:r})}function R(e,t){return e[t]}function me(e,t,n){return Array.from(new Set([e[n],e[t],...Object.values(e)]))}function he(e,t,n){if(e.length!==t.length)return!1;let r=new Set(t.map(e=>R(e,n)));return e.every(e=>r.has(R(e,n)))}function ge({entries:e,listId:t,activeIndex:n,selectedKeys:r,codeKey:a,query:ee,highlightQuery:o,getOptionDisabled:s,getOptionId:c,setOptionRef:u,toggleOption:ne,selectOnlyOption:re,renderItem:ie}){return e.map(({item:e,index:d})=>{let f=d===n,p=r.has(R(e,a)),m=s?.(e)??!1;return(0,B.jsxs)(`div`,{id:c(t,d),ref:e=>u(d,e),role:`option`,"aria-selected":p,"aria-disabled":m||void 0,className:i(l.uiSelectOption,m&&l.disabled,p&&l.selected,f&&l.uiPopupOptionActive),onMouseDown:e=>{e.preventDefault()},children:[(0,B.jsx)(`div`,{onClick:e=>{e.stopPropagation()},children:(0,B.jsx)(te,{value:p,disabled:m,onChange:()=>{m||ne(e)},onClick:e=>{e.stopPropagation()},onMouseDown:e=>{e.stopPropagation()}})}),(0,B.jsx)(`div`,{className:`overflowHidden`,onClick:()=>{m||re(e)},children:ie(e,{selected:p,active:f,disabled:m,query:ee,highlightQuery:o})})]},`${R(e,a)}-${d}`)})}var z,B,_e,V,H=t((()=>{z=e(n(),1),a(),o(),y(),h(),_(),u(),P(),D(),L(),B=r(),_e=[],V=(0,z.forwardRef)(({codeKey:e,textKey:t,hideCode:n,items:r,value:i,onChange:a,label:o,description:s,placeholder:c,size:u,query:te,defaultQuery:f,highlightQuery:h,onQuery:g,defaultFilter:_=!0,onOpen:v,onClose:le,getOptionDisabled:y,disabled:b,error:x,isLoading:S,renderToken:C,renderToolbar:w,renderItem:T},D)=>{let O=(0,z.useRef)(null),[k,A]=(0,z.useState)(!1),M=`search-multi`,N=i??_e,P=(0,z.useMemo)(()=>new Set(N.map(t=>R(t,e))),[e,N]),F=(0,z.useMemo)(()=>r.filter(t=>!P.has(R(t,e))),[e,P,r]),I=(0,z.useMemo)(()=>j([...N,...r],e,t),[e,N,r,t]),{query:L,setQuery:V}=ce({open:k,query:te,defaultQuery:f,onQuery:g,triggerMode:M}),H=p({options:N,query:L,enabled:_,getSearchText:t=>me(t,e,I)}),U=p({options:F,query:L,enabled:_,getSearchText:t=>me(t,e,I)}),W=(0,z.useMemo)(()=>[...H,...U],[U,H]),ve=H.length>0?0:-1,{draftValue:G,setDraftValue:K,prepareOpen:ye}=d({value:N,open:k,onCommit:a,onOpen:v,onClose:le,isEqual:(t,n)=>he(t,n,e)}),q=(0,z.useMemo)(()=>new Set(G.map(t=>R(t,e))),[e,G]),be=(0,z.useMemo)(()=>({selectedItems:G,committedSelectedItems:N,selectedKeys:q,open:k}),[N,G,k,q]),J=(0,z.useCallback)(e=>y?.(e,be)??!1,[y,be]),{activeIndex:Y,context:xe,floatingStyles:Se,getFloatingProps:Ce,setReference:we,setFloating:Te,setOptionRef:Ee,close:De,openList:Oe,toggleOpen:ke,selectActiveOption:Ae,handleReferenceKeyDown:je,handleFloatingKeyDown:Me,getOptionId:Ne,getActiveOptionId:Pe}=ae({options:W,selectedIndex:ve,open:k,onOpenChange:A,onSelect:void 0,disabled:b,getOptionDisabled:J,closeOnSelect:!1,allowOpenWithoutOptions:!0,triggerMode:M}),Fe=h??L,X=t=>{let n=R(t,e);K(r=>r.some(t=>R(t,e)===n)?r.filter(t=>R(t,e)!==n):J(t)?r:[...r,t])},Ie=e=>{if(O.current=e,typeof D==`function`){D(e);return}D&&(D.current=e)},Le=()=>{K([]),k||a([])},Re=()=>{K(t=>{let n=[...t],r=new Set(t.map(t=>R(t,e)));for(let t of W){let i=R(t,e);!r.has(i)&&!J(t)&&(r.add(i),n.push(t))}return n})},ze=()=>{K([])},Z=e=>{J(e)||(K([e]),De())},Be=k?G:N,Ve=Be.length>0,He={selectedItems:Be,committedSelectedItems:N,availableItems:U,query:L,open:k,clearSelection:Le,selectAll:Re,deselectAll:ze},Ue=C===void 0?ue({codeKey:e,textKey:I}):C,We=w===void 0?de:w,Ge=T??fe({codeKey:e,textKey:I,hideCode:n}),Ke=typeof Ue==`function`?Ue(He):null,qe=typeof We==`function`?We(He):null,Q=H.map((e,t)=>({item:e,index:t})),Je=U.map((e,t)=>({item:e,index:t+Q.length})),Ye=!S&&!x&&W.length===0,$=se({mode:M,open:k,currentQuery:L,hasDisplayValue:!1,inputRef:O,setQuery:V,openList:Oe,close:De,toggleOpen:ke,onBeforeOpen:()=>{k||ye()}});return(0,B.jsx)(ne,{label:o,description:s,disabled:b,placeholder:c,size:u,className:E.multiSelect,children:({controlId:t,labelId:n,describedBy:r})=>{let i=`${t}-listbox`;return(0,B.jsxs)(B.Fragment,{children:[(0,B.jsx)(oe,{ref:Ie,rootRef:we,id:t,type:`text`,role:`combobox`,autoComplete:`off`,disabled:b,value:L,placeholder:Ve?void 0:c,"aria-labelledby":n,"aria-describedby":r,"aria-haspopup":`listbox`,"aria-expanded":k,"aria-controls":k?i:void 0,"aria-autocomplete":`list`,"aria-activedescendant":k?Pe(i):void 0,rootClassName:`flex alignItemsCenter`,endAdornment:(0,B.jsxs)(m,{open:k,disabled:b,onToggleMouseDown:$.handleToggleMouseDown,onToggleClick:$.handleToggleClick,children:[Ke,(0,B.jsx)(`button`,{type:`button`,disabled:!Ve,className:l.uiClearButton,"data-ui":`multi-select-clear-button`,"data-action":`clear-multi-select`,onClick:Le,"aria-label":`Очистить все`,children:(0,B.jsx)(ee,{})})]}),onChange:e=>{$.handleTriggerInputChange(e.target.value)},onClick:$.handleTriggerClick,onFocus:e=>{$.handleTriggerFocus(e.currentTarget)},onKeyDown:e=>{je(e),!e.defaultPrevented&&$.handleTriggerKeyDown({event:e,onActivateWhenOpen:()=>{if(Y>=0){let e=W[Y];if(e){X(e);return}}Ae()},enableClosedArrowDownOpen:!0,suppressClosedArrowUp:!0})}}),(0,B.jsx)(re,{open:k,context:xe,floatingStyles:Se,listId:i,labelId:n,descriptionId:r,activeOptionId:k?Pe(i):void 0,setFloating:Te,getFloatingProps:Ce,onKeyDown:Me,initialFocus:-1,returnFocus:!1,tabIndex:-1,className:l.uiPopupOptions,header:qe,children:(0,B.jsx)(pe,{isNoData:Ye,isLoading:S,error:x,children:(0,B.jsxs)(`div`,{className:`scrollable h100`,children:[(0,B.jsx)(ge,{entries:Q,listId:i,activeIndex:Y,selectedKeys:q,codeKey:e,query:L,highlightQuery:Fe,getOptionDisabled:J,getOptionId:Ne,setOptionRef:Ee,toggleOption:X,selectOnlyOption:Z,renderItem:Ge}),Q.length>0&&F.length>0&&(0,B.jsx)(ie,{className:`marginBlockSm`}),(0,B.jsx)(ge,{entries:Je,listId:i,activeIndex:Y,selectedKeys:q,codeKey:e,query:L,highlightQuery:Fe,getOptionDisabled:J,getOptionId:Ne,setOptionRef:Ee,toggleOption:X,selectOnlyOption:Z,renderItem:Ge})]})})})]})}})}),V.displayName=`MultiSelect`,V.__docgenInfo={description:`Поле множественного выбора с внутренним черновиком значений и подтверждением выбора при закрытии списка.
|
|
1
|
+
import{c as e,i as t}from"./preload-helper-B45gAKPr.js";import{C as n}from"./iframe-YecJO4uV.js";import{t as r}from"./jsx-runtime-BBQGix-2.js";import{a as i,i as a}from"./utils-Bnd9AQDU.js";import{o as ee,t as o}from"./lucide-react-DoqvsuDx.js";import{i as s,t as c}from"./text-CQF6O5fh.js";import{n as l,t as u}from"./ui.module-wFHXkJzp.js";import{t as te}from"./CheckBox-CS0rOTN7.js";import{D as ne,S as re,T as ie,a as d,b as f,d as p,g as m,l as ae,m as oe,r as se,s as ce,t as h,v as g,w as _}from"./picker-Cs_HmTIT.js";import{n as v,t as le}from"./SelectOptionContent-C3tgB8Dy.js";import{t as y}from"./check-box-9iBlFoJu.js";function b({item:e,textKey:t,codeKey:n,highlight:r}){return(0,x.jsx)(le,{label:e[t],code:n&&e[n],highlight:r})}var x,S=t((()=>{v(),x=r(),b.__docgenInfo={description:"Отдельная опция внутри `MultiSelect`. Отрисовывает состояние выбора и подсветку текста для найденных совпадений.",methods:[],displayName:`MultiSelectOption`,props:{item:{required:!0,tsType:{name:`CollectionItem`},description:``},textKey:{required:!0,tsType:{name:`string`},description:``},codeKey:{required:!1,tsType:{name:`string`},description:``},highlight:{required:!1,tsType:{name:`string`},description:``},selected:{required:!0,tsType:{name:`boolean`},description:``}}}})),C,w,T,E,D=t((()=>{C=`_9oSdQi`,w=`iobHig`,T=`yatXso`,E={multiSelect:C,multiSelectTokens:w,multiSelectToken:T}}));function O({value:e}){return e?(0,k.jsx)(`div`,{className:E.multiSelectTokens,children:(0,k.jsx)(`div`,{className:E.multiSelectToken,children:e})}):null}var k,A=t((()=>{D(),k=r(),O.__docgenInfo={description:"Токен выбранного значения в `MultiSelect`. Показывает выбранный элемент и кнопку его удаления из текущего набора.",methods:[],displayName:`MultiSelectToken`,props:{value:{required:!0,tsType:{name:`union`,raw:`string | undefined`,elements:[{name:`string`},{name:`undefined`}]},description:``}}}}));function j(e,t,n){if(n)return n;let r=e[0];return r?Object.keys(r).find(e=>e!==t)??t:t}function M(e,t,n){if(e.length===0)return;if(e.length>1)return`${e.length} элементов`;let r=j(e,t,n);return e[0]?.[r]??e[0]?.[t]}function ue(e){return function(t){return(0,N.jsx)(O,{value:M(t.selectedItems,e.codeKey,e.textKey)})}}function de(e){return(0,N.jsx)(f,{onSelectAll:e.selectAll,onDeselectAll:e.deselectAll})}function fe(e){return function(t,n){return(0,N.jsx)(b,{item:t,selected:n.selected,highlight:n.highlightQuery,textKey:j([t],e.codeKey,e.textKey),codeKey:e.hideCode?void 0:e.codeKey})}}var N,P=t((()=>{h(),S(),A(),N=r(),de.__docgenInfo={description:``,methods:[],displayName:`renderDefaultMultiSelectToolbar`,props:{selectedItems:{required:!0,tsType:{name:`Array`,elements:[{name:`CollectionItem`}],raw:`CollectionItem[]`},description:``},committedSelectedItems:{required:!0,tsType:{name:`Array`,elements:[{name:`CollectionItem`}],raw:`CollectionItem[]`},description:``},availableItems:{required:!0,tsType:{name:`Array`,elements:[{name:`CollectionItem`}],raw:`CollectionItem[]`},description:``},query:{required:!0,tsType:{name:`string`},description:``},open:{required:!0,tsType:{name:`boolean`},description:``},clearSelection:{required:!0,tsType:{name:`signature`,type:`function`,raw:`() => void`,signature:{arguments:[],return:{name:`void`}}},description:``},selectAll:{required:!0,tsType:{name:`signature`,type:`function`,raw:`() => void`,signature:{arguments:[],return:{name:`void`}}},description:``},deselectAll:{required:!0,tsType:{name:`signature`,type:`function`,raw:`() => void`,signature:{arguments:[],return:{name:`void`}}},description:``}}}}));function F({text:e,isError:t}){return(0,I.jsxs)(`div`,{className:l.uiPopupOption,children:[(0,I.jsx)(`span`,{className:l.uiPopupOptionIcon}),(0,I.jsx)(s,{color:t?`error`:`primary`,children:e})]})}var I,L=t((()=>{c(),u(),I=r(),F.__docgenInfo={description:"Скелетон строки опции для `MultiSelect`. Используется во время загрузки или при отображении ошибок получения списка.",methods:[],displayName:`MultiSelectOptionSkeleton`,props:{text:{required:!0,tsType:{name:`string`},description:``},isError:{required:!1,tsType:{name:`boolean`},description:``}}}}));function pe({isNoData:e,isLoading:t,error:n,children:r}){return e?(0,B.jsx)(g,{emptyState:(0,B.jsx)(F,{text:`Нет данных`})}):t?(0,B.jsx)(g,{loadingState:(0,B.jsx)(F,{text:`Загрузка...`})}):n?(0,B.jsx)(g,{errorState:(0,B.jsx)(F,{isError:!0,text:`Ошибка загрузки`})}):(0,B.jsx)(B.Fragment,{children:r})}function R(e,t){return e[t]}function me(e,t,n){return Array.from(new Set([e[n],e[t],...Object.values(e)]))}function he(e,t,n){if(e.length!==t.length)return!1;let r=new Set(t.map(e=>R(e,n)));return e.every(e=>r.has(R(e,n)))}function ge({entries:e,listId:t,activeIndex:n,selectedKeys:r,codeKey:a,query:ee,highlightQuery:o,getOptionDisabled:s,getOptionId:c,setOptionRef:u,toggleOption:ne,selectOnlyOption:re,renderItem:ie}){return e.map(({item:e,index:d})=>{let f=d===n,p=r.has(R(e,a)),m=s?.(e)??!1;return(0,B.jsxs)(`div`,{id:c(t,d),ref:e=>u(d,e),role:`option`,"aria-selected":p,"aria-disabled":m||void 0,className:i(l.uiSelectOption,m&&l.disabled,p&&l.selected,f&&l.uiPopupOptionActive),onMouseDown:e=>{e.preventDefault()},children:[(0,B.jsx)(`div`,{onClick:e=>{e.stopPropagation()},children:(0,B.jsx)(te,{value:p,disabled:m,onChange:()=>{m||ne(e)},onClick:e=>{e.stopPropagation()},onMouseDown:e=>{e.stopPropagation()}})}),(0,B.jsx)(`div`,{className:`overflowHidden`,onClick:()=>{m||re(e)},children:ie(e,{selected:p,active:f,disabled:m,query:ee,highlightQuery:o})})]},`${R(e,a)}-${d}`)})}var z,B,_e,V,H=t((()=>{z=e(n(),1),a(),o(),y(),h(),_(),u(),P(),D(),L(),B=r(),_e=[],V=(0,z.forwardRef)(({codeKey:e,textKey:t,hideCode:n,items:r,value:i,onChange:a,label:o,description:s,placeholder:c,size:u,query:te,defaultQuery:f,highlightQuery:h,onQuery:g,defaultFilter:_=!0,onOpen:v,onClose:le,getOptionDisabled:y,disabled:b,error:x,isLoading:S,renderToken:C,renderToolbar:w,renderItem:T},D)=>{let O=(0,z.useRef)(null),[k,A]=(0,z.useState)(!1),M=`search-multi`,N=i??_e,P=(0,z.useMemo)(()=>new Set(N.map(t=>R(t,e))),[e,N]),F=(0,z.useMemo)(()=>r.filter(t=>!P.has(R(t,e))),[e,P,r]),I=(0,z.useMemo)(()=>j([...N,...r],e,t),[e,N,r,t]),{query:L,setQuery:V}=ce({open:k,query:te,defaultQuery:f,onQuery:g,triggerMode:M}),H=p({options:N,query:L,enabled:_,getSearchText:t=>me(t,e,I)}),U=p({options:F,query:L,enabled:_,getSearchText:t=>me(t,e,I)}),W=(0,z.useMemo)(()=>[...H,...U],[U,H]),ve=H.length>0?0:-1,{draftValue:G,setDraftValue:K,prepareOpen:ye}=d({value:N,open:k,onCommit:a,onOpen:v,onClose:le,isEqual:(t,n)=>he(t,n,e)}),q=(0,z.useMemo)(()=>new Set(G.map(t=>R(t,e))),[e,G]),be=(0,z.useMemo)(()=>({selectedItems:G,committedSelectedItems:N,selectedKeys:q,open:k}),[N,G,k,q]),J=(0,z.useCallback)(e=>y?.(e,be)??!1,[y,be]),{activeIndex:Y,context:xe,floatingStyles:Se,getFloatingProps:Ce,setReference:we,setFloating:Te,setOptionRef:Ee,close:De,openList:Oe,toggleOpen:ke,selectActiveOption:Ae,handleReferenceKeyDown:je,handleFloatingKeyDown:Me,getOptionId:Ne,getActiveOptionId:Pe}=ae({options:W,selectedIndex:ve,open:k,onOpenChange:A,onSelect:void 0,disabled:b,getOptionDisabled:J,closeOnSelect:!1,allowOpenWithoutOptions:!0,triggerMode:M}),Fe=h??L,X=t=>{let n=R(t,e);K(r=>r.some(t=>R(t,e)===n)?r.filter(t=>R(t,e)!==n):J(t)?r:[...r,t])},Ie=e=>{if(O.current=e,typeof D==`function`){D(e);return}D&&(D.current=e)},Le=()=>{K([]),k||a([])},Re=()=>{K(t=>{let n=[...t],r=new Set(t.map(t=>R(t,e)));for(let t of W){let i=R(t,e);!r.has(i)&&!J(t)&&(r.add(i),n.push(t))}return n})},ze=()=>{K([])},Z=e=>{J(e)||(K([e]),De())},Be=k?G:N,Ve=Be.length>0,He={selectedItems:Be,committedSelectedItems:N,availableItems:U,query:L,open:k,clearSelection:Le,selectAll:Re,deselectAll:ze},Ue=C===void 0?ue({codeKey:e,textKey:I}):C,We=w===void 0?de:w,Ge=T??fe({codeKey:e,textKey:I,hideCode:n}),Ke=typeof Ue==`function`?Ue(He):null,qe=typeof We==`function`?We(He):null,Q=H.map((e,t)=>({item:e,index:t})),Je=U.map((e,t)=>({item:e,index:t+Q.length})),Ye=!S&&!x&&W.length===0,$=se({mode:M,open:k,currentQuery:L,hasDisplayValue:!1,inputRef:O,setQuery:V,openList:Oe,close:De,toggleOpen:ke,onBeforeOpen:()=>{k||ye()}});return(0,B.jsx)(ne,{label:o,description:s,disabled:b,placeholder:c,size:u,className:E.multiSelect,children:({controlId:t,labelId:n,describedBy:r})=>{let i=`${t}-listbox`;return(0,B.jsxs)(B.Fragment,{children:[(0,B.jsx)(oe,{ref:Ie,rootRef:we,id:t,type:`text`,role:`combobox`,autoComplete:`off`,disabled:b,value:L,placeholder:Ve?void 0:c,"aria-labelledby":n,"aria-describedby":r,"aria-haspopup":`listbox`,"aria-expanded":k,"aria-controls":k?i:void 0,"aria-autocomplete":`list`,"aria-activedescendant":k?Pe(i):void 0,rootClassName:`flex alignItemsCenter`,endAdornment:(0,B.jsxs)(m,{open:k,disabled:b,onToggleMouseDown:$.handleToggleMouseDown,onToggleClick:$.handleToggleClick,children:[Ke,(0,B.jsx)(`button`,{type:`button`,disabled:!Ve,className:l.uiClearButton,"data-ui":`multi-select-clear-button`,"data-action":`clear-multi-select`,onClick:Le,"aria-label":`Очистить все`,children:(0,B.jsx)(ee,{})})]}),onChange:e=>{$.handleTriggerInputChange(e.target.value)},onClick:$.handleTriggerClick,onFocus:e=>{$.handleTriggerFocus(e.currentTarget)},onKeyDown:e=>{je(e),!e.defaultPrevented&&$.handleTriggerKeyDown({event:e,onActivateWhenOpen:()=>{if(Y>=0){let e=W[Y];if(e){X(e);return}}Ae()},enableClosedArrowDownOpen:!0,suppressClosedArrowUp:!0})}}),(0,B.jsx)(re,{open:k,context:xe,floatingStyles:Se,listId:i,labelId:n,descriptionId:r,activeOptionId:k?Pe(i):void 0,setFloating:Te,getFloatingProps:Ce,onKeyDown:Me,initialFocus:-1,returnFocus:!1,tabIndex:-1,className:l.uiPopupOptions,header:qe,children:(0,B.jsx)(pe,{isNoData:Ye,isLoading:S,error:x,children:(0,B.jsxs)(`div`,{className:`scrollable h100`,children:[(0,B.jsx)(ge,{entries:Q,listId:i,activeIndex:Y,selectedKeys:q,codeKey:e,query:L,highlightQuery:Fe,getOptionDisabled:J,getOptionId:Ne,setOptionRef:Ee,toggleOption:X,selectOnlyOption:Z,renderItem:Ge}),Q.length>0&&F.length>0&&(0,B.jsx)(ie,{className:`marginBlockSm`}),(0,B.jsx)(ge,{entries:Je,listId:i,activeIndex:Y,selectedKeys:q,codeKey:e,query:L,highlightQuery:Fe,getOptionDisabled:J,getOptionId:Ne,setOptionRef:Ee,toggleOption:X,selectOnlyOption:Z,renderItem:Ge})]})})})]})}})}),V.displayName=`MultiSelect`,V.__docgenInfo={description:`Поле множественного выбора с внутренним черновиком значений и подтверждением выбора при закрытии списка.
|
|
2
2
|
Подходит как для самостоятельного использования, так и как базовый слой для OData-оберток.`,methods:[],displayName:`MultiSelect`,props:{renderToken:{required:!1,tsType:{name:`union`,raw:`((context: TContext) => React.ReactNode) | null | false`,elements:[{name:`unknown`},{name:`null`},{name:`literal`,value:`false`}]},description:``},renderToolbar:{required:!1,tsType:{name:`union`,raw:`((context: TContext) => React.ReactNode) | null | false`,elements:[{name:`unknown`},{name:`null`},{name:`literal`,value:`false`}]},description:``},renderItem:{required:!1,tsType:{name:`signature`,type:`function`,raw:`(item: CollectionItem, state: MultiSelectItemState) => React.ReactNode`,signature:{arguments:[{type:{name:`CollectionItem`},name:`item`},{type:{name:`MultiSelectItemState`},name:`state`}],return:{name:`ReactReactNode`,raw:`React.ReactNode`}}},description:``},label:{required:!1,tsType:{name:`ReactNode`},description:``},description:{required:!1,tsType:{name:`string`},description:``},placeholder:{required:!1,tsType:{name:`string`},description:``},disabled:{required:!1,tsType:{name:`boolean`},description:``},size:{required:!1,tsType:{name:`union`,raw:`"xs" | "sm" | "md" | "lg" | "xl"`,elements:[{name:`literal`,value:`"xs"`},{name:`literal`,value:`"sm"`},{name:`literal`,value:`"md"`},{name:`literal`,value:`"lg"`},{name:`literal`,value:`"xl"`}]},description:``},value:{required:!0,tsType:{name:`V`},description:"Если начальное состояние может быть `null | undefined`\nзначит `onChange` тоже должен ументь сбрасывать.\nПоэтому такой контрол явно должен передавать `UiBaseProps<AnyType | undefined>`"},onChange:{required:!0,tsType:{name:`signature`,type:`function`,raw:`(value: T) => void`,signature:{arguments:[{type:{name:`C`},name:`value`}],return:{name:`void`}}},description:``},codeKey:{required:!0,tsType:{name:`string`},description:``},textKey:{required:!1,tsType:{name:`string`},description:``},hideCode:{required:!1,tsType:{name:`boolean`},description:``},query:{required:!1,tsType:{name:`string`},description:``},defaultQuery:{required:!1,tsType:{name:`string`},description:``},highlightQuery:{required:!1,tsType:{name:`string`},description:``},onQuery:{required:!1,tsType:{name:`signature`,type:`function`,raw:`(value: string) => void`,signature:{arguments:[{type:{name:`string`},name:`value`}],return:{name:`void`}}},description:``},defaultFilter:{required:!1,tsType:{name:`boolean`},description:``,defaultValue:{value:`true`,computed:!1}},items:{required:!0,tsType:{name:`Array`,elements:[{name:`TOption`}],raw:`TOption[]`},description:``},getOptionDisabled:{required:!1,tsType:{name:`signature`,type:`function`,raw:`(item: TOption, context: MultiSelectOptionDisableContext) => boolean`,signature:{arguments:[{type:{name:`TOption`},name:`item`},{type:{name:`MultiSelectOptionDisableContext`},name:`context`}],return:{name:`boolean`}}},description:``},onOpen:{required:!1,tsType:{name:`signature`,type:`function`,raw:`() => void`,signature:{arguments:[],return:{name:`void`}}},description:``},onClose:{required:!1,tsType:{name:`signature`,type:`function`,raw:`(value: TOption[]) => void`,signature:{arguments:[{type:{name:`Array`,elements:[{name:`TOption`}],raw:`TOption[]`},name:`value`}],return:{name:`void`}}},description:``},error:{required:!1,tsType:{name:`string`},description:``},isLoading:{required:!1,tsType:{name:`boolean`},description:``}}}}));export{A as i,H as n,O as r,V as t};
|
package/storybook-static/assets/{MultiSelect.stories-Dehifk12.js → MultiSelect.stories-OSUoI8LD.js}
RENAMED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{a as e,c as t,i as n}from"./preload-helper-B45gAKPr.js";import{C as r}from"./iframe-
|
|
1
|
+
import{a as e,c as t,i as n}from"./preload-helper-B45gAKPr.js";import{C as r}from"./iframe-YecJO4uV.js";import{t as i}from"./jsx-runtime-BBQGix-2.js";import{n as a,t as o}from"./MultiSelect-ZiS4jg7j.js";var s=e({Basic:()=>f,Empty:()=>h,ErrorState:()=>m,Loading:()=>p,__namedExportsOrder:()=>g,default:()=>d}),c,l,u,d,f,p,m,h,g,_=n((()=>{c=t(r(),1),a(),l=i(),u=[{code:`MOW`,label:`Москва`},{code:`SPB`,label:`Санкт-Петербург`},{code:`EKB`,label:`Екатеринбург`},{code:`KZN`,label:`Казань`},{code:`NSK`,label:`Новосибирск`}],d={title:`Shared/UI/MultiSelect`,component:o,args:{label:`Города`,description:`Выберите несколько значений.`,placeholder:`Начните вводить`,value:[],onChange:()=>{},codeKey:`code`,textKey:`label`,items:u,query:``,onQuery:()=>{},onOpen:()=>{},onClose:()=>{},size:`md`,disabled:!1},parameters:{atomicCanvas:!0,layout:`padded`},argTypes:{value:{control:!1},onChange:{control:!1},items:{control:!1},onQuery:{control:!1},onOpen:{control:!1},onClose:{control:!1},renderToken:{control:!1},renderToolbar:{control:!1},renderItem:{control:!1},size:{control:`select`,options:[`xs`,`sm`,`md`,`lg`,`xl`]}}},f={render:e=>{let[t,n]=(0,c.useState)([u[1]]),[r,i]=(0,c.useState)(``),a=(0,c.useMemo)(()=>{let e=r.trim().toLowerCase();return e?u.filter(t=>t.label.toLowerCase().includes(e)||t.code.toLowerCase().includes(e)):u},[r]);return(0,l.jsx)(o,{...e,value:t,items:a,query:r,onQuery:i,onChange:n})}},p={render:e=>{let[t,n]=(0,c.useState)([]);return(0,l.jsx)(o,{...e,value:t,items:[],isLoading:!0,onChange:n})}},m={render:e=>{let[t,n]=(0,c.useState)([]);return(0,l.jsx)(o,{...e,value:t,items:[],error:`Ошибка загрузки`,onChange:n})}},h={render:e=>{let[t,n]=(0,c.useState)([]);return(0,l.jsx)(o,{...e,value:t,items:[],onChange:n})}},f.parameters={...f.parameters,docs:{...f.parameters?.docs,source:{originalSource:`{
|
|
2
2
|
render: args => {
|
|
3
3
|
const [value, setValue] = useState<CollectionItem[]>([catalog[1]]);
|
|
4
4
|
const [query, setQuery] = useState("");
|
package/storybook-static/assets/{NotificationsHost-D_unl67O.js → NotificationsHost-BxAkGSYp.js}
RENAMED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{i as e}from"./preload-helper-B45gAKPr.js";import{E as t,a as n,d as r,f as i,l as a,m as o,n as s,p as c,r as l,u}from"./blocks-
|
|
1
|
+
import{i as e}from"./preload-helper-B45gAKPr.js";import{E as t,a as n,d as r,f as i,l as a,m as o,n as s,p as c,r as l,u}from"./blocks-D8vTJCXn.js";import{t as d}from"./jsx-runtime-BBQGix-2.js";import{t as f}from"./mdx-react-shim-B6MYoAcj.js";import{InteractivePlayground as p,Showcase as m,n as h,t as g}from"./NotificationsHost.stories-DeTweOqX.js";function _(e){let o={code:`code`,h2:`h2`,h3:`h3`,li:`li`,p:`p`,pre:`pre`,ul:`ul`,...t(),...e.components};return(0,y.jsxs)(y.Fragment,{children:[(0,y.jsx)(a,{of:g,parameters:{docs:{toc:!0}}}),`
|
|
2
2
|
`,(0,y.jsx)(c,{children:`NotificationsHost`}),`
|
|
3
3
|
`,(0,y.jsx)(i,{children:`Хост глобальных уведомлений для очереди toast-сообщений и длинных пользовательских операций`}),`
|
|
4
4
|
`,(0,y.jsx)(o.p,{children:`NotificationsHost уже имеет живые stories, а эта страница собирает их в структурированную документацию с краткими рекомендациями, примерами подключения и API.
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{a as e,c as t,i as n}from"./preload-helper-B45gAKPr.js";import{C as r}from"./iframe-
|
|
1
|
+
import{a as e,c as t,i as n}from"./preload-helper-B45gAKPr.js";import{C as r}from"./iframe-YecJO4uV.js";import{t as i}from"./jsx-runtime-BBQGix-2.js";import{a,i as ee}from"./utils-Bnd9AQDU.js";import{Pt as te,R as o,S as s,ct as ne,f as re,it as c,m as ie,o as ae,t as l,u,ut as oe,wt as d}from"./lucide-react-DoqvsuDx.js";import{n as se,t as ce}from"./error-DI-le3_4.js";import{o as f}from"./Flex-CXJVQ7iV.js";import{t as le}from"./flex-BriuFrFs.js";import{t as p}from"./Button-DYvP70oK.js";import{t as m}from"./button-Cz3fiO2B.js";import{i as ue,n as de,r as fe,s as h,t as pe}from"./notifications-CAn9BB3F.js";function g({children:e}){let t=(0,y.useMemo)(()=>fe(),[]);return(0,y.useEffect)(()=>de(t),[t]),(0,b.jsx)(x.Provider,{value:t,children:e})}function _(){let e=(0,y.useContext)(x);if(!e)throw se({hookName:`useNotificationApi`,providerName:`NotificationsProvider`});return e}function me(){return h(_(),e=>e.items)}function v(){let e=h(_(),e=>e.actions),t=t=>(n,r)=>e.push({type:t,message:n,...r});return{...e,success:t(`success`),info:t(`info`),warning:t(`warning`),error:t(`error`)}}var y,b,x,S=n((()=>{y=t(r(),1),ce(),pe(),ue(),b=i(),x=(0,y.createContext)(null),g.__docgenInfo={description:`Провайдер уведомлений приложения. Хранит состояние списка уведомлений и предоставляет хуки доступа к нему.`,methods:[],displayName:`NotificationsProvider`}})),he=n((()=>{S()})),C,w,T,E,D,O,k,ge,A,j,M,N,P,F,I,_e=n((()=>{C=`STGQ3g`,w=`RaiISE`,T=`cM81wO`,E=`nH2cuZ`,D=`A2glD7`,O=`yWjijS`,k=`_1HO2ne`,ge=`OyRJpj`,A=`vrCrow`,j=`A0X-ma`,M=`AkHvPV`,N=`_4YDLB5`,P=`CK3Bqv`,F=`nLmQut`,I={container:C,card:w,info:T,success:E,warning:D,error:O,header:k,content:ge,copy:A,icon:j,kicker:M,title:N,message:P,actions:F}}));function L(){let e=me(),{dismiss:t}=v();return(0,R.jsx)(`div`,{className:I.container,"aria-label":`Область уведомлений`,"aria-live":`polite`,"aria-relevant":`additions text`,children:e.map(e=>{let n=z[e.type],r=e.title??n.title,i=n.Icon;return(0,R.jsx)(`article`,{role:e.type===`error`?`alert`:`status`,"aria-atomic":`true`,className:a(I.card,I[e.type]),children:(0,R.jsxs)(f,{align:`start`,justify:`between`,gap:`sm`,className:I.header,children:[(0,R.jsxs)(f,{align:`start`,gap:`sm`,className:I.content,children:[(0,R.jsx)(`span`,{className:I.icon,"aria-hidden":`true`,children:(0,R.jsx)(i,{})}),(0,R.jsxs)(`div`,{className:I.copy,children:[(0,R.jsx)(`div`,{className:I.kicker,children:n.title}),e.title?(0,R.jsx)(`div`,{className:I.title,children:r}):null,(0,R.jsx)(`div`,{className:I.message,children:e.message}),e.actions?.length?(0,R.jsx)(`div`,{className:I.actions,children:e.actions.map(t=>(0,R.jsx)(p,{tone:t.tone??e.type,appearance:`outline`,"data-ui":`notification-action-button`,"data-action":`notification-action`,onClick:()=>void t.onClick(),children:t.label},t.label))}):null]})]}),e.dismissible===!1?null:(0,R.jsx)(p,{icon:(0,R.jsx)(ae,{}),appearance:`ghost`,tone:e.type,onClick:()=>t(e.id),"aria-label":`Закрыть уведомление`,"data-ui":`notification-dismiss-button`,"data-action":`dismiss-notification`})]})},e.id)})})}var R,z,ve=n((()=>{ee(),l(),m(),le(),S(),_e(),R=i(),z={info:{title:`Информация`,Icon:o},success:{title:`Успешно`,Icon:ne},warning:{title:`Предупреждение`,Icon:u},error:{title:`Ошибка`,Icon:oe}},L.__docgenInfo={description:`Хост для визуального отображения очереди уведомлений.
|
|
2
2
|
Обычно монтируется один раз на уровне приложения рядом с провайдером уведомлений.`,methods:[],displayName:`NotificationsHost`}})),ye=e({InteractivePlayground:()=>Z,Showcase:()=>X,__namedExportsOrder:()=>Q,default:()=>U});function be(){let{clear:e}=v();return(0,V.useEffect)(()=>(e(),()=>{e()}),[e]),null}function B({children:e}){return(0,H.jsxs)(g,{children:[(0,H.jsx)(be,{}),(0,H.jsx)(`div`,{style:W,children:(0,H.jsxs)(`div`,{style:G,children:[(0,H.jsxs)(`div`,{style:K,children:[(0,H.jsx)(`h2`,{style:{margin:0,fontSize:`var(--font-size-xl)`},children:`Демонстрация очереди уведомлений`}),(0,H.jsx)(`p`,{style:{margin:`12px 0 0`,color:`var(--content-1)`},children:"Хост закреплён в левом нижнем углу и использует общие токены проекта: `surface`, `content`, `status` и семантические `tone-*`. Внутри историй можно проверить лимит очереди, sticky-уведомления и сценарий длительной операции с обновлением одного уведомления."})]}),e]})}),(0,H.jsx)(L,{})]})}function xe(){let{clear:e,push:t}=v();return(0,V.useEffect)(()=>(e(),t({type:`info`,title:`Сетевой статус`,message:`Подключение к серверу восстановлено.`,ttlMs:6e3}),t({type:`success`,title:`Профиль обновлён`,message:`Изменения сохранены и отправлены в очередь на синхронизацию.`,ttlMs:4500}),t({type:`warning`,title:`Требуется внимание`,message:`Срок действия сессии истекает через 5 минут.`}),t({type:`error`,title:`Ошибка импорта`,message:`Не удалось загрузить журнал операций.
|
|
3
3
|
Повторите запрос или обратитесь к администратору.`}),()=>{e()}),[e,t]),(0,H.jsxs)(`div`,{style:J,children:[(0,H.jsx)(`h3`,{style:{margin:0},children:`Снимок состояний`}),(0,H.jsx)(`p`,{style:{margin:0,color:`var(--content-1)`},children:`История сразу заполняет очередь всеми типами уведомлений, чтобы оценить цвет, иконки, контраст и читаемость текста.`})]})}function Se(){let e=v(),t=(0,V.useRef)(null),[n,r]=(0,V.useState)(!1),i=()=>{t.current=null,r(!1)},a=(n,r)=>{let a=t.current;a&&(!e.update(a,{message:n,...r})||r?.type)&&i()};return(0,H.jsxs)(`div`,{style:q,children:[(0,H.jsxs)(`section`,{style:J,children:[(0,H.jsx)(`h3`,{style:{margin:0},children:`Базовые сценарии`}),(0,H.jsx)(`p`,{style:{margin:0,color:`var(--content-1)`},children:"Вызовы через `useNotify` подходят для UI-логики внутри React-компонентов."}),(0,H.jsxs)(`div`,{style:Y,children:[(0,H.jsx)(p,{tone:`info`,appearance:`outline`,icon:(0,H.jsx)(o,{}),onClick:()=>e.info(`Справочник обновлён по расписанию.`,{title:`Информация`,ttlMs:3500}),children:`Info`}),(0,H.jsx)(p,{tone:`success`,appearance:`solid`,icon:(0,H.jsx)(d,{}),onClick:()=>e.success(`Изменения сохранены.`,{title:`Операция завершена`,ttlMs:2500}),children:`Success`}),(0,H.jsx)(p,{tone:`warning`,appearance:`outline`,icon:(0,H.jsx)(u,{}),onClick:()=>e.warning(`Подтвердите действие в течение 2 минут.`,{title:`Требуется подтверждение`,dismissible:!1}),children:`Sticky warning`}),(0,H.jsx)(p,{tone:`error`,appearance:`solid`,icon:(0,H.jsx)(c,{}),onClick:()=>e.error(`Сервис проверки подписей недоступен.`,{title:`Критическая ошибка`}),children:`Error`})]})]}),(0,H.jsxs)(`section`,{style:J,children:[(0,H.jsx)(`h3`,{style:{margin:0},children:`Долгая операция`}),(0,H.jsx)(`p`,{style:{margin:0,color:`var(--content-1)`},children:"Сценарий имитирует `notify.progress`: создаёт одно sticky-уведомление и затем обновляет его по тому же `id`."}),(0,H.jsxs)(`div`,{style:Y,children:[(0,H.jsx)(p,{variant:`neutralOutline`,icon:(0,H.jsx)(te,{}),onClick:()=>{let n=e.push({type:`info`,title:`Экспорт архива`,message:`Подготавливаю пакет документов...`,dismissible:!1});t.current=n,r(!0)},children:`Запустить`}),(0,H.jsx)(p,{variant:`neutralOutline`,icon:(0,H.jsx)(s,{}),onClick:()=>{a(`Обработано 68% записей. Формирую итоговый архив...`)},disabled:!n,children:`Обновить прогресс`}),(0,H.jsx)(p,{tone:`success`,appearance:`outline`,icon:(0,H.jsx)(d,{}),onClick:()=>{a(`Архив подготовлен и доступен для скачивания.`,{type:`success`,ttlMs:2500,dismissible:!0})},disabled:!n,children:`Завершить успешно`}),(0,H.jsx)(p,{tone:`error`,appearance:`outline`,icon:(0,H.jsx)(c,{}),onClick:()=>{a(`Не удалось собрать архив из-за ошибки чтения вложений.`,{type:`error`,ttlMs:5e3,dismissible:!0})},disabled:!n,children:`Завершить ошибкой`})]})]}),(0,H.jsxs)(`section`,{style:J,children:[(0,H.jsx)(`h3`,{style:{margin:0},children:`Очередь и очистка`}),(0,H.jsx)(`p`,{style:{margin:0,color:`var(--content-1)`},children:`Стор сохраняет не более 6 уведомлений. Кнопка ниже специально создаёт 8 элементов, чтобы проверить отсечение старых записей.`}),(0,H.jsxs)(`div`,{style:Y,children:[(0,H.jsx)(p,{variant:`neutralOutline`,icon:(0,H.jsx)(s,{}),onClick:()=>{for(let t=1;t<=8;t+=1)e.info(`Пакет ${t} поставлен в очередь на обработку.`,{title:`Задача ${t}`,ttlMs:8e3})},children:`Заполнить очередь`}),(0,H.jsx)(p,{tone:`info`,appearance:`outline`,icon:(0,H.jsx)(ie,{}),onClick:()=>e.info(`Это уведомление исчезнет автоматически через 2 секунды.`,{title:`TTL = 2000 мс`,ttlMs:2e3}),children:`Проверить TTL`}),(0,H.jsx)(p,{variant:`transparent`,icon:(0,H.jsx)(re,{}),onClick:()=>{i(),e.clear()},children:`Очистить всё`})]})]})]})}var V,H,U,W,G,K,q,J,Y,X,Z,Q,$=n((()=>{V=t(r(),1),l(),m(),he(),ve(),H=i(),U={title:`Shared/UI/Notifications`,component:L,parameters:{atomicCanvas:!0,layout:`fullscreen`,docs:{description:{component:`Компонент отображает очередь глобальных уведомлений поверх интерфейса. Истории ниже показывают внешний вид для разных статусов, работу автозакрытия, ограничение очереди и сценарий длительной операции с обновлением одного уведомления.`}}}},W={minHeight:`100vh`,padding:`32px 24px 160px`,background:`linear-gradient(180deg, color-mix(in srgb, var(--surface-1) 82%, transparent) 0%, var(--surface-0) 100%)`,color:`var(--content-0)`},G={maxWidth:1120,margin:`0 auto`,display:`grid`,gap:16},K={padding:20,border:`var(--border)`,borderRadius:`var(--radius-md)`,background:`var(--surface-0)`,boxShadow:`var(--shadow-sm)`},q={display:`grid`,gap:16,gridTemplateColumns:`repeat(auto-fit, minmax(280px, 1fr))`},J={padding:20,border:`var(--border)`,borderRadius:`var(--radius-md)`,background:`var(--surface-0)`,boxShadow:`var(--shadow-sm)`,display:`grid`,gap:12,alignContent:`start`},Y={display:`flex`,flexWrap:`wrap`,gap:10},X={render:()=>(0,H.jsx)(B,{children:(0,H.jsx)(xe,{})}),parameters:{docs:{description:{story:`Быстрый визуальный обзор: все статусы сразу добавляются в очередь после открытия истории.`}}}},Z={render:()=>(0,H.jsx)(B,{children:(0,H.jsx)(Se,{})}),parameters:{docs:{description:{story:`Интерактивный сценарий для проверки базовых уведомлений, длительной операции, лимита очереди и автозакрытия.`}}}},X.parameters={...X.parameters,docs:{...X.parameters?.docs,source:{originalSource:`{
|
|
4
4
|
render: () => <NotificationsStoryShell>
|
package/storybook-static/assets/{ODataMultiSelect-BzIPF3E7.js → ODataMultiSelect-C_BdWtjv.js}
RENAMED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{i as e}from"./preload-helper-B45gAKPr.js";import{C as t}from"./iframe-
|
|
1
|
+
import{i as e}from"./preload-helper-B45gAKPr.js";import{C as t}from"./iframe-YecJO4uV.js";import{t as n}from"./jsx-runtime-BBQGix-2.js";import{a as r,s as i}from"./odata-CCAAVsLr.js";import{n as a,r as o,t as s}from"./useODataSelectBase-C9E-wcFt.js";import{n as c,t as l}from"./MultiSelect-ZiS4jg7j.js";function u({odata:e,segment:t,model:n,value:r,dependencies:i,onChange:s}){let c=o({odata:e,segment:t,model:n,value:r,dependencies:i}),l=e=>{s(a(e,c.selectionKey))};return{...c,handleChange:l}}var d=e((()=>{s()})),f,p,m=e((()=>{t(),i(),d(),c(),f=n(),p=({odata:e,segment:t,model:n,label:i,description:a,disabled:o,value:s,dependencies:c,onChange:d,size:p})=>{let m=u({odata:e,segment:t,model:r(n),value:s,dependencies:c,onChange:d});return(0,f.jsx)(l,{label:i,description:a,size:p,codeKey:m.codeKey,textKey:m.textKey,hideCode:t.hideCode??e.hideCode,items:m.filteredItems,value:m.selectedItems,onChange:m.handleChange,onQuery:m.setQuery,query:m.query,defaultFilter:!1,highlightQuery:m.debouncedQuery,disabled:o||m.isLoading,placeholder:m.placeholder,error:m.isError?`Ошибка загрузки`:void 0})},p.__docgenInfo={description:``,methods:[],displayName:`ODataMultiSelect`}}));export{m as n,p as t};
|
package/storybook-static/assets/{ODataMultiSelect-C2zNSOWs.js → ODataMultiSelect-DOtG5b5p.js}
RENAMED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{i as e}from"./preload-helper-B45gAKPr.js";import{E as t,a as n,d as r,f as i,l as a,m as o,n as s,p as c,r as l,u}from"./blocks-
|
|
1
|
+
import{i as e}from"./preload-helper-B45gAKPr.js";import{E as t,a as n,d as r,f as i,l as a,m as o,n as s,p as c,r as l,u}from"./blocks-D8vTJCXn.js";import{t as d}from"./jsx-runtime-BBQGix-2.js";import{t as f}from"./mdx-react-shim-B6MYoAcj.js";import{BasicDivision as p,CollectionError as m,HideCode as h,LinkedFilters as g,LoadingState as _,MetadataError as v,SelectTextValue as y,StaticDependency as b,n as x,t as S}from"./ODataMultiSelect.stories-DZgOPx8i.js";function C(e){let o={code:`code`,h2:`h2`,h3:`h3`,li:`li`,p:`p`,pre:`pre`,ul:`ul`,...t(),...e.components};return(0,T.jsxs)(T.Fragment,{children:[(0,T.jsx)(a,{of:S,parameters:{docs:{toc:!0}}}),`
|
|
2
2
|
`,(0,T.jsx)(c,{children:`ODataMultiSelect`}),`
|
|
3
3
|
`,(0,T.jsx)(i,{children:`Мультиселект с загрузкой коллекций по OData и зависимостями от внешних фильтров`}),`
|
|
4
4
|
`,(0,T.jsx)(o.p,{children:`ODataMultiSelect уже имеет живые stories, а эта страница собирает их в структурированную документацию с краткими рекомендациями, примерами подключения и API.
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{a as e,c as t,i as n}from"./preload-helper-B45gAKPr.js";import{C as r}from"./iframe-
|
|
1
|
+
import{a as e,c as t,i as n}from"./preload-helper-B45gAKPr.js";import{C as r}from"./iframe-YecJO4uV.js";import{t as i}from"./jsx-runtime-BBQGix-2.js";import{a,i as o,n as s,r as c,s as l,t as u}from"./odataStoryFixtures-DePPyMUW.js";import{n as d,t as f}from"./ODataMultiSelect-C_BdWtjv.js";var p=e({BasicDivision:()=>y,CollectionError:()=>E,HideCode:()=>b,LinkedFilters:()=>C,LoadingState:()=>w,MetadataError:()=>T,SelectTextValue:()=>x,StaticDependency:()=>S,__namedExportsOrder:()=>D,default:()=>v});function m({initialValue:e=[],odata:t=s,model:n=u,segment:r=c,dependencies:i,label:a=`OData MultiSelect`,description:o}){let[l,d]=(0,g.useState)(e);return(0,_.jsxs)(`div`,{style:{display:`grid`,gap:12,maxWidth:520},children:[(0,_.jsx)(f,{label:a,description:o,odata:t,model:n,segment:r,value:l,dependencies:i,onChange:d}),(0,_.jsxs)(`div`,{style:{fontSize:`var(--font-size-sm)`,color:`var(--content-1)`},children:[`Текущее значение: `,l.length?l.join(`, `):`пусто`]})]})}function h(){let[e,t]=(0,g.useState)([a.region]),[n,r]=(0,g.useState)([a.branch,a.branchAlt]),[i,o]=(0,g.useState)([a.team]),[c,l]=(0,g.useState)([a.owner,a.ownerAlt]),d=e.length?{REGION:e}:void 0,p=e.length&&n.length?{REGION:e,BRANCH:n}:d,m=e.length&&n.length&&i.length?{REGION:e,BRANCH:n,TEAM:i}:p;return(0,_.jsxs)(`div`,{style:{display:`grid`,gap:16,maxWidth:720},children:[(0,_.jsx)(f,{label:`Регион`,description:`Корневой фильтр для цепочки. После смены значения downstream-фильтры сбрасываются.`,odata:s,model:{...u,codeKey:`REGION`},segment:{placeholder:`Регион`},value:e,onChange:e=>{t(e),r([]),o([]),l([])}}),(0,_.jsx)(f,{label:`Подразделение`,description:`Выбор нескольких подразделений внутри выбранных регионов.`,odata:s,model:{...u,codeKey:`BRANCH`},segment:{placeholder:`Подразделение`},dependencies:d,value:n,onChange:e=>{r(e),o([]),l([])}}),(0,_.jsx)(f,{label:`Команда`,description:`Третий уровень зависит от текущего набора подразделений.`,odata:s,model:{...u,codeKey:`TEAM`},segment:{placeholder:`Команда`},dependencies:p,value:i,onChange:e=>{o(e),l([])}}),(0,_.jsx)(f,{label:`Ответственный`,description:`Leaf-уровень для выбранных команд.`,odata:s,model:{...u,codeKey:`OWNER`},segment:{placeholder:`Ответственный`},dependencies:m,value:c,onChange:l}),(0,_.jsxs)(`div`,{style:{display:`grid`,gap:4,fontSize:`var(--font-size-sm)`,color:`var(--content-1)`},children:[(0,_.jsxs)(`div`,{children:[`Регион: `,e.length?e.join(`, `):`пусто`]}),(0,_.jsxs)(`div`,{children:[`Подразделение: `,n.length?n.join(`, `):`пусто`]}),(0,_.jsxs)(`div`,{children:[`Команда: `,i.length?i.join(`, `):`пусто`]}),(0,_.jsxs)(`div`,{children:[`Ответственный: `,c.length?c.join(`, `):`пусто`]})]})]})}var g,_,v,y,b,x,S,C,w,T,E,D,O=n((()=>{g=t(r(),1),o(),d(),_=i(),v={title:`Shared/UI/ODataMultiSelect`,component:f,decorators:[l],parameters:{atomicCanvas:!0,layout:`padded`,odataMockMode:`success`},args:{label:`Регион`,description:`Пример OData MultiSelect на основе конфигурации ui control.`,odata:s,model:u,segment:c,value:[],onChange:()=>{}},argTypes:{onChange:{control:!1},value:{control:!1},dependencies:{control:!1}}},y={name:`Базовый регион`,render:()=>(0,_.jsx)(m,{label:`Регион`,description:`Базовая настройка из multiSelectConfig: выбор кодов REGION с текстовым отображением.`,model:{...u,codeKey:`REGION`},segment:{placeholder:`Регион`},initialValue:[a.region]})},b={name:`Скрытый код`,render:()=>(0,_.jsx)(m,{label:`Подразделение`,description:`Сценарий segment.hideCode: в списке и токене показывается только текст без кода.`,model:{...u,codeKey:`BRANCH`},segment:{placeholder:`Подразделение`,hideCode:!0},initialValue:[a.branch,a.branchAlt]})},x={name:`Выбор текста вместо кода`,render:()=>(0,_.jsx)(m,{label:`Регион по тексту`,description:`Сценарий segment.selectText: наружу возвращаются текстовые значения, а не коды.`,model:{...u,codeKey:`REGION`},segment:{placeholder:`Регион`,selectText:!0},initialValue:[a.regionText]})},S={name:`Зависимость от региона`,render:()=>(0,_.jsx)(m,{label:`Подразделение c зависимостью`,description:`Фильтрация подразделений по уже выбранному региону через props.dependencies.`,model:{...u,codeKey:`BRANCH`},segment:{placeholder:`Подразделение`},dependencies:{REGION:[a.region]},initialValue:[a.branch]})},C={name:`Связанная цепочка фильтров`,render:()=>(0,_.jsx)(h,{})},w={name:`Состояние загрузки`,parameters:{odataMockMode:`loading`},render:()=>(0,_.jsx)(m,{label:`Команда`,description:`Mock с задержкой ответа, чтобы проверить loading-state и skeleton.`,model:{...u,codeKey:`TEAM`},segment:{placeholder:`Команда`}})},T={name:`Ошибка metadata`,parameters:{odataMockMode:`metadataError`},render:()=>(0,_.jsx)(m,{label:`Регион`,description:`Сервис возвращает ошибку metadata. Полезно для проверки поведения хука useODataEntity.`,model:{...u,codeKey:`REGION`},segment:{placeholder:`Регион`}})},E={name:`Ошибка коллекции`,parameters:{odataMockMode:`collectionError`},render:()=>(0,_.jsx)(m,{label:`Ответственный`,description:`Metadata доступна, но загрузка коллекции завершается ошибкой.`,model:{...u,codeKey:`OWNER`},segment:{placeholder:`Ответственный`}})},y.parameters={...y.parameters,docs:{...y.parameters?.docs,source:{originalSource:`{
|
|
2
2
|
name: "Базовый регион",
|
|
3
3
|
render: () => <StatefulODataMultiSelect label="Регион" description="Базовая настройка из multiSelectConfig: выбор кодов REGION с текстовым отображением." model={{
|
|
4
4
|
...baseModel,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{c as e,i as t}from"./preload-helper-B45gAKPr.js";import{C as n}from"./iframe-
|
|
1
|
+
import{c as e,i as t}from"./preload-helper-B45gAKPr.js";import{C as n}from"./iframe-YecJO4uV.js";import{t as r}from"./jsx-runtime-BBQGix-2.js";import{s as i}from"./Input-VtBvr4ox.js";import{t as a}from"./input-CVG4hDFt.js";import{n as o,t as s}from"./Select-BOgkP515.js";import{a as c,s as l}from"./odata-CCAAVsLr.js";import{r as u,t as d}from"./useODataSelectBase-C9E-wcFt.js";import{n as f,t as p}from"./SelectOptionContent-C3tgB8Dy.js";function m({odata:e,segment:t,model:n,value:r,dependencies:i,onChange:a}){let o=u({odata:e,segment:t,model:n,value:r?[r]:[],dependencies:i}),s=o.selectedItems[0],c=(0,h.useMemo)(()=>s?[s,...o.filteredItems]:o.filteredItems,[o.filteredItems,s]),l=e=>{a(e?.[o.selectionKey])};return{...o,selectedItem:s,options:c,handleChange:l}}var h,g=t((()=>{h=e(n(),1),d()}));function _(e,t,n){return e?t||Object.keys(e).find(e=>e!==n)||n:t||n}var v,y,b=t((()=>{n(),l(),a(),g(),o(),f(),v=r(),y=({odata:e,segment:t,model:n,size:r,label:a,description:o,disabled:l,value:u,dependencies:d,onChange:f,clearable:h})=>{let g=m({odata:e,segment:t,model:c(n),value:u,dependencies:d,onChange:f});if(g.isLoading)return(0,v.jsx)(i,{size:r,label:a,description:o});let y=t.hideCode??e.hideCode,b=_(g.selectedItem??g.options[0],g.textKey,g.codeKey);return(0,v.jsx)(s,{size:r,label:a,description:o,options:g.options,value:g.selectedItem,onChange:g.handleChange,getOptionKey:e=>e[g.codeKey],getOptionLabel:e=>e[b],getOptionCode:y?void 0:e=>e[g.codeKey],getOptionAriaLabel:e=>y||e[b]===e[g.codeKey]?String(e[b]):`${e[b]} ${e[g.codeKey]}`,renderValue:e=>(0,v.jsx)(p,{label:e[b],code:y?void 0:e[g.codeKey]}),renderOption:e=>(0,v.jsx)(p,{label:e[b],code:y?void 0:e[g.codeKey],highlight:g.debouncedQuery}),searchable:!0,query:g.query,onQuery:g.setQuery,defaultFilter:!1,disabled:l||g.isLoading,placeholder:g.placeholder,loadingState:`Загрузка...`,errorState:g.isError?`Ошибка загрузки`:void 0,emptyState:!g.isLoading&&!g.isError?`Нет данных`:void 0,clearable:h})},y.__docgenInfo={description:``,methods:[],displayName:`ODataSelect`,props:{label:{required:!1,tsType:{name:`ReactNode`},description:``},description:{required:!1,tsType:{name:`string`},description:``},placeholder:{required:!1,tsType:{name:`string`},description:``},disabled:{required:!1,tsType:{name:`boolean`},description:``},size:{required:!1,tsType:{name:`union`,raw:`"xs" | "sm" | "md" | "lg" | "xl"`,elements:[{name:`literal`,value:`"xs"`},{name:`literal`,value:`"sm"`},{name:`literal`,value:`"md"`},{name:`literal`,value:`"lg"`},{name:`literal`,value:`"xl"`}]},description:``},value:{required:!0,tsType:{name:`V`},description:"Если начальное состояние может быть `null | undefined`\nзначит `onChange` тоже должен ументь сбрасывать.\nПоэтому такой контрол явно должен передавать `UiBaseProps<AnyType | undefined>`"},onChange:{required:!0,tsType:{name:`signature`,type:`function`,raw:`(value: T) => void`,signature:{arguments:[{type:{name:`C`},name:`value`}],return:{name:`void`}}},description:``},clearable:{required:!1,tsType:{name:`boolean`},description:``}}}}));export{b as n,y as t};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{i as e}from"./preload-helper-B45gAKPr.js";import{E as t,a as n,d as r,f as i,l as a,m as o,n as s,p as c,r as l,u}from"./blocks-
|
|
1
|
+
import{i as e}from"./preload-helper-B45gAKPr.js";import{E as t,a as n,d as r,f as i,l as a,m as o,n as s,p as c,r as l,u}from"./blocks-D8vTJCXn.js";import{t as d}from"./jsx-runtime-BBQGix-2.js";import{t as f}from"./mdx-react-shim-B6MYoAcj.js";import{BasicDivision as p,CollectionError as m,HideCode as h,LinkedFilters as g,LoadingState as _,MetadataError as v,SelectTextValue as y,StaticDependency as b,n as x,t as S}from"./ODataSelect.stories-4fGnGP41.js";function C(e){let o={code:`code`,h2:`h2`,h3:`h3`,li:`li`,p:`p`,pre:`pre`,ul:`ul`,...t(),...e.components};return(0,T.jsxs)(T.Fragment,{children:[(0,T.jsx)(a,{of:S,parameters:{docs:{toc:!0}}}),`
|
|
2
2
|
`,(0,T.jsx)(c,{children:`ODataSelect`}),`
|
|
3
3
|
`,(0,T.jsx)(i,{children:`Single-select с загрузкой OData-справочника, поиском и зависимостями от внешних фильтров`}),`
|
|
4
4
|
`,(0,T.jsx)(o.p,{children:`ODataSelect уже имеет живые stories, а эта страница собирает их в структурированную документацию с краткими рекомендациями, примерами подключения и API.
|
package/storybook-static/assets/{ODataSelect.stories-BLVf1e2L.js → ODataSelect.stories-4fGnGP41.js}
RENAMED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{a as e,c as t,i as n}from"./preload-helper-B45gAKPr.js";import{C as r}from"./iframe-
|
|
1
|
+
import{a as e,c as t,i as n}from"./preload-helper-B45gAKPr.js";import{C as r}from"./iframe-YecJO4uV.js";import{t as i}from"./jsx-runtime-BBQGix-2.js";import{n as a,t as o}from"./ODataSelect-BK-HaXVe.js";import{a as s,i as c,n as l,r as u,s as d,t as f}from"./odataStoryFixtures-DePPyMUW.js";var p=e({BasicDivision:()=>y,CollectionError:()=>E,HideCode:()=>b,LinkedFilters:()=>C,LoadingState:()=>w,MetadataError:()=>T,SelectTextValue:()=>x,StaticDependency:()=>S,__namedExportsOrder:()=>D,default:()=>v});function m({initialValue:e,odata:t=l,model:n=f,segment:r=u,dependencies:i,label:a=`OData Select`,description:s}){let[c,d]=(0,g.useState)(e);return(0,_.jsxs)(`div`,{style:{display:`grid`,gap:12,maxWidth:520},children:[(0,_.jsx)(o,{label:a,description:s,odata:t,model:n,segment:r,value:c,dependencies:i,onChange:d}),(0,_.jsxs)(`div`,{style:{fontSize:`var(--font-size-sm)`,color:`var(--content-1)`},children:[`Текущее значение: `,c||`пусто`]})]})}function h(){let[e,t]=(0,g.useState)(s.region),[n,r]=(0,g.useState)(s.branch),[i,a]=(0,g.useState)(s.team),[c,u]=(0,g.useState)(s.owner),d=e?{REGION:[e]}:void 0,p=e&&n?{REGION:[e],BRANCH:[n]}:d,m=e&&n&&i?{REGION:[e],BRANCH:[n],TEAM:[i]}:p;return(0,_.jsxs)(`div`,{style:{display:`grid`,gap:16,maxWidth:720},children:[(0,_.jsx)(o,{label:`Регион`,description:`Первый фильтр в цепочке. Меняет доступный набор подразделений.`,odata:l,model:{...f,codeKey:`REGION`},segment:{placeholder:`Регион`},value:e,onChange:e=>{t(e),r(void 0),a(void 0),u(void 0)}}),(0,_.jsx)(o,{label:`Подразделение`,description:`Второй фильтр зависит от выбранного региона.`,odata:l,model:{...f,codeKey:`BRANCH`},segment:{placeholder:`Подразделение`},dependencies:d,value:n,onChange:e=>{r(e),a(void 0),u(void 0)}}),(0,_.jsx)(o,{label:`Команда`,description:`Третий фильтр зависит от сочетания региона и подразделения.`,odata:l,model:{...f,codeKey:`TEAM`},segment:{placeholder:`Команда`},dependencies:p,value:i,onChange:e=>{a(e),u(void 0)}}),(0,_.jsx)(o,{label:`Ответственный`,description:`Последний фильтр показывает leaf-узлы для выбранного пути.`,odata:l,model:{...f,codeKey:`OWNER`},segment:{placeholder:`Ответственный`},dependencies:m,value:c,onChange:u}),(0,_.jsxs)(`div`,{style:{display:`grid`,gap:4,fontSize:`var(--font-size-sm)`,color:`var(--content-1)`},children:[(0,_.jsxs)(`div`,{children:[`Регион: `,e||`пусто`]}),(0,_.jsxs)(`div`,{children:[`Подразделение: `,n||`пусто`]}),(0,_.jsxs)(`div`,{children:[`Команда: `,i||`пусто`]}),(0,_.jsxs)(`div`,{children:[`Ответственный: `,c||`пусто`]})]})]})}var g,_,v,y,b,x,S,C,w,T,E,D,O=n((()=>{g=t(r(),1),a(),c(),_=i(),v={title:`Shared/UI/ODataSelect`,component:o,decorators:[d],parameters:{atomicCanvas:!0,layout:`padded`,odataMockMode:`success`},args:{label:`Регион`,description:`Пример OData Select на основе конфигурации ui control.`,odata:l,model:f,segment:u,value:void 0,onChange:()=>{}},argTypes:{onChange:{control:!1},value:{control:!1},dependencies:{control:!1}}},y={name:`Базовый регион`,render:()=>(0,_.jsx)(m,{label:`Регион`,description:`Базовая настройка single-select для выбора кода REGION.`,model:{...f,codeKey:`REGION`},segment:{placeholder:`Регион`},initialValue:s.region})},b={name:`Скрытый код`,render:()=>(0,_.jsx)(m,{label:`Подразделение`,description:`Код скрыт и в выпадающем списке, и в выбранном значении.`,model:{...f,codeKey:`BRANCH`},segment:{placeholder:`Подразделение`,hideCode:!0},initialValue:s.branch})},x={name:`Выбор текста вместо кода`,render:()=>(0,_.jsx)(m,{label:`Регион по тексту`,description:`Снаружи хранится текстовое значение, а не код.`,model:{...f,codeKey:`REGION`},segment:{placeholder:`Регион`,selectText:!0},initialValue:s.regionText})},S={name:`Зависимость от региона`,render:()=>(0,_.jsx)(m,{label:`Подразделение c зависимостью`,description:`Фильтрация подразделений по уже выбранному региону через props.dependencies.`,model:{...f,codeKey:`BRANCH`},segment:{placeholder:`Подразделение`},dependencies:{REGION:[s.region]},initialValue:s.branch})},C={name:`Связанная цепочка фильтров`,render:()=>(0,_.jsx)(h,{})},w={name:`Состояние загрузки`,parameters:{odataMockMode:`loading`},render:()=>(0,_.jsx)(m,{label:`Команда`,description:`Mock с задержкой ответа, чтобы проверить loading-state.`,model:{...f,codeKey:`TEAM`},segment:{placeholder:`Команда`}})},T={name:`Ошибка metadata`,parameters:{odataMockMode:`metadataError`},render:()=>(0,_.jsx)(m,{label:`Регион`,description:`Сервис возвращает ошибку metadata.`,model:{...f,codeKey:`REGION`},segment:{placeholder:`Регион`}})},E={name:`Ошибка коллекции`,parameters:{odataMockMode:`collectionError`},render:()=>(0,_.jsx)(m,{label:`Ответственный`,description:`Metadata доступна, но загрузка коллекции завершается ошибкой.`,model:{...f,codeKey:`OWNER`},segment:{placeholder:`Ответственный`}})},y.parameters={...y.parameters,docs:{...y.parameters?.docs,source:{originalSource:`{
|
|
2
2
|
name: "Базовый регион",
|
|
3
3
|
render: () => <StatefulODataSelect label="Регион" description="Базовая настройка single-select для выбора кода REGION." model={{
|
|
4
4
|
...baseModel,
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{i as e}from"./preload-helper-B45gAKPr.js";import{E as t,a as n,d as r,f as i,l as a,m as o,n as s,p as c,r as l,u}from"./blocks-
|
|
1
|
+
import{i as e}from"./preload-helper-B45gAKPr.js";import{E as t,a as n,d as r,f as i,l as a,m as o,n as s,p as c,r as l,u}from"./blocks-D8vTJCXn.js";import{t as d}from"./jsx-runtime-BBQGix-2.js";import{t as f}from"./mdx-react-shim-B6MYoAcj.js";import{Basic as p,ErrorState as m,LoadingState as h,MixedSelection as g,ParentCompression as _,n as v,t as y}from"./ODataTreeMultiSelect.stories-CzufPwpi.js";function b(e){let o={code:`code`,h2:`h2`,p:`p`,...t(),...e.components};return(0,S.jsxs)(S.Fragment,{children:[(0,S.jsx)(a,{of:y,parameters:{docs:{toc:!0}}}),`
|
|
2
2
|
`,(0,S.jsx)(c,{children:`ODataTreeMultiSelect`}),`
|
|
3
3
|
`,(0,S.jsx)(i,{children:`Мультивыбор по одной OData-цепочке в виде дерева`}),`
|
|
4
4
|
`,(0,S.jsxs)(o.p,{children:[(0,S.jsx)(o.code,{children:`ODataTreeMultiSelect`}),` строит дерево из одной OData-цепочки и отдает наружу канонизированный выбор в формате `,(0,S.jsx)(o.code,{children:`Record<string, string[]>`}),`.`]}),`
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{a as e,c as t,i as n}from"./preload-helper-B45gAKPr.js";import{C as r}from"./iframe-
|
|
1
|
+
import{a as e,c as t,i as n}from"./preload-helper-B45gAKPr.js";import{C as r}from"./iframe-YecJO4uV.js";import{t as i}from"./jsx-runtime-BBQGix-2.js";import{a,i as o,n as s,o as c,s as l}from"./odataStoryFixtures-DePPyMUW.js";import{n as u,t as d}from"./useODataTreeData-CcHumE5U.js";import{n as f,t as p}from"./TreeMultiSelect-CMrKE4N1.js";function m({label:e,description:t,disabled:n,size:r,placeholder:i,query:a,defaultQuery:o,onQuery:s,optionsLayout:c,value:l,onChange:d,odata:f,segments:m,model:g}){let _=u({odata:f,segments:m,model:g});return(0,h.jsx)(p,{label:e,description:t,disabled:n||_.isLoading,size:r,placeholder:i??_.placeholder,nodes:_.nodes,value:l,onChange:d,query:a,defaultQuery:o,onQuery:s,optionsLayout:c,isLoading:_.isLoading,error:_.isError?`Ошибка загрузки`:void 0})}var h,g=n((()=>{d(),f(),h=i(),m.__docgenInfo={description:``,methods:[],displayName:`ODataTreeMultiSelect`,props:{model:{required:!1,tsType:{name:`ODataDependentBaseProps["model"]`,raw:`ODataDependentBaseProps["model"]`},description:``},placeholder:{required:!1,tsType:{name:`string`},description:``},query:{required:!1,tsType:{name:`string`},description:``},defaultQuery:{required:!1,tsType:{name:`string`},description:``},onQuery:{required:!1,tsType:{name:`signature`,type:`function`,raw:`(value: string) => void`,signature:{arguments:[{type:{name:`string`},name:`value`}],return:{name:`void`}}},description:``},optionsLayout:{required:!1,tsType:{name:`union`,raw:`"tree" | "columns"`,elements:[{name:`literal`,value:`"tree"`},{name:`literal`,value:`"columns"`}]},description:`Переключает способ показа загруженного OData-дерева, не меняя формат value и запросов.`}},composes:[`Omit`]}})),_=e({BalancedColumns:()=>T,Basic:()=>S,ErrorState:()=>D,LoadingState:()=>E,MixedSelection:()=>w,ParentCompression:()=>C,__namedExportsOrder:()=>O,default:()=>x});function v({initialValue:e={},odata:t=s,segments:n=c,label:r=`ODataTreeMultiSelect`,description:i,optionsLayout:a=`tree`}){let[o,l]=(0,y.useState)(e);return(0,b.jsxs)(`div`,{style:{display:`grid`,gap:12,maxWidth:520},children:[(0,b.jsx)(m,{label:r,description:i,odata:t,segments:n,value:o,onChange:l,optionsLayout:a}),(0,b.jsxs)(`div`,{style:{fontSize:`var(--font-size-sm)`,color:`var(--content-1)`},children:[`Текущее значение: `,JSON.stringify(o)]})]})}var y,b,x,S,C,w,T,E,D,O,k=n((()=>{y=t(r(),1),o(),g(),b=i(),x={title:`Shared/UI/ODataTreeMultiSelect`,component:m,decorators:[l],parameters:{atomicCanvas:!0,layout:`padded`,odataMockMode:`success`},args:{label:`OData дерево`,description:`Multi-select поверх одной OData-цепочки.`,odata:s,segments:c,value:{},onChange:()=>{}},argTypes:{segments:{control:!1},value:{control:!1},onChange:{control:!1}}},S={render:()=>(0,b.jsx)(v,{initialValue:{OWNER:[a.owner]}})},C={render:()=>(0,b.jsx)(v,{label:`Компрессия subtree`,description:`Пример, когда наружу уходит узел верхнего уровня вместо полного списка потомков.`,initialValue:{REGION:[a.region]}})},w={render:()=>(0,b.jsx)(v,{label:`Смешанный выбор`,description:`Смешанный frontier по соседним уровням в OData-дереве.`,initialValue:{BRANCH:[a.branch],OWNER:[a.ownerAlt]}})},T={render:()=>(0,b.jsx)(v,{label:`OData tree в столбцах`,description:`Все уровни открыты, а popup балансирует ширину и высоту по доступному viewport.`,optionsLayout:`columns`,initialValue:{BRANCH:[a.branch]}})},E={parameters:{odataMockMode:`loading`},render:()=>(0,b.jsx)(v,{description:`Сценарий загрузки дерева.`})},D={parameters:{odataMockMode:`collectionError`},render:()=>(0,b.jsx)(v,{description:`Сценарий ошибки загрузки дерева.`})},S.parameters={...S.parameters,docs:{...S.parameters?.docs,source:{originalSource:`{
|
|
2
2
|
render: () => <StatefulODataTreeMultiSelect initialValue={{
|
|
3
3
|
OWNER: [storyValues.owner]
|
|
4
4
|
}} />
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{i as e}from"./preload-helper-B45gAKPr.js";import{E as t,a as n,d as r,f as i,l as a,m as o,n as s,p as c,r as l,u}from"./blocks-
|
|
1
|
+
import{i as e}from"./preload-helper-B45gAKPr.js";import{E as t,a as n,d as r,f as i,l as a,m as o,n as s,p as c,r as l,u}from"./blocks-D8vTJCXn.js";import{t as d}from"./jsx-runtime-BBQGix-2.js";import{t as f}from"./mdx-react-shim-B6MYoAcj.js";import{Basic as p,ErrorState as m,LoadingState as h,SelectParent as g,n as _,t as v}from"./ODataTreeSelect.stories-jkE8YwLl.js";function y(e){let o={code:`code`,h2:`h2`,p:`p`,...t(),...e.components};return(0,x.jsxs)(x.Fragment,{children:[(0,x.jsx)(a,{of:v,parameters:{docs:{toc:!0}}}),`
|
|
2
2
|
`,(0,x.jsx)(c,{children:`ODataTreeSelect`}),`
|
|
3
3
|
`,(0,x.jsx)(i,{children:`Single-select по одной OData-цепочке в виде дерева`}),`
|
|
4
4
|
`,(0,x.jsxs)(o.p,{children:[(0,x.jsx)(o.code,{children:`ODataTreeSelect`}),` загружает одну OData-коллекцию, строит дерево по цепочке codeKey и позволяет выбрать любой узел.`]}),`
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{a as e,c as t,i as n}from"./preload-helper-B45gAKPr.js";import{C as r}from"./iframe-
|
|
1
|
+
import{a as e,c as t,i as n}from"./preload-helper-B45gAKPr.js";import{C as r}from"./iframe-YecJO4uV.js";import{t as i}from"./jsx-runtime-BBQGix-2.js";import{a,i as o,n as s,o as c,s as l}from"./odataStoryFixtures-DePPyMUW.js";import{n as u,t as d}from"./useODataTreeData-CcHumE5U.js";import{n as f,t as p}from"./TreeSelect-BLgkcb_I.js";function m({label:e,description:t,disabled:n,size:r,placeholder:i,query:a,defaultQuery:o,onQuery:s,value:c,onChange:l,odata:d,segments:f,model:m,clearable:g}){let _=u({odata:d,segments:f,model:m});return(0,h.jsx)(p,{label:e,description:t,disabled:n||_.isLoading,size:r,placeholder:i??_.placeholder,nodes:_.nodes,value:c,onChange:l,query:a,defaultQuery:o,onQuery:s,isLoading:_.isLoading,error:_.isError?`Ошибка загрузки`:void 0,clearable:g})}var h,g=n((()=>{d(),f(),h=i(),m.__docgenInfo={description:``,methods:[],displayName:`ODataTreeSelect`,props:{model:{required:!1,tsType:{name:`ODataDependentBaseProps["model"]`,raw:`ODataDependentBaseProps["model"]`},description:``},placeholder:{required:!1,tsType:{name:`string`},description:``},query:{required:!1,tsType:{name:`string`},description:``},defaultQuery:{required:!1,tsType:{name:`string`},description:``},onQuery:{required:!1,tsType:{name:`signature`,type:`function`,raw:`(value: string) => void`,signature:{arguments:[{type:{name:`string`},name:`value`}],return:{name:`void`}}},description:``},clearable:{required:!1,tsType:{name:`boolean`},description:``}},composes:[`Omit`]}})),_=e({Basic:()=>S,ErrorState:()=>T,LoadingState:()=>w,SelectParent:()=>C,__namedExportsOrder:()=>E,default:()=>x});function v({initialValue:e,odata:t=s,segments:n=c,label:r=`ODataTreeSelect`,description:i}){let[a,o]=(0,y.useState)(e);return(0,b.jsxs)(`div`,{style:{display:`grid`,gap:12,maxWidth:520},children:[(0,b.jsx)(m,{label:r,description:i,odata:t,segments:n,value:a,onChange:o}),(0,b.jsxs)(`div`,{style:{fontSize:`var(--font-size-sm)`,color:`var(--content-1)`},children:[`Текущее значение: `,a?`${a.codeKey}=${a.value}`:`пусто`]})]})}var y,b,x,S,C,w,T,E,D=n((()=>{y=t(r(),1),o(),g(),b=i(),x={title:`Shared/UI/ODataTreeSelect`,component:m,decorators:[l],parameters:{atomicCanvas:!0,layout:`padded`,odataMockMode:`success`},args:{label:`OData дерево`,description:`Single-select поверх одной OData-цепочки.`,odata:s,segments:c,value:void 0,onChange:()=>{}},argTypes:{segments:{control:!1},value:{control:!1},onChange:{control:!1}}},S={render:()=>(0,b.jsx)(v,{initialValue:{codeKey:`OWNER`,value:a.owner}})},C={render:()=>(0,b.jsx)(v,{label:`Выбор родителя`,description:`Проверка выбора узла верхнего уровня из OData-дерева.`,initialValue:{codeKey:`REGION`,value:a.region}})},w={parameters:{odataMockMode:`loading`},render:()=>(0,b.jsx)(v,{description:`Сценарий загрузки дерева.`})},T={parameters:{odataMockMode:`collectionError`},render:()=>(0,b.jsx)(v,{description:`Сценарий ошибки загрузки дерева.`})},S.parameters={...S.parameters,docs:{...S.parameters?.docs,source:{originalSource:`{
|
|
2
2
|
render: () => <StatefulODataTreeSelect initialValue={{
|
|
3
3
|
codeKey: "OWNER",
|
|
4
4
|
value: storyValues.owner
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{i as e}from"./preload-helper-B45gAKPr.js";import{E as t,a as n,d as r,f as i,l as a,m as o,n as s,p as c,r as l,u}from"./blocks-
|
|
1
|
+
import{i as e}from"./preload-helper-B45gAKPr.js";import{E as t,a as n,d as r,f as i,l as a,m as o,n as s,p as c,r as l,u}from"./blocks-D8vTJCXn.js";import{t as d}from"./jsx-runtime-BBQGix-2.js";import{t as f}from"./mdx-react-shim-B6MYoAcj.js";import{AllAllowedOptionsDisabled as p,AutoSwitchByRange as m,Controlled as h,Disabled as g,MonthAndYear as _,n as v,t as y}from"./PeriodSelect.stories-BAMIsSGE.js";function b(e){let o={code:`code`,h2:`h2`,h3:`h3`,li:`li`,p:`p`,pre:`pre`,ul:`ul`,...t(),...e.components};return(0,S.jsxs)(S.Fragment,{children:[(0,S.jsx)(a,{of:y,parameters:{docs:{toc:!0}}}),`
|
|
2
2
|
`,(0,S.jsx)(c,{children:`PeriodSelect`}),`
|
|
3
3
|
`,(0,S.jsx)(i,{children:`Выбор периода детализации дат с ограничением вариантов по связанному диапазону`}),`
|
|
4
4
|
`,(0,S.jsxs)(o.p,{children:[`PeriodSelect используется для выбора уровня детализации: `,(0,S.jsx)(o.code,{children:`day`}),`, `,(0,S.jsx)(o.code,{children:`week`}),`, `,(0,S.jsx)(o.code,{children:`month`}),` или `,(0,S.jsx)(o.code,{children:`year`}),`. Компонент хранит только id выбранного периода, а недоступность вариантов вычисляет по переданному `,(0,S.jsx)(o.code,{children:`dateRange`}),` и порогам `,(0,S.jsx)(o.code,{children:`maxDayRangeDays`}),` / `,(0,S.jsx)(o.code,{children:`maxWeekRangeWeeks`}),`.`]}),`
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{a as e,c as t,i as n}from"./preload-helper-B45gAKPr.js";import{C as r}from"./iframe-
|
|
1
|
+
import{a as e,c as t,i as n}from"./preload-helper-B45gAKPr.js";import{C as r}from"./iframe-YecJO4uV.js";import{t as i}from"./jsx-runtime-BBQGix-2.js";import{i as a,t as o}from"./text-CQF6O5fh.js";import{P as s,b as c,s as l,t as u}from"./formatters-DEfKcq5B.js";import{t as d}from"./DateInput-BbkCHe27.js";import{a as f,c as p,i as m,n as h,s as g,t as _}from"./preset-select-LcK3ak1H.js";import{i as v}from"./Grid-C4-fxCy0.js";import{t as y}from"./grid-Dtmb5H_R.js";var b=n((()=>{}));function x(e){return typeof e==`string`&&k.has(e)}function S(e,t=O){let n=m(e,x,t),r=n.length>0?n:O,i=new Set(r);return O.filter(e=>i.has(e))}function C(e,t=D){return g(e,t)}function w({maxDayRangeDays:e,maxWeekRangeWeeks:t}={}){let n=s(e),r=s(t);return D.map(e=>e.id===`day`&&n!==void 0?{...e,maxRangeDays:n}:e.id===`week`&&r!==void 0?{...e,maxRangeDays:r*7}:{...e})}function T(e,t){let n=s(e.maxRangeDays);if(n===void 0||t===void 0)return!1;let r=l(t);return r!==null&&r>n}function E(e,t,n){if(t.length===0)return;let r=e===void 0?-1:t.findIndex(t=>t.id===e),i=r>=0?t[r]:void 0;return i&&!T(i,n)?i.id:(r>=0?t.slice(r+1):t).find(e=>!T(e,n))?.id??t.find(e=>!T(e,n))?.id}var D,O,k,A=n((()=>{u(),f(),D=Object.freeze([{id:`day`,label:`по дням`},{id:`week`,label:`по неделям`},{id:`month`,label:`по месяцам`},{id:`year`,label:`по годам`}]),O=Object.freeze([`day`,`week`,`month`,`year`]),k=new Set(D.map(e=>e.id))})),j=n((()=>{b(),A()}));function M({value:e,onChange:t,options:n,presetIds:r,dateRange:i,maxDayRangeDays:a,maxWeekRangeWeeks:o,...s}){let c=(0,N.useMemo)(()=>n??C(S(r),w({maxDayRangeDays:a,maxWeekRangeWeeks:o})),[a,o,n,r]),l=(0,N.useMemo)(()=>E(e,c,i),[i,c,e]),u=(0,N.useRef)(null),d=(0,N.useEffectEvent)(()=>{if(l===void 0||l===e){u.current=null;return}let n=u.current;n&&n.value===e&&n.availableValue===l||(u.current={value:e,availableValue:l},t(l))});return(0,N.useEffect)(()=>{d()},[l,e]),(0,P.jsx)(h,{...s,options:c,value:l,onChange:t,getOptionDisabled:e=>T(e,i)})}var N,P,F=n((()=>{N=t(r(),1),_(),j(),P=i(),M.__docgenInfo={description:`Select периода детализации, который может ограничивать доступные варианты по диапазону дат.`,methods:[],displayName:`PeriodSelect`,props:{label:{required:!1,tsType:{name:`ReactNode`},description:``},description:{required:!1,tsType:{name:`string`},description:``},placeholder:{required:!1,tsType:{name:`string`},description:``},disabled:{required:!1,tsType:{name:`boolean`},description:``},size:{required:!1,tsType:{name:`union`,raw:`"xs" | "sm" | "md" | "lg" | "xl"`,elements:[{name:`literal`,value:`"xs"`},{name:`literal`,value:`"sm"`},{name:`literal`,value:`"md"`},{name:`literal`,value:`"lg"`},{name:`literal`,value:`"xl"`}]},description:``},value:{required:!0,tsType:{name:`V`},description:"Если начальное состояние может быть `null | undefined`\nзначит `onChange` тоже должен ументь сбрасывать.\nПоэтому такой контрол явно должен передавать `UiBaseProps<AnyType | undefined>`"},onChange:{required:!0,tsType:{name:`signature`,type:`function`,raw:`(value: T) => void`,signature:{arguments:[{type:{name:`C`},name:`value`}],return:{name:`void`}}},description:``},options:{required:!1,tsType:{name:`unknown`},description:``},presetIds:{required:!1,tsType:{name:`unknown`},description:`Разрешенные встроенные варианты периода. Значение нормализуется в канонический
|
|
2
2
|
порядок, а пустой либо невалидный список безопасно заменяется полным набором.
|
|
3
3
|
Не применяется, когда передан собственный \`options\`.`},dateRange:{required:!1,tsType:{name:`DateRangeInput`},description:``},maxDayRangeDays:{required:!1,tsType:{name:`number`},description:``},maxWeekRangeWeeks:{required:!1,tsType:{name:`number`},description:``}}}})),I=n((()=>{j(),F()})),L=e({AllAllowedOptionsDisabled:()=>Y,AutoSwitchByRange:()=>q,Controlled:()=>K,Disabled:()=>X,MonthAndYear:()=>J,__namedExportsOrder:()=>Z,default:()=>G});function R(e){return e!==void 0&&c(e)?e:null}function z(e){let[,t]=V(),n=R(e.dateRange),r=l(e.dateRange??null);return(0,B.jsxs)(v,{gap:`md`,children:[(0,B.jsx)(M,{...e,onChange:n=>{e.onChange(n),t({value:n})}}),(0,B.jsx)(d,{label:`Связанный диапазон дат`,placeholder:`дд.мм.гггг - дд.мм.гггг`,value:n,onChange:e=>t({dateRange:e??void 0})}),(0,B.jsxs)(a,{as:`p`,color:`secondary`,"aria-live":`polite`,children:[`Выбрано: `,(0,B.jsx)(a,{as:`code`,children:e.value??`не выбрано`}),`. Дней в диапазоне:`,` `,(0,B.jsx)(a,{as:`code`,children:r??`не задано`}),`.`]})]})}var B,V,H,U,W,G,K,q,J,Y,X,Z,Q=n((()=>{u(),p(),y(),o(),I(),B=i(),{useArgs:V}=__STORYBOOK_MODULE_PREVIEW_API__,{fn:H}=__STORYBOOK_MODULE_TEST__,U=[new Date(2026,2,1,0,0,0),new Date(2026,2,14,23,59,59)],W=[new Date(2026,0,1,0,0,0),new Date(2026,4,20,23,59,59)],G={title:`Shared/UI/PeriodSelect`,component:M,args:{label:`Период детализации`,description:`Выберите уровень группировки дат.`,placeholder:`Выберите период`,value:`day`,onChange:H(),presetIds:O,dateRange:U,maxDayRangeDays:31,maxWeekRangeWeeks:26,disabled:!1,size:`md`},parameters:{atomicCanvas:!0,layout:`padded`,docs:{description:{component:`Select периода детализации дат. Компонент работает с id периода и может блокировать слишком детальные варианты по переданному диапазону дат.`}}},argTypes:{label:{description:`Заголовок поля.`,control:`text`},description:{description:`Описание под заголовком.`,control:`text`},placeholder:{description:`Текст, когда период не выбран.`,control:`text`},value:{description:`Текущий id периода.`,control:`select`,options:O},onChange:{description:`Вызывается с id выбранного периода.`,control:!1},options:{description:"Кастомный список периодов по контракту `PeriodSelectOption`; имеет приоритет над `presetIds`.",control:!1},presetIds:{description:"Разрешенные встроенные периоды. Порядок отображения остается `day → week → month → year`.",control:`check`,options:O},dateRange:{description:`Диапазон дат, по которому вычисляются заблокированные периоды.`,control:!1},maxDayRangeDays:{description:"Максимальное количество дней, при котором доступен период `day`.",control:{type:`number`,min:1,step:1}},maxWeekRangeWeeks:{description:"Максимальное количество недель, при котором доступен период `week`.",control:{type:`number`,min:1,step:1}},disabled:{description:`Блокирует взаимодействие с полем.`,control:`boolean`},size:{description:`Размер поля и подписей.`,control:`select`,options:[`xs`,`sm`,`md`,`lg`,`xl`]}}},K={name:`Контролируемый выбор`,render:function(e){return(0,B.jsx)(z,{...e})}},q={name:`Автопереключение по диапазону`,args:{value:`day`,dateRange:W,maxDayRangeDays:31,maxWeekRangeWeeks:8},render:function(e){return(0,B.jsx)(z,{...e})}},J={name:`Только месяцы и годы`,args:{value:`month`,presetIds:[`month`,`year`]},render:function(e){return(0,B.jsx)(z,{...e})}},Y={name:`Все разрешенные варианты недоступны`,args:{value:`day`,presetIds:[`day`,`week`],dateRange:W,maxDayRangeDays:31,maxWeekRangeWeeks:8},render:function(e){return(0,B.jsx)(z,{...e})}},X={name:`Заблокированный контрол`,args:{disabled:!0,value:`week`}},K.parameters={...K.parameters,docs:{...K.parameters?.docs,source:{originalSource:`{
|
|
4
4
|
name: "Контролируемый выбор",
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{i as e}from"./preload-helper-B45gAKPr.js";import{E as t,a as n,d as r,f as i,l as a,m as o,n as s,p as c,r as l,u}from"./blocks-
|
|
1
|
+
import{i as e}from"./preload-helper-B45gAKPr.js";import{E as t,a as n,d as r,f as i,l as a,m as o,n as s,p as c,r as l,u}from"./blocks-D8vTJCXn.js";import{t as d}from"./jsx-runtime-BBQGix-2.js";import{t as f}from"./mdx-react-shim-B6MYoAcj.js";import{AnchorPlacement as p,Controlled as m,Default as h,WithInteractiveContent as g,n as _,t as v}from"./Popover.stories-AXvTs-mK.js";function y(e){let o={code:`code`,h2:`h2`,h3:`h3`,li:`li`,p:`p`,pre:`pre`,ul:`ul`,...t(),...e.components};return(0,x.jsxs)(x.Fragment,{children:[(0,x.jsx)(a,{of:v,parameters:{docs:{toc:!0}}}),`
|
|
2
2
|
`,(0,x.jsx)(c,{children:`Popover`}),`
|
|
3
3
|
`,(0,x.jsx)(i,{children:`Всплывающий контейнер, привязанный к trigger-элементу и поддерживающий управляемое открытие`}),`
|
|
4
4
|
`,(0,x.jsx)(o.p,{children:`Popover уже имеет живые stories, а эта страница собирает их в структурированную документацию с краткими рекомендациями, примерами подключения и API.
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{a as e,c as t,i as n}from"./preload-helper-B45gAKPr.js";import{C as r}from"./iframe-
|
|
1
|
+
import{a as e,c as t,i as n}from"./preload-helper-B45gAKPr.js";import{C as r}from"./iframe-YecJO4uV.js";import{t as i}from"./jsx-runtime-BBQGix-2.js";import{a,i as o}from"./popover-CwLg1nVy.js";import{n as s,t as c}from"./Button-DYvP70oK.js";import{c as l,t as u}from"./Input-VtBvr4ox.js";var d=e({AnchorPlacement:()=>_,Controlled:()=>g,Default:()=>h,WithInteractiveContent:()=>v,__namedExportsOrder:()=>y,default:()=>m}),f,p,m,h,g,_,v,y,b=n((()=>{f=t(r(),1),s(),l(),a(),p=i(),m={title:`Shared/UI/Popover`,component:o,parameters:{atomicCanvas:!0,layout:`centered`}},h={render:()=>(0,p.jsxs)(o,{children:[(0,p.jsx)(o.Trigger,{children:(0,p.jsx)(`button`,{children:`Открыть`})}),(0,p.jsx)(o.Content,{children:e=>(0,p.jsxs)(`div`,{style:{padding:12,maxWidth:160},children:[(0,p.jsx)(`p`,{children:`Пример простого поповера`}),(0,p.jsx)(`button`,{onClick:e.setClose,children:`Закрыть`})]})})]})},g={render:()=>{let[e,t]=(0,f.useState)(!1);return(0,p.jsxs)(o,{open:e,onOpenChange:t,children:[(0,p.jsx)(o.Trigger,{children:(0,p.jsx)(`button`,{children:e?`Закрыть`:`Открыть`})}),(0,p.jsx)(o.Content,{children:(0,p.jsx)(`div`,{style:{padding:12},children:`Контролируемый режим`})})]})}},_={render:()=>(0,p.jsx)(`div`,{style:{display:`flex`,gap:32,flexWrap:`wrap`,justifyContent:`center`},children:[`top`,`bottom`,`left`,`right`,`top-start`,`bottom-end`].map(e=>(0,p.jsxs)(o,{placement:e,children:[(0,p.jsx)(o.Trigger,{children:(0,p.jsx)(`button`,{children:e})}),(0,p.jsx)(o.Content,{children:(0,p.jsx)(`div`,{style:{padding:8},children:e})})]},e))})},v={render:()=>(0,p.jsxs)(o,{children:[(0,p.jsx)(o.Trigger,{children:(0,p.jsx)(`button`,{children:`Форма`})}),(0,p.jsx)(o.Content,{children:e=>(0,p.jsxs)(`form`,{onSubmit:t=>{t.preventDefault(),e.setClose()},style:{display:`flex`,flexDirection:`column`,gap:8,padding:12,width:180},children:[(0,p.jsx)(u,{label:`Имя`,placeholder:`Введите имя`,value:``,onChange:()=>{}}),(0,p.jsx)(c,{children:`Отправить`})]})})]})},h.parameters={...h.parameters,docs:{...h.parameters?.docs,source:{originalSource:`{
|
|
2
2
|
render: () => <Popover>
|
|
3
3
|
<Popover.Trigger>
|
|
4
4
|
<button>Открыть</button>
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{i as e}from"./preload-helper-B45gAKPr.js";import{E as t,a as n,d as r,f as i,l as a,m as o,n as s,p as c,r as l,u}from"./blocks-
|
|
1
|
+
import{i as e}from"./preload-helper-B45gAKPr.js";import{E as t,a as n,d as r,f as i,l as a,m as o,n as s,p as c,r as l,u}from"./blocks-D8vTJCXn.js";import{t as d}from"./jsx-runtime-BBQGix-2.js";import{t as f}from"./mdx-react-shim-B6MYoAcj.js";import{Default as p,n as m,t as h}from"./PresetRangeDateInput.stories-CEu1DDCF.js";function g(e){let o={code:`code`,h2:`h2`,h3:`h3`,li:`li`,p:`p`,pre:`pre`,ul:`ul`,...t(),...e.components};return(0,v.jsxs)(v.Fragment,{children:[(0,v.jsx)(a,{of:h,parameters:{docs:{toc:!0}}}),`
|
|
2
2
|
`,(0,v.jsx)(c,{children:`PresetRangeDateInput`}),`
|
|
3
3
|
`,(0,v.jsx)(i,{children:`Составной контрол диапазона дат с синхронизацией ручного ввода и готовых пресетов`}),`
|
|
4
4
|
`,(0,v.jsx)(o.p,{children:`PresetRangeDateInput уже имеет живые stories, а эта страница собирает их в структурированную документацию с краткими рекомендациями, примерами подключения и API.
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{a as e,c as t,i as n}from"./preload-helper-B45gAKPr.js";import{C as r}from"./iframe-
|
|
1
|
+
import{a as e,c as t,i as n}from"./preload-helper-B45gAKPr.js";import{C as r}from"./iframe-YecJO4uV.js";import{t as i}from"./jsx-runtime-BBQGix-2.js";import{i as a,t as o}from"./text-CQF6O5fh.js";import{o as s}from"./Flex-CXJVQ7iV.js";import{t as c}from"./flex-BriuFrFs.js";import{t as l}from"./DateInput-BbkCHe27.js";import{c as u}from"./preset-select-LcK3ak1H.js";import{a as d,c as f,i as p,n as m,o as h,r as g,s as _,t as v}from"./DateRangePresetSelect-BH9oi-dO.js";var y=n((()=>{m(),p()}));function b(e){return e??`__empty__`}function x({value:e,onChange:t,presetId:n,onPresetIdChange:r,referenceDate:i,presetIds:a,presetOptions:o,presetLabel:c,presetDescription:u,presetPlaceholder:p=`Выберите пресет диапазона`,presetDisabled:m,...y}){let[x]=(0,S.useState)(()=>new Date),w=i??x,T=(0,S.useMemo)(()=>o??_(d(a,g)),[a,o]),E=e??null,D=(0,S.useMemo)(()=>h(E,w,T),[E,T,w]),O=n??D??void 0,k=(0,S.useRef)(``),A=(0,S.useCallback)(e=>{if(!r)return;let t=b(e);t!==k.current&&(k.current=t,r(e))},[r]),j=e=>{let n=f(e,w,T);if(!n){A(null);return}A(n.id),t(n.range)},M=e=>{t(e),A(h(e,w,T))};return(0,C.jsxs)(s,{gap:`sm`,align:`end`,children:[(0,C.jsx)(v,{size:`md`,label:c,description:u,placeholder:p,disabled:m??y.disabled,value:O,onChange:j,options:T,referenceDate:w}),(0,C.jsx)(l,{...y,size:`md`,value:E,onChange:M})]})}var S,C,w=n((()=>{S=t(r(),1),u(),y(),c(),C=i(),x.__docgenInfo={description:`Составной компонент выбора диапазона дат через пресет или ручной ввод.`,methods:[],displayName:`PresetRangeDateInput`,props:{presetId:{required:!1,tsType:{name:`union`,raw:`DateRangePresetOption["id"] | null`,elements:[{name:`DateRangePresetOption["id"]`,raw:`DateRangePresetOption["id"]`},{name:`null`}]},description:``},onPresetIdChange:{required:!1,tsType:{name:`signature`,type:`function`,raw:`(presetId: DateRangePresetOption["id"] | null) => void`,signature:{arguments:[{type:{name:`union`,raw:`DateRangePresetOption["id"] | null`,elements:[{name:`DateRangePresetOption["id"]`,raw:`DateRangePresetOption["id"]`},{name:`null`}]},name:`presetId`}],return:{name:`void`}}},description:``},referenceDate:{required:!1,tsType:{name:`Date`},description:``},presetIds:{required:!1,tsType:{name:`unknown`},description:``},presetOptions:{required:!1,tsType:{name:`unknown`},description:``},presetLabel:{required:!1,tsType:{name:`ReactNode`},description:``},presetDescription:{required:!1,tsType:{name:`string`},description:``},presetPlaceholder:{required:!1,tsType:{name:`string`},description:``,defaultValue:{value:`"Выберите пресет диапазона"`,computed:!1}},presetDisabled:{required:!1,tsType:{name:`boolean`},description:``}},composes:[`Omit`]}})),T=e({Default:()=>k,__namedExportsOrder:()=>A,default:()=>O}),E,D,O,k,A,j=n((()=>{E=t(r(),1),c(),o(),w(),D=i(),O={title:`Shared/UI/PresetRangeDateInput`,component:x,args:{value:null,onChange:()=>{}},parameters:{atomicCanvas:!0,layout:`padded`}},k={render:()=>{let[e,t]=(0,E.useState)([new Date(2026,2,10,0,0,0),new Date(2026,2,10,23,59,59)]),[n,r]=(0,E.useState)(`today`);return(0,D.jsxs)(D.Fragment,{children:[(0,D.jsx)(s,{gap:`sm`,align:`end`,children:(0,D.jsx)(x,{value:e,onChange:t,presetId:n,onPresetIdChange:r,referenceDate:new Date(2026,2,10,12,0,0),presetLabel:`Быстрый диапазон`,size:`md`})}),(0,D.jsxs)(a,{as:`p`,className:`marginBlockSm`,children:[`Активный presetId: `,(0,D.jsx)(a,{as:`code`,children:n??`null`})]})]})}},k.parameters={...k.parameters,docs:{...k.parameters?.docs,source:{originalSource:`{
|
|
2
2
|
render: () => {
|
|
3
3
|
const [value, setValue] = useState<NullableDateRange | null>([new Date(2026, 2, 10, 0, 0, 0), new Date(2026, 2, 10, 23, 59, 59)]);
|
|
4
4
|
const [presetId, setPresetId] = useState<string | null>("today");
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{i as e}from"./preload-helper-B45gAKPr.js";import{E as t,a as n,d as r,f as i,l as a,m as o,n as s,p as c,r as l,u}from"./blocks-
|
|
1
|
+
import{i as e}from"./preload-helper-B45gAKPr.js";import{E as t,a as n,d as r,f as i,l as a,m as o,n as s,p as c,r as l,u}from"./blocks-D8vTJCXn.js";import{t as d}from"./jsx-runtime-BBQGix-2.js";import{t as f}from"./mdx-react-shim-B6MYoAcj.js";import{Controlled as p,Disabled as m,Group as h,n as g,t as _}from"./RadioButton.stories-COLQdM1e.js";function v(e){let o={code:`code`,h2:`h2`,h3:`h3`,li:`li`,p:`p`,pre:`pre`,ul:`ul`,...t(),...e.components};return(0,b.jsxs)(b.Fragment,{children:[(0,b.jsx)(a,{of:_,parameters:{docs:{toc:!0}}}),`
|
|
2
2
|
`,(0,b.jsx)(c,{children:`RadioButton`}),`
|
|
3
3
|
`,(0,b.jsx)(i,{children:`Одиночная radio-кнопка для ручной сборки наборов выбора и специальных компоновок`}),`
|
|
4
4
|
`,(0,b.jsx)(o.p,{children:`RadioButton уже имеет живые stories, а эта страница собирает их в структурированную документацию с краткими рекомендациями, примерами подключения и API.
|