@ryuzaki13/react-foundation-ui 1.0.16 → 1.0.18
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/{CalendarView-DCQjO2ho.js → CalendarView-C0gJvre1.js} +21 -17
- package/dist/chunks/CalendarView-C0gJvre1.js.map +1 -0
- package/dist/chunks/{date-input-DjAQ75n9.js → date-input-DKkW7_uw.js} +6 -6
- package/dist/chunks/date-input-DKkW7_uw.js.map +1 -0
- package/dist/date-input/index.js +2 -2
- package/dist/date-input/lib/dateInputValue.d.ts.map +1 -1
- package/dist/date-input/ui/CalendarDayView.d.ts +1 -1
- package/dist/date-input/ui/CalendarDayView.d.ts.map +1 -1
- package/dist/date-time-input/index.js +1 -1
- package/dist/image/index.d.ts +14 -5
- package/dist/image/index.d.ts.map +1 -1
- package/dist/image/index.js +256 -252
- package/dist/image/index.js.map +1 -1
- package/dist/image/lib/buildImageSources.d.ts +4 -0
- package/dist/image/lib/buildImageSources.d.ts.map +1 -0
- package/dist/image/lib/buildImageSrcSet.d.ts +4 -0
- package/dist/image/lib/buildImageSrcSet.d.ts.map +1 -0
- package/dist/image/lib/getImageCropPreviewStyle.d.ts +9 -0
- package/dist/image/lib/getImageCropPreviewStyle.d.ts.map +1 -0
- package/dist/image/lib/getImageSelectionKey.d.ts +4 -0
- package/dist/image/lib/getImageSelectionKey.d.ts.map +1 -0
- package/dist/image/model/imageCropTypes.d.ts +35 -0
- package/dist/image/model/imageCropTypes.d.ts.map +1 -0
- package/dist/image/model/imageSelectionTypes.d.ts +53 -0
- package/dist/image/model/imageSelectionTypes.d.ts.map +1 -0
- package/dist/image/model/imageTypes.d.ts +41 -0
- package/dist/image/model/imageTypes.d.ts.map +1 -0
- package/dist/image/model/useImageSelectionState.d.ts +7 -0
- package/dist/image/model/useImageSelectionState.d.ts.map +1 -0
- package/dist/image/ui/ImageCropper.d.ts +6 -12
- package/dist/image/ui/ImageCropper.d.ts.map +1 -1
- package/dist/image/ui/ImagePlaceholder.d.ts +1 -2
- package/dist/image/ui/ImagePlaceholder.d.ts.map +1 -1
- package/dist/image/ui/ImageRenderer.d.ts +8 -7
- package/dist/image/ui/ImageRenderer.d.ts.map +1 -1
- package/dist/image/ui/ImageSelectionFields.d.ts +8 -0
- package/dist/image/ui/ImageSelectionFields.d.ts.map +1 -0
- package/dist/image/ui/ImageSelectionModal.d.ts +4 -0
- package/dist/image/ui/ImageSelectionModal.d.ts.map +1 -0
- package/dist/image/ui/ImageSelectionPanel.d.ts +4 -0
- package/dist/image/ui/ImageSelectionPanel.d.ts.map +1 -0
- package/dist/image/ui/ImageView.d.ts +8 -35
- package/dist/image/ui/ImageView.d.ts.map +1 -1
- package/dist/preset-range-date-input/index.js +1 -1
- package/dist/styles.css +1 -1
- package/package.json +1 -1
- package/storybook-static/assets/{Badge-vJLUGaI_.js → Badge-DWmXvSEt.js} +1 -1
- package/storybook-static/assets/{Badge.stories-CB7_sy4V.js → Badge.stories-DrUkR5Kt.js} +1 -1
- package/storybook-static/assets/{Button-oTagr13z.js → Button-CBzJWtGT.js} +1 -1
- package/storybook-static/assets/{Button-BYai87yi.js → Button-gqIyGTVm.js} +1 -1
- package/storybook-static/assets/{Button.stories-CLo53Dym.js → Button.stories-DarSDitm.js} +1 -1
- package/storybook-static/assets/{CheckBox-BraLv5KN.js → CheckBox-Be5y5Yaf.js} +1 -1
- package/storybook-static/assets/{CheckBox-C2bHNtHr.js → CheckBox-CClp47K7.js} +1 -1
- package/storybook-static/assets/{CheckBox.stories-o2lY0RKu.js → CheckBox.stories-D-XTwN4w.js} +1 -1
- package/storybook-static/assets/{Color-KMSTOMOX-BHaJ-wKU.js → Color-KMSTOMOX-Pv032miJ.js} +1 -1
- package/storybook-static/assets/{ContextMenu-BzaUwzMv.js → ContextMenu-BkVTXUpG.js} +1 -1
- package/storybook-static/assets/{ContextMenu.stories-Cg2bAlWA.js → ContextMenu.stories-DtvzPaIF.js} +1 -1
- package/storybook-static/assets/DateInput-6pvp1eRu.js +1 -0
- package/storybook-static/assets/DateInput-BfFTwd_P.css +1 -0
- package/storybook-static/assets/{DateInput-BbXwXYMN.js → DateInput-CbQwETpT.js} +1 -1
- package/storybook-static/assets/{DateInput.stories-B8fRipDy.js → DateInput.stories-DRcN3ybd.js} +1 -1
- package/storybook-static/assets/{DateRangePresetSelect-Bon7aDz9.js → DateRangePresetSelect-CAB32ti_.js} +1 -1
- package/storybook-static/assets/{DateRangePresetSelect-Q10WgnHC.js → DateRangePresetSelect-D6q7Kef5.js} +1 -1
- package/storybook-static/assets/{DateRangePresetSelect.stories-X5yR46L9.js → DateRangePresetSelect.stories-DN6TkVtw.js} +1 -1
- package/storybook-static/assets/{Detail-Jk3fkqjF.js → Detail-CphbEg1M.js} +1 -1
- package/storybook-static/assets/{Detail.stories-wqoSTZIu.js → Detail.stories-Dc5Rx4u4.js} +1 -1
- package/storybook-static/assets/{Dialog-tlGg2W0-.js → Dialog-ndurUKqc.js} +1 -1
- package/storybook-static/assets/{Dialog.stories-BKM3E602.js → Dialog.stories-BvLARKjm.js} +1 -1
- package/storybook-static/assets/{Disclosure-DG0pFR_s.js → Disclosure-2VsNuiNF.js} +1 -1
- package/storybook-static/assets/{Disclosure.stories-vozdPrt7.js → Disclosure.stories-eGJxzZmh.js} +1 -1
- package/storybook-static/assets/{DocsRenderer-JROSPFPF-CKQjaMcI.js → DocsRenderer-JROSPFPF-CpVFRA5Y.js} +2 -2
- package/storybook-static/assets/{DropZone-BTEX9cWB.js → DropZone-B8a2PM2e.js} +1 -1
- package/storybook-static/assets/{DropZone.stories-DEZvssV8.js → DropZone.stories-DoBeAZdH.js} +1 -1
- package/storybook-static/assets/{DropdownMenu-DWCr1uXl.js → DropdownMenu-Dyi86Exa.js} +1 -1
- package/storybook-static/assets/{ExpandableActionPanel.stories-ctXctIJW.js → ExpandableActionPanel.stories-BDyx4-Wf.js} +1 -1
- package/storybook-static/assets/{Flex-DEDjnGpd.js → Flex-B71m7CmC.js} +1 -1
- package/storybook-static/assets/{Flex-DoUD1UXL.js → Flex-DycwM4Fy.js} +1 -1
- package/storybook-static/assets/{Flex.stories-dflAzIUJ.js → Flex.stories-DNNoTDfs.js} +1 -1
- package/storybook-static/assets/{Grid-Ba1LiIoK.js → Grid-CCVTg58v.js} +1 -1
- package/storybook-static/assets/{Grid-CygalYJC.js → Grid-DzNawx4O.js} +1 -1
- package/storybook-static/assets/{Grid.stories-C0TJlQBg.js → Grid.stories-D62x4nnt.js} +1 -1
- package/storybook-static/assets/ImageCropper.stories-BkBPtN0b.js +115 -0
- package/storybook-static/assets/ImageRenderer-BNrfKcoR.js +2 -0
- package/storybook-static/assets/ImageRenderer.stories-DQpqGfZ5.js +22 -0
- package/storybook-static/assets/ImageView.stories-DzCNwypO.js +9 -0
- package/storybook-static/assets/{Input-DKnsPLP3.js → Input-D7RhI3F_.js} +1 -1
- package/storybook-static/assets/{Input-CdMnSMml.js → Input-DEvutRWc.js} +1 -1
- package/storybook-static/assets/{Input.stories-CV9c9erP.js → Input.stories-CQtNzJ2d.js} +1 -1
- package/storybook-static/assets/{InputDateTime-WJO0bw9b.js → InputDateTime-2xC784cj.js} +1 -1
- package/storybook-static/assets/{InputDateTime.stories-Bft-0XHy.js → InputDateTime.stories-DtYUywAW.js} +1 -1
- package/storybook-static/assets/{InputFile-Bo0pMMdC.js → InputFile-LuB6ELgM.js} +1 -1
- package/storybook-static/assets/{InputFile.stories-BbOvmDfI.js → InputFile.stories-psIGnnDp.js} +1 -1
- package/storybook-static/assets/{InputFiles-CkK5910C.js → InputFiles-C71LfhQ3.js} +1 -1
- package/storybook-static/assets/{InputFiles-DGB0BcGz.js → InputFiles-DRacqAIw.js} +1 -1
- package/storybook-static/assets/{InputFiles.stories-Dx6p_DhD.js → InputFiles.stories-BAO31sqC.js} +1 -1
- package/storybook-static/assets/{InputImage-CrbIRoPw.js → InputImage-vZyjm8oI.js} +1 -1
- package/storybook-static/assets/{InputImage.stories-COflYR5z.js → InputImage.stories-B9rN6Rxs.js} +1 -1
- package/storybook-static/assets/{LayoutPicker-JWsbQL63.js → LayoutPicker-CxDe5Gw8.js} +1 -1
- package/storybook-static/assets/{LayoutPicker.stories-D6S2k0QD.js → LayoutPicker.stories-D8cCxXXP.js} +1 -1
- package/storybook-static/assets/{Listbox-t-YWC_KD.js → Listbox-5iar6ma8.js} +1 -1
- package/storybook-static/assets/{Listbox.stories-DKoxXNY1.js → Listbox.stories-COp6WiMB.js} +1 -1
- package/storybook-static/assets/{Modal-CY7qf0nr.js → Modal-zV3K6vvv.js} +1 -1
- package/storybook-static/assets/{Modal.stories-Dv-SiU5Z.js → Modal.stories-CYmv-FaJ.js} +1 -1
- package/storybook-static/assets/{MultiSelect-CZA-7_sV.js → MultiSelect-D41OCY5x.js} +1 -1
- package/storybook-static/assets/{MultiSelect-Ch2bGl-M.js → MultiSelect-UizFi3d9.js} +1 -1
- package/storybook-static/assets/{MultiSelect.stories-xd5Nrb5A.js → MultiSelect.stories-u0AlSlZp.js} +1 -1
- package/storybook-static/assets/{NotificationsHost-CjOawFjN.js → NotificationsHost-hQChUMce.js} +1 -1
- package/storybook-static/assets/{NotificationsHost.stories-DE73HoC9.js → NotificationsHost.stories-D6g7WJjS.js} +1 -1
- package/storybook-static/assets/{ODataMultiSelect-BvTYP502.js → ODataMultiSelect-CiamQM6C.js} +1 -1
- package/storybook-static/assets/{ODataMultiSelect.stories-nzYiv75x.js → ODataMultiSelect.stories-5eDEemGQ.js} +1 -1
- package/storybook-static/assets/{ODataSelect-DQ0azWQm.js → ODataSelect-BiWVXqPq.js} +1 -1
- package/storybook-static/assets/{ODataSelect-BjoZBzmM.js → ODataSelect-CLx5JSMi.js} +1 -1
- package/storybook-static/assets/{ODataSelect.stories-CHaNdl7F.js → ODataSelect.stories-GwKgtC-N.js} +1 -1
- package/storybook-static/assets/{ODataTreeMultiSelect-C4B0SE6h.js → ODataTreeMultiSelect-CzMZie_w.js} +1 -1
- package/storybook-static/assets/{ODataTreeMultiSelect.stories-CE9z8LHX.js → ODataTreeMultiSelect.stories-Da6MlEkV.js} +1 -1
- package/storybook-static/assets/{ODataTreeSelect-CE8F2Gif.js → ODataTreeSelect-CK7MxVU8.js} +1 -1
- package/storybook-static/assets/{ODataTreeSelect.stories-BK5HglYD.js → ODataTreeSelect.stories-D8CwVfe-.js} +1 -1
- package/storybook-static/assets/{PeriodSelect-JWy5A4N9.js → PeriodSelect-DqP0nweD.js} +1 -1
- package/storybook-static/assets/{PeriodSelect.stories-Dq8OvOmE.js → PeriodSelect.stories-BJXRGemD.js} +1 -1
- package/storybook-static/assets/{Popover-q9E7uSND.js → Popover-D6qr-zdh.js} +1 -1
- package/storybook-static/assets/{Popover.stories-B0TMCfn5.js → Popover.stories-wr4nVVeK.js} +1 -1
- package/storybook-static/assets/{PresetRangeDateInput-C29yd2AW.js → PresetRangeDateInput-CX-JBXWg.js} +1 -1
- package/storybook-static/assets/{PresetRangeDateInput.stories-DwEX2jsI.js → PresetRangeDateInput.stories-CiMPYtxH.js} +1 -1
- package/storybook-static/assets/{RadioButton-DqK_JoST.js → RadioButton-CAE1c9uv.js} +1 -1
- package/storybook-static/assets/{RadioButton.stories-CNekwXt5.js → RadioButton.stories-BysL-Bxz.js} +1 -1
- package/storybook-static/assets/{RadioGroup-Cn_Mf2ki.js → RadioGroup-B1xxoy7T.js} +1 -1
- package/storybook-static/assets/{RadioGroup-BDoAYuiK.js → RadioGroup-DxUA0aFk.js} +1 -1
- package/storybook-static/assets/{RadioGroup.stories-D9RU6f5W.js → RadioGroup.stories-Dhx6ULhk.js} +1 -1
- package/storybook-static/assets/{Select-D-b4fatX.js → Select-C8dnQPHr.js} +1 -1
- package/storybook-static/assets/{Select-oj7GFB7o.js → Select-DTyFJMMc.js} +1 -1
- package/storybook-static/assets/{Select.stories-CXvdHYC9.js → Select.stories-CvSTPVuR.js} +1 -1
- package/storybook-static/assets/{SelectOptionContent-B9fxCwa1.js → SelectOptionContent-DXQBspsR.js} +1 -1
- package/storybook-static/assets/{SerializableSelect-CYs-Pu-J.js → SerializableSelect-Byb9ssGD.js} +1 -1
- package/storybook-static/assets/{SerializableSelect-B3cGmITh.js → SerializableSelect-b8rZxZBe.js} +1 -1
- package/storybook-static/assets/{SerializableSelect.stories-BWkLQPiz.js → SerializableSelect.stories-D4pNvhz2.js} +1 -1
- package/storybook-static/assets/{SingleDateTimeInput-BE5NPMX3.js → SingleDateTimeInput-Dx8iPd-Q.js} +1 -1
- package/storybook-static/assets/{SingleDateTimeInput.stories-LrNh_0Pg.js → SingleDateTimeInput.stories-B2fchXdY.js} +1 -1
- package/storybook-static/assets/{Slider-BiJb0Bcg.js → Slider-CFQMYiQq.js} +1 -1
- package/storybook-static/assets/{Slider.stories-Bkq_5WGQ.js → Slider.stories-EcLVbioI.js} +1 -1
- package/storybook-static/assets/{SliderInput-oy8E6N-U.js → SliderInput-CGhUFTU0.js} +1 -1
- package/storybook-static/assets/{SliderInput.stories-BwD2JLof.js → SliderInput.stories-D_WSCFgt.js} +1 -1
- package/storybook-static/assets/{Sortable-B2rvvzXw.js → Sortable-BsOnR1uN.js} +1 -1
- package/storybook-static/assets/{Sortable.stories-Cqo5UR08.js → Sortable.stories-CPDoci0O.js} +1 -1
- package/storybook-static/assets/{Splitter-Dv7hkNKL.js → Splitter-CYyV_8Pq.js} +1 -1
- package/storybook-static/assets/{Splitter.stories-DD68b5v2.js → Splitter.stories-DiVFmplz.js} +1 -1
- package/storybook-static/assets/{StateSelect-CJk5VPSP.js → StateSelect-C9MDIBO7.js} +1 -1
- package/storybook-static/assets/{StateSelect.stories-Dsz5q4YO.js → StateSelect.stories-snID0UC6.js} +1 -1
- package/storybook-static/assets/{Switch-CAO6gFW1.js → Switch-BBFxT8_x.js} +1 -1
- package/storybook-static/assets/{Switch.stories-DVBH1whs.js → Switch.stories-BC53wJqW.js} +1 -1
- package/storybook-static/assets/{Table-DklNmxRt.js → Table-BnfSUBvR.js} +1 -1
- package/storybook-static/assets/{Table.stories-BPkPRAlC.js → Table.stories-2RTRdgpI.js} +1 -1
- package/storybook-static/assets/{Tabs-BsM2BwFg.js → Tabs-dXKmtWm1.js} +1 -1
- package/storybook-static/assets/{Tabs.stories-DAwHh5SX.js → Tabs.stories-CEp6vYMd.js} +1 -1
- package/storybook-static/assets/{Textarea-NqA5cqqY.js → Textarea-C9LTwBnP.js} +1 -1
- package/storybook-static/assets/{Textarea.stories-BibKa46U.js → Textarea.stories-DuNG4Fxg.js} +1 -1
- package/storybook-static/assets/{TimePanel-CU6Buf8R.js → TimePanel-nrNpgIYg.js} +1 -1
- package/storybook-static/assets/{TimePanel.stories-C1VVmISr.js → TimePanel.stories-CymqeBQ6.js} +1 -1
- package/storybook-static/assets/{Toggle-D0WP6hzD.js → Toggle-BrZsGFyh.js} +1 -1
- package/storybook-static/assets/{Toggle.stories-1jRKEvIw.js → Toggle.stories-CnRLuZ1B.js} +1 -1
- package/storybook-static/assets/{TreeMultiSelect-jEXdprAY.js → TreeMultiSelect-BBris-Xx.js} +1 -1
- package/storybook-static/assets/{TreeMultiSelect-CMVtYLOl.js → TreeMultiSelect-Dp-JxGpF.js} +1 -1
- package/storybook-static/assets/{TreeMultiSelect.stories-lwH6_IxQ.js → TreeMultiSelect.stories-Dn_39X3q.js} +1 -1
- package/storybook-static/assets/{TreePickerBase-waf9wBhE.js → TreePickerBase-DIQdSZhJ.js} +1 -1
- package/storybook-static/assets/{TreeSelect-CdjAQ-8C.js → TreeSelect-CCksSJfk.js} +1 -1
- package/storybook-static/assets/{TreeSelect-Ckk4x1dc.js → TreeSelect-ltX2lBAg.js} +1 -1
- package/storybook-static/assets/{TreeSelect.stories-tPZ7v5P4.js → TreeSelect.stories-BPEYOY-m.js} +1 -1
- package/storybook-static/assets/{TreeTable-Z2bnFp-2.js → TreeTable-Dc-Y0m3q.js} +1 -1
- package/storybook-static/assets/{TreeTable.stories-B1MoDE9M.js → TreeTable.stories-C2r_nF0e.js} +1 -1
- package/storybook-static/assets/{WithTooltip-7X4HQR7L-CMn5qdum.js → WithTooltip-7X4HQR7L-DK8uQ8Cn.js} +1 -1
- package/storybook-static/assets/{base-table-Cx3KcVeO.js → base-table-Bx2k5lGS.js} +1 -1
- package/storybook-static/assets/{blocks-BakdKZKD.js → blocks-C7Q8GMMo.js} +6 -6
- package/storybook-static/assets/{button-ZElzKkii.js → button-wXbhbl78.js} +1 -1
- package/storybook-static/assets/{check-box-Cd_bOhcF.js → check-box-C8FJKjhC.js} +1 -1
- package/storybook-static/assets/{chunk-3LY4VQVK-CF1Xf7FV.js → chunk-3LY4VQVK-uSlGTJmP.js} +1 -1
- package/storybook-static/assets/{chunk-LITCR56V-BlsuOcZ2.js → chunk-LITCR56V-FSgu6Y64.js} +1 -1
- package/storybook-static/assets/{contextMenu-Dsal-zhe.js → contextMenu-DduWXaL3.js} +1 -1
- package/storybook-static/assets/{error-0XWTHIC3.js → error-uQ2DxuVX.js} +1 -1
- package/storybook-static/assets/{flex-D5yYTe9c.js → flex-DkVQD9fQ.js} +1 -1
- package/storybook-static/assets/{floating-ui.react-bKfCIqPR.js → floating-ui.react-jQBFyt86.js} +1 -1
- package/storybook-static/assets/formatter-L2YTDE3Q-CK2g4idL.js +1 -0
- package/storybook-static/assets/{formatters-Cz4yGxBj.js → formatters-BloK5ams.js} +1 -1
- package/storybook-static/assets/grid-CZAlVfwE.js +1 -0
- package/storybook-static/assets/{hooks-n0e1oVqy.js → hooks-DFj5VG2H.js} +1 -1
- package/storybook-static/assets/{iframe-CnVQoYPB.js → iframe-BdBCyVHz.js} +4 -4
- package/storybook-static/assets/{input-DLNL1jnY.js → input-ddHVF6FV.js} +1 -1
- package/storybook-static/assets/{lucide-react-Ba5zJoHo.js → lucide-react-CkksFLP-.js} +1 -1
- package/storybook-static/assets/{mdx-react-shim-DE_9TEl3.js → mdx-react-shim-DeqTfg7V.js} +1 -1
- package/storybook-static/assets/{media-DFayZP4v.js → media-DrShSQO0.js} +1 -1
- package/storybook-static/assets/{misc-CTUkQJZp.js → misc-CFwTrVHp.js} +1 -1
- package/storybook-static/assets/{notifications-BG8AjXvz.js → notifications-gnKM3wlP.js} +1 -1
- package/storybook-static/assets/{odata-CRR_akjh.js → odata-C4pua5YA.js} +1 -1
- package/storybook-static/assets/odata-service-YWH6p1Lv.js +1 -0
- package/storybook-static/assets/{odataStoryFixtures-PVG3at72.js → odataStoryFixtures-CfzrHuke.js} +1 -1
- package/storybook-static/assets/{picker--dHpF_8R.js → picker-CO2rQx7C.js} +1 -1
- package/storybook-static/assets/{popover-C7IuVy8A.js → popover-Dr7yuAT9.js} +1 -1
- package/storybook-static/assets/{preset-select-BdZn2uKM.js → preset-select-CkU9ddp8.js} +1 -1
- package/storybook-static/assets/{react-18-D4-uI0-s.js → react-18-Cxgo9w_S.js} +1 -1
- package/storybook-static/assets/{react-B0PJhofa.js → react-CP3pw4PB.js} +1 -1
- package/storybook-static/assets/{react-dom-BEpDIi0j.js → react-dom-BrHiwR18.js} +1 -1
- package/storybook-static/assets/select-CXrVs_FQ.js +1 -0
- package/storybook-static/assets/{slider-BJzqv8Z5.js → slider-Cen5Jymh.js} +1 -1
- package/storybook-static/assets/{sortable-CJoTiZU9.js → sortable-Dme5pcO0.js} +1 -1
- package/storybook-static/assets/{syntaxhighlighter-RTCFPKCB-Bd_q63lk.js → syntaxhighlighter-RTCFPKCB-B8bc6fVI.js} +1 -1
- package/storybook-static/assets/{text-CDWQzubh.js → text-DrGSUN96.js} +1 -1
- package/storybook-static/assets/{theming-BKAcviS8.js → theming-0pJkCK9X.js} +1 -1
- package/storybook-static/assets/ui-CxfY9QDr.js +1 -0
- package/storybook-static/assets/{useODataSelectBase-CtRH172N.js → useODataSelectBase-DwrfQAdM.js} +1 -1
- package/storybook-static/assets/{useODataTreeData-tGexjqiT.js → useODataTreeData-DNpvGMOY.js} +1 -1
- package/storybook-static/assets/{utils-qWxRfpC-.js → utils-CYGhZ88S.js} +1 -1
- package/storybook-static/iframe.html +1 -1
- package/storybook-static/index.json +1 -1
- package/storybook-static/project.json +1 -1
- package/dist/chunks/CalendarView-DCQjO2ho.js.map +0 -1
- package/dist/chunks/date-input-DjAQ75n9.js.map +0 -1
- package/dist/image/ui/ImageSelection.d.ts +0 -40
- package/dist/image/ui/ImageSelection.d.ts.map +0 -1
- package/storybook-static/assets/DateInput-BJ-UIrN4.js +0 -1
- package/storybook-static/assets/DateInput-Bc-MiPp1.css +0 -1
- package/storybook-static/assets/formatter-L2YTDE3Q-DHQf5iqt.js +0 -1
- package/storybook-static/assets/grid-Bf_wg_Gd.js +0 -1
- package/storybook-static/assets/odata-service-Dn9Nfy2L.js +0 -1
- package/storybook-static/assets/select-C9w3BzZx.js +0 -1
- package/storybook-static/assets/ui-CcGcbmhp.js +0 -1
package/storybook-static/assets/{ODataSelect.stories-CHaNdl7F.js → ODataSelect.stories-GwKgtC-N.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-BdBCyVHz.js";import{t as i}from"./jsx-runtime-BBQGix-2.js";import{n as a,t as o}from"./ODataSelect-CLx5JSMi.js";import{a as s,i as c,n as l,r as u,s as d,t as f}from"./odataStoryFixtures-CfzrHuke.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-C7Q8GMMo.js";import{t as d}from"./jsx-runtime-BBQGix-2.js";import{t as f}from"./mdx-react-shim-DeqTfg7V.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-Da6MlEkV.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-BdBCyVHz.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-CfzrHuke.js";import{n as u,t as d}from"./useODataTreeData-DNpvGMOY.js";import{n as f,t as p}from"./TreeMultiSelect-Dp-JxGpF.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}){let g=u({odata:d,segments:f,model:m});return(0,h.jsx)(p,{label:e,description:t,disabled:n||g.isLoading,size:r,placeholder:i??g.placeholder,nodes:g.nodes,value:c,onChange:l,query:a,defaultQuery:o,onQuery:s,isLoading:g.isLoading,error:g.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:``}},composes:[`Omit`]}})),_=e({Basic:()=>S,ErrorState:()=>E,LoadingState:()=>T,MixedSelection:()=>w,ParentCompression:()=>C,__namedExportsOrder:()=>D,default:()=>x});function v({initialValue:e={},odata:t=s,segments:n=c,label:r=`ODataTreeMultiSelect`,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:[`Текущее значение: `,JSON.stringify(a)]})]})}var y,b,x,S,C,w,T,E,D,O=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={parameters:{odataMockMode:`loading`},render:()=>(0,b.jsx)(v,{description:`Сценарий загрузки дерева.`})},E={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-C7Q8GMMo.js";import{t as d}from"./jsx-runtime-BBQGix-2.js";import{t as f}from"./mdx-react-shim-DeqTfg7V.js";import{Basic as p,ErrorState as m,LoadingState as h,SelectParent as g,n as _,t as v}from"./ODataTreeSelect.stories-D8CwVfe-.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-BdBCyVHz.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-CfzrHuke.js";import{n as u,t as d}from"./useODataTreeData-DNpvGMOY.js";import{n as f,t as p}from"./TreeSelect-CCksSJfk.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-C7Q8GMMo.js";import{t as d}from"./jsx-runtime-BBQGix-2.js";import{t as f}from"./mdx-react-shim-DeqTfg7V.js";import{AutoSwitchByRange as p,Controlled as m,Disabled as h,n as g,t as _}from"./PeriodSelect.stories-BJXRGemD.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:`PeriodSelect`}),`
|
|
3
3
|
`,(0,b.jsx)(i,{children:`Выбор периода детализации дат с ограничением вариантов по связанному диапазону`}),`
|
|
4
4
|
`,(0,b.jsxs)(o.p,{children:[`PeriodSelect используется для выбора уровня детализации: `,(0,b.jsx)(o.code,{children:`day`}),`, `,(0,b.jsx)(o.code,{children:`week`}),` или `,(0,b.jsx)(o.code,{children:`month`}),`. Компонент хранит только id выбранного периода, а недоступность вариантов вычисляет по переданному `,(0,b.jsx)(o.code,{children:`dateRange`}),` и порогам `,(0,b.jsx)(o.code,{children:`maxDayRangeDays`}),` / `,(0,b.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-BdBCyVHz.js";import{t as i}from"./jsx-runtime-BBQGix-2.js";import{i as a,t as o}from"./text-DrGSUN96.js";import{N as s,b as c,s as l,t as u}from"./formatters-BloK5ams.js";import{t as d}from"./DateInput-6pvp1eRu.js";import{c as f,n as p,t as m}from"./preset-select-CkU9ddp8.js";import{i as h}from"./Grid-CCVTg58v.js";import{t as g}from"./grid-CZAlVfwE.js";var _=n((()=>{}));function v({maxDayRangeDays:e,maxWeekRangeWeeks:t}={}){let n=s(e),r=s(t);return x.map(e=>e.id===`day`&&n!==void 0?{...e,maxRangeDays:n}:e.id===`week`&&r!==void 0?{...e,maxRangeDays:r*7}:{...e})}function y(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 b(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&&!y(i,n)?i.id:(r>=0?t.slice(r+1):t).find(e=>!y(e,n))?.id??t.find(e=>!y(e,n))?.id}var x,S=n((()=>{u(),x=Object.freeze([{id:`day`,label:`по дням`},{id:`week`,label:`по неделям`},{id:`month`,label:`по месяцам`}]),Object.freeze([`day`,`week`,`month`]),new Set(x.map(e=>e.id))})),C=n((()=>{_(),S()}));function w({value:e,onChange:t,options:n,dateRange:r,maxDayRangeDays:i,maxWeekRangeWeeks:a,...o}){let s=(0,T.useMemo)(()=>n??v({maxDayRangeDays:i,maxWeekRangeWeeks:a}),[i,a,n]),c=(0,T.useMemo)(()=>b(e,s,r),[r,s,e]),l=(0,T.useEffectEvent)(()=>{c===void 0||c===e||t(c)});return(0,T.useEffect)(()=>{l()},[c,e]),(0,E.jsx)(p,{...o,options:s,value:c,onChange:t,getOptionDisabled:e=>y(e,r)})}var T,E,D=n((()=>{T=t(r(),1),m(),C(),E=i(),w.__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:``},dateRange:{required:!1,tsType:{name:`DateRangeInput`},description:``},maxDayRangeDays:{required:!1,tsType:{name:`number`},description:``},maxWeekRangeWeeks:{required:!1,tsType:{name:`number`},description:``}}}})),O=n((()=>{C(),D()})),k=e({AutoSwitchByRange:()=>z,Controlled:()=>R,Disabled:()=>B,__namedExportsOrder:()=>V,default:()=>L});function A(e){return e!==void 0&&c(e)?e:null}function j(e){let[,t]=N(),n=A(e.dateRange),r=l(e.dateRange??null);return(0,M.jsxs)(h,{gap:`md`,children:[(0,M.jsx)(w,{...e,onChange:n=>{e.onChange(n),t({value:n})}}),(0,M.jsx)(d,{label:`Связанный диапазон дат`,placeholder:`дд.мм.гггг - дд.мм.гггг`,value:n,onChange:e=>t({dateRange:e??void 0})}),(0,M.jsxs)(a,{as:`p`,color:`secondary`,"aria-live":`polite`,children:[`Выбрано: `,(0,M.jsx)(a,{as:`code`,children:e.value??`не выбрано`}),`. Дней в диапазоне:`,` `,(0,M.jsx)(a,{as:`code`,children:r??`не задано`}),`.`]})]})}var M,N,P,F,I,L,R,z,B,V,H=n((()=>{u(),f(),g(),o(),O(),M=i(),{useArgs:N}=__STORYBOOK_MODULE_PREVIEW_API__,{fn:P}=__STORYBOOK_MODULE_TEST__,F=[new Date(2026,2,1,0,0,0),new Date(2026,2,14,23,59,59)],I=[new Date(2026,0,1,0,0,0),new Date(2026,4,20,23,59,59)],L={title:`Shared/UI/PeriodSelect`,component:w,args:{label:`Период детализации`,description:`Выберите уровень группировки дат.`,placeholder:`Выберите период`,value:`day`,onChange:P(),dateRange:F,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:[`day`,`week`,`month`]},onChange:{description:`Вызывается с id выбранного периода.`,control:!1},options:{description:"Кастомный список периодов по контракту `PeriodSelectOption`.",control:!1},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`]}}},R={name:`Контролируемый выбор`,render:function(e){return(0,M.jsx)(j,{...e})}},z={name:`Автопереключение по диапазону`,args:{value:`day`,dateRange:I,maxDayRangeDays:31,maxWeekRangeWeeks:8},render:function(e){return(0,M.jsx)(j,{...e})}},B={name:`Заблокированный контрол`,args:{disabled:!0,value:`week`}},R.parameters={...R.parameters,docs:{...R.parameters?.docs,source:{originalSource:`{
|
|
2
2
|
name: "Контролируемый выбор",
|
|
3
3
|
render: function Render(args) {
|
|
4
4
|
return <PeriodSelectStoryCanvas {...args} />;
|
|
@@ -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-C7Q8GMMo.js";import{t as d}from"./jsx-runtime-BBQGix-2.js";import{t as f}from"./mdx-react-shim-DeqTfg7V.js";import{AnchorPlacement as p,Controlled as m,Default as h,WithInteractiveContent as g,n as _,t as v}from"./Popover.stories-wr4nVVeK.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-BdBCyVHz.js";import{t as i}from"./jsx-runtime-BBQGix-2.js";import{a,i as o}from"./popover-Dr7yuAT9.js";import{n as s,t as c}from"./Button-gqIyGTVm.js";import{c as l,t as u}from"./Input-D7RhI3F_.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-C7Q8GMMo.js";import{t as d}from"./jsx-runtime-BBQGix-2.js";import{t as f}from"./mdx-react-shim-DeqTfg7V.js";import{Default as p,n as m,t as h}from"./PresetRangeDateInput.stories-CiMPYtxH.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-BdBCyVHz.js";import{t as i}from"./jsx-runtime-BBQGix-2.js";import{i as a,t as o}from"./text-DrGSUN96.js";import{o as s}from"./Flex-DycwM4Fy.js";import{t as c}from"./flex-DkVQD9fQ.js";import{t as l}from"./DateInput-6pvp1eRu.js";import{c as u}from"./preset-select-CkU9ddp8.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-CAB32ti_.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-C7Q8GMMo.js";import{t as d}from"./jsx-runtime-BBQGix-2.js";import{t as f}from"./mdx-react-shim-DeqTfg7V.js";import{Controlled as p,Disabled as m,Group as h,n as g,t as _}from"./RadioButton.stories-BysL-Bxz.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.
|
package/storybook-static/assets/{RadioButton.stories-CNekwXt5.js → RadioButton.stories-BysL-Bxz.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-BdBCyVHz.js";import{t as i}from"./jsx-runtime-BBQGix-2.js";import{a,i as o}from"./utils-CYGhZ88S.js";import{H as s,t as c}from"./lucide-react-CkksFLP-.js";import{n as l,t as u}from"./ui.module-DS2qtZts.js";import{n as d,r as f}from"./uiClasses-CZ_HVS3Y.js";import{n as p,t as m}from"./CheckBox.module-Hr3mvdAC.js";var h,g,_=n((()=>{h=`gu8UMB`,g={radioInput:h}})),v,y,b,x=n((()=>{v=t(r(),1),o(),c(),p(),u(),f(),_(),y=i(),b=({label:e,description:t,placeholder:n,disabled:r,size:i,className:o,onChange:c,value:u,id:f,tone:p=`neutral`,...h})=>{let _=(0,v.useId)(),b=f??_,x=t?`${b}-description`:void 0,S=e??n,C=u??!1;return(0,y.jsxs)(`div`,{className:a(l.uiElement,i&&l.uiSizable,i&&l[i],r&&l.disabled,o),children:[(0,y.jsxs)(`div`,{className:m.row,children:[(0,y.jsxs)(`div`,{className:a(m.wrapper,d(p)),children:[(0,y.jsx)(`input`,{...h,id:b,type:`checkbox`,role:`radio`,checked:C,disabled:r,"aria-disabled":r,"aria-checked":C,"aria-describedby":x,className:a(l.uiSelectionControl,m.input,g.radioInput),onChange:()=>c?.(!C)}),(0,y.jsx)(`div`,{className:a(l.uiSelectionIcon,m.icon),"aria-hidden":`true`,children:(0,y.jsx)(s,{})})]}),S&&(0,y.jsx)(`label`,{htmlFor:b,className:l.uiLabel,children:S})]}),t&&(0,y.jsx)(`p`,{id:x,className:l.uiDescription,children:t})]})},b.__docgenInfo={description:`Компонент радиокнопки для выбора одного варианта.
|
|
2
2
|
Поддерживает tone + appearance и использует общие selection utility-классы из ui.module.scss.`,methods:[],displayName:`RadioButton`,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:``},tone:{required:!1,tsType:{name:`union`,raw:`"neutral" | "error" | "warning" | "success" | "info"`,elements:[{name:`literal`,value:`"neutral"`},{name:`literal`,value:`"error"`},{name:`literal`,value:`"warning"`},{name:`literal`,value:`"success"`},{name:`literal`,value:`"info"`}]},description:``,defaultValue:{value:`"neutral"`,computed:!1}}},composes:[`Omit`]}})),S=e({Controlled:()=>E,Disabled:()=>O,Group:()=>D,__namedExportsOrder:()=>k,default:()=>T}),C,w,T,E,D,O,k,A=n((()=>{C=t(r(),1),x(),w=i(),T={title:`Shared/UI/RadioButton`,component:b,args:{value:!1,onChange:()=>{}},parameters:{atomicCanvas:!0,layout:`padded`},argTypes:{label:{description:`Текст подписи радиокнопки.`,control:`text`},description:{description:`Дополнительное описание под элементом.`,control:`text`},placeholder:{description:"Резервная подпись, если `label` не задан.",control:`text`},value:{description:`Признак выбранного состояния.`,control:`boolean`},onChange:{description:`Вызывается при изменении выбранности.`,control:!1},disabled:{description:`Блокирует взаимодействие.`,control:`boolean`},size:{description:`Размер визуального контрола и подписи.`,control:`select`,options:[`xs`,`sm`,`md`,`lg`,`xl`]},tone:{description:`Семантический тон радиокнопки.`,control:`inline-radio`,options:[`neutral`,`error`,`warning`,`success`,`info`]},name:{description:"HTML `name` для группировки кнопок.",control:`text`}}},E={render:e=>{let[t,n]=(0,C.useState)(e.value??!1);return(0,w.jsx)(b,{...e,value:t,onChange:n})},args:{label:`Выбрать опцию`,description:`Одиночная радиокнопка в controlled-режиме.`,value:!1,name:`single-radio`,tone:`neutral`}},D={render:()=>{let[e,t]=(0,C.useState)(`email`);return(0,w.jsxs)(`div`,{role:`radiogroup`,"aria-label":`Канал уведомлений`,style:{display:`grid`,gap:12},children:[(0,w.jsx)(b,{name:`notify-channel`,label:`Email`,value:e===`email`,onChange:e=>e&&t(`email`),tone:`info`}),(0,w.jsx)(b,{name:`notify-channel`,label:`SMS`,value:e===`sms`,onChange:e=>e&&t(`sms`),tone:`info`})]})},args:{value:void 0}},O={args:{label:`Недоступная опция`,description:`Заблокировано политикой конфигурации.`,value:!0,disabled:!0,tone:`neutral`}},E.parameters={...E.parameters,docs:{...E.parameters?.docs,source:{originalSource:`{
|
|
3
3
|
render: args => {
|
|
4
4
|
const [value, setValue] = useState(args.value ?? false);
|
|
@@ -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-BdBCyVHz.js";import{t as r}from"./jsx-runtime-BBQGix-2.js";import{a as i,i as a,n as o,o as s}from"./utils-CYGhZ88S.js";import{n as c,t as l}from"./ui.module-DS2qtZts.js";var u,d,f,p,m,h,g,_=t((()=>{u=`nINbA6`,d=`GL-UWx`,f=`_6PeF-i`,p=`_5wP4aR`,m=`S3MnZI`,h=`KHJ0ja`,g={radioGroup:u,noWrap:d,horizontal:f,vertical:p,radioItem:m,checked:h}}));function v({value:e,onChange:t,label:n,description:r,disabled:a,className:o,noWrap:s,orientation:l=`horizontal`,"aria-label":u,children:d}){let f=(0,b.useId)(),p=n?`${f}-label`:void 0,m=r?`${f}-description`:void 0,[h,_]=(0,b.useState)([]),v=(0,b.useCallback)(e=>t?.(e),[t]),y=(0,b.useCallback)(e=>(_(t=>t.includes(e)?t:[...t,e]),()=>{_(t=>t.filter(t=>t!==e))}),[]),C=(0,b.useMemo)(()=>({value:e,onChange:v,disabled:a,orientation:l,groupId:f,labelId:p,descriptionId:m,firstOptionId:h[0],registerOption:y}),[m,a,f,v,p,l,y,h,e]);return(0,x.jsxs)(`div`,{className:i(c.uiElement,a&&c.disabled,o),children:[n&&(0,x.jsx)(`div`,{id:p,className:c.uiLabel,children:n}),r&&(0,x.jsx)(`div`,{id:m,className:c.uiDescription,children:r}),(0,x.jsx)(S.Provider,{value:C,children:(0,x.jsx)(`div`,{role:`radiogroup`,"aria-labelledby":p,"aria-label":p?void 0:u,"aria-describedby":m,"aria-disabled":a||void 0,"data-disabled":a||void 0,className:i(c.uiInputControl,g.radioGroup,s&&g.noWrap,g[l]),children:d})})]})}function y({value:e,label:t,description:n,className:r}){let a=(0,b.useContext)(S),c=(0,b.useId)(),l=a?.registerOption;if((0,b.useLayoutEffect)(()=>{if(l)return l(c)},[l,c]),!a)return(0,x.jsxs)(`div`,{className:i(g.radioItem,r),children:[(0,x.jsx)(`p`,{className:`textNoWrap`,children:t}),n&&(0,x.jsx)(`div`,{className:`fontSizeSm content2`,children:n})]});let u=Object.is(a.value,e),d=a.disabled===!0,f=a.value===void 0&&a.firstOptionId===c,p=()=>{d||u||a.onChange?.(e)};return(0,x.jsxs)(`button`,{id:`${a.groupId}-option-${c}`,type:`button`,role:`radio`,"aria-checked":u,disabled:d,tabIndex:u||f?0:-1,className:i(g.radioItem,u&&g.checked,r),"data-ui":`radio-option`,"data-action":`select-radio-option`,onClick:p,onKeyDown:e=>{if(d||o(e,p))return;let t=e.currentTarget,n=t.closest(`[role="radiogroup"]`),r=Array.from(n?.querySelectorAll(`[role="radio"]:not([disabled])`)??[]);if(!r.length)return;let i=r.indexOf(t);if(i===-1)return;let c=s({currentIndex:i,itemCount:r.length,key:e.key,orientation:a.orientation});c!==null&&(e.preventDefault(),r[c]?.focus(),r[c]?.click())},children:[(0,x.jsx)(`p`,{className:`textNoWrap`,children:t}),n&&(0,x.jsx)(`div`,{className:`fontSizeSm content2`,children:n})]})}var b,x,S,C=t((()=>{b=e(n(),1),a(),l(),_(),x=r(),S=(0,b.createContext)(null),v.Option=y,v.__docgenInfo={description:`Группа радиокнопок с общим состоянием выбранного значения. Обеспечивает единый API выбора и контекст для дочерних опций.`,methods:[{name:`Option`,docblock:null,modifiers:[`static`],params:[{name:`{ value, label, description, className }: OptionProps<T>`,optional:!1,type:{name:`OptionProps`,elements:[{name:`T`}],raw:`OptionProps<T>`,alias:`OptionProps`}}],returns:null}],displayName:`RadioGroup`,props:{value:{required:!1,tsType:{name:`T`},description:``},onChange:{required:!1,tsType:{name:`signature`,type:`function`,raw:`(value: T) => void`,signature:{arguments:[{type:{name:`T`},name:`value`}],return:{name:`void`}}},description:``},label:{required:!1,tsType:{name:`string`},description:``},description:{required:!1,tsType:{name:`string`},description:``},disabled:{required:!1,tsType:{name:`boolean`},description:``},className:{required:!1,tsType:{name:`string`},description:``},noWrap:{required:!1,tsType:{name:`literal`,value:`true`},description:``},orientation:{required:!1,tsType:{name:`union`,raw:`"vertical" | "horizontal"`,elements:[{name:`literal`,value:`"vertical"`},{name:`literal`,value:`"horizontal"`}]},description:``,defaultValue:{value:`"horizontal"`,computed:!1}},"aria-label":{required:!1,tsType:{name:`string`},description:``},children:{required:!0,tsType:{name:`ReactReactNode`,raw:`React.ReactNode`},description:``}}},y.__docgenInfo={description:"Опция внутри `RadioGroup`, представляющая одно выбираемое значение. Отрисовывает подпись, описание и состояние выбора.",methods:[],displayName:`Option`,props:{value:{required:!0,tsType:{name:`T`},description:``},label:{required:!0,tsType:{name:`ReactNode`},description:``},description:{required:!1,tsType:{name:`ReactNode`},description:``},className:{required:!1,tsType:{name:`string`},description:``}}}}));export{C as n,v 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-C7Q8GMMo.js";import{t as d}from"./jsx-runtime-BBQGix-2.js";import{t as f}from"./mdx-react-shim-DeqTfg7V.js";import{Controlled as p,Disabled as m,Vertical as h,n as g,t as _}from"./RadioGroup.stories-Dhx6ULhk.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:`RadioGroup`}),`
|
|
3
3
|
`,(0,b.jsx)(i,{children:`Группа взаимоисключающих опций с поддержкой горизонтальной и вертикальной раскладки`}),`
|
|
4
4
|
`,(0,b.jsx)(o.p,{children:`RadioGroup уже имеет живые stories, а эта страница собирает их в структурированную документацию с краткими рекомендациями, примерами подключения и API.
|
package/storybook-static/assets/{RadioGroup.stories-D9RU6f5W.js → RadioGroup.stories-Dhx6ULhk.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-BdBCyVHz.js";import{t as i}from"./jsx-runtime-BBQGix-2.js";import{n as a,t as o}from"./RadioGroup-B1xxoy7T.js";var s=e({Controlled:()=>f,Disabled:()=>m,Vertical:()=>p,__namedExportsOrder:()=>h,default:()=>d});function c(e){return(0,u.jsx)(o,{...e})}var l,u,d,f,p,m,h,g=n((()=>{l=t(r(),1),a(),u=i(),d={title:`Shared/UI/RadioGroup`,component:c,args:{value:`email`,onChange:()=>{},orientation:`horizontal`,label:`Канал уведомлений`,description:`Выберите основной канал доставки`,disabled:!1},parameters:{atomicCanvas:!0,layout:`padded`},argTypes:{value:{description:`Текущее выбранное значение.`,control:`text`},onChange:{description:`Вызывается при смене выбранной опции.`,control:!1},label:{description:`Заголовок группы опций.`,control:`text`},description:{description:`Описание под заголовком.`,control:`text`},disabled:{description:`Блокирует выбор опций.`,control:`boolean`},noWrap:{description:`Запрещает перенос опций на новую строку.`,control:`boolean`},orientation:{description:`Ориентация расположения опций.`,control:`inline-radio`,options:[`horizontal`,`vertical`]},className:{description:`Дополнительный CSS-класс контейнера.`,control:`text`},children:{description:"Элементы `RadioGroup.Option` внутри группы.",control:!1}}},f={render:e=>{let[t,n]=(0,l.useState)(`email`);return(0,u.jsxs)(`div`,{style:{display:`grid`,gap:10},children:[(0,u.jsxs)(c,{...e,value:t,onChange:n,children:[(0,u.jsx)(o.Option,{value:`email`,label:`Email`,description:`Письма на корпоративную почту`}),(0,u.jsx)(o.Option,{value:`sms`,label:`SMS`,description:`Сообщения на телефон`}),(0,u.jsx)(o.Option,{value:`push`,label:`Push`,description:`Уведомления в приложении`})]}),(0,u.jsxs)(`div`,{children:[`Выбрано: `,t]})]})},args:{children:void 0}},p={render:e=>{let[t,n]=(0,l.useState)(`draft`);return(0,u.jsxs)(c,{...e,value:t,onChange:n,orientation:`vertical`,label:`Статус документа`,children:[(0,u.jsx)(o.Option,{value:`draft`,label:`Черновик`}),(0,u.jsx)(o.Option,{value:`review`,label:`На согласовании`}),(0,u.jsx)(o.Option,{value:`approved`,label:`Утвержден`})]})},args:{orientation:`vertical`,children:void 0}},m={render:e=>(0,u.jsxs)(c,{...e,disabled:!0,children:[(0,u.jsx)(o.Option,{value:`yes`,label:`Да`}),(0,u.jsx)(o.Option,{value:`no`,label:`Нет`})]}),args:{disabled:!0,value:`yes`,children:void 0}},f.parameters={...f.parameters,docs:{...f.parameters?.docs,source:{originalSource:`{
|
|
2
2
|
render: args => {
|
|
3
3
|
const [value, setValue] = useState("email");
|
|
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-C7Q8GMMo.js";import{t as d}from"./jsx-runtime-BBQGix-2.js";import{t as f}from"./mdx-react-shim-DeqTfg7V.js";import{ControlledObjects as p,CustomOptionLayout as m,Disabled as h,Placeholder as g,PrimitiveOptions as _,n as v,t as y}from"./Select.stories-CvSTPVuR.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:`Select`}),`
|
|
3
3
|
`,(0,S.jsx)(i,{children:`Getter-based select для примитивов и сложных объектных option`}),`
|
|
4
4
|
`,(0,S.jsx)(o.p,{children:`Select уже имеет живые stories, а эта страница собирает их в структурированную документацию с краткими рекомендациями, примерами подключения и API.
|
|
@@ -1,4 +1,4 @@
|
|
|
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-BdBCyVHz.js";import{t as r}from"./jsx-runtime-BBQGix-2.js";import{a as i,i as a}from"./utils-CYGhZ88S.js";import{n as o,t as s,ut as c}from"./lucide-react-CkksFLP-.js";import{n as l,t as u}from"./ui.module-DS2qtZts.js";import{T as ee,b as te,d as ne,f as d,g as re,l as ie,m as ae,r as oe,s as se,t as f,v as p}from"./picker-CO2rQx7C.js";function m({option:e,getOptionLabel:t,getOptionCode:n}){return[d(t(e)),d(n?.(e))].filter(e=>!!e).join(` `).toLowerCase()}var h=t((()=>{f()})),g=t((()=>{h()})),_,v,y,b=t((()=>{_=`aEEqH1`,v=`_4HQKa7`,y={inputWithOverlay:_,valueOverlay:v}}));function x(e){let{label:t,description:n,disabled:r,placeholder:a,size:s,options:u,value:f,onChange:h,getOptionKey:g,getOptionLabel:_,getOptionCode:v,getOptionDisabled:b,getOptionAriaLabel:x,getOptionClassName:w,renderOption:T,renderValue:E,className:D,buttonClassName:O,optionsClassName:k,optionsContentClassName:ce,searchable:A=!1,defaultFilter:le=!0,query:ue,defaultQuery:de,onQuery:fe,renderPopupHeader:pe,emptyState:j,loadingState:M,errorState:N,placement:P=`bottom-start`,clearable:F=!1}=e,I=h,L=(0,S.useRef)(null),[R,z]=(0,S.useState)(!1),B=A?`search-single`:`display`,V=f===void 0?void 0:g(f),H=V===void 0?void 0:u.find(e=>g(e)===V)??f,{query:U,setQuery:W}=se({open:R,query:ue,defaultQuery:de,onQuery:fe,triggerMode:B}),G=ne({options:u,query:U,enabled:A&&le,getSearchText:e=>m({option:e,getOptionLabel:_,getOptionCode:v})}),{activeIndex:me,context:he,floatingStyles:ge,getFloatingProps:_e,setReference:ve,setFloating:ye,setOptionRef:be,close:K,openList:xe,toggleOpen:Se,selectOption:Ce,selectActiveOption:we,handleReferenceKeyDown:Te,handleFloatingKeyDown:Ee,getOptionId:De,getActiveOptionId:q}=ie({options:G,selectedIndex:V===void 0?-1:G.findIndex(e=>g(e)===V),open:R,onOpenChange:z,getOptionDisabled:b,onSelect:I,disabled:r,placement:P,triggerMode:B}),J=G.length>0,Y=H===void 0?void 0:_(H),X=H===void 0?void 0:E?E(H):Y,Oe=d(Y),ke=H===void 0?void 0:d(v?.(H)),Ae=d(X)??Oe??ke??(V===void 0?``:String(V)),Z=A&&(R||U.length>0),je=Z?U:H===void 0?``:Ae,Q=H!==void 0&&X!==void 0&&d(X)===void 0&&!Z,$=oe({mode:B,open:R,currentQuery:U,hasDisplayValue:H!==void 0,inputRef:L,setQuery:W,openList:xe,close:K,toggleOpen:Se}),Me=e=>{L.current=e},Ne=()=>{F&&I(void 0),W(``),K()};return(0,C.jsx)(ee,{label:t,description:n,disabled:r,placeholder:a,size:s,className:D,children:({controlId:e,labelId:t,describedBy:n})=>{let s=`${e}-listbox`;return(0,C.jsxs)(C.Fragment,{children:[(0,C.jsx)(ae,{ref:Me,rootRef:ve,id:e,type:`text`,disabled:r,readOnly:!A,autoComplete:`off`,role:`combobox`,value:je,placeholder:H===void 0||Z?a:void 0,"aria-labelledby":t,"aria-describedby":n,"aria-haspopup":`listbox`,"aria-expanded":R,"aria-controls":R?s:void 0,"aria-autocomplete":A?`list`:`none`,"aria-activedescendant":R?q(s):void 0,inputClassName:i(Q&&y.inputWithOverlay,O,`textOverflow`),overlay:Q?(0,C.jsx)(`div`,{className:y.valueOverlay,children:X}):void 0,endAdornment:(0,C.jsx)(re,{open:R,disabled:r,onToggleMouseDown:$.handleToggleMouseDown,onToggleClick:$.handleToggleClick,children:F&&H!==void 0&&!r?(0,C.jsx)(`button`,{type:`button`,className:l.uiClearButton,"data-ui":`select-clear-button`,"data-action":`clear-select`,onMouseDown:e=>{e.preventDefault(),e.stopPropagation()},onClick:e=>{e.preventDefault(),e.stopPropagation(),Ne()},"aria-label":`Очистить выбор`,children:(0,C.jsx)(o,{})}):null}),onChange:e=>{A&&$.handleTriggerInputChange(e.target.value)},onClick:$.handleTriggerClick,onFocus:e=>{$.handleTriggerFocus(e.currentTarget)},onKeyDown:e=>{Te(e),!e.defaultPrevented&&$.handleTriggerKeyDown({event:e,onActivateWhenOpen:we,enableSpaceActivation:!A})}}),(0,C.jsx)(te,{open:R,context:he,floatingStyles:ge,listId:s,labelId:t,descriptionId:n,activeOptionId:J?q(s):void 0,setFloating:ye,getFloatingProps:_e,onKeyDown:Ee,className:i(l.uiPopupOptions,k),header:pe,children:(0,C.jsx)(`div`,{className:i(ce,`h100 scrollable`),children:J?G.map((e,t)=>{let n=g(e),r=V!==void 0&&n===V,a=t===me,o=b?.(e)??!1,u={active:a,selected:r,disabled:o};return(0,C.jsx)(`div`,{id:De(s,t),ref:e=>be(t,e),role:`option`,"aria-selected":r,"aria-disabled":o||void 0,"aria-label":x?.(e),className:i(l.uiPopupOption,o&&l.disabled,a&&l.uiPopupOptionActive,r&&l.selected,w?.(e,u)),onClick:()=>Ce(e),children:T?T(e,u):(0,C.jsxs)(C.Fragment,{children:[r?(0,C.jsx)(c,{className:l.uiPopupOptionIcon}):(0,C.jsx)(`span`,{className:l.uiPopupOptionIcon}),(0,C.jsx)(`div`,{className:l.uiOptionText,children:_(e)}),v&&(0,C.jsx)(`div`,{className:l.uiOptionCode,children:v(e)})]})},n)}):(0,C.jsx)(p,{emptyState:j,loadingState:M,errorState:N})})})]})}})}var S,C,w=t((()=>{S=e(n(),1),a(),s(),f(),u(),g(),b(),C=r(),x.__docgenInfo={description:`Выпадающий список выбора значения из набора опций. Подходит для форм, фильтров и простых справочников.`,methods:[],displayName:`Select`,props:{options:{required:!0,tsType:{name:`unknown`},description:``},getOptionKey:{required:!0,tsType:{name:`signature`,type:`function`,raw:`(option: TOption) => SelectOptionKey`,signature:{arguments:[{type:{name:`TOption`},name:`option`}],return:{name:`union`,raw:`string | number`,elements:[{name:`string`},{name:`number`}]}}},description:``},getOptionLabel:{required:!0,tsType:{name:`signature`,type:`function`,raw:`(option: TOption) => ReactNode`,signature:{arguments:[{type:{name:`TOption`},name:`option`}],return:{name:`ReactNode`}}},description:``},getOptionCode:{required:!1,tsType:{name:`signature`,type:`function`,raw:`(option: TOption) => ReactNode`,signature:{arguments:[{type:{name:`TOption`},name:`option`}],return:{name:`ReactNode`}}},description:``},getOptionDisabled:{required:!1,tsType:{name:`signature`,type:`function`,raw:`(option: TOption) => boolean`,signature:{arguments:[{type:{name:`TOption`},name:`option`}],return:{name:`boolean`}}},description:``},getOptionAriaLabel:{required:!1,tsType:{name:`signature`,type:`function`,raw:`(option: TOption) => string`,signature:{arguments:[{type:{name:`TOption`},name:`option`}],return:{name:`string`}}},description:``},getOptionClassName:{required:!1,tsType:{name:`signature`,type:`function`,raw:`(option: TOption, state: SelectOptionState) => string | undefined`,signature:{arguments:[{type:{name:`TOption`},name:`option`},{type:{name:`signature`,type:`object`,raw:`{
|
|
2
2
|
active: boolean;
|
|
3
3
|
selected: boolean;
|
|
4
4
|
disabled: boolean;
|
|
@@ -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-BdBCyVHz.js";import{t as i}from"./jsx-runtime-BBQGix-2.js";import{n as a,t as o}from"./Select-DTyFJMMc.js";var s=e({ControlledObjects:()=>p,CustomOptionLayout:()=>g,Disabled:()=>_,Placeholder:()=>h,PrimitiveOptions:()=>m,__namedExportsOrder:()=>v,default:()=>f}),c,l,u,d,f,p,m,h,g,_,v,y=n((()=>{c=t(r(),1),a(),l=i(),u=[{id:1,name:`Отдел продаж`,code:`SLS`,manager:`Елена Миронова`},{id:2,name:`Закупки`,code:`PRC`,manager:`Антон Мелихов`},{id:3,name:`Логистика`,code:`LGS`,manager:`Мария Климова`,disabled:!0},{id:4,name:`Поддержка клиентов`,code:`SUP`,manager:`Ирина Белова`}],d=[`Новый`,`В работе`,`Завершён`,`Архив`],f={title:`Shared/UI/Select`,component:o,args:{label:`Подразделение`,description:`Выберите подразделение из списка.`,placeholder:`Не выбрано`,value:void 0,options:u,onChange:()=>{},getOptionKey:e=>e.id,getOptionLabel:e=>e.name,getOptionCode:e=>e.code,getOptionDisabled:e=>e.disabled??!1,size:`md`},parameters:{atomicCanvas:!0,layout:`padded`,docs:{description:{component:`Низкоуровневый getter-based select. Подходит для произвольных структур данных, примитивов и сложного кастомного рендера. Компонент возвращает наружу саму выбранную option. Для сериализуемых конфигов и сценариев с optionKey/optionLabel используйте SerializableSelect.`}}},argTypes:{label:{description:`Заголовок поля.`,control:`text`},description:{description:`Описание под заголовком.`,control:`text`},placeholder:{description:`Текст, когда значение ещё не выбрано.`,control:`text`},value:{description:`Текущая выбранная option целиком.`,control:!1},options:{description:`Массив опций любого поддерживаемого формата.`,control:!1},onChange:{description:`Вызывается с выбранной option.`,control:!1},getOptionKey:{description:`Функция получения уникального ключа option.`,control:!1},getOptionLabel:{description:`Функция получения основного текста option.`,control:!1},getOptionCode:{description:`Опциональный рендер дополнительного кода справа.`,control:!1},getOptionDisabled:{description:`Опциональная функция блокировки отдельных option.`,control:!1},getOptionAriaLabel:{description:`Опциональная функция для aria-label option.`,control:!1},getOptionClassName:{description:`Опциональная функция CSS-класса option по её состоянию.`,control:!1},renderOption:{description:`Полностью кастомный рендер option в списке.`,control:!1},renderValue:{description:`Кастомный рендер выбранного значения в кнопке.`,control:!1},className:{description:`Дополнительный CSS-класс корневого контейнера.`,control:`text`},buttonClassName:{description:`Дополнительный CSS-класс кнопки выбора.`,control:`text`},optionsClassName:{description:`Дополнительный CSS-класс контейнера списка.`,control:`text`},size:{description:`Размер поля и подписей.`,control:`select`,options:[`xs`,`sm`,`md`,`lg`,`xl`]},placement:{description:`Позиционирование выпадающего списка.`,control:`select`,options:[`bottom-start`,`bottom-end`,`top-start`,`top-end`]},disabled:{description:`Блокирует взаимодействие с полем.`,control:`boolean`}}},p={name:`Объекты`,render:e=>{let[t,n]=(0,c.useState)(u[1]);return(0,l.jsx)(o,{...e,value:t,onChange:n})}},m={name:`Примитивы`,render:()=>{let[e,t]=(0,c.useState)(d[1]);return(0,l.jsx)(o,{label:`Статус`,description:`Пример использования низкоуровневого Select со строковыми значениями.`,placeholder:`Выберите статус`,options:d,value:e,onChange:t,getOptionKey:e=>e,getOptionLabel:e=>e,size:`md`})}},h={render:e=>{let[t,n]=(0,c.useState)(void 0);return(0,l.jsx)(o,{...e,value:t,onChange:n})}},g={name:`Кастомный рендер`,render:e=>{let[t,n]=(0,c.useState)(u[0]);return(0,l.jsx)(o,{...e,value:t,onChange:n,renderValue:e=>`${e.code} · ${e.name}`,renderOption:(e,t)=>(0,l.jsxs)(l.Fragment,{children:[(0,l.jsxs)(`div`,{className:`flexEllipsis`,children:[(0,l.jsx)(`div`,{children:e.name}),(0,l.jsx)(`div`,{className:`fontSizeSm content2`,children:e.manager})]}),(0,l.jsx)(`div`,{style:{opacity:t.selected?1:.5},children:e.code})]})})}},_={args:{disabled:!0,value:u[0]}},p.parameters={...p.parameters,docs:{...p.parameters?.docs,source:{originalSource:`{
|
|
2
2
|
name: "Объекты",
|
|
3
3
|
render: args => {
|
|
4
4
|
const [value, setValue] = useState<DepartmentOption | undefined>(departmentOptions[1]);
|
package/storybook-static/assets/{SelectOptionContent-B9fxCwa1.js → SelectOptionContent-DXQBspsR.js}
RENAMED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{i as e}from"./preload-helper-B45gAKPr.js";import{t}from"./jsx-runtime-BBQGix-2.js";import{a as n,i as r}from"./utils-
|
|
1
|
+
import{i as e}from"./preload-helper-B45gAKPr.js";import{t}from"./jsx-runtime-BBQGix-2.js";import{a as n,i as r}from"./utils-CYGhZ88S.js";import{o as i,t as a}from"./text-DrGSUN96.js";import{n as o,t as s}from"./ui.module-DS2qtZts.js";function c({label:e,code:t,highlight:r}){return(0,l.jsxs)(`div`,{className:o.uiOptionBase,children:[(0,l.jsx)(`div`,{className:n(o.uiOptionText,`flexEllipsis`),children:(0,l.jsx)(i,{text:e,highlight:r})}),t&&(0,l.jsx)(`div`,{className:o.uiOptionCode,children:(0,l.jsx)(i,{text:t,highlight:r})})]})}var l,u=e((()=>{r(),a(),s(),l=t(),c.__docgenInfo={description:`Универсальный рендерер опции. Используется и в single-select, и в multi-select.`,methods:[],displayName:`SelectOptionContent`,props:{label:{required:!0,tsType:{name:`string`},description:``},code:{required:!1,tsType:{name:`string`},description:``},highlight:{required:!1,tsType:{name:`string`},description:``}}}}));export{u as n,c as t};
|
package/storybook-static/assets/{SerializableSelect-CYs-Pu-J.js → SerializableSelect-Byb9ssGD.js}
RENAMED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{i as e}from"./preload-helper-B45gAKPr.js";import{t}from"./jsx-runtime-BBQGix-2.js";import{n,t as r}from"./Select-
|
|
1
|
+
import{i as e}from"./preload-helper-B45gAKPr.js";import{t}from"./jsx-runtime-BBQGix-2.js";import{n,t as r}from"./Select-DTyFJMMc.js";function i(e,t){return e[t]}function a(e,t,n){let r=e[t];if(typeof r==`string`||typeof r==`number`)return r;let a=i(e,n);return typeof a==`string`||typeof a==`number`?a:String(a)}function o({label:e,description:t,disabled:n,placeholder:o,size:c,options:l,value:u,onChange:d,optionKey:f,optionLabel:p,renderCode:m,className:h,clearable:g}){return(0,s.jsx)(r,{label:e,description:t,disabled:n,placeholder:o,size:c,options:l,value:u===void 0?void 0:l.find(e=>i(e,f)===u),onChange:e=>d(e?i(e,f):void 0),getOptionKey:e=>i(e,f),getOptionLabel:e=>a(e,p,f),getOptionCode:m?e=>i(e,f):void 0,className:h,clearable:g})}var s,c=e((()=>{n(),s=t(),o.__docgenInfo={description:``,methods:[],displayName:`SerializableSelect`,props:{options:{required:!0,tsType:{name:`unknown`},description:``},onChange:{required:!0,tsType:{name:`signature`,type:`function`,raw:`(value: SerializableOptionValue<TOption, TOptionKey> | undefined) => void`,signature:{arguments:[{type:{name:`union`,raw:`SerializableOptionValue<TOption, TOptionKey> | undefined`,elements:[{name:`Extract`,elements:[{name:`TOption[TOptionKey]`,raw:`TOption[TOptionKey]`},{name:`union`,raw:`string | number`,elements:[{name:`string`},{name:`number`}]}],raw:`Extract<
|
|
2
2
|
TOption[TOptionKey],
|
|
3
3
|
SelectOptionKey
|
|
4
4
|
>`},{name:`undefined`}]},name:`value`}],return:{name:`void`}}},description:``},optionKey:{required:!0,tsType:{name:`TOptionKey`},description:``},optionLabel:{required:!0,tsType:{name:`TOptionLabel`},description:``},renderCode:{required:!1,tsType:{name:`literal`,value:`true`},description:``},className:{required:!1,tsType:{name:`string`},description:``},clearable:{required:!1,tsType:{name:`boolean`},description:``}},composes:[`Omit`]}}));export{c as n,o as t};
|
package/storybook-static/assets/{SerializableSelect-B3cGmITh.js → SerializableSelect-b8rZxZBe.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-C7Q8GMMo.js";import{t as d}from"./jsx-runtime-BBQGix-2.js";import{t as f}from"./mdx-react-shim-DeqTfg7V.js";import{AsyncReloadLike as p,Controlled as m,Disabled as h,Placeholder as g,WithCode as _,n as v,t as y}from"./SerializableSelect.stories-D4pNvhz2.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:`SerializableSelect`}),`
|
|
3
3
|
`,(0,S.jsx)(i,{children:`Select для сериализуемых значений и конфигурационных сценариев с key/label описанием option`}),`
|
|
4
4
|
`,(0,S.jsx)(o.p,{children:`SerializableSelect уже имеет живые 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-BdBCyVHz.js";import{t as i}from"./jsx-runtime-BBQGix-2.js";import{n as a,t as o}from"./SerializableSelect-Byb9ssGD.js";var s=e({AsyncReloadLike:()=>h,Controlled:()=>f,Disabled:()=>g,Placeholder:()=>p,WithCode:()=>m,__namedExportsOrder:()=>_,default:()=>d}),c,l,u,d,f,p,m,h,g,_,v=n((()=>{c=t(r(),1),a(),l=i(),u=[{id:10,name:`Продажи`,code:`SLS`,branch:`Екатеринбург`},{id:20,name:`Закупки`,code:`PRC`,branch:`Челябинск`},{id:30,name:`Логистика`,code:`LGS`,branch:`Новосибирск`},{id:40,name:`Сервис`,code:`SRV`,branch:`Москва`}],d={title:`Shared/UI/SerializableSelect`,component:o,args:{label:`Подразделение`,description:`Сериализуемая обёртка над Select для object-options и field-based конфигурации.`,placeholder:`Выберите подразделение`,options:u,optionKey:`id`,optionLabel:`name`,value:void 0,onChange:()=>{},size:`md`},parameters:{atomicCanvas:!0,layout:`padded`,docs:{description:{component:`Высокоуровневая обёртка над low-level Select. Принимает массив объектов, получает key и label по именам полей, а наружу возвращает только значение ключа. Нужна для сериализуемых конфигов, в том числе в src/shared/ui/controls/*.`}}},argTypes:{label:{description:`Заголовок поля.`,control:`text`},description:{description:`Описание под заголовком.`,control:`text`},placeholder:{description:`Текст, когда ключ ещё не выбран.`,control:`text`},options:{description:`Массив объектных option.`,control:!1},optionKey:{description:`Поле объекта, значение которого используется как ключ и отдаётся наружу через onChange.`,control:!1},optionLabel:{description:`Поле объекта, значение которого отображается как основной текст option.`,control:!1},renderCode:{description:`Если включено, справа от текста будет показан ключ optionKey.`,control:`boolean`},value:{description:`Текущий выбранный ключ option, а не вся option целиком.`,control:!1},onChange:{description:`Вызывается с новым значением optionKey.`,control:!1},size:{description:`Размер поля и подписей.`,control:`select`,options:[`xs`,`sm`,`md`,`lg`,`xl`]},disabled:{description:`Блокирует взаимодействие с полем.`,control:`boolean`},className:{description:`Дополнительный CSS-класс корневого контейнера.`,control:`text`}}},f={name:`Выбор по ключу`,render:e=>{let[t,n]=(0,c.useState)(20);return(0,l.jsx)(o,{...e,value:t,onChange:n})}},p={render:e=>{let[t,n]=(0,c.useState)(void 0);return(0,l.jsx)(o,{...e,value:t,onChange:n})}},m={name:`С кодом`,render:e=>{let[t,n]=(0,c.useState)(10);return(0,l.jsx)(o,{...e,value:t,onChange:n,renderCode:!0})},args:{renderCode:!0}},h={name:`Смена набора опций`,render:e=>{let[t,n]=(0,c.useState)(30),[r,i]=(0,c.useState)(!1),a=(0,c.useMemo)(()=>r?u.filter(e=>e.id!==20):u,[r]);return(0,l.jsxs)(`div`,{style:{display:`grid`,gap:`12px`,maxWidth:`320px`},children:[(0,l.jsx)(`button`,{type:`button`,onClick:()=>i(e=>!e),children:r?`Показать полный список`:`Скрыть одну опцию`}),(0,l.jsx)(o,{...e,options:a,value:t,onChange:n})]})}},g={args:{disabled:!0,value:10}},f.parameters={...f.parameters,docs:{...f.parameters?.docs,source:{originalSource:`{
|
|
2
2
|
name: "Выбор по ключу",
|
|
3
3
|
render: args => {
|
|
4
4
|
const [value, setValue] = useState<number | undefined>(20);
|
package/storybook-static/assets/{SingleDateTimeInput-BE5NPMX3.js → SingleDateTimeInput-Dx8iPd-Q.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-C7Q8GMMo.js";import{t as d}from"./jsx-runtime-BBQGix-2.js";import{t as f}from"./mdx-react-shim-DeqTfg7V.js";import{Default as p,Empty as m,TimeOnly as h,WithLimits as g,WithRightPanel as _,n as v,t as y}from"./SingleDateTimeInput.stories-B2fchXdY.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:`SingleDateTimeInput`}),`
|
|
3
3
|
`,(0,S.jsx)(i,{children:`Строгий сегментный ввод даты-времени и времени с popover picker`}),`
|
|
4
4
|
`,(0,S.jsxs)(o.p,{children:[(0,S.jsx)(o.code,{children:`SingleDateTimeInput`}),` объединяет два сценария:`]}),`
|
|
@@ -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-CnVQoYPB.js";import{t as i}from"./jsx-runtime-BBQGix-2.js";import{a,i as o}from"./utils-qWxRfpC-.js";import{B as ee,ft as s,t as c}from"./lucide-react-Ba5zJoHo.js";import{J as l,K as u,_ as d,b as te,t as f,z as p}from"./formatters-Cz4yGxBj.js";import{i as m,t as h}from"./popover-C7IuVy8A.js";import{n as g,t as _}from"./ui.module-DS2qtZts.js";import{t as v}from"./Button-BYai87yi.js";import{i as y}from"./DateInput-BJ-UIrN4.js";import{t as b}from"./button-ZElzKkii.js";import{o as ne,r as re,u as ie}from"./Input-DKnsPLP3.js";import{t as ae}from"./input-DLNL1jnY.js";import{t as oe}from"./ui-CcGcbmhp.js";import{a as x,i as se,n as S,r as C,t as w}from"./date-segments-CzU9k5bl.js";import{a as ce,c as le,d as ue,i as T,l as de,n as E,o as D,r as fe,s as O,t as pe,u as me}from"./TimePanel-CU6Buf8R.js";var k=n((()=>{D()}));function he(e){let t=[];return e.forEach((e,n)=>{e.kind===`editable`&&t.push(n)}),t}function ge({value:e,onChange:t,onClearError:n,disabled:r,minDate:i,maxDate:a,mode:o=`date-time`}){let ee=(0,A.useMemo)(()=>ce(o),[o]),s=(0,A.useMemo)(()=>se(ee),[ee]),c=(0,A.useMemo)(()=>he(s),[s]),l=(0,A.useMemo)(()=>S(e??null,s),[s,e]),[u,d]=(0,A.useState)(null),te=e?.getTime()??null,f=(0,A.useEffectEvent)(e=>d(e));(0,A.useEffect)(()=>{f(null)},[te,o]);let p=u??l,m=(0,A.useRef)(new Map),h=(0,A.useRef)(0),g=(0,A.useCallback)(n=>{if(w(s,n))return t(null),null;let r=x(s,n,{defaultDate:o===`time`?me(e,`time`)??T():void 0});return!r||!O(r,i,a,o)?null:(t(r),r)},[a,i,o,t,s,e]),_=(0,A.useCallback)((e,t=!0)=>{let n=m.current.get(e);n&&(n.focus(),t&&requestAnimationFrame(()=>n.select()))},[]),v=(0,A.useCallback)(e=>{let t=c.indexOf(e);return t<c.length-1?c[t+1]:null},[c]),y=(0,A.useCallback)(e=>{let t=c.indexOf(e);return t>0?c[t-1]:null},[c]),b=(0,A.useCallback)((e,t)=>e.padStart(t.length,`0`),[]);return{segments:s,segmentValues:p,registerRef:(0,A.useCallback)(e=>t=>{if(t){m.current.set(e,t);return}m.current.delete(e)},[]),handleInput:(0,A.useCallback)(e=>t=>{if(r)return;let i=s[e];if(i.kind!==`editable`)return;let a=t.target.value.replace(/\D/g,``).slice(0,i.length),o=new Map(p);if(o.set(e,a),d(o),n?.(),a.length===i.length){let t=v(e);t!==null&&requestAnimationFrame(()=>_(t))}g(o)},[r,_,v,n,p,s,g]),handleKeyDown:(0,A.useCallback)(e=>t=>{if(r)return;let n=s[e];if(n.kind!==`editable`)return;let i=p.get(e)??``,a=t.currentTarget;switch(t.key){case`ArrowRight`:if(a.selectionStart===i.length||i===``){t.preventDefault();let n=v(e);n!==null&&_(n)}break;case`ArrowLeft`:if(a.selectionStart===0||i===``){t.preventDefault();let n=y(e);n!==null&&_(n)}break;case`ArrowUp`:{t.preventDefault();let r=i===``?n.min:Number.parseInt(i,10)+1;r>n.max&&(r=n.min);let o=new Map(p);o.set(e,b(String(r),n)),d(o),g(o),requestAnimationFrame(()=>a.select());break}case`ArrowDown`:{t.preventDefault();let r=i===``?n.max:Number.parseInt(i,10)-1;r<n.min&&(r=n.max);let o=new Map(p);o.set(e,b(String(r),n)),d(o),g(o),requestAnimationFrame(()=>a.select());break}case`Backspace`:if(i===``){t.preventDefault();let n=y(e);n!==null&&_(n)}break;case`Delete`:{t.preventDefault();let n=new Map(p);n.set(e,``),d(n),g(n);break}}},[r,_,v,y,b,p,s,g]),handleFocus:(0,A.useCallback)(()=>e=>{e.target.select()},[]),handleContainerFocus:(0,A.useCallback)(()=>{clearTimeout(h.current)},[]),handleContainerBlur:(0,A.useCallback)(()=>{let n=new Map(p);h.current=window.setTimeout(()=>{if(w(s,n)){t(null),d(n);return}let r=x(s,n,{defaultDate:o===`time`?me(e,`time`)??T():void 0});if(!r||!O(r,i,a,o)){d(null);return}d(n)},0)},[a,i,o,t,p,s,e]),focusFirstEmpty:(0,A.useCallback)(()=>{let e=c.find(e=>!(p.get(e)??``))??c[c.length-1];e!==void 0&&_(e)},[c,_,p])}}var A,_e=n((()=>{A=t(r(),1),C(),k()})),ve=n((()=>{_e()})),j,M,N,P,F,I,L,R,z,B,V,H,ye=n((()=>{j=`AvG-mf`,M=`ig7KtT`,N=`RTruv0`,P=`YQHPZa`,F=`-RZe-i`,I=`Ox0SRE`,L=`gfaRup`,R=`_59kEea`,z=`Jjdu1Q`,B=`Q8Y2xS`,V=`XxZYTW`,H={segmentInput:j,separator:M,calendarButton:N,popoverContent:P,bottom:F,right:I,calendarPane:L,timePanelPane:R,timeOnlyPopoverContent:z,timePanelPaneBottom:B,timePanelPaneRight:V}}));function U({value:e,onChange:t,label:n,description:r,placeholder:i,disabled:o,size:c,error:l,onClearError:u,minDate:f,maxDate:p,timePanelPlacement:h=`right`,mode:_=`date-time`}){let b=me(e,_),ae=b?.getTime()??null,oe=(0,W.useMemo)(()=>d(new Date),[]),[x,se]=(0,W.useState)(!1),[S,C]=(0,W.useState)(b??null),[w,ce]=(0,W.useState)(`day`),[T,E]=(0,W.useState)(()=>ue(b,oe,_)),{controlId:D,labelId:k,descriptionId:he,errorId:A,describedBy:_e}=ie({hasLabel:n!=null,hasDescription:!!r,hasError:!!l}),ve=(0,W.useEffectEvent)(e=>C(e)),j=(0,W.useEffectEvent)(e=>E(e));(0,W.useEffect)(()=>{x||ve(b??null),b&&j(b)},[b,ae,x]),(0,W.useEffect)(()=>{b&&j(b)},[b,ae]);let{segments:M,segmentValues:N,registerRef:P,handleInput:F,handleKeyDown:I,handleFocus:L,handleContainerFocus:R,handleContainerBlur:z,focusFirstEmpty:B}=ge({value:b,onChange:t,onClearError:u,disabled:o,minDate:f,maxDate:p,mode:_}),V=e=>{if(_===`time`||te(e)||o)return;let t=le(e,S??b??T),{hours:n,minutes:r}=fe(e,t.getHours(),t.getMinutes(),f,p,_),i=de(e,n,r);O(i,f,p,_)&&(u?.(),C(i),E(i))},ye=(e,t)=>{if(o)return;let n=S??b??T,r=fe(n,e,t,f,p,_),i=de(n,r.hours,r.minutes,_);O(i,f,p,_)&&(u?.(),C(i),E(i))},U=e=>{e&&(C(b??null),E(ue(b,oe,_))),se(e)},be=()=>{(b?.getTime()??null)!==(S?.getTime()??null)&&t(S)},xe=h===`right`?H.timePanelPaneRight:H.timePanelPaneBottom,K=_===`time`?`Открыть выбор времени`:`Открыть календарь даты и времени`,q=i??(_===`time`?`чч:мм`:`дд.мм.гггг чч:мм`),J=S??b??T;return(0,G.jsxs)(m,{open:x,onOpenChange:U,children:[(0,G.jsx)(ne,{label:n,description:r,disabled:o,size:c,error:l,controlId:D,labelId:k,descriptionId:he,errorId:A,children:(0,G.jsx)(re,{endAdornmentWidth:`var(--control-height)`,endAdornment:(0,G.jsx)(m.Trigger,{children:(0,G.jsx)(v,{variant:`transparent`,disabled:o,className:H.calendarButton,icon:_===`time`?(0,G.jsx)(ee,{}):(0,G.jsx)(s,{}),"aria-label":K})}),children:({controlClassName:e})=>(0,G.jsx)(`div`,{id:D,className:a(g.uiInputControlFake,e),"data-disabled":o||void 0,"data-invalid":l?``:void 0,role:`group`,"aria-invalid":!!l||void 0,"aria-placeholder":q,"aria-labelledby":k,"aria-describedby":_e,onFocus:R,onBlur:z,onClick:e=>{e.target===e.currentTarget&&B()},children:M.map((e,t)=>e.kind===`literal`?(0,G.jsx)(`span`,{className:H.separator,"data-disabled":o||void 0,children:e.text},t):(0,G.jsx)(`input`,{ref:P(t),type:`text`,inputMode:`numeric`,className:H.segmentInput,style:{width:`${e.length+.5}ch`},value:N.get(t)??``,placeholder:e.placeholder,maxLength:e.length,disabled:o,"aria-label":e.ariaLabel,autoComplete:`off`,onChange:F(t),onKeyDown:I(t),onFocus:L()},t))})})}),(0,G.jsx)(m.Content,{background:`primary`,onClose:be,children:_===`time`?(0,G.jsx)(`div`,{className:H.timeOnlyPopoverContent,children:(0,G.jsx)(pe,{value:J,disabled:o,minDate:f,maxDate:p,mode:_,onChange:ye})}):(0,G.jsxs)(`div`,{className:a(H.popoverContent,H[h]),children:[(0,G.jsx)(`div`,{className:H.calendarPane,children:(0,G.jsx)(y,{view:w,datePickerLevel:`day`,selectionMode:`day`,onViewChange:ce,value:J,onChange:V,minDate:f,maxDate:p,currentDate:T,onCurrentDateChange:E})}),(0,G.jsx)(`div`,{className:a(H.timePanelPane,xe),children:(0,G.jsx)(pe,{value:J,disabled:o,minDate:f,maxDate:p,mode:_,onChange:ye})})]})})]})}var W,G,be=n((()=>{W=t(r(),1),f(),o(),c(),b(),oe(),ae(),h(),_(),k(),ve(),ye(),E(),G=i(),U.__docgenInfo={description:`Поле выбора даты-времени со строгой сегментной маской и popover-пикером.`,methods:[],displayName:`SingleDateTimeInput`,props:{error:{required:!1,tsType:{name:`string`},description:``},onClearError:{required:!1,tsType:{name:`signature`,type:`function`,raw:`() => void`,signature:{arguments:[],return:{name:`void`}}},description:``},minDate:{required:!1,tsType:{name:`Date`},description:``},maxDate:{required:!1,tsType:{name:`Date`},description:``},timePanelPlacement:{required:!1,tsType:{name:`union`,raw:`"bottom" | "right"`,elements:[{name:`literal`,value:`"bottom"`},{name:`literal`,value:`"right"`}]},description:``,defaultValue:{value:`"right"`,computed:!1}},mode:{required:!1,tsType:{name:`union`,raw:`"date-time" | "time"`,elements:[{name:`literal`,value:`"date-time"`},{name:`literal`,value:`"time"`}]},description:``,defaultValue:{value:`"date-time"`,computed:!1}},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:``}}}})),xe=e({Default:()=>Y,Empty:()=>Z,TimeOnly:()=>X,WithLimits:()=>Q,WithRightPanel:()=>$,__namedExportsOrder:()=>Se,default:()=>J}),K,q,J,Y,X,Z,Q,$,Se,Ce=n((()=>{K=t(r(),1),f(),be(),q=i(),J={title:`Shared/UI/SingleDateTimeInput`,component:U,args:{value:null,onChange:()=>{}},parameters:{atomicCanvas:!0,layout:`padded`},argTypes:{label:{description:`Заголовок поля даты и времени.`,control:`text`},description:{description:`Описание под заголовком поля.`,control:`text`},placeholder:{description:`Текстовая подсказка для сегментного ввода.`,control:`text`},value:{description:"Текущее значение в виде `Date | null`.",control:!1},onChange:{description:`Вызывается при вводе или выборе валидной даты-времени.`,control:!1},minDate:{description:`Минимально допустимая дата-время.`,control:`date`},maxDate:{description:`Максимально допустимая дата-время.`,control:`date`},error:{description:`Текст внешней ошибки под полем.`,control:`text`},onClearError:{description:`Сбрасывает внешнюю ошибку при ручном вводе и выборе в picker.`,control:!1},size:{description:`Размер поля и подписи.`,control:`select`,options:[`xs`,`sm`,`md`,`lg`,`xl`]},disabled:{description:`Блокирует сегментный ввод и popover picker.`,control:`boolean`},timePanelPlacement:{description:`Размещение панели выбора времени относительно календаря.`,control:`inline-radio`,options:[`bottom`,`right`]},mode:{description:`Режим работы поля: дата-время или только время.`,control:`inline-radio`,options:[`date-time`,`time`]}}},Y={render:e=>{let[t,n]=(0,K.useState)(e.value??new Date(2026,2,5,9,15,0,0));return(0,q.jsxs)(`div`,{children:[(0,q.jsx)(U,{...e,value:t,onChange:n}),(0,q.jsxs)(`p`,{children:[`Вывод значения через `,(0,q.jsx)(`code`,{className:`statusInfo`,children:`formatDateAsDateTime(value)`}),`:`]}),(0,q.jsx)(`pre`,{children:l(t)}),(0,q.jsxs)(`p`,{children:[`Вывод значения через `,(0,q.jsx)(`code`,{className:`statusInfo`,children:`formatDateAsODataDatetime(value)`}),`:`]}),(0,q.jsx)(`pre`,{children:p(t)})]})},args:{label:`Дата и время`,description:`Фиксированный формат: дд.мм.гггг чч:мм`,placeholder:`дд.мм.гггг чч:мм`,timePanelPlacement:`bottom`}},X={render:e=>{let[t,n]=(0,K.useState)(new Date(1970,0,1,9,15,0,0));return(0,q.jsxs)(`div`,{children:[(0,q.jsx)(U,{...e,value:t,onChange:n}),(0,q.jsxs)(`p`,{children:[`Вывод значения через `,(0,q.jsx)(`code`,{className:`statusInfo`,children:`formatDateAsTime(value)`}),`:`]}),(0,q.jsx)(`pre`,{children:u(t)}),(0,q.jsx)(`p`,{children:`Техническая дата значения всегда фиксируется как 01.01.1970.`}),(0,q.jsx)(`pre`,{children:t?t.toISOString():``})]})},args:{label:`Время`,description:`Режим только времени с маской чч:мм и wheel-picker без календаря.`,placeholder:`чч:мм`,mode:`time`,minDate:new Date(2026,2,10,9,15,0,0),maxDate:new Date(2026,2,10,18,30,0,0)}},Z={render:e=>{let[t,n]=(0,K.useState)(null);return(0,q.jsx)(U,{...e,value:t,onChange:n})},args:{label:`Пустое значение`,description:`Поле можно заполнить вручную или через popover picker.`,placeholder:`дд.мм.гггг чч:мм`,timePanelPlacement:`bottom`}},Q={render:e=>{let[t,n]=(0,K.useState)(new Date(2026,2,10,12,30,0,0));return(0,q.jsx)(U,{...e,value:t,onChange:n})},args:{label:`Дата отгрузки`,description:`Доступен только интервал с 10 по 12 марта 2026 года.`,minDate:new Date(2026,2,10,9,0,0,0),maxDate:new Date(2026,2,12,18,30,0,0),timePanelPlacement:`bottom`}},$={render:e=>{let[t,n]=(0,K.useState)(new Date(2026,2,10,12,30,0,0));return(0,q.jsx)(U,{...e,value:t,onChange:n})},args:{label:`Дата и время`,description:`Wheel-панель времени расположена справа от календаря.`,timePanelPlacement:`right`}},Y.parameters={...Y.parameters,docs:{...Y.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-BdBCyVHz.js";import{t as i}from"./jsx-runtime-BBQGix-2.js";import{a,i as o}from"./utils-CYGhZ88S.js";import{B as ee,ft as s,t as c}from"./lucide-react-CkksFLP-.js";import{J as l,K as u,_ as d,b as te,t as f,z as p}from"./formatters-BloK5ams.js";import{i as m,t as h}from"./popover-Dr7yuAT9.js";import{n as g,t as _}from"./ui.module-DS2qtZts.js";import{t as v}from"./Button-gqIyGTVm.js";import{i as y}from"./DateInput-6pvp1eRu.js";import{t as b}from"./button-wXbhbl78.js";import{o as ne,r as re,u as ie}from"./Input-D7RhI3F_.js";import{t as ae}from"./input-ddHVF6FV.js";import{t as oe}from"./ui-CxfY9QDr.js";import{a as x,i as se,n as S,r as C,t as w}from"./date-segments-CzU9k5bl.js";import{a as ce,c as le,d as ue,i as T,l as de,n as E,o as D,r as fe,s as O,t as pe,u as me}from"./TimePanel-nrNpgIYg.js";var k=n((()=>{D()}));function he(e){let t=[];return e.forEach((e,n)=>{e.kind===`editable`&&t.push(n)}),t}function ge({value:e,onChange:t,onClearError:n,disabled:r,minDate:i,maxDate:a,mode:o=`date-time`}){let ee=(0,A.useMemo)(()=>ce(o),[o]),s=(0,A.useMemo)(()=>se(ee),[ee]),c=(0,A.useMemo)(()=>he(s),[s]),l=(0,A.useMemo)(()=>S(e??null,s),[s,e]),[u,d]=(0,A.useState)(null),te=e?.getTime()??null,f=(0,A.useEffectEvent)(e=>d(e));(0,A.useEffect)(()=>{f(null)},[te,o]);let p=u??l,m=(0,A.useRef)(new Map),h=(0,A.useRef)(0),g=(0,A.useCallback)(n=>{if(w(s,n))return t(null),null;let r=x(s,n,{defaultDate:o===`time`?me(e,`time`)??T():void 0});return!r||!O(r,i,a,o)?null:(t(r),r)},[a,i,o,t,s,e]),_=(0,A.useCallback)((e,t=!0)=>{let n=m.current.get(e);n&&(n.focus(),t&&requestAnimationFrame(()=>n.select()))},[]),v=(0,A.useCallback)(e=>{let t=c.indexOf(e);return t<c.length-1?c[t+1]:null},[c]),y=(0,A.useCallback)(e=>{let t=c.indexOf(e);return t>0?c[t-1]:null},[c]),b=(0,A.useCallback)((e,t)=>e.padStart(t.length,`0`),[]);return{segments:s,segmentValues:p,registerRef:(0,A.useCallback)(e=>t=>{if(t){m.current.set(e,t);return}m.current.delete(e)},[]),handleInput:(0,A.useCallback)(e=>t=>{if(r)return;let i=s[e];if(i.kind!==`editable`)return;let a=t.target.value.replace(/\D/g,``).slice(0,i.length),o=new Map(p);if(o.set(e,a),d(o),n?.(),a.length===i.length){let t=v(e);t!==null&&requestAnimationFrame(()=>_(t))}g(o)},[r,_,v,n,p,s,g]),handleKeyDown:(0,A.useCallback)(e=>t=>{if(r)return;let n=s[e];if(n.kind!==`editable`)return;let i=p.get(e)??``,a=t.currentTarget;switch(t.key){case`ArrowRight`:if(a.selectionStart===i.length||i===``){t.preventDefault();let n=v(e);n!==null&&_(n)}break;case`ArrowLeft`:if(a.selectionStart===0||i===``){t.preventDefault();let n=y(e);n!==null&&_(n)}break;case`ArrowUp`:{t.preventDefault();let r=i===``?n.min:Number.parseInt(i,10)+1;r>n.max&&(r=n.min);let o=new Map(p);o.set(e,b(String(r),n)),d(o),g(o),requestAnimationFrame(()=>a.select());break}case`ArrowDown`:{t.preventDefault();let r=i===``?n.max:Number.parseInt(i,10)-1;r<n.min&&(r=n.max);let o=new Map(p);o.set(e,b(String(r),n)),d(o),g(o),requestAnimationFrame(()=>a.select());break}case`Backspace`:if(i===``){t.preventDefault();let n=y(e);n!==null&&_(n)}break;case`Delete`:{t.preventDefault();let n=new Map(p);n.set(e,``),d(n),g(n);break}}},[r,_,v,y,b,p,s,g]),handleFocus:(0,A.useCallback)(()=>e=>{e.target.select()},[]),handleContainerFocus:(0,A.useCallback)(()=>{clearTimeout(h.current)},[]),handleContainerBlur:(0,A.useCallback)(()=>{let n=new Map(p);h.current=window.setTimeout(()=>{if(w(s,n)){t(null),d(n);return}let r=x(s,n,{defaultDate:o===`time`?me(e,`time`)??T():void 0});if(!r||!O(r,i,a,o)){d(null);return}d(n)},0)},[a,i,o,t,p,s,e]),focusFirstEmpty:(0,A.useCallback)(()=>{let e=c.find(e=>!(p.get(e)??``))??c[c.length-1];e!==void 0&&_(e)},[c,_,p])}}var A,_e=n((()=>{A=t(r(),1),C(),k()})),ve=n((()=>{_e()})),j,M,N,P,F,I,L,R,z,B,V,H,ye=n((()=>{j=`AvG-mf`,M=`ig7KtT`,N=`RTruv0`,P=`YQHPZa`,F=`-RZe-i`,I=`Ox0SRE`,L=`gfaRup`,R=`_59kEea`,z=`Jjdu1Q`,B=`Q8Y2xS`,V=`XxZYTW`,H={segmentInput:j,separator:M,calendarButton:N,popoverContent:P,bottom:F,right:I,calendarPane:L,timePanelPane:R,timeOnlyPopoverContent:z,timePanelPaneBottom:B,timePanelPaneRight:V}}));function U({value:e,onChange:t,label:n,description:r,placeholder:i,disabled:o,size:c,error:l,onClearError:u,minDate:f,maxDate:p,timePanelPlacement:h=`right`,mode:_=`date-time`}){let b=me(e,_),ae=b?.getTime()??null,oe=(0,W.useMemo)(()=>d(new Date),[]),[x,se]=(0,W.useState)(!1),[S,C]=(0,W.useState)(b??null),[w,ce]=(0,W.useState)(`day`),[T,E]=(0,W.useState)(()=>ue(b,oe,_)),{controlId:D,labelId:k,descriptionId:he,errorId:A,describedBy:_e}=ie({hasLabel:n!=null,hasDescription:!!r,hasError:!!l}),ve=(0,W.useEffectEvent)(e=>C(e)),j=(0,W.useEffectEvent)(e=>E(e));(0,W.useEffect)(()=>{x||ve(b??null),b&&j(b)},[b,ae,x]),(0,W.useEffect)(()=>{b&&j(b)},[b,ae]);let{segments:M,segmentValues:N,registerRef:P,handleInput:F,handleKeyDown:I,handleFocus:L,handleContainerFocus:R,handleContainerBlur:z,focusFirstEmpty:B}=ge({value:b,onChange:t,onClearError:u,disabled:o,minDate:f,maxDate:p,mode:_}),V=e=>{if(_===`time`||te(e)||o)return;let t=le(e,S??b??T),{hours:n,minutes:r}=fe(e,t.getHours(),t.getMinutes(),f,p,_),i=de(e,n,r);O(i,f,p,_)&&(u?.(),C(i),E(i))},ye=(e,t)=>{if(o)return;let n=S??b??T,r=fe(n,e,t,f,p,_),i=de(n,r.hours,r.minutes,_);O(i,f,p,_)&&(u?.(),C(i),E(i))},U=e=>{e&&(C(b??null),E(ue(b,oe,_))),se(e)},be=()=>{(b?.getTime()??null)!==(S?.getTime()??null)&&t(S)},xe=h===`right`?H.timePanelPaneRight:H.timePanelPaneBottom,K=_===`time`?`Открыть выбор времени`:`Открыть календарь даты и времени`,q=i??(_===`time`?`чч:мм`:`дд.мм.гггг чч:мм`),J=S??b??T;return(0,G.jsxs)(m,{open:x,onOpenChange:U,children:[(0,G.jsx)(ne,{label:n,description:r,disabled:o,size:c,error:l,controlId:D,labelId:k,descriptionId:he,errorId:A,children:(0,G.jsx)(re,{endAdornmentWidth:`var(--control-height)`,endAdornment:(0,G.jsx)(m.Trigger,{children:(0,G.jsx)(v,{variant:`transparent`,disabled:o,className:H.calendarButton,icon:_===`time`?(0,G.jsx)(ee,{}):(0,G.jsx)(s,{}),"aria-label":K})}),children:({controlClassName:e})=>(0,G.jsx)(`div`,{id:D,className:a(g.uiInputControlFake,e),"data-disabled":o||void 0,"data-invalid":l?``:void 0,role:`group`,"aria-invalid":!!l||void 0,"aria-placeholder":q,"aria-labelledby":k,"aria-describedby":_e,onFocus:R,onBlur:z,onClick:e=>{e.target===e.currentTarget&&B()},children:M.map((e,t)=>e.kind===`literal`?(0,G.jsx)(`span`,{className:H.separator,"data-disabled":o||void 0,children:e.text},t):(0,G.jsx)(`input`,{ref:P(t),type:`text`,inputMode:`numeric`,className:H.segmentInput,style:{width:`${e.length+.5}ch`},value:N.get(t)??``,placeholder:e.placeholder,maxLength:e.length,disabled:o,"aria-label":e.ariaLabel,autoComplete:`off`,onChange:F(t),onKeyDown:I(t),onFocus:L()},t))})})}),(0,G.jsx)(m.Content,{background:`primary`,onClose:be,children:_===`time`?(0,G.jsx)(`div`,{className:H.timeOnlyPopoverContent,children:(0,G.jsx)(pe,{value:J,disabled:o,minDate:f,maxDate:p,mode:_,onChange:ye})}):(0,G.jsxs)(`div`,{className:a(H.popoverContent,H[h]),children:[(0,G.jsx)(`div`,{className:H.calendarPane,children:(0,G.jsx)(y,{view:w,datePickerLevel:`day`,selectionMode:`day`,onViewChange:ce,value:J,onChange:V,minDate:f,maxDate:p,currentDate:T,onCurrentDateChange:E})}),(0,G.jsx)(`div`,{className:a(H.timePanelPane,xe),children:(0,G.jsx)(pe,{value:J,disabled:o,minDate:f,maxDate:p,mode:_,onChange:ye})})]})})]})}var W,G,be=n((()=>{W=t(r(),1),f(),o(),c(),b(),oe(),ae(),h(),_(),k(),ve(),ye(),E(),G=i(),U.__docgenInfo={description:`Поле выбора даты-времени со строгой сегментной маской и popover-пикером.`,methods:[],displayName:`SingleDateTimeInput`,props:{error:{required:!1,tsType:{name:`string`},description:``},onClearError:{required:!1,tsType:{name:`signature`,type:`function`,raw:`() => void`,signature:{arguments:[],return:{name:`void`}}},description:``},minDate:{required:!1,tsType:{name:`Date`},description:``},maxDate:{required:!1,tsType:{name:`Date`},description:``},timePanelPlacement:{required:!1,tsType:{name:`union`,raw:`"bottom" | "right"`,elements:[{name:`literal`,value:`"bottom"`},{name:`literal`,value:`"right"`}]},description:``,defaultValue:{value:`"right"`,computed:!1}},mode:{required:!1,tsType:{name:`union`,raw:`"date-time" | "time"`,elements:[{name:`literal`,value:`"date-time"`},{name:`literal`,value:`"time"`}]},description:``,defaultValue:{value:`"date-time"`,computed:!1}},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:``}}}})),xe=e({Default:()=>Y,Empty:()=>Z,TimeOnly:()=>X,WithLimits:()=>Q,WithRightPanel:()=>$,__namedExportsOrder:()=>Se,default:()=>J}),K,q,J,Y,X,Z,Q,$,Se,Ce=n((()=>{K=t(r(),1),f(),be(),q=i(),J={title:`Shared/UI/SingleDateTimeInput`,component:U,args:{value:null,onChange:()=>{}},parameters:{atomicCanvas:!0,layout:`padded`},argTypes:{label:{description:`Заголовок поля даты и времени.`,control:`text`},description:{description:`Описание под заголовком поля.`,control:`text`},placeholder:{description:`Текстовая подсказка для сегментного ввода.`,control:`text`},value:{description:"Текущее значение в виде `Date | null`.",control:!1},onChange:{description:`Вызывается при вводе или выборе валидной даты-времени.`,control:!1},minDate:{description:`Минимально допустимая дата-время.`,control:`date`},maxDate:{description:`Максимально допустимая дата-время.`,control:`date`},error:{description:`Текст внешней ошибки под полем.`,control:`text`},onClearError:{description:`Сбрасывает внешнюю ошибку при ручном вводе и выборе в picker.`,control:!1},size:{description:`Размер поля и подписи.`,control:`select`,options:[`xs`,`sm`,`md`,`lg`,`xl`]},disabled:{description:`Блокирует сегментный ввод и popover picker.`,control:`boolean`},timePanelPlacement:{description:`Размещение панели выбора времени относительно календаря.`,control:`inline-radio`,options:[`bottom`,`right`]},mode:{description:`Режим работы поля: дата-время или только время.`,control:`inline-radio`,options:[`date-time`,`time`]}}},Y={render:e=>{let[t,n]=(0,K.useState)(e.value??new Date(2026,2,5,9,15,0,0));return(0,q.jsxs)(`div`,{children:[(0,q.jsx)(U,{...e,value:t,onChange:n}),(0,q.jsxs)(`p`,{children:[`Вывод значения через `,(0,q.jsx)(`code`,{className:`statusInfo`,children:`formatDateAsDateTime(value)`}),`:`]}),(0,q.jsx)(`pre`,{children:l(t)}),(0,q.jsxs)(`p`,{children:[`Вывод значения через `,(0,q.jsx)(`code`,{className:`statusInfo`,children:`formatDateAsODataDatetime(value)`}),`:`]}),(0,q.jsx)(`pre`,{children:p(t)})]})},args:{label:`Дата и время`,description:`Фиксированный формат: дд.мм.гггг чч:мм`,placeholder:`дд.мм.гггг чч:мм`,timePanelPlacement:`bottom`}},X={render:e=>{let[t,n]=(0,K.useState)(new Date(1970,0,1,9,15,0,0));return(0,q.jsxs)(`div`,{children:[(0,q.jsx)(U,{...e,value:t,onChange:n}),(0,q.jsxs)(`p`,{children:[`Вывод значения через `,(0,q.jsx)(`code`,{className:`statusInfo`,children:`formatDateAsTime(value)`}),`:`]}),(0,q.jsx)(`pre`,{children:u(t)}),(0,q.jsx)(`p`,{children:`Техническая дата значения всегда фиксируется как 01.01.1970.`}),(0,q.jsx)(`pre`,{children:t?t.toISOString():``})]})},args:{label:`Время`,description:`Режим только времени с маской чч:мм и wheel-picker без календаря.`,placeholder:`чч:мм`,mode:`time`,minDate:new Date(2026,2,10,9,15,0,0),maxDate:new Date(2026,2,10,18,30,0,0)}},Z={render:e=>{let[t,n]=(0,K.useState)(null);return(0,q.jsx)(U,{...e,value:t,onChange:n})},args:{label:`Пустое значение`,description:`Поле можно заполнить вручную или через popover picker.`,placeholder:`дд.мм.гггг чч:мм`,timePanelPlacement:`bottom`}},Q={render:e=>{let[t,n]=(0,K.useState)(new Date(2026,2,10,12,30,0,0));return(0,q.jsx)(U,{...e,value:t,onChange:n})},args:{label:`Дата отгрузки`,description:`Доступен только интервал с 10 по 12 марта 2026 года.`,minDate:new Date(2026,2,10,9,0,0,0),maxDate:new Date(2026,2,12,18,30,0,0),timePanelPlacement:`bottom`}},$={render:e=>{let[t,n]=(0,K.useState)(new Date(2026,2,10,12,30,0,0));return(0,q.jsx)(U,{...e,value:t,onChange:n})},args:{label:`Дата и время`,description:`Wheel-панель времени расположена справа от календаря.`,timePanelPlacement:`right`}},Y.parameters={...Y.parameters,docs:{...Y.parameters?.docs,source:{originalSource:`{
|
|
2
2
|
render: args => {
|
|
3
3
|
const [value, setValue] = useState<Date | null>(args.value ?? new Date(2026, 2, 5, 9, 15, 0, 0));
|
|
4
4
|
return <div>
|
|
@@ -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-C7Q8GMMo.js";import{t as d}from"./jsx-runtime-BBQGix-2.js";import{t as f}from"./mdx-react-shim-DeqTfg7V.js";import{Disabled as p,MonthsIndexMarks as m,RangeMonthToDaysOutput as h,RangeOpenMonthToDaysOutput as g,RangeOpenWithoutExplicitMiddleOutput as _,RangePlain as v,SingleStep as y,SingleWithMarks as b,n as x,t as S}from"./Slider.stories-EcLVbioI.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:`Slider`}),`
|
|
3
3
|
`,(0,T.jsx)(i,{children:`Компактные single и range слайдеры с marks, tooltip и открытыми границами`}),`
|
|
4
4
|
`,(0,T.jsxs)(o.p,{children:[(0,T.jsx)(o.code,{children:`Slider`}),` и `,(0,T.jsx)(o.code,{children:`SliderRange`}),` — отдельные публичные компоненты. Оба используют общую числовую шкалу, но не смешивают single/range через prop.`]}),`
|
|
@@ -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-BdBCyVHz.js";import{t as i}from"./jsx-runtime-BBQGix-2.js";import{a,o,t as s}from"./slider-Cen5Jymh.js";var c=e({Disabled:()=>D,MonthsIndexMarks:()=>S,RangeMonthToDaysOutput:()=>T,RangeOpenMonthToDaysOutput:()=>E,RangeOpenWithoutExplicitMiddleOutput:()=>w,RangePlain:()=>C,SingleStep:()=>b,SingleWithMarks:()=>x,__namedExportsOrder:()=>O,default:()=>y});function l(e,t){return e===null?`null`:`${e}${t}`}function u(e,t,n=``){let[r,i]=e??[null,null],a=[];return r!==null&&a.push(`${t} >= ${r}${n}`),i!==null&&a.push(`${t} <= ${i}${n}`),a.length>0?a.join(` AND `):`Фильтр не ограничивает значение`}function d({value:e,field:t,unit:n=``,children:r}){let[i,a]=e??[null,null];return(0,p.jsxs)(`div`,{className:`marginTopMd`,children:[(0,p.jsx)(`div`,{className:`textSm сontent2`,children:`Preview фильтра`}),(0,p.jsx)(`pre`,{children:JSON.stringify({value:[i,a],human:`${l(i,n)} — ${l(a,n)}`,filter:u(e,t,n)},null,2)}),r]})}var f,p,m,h,g,_,v,y,b,x,S,C,w,T,E,D,O,k=n((()=>{f=t(r(),1),s(),p=i(),m=[{value:0,label:`0`},{value:25,label:`25`},{value:50,label:`50`},{value:75,label:`75`},{value:100,label:`100`}],h=[{value:1,label:`1 мес.`},{value:3,label:`3 мес.`},{value:6,label:`6 мес.`},{value:9,label:`9 мес.`},{value:12,label:`12 мес.`},{value:18,label:`18 мес.`},{value:24,label:`24 мес.`}],g=[{value:0,label:`Без нижней границы`,outputValue:null},{value:1,label:`1 мес.`},{value:3,label:`3 мес.`},{value:6,label:`6 мес.`},{value:12,label:`12 мес.`},{value:24,label:`24 мес.`},{value:25,label:`Без верхней границы`,outputValue:null}],_=[{value:1,label:`1 мес.`,outputValue:30},{value:3,label:`3 мес.`,outputValue:90},{value:6,label:`6 мес.`,outputValue:180},{value:12,label:`12 мес.`,outputValue:360},{value:24,label:`24 мес.`,outputValue:720}],v=[{value:0,label:`Без нижней границы`,outputValue:null},{value:1,label:`1 мес.`,outputValue:30},{value:3,label:`3 мес.`,outputValue:90},{value:6,label:`6 мес.`,outputValue:180},{value:12,label:`12 мес.`,outputValue:360},{value:24,label:`24 мес.`,outputValue:720},{value:25,label:`Без верхней границы`,outputValue:null}],y={title:`Shared/UI/Slider`,component:a,args:{value:30,onChange:()=>{},min:0,max:100,step:5},parameters:{atomicCanvas:!0,layout:`padded`}},b={render:e=>{let t=e,[n,r]=(0,f.useState)(e.value);return(0,p.jsx)(a,{...t,label:`Громкость`,value:n,onChange:r})},args:{description:`Компактный single-value слайдер со step=5.`,value:35,step:5}},x={render:e=>{let t=e,[n,r]=(0,f.useState)(50);return(0,p.jsx)(a,{...t,label:`Процент выполнения`,value:n,onChange:r})},args:{description:`Marks активны, кликабельны и показывают подписи через tooltip.`,value:50,marks:m}},S={render:e=>{let t=e,[n,r]=(0,f.useState)(6);return(0,p.jsx)(a,{...t,label:`Срок`,value:n,onChange:r})},args:{min:1,max:24,value:6,marks:h,marksPosition:`index`,description:`Неравномерные значения месяцев расположены с равным визуальным шагом.`}},C={render:()=>{let[e,t]=(0,f.useState)([25,75]);return(0,p.jsxs)(p.Fragment,{children:[(0,p.jsx)(o,{label:`Процент выполнения`,description:"Обычный range: `value` mark является и координатой шкалы, и значением фильтра.",min:0,max:100,marks:m,value:e,onChange:t}),(0,p.jsx)(d,{value:e,field:`progress`,unit:`%`})]})}},w={render:()=>{let[e,t]=(0,f.useState)([null,12]);return(0,p.jsxs)(p.Fragment,{children:[(0,p.jsx)(o,{label:`Срок в месяцах`,description:"Открытые границы задаются только крайними `outputValue:null`; у обычных marks outputValue не указан и берётся `value`.",min:0,max:25,marks:g,marksPosition:`index`,value:e,onChange:t}),(0,p.jsx)(d,{value:e,field:`months`,unit:` мес.`})]})}},T={render:()=>{let[e,t]=(0,f.useState)([90,360]);return(0,p.jsxs)(p.Fragment,{children:[(0,p.jsx)(o,{label:`Срок: месяцы на шкале, дни в фильтре`,description:"`value` хранит координату/месяцы, `outputValue` отдаёт наружу дни.",min:1,max:24,marks:_,marksPosition:`index`,value:e,onChange:t}),(0,p.jsx)(d,{value:e,field:`days`,unit:` дн.`})]})}},E={render:()=>{let[e,t]=(0,f.useState)([null,720]);return(0,p.jsxs)(p.Fragment,{children:[(0,p.jsx)(o,{label:`Срок: открытые границы и дни в фильтре`,description:"Крайние marks отдают null, обычные marks отдают дни через `outputValue`.",min:0,max:25,marks:v,marksPosition:`index`,value:e,onChange:t}),(0,p.jsx)(d,{value:e,field:`days`,unit:` дн.`})]})}},D={args:{label:`Недоступно`,description:`Состояние без интеракций.`,value:40,disabled:!0,marks:m}},b.parameters={...b.parameters,docs:{...b.parameters?.docs,source:{originalSource:`{
|
|
2
2
|
render: args => {
|
|
3
3
|
const sliderArgs = args as SliderProps;
|
|
4
4
|
const [value, setValue] = useState<number | undefined>(args.value as number | undefined);
|
|
@@ -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-C7Q8GMMo.js";import{t as d}from"./jsx-runtime-BBQGix-2.js";import{t as f}from"./mdx-react-shim-DeqTfg7V.js";import{Basic as p,DecimalManualInput as m,Disabled as h,MarksSnap as g,RangeInputMonthToDaysOutput as _,RangeInputOpenMonthToDaysOutput as v,RangeInputOpenWithoutExplicitMiddleOutput as y,RangeInputPlain as b,RangeInputReadonlyText as x,n as S,t as C}from"./SliderInput.stories-D_WSCFgt.js";function w(e){let o={code:`code`,h2:`h2`,h3:`h3`,li:`li`,p:`p`,pre:`pre`,ul:`ul`,...t(),...e.components};return(0,E.jsxs)(E.Fragment,{children:[(0,E.jsx)(a,{of:C,parameters:{docs:{toc:!0}}}),`
|
|
2
2
|
`,(0,E.jsx)(c,{children:`SliderInput`}),`
|
|
3
3
|
`,(0,E.jsx)(i,{children:`Поля ввода для single и range с popover slider`}),`
|
|
4
4
|
`,(0,E.jsxs)(o.p,{children:[(0,E.jsx)(o.code,{children:`SliderInput`}),` работает с одним числом, а `,(0,E.jsx)(o.code,{children:`SliderRangeInput`}),` — с диапазоном `,(0,E.jsx)(o.code,{children:`[number | null, number | null]`}),`.`]}),`
|