@ryuzaki13/react-foundation-ui 1.2.6 → 1.2.8
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/disclosure/Disclosure.d.ts.map +1 -1
- package/dist/disclosure/index.js +30 -32
- package/dist/disclosure/index.js.map +1 -1
- package/dist/styles.css +1 -1
- package/package.json +5 -1
- package/storybook-static/addon-visual-tests-assets/visual-test-illustration.mp4 +0 -0
- package/storybook-static/assets/Badge-BqGrcxAM.js +139 -0
- package/storybook-static/assets/Badge.stories-D-4FPPMr.js +51 -0
- package/storybook-static/assets/Button-Dk2YMZua.js +12 -0
- package/storybook-static/assets/{Button-DI6wOTM7.js → Button-iCkwBEDP.js} +47 -47
- package/storybook-static/assets/Button.stories-BkV_xVnD.js +75 -0
- package/storybook-static/assets/{CheckBox-CS0rOTN7.js → CheckBox-BQhsynyB.js} +1 -1
- package/storybook-static/assets/{CheckBox-CfKXKU4v.js → CheckBox-C-f5AsCI.js} +31 -31
- package/storybook-static/assets/CheckBox.stories-7V9WkaKi.js +60 -0
- package/storybook-static/assets/Color-KMSTOMOX-CYcFidZH.js +1 -0
- package/storybook-static/assets/ContextMenu-DinzhWx_.js +40 -0
- package/storybook-static/assets/{ContextMenu.stories-CA00sUQt.js → ContextMenu.stories-B9O_FkLB.js} +1 -1
- package/storybook-static/assets/DateInput-BT_5pRV0.js +40 -0
- package/storybook-static/assets/DateInput-CvJvdtwa.js +1 -0
- package/storybook-static/assets/{DateInput.stories-CJGnhCiR.js → DateInput.stories-BDKMX9K3.js} +1 -1
- package/storybook-static/assets/DateRangePresetSelect-Bck3ITZr.js +30 -0
- package/storybook-static/assets/DateRangePresetSelect-CPZ6FKGz.js +3 -0
- package/storybook-static/assets/DateRangePresetSelect.stories-D5fRZmWy.js +11 -0
- package/storybook-static/assets/Detail-DBH4WUCF.js +40 -0
- package/storybook-static/assets/Detail.stories-Kvnqo8Un.js +44 -0
- package/storybook-static/assets/{Dialog-0w_W0UBz.js → Dialog-Cv_od09Q.js} +22 -22
- package/storybook-static/assets/Dialog.stories-CY8mr-2o.js +31 -0
- package/storybook-static/assets/Disclosure-BVz61VJq.js +32 -0
- package/storybook-static/assets/Disclosure-DzVnkjef.css +1 -0
- package/storybook-static/assets/Disclosure.stories-CufTvUiK.js +41 -0
- package/storybook-static/assets/DocsRenderer-JROSPFPF-BJw82UhU.js +2 -0
- package/storybook-static/assets/DropZone-DOvkWmBD.js +36 -0
- package/storybook-static/assets/{DropZone.stories-Bu49NSVJ.js → DropZone.stories-K1bqdB2U.js} +2 -2
- package/storybook-static/assets/DropdownMenu-Cx08nIaY.js +1 -0
- package/storybook-static/assets/{ExpandableActionPanel.stories-RVXBbnyj.js → ExpandableActionPanel.stories-BZ3P24ES.js} +2 -2
- package/storybook-static/assets/Flex-Brzvr0YX.js +3 -0
- package/storybook-static/assets/Flex-CVjyrD9i.js +61 -0
- package/storybook-static/assets/{Flex.stories-D_fFJrsW.js → Flex.stories-B9dkwuh5.js} +1 -1
- package/storybook-static/assets/{Grid-C4-fxCy0.js → Grid-DhASlspp.js} +1 -1
- package/storybook-static/assets/Grid-blnYLgOs.js +61 -0
- package/storybook-static/assets/{Grid.stories--x7HLm1q.js → Grid.stories-DafgjrQm.js} +1 -1
- package/storybook-static/assets/{ImageCropper.stories-C2u8bHWN.js → ImageCropper.stories-638pLg4D.js} +1 -1
- package/storybook-static/assets/ImageRenderer-C6DwGwQl.js +2 -0
- package/storybook-static/assets/{ImageRenderer.stories-CYRDsS3Z.js → ImageRenderer.stories-DJJiqQFU.js} +1 -1
- package/storybook-static/assets/{ImageView.stories-C0ykBKDk.js → ImageView.stories-DVeX-CzY.js} +1 -1
- package/storybook-static/assets/{ImageViewer.stories-BusMvSz_.js → ImageViewer.stories-NqiR5Eyj.js} +2 -2
- package/storybook-static/assets/{ImageViewerRuntime-ZP6H6hET.js → ImageViewerRuntime-C0uGYGQl.js} +2 -2
- package/storybook-static/assets/Input-4QsBT-dh.js +39 -0
- package/storybook-static/assets/Input-CjJUuLEX.js +3 -0
- package/storybook-static/assets/Input.stories-DX8FX7AI.js +38 -0
- package/storybook-static/assets/InputDateTime-C6cR1WP9.js +39 -0
- package/storybook-static/assets/InputDateTime.stories-DPK8Y5p2.js +35 -0
- package/storybook-static/assets/{InputFile-D-_aZBxg.js → InputFile-BwI_udQQ.js} +26 -26
- package/storybook-static/assets/InputFile.stories-BdWP2iBM.js +36 -0
- package/storybook-static/assets/InputFiles-CPY6AJQJ.js +1 -0
- package/storybook-static/assets/{InputFiles-B9PdmFK9.js → InputFiles-CfmNIDk_.js} +26 -26
- package/storybook-static/assets/InputFiles.stories-DnXD0hgD.js +33 -0
- package/storybook-static/assets/{InputImage-khPwoIhV.js → InputImage-CgjrjJiq.js} +26 -26
- package/storybook-static/assets/{InputImage.stories-CCa46Nzq.js → InputImage.stories-CFHzEXGv.js} +1 -1
- package/storybook-static/assets/LayoutPicker-BfwRb9HQ.js +66 -0
- package/storybook-static/assets/{LayoutPicker.stories-B1dO6RKC.js → LayoutPicker.stories-C9sMcU1k.js} +3 -3
- package/storybook-static/assets/Listbox-B2FoYInE.js +38 -0
- package/storybook-static/assets/Listbox.stories-BnGRDEMg.js +47 -0
- package/storybook-static/assets/{Modal-DXYu3gK_.js → Modal-Bd8v3vU8.js} +32 -32
- package/storybook-static/assets/Modal.stories-CmYJeAAz.js +180 -0
- package/storybook-static/assets/MultiSelect-BeRfLM-g.js +2 -0
- package/storybook-static/assets/MultiSelect-Bswj23vq.js +56 -0
- package/storybook-static/assets/MultiSelect.stories-iKlesibJ.js +29 -0
- package/storybook-static/assets/{NotificationsHost-BxAkGSYp.js → NotificationsHost-Cf0puFJk.js} +22 -22
- package/storybook-static/assets/NotificationsHost.stories-DX1niytc.js +25 -0
- package/storybook-static/assets/ODataMultiSelect-BvFXZlGZ.js +53 -0
- package/storybook-static/assets/ODataMultiSelect-CiZ3aEy3.js +1 -0
- package/storybook-static/assets/ODataMultiSelect.stories-BcRrzHnf.js +73 -0
- package/storybook-static/assets/ODataSelect-Bo0yPtod.js +1 -0
- package/storybook-static/assets/{ODataSelect-CzsSdlmh.js → ODataSelect-DgH5G-C_.js} +32 -32
- package/storybook-static/assets/ODataSelect.stories-DEOly20_.js +73 -0
- package/storybook-static/assets/ODataTreeMultiSelect-IKfvxL7p.js +17 -0
- package/storybook-static/assets/ODataTreeMultiSelect.stories-uPDVAyMu.js +28 -0
- package/storybook-static/assets/ODataTreeSelect-BujgjSkl.js +16 -0
- package/storybook-static/assets/ODataTreeSelect.stories-BzlUExoW.js +21 -0
- package/storybook-static/assets/{PeriodSelect-DIfJTfdB.js → PeriodSelect-BJIPDLq1.js} +31 -31
- package/storybook-static/assets/{PeriodSelect.stories-BAMIsSGE.js → PeriodSelect.stories-D12q6-YO.js} +1 -1
- package/storybook-static/assets/{Popover-6znIdvNB.js → Popover-D25DhaiJ.js} +29 -29
- package/storybook-static/assets/{Popover.stories-AXvTs-mK.js → Popover.stories-CF3zUe0j.js} +1 -1
- package/storybook-static/assets/{PresetRangeDateInput-oSisVT1i.js → PresetRangeDateInput-CDw6HtWA.js} +19 -19
- package/storybook-static/assets/PresetRangeDateInput.stories-BQZI6HOn.js +15 -0
- package/storybook-static/assets/{RadioButton-BGlASGNa.js → RadioButton-BgEBxZJi.js} +27 -27
- package/storybook-static/assets/{RadioButton.stories-COLQdM1e.js → RadioButton.stories-BkFGEJXb.js} +2 -2
- package/storybook-static/assets/{RadioGroup-C2AUzTxU.js → RadioGroup-C-K84fCC.js} +26 -26
- package/storybook-static/assets/RadioGroup-Jq-lWcgE.js +1 -0
- package/storybook-static/assets/RadioGroup.stories-DyuW8DaF.js +42 -0
- package/storybook-static/assets/Select-BrRZA3Up.js +12 -0
- package/storybook-static/assets/{Select-CfXC3kDv.js → Select-ChYAdfkx.js} +35 -35
- package/storybook-static/assets/Select.stories-D-onxXmT.js +46 -0
- package/storybook-static/assets/SelectOptionContent-Cwd0p14r.js +1 -0
- package/storybook-static/assets/SerializableSelect-CcBh49iS.js +4 -0
- package/storybook-static/assets/{SerializableSelect-C7WrrCz1.js → SerializableSelect-D9BlCZ4x.js} +32 -32
- package/storybook-static/assets/SerializableSelect.stories-BXMFTNDx.js +43 -0
- package/storybook-static/assets/SingleDateTimeInput-cHIGelrz.js +53 -0
- package/storybook-static/assets/SingleDateTimeInput.stories-BdPyEPUr.js +78 -0
- package/storybook-static/assets/Slider-Cb_nb9P2.js +63 -0
- package/storybook-static/assets/Slider.stories-CoKGxwRT.js +77 -0
- package/storybook-static/assets/SliderInput-DyxDl1Mo.js +58 -0
- package/storybook-static/assets/{SliderInput.stories-BIqyZKyF.js → SliderInput.stories-DgbBm38V.js} +1 -1
- package/storybook-static/assets/Sortable-DC3bPcbn.js +72 -0
- package/storybook-static/assets/{Sortable.stories-CULILQbA.js → Sortable.stories-B_IhqW5F.js} +1 -1
- package/storybook-static/assets/{Splitter-Q7gof-78.js → Splitter-CGw6p5-z.js} +39 -39
- package/storybook-static/assets/Splitter.stories-DNlOAJY9.js +22 -0
- package/storybook-static/assets/{StateSelect-DClswKAK.js → StateSelect-cU_bLcpU.js} +25 -25
- package/storybook-static/assets/{StateSelect.stories-CoUBhZeT.js → StateSelect.stories-D0Z05ltu.js} +2 -2
- package/storybook-static/assets/Switch-C-3mRPBf.js +36 -0
- package/storybook-static/assets/Switch.stories-Csqx8bKj.js +26 -0
- package/storybook-static/assets/Table-4x8XIQpa.js +197 -0
- package/storybook-static/assets/{Table.stories-DyksB7KO.js → Table.stories-DLsx7_5W.js} +1 -1
- package/storybook-static/assets/Tabs-BYxa2MdO.js +72 -0
- package/storybook-static/assets/{Tabs.stories-BtRnStqw.js → Tabs.stories-Bs2uE5X2.js} +1 -1
- package/storybook-static/assets/TagInput.stories-8_Uk7z4a.js +18 -0
- package/storybook-static/assets/{Textarea-B52Vh_xt.js → Textarea-C9do4TkE.js} +26 -26
- package/storybook-static/assets/Textarea.stories-khYPBnjL.js +27 -0
- package/storybook-static/assets/TimePanel-DAQw6BvJ.js +1 -0
- package/storybook-static/assets/{TimePanel.stories-06TyPpQJ.js → TimePanel.stories-D8uZoVpL.js} +1 -1
- package/storybook-static/assets/{Toggle-CkcafyNI.js → Toggle-C4pQIuyy.js} +26 -26
- package/storybook-static/assets/Toggle.stories-DhF17j-W.js +30 -0
- package/storybook-static/assets/TreeMultiSelect-B6_6vRxE.js +15 -0
- package/storybook-static/assets/TreeMultiSelect-Drs35VVA.js +1 -0
- package/storybook-static/assets/TreeMultiSelect.stories-D6YSwiei.js +31 -0
- package/storybook-static/assets/{TreePickerBase-xKDnzQR_.js → TreePickerBase-DCognf3p.js} +2 -2
- package/storybook-static/assets/TreeSelect-CAAu7_OB.js +15 -0
- package/storybook-static/assets/TreeSelect-DxdqUuJ6.js +1 -0
- package/storybook-static/assets/TreeSelect.stories-BqF-qAB9.js +16 -0
- package/storybook-static/assets/TreeTable-TKNA-uIN.js +175 -0
- package/storybook-static/assets/{TreeTable.stories-DCLa6mJm.js → TreeTable.stories-yeAD18Zw.js} +2 -2
- package/storybook-static/assets/WithTooltip-7X4HQR7L-CxfB6hD8.js +9 -0
- package/storybook-static/assets/{base-table-BeZYmflf.js → base-table-ByITBr1J.js} +1 -1
- package/storybook-static/assets/blocks-0RiOsxIK.js +285 -0
- package/storybook-static/assets/button-B1ZGqKIL.js +1 -0
- package/storybook-static/assets/{check-box-9iBlFoJu.js → check-box-NnScD6BH.js} +1 -1
- package/storybook-static/assets/chunk-3LY4VQVK-DprWWQ6L.js +6 -0
- package/storybook-static/assets/{chunk-LITCR56V-DpYf_5IK.js → chunk-LITCR56V-CsoWERay.js} +2 -2
- package/storybook-static/assets/contextMenu-B7OY9AUe.js +2 -0
- package/storybook-static/assets/error-B-BZQLMk.js +1 -0
- package/storybook-static/assets/flex-DjZzX5cW.js +1 -0
- package/storybook-static/assets/floating-ui.react-6aWiJn-w.js +1 -0
- package/storybook-static/assets/formatter-L2YTDE3Q-Bhbxmhyr.js +1 -0
- package/storybook-static/assets/{formatters-DEfKcq5B.js → formatters-3Nbt_zpw.js} +1 -1
- package/storybook-static/assets/grid-CXx-3eN4.js +1 -0
- package/storybook-static/assets/{hooks-DlpluSIv.js → hooks-cOC2wx_S.js} +1 -1
- package/storybook-static/assets/{iframe-YecJO4uV.js → iframe-GmIo3IOR.js} +199 -197
- package/storybook-static/assets/input-BZoBzauA.js +1 -0
- package/storybook-static/assets/{mdx-react-shim-B6MYoAcj.js → mdx-react-shim-DQ40dZsI.js} +1 -1
- package/storybook-static/assets/media-CaNRzUMK.js +1 -0
- package/storybook-static/assets/misc-DSZ85X5k.js +5 -0
- package/storybook-static/assets/notifications-dwTsOfAG.js +1 -0
- package/storybook-static/assets/odata-BXYPW5TY.js +1 -0
- package/storybook-static/assets/odata-service-CdmjwNQZ.js +1 -0
- package/storybook-static/assets/{odataStoryFixtures-DePPyMUW.js → odataStoryFixtures-qHROzCso.js} +1 -1
- package/storybook-static/assets/picker-Ly9fNo5I.js +2 -0
- package/storybook-static/assets/popover-hHS3Q1Eb.js +2 -0
- package/storybook-static/assets/preset-select-DSUOhzZJ.js +5 -0
- package/storybook-static/assets/{react-18-BAqYtx7S.js → react-18-C8dLShAR.js} +1 -1
- package/storybook-static/assets/react-CufbfMTd.js +9 -0
- package/storybook-static/assets/react-dom-B1EOrd4K.js +1 -0
- package/storybook-static/assets/select-CjW1dQXg.js +1 -0
- package/storybook-static/assets/slider-CKtA1jkD.js +2 -0
- package/storybook-static/assets/sortable-C7z1FJM0.js +1 -0
- package/storybook-static/assets/{syntaxhighlighter-RTCFPKCB-yen8I1rd.js → syntaxhighlighter-RTCFPKCB-DUS1jW_J.js} +2 -2
- package/storybook-static/assets/text-Cw7Vu082.js +4 -0
- package/storybook-static/assets/theming-Ce0TAFtT.js +39 -0
- package/storybook-static/assets/ui-Dlg5NgOB.js +1 -0
- package/storybook-static/assets/useODataSelectBase-BE8nJXZo.js +1 -0
- package/storybook-static/assets/useODataTreeData-Dli9NQVP.js +1 -0
- package/storybook-static/assets/utils-B73_kE2n.js +1 -0
- package/storybook-static/iframe.html +2 -2
- package/storybook-static/index.html +16 -6
- package/storybook-static/index.json +1 -1
- package/storybook-static/project.json +1 -1
- package/storybook-static/sb-addons/chromatic-com-storybook-1/manager-bundle.js +352 -0
- package/storybook-static/sb-addons/chromatic-com-storybook-1/manager-bundle.js.LEGAL.txt +31 -0
- package/storybook-static/sb-addons/vitest-4/manager-bundle.js +3 -0
- package/storybook-static/assets/Badge-BF_YR6xV.js +0 -139
- package/storybook-static/assets/Badge.stories-BFSvBuGf.js +0 -51
- package/storybook-static/assets/Button-DYvP70oK.js +0 -12
- package/storybook-static/assets/Button.stories-BiQzoIrP.js +0 -75
- package/storybook-static/assets/CheckBox.stories-C8SMoVuj.js +0 -60
- package/storybook-static/assets/Color-KMSTOMOX-C5d1F69R.js +0 -1
- package/storybook-static/assets/ContextMenu-BWOMwM1T.js +0 -40
- package/storybook-static/assets/DateInput-BKr2L_zl.js +0 -40
- package/storybook-static/assets/DateInput-BbkCHe27.js +0 -1
- package/storybook-static/assets/DateRangePresetSelect-5OVfqIc_.js +0 -30
- package/storybook-static/assets/DateRangePresetSelect-BH9oi-dO.js +0 -3
- package/storybook-static/assets/DateRangePresetSelect.stories-C2f4Itxx.js +0 -11
- package/storybook-static/assets/Detail-DNjE_8Oj.js +0 -40
- package/storybook-static/assets/Detail.stories-IufkpH_4.js +0 -44
- package/storybook-static/assets/Dialog.stories-_67SGh82.js +0 -31
- package/storybook-static/assets/Disclosure--JVKZyWJ.js +0 -32
- package/storybook-static/assets/Disclosure-CCmAxXkT.css +0 -1
- package/storybook-static/assets/Disclosure.stories-Th8T0PUj.js +0 -41
- package/storybook-static/assets/DocsRenderer-JROSPFPF-DLwDf2Zo.js +0 -2
- package/storybook-static/assets/DropZone-BzPiDQeZ.js +0 -36
- package/storybook-static/assets/DropdownMenu-Bcrg1qHr.js +0 -1
- package/storybook-static/assets/Flex-CXJVQ7iV.js +0 -3
- package/storybook-static/assets/Flex-GGgh6HSs.js +0 -61
- package/storybook-static/assets/Grid-vh3IGIQd.js +0 -61
- package/storybook-static/assets/ImageRenderer-mEqm-Dqi.js +0 -2
- package/storybook-static/assets/Input-C-oHXpFa.js +0 -39
- package/storybook-static/assets/Input-VtBvr4ox.js +0 -3
- package/storybook-static/assets/Input.stories-DjNJP6jZ.js +0 -38
- package/storybook-static/assets/InputDateTime-B4QhXUqG.js +0 -39
- package/storybook-static/assets/InputDateTime.stories-DQD1hY4X.js +0 -35
- package/storybook-static/assets/InputFile.stories-CSC1SCs1.js +0 -36
- package/storybook-static/assets/InputFiles-Ds1zu7US.js +0 -1
- package/storybook-static/assets/InputFiles.stories-C-bGspU1.js +0 -33
- package/storybook-static/assets/LayoutPicker-BAAa_g3x.js +0 -66
- package/storybook-static/assets/Listbox-C4HBbYNr.js +0 -38
- package/storybook-static/assets/Listbox.stories-BwJ6G_Mg.js +0 -47
- package/storybook-static/assets/Modal.stories-BfQSWo-S.js +0 -180
- package/storybook-static/assets/MultiSelect-CEbf7bLL.js +0 -56
- package/storybook-static/assets/MultiSelect-ZiS4jg7j.js +0 -2
- package/storybook-static/assets/MultiSelect.stories-OSUoI8LD.js +0 -29
- package/storybook-static/assets/NotificationsHost.stories-DeTweOqX.js +0 -25
- package/storybook-static/assets/ODataMultiSelect-C_BdWtjv.js +0 -1
- package/storybook-static/assets/ODataMultiSelect-DOtG5b5p.js +0 -53
- package/storybook-static/assets/ODataMultiSelect.stories-DZgOPx8i.js +0 -73
- package/storybook-static/assets/ODataSelect-BK-HaXVe.js +0 -1
- package/storybook-static/assets/ODataSelect.stories-4fGnGP41.js +0 -73
- package/storybook-static/assets/ODataTreeMultiSelect-BBVM-8ki.js +0 -17
- package/storybook-static/assets/ODataTreeMultiSelect.stories-CzufPwpi.js +0 -28
- package/storybook-static/assets/ODataTreeSelect-DGwHzeKD.js +0 -16
- package/storybook-static/assets/ODataTreeSelect.stories-jkE8YwLl.js +0 -21
- package/storybook-static/assets/PresetRangeDateInput.stories-CEu1DDCF.js +0 -15
- package/storybook-static/assets/RadioGroup-Qfnk8dQO.js +0 -1
- package/storybook-static/assets/RadioGroup.stories-C8ddz6t6.js +0 -42
- package/storybook-static/assets/Select-BOgkP515.js +0 -12
- package/storybook-static/assets/Select.stories-ByNbkZdw.js +0 -46
- package/storybook-static/assets/SelectOptionContent-C3tgB8Dy.js +0 -1
- package/storybook-static/assets/SerializableSelect-BuXvepIG.js +0 -4
- package/storybook-static/assets/SerializableSelect.stories-B1mK7D6g.js +0 -43
- package/storybook-static/assets/SingleDateTimeInput-BkkBQM0V.js +0 -53
- package/storybook-static/assets/SingleDateTimeInput.stories-DCnQnNLe.js +0 -78
- package/storybook-static/assets/Slider-Bi-_w_Lt.js +0 -63
- package/storybook-static/assets/Slider.stories-BZJ1spgB.js +0 -77
- package/storybook-static/assets/SliderInput-CCP08d7j.js +0 -58
- package/storybook-static/assets/Sortable-CrA3MIiN.js +0 -72
- package/storybook-static/assets/Splitter.stories-DSkP_EnV.js +0 -22
- package/storybook-static/assets/Switch-D3d-7utL.js +0 -36
- package/storybook-static/assets/Switch.stories-CBiv810D.js +0 -26
- package/storybook-static/assets/Table-BBWi4z9z.js +0 -197
- package/storybook-static/assets/Tabs-BTI_vnhE.js +0 -72
- package/storybook-static/assets/TagInput.stories-Bb__MtM6.js +0 -18
- package/storybook-static/assets/Textarea.stories-DvJ7sb9D.js +0 -27
- package/storybook-static/assets/TimePanel-B5xztB0K.js +0 -1
- package/storybook-static/assets/Toggle.stories-BTUFEVjs.js +0 -30
- package/storybook-static/assets/TreeMultiSelect-CMrKE4N1.js +0 -1
- package/storybook-static/assets/TreeMultiSelect-CoQ-vqxS.js +0 -15
- package/storybook-static/assets/TreeMultiSelect.stories-Dc1IZAee.js +0 -31
- package/storybook-static/assets/TreeSelect-BLgkcb_I.js +0 -1
- package/storybook-static/assets/TreeSelect-Bd_WmDmc.js +0 -15
- package/storybook-static/assets/TreeSelect.stories-N-FbNe6W.js +0 -16
- package/storybook-static/assets/TreeTable-dwNY6Pon.js +0 -175
- package/storybook-static/assets/WithTooltip-7X4HQR7L-D2JhGs1w.js +0 -9
- package/storybook-static/assets/blocks-D8vTJCXn.js +0 -285
- package/storybook-static/assets/button-Cz3fiO2B.js +0 -1
- package/storybook-static/assets/chunk-3LY4VQVK-CB9E5tjQ.js +0 -6
- package/storybook-static/assets/contextMenu-BzZSIfMh.js +0 -2
- package/storybook-static/assets/error-DI-le3_4.js +0 -1
- package/storybook-static/assets/flex-BriuFrFs.js +0 -1
- package/storybook-static/assets/floating-ui.react-CBVzHb-E.js +0 -1
- package/storybook-static/assets/formatter-L2YTDE3Q-BQlCOI4x.js +0 -1
- package/storybook-static/assets/grid-Dtmb5H_R.js +0 -1
- package/storybook-static/assets/input-CVG4hDFt.js +0 -1
- package/storybook-static/assets/jsx-runtime-BBQGix-2.js +0 -1
- package/storybook-static/assets/lucide-react-DoqvsuDx.js +0 -1
- package/storybook-static/assets/media-dT-v0KyQ.js +0 -1
- package/storybook-static/assets/misc-B81k0Tx5.js +0 -5
- package/storybook-static/assets/notifications-CAn9BB3F.js +0 -1
- package/storybook-static/assets/odata-CCAAVsLr.js +0 -1
- package/storybook-static/assets/odata-service-D0evRTVS.js +0 -1
- package/storybook-static/assets/picker-Cs_HmTIT.js +0 -2
- package/storybook-static/assets/popover-CwLg1nVy.js +0 -2
- package/storybook-static/assets/preset-select-LcK3ak1H.js +0 -5
- package/storybook-static/assets/react-DqGAnUZt.js +0 -9
- package/storybook-static/assets/react-dom-Dp-mf7b2.js +0 -1
- package/storybook-static/assets/select-D1j8twIv.js +0 -1
- package/storybook-static/assets/slider-BUne_904.js +0 -2
- package/storybook-static/assets/sortable-BSyQxNy_.js +0 -1
- package/storybook-static/assets/text-CQF6O5fh.js +0 -4
- package/storybook-static/assets/theming-DyCFqSDn.js +0 -39
- package/storybook-static/assets/ui-imSUUVzJ.js +0 -1
- package/storybook-static/assets/useODataSelectBase-C9E-wcFt.js +0 -1
- package/storybook-static/assets/useODataTreeData-CcHumE5U.js +0 -1
- package/storybook-static/assets/utils-Bnd9AQDU.js +0 -1
- /package/storybook-static/sb-addons/{a11y-2 → a11y-3}/manager-bundle.js +0 -0
- /package/storybook-static/sb-addons/{docs-1 → docs-2}/manager-bundle.js +0 -0
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
import{i as e}from"./preload-helper-B45gAKPr.js";import{E as
|
|
2
|
-
`,(0,v.jsx)(
|
|
3
|
-
`,(0,v.jsx)(
|
|
4
|
-
`,(0,v.jsx)(
|
|
1
|
+
import{i as e}from"./preload-helper-B45gAKPr.js";import{t}from"./iframe-GmIo3IOR.js";import{E as n,a as r,d as i,f as a,l as o,m as s,n as c,p as l,r as u,u as d}from"./blocks-0RiOsxIK.js";import{t as f}from"./mdx-react-shim-DQ40dZsI.js";import{Default as p,n as m,t as h}from"./PresetRangeDateInput.stories-BQZI6HOn.js";function g(e){let t={code:`code`,h2:`h2`,h3:`h3`,li:`li`,p:`p`,pre:`pre`,ul:`ul`,...n(),...e.components};return(0,v.jsxs)(v.Fragment,{children:[(0,v.jsx)(o,{of:h,parameters:{docs:{toc:!0}}}),`
|
|
2
|
+
`,(0,v.jsx)(l,{children:`PresetRangeDateInput`}),`
|
|
3
|
+
`,(0,v.jsx)(a,{children:`Составной контрол диапазона дат с синхронизацией ручного ввода и готовых пресетов`}),`
|
|
4
|
+
`,(0,v.jsx)(t.p,{children:`PresetRangeDateInput уже имеет живые stories, а эта страница собирает их в структурированную документацию с краткими рекомендациями, примерами подключения и API.
|
|
5
5
|
Ниже можно быстро проверить базовый сценарий, а затем перейти к отдельным режимам использования и состояниям компонента.`}),`
|
|
6
|
-
`,(0,v.jsx)(
|
|
7
|
-
`,(0,v.jsx)(
|
|
8
|
-
`,(0,v.jsx)(
|
|
9
|
-
`,(0,v.jsx)(
|
|
6
|
+
`,(0,v.jsx)(t.h2,{id:`основной-сценарий`,children:`Основной сценарий`}),`
|
|
7
|
+
`,(0,v.jsx)(d,{}),`
|
|
8
|
+
`,(0,v.jsx)(r,{of:p}),`
|
|
9
|
+
`,(0,v.jsx)(t.pre,{children:(0,v.jsx)(t.code,{className:`language-tsx`,children:`import { useState } from "react";
|
|
10
10
|
|
|
11
11
|
import { PresetRangeDateInput } from "@/shared/ui";
|
|
12
12
|
|
|
@@ -17,15 +17,15 @@ export function Example() {
|
|
|
17
17
|
return <PresetRangeDateInput value={range} onChange={setRange} presetId={presetId} onPresetIdChange={setPresetId} />;
|
|
18
18
|
}
|
|
19
19
|
`})}),`
|
|
20
|
-
`,(0,v.jsx)(
|
|
21
|
-
`,(0,v.jsxs)(
|
|
22
|
-
`,(0,v.jsx)(
|
|
20
|
+
`,(0,v.jsx)(t.h2,{id:`практические-рекомендации`,children:`Практические рекомендации`}),`
|
|
21
|
+
`,(0,v.jsxs)(t.ul,{children:[`
|
|
22
|
+
`,(0,v.jsx)(t.li,{children:`Если компонент участвует в фильтрации или поиске, заранее определите дефолтные значения и допустимые ограничения.`}),`
|
|
23
23
|
`]}),`
|
|
24
|
-
`,(0,v.jsx)(
|
|
25
|
-
`,(0,v.jsx)(
|
|
26
|
-
`,(0,v.jsx)(
|
|
27
|
-
`,(0,v.jsx)(
|
|
28
|
-
`,(0,v.jsx)(
|
|
29
|
-
`,(0,v.jsx)(
|
|
30
|
-
`,(0,v.jsx)(
|
|
31
|
-
`,(0,v.jsx)(
|
|
24
|
+
`,(0,v.jsx)(t.h2,{id:`сценарии-использования`,children:`Сценарии использования`}),`
|
|
25
|
+
`,(0,v.jsx)(t.h3,{id:`сценарий-со-стандартным-поведением-и-дефолтными-настройками`,children:`Сценарий со стандартным поведением и дефолтными настройками`}),`
|
|
26
|
+
`,(0,v.jsx)(t.p,{children:`Сценарий со стандартным поведением и дефолтными настройками.`}),`
|
|
27
|
+
`,(0,v.jsx)(u,{of:p}),`
|
|
28
|
+
`,(0,v.jsx)(t.h2,{id:`api`,children:`API`}),`
|
|
29
|
+
`,(0,v.jsx)(c,{of:h}),`
|
|
30
|
+
`,(0,v.jsx)(t.h2,{id:`все-сторисы`,children:`Все сторисы`}),`
|
|
31
|
+
`,(0,v.jsx)(i,{includePrimary:!1})]})}function _(e={}){let{wrapper:t}={...n(),...e.components};return t?(0,v.jsx)(t,{...e,children:(0,v.jsx)(g,{...e})}):g(e)}var v;e((()=>{v=t(),f(),s(),m()}))();export{_ as default};
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import{a as e,c as t,i as n}from"./preload-helper-B45gAKPr.js";import{pn as r,t as i}from"./iframe-GmIo3IOR.js";import{i as a,t as o}from"./text-Cw7Vu082.js";import{o as s}from"./Flex-Brzvr0YX.js";import{t as c}from"./flex-DjZzX5cW.js";import{t as l}from"./DateInput-CvJvdtwa.js";import{c as u}from"./preset-select-DSUOhzZJ.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-CPZ6FKGz.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
|
+
render: () => {
|
|
3
|
+
const [value, setValue] = useState<NullableDateRange | null>([new Date(2026, 2, 10, 0, 0, 0), new Date(2026, 2, 10, 23, 59, 59)]);
|
|
4
|
+
const [presetId, setPresetId] = useState<string | null>("today");
|
|
5
|
+
return <>
|
|
6
|
+
<FlexContainer gap="sm" align="end">
|
|
7
|
+
<PresetRangeDateInput value={value} onChange={setValue} presetId={presetId} onPresetIdChange={setPresetId} referenceDate={new Date(2026, 2, 10, 12, 0, 0)} presetLabel="Быстрый диапазон" size="md" />
|
|
8
|
+
</FlexContainer>
|
|
9
|
+
|
|
10
|
+
<Text as="p" className="marginBlockSm">
|
|
11
|
+
Активный presetId: <Text as="code">{presetId ?? "null"}</Text>
|
|
12
|
+
</Text>
|
|
13
|
+
</>;
|
|
14
|
+
}
|
|
15
|
+
}`,...k.parameters?.docs?.source},description:{story:`Демонстрирует совместную работу пресета и ручного диапазона.`,...k.parameters?.docs?.description}}},A=[`Default`]}));j();export{k as Default,A as __namedExportsOrder,O as default,j as n,T as t};
|
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
import{i as e}from"./preload-helper-B45gAKPr.js";import{E as
|
|
2
|
-
`,(0,b.jsx)(
|
|
3
|
-
`,(0,b.jsx)(
|
|
4
|
-
`,(0,b.jsx)(
|
|
1
|
+
import{i as e}from"./preload-helper-B45gAKPr.js";import{t}from"./iframe-GmIo3IOR.js";import{E as n,a as r,d as i,f as a,l as o,m as s,n as c,p as l,r as u,u as d}from"./blocks-0RiOsxIK.js";import{t as f}from"./mdx-react-shim-DQ40dZsI.js";import{Controlled as p,Disabled as m,Group as h,n as g,t as _}from"./RadioButton.stories-BkFGEJXb.js";function v(e){let t={code:`code`,h2:`h2`,h3:`h3`,li:`li`,p:`p`,pre:`pre`,ul:`ul`,...n(),...e.components};return(0,b.jsxs)(b.Fragment,{children:[(0,b.jsx)(o,{of:_,parameters:{docs:{toc:!0}}}),`
|
|
2
|
+
`,(0,b.jsx)(l,{children:`RadioButton`}),`
|
|
3
|
+
`,(0,b.jsx)(a,{children:`Одиночная radio-кнопка для ручной сборки наборов выбора и специальных компоновок`}),`
|
|
4
|
+
`,(0,b.jsx)(t.p,{children:`RadioButton уже имеет живые stories, а эта страница собирает их в структурированную документацию с краткими рекомендациями, примерами подключения и API.
|
|
5
5
|
Ниже можно быстро проверить базовый сценарий, а затем перейти к отдельным режимам использования и состояниям компонента. Отдельно разобраны контролируемые сценарии, заблокированные состояния.`}),`
|
|
6
|
-
`,(0,b.jsx)(
|
|
7
|
-
`,(0,b.jsx)(
|
|
8
|
-
`,(0,b.jsx)(
|
|
9
|
-
`,(0,b.jsx)(
|
|
6
|
+
`,(0,b.jsx)(t.h2,{id:`основной-сценарий`,children:`Основной сценарий`}),`
|
|
7
|
+
`,(0,b.jsx)(d,{}),`
|
|
8
|
+
`,(0,b.jsx)(r,{of:p}),`
|
|
9
|
+
`,(0,b.jsx)(t.pre,{children:(0,b.jsx)(t.code,{className:`language-tsx`,children:`import { useState } from "react";
|
|
10
10
|
|
|
11
11
|
import { RadioButton } from "@/shared/ui";
|
|
12
12
|
|
|
@@ -16,23 +16,23 @@ export function Example() {
|
|
|
16
16
|
return <RadioButton label="Основной вариант" value={checked} onChange={setChecked} />;
|
|
17
17
|
}
|
|
18
18
|
`})}),`
|
|
19
|
-
`,(0,b.jsx)(
|
|
20
|
-
`,(0,b.jsxs)(
|
|
21
|
-
`,(0,b.jsx)(
|
|
22
|
-
`,(0,b.jsx)(
|
|
23
|
-
`,(0,b.jsx)(
|
|
19
|
+
`,(0,b.jsx)(t.h2,{id:`практические-рекомендации`,children:`Практические рекомендации`}),`
|
|
20
|
+
`,(0,b.jsxs)(t.ul,{children:[`
|
|
21
|
+
`,(0,b.jsx)(t.li,{children:`Если состояние должно жить во внешней форме или модели, ориентируйтесь на контролируемый режим из документации.`}),`
|
|
22
|
+
`,(0,b.jsx)(t.li,{children:`Сначала выберите семантику и визуальную схему, а затем уже подстраивайте остальные пропсы компонента.`}),`
|
|
23
|
+
`,(0,b.jsx)(t.li,{children:`Заблокированное состояние лучше проверять отдельно, чтобы убедиться, что визуально и поведенчески оно остается понятным.`}),`
|
|
24
24
|
`]}),`
|
|
25
|
-
`,(0,b.jsx)(
|
|
26
|
-
`,(0,b.jsx)(
|
|
27
|
-
`,(0,b.jsx)(
|
|
28
|
-
`,(0,b.jsx)(
|
|
29
|
-
`,(0,b.jsx)(
|
|
30
|
-
`,(0,b.jsx)(
|
|
31
|
-
`,(0,b.jsx)(
|
|
32
|
-
`,(0,b.jsx)(
|
|
33
|
-
`,(0,b.jsx)(
|
|
34
|
-
`,(0,b.jsx)(
|
|
35
|
-
`,(0,b.jsx)(
|
|
36
|
-
`,(0,b.jsx)(
|
|
37
|
-
`,(0,b.jsx)(
|
|
38
|
-
`,(0,b.jsx)(
|
|
25
|
+
`,(0,b.jsx)(t.h2,{id:`сценарии-использования`,children:`Сценарии использования`}),`
|
|
26
|
+
`,(0,b.jsx)(t.h3,{id:`компонент-работает-в-контролируемом-режиме-когда-состояние-хранится-во-внешнем-компоненте`,children:`Компонент работает в контролируемом режиме, когда состояние хранится во внешнем компоненте`}),`
|
|
27
|
+
`,(0,b.jsx)(t.p,{children:`Компонент работает в контролируемом режиме, когда состояние хранится во внешнем компоненте.`}),`
|
|
28
|
+
`,(0,b.jsx)(u,{of:p}),`
|
|
29
|
+
`,(0,b.jsx)(t.h3,{id:`работа-группы-взаимосвязанных-элементов`,children:`Работа группы взаимосвязанных элементов`}),`
|
|
30
|
+
`,(0,b.jsx)(t.p,{children:`Работа группы взаимосвязанных элементов.`}),`
|
|
31
|
+
`,(0,b.jsx)(u,{of:h}),`
|
|
32
|
+
`,(0,b.jsx)(t.h3,{id:`проверка-поведения-в-заблокированном-состоянии`,children:`Проверка поведения в заблокированном состоянии`}),`
|
|
33
|
+
`,(0,b.jsx)(t.p,{children:`Проверка поведения в заблокированном состоянии.`}),`
|
|
34
|
+
`,(0,b.jsx)(u,{of:m}),`
|
|
35
|
+
`,(0,b.jsx)(t.h2,{id:`api`,children:`API`}),`
|
|
36
|
+
`,(0,b.jsx)(c,{of:_}),`
|
|
37
|
+
`,(0,b.jsx)(t.h2,{id:`все-сторисы`,children:`Все сторисы`}),`
|
|
38
|
+
`,(0,b.jsx)(i,{includePrimary:!1})]})}function y(e={}){let{wrapper:t}={...n(),...e.components};return t?(0,b.jsx)(t,{...e,children:(0,b.jsx)(v,{...e})}):v(e)}var b;e((()=>{b=t(),f(),s(),g()}))();export{y as default};
|
package/storybook-static/assets/{RadioButton.stories-COLQdM1e.js → RadioButton.stories-BkFGEJXb.js}
RENAMED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import{a as e,c as t,i as n}from"./preload-helper-B45gAKPr.js";import{
|
|
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(
|
|
1
|
+
import{a as e,c as t,i as n}from"./preload-helper-B45gAKPr.js";import{n as r,pn as i,rt as a,t as o}from"./iframe-GmIo3IOR.js";import{a as s,i as c}from"./utils-B73_kE2n.js";import{n as l,t as u}from"./ui.module-wFHXkJzp.js";import{n as d,r as f}from"./uiClasses-CaHp0EWd.js";import{n as p,t as m}from"./CheckBox.module-ezWPE2pa.js";var h,g,_=n((()=>{h=`gu8UMB`,g={radioInput:h}})),v,y,b,x=n((()=>{v=t(i(),1),c(),r(),p(),u(),f(),_(),y=o(),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:s(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:s(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:s(l.uiSelectionControl,m.input,g.radioInput),onChange:()=>c?.(!C)}),(0,y.jsx)(`div`,{className:s(l.uiSelectionIcon,m.icon),"aria-hidden":`true`,children:(0,y.jsx)(a,{})})]}),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
|
+
Поддерживает 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(i(),1),x(),w=o(),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);
|
|
5
5
|
return <RadioButton {...args} value={value} onChange={setValue} />;
|
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
import{i as e}from"./preload-helper-B45gAKPr.js";import{E as
|
|
2
|
-
`,(0,b.jsx)(
|
|
3
|
-
`,(0,b.jsx)(
|
|
4
|
-
`,(0,b.jsx)(
|
|
1
|
+
import{i as e}from"./preload-helper-B45gAKPr.js";import{t}from"./iframe-GmIo3IOR.js";import{E as n,a as r,d as i,f as a,l as o,m as s,n as c,p as l,r as u,u as d}from"./blocks-0RiOsxIK.js";import{t as f}from"./mdx-react-shim-DQ40dZsI.js";import{Controlled as p,Disabled as m,Vertical as h,n as g,t as _}from"./RadioGroup.stories-DyuW8DaF.js";function v(e){let t={code:`code`,h2:`h2`,h3:`h3`,li:`li`,p:`p`,pre:`pre`,ul:`ul`,...n(),...e.components};return(0,b.jsxs)(b.Fragment,{children:[(0,b.jsx)(o,{of:_,parameters:{docs:{toc:!0}}}),`
|
|
2
|
+
`,(0,b.jsx)(l,{children:`RadioGroup`}),`
|
|
3
|
+
`,(0,b.jsx)(a,{children:`Группа взаимоисключающих опций с поддержкой горизонтальной и вертикальной раскладки`}),`
|
|
4
|
+
`,(0,b.jsx)(t.p,{children:`RadioGroup уже имеет живые stories, а эта страница собирает их в структурированную документацию с краткими рекомендациями, примерами подключения и API.
|
|
5
5
|
Ниже можно быстро проверить базовый сценарий, а затем перейти к отдельным режимам использования и состояниям компонента. Отдельно разобраны контролируемые сценарии, заблокированные состояния.`}),`
|
|
6
|
-
`,(0,b.jsx)(
|
|
7
|
-
`,(0,b.jsx)(
|
|
8
|
-
`,(0,b.jsx)(
|
|
9
|
-
`,(0,b.jsx)(
|
|
6
|
+
`,(0,b.jsx)(t.h2,{id:`основной-сценарий`,children:`Основной сценарий`}),`
|
|
7
|
+
`,(0,b.jsx)(d,{}),`
|
|
8
|
+
`,(0,b.jsx)(r,{of:p}),`
|
|
9
|
+
`,(0,b.jsx)(t.pre,{children:(0,b.jsx)(t.code,{className:`language-tsx`,children:`import { useState } from "react";
|
|
10
10
|
|
|
11
11
|
import { RadioGroup } from "@/shared/ui";
|
|
12
12
|
|
|
@@ -21,22 +21,22 @@ export function Example() {
|
|
|
21
21
|
);
|
|
22
22
|
}
|
|
23
23
|
`})}),`
|
|
24
|
-
`,(0,b.jsx)(
|
|
25
|
-
`,(0,b.jsxs)(
|
|
26
|
-
`,(0,b.jsx)(
|
|
27
|
-
`,(0,b.jsx)(
|
|
24
|
+
`,(0,b.jsx)(t.h2,{id:`практические-рекомендации`,children:`Практические рекомендации`}),`
|
|
25
|
+
`,(0,b.jsxs)(t.ul,{children:[`
|
|
26
|
+
`,(0,b.jsx)(t.li,{children:`Если состояние должно жить во внешней форме или модели, ориентируйтесь на контролируемый режим из документации.`}),`
|
|
27
|
+
`,(0,b.jsx)(t.li,{children:`Заблокированное состояние лучше проверять отдельно, чтобы убедиться, что визуально и поведенчески оно остается понятным.`}),`
|
|
28
28
|
`]}),`
|
|
29
|
-
`,(0,b.jsx)(
|
|
30
|
-
`,(0,b.jsx)(
|
|
31
|
-
`,(0,b.jsx)(
|
|
32
|
-
`,(0,b.jsx)(
|
|
33
|
-
`,(0,b.jsx)(
|
|
34
|
-
`,(0,b.jsx)(
|
|
35
|
-
`,(0,b.jsx)(
|
|
36
|
-
`,(0,b.jsx)(
|
|
37
|
-
`,(0,b.jsx)(
|
|
38
|
-
`,(0,b.jsx)(
|
|
39
|
-
`,(0,b.jsx)(
|
|
40
|
-
`,(0,b.jsx)(
|
|
41
|
-
`,(0,b.jsx)(
|
|
42
|
-
`,(0,b.jsx)(
|
|
29
|
+
`,(0,b.jsx)(t.h2,{id:`сценарии-использования`,children:`Сценарии использования`}),`
|
|
30
|
+
`,(0,b.jsx)(t.h3,{id:`компонент-работает-в-контролируемом-режиме-когда-состояние-хранится-во-внешнем-компоненте`,children:`Компонент работает в контролируемом режиме, когда состояние хранится во внешнем компоненте`}),`
|
|
31
|
+
`,(0,b.jsx)(t.p,{children:`Компонент работает в контролируемом режиме, когда состояние хранится во внешнем компоненте.`}),`
|
|
32
|
+
`,(0,b.jsx)(u,{of:p}),`
|
|
33
|
+
`,(0,b.jsx)(t.h3,{id:`вертикальная-ориентация-или-вертикальный-режим`,children:`Вертикальная ориентация или вертикальный режим`}),`
|
|
34
|
+
`,(0,b.jsx)(t.p,{children:`Вертикальная ориентация или вертикальный режим.`}),`
|
|
35
|
+
`,(0,b.jsx)(u,{of:h}),`
|
|
36
|
+
`,(0,b.jsx)(t.h3,{id:`проверка-поведения-в-заблокированном-состоянии`,children:`Проверка поведения в заблокированном состоянии`}),`
|
|
37
|
+
`,(0,b.jsx)(t.p,{children:`Проверка поведения в заблокированном состоянии.`}),`
|
|
38
|
+
`,(0,b.jsx)(u,{of:m}),`
|
|
39
|
+
`,(0,b.jsx)(t.h2,{id:`api`,children:`API`}),`
|
|
40
|
+
`,(0,b.jsx)(c,{of:_}),`
|
|
41
|
+
`,(0,b.jsx)(t.h2,{id:`все-сторисы`,children:`Все сторисы`}),`
|
|
42
|
+
`,(0,b.jsx)(i,{includePrimary:!1})]})}function y(e={}){let{wrapper:t}={...n(),...e.components};return t?(0,b.jsx)(t,{...e,children:(0,b.jsx)(v,{...e})}):v(e)}var b;e((()=>{b=t(),f(),s(),g()}))();export{y as default};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{c as e,i as t}from"./preload-helper-B45gAKPr.js";import{pn as n,t as r}from"./iframe-GmIo3IOR.js";import{a as i,i as a,n as o,o as s}from"./utils-B73_kE2n.js";import{n as c,t as l}from"./ui.module-wFHXkJzp.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};
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import{a as e,c as t,i as n}from"./preload-helper-B45gAKPr.js";import{pn as r,t as i}from"./iframe-GmIo3IOR.js";import{n as a,t as o}from"./RadioGroup-Jq-lWcgE.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
|
+
render: args => {
|
|
3
|
+
const [value, setValue] = useState("email");
|
|
4
|
+
return <div style={{
|
|
5
|
+
display: "grid",
|
|
6
|
+
gap: 10
|
|
7
|
+
}}>
|
|
8
|
+
<StringRadioGroup {...args} value={value} onChange={setValue}>
|
|
9
|
+
<RadioGroup.Option value="email" label="Email" description="Письма на корпоративную почту" />
|
|
10
|
+
<RadioGroup.Option value="sms" label="SMS" description="Сообщения на телефон" />
|
|
11
|
+
<RadioGroup.Option value="push" label="Push" description="Уведомления в приложении" />
|
|
12
|
+
</StringRadioGroup>
|
|
13
|
+
<div>Выбрано: {value}</div>
|
|
14
|
+
</div>;
|
|
15
|
+
},
|
|
16
|
+
args: {
|
|
17
|
+
children: undefined
|
|
18
|
+
}
|
|
19
|
+
}`,...f.parameters?.docs?.source}}},p.parameters={...p.parameters,docs:{...p.parameters?.docs,source:{originalSource:`{
|
|
20
|
+
render: args => {
|
|
21
|
+
const [value, setValue] = useState("draft");
|
|
22
|
+
return <StringRadioGroup {...args} value={value} onChange={setValue} orientation="vertical" label="Статус документа">
|
|
23
|
+
<RadioGroup.Option value="draft" label="Черновик" />
|
|
24
|
+
<RadioGroup.Option value="review" label="На согласовании" />
|
|
25
|
+
<RadioGroup.Option value="approved" label="Утвержден" />
|
|
26
|
+
</StringRadioGroup>;
|
|
27
|
+
},
|
|
28
|
+
args: {
|
|
29
|
+
orientation: "vertical",
|
|
30
|
+
children: undefined
|
|
31
|
+
}
|
|
32
|
+
}`,...p.parameters?.docs?.source}}},m.parameters={...m.parameters,docs:{...m.parameters?.docs,source:{originalSource:`{
|
|
33
|
+
render: args => <StringRadioGroup {...args} disabled>
|
|
34
|
+
<RadioGroup.Option value="yes" label="Да" />
|
|
35
|
+
<RadioGroup.Option value="no" label="Нет" />
|
|
36
|
+
</StringRadioGroup>,
|
|
37
|
+
args: {
|
|
38
|
+
disabled: true,
|
|
39
|
+
value: "yes",
|
|
40
|
+
children: undefined
|
|
41
|
+
}
|
|
42
|
+
}`,...m.parameters?.docs?.source}}},h=[`Controlled`,`Vertical`,`Disabled`]}));g();export{f as Controlled,m as Disabled,p as Vertical,h as __namedExportsOrder,d as default,g as n,s as t};
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import{c as e,i as t}from"./preload-helper-B45gAKPr.js";import{Tt as n,n as r,pn as i,s as a,t as o}from"./iframe-GmIo3IOR.js";import{a as s,i as c}from"./utils-B73_kE2n.js";import{n as l,t as u}from"./ui.module-wFHXkJzp.js";import{D as ee,S as te,d as ne,f as d,g as re,l as f,m as p,r as m,s as ie,t as h,v as ae}from"./picker-Ly9fNo5I.js";function oe({option:e,getOptionLabel:t,getOptionCode:n,getOptionGroup:r}){return[d(t(e)),d(n?.(e)),d(r?.(e)?.label)].filter(e=>!!e).join(` `).toLowerCase()}var g=t((()=>{h()})),_=t((()=>{g()}));function se(e,t){let n=[];return e.forEach((e,r)=>{let i=t(e),a=n.at(-1),o=a?.group?.key===i?.key;if(a&&o){a.items.push({option:e,index:r});return}n.push({group:i,items:[{option:e,index:r}]})}),n}var v=t((()=>{})),y,b,x,S=t((()=>{y=`aEEqH1`,b=`_4HQKa7`,x={inputWithOverlay:y,valueOverlay:b}}));function C(e){let{label:t,description:r,disabled:i,placeholder:o,size:c,options:u,value:h,onChange:g,getOptionKey:_,getOptionLabel:v,getOptionCode:y,getOptionDisabled:b,getOptionAriaLabel:S,getOptionGroup:C,getOptionClassName:E,renderOption:D,renderValue:O,className:ce,buttonClassName:le,optionsClassName:ue,optionsMaxWidth:de,optionsContentClassName:fe,searchable:k=!1,defaultFilter:pe=!0,query:me,defaultQuery:he,onQuery:ge,renderPopupHeader:_e,emptyState:ve,loadingState:A,errorState:j,placement:M=`bottom-start`,clearable:N=!1}=e,P=g,F=(0,w.useRef)(null),[I,ye]=(0,w.useState)(!1),L=k?`search-single`:`display`,R=h===void 0?void 0:_(h),z=R===void 0?void 0:u.find(e=>_(e)===R)??h,{query:B,setQuery:V}=ie({open:I,query:me,defaultQuery:he,onQuery:ge,triggerMode:L}),be=(0,w.useCallback)(e=>oe({option:e,getOptionLabel:v,getOptionCode:y,getOptionGroup:C}),[y,C,v]),H=ne({options:u,query:B,enabled:k&&pe,getSearchText:be}),U=(0,w.useMemo)(()=>C?se(H,C):void 0,[C,H]),{activeIndex:xe,context:Se,floatingStyles:Ce,getFloatingProps:we,setReference:Te,setFloating:Ee,setOptionRef:De,close:W,openList:Oe,toggleOpen:ke,selectOption:Ae,selectActiveOption:je,handleReferenceKeyDown:Me,handleFloatingKeyDown:Ne,getOptionId:Pe,getActiveOptionId:G}=f({options:H,selectedIndex:R===void 0?-1:H.findIndex(e=>_(e)===R),open:I,onOpenChange:ye,getOptionDisabled:b,onSelect:P,disabled:i,placement:M,triggerMode:L}),K=H.length>0,q=z===void 0?void 0:v(z),J=z===void 0?void 0:O?O(z):q,Y=d(q),Fe=z===void 0?void 0:d(y?.(z)),Ie=d(J)??Y??Fe??(R===void 0?``:String(R)),X=k&&(I||B.length>0),Le=X?B:z===void 0?``:Ie,Z=z!==void 0&&J!==void 0&&d(J)===void 0&&!X,Q=m({mode:L,open:I,currentQuery:B,hasDisplayValue:z!==void 0,inputRef:F,setQuery:V,openList:Oe,close:W,toggleOpen:ke}),Re=e=>{F.current=e},ze=()=>{N&&P(void 0),V(``),W()},$=(e,t,r)=>{let i=_(t),a=R!==void 0&&i===R,o=r===xe,c=b?.(t)??!1,u={active:o,selected:a,disabled:c};return(0,T.jsx)(`div`,{id:Pe(e,r),ref:e=>De(r,e),role:`option`,"aria-selected":a,"aria-disabled":c||void 0,"aria-label":S?.(t),className:s(l.uiPopupOption,c&&l.disabled,o&&l.uiPopupOptionActive,a&&l.selected,E?.(t,u)),onClick:()=>Ae(t),children:D?D(t,u):(0,T.jsxs)(T.Fragment,{children:[a?(0,T.jsx)(n,{className:l.uiPopupOptionIcon}):(0,T.jsx)(`span`,{className:l.uiPopupOptionIcon}),(0,T.jsx)(`div`,{className:l.uiOptionText,children:v(t)}),y&&(0,T.jsx)(`div`,{className:l.uiOptionCode,children:y(t)})]})},i)};return(0,T.jsx)(ee,{label:t,description:r,disabled:i,placeholder:o,size:c,className:ce,children:({controlId:e,labelId:t,describedBy:n})=>{let r=`${e}-listbox`;return(0,T.jsxs)(T.Fragment,{children:[(0,T.jsx)(p,{ref:Re,rootRef:Te,id:e,type:`text`,disabled:i,readOnly:!k,autoComplete:`off`,role:`combobox`,value:Le,placeholder:z===void 0||X?o:void 0,"aria-labelledby":t,"aria-describedby":n,"aria-haspopup":`listbox`,"aria-expanded":I,"aria-controls":I?r:void 0,"aria-autocomplete":k?`list`:`none`,"aria-activedescendant":I?G(r):void 0,inputClassName:s(Z&&x.inputWithOverlay,le,`textOverflow`),overlay:Z?(0,T.jsx)(`div`,{className:x.valueOverlay,children:J}):void 0,endAdornment:(0,T.jsx)(re,{open:I,disabled:i,onToggleMouseDown:Q.handleToggleMouseDown,onToggleClick:Q.handleToggleClick,children:N&&z!==void 0&&!i?(0,T.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(),ze()},"aria-label":`Очистить выбор`,children:(0,T.jsx)(a,{})}):null}),onChange:e=>{k&&Q.handleTriggerInputChange(e.target.value)},onClick:Q.handleTriggerClick,onFocus:e=>{Q.handleTriggerFocus(e.currentTarget)},onKeyDown:e=>{Me(e),!e.defaultPrevented&&Q.handleTriggerKeyDown({event:e,onActivateWhenOpen:je,enableSpaceActivation:!k})}}),(0,T.jsx)(te,{open:I,context:Se,floatingStyles:Ce,listId:r,labelId:t,descriptionId:n,activeOptionId:K?G(r):void 0,setFloating:Ee,getFloatingProps:we,onKeyDown:Ne,className:s(l.uiPopupOptions,ue),maxWidth:de,header:_e,children:(0,T.jsx)(`div`,{className:s(fe,`h100 scrollable`),children:K?U?U.map((e,t)=>{let n=e.group?`${r}-group-${t}`:void 0,i=e.items.map(({option:e,index:t})=>$(r,e,t));return e.group?(0,T.jsxs)(`div`,{role:`group`,"aria-labelledby":n,children:[(0,T.jsx)(`div`,{id:n,className:l.uiPopupGroupLabel,children:e.group.label}),i]},`group-${String(e.group.key)}-${t}`):(0,T.jsx)(w.Fragment,{children:i},`options-${t}`)}):H.map((e,t)=>$(r,e,t)):(0,T.jsx)(ae,{emptyState:ve,loadingState:A,errorState:j})})})]})}})}var w,T,E=t((()=>{w=e(i(),1),c(),r(),h(),u(),_(),v(),S(),T=o(),C.__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:``},getOptionGroup:{required:!1,tsType:{name:`signature`,type:`function`,raw:`(option: TOption) => SelectOptionGroup | undefined`,signature:{arguments:[{type:{name:`TOption`},name:`option`}],return:{name:`union`,raw:`SelectOptionGroup | undefined`,elements:[{name:`signature`,type:`object`,raw:`{
|
|
2
|
+
readonly key: SelectOptionKey;
|
|
3
|
+
readonly label: ReactNode;
|
|
4
|
+
}`,signature:{properties:[{key:`key`,value:{name:`union`,raw:`string | number`,elements:[{name:`string`},{name:`number`}],required:!0}},{key:`label`,value:{name:`ReactNode`,required:!0}}]}},{name:`undefined`}]}}},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:`{
|
|
5
|
+
active: boolean;
|
|
6
|
+
selected: boolean;
|
|
7
|
+
disabled: boolean;
|
|
8
|
+
}`,signature:{properties:[{key:`active`,value:{name:`boolean`,required:!0}},{key:`selected`,value:{name:`boolean`,required:!0}},{key:`disabled`,value:{name:`boolean`,required:!0}}]}},name:`state`}],return:{name:`union`,raw:`string | undefined`,elements:[{name:`string`},{name:`undefined`}]}}},description:``},renderOption:{required:!1,tsType:{name:`signature`,type:`function`,raw:`(option: TOption, state: SelectOptionState) => ReactNode`,signature:{arguments:[{type:{name:`TOption`},name:`option`},{type:{name:`signature`,type:`object`,raw:`{
|
|
9
|
+
active: boolean;
|
|
10
|
+
selected: boolean;
|
|
11
|
+
disabled: boolean;
|
|
12
|
+
}`,signature:{properties:[{key:`active`,value:{name:`boolean`,required:!0}},{key:`selected`,value:{name:`boolean`,required:!0}},{key:`disabled`,value:{name:`boolean`,required:!0}}]}},name:`state`}],return:{name:`ReactNode`}}},description:``},renderValue:{required:!1,tsType:{name:`signature`,type:`function`,raw:`(option: TOption) => ReactNode`,signature:{arguments:[{type:{name:`TOption`},name:`option`}],return:{name:`ReactNode`}}},description:``},className:{required:!1,tsType:{name:`string`},description:``},buttonClassName:{required:!1,tsType:{name:`string`},description:``},optionsClassName:{required:!1,tsType:{name:`string`},description:``},optionsMaxWidth:{required:!1,tsType:{name:`CSSProperties["maxWidth"]`,raw:`CSSProperties["maxWidth"]`},description:``},optionsContentClassName:{required:!1,tsType:{name:`string`},description:``},searchable:{required:!1,tsType:{name:`boolean`},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:``},defaultFilter:{required:!1,tsType:{name:`boolean`},description:``},renderPopupHeader:{required:!1,tsType:{name:`ReactNode`},description:``},emptyState:{required:!1,tsType:{name:`ReactNode`},description:``},loadingState:{required:!1,tsType:{name:`ReactNode`},description:``},errorState:{required:!1,tsType:{name:`ReactNode`},description:``},placement:{required:!1,tsType:{name:`Placement`},description:``},clearable:{required:!1,tsType:{name:`TClearable`},description:``},onChange:{required:!0,tsType:{name:`signature`,type:`function`,raw:`(value: T) => void`,signature:{arguments:[{type:{name:`unknown`},name:`value`}],return:{name:`void`}}},description:``}}}}));export{E as n,C as t};
|
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
import{i as e}from"./preload-helper-B45gAKPr.js";import{E as
|
|
2
|
-
`,(0,C.jsx)(
|
|
3
|
-
`,(0,C.jsx)(
|
|
4
|
-
`,(0,C.jsx)(
|
|
1
|
+
import{i as e}from"./preload-helper-B45gAKPr.js";import{t}from"./iframe-GmIo3IOR.js";import{E as n,a as r,d as i,f as a,l as o,m as s,n as c,p as l,r as u,u as d}from"./blocks-0RiOsxIK.js";import{t as f}from"./mdx-react-shim-DQ40dZsI.js";import{ControlledObjects as p,CustomOptionLayout as m,Disabled as h,GroupedOptions as g,Placeholder as _,PrimitiveOptions as v,n as y,t as b}from"./Select.stories-D-onxXmT.js";function x(e){let t={code:`code`,h2:`h2`,h3:`h3`,li:`li`,p:`p`,pre:`pre`,ul:`ul`,...n(),...e.components};return(0,C.jsxs)(C.Fragment,{children:[(0,C.jsx)(o,{of:b,parameters:{docs:{toc:!0}}}),`
|
|
2
|
+
`,(0,C.jsx)(l,{children:`Select`}),`
|
|
3
|
+
`,(0,C.jsx)(a,{children:`Getter-based select для примитивов и сложных объектных option`}),`
|
|
4
|
+
`,(0,C.jsx)(t.p,{children:`Select уже имеет живые stories, а эта страница собирает их в структурированную документацию с краткими рекомендациями, примерами подключения и API.
|
|
5
5
|
Ниже можно быстро проверить базовый сценарий, а затем перейти к отдельным режимам использования и состояниям компонента. Отдельно разобраны заблокированные состояния.`}),`
|
|
6
|
-
`,(0,C.jsx)(
|
|
7
|
-
`,(0,C.jsx)(
|
|
8
|
-
`,(0,C.jsx)(
|
|
9
|
-
`,(0,C.jsx)(
|
|
6
|
+
`,(0,C.jsx)(t.h2,{id:`основной-сценарий`,children:`Основной сценарий`}),`
|
|
7
|
+
`,(0,C.jsx)(d,{}),`
|
|
8
|
+
`,(0,C.jsx)(r,{of:p}),`
|
|
9
|
+
`,(0,C.jsx)(t.pre,{children:(0,C.jsx)(t.code,{className:`language-tsx`,children:`import { useState } from "react";
|
|
10
10
|
|
|
11
11
|
import { Select } from "@/shared/ui";
|
|
12
12
|
|
|
@@ -31,31 +31,31 @@ export function Example() {
|
|
|
31
31
|
);
|
|
32
32
|
}
|
|
33
33
|
`})}),`
|
|
34
|
-
`,(0,C.jsx)(
|
|
35
|
-
`,(0,C.jsxs)(
|
|
36
|
-
`,(0,C.jsx)(
|
|
34
|
+
`,(0,C.jsx)(t.h2,{id:`практические-рекомендации`,children:`Практические рекомендации`}),`
|
|
35
|
+
`,(0,C.jsxs)(t.ul,{children:[`
|
|
36
|
+
`,(0,C.jsx)(t.li,{children:`Заблокированное состояние лучше проверять отдельно, чтобы убедиться, что визуально и поведенчески оно остается понятным.`}),`
|
|
37
37
|
`]}),`
|
|
38
|
-
`,(0,C.jsx)(
|
|
39
|
-
`,(0,C.jsx)(
|
|
40
|
-
`,(0,C.jsx)(
|
|
41
|
-
`,(0,C.jsx)(
|
|
42
|
-
`,(0,C.jsx)(
|
|
43
|
-
`,(0,C.jsx)(
|
|
44
|
-
`,(0,C.jsx)(
|
|
45
|
-
`,(0,C.jsx)(
|
|
46
|
-
`,(0,C.jsx)(
|
|
47
|
-
`,(0,C.jsx)(
|
|
48
|
-
`,(0,C.jsx)(
|
|
49
|
-
`,(0,C.jsxs)(
|
|
50
|
-
Для длинных заголовков ширину popup можно ограничить через `,(0,C.jsx)(
|
|
51
|
-
`,(0,C.jsx)(
|
|
52
|
-
`,(0,C.jsx)(
|
|
53
|
-
`,(0,C.jsx)(
|
|
54
|
-
`,(0,C.jsx)(
|
|
55
|
-
`,(0,C.jsx)(
|
|
56
|
-
`,(0,C.jsx)(
|
|
57
|
-
`,(0,C.jsx)(
|
|
58
|
-
`,(0,C.jsx)(
|
|
59
|
-
`,(0,C.jsx)(
|
|
60
|
-
`,(0,C.jsx)(
|
|
61
|
-
`,(0,C.jsx)(
|
|
38
|
+
`,(0,C.jsx)(t.h2,{id:`сценарии-использования`,children:`Сценарии использования`}),`
|
|
39
|
+
`,(0,C.jsx)(t.h3,{id:`работа-с-объектами-как-со-значениями-option`,children:`Работа с объектами как со значениями option`}),`
|
|
40
|
+
`,(0,C.jsx)(t.p,{children:`Работа с объектами как со значениями option.`}),`
|
|
41
|
+
`,(0,C.jsx)(u,{of:p}),`
|
|
42
|
+
`,(0,C.jsx)(t.h3,{id:`работа-с-примитивными-option`,children:`Работа с примитивными option`}),`
|
|
43
|
+
`,(0,C.jsx)(t.p,{children:`Работа с примитивными option.`}),`
|
|
44
|
+
`,(0,C.jsx)(u,{of:v}),`
|
|
45
|
+
`,(0,C.jsx)(t.h3,{id:`поведение-без-выбранного-значения`,children:`Поведение без выбранного значения`}),`
|
|
46
|
+
`,(0,C.jsx)(t.p,{children:`Поведение без выбранного значения.`}),`
|
|
47
|
+
`,(0,C.jsx)(u,{of:_}),`
|
|
48
|
+
`,(0,C.jsx)(t.h3,{id:`группировка-опций`,children:`Группировка опций`}),`
|
|
49
|
+
`,(0,C.jsxs)(t.p,{children:[(0,C.jsx)(t.code,{children:`getOptionGroup`}),` объединяет соседние опции с одинаковым `,(0,C.jsx)(t.code,{children:`key`}),` под доступным заголовком. Опции без группы остаются обычными элементами списка.
|
|
50
|
+
Для длинных заголовков ширину popup можно ограничить через `,(0,C.jsx)(t.code,{children:`optionsMaxWidth`}),`, например `,(0,C.jsx)(t.code,{children:`optionsMaxWidth="40rem"`}),`.`]}),`
|
|
51
|
+
`,(0,C.jsx)(u,{of:g}),`
|
|
52
|
+
`,(0,C.jsx)(t.h3,{id:`кастомный-рендер-option-и-выбранного-значения`,children:`Кастомный рендер option и выбранного значения`}),`
|
|
53
|
+
`,(0,C.jsx)(t.p,{children:`Кастомный рендер option и выбранного значения.`}),`
|
|
54
|
+
`,(0,C.jsx)(u,{of:m}),`
|
|
55
|
+
`,(0,C.jsx)(t.h3,{id:`проверка-поведения-в-заблокированном-состоянии`,children:`Проверка поведения в заблокированном состоянии`}),`
|
|
56
|
+
`,(0,C.jsx)(t.p,{children:`Проверка поведения в заблокированном состоянии.`}),`
|
|
57
|
+
`,(0,C.jsx)(u,{of:h}),`
|
|
58
|
+
`,(0,C.jsx)(t.h2,{id:`api`,children:`API`}),`
|
|
59
|
+
`,(0,C.jsx)(c,{of:b}),`
|
|
60
|
+
`,(0,C.jsx)(t.h2,{id:`все-сторисы`,children:`Все сторисы`}),`
|
|
61
|
+
`,(0,C.jsx)(i,{includePrimary:!1})]})}function S(e={}){let{wrapper:t}={...n(),...e.components};return t?(0,C.jsx)(t,{...e,children:(0,C.jsx)(x,{...e})}):x(e)}var C;e((()=>{C=t(),f(),s(),y()}))();export{S as default};
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import{a as e,c as t,i as n}from"./preload-helper-B45gAKPr.js";import{pn as r,t as i}from"./iframe-GmIo3IOR.js";import{n as a,t as o}from"./Select-BrRZA3Up.js";var s=e({ControlledObjects:()=>p,CustomOptionLayout:()=>_,Disabled:()=>v,GroupedOptions:()=>g,Placeholder:()=>h,PrimitiveOptions:()=>m,__namedExportsOrder:()=>y,default:()=>f}),c,l,u,d,f,p,m,h,g,_,v,y,b=n((()=>{c=t(r(),1),a(),l=i(),u=[{id:1,name:`Отдел продаж`,code:`SLS`,manager:`Елена Миронова`,direction:`Коммерческий блок`},{id:2,name:`Закупки`,code:`PRC`,manager:`Антон Мелихов`,direction:`Коммерческий блок`},{id:3,name:`Логистика`,code:`LGS`,manager:`Мария Климова`,direction:`Операционный блок`,disabled:!0},{id:4,name:`Поддержка клиентов`,code:`SUP`,manager:`Ирина Белова`,direction:`Операционный блок`}],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},getOptionGroup:{description:`Опциональная функция, которая объединяет соседние 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`},optionsMaxWidth:{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)();return(0,l.jsx)(o,{...e,value:t,onChange:n,getOptionGroup:e=>({key:e.direction,label:e.direction}),optionsMaxWidth:`40rem`})}},_={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})]})})}},v={args:{disabled:!0,value:u[0]}},p.parameters={...p.parameters,docs:{...p.parameters?.docs,source:{originalSource:`{
|
|
2
|
+
name: "Объекты",
|
|
3
|
+
render: args => {
|
|
4
|
+
const [value, setValue] = useState<DepartmentOption | undefined>(departmentOptions[1]);
|
|
5
|
+
return <Select {...args} value={value} onChange={setValue} />;
|
|
6
|
+
}
|
|
7
|
+
}`,...p.parameters?.docs?.source}}},m.parameters={...m.parameters,docs:{...m.parameters?.docs,source:{originalSource:`{
|
|
8
|
+
name: "Примитивы",
|
|
9
|
+
render: () => {
|
|
10
|
+
const [value, setValue] = useState<(typeof primitiveOptions)[number] | undefined>(primitiveOptions[1]);
|
|
11
|
+
return <Select label="Статус" description="Пример использования низкоуровневого Select со строковыми значениями." placeholder="Выберите статус" options={primitiveOptions} value={value} onChange={setValue} getOptionKey={option => option} getOptionLabel={option => option} size="md" />;
|
|
12
|
+
}
|
|
13
|
+
}`,...m.parameters?.docs?.source}}},h.parameters={...h.parameters,docs:{...h.parameters?.docs,source:{originalSource:`{
|
|
14
|
+
render: args => {
|
|
15
|
+
const [value, setValue] = useState<DepartmentOption | undefined>(undefined);
|
|
16
|
+
return <Select {...args} value={value} onChange={setValue} />;
|
|
17
|
+
}
|
|
18
|
+
}`,...h.parameters?.docs?.source}}},g.parameters={...g.parameters,docs:{...g.parameters?.docs,source:{originalSource:`{
|
|
19
|
+
name: "Группированные опции",
|
|
20
|
+
render: args => {
|
|
21
|
+
const [value, setValue] = useState<DepartmentOption | undefined>();
|
|
22
|
+
return <Select {...args} value={value} onChange={setValue} getOptionGroup={option => ({
|
|
23
|
+
key: option.direction,
|
|
24
|
+
label: option.direction
|
|
25
|
+
})} optionsMaxWidth="40rem" />;
|
|
26
|
+
}
|
|
27
|
+
}`,...g.parameters?.docs?.source}}},_.parameters={..._.parameters,docs:{..._.parameters?.docs,source:{originalSource:`{
|
|
28
|
+
name: "Кастомный рендер",
|
|
29
|
+
render: args => {
|
|
30
|
+
const [value, setValue] = useState<DepartmentOption | undefined>(departmentOptions[0]);
|
|
31
|
+
return <Select {...args} value={value} onChange={setValue} renderValue={option => \`\${option.code} · \${option.name}\`} renderOption={(option, state) => <>
|
|
32
|
+
<div className="flexEllipsis">
|
|
33
|
+
<div>{option.name}</div>
|
|
34
|
+
<div className="fontSizeSm content2">{option.manager}</div>
|
|
35
|
+
</div>
|
|
36
|
+
<div style={{
|
|
37
|
+
opacity: state.selected ? 1 : 0.5
|
|
38
|
+
}}>{option.code}</div>
|
|
39
|
+
</>} />;
|
|
40
|
+
}
|
|
41
|
+
}`,..._.parameters?.docs?.source}}},v.parameters={...v.parameters,docs:{...v.parameters?.docs,source:{originalSource:`{
|
|
42
|
+
args: {
|
|
43
|
+
disabled: true,
|
|
44
|
+
value: departmentOptions[0]
|
|
45
|
+
}
|
|
46
|
+
}`,...v.parameters?.docs?.source}}},y=[`ControlledObjects`,`PrimitiveOptions`,`Placeholder`,`GroupedOptions`,`CustomOptionLayout`,`Disabled`]}));b();export{p as ControlledObjects,_ as CustomOptionLayout,v as Disabled,g as GroupedOptions,h as Placeholder,m as PrimitiveOptions,y as __namedExportsOrder,f as default,b as n,s as t};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{i as e}from"./preload-helper-B45gAKPr.js";import{t}from"./iframe-GmIo3IOR.js";import{a as n,i as r}from"./utils-B73_kE2n.js";import{o as i,t as a}from"./text-Cw7Vu082.js";import{n as o,t as s}from"./ui.module-wFHXkJzp.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};
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import{i as e}from"./preload-helper-B45gAKPr.js";import{t}from"./iframe-GmIo3IOR.js";import{n,t as r}from"./Select-BrRZA3Up.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
|
+
TOption[TOptionKey],
|
|
3
|
+
SelectOptionKey
|
|
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};
|