@ryuzaki13/react-foundation-ui 3.6.0 → 3.7.1
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/notifications/index.d.ts +1 -1
- package/dist/notifications/index.d.ts.map +1 -1
- package/dist/notifications/index.js +40 -24
- package/dist/notifications/index.js.map +1 -1
- package/dist/notifications/model/NotificationsProvider.d.ts +2 -18
- package/dist/notifications/model/NotificationsProvider.d.ts.map +1 -1
- package/dist/notifications/model/index.d.ts +4 -0
- package/dist/notifications/model/index.d.ts.map +1 -1
- package/dist/notifications/model/notificationsContext.d.ts +4 -0
- package/dist/notifications/model/notificationsContext.d.ts.map +1 -0
- package/dist/notifications/model/useNotificationById.d.ts +4 -0
- package/dist/notifications/model/useNotificationById.d.ts.map +1 -0
- package/dist/notifications/model/useNotificationHistory.d.ts +6 -0
- package/dist/notifications/model/useNotificationHistory.d.ts.map +1 -0
- package/dist/notifications/model/useNotifications.d.ts +3 -0
- package/dist/notifications/model/useNotifications.d.ts.map +1 -0
- package/dist/notifications/model/useNotificationsStore.d.ts +3 -0
- package/dist/notifications/model/useNotificationsStore.d.ts.map +1 -0
- package/dist/notifications/model/useNotify.d.ts +17 -0
- package/dist/notifications/model/useNotify.d.ts.map +1 -0
- package/dist/notifications/ui/NotificationsHost.d.ts +2 -1
- package/dist/notifications/ui/NotificationsHost.d.ts.map +1 -1
- package/dist/styles.css +1 -1
- package/dist/tabs/index.js +20 -13
- package/dist/tabs/index.js.map +1 -1
- package/dist/tabs/ui/TabsBox.d.ts.map +1 -1
- package/dist/tabs/ui/TabsLayout.d.ts.map +1 -1
- package/package.json +3 -3
- package/storybook-static/assets/{Badge-r7lsdHne.js → Badge-DTUYnjUJ.js} +1 -1
- package/storybook-static/assets/{Badge.stories-P4qdQ7cm.js → Badge.stories-rjlZcsBa.js} +1 -1
- package/storybook-static/assets/{BadgeList-8NyPAV2Q.js → BadgeList-xlIWwEkW.js} +1 -1
- package/storybook-static/assets/{BarcodeScannerDialog.stories--TadwGdZ.js → BarcodeScannerDialog.stories-qfMXeaVE.js} +1 -1
- package/storybook-static/assets/{Button-BP0DDcNq.js → Button-CBG6iR1d.js} +1 -1
- package/storybook-static/assets/{Button-X3OT5zE7.js → Button-CdRjxwHf.js} +1 -1
- package/storybook-static/assets/{Button.stories-CFiUr_xE.js → Button.stories-DbtwVXli.js} +1 -1
- package/storybook-static/assets/{CalendarView-nWuZBE9T.js → CalendarView-BX0PAy5V.js} +1 -1
- package/storybook-static/assets/{CheckBox-Bde9tud-.js → CheckBox-4raP7tMo.js} +1 -1
- package/storybook-static/assets/{CheckBox-BId2Zf_m.js → CheckBox-Dxyvwx9w.js} +1 -1
- package/storybook-static/assets/{CheckBox.stories-BVU9Rkai.js → CheckBox.stories-HBKpJ12Q.js} +1 -1
- package/storybook-static/assets/{Color-6AOWCN3U-BeUy9gum.js → Color-6AOWCN3U-Bmlc4WNM.js} +1 -1
- package/storybook-static/assets/{ContextMenu-Byksyz_8.js → ContextMenu-Cs3dFpcR.js} +1 -1
- package/storybook-static/assets/{ContextMenu-BS2UVgbu.js → ContextMenu-CvsCDdTo.js} +1 -1
- package/storybook-static/assets/{ContextMenu.stories-DmJPp2YR.js → ContextMenu.stories-DUco2ooo.js} +1 -1
- package/storybook-static/assets/{DateInput-CQe_1Dk-.js → DateInput-BzH2yWLd.js} +1 -1
- package/storybook-static/assets/{DateInput-CgETMk9B.js → DateInput-C876uAev.js} +1 -1
- package/storybook-static/assets/{DateInput.stories-BOst6EKv.js → DateInput.stories-B96RHwnv.js} +1 -1
- package/storybook-static/assets/{DateRangePresetSelect-DHJ31vIB.js → DateRangePresetSelect-CDIZjlZR.js} +1 -1
- package/storybook-static/assets/{DateRangePresetSelect-CxrNYBTe.js → DateRangePresetSelect-Dt6gakU3.js} +1 -1
- package/storybook-static/assets/{DateRangePresetSelect.stories-CiyN1joN.js → DateRangePresetSelect.stories-CowdHg25.js} +1 -1
- package/storybook-static/assets/{Detail-V_NYrUJR.js → Detail-5gzUBcgn.js} +1 -1
- package/storybook-static/assets/{Detail.stories-B4tf6inN.js → Detail.stories-BmfI0TB_.js} +1 -1
- package/storybook-static/assets/{Dialog-DNTx5Unm.js → Dialog-B6cxAYUL.js} +1 -1
- package/storybook-static/assets/{Dialog-B6miFej7.js → Dialog-DGjQw2Fl.js} +1 -1
- package/storybook-static/assets/{Dialog.stories-BS1dDTLW.js → Dialog.stories-DGN5bZB0.js} +1 -1
- package/storybook-static/assets/{Disclosure-4sf5BIn1.js → Disclosure-BD6JU91g.js} +1 -1
- package/storybook-static/assets/{Disclosure.stories-DhUQNdEC.js → Disclosure.stories-Blp4sjjH.js} +1 -1
- package/storybook-static/assets/{DisclosureGroup-Codiur77.js → DisclosureGroup-DSs17wh1.js} +1 -1
- package/storybook-static/assets/{DocsRenderer-JROSPFPF-yT2aWNaF.js → DocsRenderer-JROSPFPF-DjsQFu6U.js} +1 -1
- package/storybook-static/assets/{DropZone-D4rl2WEV.js → DropZone-BWY1s904.js} +1 -1
- package/storybook-static/assets/{DropZone-Du0BQAyO.js → DropZone-CBJ8D9YW.js} +1 -1
- package/storybook-static/assets/{DropZone.stories-B8iPjYH_.js → DropZone.stories-BYg0y5zw.js} +1 -1
- package/storybook-static/assets/{DropdownMenu-BcdS3oNz.js → DropdownMenu-DyxhrZHn.js} +1 -1
- package/storybook-static/assets/{ExpandableActionPanel-6u6YJanI.js → ExpandableActionPanel-utF3k6nI.js} +1 -1
- package/storybook-static/assets/{ExpandableActionPanel.stories-D-CZHUv0.js → ExpandableActionPanel.stories-6eYg64t8.js} +1 -1
- package/storybook-static/assets/{Flex-DWi0hQ-f.js → Flex-CpoGbzxR.js} +1 -1
- package/storybook-static/assets/{Flex.stories-CKKi33JK.js → Flex.stories-DZ2R5uxU.js} +1 -1
- package/storybook-static/assets/{FlexContainer-BMK_YH72.js → FlexContainer-BK3kWiEq.js} +1 -1
- package/storybook-static/assets/{FlexItem-DpSHNBxJ.js → FlexItem-CmF4ezss.js} +1 -1
- package/storybook-static/assets/{FloatingPopover-D9nTd47B.js → FloatingPopover-beid_uAU.js} +1 -1
- package/storybook-static/assets/{FormattedTableCell-DyBhk9rG.js → FormattedTableCell-BCzWQE6v.js} +1 -1
- package/storybook-static/assets/{Grid-DbvUGBEN.js → Grid-CbETXUvg.js} +1 -1
- package/storybook-static/assets/{Grid-BZgzDCLK.js → Grid-DQAYnIjp.js} +1 -1
- package/storybook-static/assets/{Grid.stories-BeEAzTxD.js → Grid.stories-QZi3H8un.js} +1 -1
- package/storybook-static/assets/{GridContainer-B82Onj6x.js → GridContainer-Dx_kHFve.js} +1 -1
- package/storybook-static/assets/{ImageCropper.stories-SDIt19aO.js → ImageCropper.stories-hu3ETBrw.js} +1 -1
- package/storybook-static/assets/{ImageRenderer-Bzg27pq7.js → ImageRenderer-oV4w6Hxt.js} +1 -1
- package/storybook-static/assets/{ImageRenderer.stories-C-IE84zV.js → ImageRenderer.stories-DzsFGL36.js} +1 -1
- package/storybook-static/assets/{ImageView.stories-DIcx2Krs.js → ImageView.stories-CKQ-ebNE.js} +1 -1
- package/storybook-static/assets/{ImageViewer.stories-CQTy0uPX.js → ImageViewer.stories-WppljG-8.js} +2 -2
- package/storybook-static/assets/{ImageViewerRuntime-CA5BYQsX.js → ImageViewerRuntime-BPONS1mi.js} +1 -1
- package/storybook-static/assets/{Input-D8uMye_9.js → Input-BOFE5lvG.js} +1 -1
- package/storybook-static/assets/{Input-DmsN6uC_.js → Input-DMvnYoIe.js} +1 -1
- package/storybook-static/assets/{Input.stories-D8QWPnMD.js → Input.stories-BqUmk40r.js} +1 -1
- package/storybook-static/assets/{InputDateTime-Cczll-bH.js → InputDateTime-D3pmNdmh.js} +1 -1
- package/storybook-static/assets/{InputDateTime.stories-DeZ6XHwa.js → InputDateTime.stories-kvtjuevO.js} +1 -1
- package/storybook-static/assets/{InputFile-C0_L0zTd.js → InputFile-CKwYU9U_.js} +1 -1
- package/storybook-static/assets/{InputFile-BbPjLN4E.js → InputFile-DBXedT6h.js} +1 -1
- package/storybook-static/assets/{InputFile.stories-Di_6BkX1.js → InputFile.stories-ehK-UK6n.js} +1 -1
- package/storybook-static/assets/{InputFiles-B3uOwqKF.js → InputFiles-B7Xf4zSp.js} +1 -1
- package/storybook-static/assets/{InputFiles-CF60S_qG.js → InputFiles-BuMatkQD.js} +1 -1
- package/storybook-static/assets/{InputFiles.stories-BkTiEPX6.js → InputFiles.stories-DqZRcFkG.js} +1 -1
- package/storybook-static/assets/{InputFilesList-C9cudcHe.js → InputFilesList-DPPmTQ1K.js} +1 -1
- package/storybook-static/assets/{InputImage-Aq_ZXmtw.js → InputImage-XIGsJtM-.js} +1 -1
- package/storybook-static/assets/{InputImage-Dx0DIf4l.js → InputImage-YPK4ZSDe.js} +1 -1
- package/storybook-static/assets/{InputImage.stories-D7LfEcn4.js → InputImage.stories-CZiBoenh.js} +1 -1
- package/storybook-static/assets/{InteractiveComponents-DP5FyU4S.js → InteractiveComponents-CSvun0IP.js} +1 -1
- package/storybook-static/assets/{InteractiveComponents.stories-CE5L5PAB.js → InteractiveComponents.stories-DY0ygaRD.js} +1 -1
- package/storybook-static/assets/{LayoutPicker-BehxFQsU.js → LayoutPicker-3jtKH77d.js} +1 -1
- package/storybook-static/assets/{LayoutPicker-CW1W-CAf.js → LayoutPicker-BXfi7odv.js} +1 -1
- package/storybook-static/assets/{LayoutPicker.stories-DtvfpOUS.js → LayoutPicker.stories-CmGAGY2E.js} +1 -1
- package/storybook-static/assets/{Listbox-Bn_6WyQc.js → Listbox-B7mjWKH_.js} +1 -1
- package/storybook-static/assets/{Listbox-VcD28kxl.js → Listbox-CVPng_Wi.js} +1 -1
- package/storybook-static/assets/{Listbox.stories-CL6fJlUm.js → Listbox.stories-DAyqK_9S.js} +1 -1
- package/storybook-static/assets/{Modal-D0D5WZ_O.js → Modal-BPnqryDJ.js} +1 -1
- package/storybook-static/assets/{Modal-DrSX0i3a.js → Modal-Chsv1ktM.js} +1 -1
- package/storybook-static/assets/{Modal.stories-Ch3P8_kY.js → Modal.stories-BrUWLwmT.js} +1 -1
- package/storybook-static/assets/{ModalManagerProvider-B0Lf7xX0.js → ModalManagerProvider-Bzz6KbJq.js} +1 -1
- package/storybook-static/assets/{MultiSelect-Cmxa5Vho.js → MultiSelect-BZQy9Xsb.js} +1 -1
- package/storybook-static/assets/{MultiSelect-Bw3qf8eW.js → MultiSelect-odpQ0Zm5.js} +1 -1
- package/storybook-static/assets/{MultiSelect.stories-DKHPBUWD.js → MultiSelect.stories-B2wnVhGS.js} +1 -1
- package/storybook-static/assets/{NoData-seFnJNiE.js → NoData-gI3QuiQP.js} +1 -1
- package/storybook-static/assets/{NotificationsHost-d770FjSM.js → NotificationsHost-Bp69wBpO.js} +30 -2
- package/storybook-static/assets/NotificationsHost.stories-H0M2_6Ql.js +30 -0
- package/storybook-static/assets/{ODataMultiSelect-BN0pcCmQ.js → ODataMultiSelect-BWrI3liD.js} +1 -1
- package/storybook-static/assets/{ODataMultiSelect.stories-D5zrkaFW.js → ODataMultiSelect.stories-g6CYTf9s.js} +1 -1
- package/storybook-static/assets/{ODataSelect-C5DXRRVH.js → ODataSelect-CEoeJfMu.js} +1 -1
- package/storybook-static/assets/{ODataSelect.stories-ClYp08JR.js → ODataSelect.stories-BgqAo36O.js} +1 -1
- package/storybook-static/assets/{ODataTreeMultiSelect-CsvSq1G1.js → ODataTreeMultiSelect-DP0bwv4M.js} +1 -1
- package/storybook-static/assets/{ODataTreeMultiSelect.stories-DFXLQjms.js → ODataTreeMultiSelect.stories-DYdYFhcJ.js} +1 -1
- package/storybook-static/assets/{ODataTreeSelect-CdN-NwV7.js → ODataTreeSelect-B_bhHDSr.js} +1 -1
- package/storybook-static/assets/{ODataTreeSelect.stories-CDffbvxi.js → ODataTreeSelect.stories-C5ygaR7b.js} +1 -1
- package/storybook-static/assets/{OneStepScroller-qXHo2r0J.js → OneStepScroller-Dp5Iva_A.js} +1 -1
- package/storybook-static/assets/{Option-tEWfKgN_.js → Option-DtZ6Qlvd.js} +1 -1
- package/storybook-static/assets/{OptionButton-DOj_dfd1.js → OptionButton-BQo4zeny.js} +1 -1
- package/storybook-static/assets/{OptionContent-6iwuLpQP.js → OptionContent-Yz54kdhn.js} +1 -1
- package/storybook-static/assets/{OptionContentContainer-DbdHO42m.js → OptionContentContainer-DL2-HjT2.js} +1 -1
- package/storybook-static/assets/{PeriodSelect-Bo_B6jdw.js → PeriodSelect-ClMxvzvw.js} +1 -1
- package/storybook-static/assets/{PeriodSelect-DffBuv6v.js → PeriodSelect-iGcNtPrN.js} +1 -1
- package/storybook-static/assets/{PeriodSelect.stories-Boq-fBL8.js → PeriodSelect.stories-LNVQiPZe.js} +1 -1
- package/storybook-static/assets/{PickerField-fMVQUcBX.js → PickerField-BEMDq9NM.js} +1 -1
- package/storybook-static/assets/{PickerTriggerActions-zS0JUD-3.js → PickerTriggerActions-D6nW7xw5.js} +1 -1
- package/storybook-static/assets/{Popover-5c_n39x0.js → Popover-BTz7W53N.js} +1 -1
- package/storybook-static/assets/{Popover-u02JbpuP.js → Popover-C-MzjE4n.js} +1 -1
- package/storybook-static/assets/{Popover.stories-BUVgJJQI.js → Popover.stories-CI98uwbF.js} +1 -1
- package/storybook-static/assets/{PresetRangeDateInput-TyV-u0Db.js → PresetRangeDateInput-CA4KuCnV.js} +1 -1
- package/storybook-static/assets/{PresetRangeDateInput-EiaEd6Qp.js → PresetRangeDateInput-DPfbbRXi.js} +1 -1
- package/storybook-static/assets/{PresetRangeDateInput.stories-jJq5Gkdb.js → PresetRangeDateInput.stories-D5HMDaN8.js} +1 -1
- package/storybook-static/assets/{PresetSelect-Cnl_fXjS.js → PresetSelect-CBFkq_MZ.js} +1 -1
- package/storybook-static/assets/{README-DT4BWDzj.js → README--OEk0Qmq.js} +14 -8
- package/storybook-static/assets/{README-B7f6XRLa.js → README-B6KY4Oml.js} +1 -1
- package/storybook-static/assets/{README-tDgobAYS.js → README-B72Uf36c.js} +1 -1
- package/storybook-static/assets/{README-W30_dPSQ.js → README-BRKPiLo6.js} +1 -1
- package/storybook-static/assets/{README-B-z6znlC.js → README-BY1Kg6xN.js} +1 -1
- package/storybook-static/assets/{README-CZaKBu1r.js → README-BZRJIzio.js} +1 -1
- package/storybook-static/assets/{README-BPWr_0XE.js → README-BaHSujqA.js} +1 -1
- package/storybook-static/assets/{README-BgbmWbpJ.js → README-Bc8GTovB.js} +1 -1
- package/storybook-static/assets/{README-WtLMdn_H.js → README-BdyEui6q.js} +1 -1
- package/storybook-static/assets/{README-CqCDXjY-.js → README-BhCbRil6.js} +1 -1
- package/storybook-static/assets/{README-CoofcGyA.js → README-BiowDKRn.js} +1 -1
- package/storybook-static/assets/{README-bJALHbSR.js → README-BtmHHjrx.js} +1 -1
- package/storybook-static/assets/{README-BsHrwATK.js → README-By8-yszE.js} +1 -1
- package/storybook-static/assets/{README-10_nKrEg.js → README-CE7L7eIW.js} +1 -1
- package/storybook-static/assets/{README-7mbN7jNm.js → README-CJOB-kej.js} +1 -1
- package/storybook-static/assets/{README-BGEviJbA.js → README-CPUclLXO.js} +1 -1
- package/storybook-static/assets/{README-g4l3WFXZ.js → README-CQimRT6Y.js} +1 -1
- package/storybook-static/assets/{README-CO0Anr1W.js → README-CRovKmdk.js} +1 -1
- package/storybook-static/assets/{README-DZKQ2NbJ.js → README-CT2RZVHo.js} +1 -1
- package/storybook-static/assets/{README-DBqb3xHL.js → README-CU0zq6IL.js} +1 -1
- package/storybook-static/assets/{README-By7MmJad.js → README-CUuFCVw8.js} +1 -1
- package/storybook-static/assets/{README-DB3HzmYa.js → README-CsZoOp9e.js} +1 -1
- package/storybook-static/assets/{README-8vaqVs2t.js → README-CtjmyPW7.js} +1 -1
- package/storybook-static/assets/{README-BylyIJ4z.js → README-CtvayE8p.js} +1 -1
- package/storybook-static/assets/{README-AbbeH5rC.js → README-CuWuOeTb.js} +1 -1
- package/storybook-static/assets/{README-BfF9g6q6.js → README-Cy5W56vi.js} +1 -1
- package/storybook-static/assets/{README-E09CwLzJ.js → README-D1jzSNUb.js} +1 -1
- package/storybook-static/assets/{README-Cc5RUdsX.js → README-D3_68wtX.js} +1 -1
- package/storybook-static/assets/{README-BWiCGCpy.js → README-D74YjDJd.js} +1 -1
- package/storybook-static/assets/{README-e3Zi9n04.js → README-D8rLYV25.js} +1 -1
- package/storybook-static/assets/{README-DXzLMFnF.js → README-DE0GwuA6.js} +1 -1
- package/storybook-static/assets/{README-q6R_bF6h.js → README-DGWMICIa.js} +1 -1
- package/storybook-static/assets/{README-6n5fAnyG.js → README-DZA9maG5.js} +1 -1
- package/storybook-static/assets/{README-ByxHEXaq.js → README-Da6Nl1Ll.js} +1 -1
- package/storybook-static/assets/{README-CqMgUXym.js → README-DbhmYFzX.js} +1 -1
- package/storybook-static/assets/{README-CXhBUq08.js → README-DcUxIvbg.js} +1 -1
- package/storybook-static/assets/{README-DsqwQGJx.js → README-DeBp5e_z.js} +1 -1
- package/storybook-static/assets/{README-DLGk_zi3.js → README-DiX-h2b0.js} +1 -1
- package/storybook-static/assets/{README-B-K2UPpo.js → README-DiXrdaJ_.js} +1 -1
- package/storybook-static/assets/{README-Bn7SBLqL.js → README-Dr92oepc.js} +1 -1
- package/storybook-static/assets/{README-BoXMNqUS.js → README-HMss6sQH.js} +1 -1
- package/storybook-static/assets/{README-B6uVB1ib.js → README-IU1lQ3yM.js} +1 -1
- package/storybook-static/assets/{README-DyhDd6j2.js → README-KCCeREhX.js} +1 -1
- package/storybook-static/assets/{README-8qj7XGDa.js → README-KN1rC4P4.js} +6 -3
- package/storybook-static/assets/{README-BoZbB8t8.js → README-NVT3zwjJ.js} +1 -1
- package/storybook-static/assets/{README-DnIK-CvZ.js → README-O4Hp1X2l.js} +1 -1
- package/storybook-static/assets/{README-_UuZJvdY.js → README-PFHdcB2Q.js} +1 -1
- package/storybook-static/assets/{README-DKMzvCHg.js → README-bsNRkuj0.js} +1 -1
- package/storybook-static/assets/{README-CZBT22Qx.js → README-eAQUctyx.js} +1 -1
- package/storybook-static/assets/{README-jb10Ekr5.js → README-iF6KmOih.js} +1 -1
- package/storybook-static/assets/{README-CmCyESsg.js → README-vfpe_LWh.js} +1 -1
- package/storybook-static/assets/{README-CXlUZ-Tw.js → README-xRzBwPsx.js} +1 -1
- package/storybook-static/assets/{README-DsEaeYrz.js → README-xnGLJkj-.js} +1 -1
- package/storybook-static/assets/{RadioButton-DGjO61a9.js → RadioButton-4iBITH-x.js} +1 -1
- package/storybook-static/assets/{RadioButton-j3O4woG8.js → RadioButton-QWhy6_MB.js} +1 -1
- package/storybook-static/assets/{RadioButton.stories-COGMYQcq.js → RadioButton.stories-1zA_8wcS.js} +1 -1
- package/storybook-static/assets/{RadioGroup-Cuj2D_RZ.js → RadioGroup-BSIdg5x1.js} +1 -1
- package/storybook-static/assets/{RadioGroup-D9samx7D.js → RadioGroup-CN92lZlY.js} +1 -1
- package/storybook-static/assets/{RadioGroup.stories-KSDvpgqY.js → RadioGroup.stories-JC6Z3CpL.js} +1 -1
- package/storybook-static/assets/{Scrollable-tPrIOchd.js → Scrollable-DbBJQWBv.js} +1 -1
- package/storybook-static/assets/{Scrollable-DsOw--4y.js → Scrollable-SCMKAvuD.js} +1 -1
- package/storybook-static/assets/{Scrollable.stories-B7d_6eGB.js → Scrollable.stories-CawNbs8Y.js} +1 -1
- package/storybook-static/assets/{Select-D0CHiGkz.js → Select-BHTlNaX3.js} +1 -1
- package/storybook-static/assets/{Select-h0tWQbii.js → Select-D_kHX5a5.js} +1 -1
- package/storybook-static/assets/{Select.stories-GmGbpUoi.js → Select.stories-DcY5-Hlt.js} +1 -1
- package/storybook-static/assets/{Separator-Dh8kzf-5.js → Separator-BWje1Oue.js} +1 -1
- package/storybook-static/assets/{Separator-C8aQcNns.js → Separator-DOk-N_yT.js} +1 -1
- package/storybook-static/assets/{Separator.stories-nQ9bDdo1.js → Separator.stories-DT-_4yle.js} +1 -1
- package/storybook-static/assets/{SerializableSelect-BJAxQ8an.js → SerializableSelect-Cg-gWCzu.js} +1 -1
- package/storybook-static/assets/{SerializableSelect.stories-CzVCg1_7.js → SerializableSelect.stories-DAg_4E3g.js} +1 -1
- package/storybook-static/assets/{ShimmerText-DnEOvvJA.js → ShimmerText-h0A5FdJn.js} +1 -1
- package/storybook-static/assets/{ShimmerText.stories-D2XRPcMC.js → ShimmerText.stories-MnbWai5o.js} +1 -1
- package/storybook-static/assets/{SingleDateTimeInput-DwY38Bzb.js → SingleDateTimeInput-CqPmAWWa.js} +1 -1
- package/storybook-static/assets/{SingleDateTimeInput-Bwn8kqI3.js → SingleDateTimeInput-DOqiD7di.js} +1 -1
- package/storybook-static/assets/{SingleDateTimeInput.stories-DKq1_AqA.js → SingleDateTimeInput.stories-C-uI6_Du.js} +1 -1
- package/storybook-static/assets/{Slider-KiXLZUpw.js → Slider-Djs-5-SX.js} +1 -1
- package/storybook-static/assets/{Slider-CT0jMXMY.js → Slider-p_L-JzII.js} +1 -1
- package/storybook-static/assets/{Slider.stories-Cmcm8HlR.js → Slider.stories-fhuweHOJ.js} +1 -1
- package/storybook-static/assets/{SliderInput-Unp3YEcU.js → SliderInput-CIVj_06t.js} +1 -1
- package/storybook-static/assets/{SliderInput-Dd_yvyMG.js → SliderInput-nagryhRL.js} +1 -1
- package/storybook-static/assets/{SliderInput.stories-C0MwvTOV.js → SliderInput.stories-BLikqr-O.js} +1 -1
- package/storybook-static/assets/{Sortable-CnCowZw-.js → Sortable-D0KOh-TL.js} +1 -1
- package/storybook-static/assets/{Sortable.stories-DCrIurAg.js → Sortable.stories-BGdtffqB.js} +1 -1
- package/storybook-static/assets/{Splitter-BErks2lB.js → Splitter-BsvN-OLk.js} +1 -1
- package/storybook-static/assets/{Splitter.stories-DyRlCVUo.js → Splitter.stories-cuiQiJ7g.js} +1 -1
- package/storybook-static/assets/{StateSelect-DuVzqi0t.js → StateSelect-B29YeAsu.js} +1 -1
- package/storybook-static/assets/{StateSelect-DXfsbduM.js → StateSelect-Dbu1AJzp.js} +1 -1
- package/storybook-static/assets/{StateSelect.stories-CnIXqGFB.js → StateSelect.stories-ChvBFaM2.js} +1 -1
- package/storybook-static/assets/{StatusIndicator-Bz3JF899.js → StatusIndicator-CsQ0EPOR.js} +1 -1
- package/storybook-static/assets/{StatusIndicator.stories-B5RMchH3.js → StatusIndicator.stories-CanvyqtM.js} +1 -1
- package/storybook-static/assets/{StringToggle.stories-CcR8KHGF.js → StringToggle.stories-D-btA7Hm.js} +1 -1
- package/storybook-static/assets/{Switch-Bo-dd4nL.js → Switch-C2aUtr7H.js} +1 -1
- package/storybook-static/assets/{Switch-a7GMbDn9.js → Switch-DeDHWbqw.js} +1 -1
- package/storybook-static/assets/{Switch.stories-B9c9CAmZ.js → Switch.stories-BcNfmPSy.js} +1 -1
- package/storybook-static/assets/{Table-BgmEmcbL.js → Table-D9AgOQn3.js} +1 -1
- package/storybook-static/assets/{Table.stories-BByDPmdZ.js → Table.stories-Czm2C6Rx.js} +1 -1
- package/storybook-static/assets/{TableEditor.stories-DJi7VPcY.js → TableEditor.stories-CXR7o59m.js} +1 -1
- package/storybook-static/assets/{Tabs-CV1ykDlt.js → Tabs-sOp2l3XO.js} +1 -1
- package/storybook-static/assets/{Tabs.stories-DOyJdrcR.js → Tabs.stories-YkP11K26.js} +1 -1
- package/storybook-static/assets/TabsBox-Cd3niafB.css +1 -0
- package/storybook-static/assets/TabsBox-CfOR1G6c.js +2 -0
- package/storybook-static/assets/{TagInput-j4mVWIf0.js → TagInput-C_yNW134.js} +1 -1
- package/storybook-static/assets/{TagInput.stories-DSU97IRU.js → TagInput.stories-D4vh6Kh3.js} +1 -1
- package/storybook-static/assets/{Text-COGTV38X.js → Text-IQqUM-6S.js} +1 -1
- package/storybook-static/assets/{Textarea-Byqjr2Ve.js → Textarea-B50-dJyP.js} +1 -1
- package/storybook-static/assets/{Textarea-BcgmS9aD.js → Textarea-CQ9_SeR-.js} +1 -1
- package/storybook-static/assets/{Textarea.stories-D1gXsWxK.js → Textarea.stories-CpEKjfqY.js} +1 -1
- package/storybook-static/assets/{TimePanel-DzFFLXJP.js → TimePanel-CaX_CWTW.js} +1 -1
- package/storybook-static/assets/{TimePanel.stories-287q5ipF.js → TimePanel.stories-BHKIw5mZ.js} +1 -1
- package/storybook-static/assets/{Toggle-KtpVC-vX.js → Toggle-ADeGxXl0.js} +1 -1
- package/storybook-static/assets/{Toggle-CCkzi_xC.js → Toggle-njM2fKQc.js} +1 -1
- package/storybook-static/assets/{Toggle.stories-BLKa6Zst.js → Toggle.stories-DDWsGMoy.js} +1 -1
- package/storybook-static/assets/{TreeMultiSelect-sYAglJIC.js → TreeMultiSelect-DY7zN0tt.js} +1 -1
- package/storybook-static/assets/{TreeMultiSelect-CbnCiXFa.js → TreeMultiSelect-Z4AV1Wgg.js} +1 -1
- package/storybook-static/assets/{TreeMultiSelect.stories-DGw_tJQ5.js → TreeMultiSelect.stories-BhkFA2S-.js} +1 -1
- package/storybook-static/assets/{TreePickerBase-wz0-Y-eg.js → TreePickerBase-DRCzJjx6.js} +1 -1
- package/storybook-static/assets/{TreeSelect-BJ6C_2pM.js → TreeSelect-DQADRaC3.js} +1 -1
- package/storybook-static/assets/{TreeSelect-BCOJNrl1.js → TreeSelect-q5pDp_Os.js} +1 -1
- package/storybook-static/assets/{TreeSelect.stories-DKdmUNAI.js → TreeSelect.stories-yLxVaaSY.js} +1 -1
- package/storybook-static/assets/{TreeTable-DIRsmeC8.js → TreeTable-BeZoDjBE.js} +1 -1
- package/storybook-static/assets/{TreeTable.stories-BfqeLJU6.js → TreeTable.stories-B2u51xrR.js} +1 -1
- package/storybook-static/assets/{blocks-r6nP1Mk3.js → blocks-D29TdvdI.js} +3 -3
- package/storybook-static/assets/{check-CX66-EtS.js → check-B9kjGnTr.js} +1 -1
- package/storybook-static/assets/{chevron-down-BpTVPmXw.js → chevron-down-D0ncXJ67.js} +1 -1
- package/storybook-static/assets/{chevron-left-BDyvowID.js → chevron-left-CGtvJ_7j.js} +1 -1
- package/storybook-static/assets/{chevron-right-PitONC71.js → chevron-right-1d8Q7foW.js} +1 -1
- package/storybook-static/assets/{chunk-W22LQPXL-Bd54JRSO.js → chunk-W22LQPXL-KzPuU6n9.js} +1 -1
- package/storybook-static/assets/{circle-alert-BxfK632o.js → circle-alert-Dbad7hvh.js} +1 -1
- package/storybook-static/assets/{circle-check-CQ0mrCVh.js → circle-check-DvnBN33e.js} +1 -1
- package/storybook-static/assets/{components-CJIwocXl.js → components-Pq5w8We2.js} +3 -3
- package/storybook-static/assets/{contextMenu-BodN1HdA.js → contextMenu-ChSRpnE7.js} +1 -1
- package/storybook-static/assets/{dom-DBd_DWF8.js → dom-D9_dPJ4G.js} +1 -1
- package/storybook-static/assets/{download-C_lZf2f4.js → download-Dt_hINTs.js} +1 -1
- package/storybook-static/assets/{floating-ui.react-BzwQR5CG.js → floating-ui.react-CFUzDHMb.js} +1 -1
- package/storybook-static/assets/{foundationApi-BgE0geET.js → foundationApi-DHs4bOpI.js} +1 -1
- package/storybook-static/assets/{foundationLib-6nKeXUFS.js → foundationLib-D1fm6WoY.js} +1 -1
- package/storybook-static/assets/{hooks-DDySZJGR.js → hooks-DrbZUNnJ.js} +1 -1
- package/storybook-static/assets/{iframe-B9PXVErw.js → iframe-CizMDlW9.js} +3 -3
- package/storybook-static/assets/iframe-CrGqOhca.js +1 -0
- package/storybook-static/assets/{info-rdW9neC9.js → info-Cjey-oKN.js} +1 -1
- package/storybook-static/assets/{odata-D6cOAxLt.js → odata-BEQC_wjB.js} +1 -1
- package/storybook-static/assets/{odataStoryFixtures-CGQ31IO_.js → odataStoryFixtures-CmSF4OYc.js} +1 -1
- package/storybook-static/assets/{react-BMktiE65.js → react-DlE-cCYf.js} +1 -1
- package/storybook-static/assets/{refresh-cw-CfKvrc1N.js → refresh-cw-6kuFzwuj.js} +1 -1
- package/storybook-static/assets/{settings-2-Drz-L5J9.js → settings-2-Dp2kvtlU.js} +1 -1
- package/storybook-static/assets/{sortable-BMuu2DRC.js → sortable-YgZpYlFI.js} +1 -1
- package/storybook-static/assets/{syntaxhighlighter-QEQV7K2Y-eBmofw1l.js → syntaxhighlighter-QEQV7K2Y-Bgf_-1Oe.js} +1 -1
- package/storybook-static/assets/{trash-2-DEbF1hh6.js → trash-2-CPnjzHnW.js} +1 -1
- package/storybook-static/assets/{triangle-alert--nwD_1ZX.js → triangle-alert-ELZCks0j.js} +1 -1
- package/storybook-static/assets/{useODataSelectBase-DSOGiMIw.js → useODataSelectBase-C_9p8iq2.js} +1 -1
- package/storybook-static/assets/{useODataTreeData-Cn_XaKz_.js → useODataTreeData-X3d38mxf.js} +1 -1
- package/storybook-static/assets/{usePickerQuery-B5ZZQg8g.js → usePickerQuery-Dn0Nghs1.js} +1 -1
- package/storybook-static/assets/{usePickerTriggerController-Cqy5IfOJ.js → usePickerTriggerController-BBzr2WZB.js} +1 -1
- package/storybook-static/assets/{x-DSHJbBBz.js → x-Buig9MSV.js} +1 -1
- package/storybook-static/iframe.html +2 -2
- package/storybook-static/project.json +1 -1
- package/storybook-static/assets/NotificationsHost.stories-BYmVl44l.js +0 -29
- package/storybook-static/assets/TabsBox-DuBKU62M.css +0 -1
- package/storybook-static/assets/TabsBox-n38x7_yO.js +0 -2
- package/storybook-static/assets/iframe-f5g4GUQw.js +0 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{a as e,n as t}from"./rolldown-runtime-DkW27tQK.js";import{t as n}from"./react-BZJXY1be.js";import{n as r,t as i}from"./Switch-a7GMbDn9.js";import{i as a,n as o,r as s,t as ee}from"./DisclosureGroup-Codiur77.js";import{n as c,t as te}from"./ExpandableActionPanel-6u6YJanI.js";import{n as ne,t as l}from"./RadioButton-j3O4woG8.js";import{n as u,t as re}from"./SingleDateTimeInput-DwY38Bzb.js";import{n as d,t as f}from"./CheckBox-BId2Zf_m.js";import{n as p,t as ie}from"./DropZone-D4rl2WEV.js";import{n as m}from"./iframe-B9PXVErw.js";import{n as ae,t as h}from"./Text-COGTV38X.js";import{n as g,t as _}from"./Popover-u02JbpuP.js";import{i as oe,n as se,r as v,t as ce}from"./BadgeList-8NyPAV2Q.js";import{n as y,t as b}from"./Button-X3OT5zE7.js";import{a as x,n as le,r as ue,t as de}from"./Modal-DrSX0i3a.js";import{n as fe,t as pe}from"./GridContainer-B82Onj6x.js";import{n as me,t as he}from"./ModalManagerProvider-B0Lf7xX0.js";import{n as ge,t as S}from"./ContextMenu-Byksyz_8.js";import{a as C,l as w,o as T,t as E}from"./Input-D8uMye_9.js";import{n as D,t as O}from"./DropdownMenu-BcdS3oNz.js";import{n as _e,r as ve}from"./DateInput-CgETMk9B.js";import{n as ye,t as k}from"./RadioGroup-D9samx7D.js";import{n as A,t as j}from"./Select-D0CHiGkz.js";import{n as M,t as be}from"./DateRangePresetSelect-CxrNYBTe.js";import{n as xe,t as Se}from"./Dialog-DNTx5Unm.js";import{n as Ce,t as we}from"./InputFiles-CF60S_qG.js";import{n as Te,t as Ee}from"./InputFile-BbPjLN4E.js";import{n as De,t as Oe}from"./InputImage-Aq_ZXmtw.js";import{n as ke,t as Ae}from"./LayoutPicker-BehxFQsU.js";import{n as je,t as Me}from"./Listbox-Bn_6WyQc.js";import{n as Ne,t as Pe}from"./MultiSelect-Bw3qf8eW.js";import{n as Fe,t as Ie}from"./PeriodSelect-Bo_B6jdw.js";import{n as Le,t as Re}from"./PresetRangeDateInput-TyV-u0Db.js";import{i as ze,r as Be,t as Ve}from"./Slider-KiXLZUpw.js";import{n as N,r as He,t as Ue}from"./SliderInput-Dd_yvyMG.js";import{n as We,t as Ge}from"./StateSelect-DXfsbduM.js";import{n as Ke,t as P}from"./TabsBox-n38x7_yO.js";import{n as qe,t as Je}from"./TagInput-j4mVWIf0.js";import{n as F,t as Ye}from"./Textarea-Byqjr2Ve.js";import{n as I,t as Xe}from"./Toggle-KtpVC-vX.js";import{n as Ze,t as L}from"./TreeMultiSelect-CbnCiXFa.js";import{n as Qe,t as $e}from"./treeStoryFixtures-DXHh9GL3.js";function et({onChange:e,...t}){let[n,r]=(0,R.useState)(()=>t.defaultValue??t.value??``),[i,a]=(0,R.useState)(()=>t.defaultValue??t.value??``),o=t=>{let n=t.trim();n!==i&&(a(n),e(n))},s=()=>{r(``),a(``),e(``)},ee=e=>{e.key===`Enter`&&(e.preventDefault(),o(n))},c=()=>{o(n)},te=e=>{r(e)};return(0,z.jsx)(E,{...t,value:n,onChange:te,onKeyDown:ee,onBlur:c,onClear:s})}var R,z;function B(){return(B=t((()=>{R=e(n(),1),w(),z=m(),et.__docgenInfo={description:``,methods:[],displayName:`InputSearch`,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:`T`},description:"Если начальное состояние может быть `null | undefined`\nзначит `onChange` тоже должен ументь сбрасывать.\nПоэтому такой контрол явно должен передавать `UiBaseProps<AnyType | undefined>`"},onChange:{required:!0,tsType:{name:`signature`,type:`function`,raw:`(value: string) => void`,signature:{arguments:[{type:{name:`string`},name:`value`}],return:{name:`void`}}},description:``},onClear:{required:!1,tsType:{name:`signature`,type:`function`,raw:`() => void`,signature:{arguments:[],return:{name:`void`}}},description:``},error:{required:!1,tsType:{name:`string`},description:``},onClearError:{required:!1,tsType:{name:`signature`,type:`function`,raw:`() => void`,signature:{arguments:[],return:{name:`void`}}},description:``},defaultValue:{required:!1,tsType:{name:`string`},description:``},endAdornment:{required:!1,tsType:{name:`ReactNode`},description:``},endAdornmentClassName:{required:!1,tsType:{name:`string`},description:``},endAdornmentWidth:{required:!1,tsType:{name:`string`},description:``}},composes:[`Omit`]}})))()}function V({title:e,children:t}){return(0,W.jsxs)(`section`,{style:G,children:[(0,W.jsx)(`div`,{style:K,children:e}),t]})}function tt({initialValue:e={},label:t=`TreeMultiSelect`,description:n,optionsLayout:r=`tree`,nodes:i=$e,defaultExpandedCodeKeys:a}){let[o,s]=(0,U.useState)(e);return(0,W.jsxs)(`div`,{style:{display:`grid`,gap:12,maxWidth:520},children:[(0,W.jsx)(L,{label:t,description:n,nodes:i,value:o,onChange:s,optionsLayout:r,defaultExpandedCodeKeys:a}),(0,W.jsxs)(`div`,{style:{fontSize:`var(--font-size-sm)`,color:`var(--content-1)`},children:[`Текущее значение: `,JSON.stringify(o)]})]})}function H(){let[e,t]=(0,U.useState)(`Значение`),[n,r]=(0,U.useState)(42),[a,o]=(0,U.useState)(``),[c,ne]=(0,U.useState)(`Комментарий`),[u,d]=(0,U.useState)(!0),[p,m]=(0,U.useState)(!1),[ae,g]=(0,U.useState)(`first`),[oe,se]=(0,U.useState)(!0),[y,x]=(0,U.useState)(!1),[fe,me]=(0,U.useState)(3),[ge,w]=(0,U.useState)(),[E,D]=(0,U.useState)([0,0]),[ve,ye]=(0,U.useState)(60),[A,M]=(0,U.useState)(J[0]),[xe,Ce]=(0,U.useState)([Y[0]]),[Te,De]=(0,U.useState)([`UI`,`Стили`]),[ke,je]=(0,U.useState)(`week`),[Ne,Fe]=(0,U.useState)(`information`),[Le,ze]=(0,U.useState)(`two-columns`),[He,We]=(0,U.useState)(new Date(2026,2,10)),[Ke,qe]=(0,U.useState)(new Date(2026,2,10,10,30)),[F,I]=(0,U.useState)(`today`),[Ze,L]=(0,U.useState)([new Date(2026,2,1),new Date(2026,2,10)]),[Qe,$e]=(0,U.useState)(`month`),[R,z]=(0,U.useState)(),[B,H]=(0,U.useState)([]),[G,K]=(0,U.useState)(),[X,Z]=(0,U.useState)([]),[at,Q]=(0,U.useState)(!1),[ot,$]=(0,U.useState)(!1),[st,ct]=(0,U.useState)();return(0,W.jsxs)(`div`,{style:nt,children:[(0,W.jsxs)(V,{title:`Text`,children:[(0,W.jsx)(h,{color:`primary`,children:`Основной`}),(0,W.jsx)(h,{color:`secondary`,children:`Дополнительный`}),(0,W.jsx)(h,{color:`muted`,children:`Приглушенный`}),(0,W.jsx)(h,{color:`accent`,children:`Акцентированный`}),(0,W.jsx)(h,{color:`brand`,children:`Брендовый`}),(0,W.jsx)(h,{color:`info`,children:`Информация`}),(0,W.jsx)(h,{color:`success`,children:`Успешно`}),(0,W.jsx)(h,{color:`warning`,children:`Предупреждение`}),(0,W.jsx)(h,{color:`error`,children:`Ошибка`})]}),(0,W.jsx)(V,{title:`Badge`,children:(0,W.jsxs)(ce,{children:[(0,W.jsx)(v,{tone:`neutral`,appearance:`outline`,children:`Neutral`}),(0,W.jsx)(v,{tone:`success`,appearance:`solid`,children:`Успешно`}),(0,W.jsx)(v,{tone:`warning`,appearance:`solid`,children:`Внимание`}),(0,W.jsx)(v,{tone:`error`,appearance:`solid`,children:`Ошибка`}),(0,W.jsx)(v,{tone:`info`,appearance:`solid`,children:`Информация`})]})}),(0,W.jsx)(V,{title:`Button`,children:(0,W.jsxs)(pe,{gap:`sm`,templateColumns:`1fr 1fr`,children:[(0,W.jsx)(b,{variant:`transparent`,children:`Действие`}),(0,W.jsx)(b,{variant:`ghost`,children:`Действие`}),(0,W.jsx)(b,{variant:`neutralOutline`,children:`Действие`}),(0,W.jsx)(b,{variant:`infoOutline`,children:`Действие`}),(0,W.jsx)(b,{variant:`successOutline`,children:`Действие`}),(0,W.jsx)(b,{variant:`warningOutline`,children:`Действие`}),(0,W.jsx)(b,{variant:`errorOutline`,children:`Действие`}),(0,W.jsx)(b,{variant:`neutral`,children:`Действие`}),(0,W.jsx)(b,{variant:`info`,children:`Действие`}),(0,W.jsx)(b,{variant:`success`,children:`Действие`}),(0,W.jsx)(b,{variant:`warning`,children:`Действие`}),(0,W.jsx)(b,{variant:`error`,children:`Действие`})]})}),(0,W.jsxs)(V,{title:`InputText`,children:[(0,W.jsx)(T,{label:`Текст`,description:`Поле ввода текста`,placeholder:`Введите текст`,disabled:!0,value:e,onChange:t}),(0,W.jsx)(T,{label:`Текст`,description:`Поле ввода текста`,placeholder:`Введите текст`,value:e,onChange:t}),(0,W.jsx)(T,{required:!0,label:`Текст`,description:`Поле ввода текста`,placeholder:`Введите текст`,value:e,onChange:t,onClear:()=>t(``)})]}),(0,W.jsxs)(V,{title:`InputNumber`,children:[(0,W.jsx)(C,{label:`Количество`,description:`Поле ввода числа`,placeholder:`Введите число`,value:n,min:0,onChange:r,disabled:!0}),(0,W.jsx)(C,{label:`Количество`,description:`Поле ввода числа`,placeholder:`Введите число`,value:n,min:0,onChange:r,required:!0}),(0,W.jsx)(C,{label:`Количество`,description:`Поле ввода числа`,placeholder:`Введите число`,value:n,min:0,onChange:r}),(0,W.jsx)(C,{label:`Количество`,description:`Поле ввода числа`,placeholder:`Введите число`,value:n,min:0,onChange:r,onClear:()=>r(void 0)})]}),(0,W.jsx)(V,{title:`InputSearch`,children:(0,W.jsx)(et,{label:`Поиск`,placeholder:`Найти`,value:a,onChange:o})}),(0,W.jsx)(V,{title:`Textarea`,children:(0,W.jsx)(Ye,{label:`Комментарий`,required:!0,placeholder:`Многострочный комментарий`,rows:6,value:c,onChange:ne})}),(0,W.jsxs)(V,{title:`CheckBox`,children:[(0,W.jsx)(f,{label:`Опция`,description:`Описание чекбокса`,disabled:!0,value:u,onChange:d}),(0,W.jsx)(f,{label:`Опция`,description:`Описание чекбокса`,value:u,onChange:d}),(0,W.jsx)(f,{label:`Опция`,description:`Описание чекбокса`,value:u,onChange:d,indeterminate:!0})]}),(0,W.jsxs)(V,{title:`RadioButton`,children:[(0,W.jsx)(l,{label:`Опция`,description:`Описание радиокнопки`,disabled:!0,value:p,onChange:m}),(0,W.jsx)(l,{label:`Опция`,description:`Описание радиокнопки`,name:`radio-1`,value:p,onChange:m}),(0,W.jsx)(l,{label:`Опция`,description:`Описание радиокнопки`,name:`radio-1`,value:p,onChange:m})]}),(0,W.jsxs)(V,{title:`RadioGroup`,children:[(0,W.jsxs)(k,{label:`Радио группа`,description:`Вертикальная группа`,value:ae,onChange:g,orientation:`vertical`,"aria-label":`Вариант`,children:[(0,W.jsx)(k.Option,{value:`first`,label:`Первый`}),(0,W.jsx)(k.Option,{value:`second`,label:`Второй`}),(0,W.jsx)(k.Option,{value:`third`,label:`Третий`,description:`Новая опциональная опция`})]}),(0,W.jsxs)(k,{label:`Радио группа`,description:`Горизонтальная группа`,value:ae,onChange:g,orientation:`horizontal`,"aria-label":`Вариант`,children:[(0,W.jsx)(k.Option,{value:`first`,label:`Первый`}),(0,W.jsx)(k.Option,{value:`second`,label:`Второй`}),(0,W.jsx)(k.Option,{value:`third`,label:`Третий`,description:`Новая опциональная опция`})]})]}),(0,W.jsx)(V,{title:`Switch`,children:(0,W.jsx)(i,{label:`Уведомления`,description:`Устаревный компонент`,value:oe,onChange:se})}),(0,W.jsxs)(V,{title:`Toggle`,children:[(0,W.jsx)(Xe,{label:`Режим`,description:`Переключатель состояния`,value:y,onChange:x,checkedText:`Вкл`,uncheckedText:`Выкл`}),(0,W.jsx)(Xe,{label:`Режим`,description:`Переключатель состояния`,labelPosition:`after`,value:y,onChange:x,checkedText:`Вкл`,uncheckedText:`Выкл`})]}),(0,W.jsxs)(V,{title:`Slider`,children:[(0,W.jsx)(Ve,{label:`Уровень`,description:`Простой слайдер`,value:fe,min:0,max:100,onChange:me}),(0,W.jsx)(Ve,{label:`Уровень`,description:`Простой слайдер`,disabled:!0,marks:[{value:1,label:`m1`},{value:2,label:`m2`},{value:3,label:`m3`},{value:4,label:`m4`},{value:5,label:`m5`},{value:6,label:`m6`}],marksPosition:`index`,value:fe,min:0,max:100,onChange:me}),(0,W.jsx)(Be,{label:`Уровень`,description:`Диапазон`,marks:[{value:0,label:`m1`},{value:1,label:`m2`},{value:2,label:`m3`},{value:3,label:`m4`}],marksPosition:`index`,value:ge,min:0,max:100,onChange:w})]}),(0,W.jsxs)(V,{title:`SliderInput`,children:[(0,W.jsx)(Ue,{label:`Порог`,value:ve,min:0,max:100,onChange:ye}),(0,W.jsx)(N,{label:`Порог`,value:E,onChange:D,min:0,max:100,marks:[{value:0,label:`0`},{value:20,label:`20`},{value:40,label:`40`},{value:60,label:`60`},{value:80,label:`80`},{value:100,label:`100`}]}),(0,W.jsx)(N,{label:`Срок: открытые границы и дни в фильтре`,description:"Крайние marks отдают null, обычные marks отдают дни через `outputValue`.",min:0,max:25,marks:[{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:`1г.`,outputValue:360},{value:18,label:`1.5г.`,outputValue:540},{value:24,label:`2г.`,outputValue:720},{value:25,label:`-`,outputValue:null}],value:E,onChange:D}),(0,W.jsx)(N,{label:`Срок текстом`,description:`В поле выводится готовый текст по marks, а изменение через popover коммитится при закрытии.`,placeholder:`Любой срок`,readonlyValueText:!0,min:0,max:25,marks:[{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:`1г.`,outputValue:360},{value:18,label:`1.5г.`,outputValue:540},{value:24,label:`2г.`,outputValue:720},{value:25,label:`-`,outputValue:null}],marksPosition:`index`,value:E,onChange:D})]}),(0,W.jsxs)(V,{title:`Select`,children:[(0,W.jsx)(j,{label:`Статус`,description:`searchable`,searchable:!0,options:J,value:A,onChange:M,getOptionKey:e=>e.id,getOptionLabel:e=>e.label}),(0,W.jsx)(j,{label:`Статус`,description:`disabled`,disabled:!0,options:J,value:A,onChange:M,getOptionKey:e=>e.id,getOptionLabel:e=>e.label}),(0,W.jsx)(j,{label:`Статус`,description:`Пример использования низкоуровневого Select со строковыми значениями.`,placeholder:`Выберите статус`,options:J,value:A,onChange:M,getOptionKey:e=>e.id,getOptionLabel:e=>e.label}),(0,W.jsx)(j,{label:`Подразделение`,description:`Выберите подразделение из списка.`,placeholder:`Не выбрано`,options:it,value:st,onChange:ct,getOptionKey:e=>e.id,getOptionLabel:e=>e.name,getOptionCode:e=>e.code,getOptionDisabled:e=>e.disabled??!1,getOptionGroup:e=>({key:e.direction,label:e.direction}),optionsMaxWidth:`40em`})]}),(0,W.jsx)(V,{title:`MultiSelect`,children:(0,W.jsx)(Pe,{label:`Города`,items:Y,value:xe,query:``,codeKey:`code`,textKey:`label`,onChange:Ce,onQuery:()=>void 0,onOpen:()=>void 0,onClose:()=>void 0})}),(0,W.jsx)(V,{title:`TreeMultiSelect`,children:(0,W.jsx)(tt,{})}),(0,W.jsx)(V,{title:`TagInput`,children:(0,W.jsx)(Je,{label:`Теги`,placeholder:`Добавить`,value:Te,onChange:De})}),(0,W.jsx)(V,{title:`Listbox`,children:(0,W.jsx)(Me,{options:rt,value:ke,onChange:e=>je(e)})}),(0,W.jsx)(V,{title:`StateSelect`,children:(0,W.jsx)(Ge,{label:`Состояние`,value:Ne,onChange:Fe})}),(0,W.jsx)(V,{title:`LayoutPicker`,children:(0,W.jsx)(Ae,{label:`Раскладка`,value:Le,onChange:ze,showPlaceholder:!0})}),(0,W.jsx)(V,{title:`SingleDateInput`,children:(0,W.jsx)(_e,{label:`Дата`,value:He,onChange:We,selectionMode:`week`})}),(0,W.jsx)(V,{title:`SingleDateTimeInput`,children:(0,W.jsx)(re,{label:`Дата и время`,value:Ke,onChange:qe})}),(0,W.jsx)(V,{title:`DateRangePresetSelect`,children:(0,W.jsx)(be,{label:`Период`,value:F??void 0,onChange:e=>I(e??null),onRangeChange:e=>L(e?.range??null),referenceDate:new Date(2026,2,10,12)})}),(0,W.jsx)(V,{title:`PresetRangeDateInput`,children:(0,W.jsx)(Re,{value:Ze,onChange:L,presetId:F??null,onPresetIdChange:e=>I(e??null),referenceDate:new Date(2026,2,10,12),presetLabel:`Быстрый диапазон`})}),(0,W.jsx)(V,{title:`PeriodSelect`,children:(0,W.jsx)(Ie,{label:`Группировка`,value:Qe,onChange:$e})}),(0,W.jsx)(V,{title:`InputFile`,children:(0,W.jsx)(Ee,{label:`Файл`,placeholder:`Выберите файл`,value:R,onChange:z,onClear:()=>z(void 0),readMode:`data-url`})}),(0,W.jsx)(V,{title:`InputFiles`,children:(0,W.jsx)(we,{label:`Файлы`,placeholder:`Выберите файлы`,value:B,onChange:H,readMode:`data-url`})}),(0,W.jsx)(V,{title:`InputImage`,children:(0,W.jsx)(Oe,{label:`Изображение`,value:G,onChange:K,onClear:()=>K(void 0)})}),(0,W.jsx)(V,{title:`DropZone`,children:(0,W.jsx)(ie,{value:X,multiple:!0,readMode:`data-url`,onChange:e=>Z(e),children:(0,W.jsx)(`div`,{style:{display:`grid`,placeItems:`center`,minHeight:`6em`,textAlign:`center`},children:X.length?`Файлов: ${X.length}`:`Перетащите файлы`})})}),(0,W.jsxs)(V,{title:`TabsBox`,children:[(0,W.jsx)(P,{defaultValue:`first`,items:[{id:`first`,title:`Первый`,content:`Содержимое`},{id:`second`,title:`Второй`,content:`Другая панель`},{id:`third`,title:`Ещё одна`,content:`Ещё одна панель`},{id:`quat`,title:`Четвертая`,content:`Четвертая панель`},{id:`five`,title:`Пятая`,content:`Пятая панель`}]}),(0,W.jsx)(P,{defaultValue:`first`,clean:!0,items:[{id:`first`,title:`Первый`,content:`Содержимое`},{id:`second`,title:`Второй`,content:`Другая панель`},{id:`third`,title:`Ещё одна`,content:`Ещё одна панель`},{id:`quat`,title:`Четвертая`,content:`Четвертая панель`},{id:`five`,title:`Пятая`,content:`Пятая панель`}]})]}),(0,W.jsxs)(V,{title:`TabsBox`,children:[(0,W.jsx)(P,{defaultValue:`first`,orientation:`vertical`,items:[{id:`first`,title:`Первый`,content:`Содержимое`},{id:`second`,title:`Второй`,content:`Другая панель`},{id:`third`,title:`Ещё одна`,content:`Другая панель`},{id:`quat`,title:`Четвертая`,content:`Другая панель`}]}),(0,W.jsx)(P,{defaultValue:`first`,orientation:`vertical`,clean:!0,items:[{id:`first`,title:`Первый`,content:`Содержимое`},{id:`second`,title:`Второй`,content:`Другая панель`},{id:`third`,title:`Ещё одна`,content:`Другая панель`},{id:`quat`,title:`Четвертая`,content:`Другая панель`}]})]}),(0,W.jsxs)(V,{title:`Disclosure`,children:[(0,W.jsxs)(ee,{children:[(0,W.jsx)(s,{label:`Раскрыть 1`,children:`Содержимое панели 1`}),(0,W.jsx)(s,{label:`Раскрыть 2`,children:`Содержимое панели 2`}),(0,W.jsx)(s,{label:`Раскрыть 3`,children:`Содержимое панели 3`}),(0,W.jsx)(s,{label:`Раскрыть 4`,children:`Содержимое панели 4`})]}),(0,W.jsx)(s,{label:`Раскрыть 1`,tone:`secondary`,children:`Содержимое панели 1`})]}),(0,W.jsx)(V,{title:`ExpandableActionPanel`,children:(0,W.jsx)(te,{children:(0,W.jsx)(b,{variant:`transparent`,children:`Действие`})})}),(0,W.jsx)(V,{title:`Popover`,children:(0,W.jsxs)(_,{children:[(0,W.jsx)(_.Trigger,{children:(0,W.jsx)(b,{style:q,children:`Открыть`})}),(0,W.jsx)(_.Content,{children:({setClose:e})=>(0,W.jsxs)(`div`,{style:{display:`grid`,gap:`0.75em`,padding:`1em`,maxWidth:`14em`},children:[(0,W.jsx)(`div`,{children:`Содержимое popover`}),(0,W.jsx)(b,{onClick:e,children:`Закрыть`})]})})]})}),(0,W.jsx)(V,{title:`DropdownMenu`,children:(0,W.jsxs)(O,{children:[(0,W.jsx)(O.Trigger,{children:(0,W.jsx)(b,{style:q,children:`Действия`})}),(0,W.jsxs)(O.Content,{children:[(0,W.jsx)(O.Item,{children:`Редактировать`}),(0,W.jsx)(O.Item,{children:`Удалить`})]})]})}),(0,W.jsx)(V,{title:`ContextMenu`,children:(0,W.jsxs)(S,{children:[(0,W.jsx)(S.Trigger,{children:(0,W.jsx)(`div`,{style:{display:`grid`,placeItems:`center`,minHeight:`6em`,padding:`0.75em`,border:`var(--border)`,borderRadius:`var(--radius-sm)`,textAlign:`center`},children:`Правая кнопка мыши`})}),(0,W.jsxs)(S.Content,{children:[(0,W.jsx)(S.Item,{children:`Переименовать`}),(0,W.jsx)(S.Item,{children:`Удалить`})]})]})}),(0,W.jsxs)(V,{title:`Dialog`,children:[(0,W.jsx)(b,{style:q,onClick:()=>Q(!0),children:`Открыть диалог`}),(0,W.jsx)(Se,{title:`Подтверждение`,description:`Подтвердите действие`,open:at,onClose:()=>Q(!1),children:(0,W.jsx)(b,{onClick:()=>Q(!1),children:`Закрыть`})})]}),(0,W.jsx)(V,{title:`Modal`,children:(0,W.jsxs)(he,{children:[(0,W.jsx)(b,{style:q,onClick:()=>$(!0),children:`Открыть модалку`}),(0,W.jsxs)(de,{title:`Параметры`,isOpen:ot,onClose:()=>$(!1),children:[(0,W.jsx)(le,{children:`Содержимое модального окна`}),(0,W.jsx)(ue,{children:(0,W.jsx)(b,{onClick:()=>$(!1),children:`Готово`})})]})]})})]})}var U,W,nt,G,K,q,J,Y,rt,it,X,Z,at;function Q(){return(Q=t((()=>{U=n(),oe(),se(),y(),d(),ge(),D(),ve(),M(),u(),xe(),a(),o(),p(),c(),fe(),w(),Te(),Ce(),De(),B(),ke(),je(),x(),me(),Ne(),Fe(),g(),Le(),ne(),ye(),A(),ze(),He(),We(),r(),Ke(),qe(),ae(),F(),I(),Ze(),Qe(),W=m(),nt={display:`grid`,gridTemplateColumns:`repeat(auto-fit, minmax(var(--ui-width-xl), 1fr))`,alignItems:`start`,gap:`2em`,padding:`2em`,background:`var(--surface-2)`},G={display:`grid`,alignContent:`start`,gridTemplateColumns:`100%`,gap:`0.5em`,padding:`1em`,overflow:`hidden`,borderRadius:`var(--radius-md)`,background:`var(--surface-1)`,boxShadow:`var(--shadow-lg)`},K={fontWeight:700,color:`var(--content-0)`},q={width:`100%`},J=[{id:`draft`,label:`Черновик`},{id:`review`,label:`На согласовании`},{id:`published`,label:`Опубликован`}],Y=[{code:`EKB`,label:`Екатеринбург`},{code:`KZN`,label:`Казань`},{code:`MOW`,label:`Москва`}],rt=[{value:`day`,label:`День`},{value:`week`,label:`Неделя`},{value:`month`,label:`Месяц`}],it=[{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:`Операционный блок`}],X={title:`Development/Interactive components`,component:H,parameters:{layout:`fullscreen`,docs:{description:{component:`Быстрая витрина интерактивных UI-компонентов для разработки и проверки общих стилей.`}}}},Z={},H.__docgenInfo={description:``,methods:[],displayName:`InteractiveComponents`},H.parameters={...H.parameters,docs:{...H.parameters?.docs,source:{originalSource:`function InteractiveComponents() {
|
|
1
|
+
import{a as e,n as t}from"./rolldown-runtime-DkW27tQK.js";import{t as n}from"./react-BZJXY1be.js";import{n as r,t as i}from"./Switch-DeDHWbqw.js";import{i as a,n as o,r as s,t as ee}from"./DisclosureGroup-DSs17wh1.js";import{n as c,t as te}from"./ExpandableActionPanel-utF3k6nI.js";import{n as ne,t as l}from"./RadioButton-QWhy6_MB.js";import{n as u,t as re}from"./SingleDateTimeInput-CqPmAWWa.js";import{n as d,t as f}from"./CheckBox-Dxyvwx9w.js";import{n as p,t as ie}from"./DropZone-BWY1s904.js";import{n as m}from"./iframe-CizMDlW9.js";import{n as ae,t as h}from"./Text-IQqUM-6S.js";import{n as g,t as _}from"./Popover-C-MzjE4n.js";import{i as oe,n as se,r as v,t as ce}from"./BadgeList-xlIWwEkW.js";import{n as y,t as b}from"./Button-CdRjxwHf.js";import{a as x,n as le,r as ue,t as de}from"./Modal-Chsv1ktM.js";import{n as fe,t as pe}from"./GridContainer-Dx_kHFve.js";import{n as me,t as he}from"./ModalManagerProvider-Bzz6KbJq.js";import{n as ge,t as S}from"./ContextMenu-Cs3dFpcR.js";import{a as C,l as w,o as T,t as E}from"./Input-BOFE5lvG.js";import{n as D,t as O}from"./DropdownMenu-DyxhrZHn.js";import{n as _e,r as ve}from"./DateInput-C876uAev.js";import{n as ye,t as k}from"./RadioGroup-CN92lZlY.js";import{n as A,t as j}from"./Select-BHTlNaX3.js";import{n as M,t as be}from"./DateRangePresetSelect-Dt6gakU3.js";import{n as xe,t as Se}from"./Dialog-B6cxAYUL.js";import{n as Ce,t as we}from"./InputFiles-BuMatkQD.js";import{n as Te,t as Ee}from"./InputFile-DBXedT6h.js";import{n as De,t as Oe}from"./InputImage-XIGsJtM-.js";import{n as ke,t as Ae}from"./LayoutPicker-3jtKH77d.js";import{n as je,t as Me}from"./Listbox-B7mjWKH_.js";import{n as Ne,t as Pe}from"./MultiSelect-odpQ0Zm5.js";import{n as Fe,t as Ie}from"./PeriodSelect-ClMxvzvw.js";import{n as Le,t as Re}from"./PresetRangeDateInput-CA4KuCnV.js";import{i as ze,r as Be,t as Ve}from"./Slider-Djs-5-SX.js";import{n as N,r as He,t as Ue}from"./SliderInput-nagryhRL.js";import{n as We,t as Ge}from"./StateSelect-Dbu1AJzp.js";import{n as Ke,t as P}from"./TabsBox-CfOR1G6c.js";import{n as qe,t as Je}from"./TagInput-C_yNW134.js";import{n as F,t as Ye}from"./Textarea-B50-dJyP.js";import{n as I,t as Xe}from"./Toggle-ADeGxXl0.js";import{n as Ze,t as L}from"./TreeMultiSelect-Z4AV1Wgg.js";import{n as Qe,t as $e}from"./treeStoryFixtures-DXHh9GL3.js";function et({onChange:e,...t}){let[n,r]=(0,R.useState)(()=>t.defaultValue??t.value??``),[i,a]=(0,R.useState)(()=>t.defaultValue??t.value??``),o=t=>{let n=t.trim();n!==i&&(a(n),e(n))},s=()=>{r(``),a(``),e(``)},ee=e=>{e.key===`Enter`&&(e.preventDefault(),o(n))},c=()=>{o(n)},te=e=>{r(e)};return(0,z.jsx)(E,{...t,value:n,onChange:te,onKeyDown:ee,onBlur:c,onClear:s})}var R,z;function B(){return(B=t((()=>{R=e(n(),1),w(),z=m(),et.__docgenInfo={description:``,methods:[],displayName:`InputSearch`,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:`T`},description:"Если начальное состояние может быть `null | undefined`\nзначит `onChange` тоже должен ументь сбрасывать.\nПоэтому такой контрол явно должен передавать `UiBaseProps<AnyType | undefined>`"},onChange:{required:!0,tsType:{name:`signature`,type:`function`,raw:`(value: string) => void`,signature:{arguments:[{type:{name:`string`},name:`value`}],return:{name:`void`}}},description:``},onClear:{required:!1,tsType:{name:`signature`,type:`function`,raw:`() => void`,signature:{arguments:[],return:{name:`void`}}},description:``},error:{required:!1,tsType:{name:`string`},description:``},onClearError:{required:!1,tsType:{name:`signature`,type:`function`,raw:`() => void`,signature:{arguments:[],return:{name:`void`}}},description:``},defaultValue:{required:!1,tsType:{name:`string`},description:``},endAdornment:{required:!1,tsType:{name:`ReactNode`},description:``},endAdornmentClassName:{required:!1,tsType:{name:`string`},description:``},endAdornmentWidth:{required:!1,tsType:{name:`string`},description:``}},composes:[`Omit`]}})))()}function V({title:e,children:t}){return(0,W.jsxs)(`section`,{style:G,children:[(0,W.jsx)(`div`,{style:K,children:e}),t]})}function tt({initialValue:e={},label:t=`TreeMultiSelect`,description:n,optionsLayout:r=`tree`,nodes:i=$e,defaultExpandedCodeKeys:a}){let[o,s]=(0,U.useState)(e);return(0,W.jsxs)(`div`,{style:{display:`grid`,gap:12,maxWidth:520},children:[(0,W.jsx)(L,{label:t,description:n,nodes:i,value:o,onChange:s,optionsLayout:r,defaultExpandedCodeKeys:a}),(0,W.jsxs)(`div`,{style:{fontSize:`var(--font-size-sm)`,color:`var(--content-1)`},children:[`Текущее значение: `,JSON.stringify(o)]})]})}function H(){let[e,t]=(0,U.useState)(`Значение`),[n,r]=(0,U.useState)(42),[a,o]=(0,U.useState)(``),[c,ne]=(0,U.useState)(`Комментарий`),[u,d]=(0,U.useState)(!0),[p,m]=(0,U.useState)(!1),[ae,g]=(0,U.useState)(`first`),[oe,se]=(0,U.useState)(!0),[y,x]=(0,U.useState)(!1),[fe,me]=(0,U.useState)(3),[ge,w]=(0,U.useState)(),[E,D]=(0,U.useState)([0,0]),[ve,ye]=(0,U.useState)(60),[A,M]=(0,U.useState)(J[0]),[xe,Ce]=(0,U.useState)([Y[0]]),[Te,De]=(0,U.useState)([`UI`,`Стили`]),[ke,je]=(0,U.useState)(`week`),[Ne,Fe]=(0,U.useState)(`information`),[Le,ze]=(0,U.useState)(`two-columns`),[He,We]=(0,U.useState)(new Date(2026,2,10)),[Ke,qe]=(0,U.useState)(new Date(2026,2,10,10,30)),[F,I]=(0,U.useState)(`today`),[Ze,L]=(0,U.useState)([new Date(2026,2,1),new Date(2026,2,10)]),[Qe,$e]=(0,U.useState)(`month`),[R,z]=(0,U.useState)(),[B,H]=(0,U.useState)([]),[G,K]=(0,U.useState)(),[X,Z]=(0,U.useState)([]),[at,Q]=(0,U.useState)(!1),[ot,$]=(0,U.useState)(!1),[st,ct]=(0,U.useState)();return(0,W.jsxs)(`div`,{style:nt,children:[(0,W.jsxs)(V,{title:`Text`,children:[(0,W.jsx)(h,{color:`primary`,children:`Основной`}),(0,W.jsx)(h,{color:`secondary`,children:`Дополнительный`}),(0,W.jsx)(h,{color:`muted`,children:`Приглушенный`}),(0,W.jsx)(h,{color:`accent`,children:`Акцентированный`}),(0,W.jsx)(h,{color:`brand`,children:`Брендовый`}),(0,W.jsx)(h,{color:`info`,children:`Информация`}),(0,W.jsx)(h,{color:`success`,children:`Успешно`}),(0,W.jsx)(h,{color:`warning`,children:`Предупреждение`}),(0,W.jsx)(h,{color:`error`,children:`Ошибка`})]}),(0,W.jsx)(V,{title:`Badge`,children:(0,W.jsxs)(ce,{children:[(0,W.jsx)(v,{tone:`neutral`,appearance:`outline`,children:`Neutral`}),(0,W.jsx)(v,{tone:`success`,appearance:`solid`,children:`Успешно`}),(0,W.jsx)(v,{tone:`warning`,appearance:`solid`,children:`Внимание`}),(0,W.jsx)(v,{tone:`error`,appearance:`solid`,children:`Ошибка`}),(0,W.jsx)(v,{tone:`info`,appearance:`solid`,children:`Информация`})]})}),(0,W.jsx)(V,{title:`Button`,children:(0,W.jsxs)(pe,{gap:`sm`,templateColumns:`1fr 1fr`,children:[(0,W.jsx)(b,{variant:`transparent`,children:`Действие`}),(0,W.jsx)(b,{variant:`ghost`,children:`Действие`}),(0,W.jsx)(b,{variant:`neutralOutline`,children:`Действие`}),(0,W.jsx)(b,{variant:`infoOutline`,children:`Действие`}),(0,W.jsx)(b,{variant:`successOutline`,children:`Действие`}),(0,W.jsx)(b,{variant:`warningOutline`,children:`Действие`}),(0,W.jsx)(b,{variant:`errorOutline`,children:`Действие`}),(0,W.jsx)(b,{variant:`neutral`,children:`Действие`}),(0,W.jsx)(b,{variant:`info`,children:`Действие`}),(0,W.jsx)(b,{variant:`success`,children:`Действие`}),(0,W.jsx)(b,{variant:`warning`,children:`Действие`}),(0,W.jsx)(b,{variant:`error`,children:`Действие`})]})}),(0,W.jsxs)(V,{title:`InputText`,children:[(0,W.jsx)(T,{label:`Текст`,description:`Поле ввода текста`,placeholder:`Введите текст`,disabled:!0,value:e,onChange:t}),(0,W.jsx)(T,{label:`Текст`,description:`Поле ввода текста`,placeholder:`Введите текст`,value:e,onChange:t}),(0,W.jsx)(T,{required:!0,label:`Текст`,description:`Поле ввода текста`,placeholder:`Введите текст`,value:e,onChange:t,onClear:()=>t(``)})]}),(0,W.jsxs)(V,{title:`InputNumber`,children:[(0,W.jsx)(C,{label:`Количество`,description:`Поле ввода числа`,placeholder:`Введите число`,value:n,min:0,onChange:r,disabled:!0}),(0,W.jsx)(C,{label:`Количество`,description:`Поле ввода числа`,placeholder:`Введите число`,value:n,min:0,onChange:r,required:!0}),(0,W.jsx)(C,{label:`Количество`,description:`Поле ввода числа`,placeholder:`Введите число`,value:n,min:0,onChange:r}),(0,W.jsx)(C,{label:`Количество`,description:`Поле ввода числа`,placeholder:`Введите число`,value:n,min:0,onChange:r,onClear:()=>r(void 0)})]}),(0,W.jsx)(V,{title:`InputSearch`,children:(0,W.jsx)(et,{label:`Поиск`,placeholder:`Найти`,value:a,onChange:o})}),(0,W.jsx)(V,{title:`Textarea`,children:(0,W.jsx)(Ye,{label:`Комментарий`,required:!0,placeholder:`Многострочный комментарий`,rows:6,value:c,onChange:ne})}),(0,W.jsxs)(V,{title:`CheckBox`,children:[(0,W.jsx)(f,{label:`Опция`,description:`Описание чекбокса`,disabled:!0,value:u,onChange:d}),(0,W.jsx)(f,{label:`Опция`,description:`Описание чекбокса`,value:u,onChange:d}),(0,W.jsx)(f,{label:`Опция`,description:`Описание чекбокса`,value:u,onChange:d,indeterminate:!0})]}),(0,W.jsxs)(V,{title:`RadioButton`,children:[(0,W.jsx)(l,{label:`Опция`,description:`Описание радиокнопки`,disabled:!0,value:p,onChange:m}),(0,W.jsx)(l,{label:`Опция`,description:`Описание радиокнопки`,name:`radio-1`,value:p,onChange:m}),(0,W.jsx)(l,{label:`Опция`,description:`Описание радиокнопки`,name:`radio-1`,value:p,onChange:m})]}),(0,W.jsxs)(V,{title:`RadioGroup`,children:[(0,W.jsxs)(k,{label:`Радио группа`,description:`Вертикальная группа`,value:ae,onChange:g,orientation:`vertical`,"aria-label":`Вариант`,children:[(0,W.jsx)(k.Option,{value:`first`,label:`Первый`}),(0,W.jsx)(k.Option,{value:`second`,label:`Второй`}),(0,W.jsx)(k.Option,{value:`third`,label:`Третий`,description:`Новая опциональная опция`})]}),(0,W.jsxs)(k,{label:`Радио группа`,description:`Горизонтальная группа`,value:ae,onChange:g,orientation:`horizontal`,"aria-label":`Вариант`,children:[(0,W.jsx)(k.Option,{value:`first`,label:`Первый`}),(0,W.jsx)(k.Option,{value:`second`,label:`Второй`}),(0,W.jsx)(k.Option,{value:`third`,label:`Третий`,description:`Новая опциональная опция`})]})]}),(0,W.jsx)(V,{title:`Switch`,children:(0,W.jsx)(i,{label:`Уведомления`,description:`Устаревный компонент`,value:oe,onChange:se})}),(0,W.jsxs)(V,{title:`Toggle`,children:[(0,W.jsx)(Xe,{label:`Режим`,description:`Переключатель состояния`,value:y,onChange:x,checkedText:`Вкл`,uncheckedText:`Выкл`}),(0,W.jsx)(Xe,{label:`Режим`,description:`Переключатель состояния`,labelPosition:`after`,value:y,onChange:x,checkedText:`Вкл`,uncheckedText:`Выкл`})]}),(0,W.jsxs)(V,{title:`Slider`,children:[(0,W.jsx)(Ve,{label:`Уровень`,description:`Простой слайдер`,value:fe,min:0,max:100,onChange:me}),(0,W.jsx)(Ve,{label:`Уровень`,description:`Простой слайдер`,disabled:!0,marks:[{value:1,label:`m1`},{value:2,label:`m2`},{value:3,label:`m3`},{value:4,label:`m4`},{value:5,label:`m5`},{value:6,label:`m6`}],marksPosition:`index`,value:fe,min:0,max:100,onChange:me}),(0,W.jsx)(Be,{label:`Уровень`,description:`Диапазон`,marks:[{value:0,label:`m1`},{value:1,label:`m2`},{value:2,label:`m3`},{value:3,label:`m4`}],marksPosition:`index`,value:ge,min:0,max:100,onChange:w})]}),(0,W.jsxs)(V,{title:`SliderInput`,children:[(0,W.jsx)(Ue,{label:`Порог`,value:ve,min:0,max:100,onChange:ye}),(0,W.jsx)(N,{label:`Порог`,value:E,onChange:D,min:0,max:100,marks:[{value:0,label:`0`},{value:20,label:`20`},{value:40,label:`40`},{value:60,label:`60`},{value:80,label:`80`},{value:100,label:`100`}]}),(0,W.jsx)(N,{label:`Срок: открытые границы и дни в фильтре`,description:"Крайние marks отдают null, обычные marks отдают дни через `outputValue`.",min:0,max:25,marks:[{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:`1г.`,outputValue:360},{value:18,label:`1.5г.`,outputValue:540},{value:24,label:`2г.`,outputValue:720},{value:25,label:`-`,outputValue:null}],value:E,onChange:D}),(0,W.jsx)(N,{label:`Срок текстом`,description:`В поле выводится готовый текст по marks, а изменение через popover коммитится при закрытии.`,placeholder:`Любой срок`,readonlyValueText:!0,min:0,max:25,marks:[{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:`1г.`,outputValue:360},{value:18,label:`1.5г.`,outputValue:540},{value:24,label:`2г.`,outputValue:720},{value:25,label:`-`,outputValue:null}],marksPosition:`index`,value:E,onChange:D})]}),(0,W.jsxs)(V,{title:`Select`,children:[(0,W.jsx)(j,{label:`Статус`,description:`searchable`,searchable:!0,options:J,value:A,onChange:M,getOptionKey:e=>e.id,getOptionLabel:e=>e.label}),(0,W.jsx)(j,{label:`Статус`,description:`disabled`,disabled:!0,options:J,value:A,onChange:M,getOptionKey:e=>e.id,getOptionLabel:e=>e.label}),(0,W.jsx)(j,{label:`Статус`,description:`Пример использования низкоуровневого Select со строковыми значениями.`,placeholder:`Выберите статус`,options:J,value:A,onChange:M,getOptionKey:e=>e.id,getOptionLabel:e=>e.label}),(0,W.jsx)(j,{label:`Подразделение`,description:`Выберите подразделение из списка.`,placeholder:`Не выбрано`,options:it,value:st,onChange:ct,getOptionKey:e=>e.id,getOptionLabel:e=>e.name,getOptionCode:e=>e.code,getOptionDisabled:e=>e.disabled??!1,getOptionGroup:e=>({key:e.direction,label:e.direction}),optionsMaxWidth:`40em`})]}),(0,W.jsx)(V,{title:`MultiSelect`,children:(0,W.jsx)(Pe,{label:`Города`,items:Y,value:xe,query:``,codeKey:`code`,textKey:`label`,onChange:Ce,onQuery:()=>void 0,onOpen:()=>void 0,onClose:()=>void 0})}),(0,W.jsx)(V,{title:`TreeMultiSelect`,children:(0,W.jsx)(tt,{})}),(0,W.jsx)(V,{title:`TagInput`,children:(0,W.jsx)(Je,{label:`Теги`,placeholder:`Добавить`,value:Te,onChange:De})}),(0,W.jsx)(V,{title:`Listbox`,children:(0,W.jsx)(Me,{options:rt,value:ke,onChange:e=>je(e)})}),(0,W.jsx)(V,{title:`StateSelect`,children:(0,W.jsx)(Ge,{label:`Состояние`,value:Ne,onChange:Fe})}),(0,W.jsx)(V,{title:`LayoutPicker`,children:(0,W.jsx)(Ae,{label:`Раскладка`,value:Le,onChange:ze,showPlaceholder:!0})}),(0,W.jsx)(V,{title:`SingleDateInput`,children:(0,W.jsx)(_e,{label:`Дата`,value:He,onChange:We,selectionMode:`week`})}),(0,W.jsx)(V,{title:`SingleDateTimeInput`,children:(0,W.jsx)(re,{label:`Дата и время`,value:Ke,onChange:qe})}),(0,W.jsx)(V,{title:`DateRangePresetSelect`,children:(0,W.jsx)(be,{label:`Период`,value:F??void 0,onChange:e=>I(e??null),onRangeChange:e=>L(e?.range??null),referenceDate:new Date(2026,2,10,12)})}),(0,W.jsx)(V,{title:`PresetRangeDateInput`,children:(0,W.jsx)(Re,{value:Ze,onChange:L,presetId:F??null,onPresetIdChange:e=>I(e??null),referenceDate:new Date(2026,2,10,12),presetLabel:`Быстрый диапазон`})}),(0,W.jsx)(V,{title:`PeriodSelect`,children:(0,W.jsx)(Ie,{label:`Группировка`,value:Qe,onChange:$e})}),(0,W.jsx)(V,{title:`InputFile`,children:(0,W.jsx)(Ee,{label:`Файл`,placeholder:`Выберите файл`,value:R,onChange:z,onClear:()=>z(void 0),readMode:`data-url`})}),(0,W.jsx)(V,{title:`InputFiles`,children:(0,W.jsx)(we,{label:`Файлы`,placeholder:`Выберите файлы`,value:B,onChange:H,readMode:`data-url`})}),(0,W.jsx)(V,{title:`InputImage`,children:(0,W.jsx)(Oe,{label:`Изображение`,value:G,onChange:K,onClear:()=>K(void 0)})}),(0,W.jsx)(V,{title:`DropZone`,children:(0,W.jsx)(ie,{value:X,multiple:!0,readMode:`data-url`,onChange:e=>Z(e),children:(0,W.jsx)(`div`,{style:{display:`grid`,placeItems:`center`,minHeight:`6em`,textAlign:`center`},children:X.length?`Файлов: ${X.length}`:`Перетащите файлы`})})}),(0,W.jsxs)(V,{title:`TabsBox`,children:[(0,W.jsx)(P,{defaultValue:`first`,items:[{id:`first`,title:`Первый`,content:`Содержимое`},{id:`second`,title:`Второй`,content:`Другая панель`},{id:`third`,title:`Ещё одна`,content:`Ещё одна панель`},{id:`quat`,title:`Четвертая`,content:`Четвертая панель`},{id:`five`,title:`Пятая`,content:`Пятая панель`}]}),(0,W.jsx)(P,{defaultValue:`first`,clean:!0,items:[{id:`first`,title:`Первый`,content:`Содержимое`},{id:`second`,title:`Второй`,content:`Другая панель`},{id:`third`,title:`Ещё одна`,content:`Ещё одна панель`},{id:`quat`,title:`Четвертая`,content:`Четвертая панель`},{id:`five`,title:`Пятая`,content:`Пятая панель`}]})]}),(0,W.jsxs)(V,{title:`TabsBox`,children:[(0,W.jsx)(P,{defaultValue:`first`,orientation:`vertical`,items:[{id:`first`,title:`Первый`,content:`Содержимое`},{id:`second`,title:`Второй`,content:`Другая панель`},{id:`third`,title:`Ещё одна`,content:`Другая панель`},{id:`quat`,title:`Четвертая`,content:`Другая панель`}]}),(0,W.jsx)(P,{defaultValue:`first`,orientation:`vertical`,clean:!0,items:[{id:`first`,title:`Первый`,content:`Содержимое`},{id:`second`,title:`Второй`,content:`Другая панель`},{id:`third`,title:`Ещё одна`,content:`Другая панель`},{id:`quat`,title:`Четвертая`,content:`Другая панель`}]})]}),(0,W.jsxs)(V,{title:`Disclosure`,children:[(0,W.jsxs)(ee,{children:[(0,W.jsx)(s,{label:`Раскрыть 1`,children:`Содержимое панели 1`}),(0,W.jsx)(s,{label:`Раскрыть 2`,children:`Содержимое панели 2`}),(0,W.jsx)(s,{label:`Раскрыть 3`,children:`Содержимое панели 3`}),(0,W.jsx)(s,{label:`Раскрыть 4`,children:`Содержимое панели 4`})]}),(0,W.jsx)(s,{label:`Раскрыть 1`,tone:`secondary`,children:`Содержимое панели 1`})]}),(0,W.jsx)(V,{title:`ExpandableActionPanel`,children:(0,W.jsx)(te,{children:(0,W.jsx)(b,{variant:`transparent`,children:`Действие`})})}),(0,W.jsx)(V,{title:`Popover`,children:(0,W.jsxs)(_,{children:[(0,W.jsx)(_.Trigger,{children:(0,W.jsx)(b,{style:q,children:`Открыть`})}),(0,W.jsx)(_.Content,{children:({setClose:e})=>(0,W.jsxs)(`div`,{style:{display:`grid`,gap:`0.75em`,padding:`1em`,maxWidth:`14em`},children:[(0,W.jsx)(`div`,{children:`Содержимое popover`}),(0,W.jsx)(b,{onClick:e,children:`Закрыть`})]})})]})}),(0,W.jsx)(V,{title:`DropdownMenu`,children:(0,W.jsxs)(O,{children:[(0,W.jsx)(O.Trigger,{children:(0,W.jsx)(b,{style:q,children:`Действия`})}),(0,W.jsxs)(O.Content,{children:[(0,W.jsx)(O.Item,{children:`Редактировать`}),(0,W.jsx)(O.Item,{children:`Удалить`})]})]})}),(0,W.jsx)(V,{title:`ContextMenu`,children:(0,W.jsxs)(S,{children:[(0,W.jsx)(S.Trigger,{children:(0,W.jsx)(`div`,{style:{display:`grid`,placeItems:`center`,minHeight:`6em`,padding:`0.75em`,border:`var(--border)`,borderRadius:`var(--radius-sm)`,textAlign:`center`},children:`Правая кнопка мыши`})}),(0,W.jsxs)(S.Content,{children:[(0,W.jsx)(S.Item,{children:`Переименовать`}),(0,W.jsx)(S.Item,{children:`Удалить`})]})]})}),(0,W.jsxs)(V,{title:`Dialog`,children:[(0,W.jsx)(b,{style:q,onClick:()=>Q(!0),children:`Открыть диалог`}),(0,W.jsx)(Se,{title:`Подтверждение`,description:`Подтвердите действие`,open:at,onClose:()=>Q(!1),children:(0,W.jsx)(b,{onClick:()=>Q(!1),children:`Закрыть`})})]}),(0,W.jsx)(V,{title:`Modal`,children:(0,W.jsxs)(he,{children:[(0,W.jsx)(b,{style:q,onClick:()=>$(!0),children:`Открыть модалку`}),(0,W.jsxs)(de,{title:`Параметры`,isOpen:ot,onClose:()=>$(!1),children:[(0,W.jsx)(le,{children:`Содержимое модального окна`}),(0,W.jsx)(ue,{children:(0,W.jsx)(b,{onClick:()=>$(!1),children:`Готово`})})]})]})})]})}var U,W,nt,G,K,q,J,Y,rt,it,X,Z,at;function Q(){return(Q=t((()=>{U=n(),oe(),se(),y(),d(),ge(),D(),ve(),M(),u(),xe(),a(),o(),p(),c(),fe(),w(),Te(),Ce(),De(),B(),ke(),je(),x(),me(),Ne(),Fe(),g(),Le(),ne(),ye(),A(),ze(),He(),We(),r(),Ke(),qe(),ae(),F(),I(),Ze(),Qe(),W=m(),nt={display:`grid`,gridTemplateColumns:`repeat(auto-fit, minmax(var(--ui-width-xl), 1fr))`,alignItems:`start`,gap:`2em`,padding:`2em`,background:`var(--surface-2)`},G={display:`grid`,alignContent:`start`,gridTemplateColumns:`100%`,gap:`0.5em`,padding:`1em`,overflow:`hidden`,borderRadius:`var(--radius-md)`,background:`var(--surface-1)`,boxShadow:`var(--shadow-lg)`},K={fontWeight:700,color:`var(--content-0)`},q={width:`100%`},J=[{id:`draft`,label:`Черновик`},{id:`review`,label:`На согласовании`},{id:`published`,label:`Опубликован`}],Y=[{code:`EKB`,label:`Екатеринбург`},{code:`KZN`,label:`Казань`},{code:`MOW`,label:`Москва`}],rt=[{value:`day`,label:`День`},{value:`week`,label:`Неделя`},{value:`month`,label:`Месяц`}],it=[{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:`Операционный блок`}],X={title:`Development/Interactive components`,component:H,parameters:{layout:`fullscreen`,docs:{description:{component:`Быстрая витрина интерактивных UI-компонентов для разработки и проверки общих стилей.`}}}},Z={},H.__docgenInfo={description:``,methods:[],displayName:`InteractiveComponents`},H.parameters={...H.parameters,docs:{...H.parameters?.docs,source:{originalSource:`function InteractiveComponents() {
|
|
2
2
|
const [text, setText] = useState("Значение");
|
|
3
3
|
const [number, setNumber] = useState<number | undefined>(42);
|
|
4
4
|
const [search, setSearch] = useState("");
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{n as e}from"./rolldown-runtime-DkW27tQK.js";import{t}from"./react-BZJXY1be.js";import{n}from"./iframe-
|
|
1
|
+
import{n as e}from"./rolldown-runtime-DkW27tQK.js";import{t}from"./react-BZJXY1be.js";import{n}from"./iframe-CizMDlW9.js";import{a as r,i}from"./utils-tg3ibbzi.js";import{n as a,t as o}from"./PickerField-BEMDq9NM.js";import{c as s,i as c,l,n as u,r as d,s as f,t as p,u as m}from"./usePickerTriggerController-BBzr2WZB.js";import{n as h,t as g}from"./Option-DtZ6Qlvd.js";import{n as _,t as v}from"./OptionContentContainer-DL2-HjT2.js";function y(e,t){return{gridTemplateColumns:`repeat(${e.columns}, minmax(0, 1fr))`,gridTemplateRows:`repeat(${e.rows}, minmax(${t??0}em, 1fr))`}}function b(e){return{gridColumn:`${e.column} / span ${e.columnSpan??1}`,gridRow:`${e.row} / span ${e.rowSpan??1}`}}var x;function S(){return(S=e((()=>{x=[{id:`1x1`,label:`1x1`,columns:1,rows:1,cells:[{id:`c11`,row:1,column:1}]},{id:`1x2`,label:`1x2`,columns:2,rows:1,cells:[{id:`c11`,row:1,column:1},{id:`c12`,row:1,column:2}]},{id:`1x3`,label:`1x3`,columns:3,rows:1,cells:[{id:`c11`,row:1,column:1},{id:`c12`,row:1,column:2},{id:`c13`,row:1,column:3}]},{id:`2x1`,label:`2x1`,columns:1,rows:2,cells:[{id:`c11`,row:1,column:1},{id:`c21`,row:2,column:1}]},{id:`2x2`,label:`2x2`,columns:2,rows:2,cells:[{id:`c11`,row:1,column:1},{id:`c12`,row:1,column:2},{id:`c21`,row:2,column:1},{id:`c22`,row:2,column:2}]},{id:`2x3`,label:`2x3`,columns:3,rows:2,cells:[{id:`c11`,row:1,column:1},{id:`c12`,row:1,column:2},{id:`c13`,row:1,column:3},{id:`c21`,row:2,column:1},{id:`c22`,row:2,column:2},{id:`c23`,row:2,column:3}]},{id:`3x1`,label:`3x1`,columns:1,rows:3,cells:[{id:`c11`,row:1,column:1},{id:`c21`,row:2,column:1},{id:`c31`,row:3,column:1}]},{id:`3x2`,label:`3x2`,columns:2,rows:3,cells:[{id:`c11`,row:1,column:1},{id:`c12`,row:1,column:2},{id:`c21`,row:2,column:1},{id:`c22`,row:2,column:2},{id:`c31`,row:3,column:1},{id:`c32`,row:3,column:2}]},{id:`3x3`,label:`3x3`,columns:3,rows:3,cells:[{id:`c11`,row:1,column:1},{id:`c12`,row:1,column:2},{id:`c13`,row:1,column:3},{id:`c21`,row:2,column:1},{id:`c22`,row:2,column:2},{id:`c23`,row:2,column:3},{id:`c31`,row:3,column:1},{id:`c32`,row:3,column:2},{id:`c33`,row:3,column:3}]},{id:`4x1`,label:`4x1`,columns:1,rows:4,cells:[{id:`c11`,row:1,column:1},{id:`c21`,row:2,column:1},{id:`c31`,row:3,column:1},{id:`c41`,row:4,column:1}]},{id:`4x2`,label:`4x2`,columns:2,rows:4,cells:[{id:`c11`,row:1,column:1},{id:`c12`,row:1,column:2},{id:`c21`,row:2,column:1},{id:`c22`,row:2,column:2},{id:`c31`,row:3,column:1},{id:`c32`,row:3,column:2},{id:`c41`,row:4,column:1},{id:`c42`,row:4,column:2}]},{id:`4x3`,label:`4x3`,columns:3,rows:4,cells:[{id:`c11`,row:1,column:1},{id:`c12`,row:1,column:2},{id:`c13`,row:1,column:3},{id:`c21`,row:2,column:1},{id:`c22`,row:2,column:2},{id:`c23`,row:2,column:3},{id:`c31`,row:3,column:1},{id:`c32`,row:3,column:2},{id:`c33`,row:3,column:3},{id:`c41`,row:4,column:1},{id:`c42`,row:4,column:2},{id:`c43`,row:4,column:3}]},{id:`2x2-l`,label:`Большая слева + две справа`,columns:2,rows:2,cells:[{id:`left`,row:1,column:1,rowSpan:2},{id:`rt`,row:1,column:2},{id:`rb`,row:2,column:2}]},{id:`2x2-r`,label:`Две слева + большая справа`,columns:2,rows:2,cells:[{id:`lt`,row:1,column:1},{id:`lb`,row:2,column:1},{id:`right`,row:1,column:2,rowSpan:2}]},{id:`2x2-t`,label:`Широкая сверху + две снизу`,columns:2,rows:2,cells:[{id:`top`,row:1,column:1,columnSpan:2},{id:`bl`,row:2,column:1},{id:`br`,row:2,column:2}]},{id:`2x2-b`,label:`Две сверху + широкая снизу`,columns:2,rows:2,cells:[{id:`tl`,row:1,column:1},{id:`tr`,row:1,column:2},{id:`bottom`,row:2,column:1,columnSpan:2}]},{id:`3x2-t`,label:`Широкая сверху + 2x2`,columns:2,rows:3,cells:[{id:`top`,row:1,column:1,columnSpan:2},{id:`c21`,row:2,column:1},{id:`c22`,row:2,column:2},{id:`c31`,row:3,column:1},{id:`c32`,row:3,column:2}]},{id:`3x2-b`,label:`2x2 + широкая снизу`,columns:2,rows:3,cells:[{id:`c11`,row:1,column:1},{id:`c12`,row:1,column:2},{id:`c21`,row:2,column:1},{id:`c22`,row:2,column:2},{id:`bottom`,row:3,column:1,columnSpan:2}]},{id:`3x2-m`,label:`Широкая по центру`,columns:2,rows:3,cells:[{id:`tl`,row:1,column:1},{id:`tr`,row:1,column:2},{id:`middle`,row:2,column:1,columnSpan:2},{id:`bl`,row:3,column:1},{id:`br`,row:3,column:2}]},{id:`3x3-l`,label:`Большая слева + 2x3 справа`,columns:3,rows:3,cells:[{id:`left`,row:1,column:1,rowSpan:3},{id:`c12`,row:1,column:2},{id:`c13`,row:1,column:3},{id:`c22`,row:2,column:2},{id:`c23`,row:2,column:3},{id:`c32`,row:3,column:2},{id:`c33`,row:3,column:3}]},{id:`3x3-r`,label:`2x3 слева + большая справа`,columns:3,rows:3,cells:[{id:`c11`,row:1,column:1},{id:`c12`,row:1,column:2},{id:`right`,row:1,column:3,rowSpan:3},{id:`c21`,row:2,column:1},{id:`c22`,row:2,column:2},{id:`c31`,row:3,column:1},{id:`c32`,row:3,column:2}]},{id:`3x3-t`,label:`Широкая сверху + 2x3`,columns:3,rows:3,cells:[{id:`top`,row:1,column:1,columnSpan:3},{id:`c21`,row:2,column:1},{id:`c22`,row:2,column:2},{id:`c23`,row:2,column:3},{id:`c31`,row:3,column:1},{id:`c32`,row:3,column:2},{id:`c33`,row:3,column:3}]},{id:`3x3-b`,label:`2x3 + широкая снизу`,columns:3,rows:3,cells:[{id:`c11`,row:1,column:1},{id:`c12`,row:1,column:2},{id:`c13`,row:1,column:3},{id:`c21`,row:2,column:1},{id:`c22`,row:2,column:2},{id:`c23`,row:2,column:3},{id:`bottom`,row:3,column:1,columnSpan:3}]},{id:`4x2-t`,label:`Широкая сверху + 3x2`,columns:2,rows:4,cells:[{id:`top`,row:1,column:1,columnSpan:2},{id:`c21`,row:2,column:1},{id:`c22`,row:2,column:2},{id:`c31`,row:3,column:1},{id:`c32`,row:3,column:2},{id:`c41`,row:4,column:1},{id:`c42`,row:4,column:2}]},{id:`4x2-b`,label:`3x2 + широкая снизу`,columns:2,rows:4,cells:[{id:`c11`,row:1,column:1},{id:`c12`,row:1,column:2},{id:`c21`,row:2,column:1},{id:`c22`,row:2,column:2},{id:`c31`,row:3,column:1},{id:`c32`,row:3,column:2},{id:`bottom`,row:4,column:1,columnSpan:2}]},{id:`4x3-t`,label:`Широкая сверху + 3x3`,columns:3,rows:4,cells:[{id:`top`,row:1,column:1,columnSpan:3},{id:`c21`,row:2,column:1},{id:`c22`,row:2,column:2},{id:`c23`,row:2,column:3},{id:`c31`,row:3,column:1},{id:`c32`,row:3,column:2},{id:`c33`,row:3,column:3},{id:`c41`,row:4,column:1},{id:`c42`,row:4,column:2},{id:`c43`,row:4,column:3}]},{id:`4x3-b`,label:`3x3 + широкая снизу`,columns:3,rows:4,cells:[{id:`c11`,row:1,column:1},{id:`c12`,row:1,column:2},{id:`c13`,row:1,column:3},{id:`c21`,row:2,column:1},{id:`c22`,row:2,column:2},{id:`c23`,row:2,column:3},{id:`c31`,row:3,column:1},{id:`c32`,row:3,column:2},{id:`c33`,row:3,column:3},{id:`bottom`,row:4,column:1,columnSpan:3}]}]})))()}var C,w,T,E,D,O,k,A,j,M,N,P;function F(){return(F=e((()=>{C=`SmdPit`,w=`giOtGs`,T=`_57Tr0T`,E=`Tkhulr`,D=`VQlniu`,O=`wb39Kf`,k=`VrHnjN`,A=`vNV6Q2`,j=`koxYU-`,M=`k8xLa2`,N=`_5pd3Bb`,P={triggerText:C,popup:w,popupLayout:T,popupBody:E,options:D,option:O,previewCell:k,optionPreviewWrap:A,preview:j,previewPlaceholder:M,previewCompact:N}})))()}function I({preset:e,compact:t=!1}){return(0,L.jsx)(`span`,{className:r(P.preview,t&&P.previewCompact),style:y(e),"aria-hidden":`true`,"data-ui":`layout-picker-preview`,children:e.cells.map(t=>(0,L.jsx)(`span`,{className:P.previewCell,style:b(t)},`${e.id}:${t.id}`))})}var L;function R(){return(R=e((()=>{i(),F(),L=n(),I.__docgenInfo={description:`Схематичное, скрытое от accessibility tree превью layout-пресета.`,methods:[],displayName:`LayoutPresetPreview`,props:{preset:{required:!0,tsType:{name:`signature`,type:`object`,raw:`{
|
|
2
2
|
id: string;
|
|
3
3
|
label: string;
|
|
4
4
|
description?: string;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{n as e}from"./rolldown-runtime-DkW27tQK.js";import{n as t}from"./iframe-
|
|
1
|
+
import{n as e}from"./rolldown-runtime-DkW27tQK.js";import{n as t}from"./iframe-CizMDlW9.js";import{i as n,r}from"./react-Bl2r1tuC.js";import{a as i,d as a,f as o,l as s,m as c,n as l,p as u,r as d,u as f}from"./blocks-D29TdvdI.js";import{a as p,c as m,i as h,l as g,n as _,o as v,r as y,s as b,t as x}from"./LayoutPicker.stories-CmGAGY2E.js";function S(e){let t={code:`code`,h2:`h2`,h3:`h3`,li:`li`,p:`p`,pre:`pre`,ul:`ul`,...n(),...e.components};return(0,w.jsxs)(w.Fragment,{children:[(0,w.jsx)(s,{of:b,parameters:{docs:{toc:!0}}}),`
|
|
2
2
|
`,(0,w.jsx)(u,{children:`LayoutPicker`}),`
|
|
3
3
|
`,(0,w.jsx)(o,{children:`Контролируемый выбор layout-пресета со схематичным превью`}),`
|
|
4
4
|
`,(0,w.jsxs)(t.p,{children:[(0,w.jsx)(t.code,{children:`LayoutPicker`}),` нужен для выбора схемы размещения независимых областей: графиков, панелей, секций дашборда или другого UI, где сама раскладка хранится во внешней модели.
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{n as e,r as t}from"./rolldown-runtime-DkW27tQK.js";import{t as n}from"./react-BZJXY1be.js";import{n as r}from"./iframe-
|
|
1
|
+
import{n as e,r as t}from"./rolldown-runtime-DkW27tQK.js";import{t as n}from"./react-BZJXY1be.js";import{n as r}from"./iframe-CizMDlW9.js";import{n as i,t as a}from"./Button-CdRjxwHf.js";import{i as o,n as s,r as c,t as l}from"./LayoutPicker-3jtKH77d.js";var u,d,f,p,m,h,g,_,v,y;function b(){return(b=e((()=>{u=`buT8ds`,d=`vDpJVR`,f=`-GMI1h`,p=`Xgkzn9`,m=`X--lo-`,h=`W5rEjx`,g=`BgilL7`,_=`ALGrVl`,v=`IrqK1d`,y={canvas:u,toolbar:d,summary:f,summaryItem:p,summaryValue:m,muted:h,layoutPreview:g,layoutCell:_,layoutCellTitle:v}})))()}var x=t({Controlled:()=>M,CustomPresets:()=>P,CustomTrigger:()=>L,Disabled:()=>R,DisabledPresets:()=>F,InToolbar:()=>I,Placeholder:()=>N,__namedExportsOrder:()=>z,default:()=>j});function S(e,t){return t.find(t=>t.id===e)}function C({value:e,presets:t}){let n=S(e,t);return(0,D.jsxs)(`div`,{className:y.summary,"aria-live":`polite`,children:[(0,D.jsxs)(`div`,{className:y.summaryItem,children:[(0,D.jsx)(`span`,{children:`ID`}),(0,D.jsx)(`span`,{className:y.summaryValue,children:e||`не выбрано`})]}),(0,D.jsxs)(`div`,{className:y.summaryItem,children:[(0,D.jsx)(`span`,{children:`Название`}),(0,D.jsx)(`span`,{className:y.summaryValue,children:n?.label??`Layout не выбран`})]}),(0,D.jsxs)(`div`,{className:y.summaryItem,children:[(0,D.jsx)(`span`,{children:`Сетка`}),(0,D.jsx)(`span`,{className:y.summaryValue,children:n?`${n.columns} x ${n.rows}`:`нет данных`})]}),(0,D.jsxs)(`div`,{className:y.summaryItem,children:[(0,D.jsx)(`span`,{children:`Ячеек`}),(0,D.jsx)(`span`,{className:y.summaryValue,children:n?.cells.length??0})]})]})}function w({value:e,presets:t}){let n=S(e,t);if(!n)return null;let r=n.columns,i=n.rows,a=n.cells;return(0,D.jsx)(`div`,{className:y.layoutPreview,style:{gridTemplateColumns:`repeat(${r}, minmax(0, 1fr))`,gridTemplateRows:`repeat(${i}, minmax(0, 1fr))`},children:a.map((e,t)=>(0,D.jsxs)(`div`,{className:y.layoutCell,style:{gridColumn:`${e.column} / span ${e.columnSpan}`,gridRow:`${e.row} / span ${e.rowSpan}`},children:[(0,D.jsxs)(`span`,{className:y.layoutCellTitle,children:[`Область `,t+1]}),(0,D.jsxs)(`span`,{className:y.muted,children:[`Колонка `,e.column,`, строка `,e.row,`; span `,e.columnSpan,` x `,e.rowSpan]})]},e.id))})}function T(){let[e,t]=(0,E.useState)(`1x2`);return(0,D.jsxs)(`div`,{className:y.canvas,children:[(0,D.jsx)(`div`,{className:y.toolbar,children:(0,D.jsx)(l,{label:`Layout панели`,value:e,onChange:t,ariaLabel:`Выбрать layout панели`})}),(0,D.jsx)(C,{value:e,presets:c}),(0,D.jsx)(w,{value:e,presets:c})]})}var E,D,O,k,A,j,M,N,P,F,I,L,R,z;function B(){return(B=e((()=>{E=n(),i(),o(),s(),b(),D=r(),{useArgs:O}=__STORYBOOK_MODULE_PREVIEW_API__,{fn:k}=__STORYBOOK_MODULE_TEST__,A=[{id:`dashboard-summary`,label:`Сводка + детали`,description:`Один широкий блок сверху и две области детализации снизу.`,columns:2,rows:2,cells:[{id:`summary`,column:1,columnSpan:2,row:1,rowSpan:1},{id:`left-detail`,column:1,columnSpan:1,row:2,rowSpan:1},{id:`right-detail`,column:2,columnSpan:1,row:2,rowSpan:1}]},{id:`dashboard-main-aside`,label:`Основной блок + сайдбар`,description:`Большая рабочая область слева и вертикальная колонка справа.`,columns:3,rows:2,cells:[{id:`main`,column:1,columnSpan:2,row:1,rowSpan:2},{id:`aside-top`,column:3,columnSpan:1,row:1,rowSpan:1},{id:`aside-bottom`,column:3,columnSpan:1,row:2,rowSpan:1}]},{id:`dashboard-quad`,label:`Четыре равных блока`,description:`Плотная сетка для сравнения нескольких независимых виджетов.`,columns:2,rows:2,cells:[{id:`top-left`,column:1,columnSpan:1,row:1,rowSpan:1},{id:`top-right`,column:2,columnSpan:1,row:1,rowSpan:1},{id:`bottom-left`,column:1,columnSpan:1,row:2,rowSpan:1},{id:`bottom-right`,column:2,columnSpan:1,row:2,rowSpan:1}]}],j={title:`UI/LayoutPicker`,component:l,args:{label:`Layout панели`,description:`Выберите схему размещения областей.`,value:c[0].id,onChange:k(),presets:c,disabled:!1,placeholder:`Выберите layout`,showPlaceholder:!1,ariaLabel:`Выбрать layout`,placement:`bottom-start`},parameters:{atomicCanvas:!0,layout:`padded`,docs:{description:{component:`Контролируемый выбор layout-пресета со схематичным превью. Компонент хранит только UI-состояние popup и возвращает наружу ID выбранного пресета.`}}},argTypes:{id:{description:"ID кнопки выбора. Если не передан, компонент создаёт стабильный `useId`.",control:`text`},label:{description:`Заголовок поля.`,control:`text`},description:{description:`Описание под заголовком.`,control:`text`},value:{description:`ID текущего выбранного layout-пресета.`,control:`text`},onChange:{description:`Вызывается с ID выбранного layout-пресета.`,control:!1},presets:{description:"Список layout-пресетов. По умолчанию используется `DEFAULT_LAYOUT_PICKER_PRESETS`.",control:!1},disabled:{description:`Блокирует кнопку выбора и открытие popup.`,control:`boolean`},getPresetDisabled:{description:`Позволяет заблокировать отдельные пресеты внутри popup.`,control:!1},placeholder:{description:"Текст, который можно явно показать рядом с превью через `showPlaceholder`.",control:`text`},showPlaceholder:{description:"Показывает рядом с превью именно строку `placeholder`. По умолчанию trigger содержит только иконку.",control:`boolean`},ariaLabel:{description:`Доступное имя trigger-кнопки. Если не передано, строится из текущего значения.`,control:`text`},size:{description:"Размер поля из общего `UiBaseProps`.",control:`select`,options:[`xs`,`sm`,`md`,`lg`,`xl`]},className:{description:`Дополнительный CSS-класс корневого контейнера.`,control:`text`},triggerClassName:{description:`Дополнительный CSS-класс trigger-кнопки.`,control:`text`},popupClassName:{description:`Дополнительный CSS-класс popup.`,control:`text`},renderTrigger:{description:`Позволяет заменить стандартный input-like trigger на собственную button-композицию.`,control:!1},placement:{description:`Позиционирование popup относительно trigger.`,control:`select`,options:[`bottom-start`,`bottom-end`,`top-start`,`top-end`,`right-start`,`left-start`]}}},M={args:{value:`2x1`},name:`Контролируемый выбор`,render:function(e){let[,t]=O(),n=e.presets??c;return(0,D.jsxs)(`div`,{className:y.canvas,children:[(0,D.jsx)(l,{...e,presets:n,onChange:n=>{e.onChange(n),t({value:n})}}),(0,D.jsx)(C,{value:e.value??``,presets:n})]})}},N={name:`Без выбранного значения`,render:e=>{let[t,n]=(0,E.useState)(``),r=e.presets??c;return(0,D.jsxs)(`div`,{className:y.canvas,children:[(0,D.jsx)(l,{...e,value:t,presets:r,placeholder:`Layout ещё не выбран`,showPlaceholder:!0,onChange:t=>{n(t),e.onChange(t)}}),(0,D.jsx)(C,{value:t,presets:r})]})},args:{value:``}},P={name:`Кастомные пресеты`,render:e=>{let[t,n]=(0,E.useState)(A[0].id);return(0,D.jsxs)(`div`,{className:y.canvas,children:[(0,D.jsx)(l,{...e,value:t,presets:A,ariaLabel:`Выбрать layout дашборда`,onChange:t=>{n(t),e.onChange(t)}}),(0,D.jsx)(C,{value:t,presets:A}),(0,D.jsx)(w,{value:t,presets:A})]})},args:{value:A[0].id,presets:A}},F={name:`Заблокированные пресеты`,render:e=>{let[t,n]=(0,E.useState)(`1x1`);return(0,D.jsxs)(`div`,{className:y.canvas,children:[(0,D.jsx)(l,{...e,value:t,getPresetDisabled:e=>e.id===`1x2`||e.id===`2x2-l`,onChange:t=>{n(t),e.onChange(t)}}),(0,D.jsx)(`div`,{className:y.muted,children:`Пресеты с двумя колонками в этом сценарии недоступны.`}),(0,D.jsx)(C,{value:t,presets:c})]})}},I={name:`В панели настройки`,render:()=>(0,D.jsx)(T,{})},L={name:`Пользовательский trigger`,render:e=>{let[t,n]=(0,E.useState)(`1x2`);return(0,D.jsx)(l,{...e,value:t,onChange:t=>{n(t),e.onChange(t)},renderTrigger:({triggerLabel:e,triggerProps:t})=>(0,D.jsxs)(a,{...t,children:[`Раскладка: `,e]})})},args:{label:void 0,description:void 0,value:`1x2`}},R={name:`Заблокированный контрол`,args:{disabled:!0,value:`1x2`}},M.parameters={...M.parameters,docs:{...M.parameters?.docs,source:{originalSource:`{
|
|
2
2
|
args: {
|
|
3
3
|
value: "2x1"
|
|
4
4
|
},
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{n as e}from"./rolldown-runtime-DkW27tQK.js";import{t}from"./react-BZJXY1be.js";import{n,t as r}from"./check-
|
|
1
|
+
import{n as e}from"./rolldown-runtime-DkW27tQK.js";import{t}from"./react-BZJXY1be.js";import{n,t as r}from"./check-B9kjGnTr.js";import{n as i}from"./iframe-CizMDlW9.js";import{i as a,n as o,r as s,s as c,t as l}from"./utils-tg3ibbzi.js";import{n as u,t as d}from"./OptionContent-Yz54kdhn.js";import{n as f,t as p}from"./PickerField-BEMDq9NM.js";import{i as m,n as h,r as g,t as _}from"./Option-DtZ6Qlvd.js";import{n as v,t as y}from"./OptionContentContainer-DL2-HjT2.js";function b(e,t,n){if(n){if(Array.isArray(t)&&t.length>0){let n=e.findIndex(e=>t.includes(e.value)&&!e.disabled);if(n>=0)return n}return s(e,w)}if(t!==void 0){let n=e.findIndex(e=>e.value===t&&!e.disabled);if(n>=0)return n}return s(e,w)}function x(e){let{value:t,defaultValue:n,multiple:i,label:a,description:u,disabled:f,size:m,focusOnMount:h,renderItem:v,getKey:x,options:T,onChange:E,id:D,...O}=e,k=t!==void 0,[A,j]=(0,S.useState)(n),M=(0,S.useRef)(null),[N,P]=(0,S.useState)(()=>b(T,t??n,i)),F=(0,S.useRef)(!1),I=(0,S.useMemo)(()=>(k?t:A)??(i?[]:null),[A,k,i,t]),L=N,R=e=>{if(!(f||e.disabled)){if(i){let t=Array.isArray(I)?I:[],n=t.includes(e.value)?t.filter(t=>t!==e.value):[...t,e.value];E?.(n,e),k||j(n);return}E?.(e.value,e),k||j(e.value)}},z=e=>{if(!f){if(e.key===`ArrowDown`)e.preventDefault(),F.current=!0,P(e=>l(T,e,1,w));else if(e.key===`ArrowUp`)e.preventDefault(),F.current=!0,P(e=>l(T,e,-1,w));else if(e.key===`Home`)e.preventDefault(),F.current=!0,P(s(T,w));else if(e.key===`End`)e.preventDefault(),F.current=!0,P(c(T,w));else if(o(e,()=>{let e=T[L];e&&R(e)}))return}};return(0,S.useEffect)(()=>{if(!F.current)return;F.current=!1;let e=M.current?.querySelectorAll(`[role="option"]`)[L];e&&e.scrollIntoView({block:`nearest`})},[L]),(0,S.useLayoutEffect)(()=>{h&&M.current?.focus()},[h]),(0,C.jsx)(p,{id:D,label:a,description:u,disabled:f,size:m,children:({controlId:e,labelId:t,describedBy:n})=>(0,C.jsx)(g,{rootRef:M,id:e,role:`listbox`,"aria-multiselectable":i||void 0,"aria-activedescendant":L>=0?`${e}-option-${L}`:void 0,onKeyDown:z,...O,"aria-labelledby":t??O[`aria-labelledby`],"aria-describedby":n??O[`aria-describedby`],"aria-disabled":f||void 0,tabIndex:f?-1:0,className:O.className,children:T.map((t,n)=>{let a=i?Array.isArray(I)&&I.includes(t.value):I===t.value,o=n===L,s=f||t.disabled||void 0;return(0,C.jsx)(_,{id:`${e}-option-${n}`,role:`option`,"aria-selected":a,"aria-disabled":s,disabled:s,active:o,selected:a,onMouseDown:e=>{e.preventDefault(),!s&&(P(n),R(t))},children:v?(0,C.jsx)(y,{children:v(t,a,o)}):(0,C.jsx)(y,{children:(0,C.jsx)(d,{icon:a?(0,C.jsx)(r,{}):(0,C.jsx)(`span`,{}),text:t.label??String(t.value)})})},x?x(t,n):n)})})})}var S,C,w;function T(){return(T=e((()=>{S=t(),a(),n(),h(),u(),v(),f(),m(),C=i(),w=e=>e.disabled===!0,x.__docgenInfo={description:``,methods:[],displayName:`Listbox`}})))()}export{T as n,x as t};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{n as e}from"./rolldown-runtime-DkW27tQK.js";import{n as t}from"./iframe-
|
|
1
|
+
import{n as e}from"./rolldown-runtime-DkW27tQK.js";import{n as t}from"./iframe-CizMDlW9.js";import{i as n,r}from"./react-Bl2r1tuC.js";import{a as i,d as a,f as o,l as s,m as c,n as l,p as u,r as d,u as f}from"./blocks-D29TdvdI.js";import{a as p,i as m,n as h,o as g,r as _,s as v,t as y}from"./Listbox.stories-DAyqK_9S.js";function b(e){let t={code:`code`,h2:`h2`,h3:`h3`,li:`li`,p:`p`,pre:`pre`,ul:`ul`,...n(),...e.components};return(0,S.jsxs)(S.Fragment,{children:[(0,S.jsx)(s,{of:_,parameters:{docs:{toc:!0}}}),`
|
|
2
2
|
`,(0,S.jsx)(u,{children:`Listbox`}),`
|
|
3
3
|
`,(0,S.jsx)(o,{children:`Список выбора для single- и multi-select сценариев, кастомного рендера элементов и блокированного состояния`}),`
|
|
4
4
|
`,(0,S.jsx)(t.p,{children:`Listbox уже имеет живые stories, а эта страница собирает их в структурированную документацию с краткими рекомендациями, примерами подключения и API.
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{n as e,r as t}from"./rolldown-runtime-DkW27tQK.js";import{n}from"./iframe-
|
|
1
|
+
import{n as e,r as t}from"./rolldown-runtime-DkW27tQK.js";import{n}from"./iframe-CizMDlW9.js";import{n as r,t as i}from"./Listbox-B7mjWKH_.js";var a=t({CustomRender:()=>p,Disabled:()=>m,MultiSelect:()=>f,SingleSelect:()=>d,Sizes:()=>h,__namedExportsOrder:()=>g,default:()=>u});function o(e){return e.multiple?(0,s.jsx)(i,{...e,multiple:!0}):(0,s.jsx)(i,{...e})}var s,c,l,u,d,f,p,m,h,g;function _(){return(_=e((()=>{r(),s=n(),{useArgs:c}=__STORYBOOK_MODULE_PREVIEW_API__,{fn:l}=__STORYBOOK_MODULE_TEST__,u={title:`UI/Listbox`,component:o,args:{options:[{value:`low`,label:`Низкий`},{value:`medium`,label:`Средний`},{value:`high`,label:`Высокий`},{value:`critical`,label:`Критический`,disabled:!0}],multiple:!1,label:`Приоритет`,description:`Выберите приоритет задачи.`,value:`medium`,onChange:l()},parameters:{atomicCanvas:!0,layout:`padded`},argTypes:{label:{description:`Заголовок поля, оформленный так же, как у Input.`},description:{description:`Описание под заголовком, связанное со списком через ARIA.`},options:{description:`Массив доступных опций списка.`,control:!1},multiple:{description:`Режим множественного выбора.`,control:`boolean`},value:{description:`Текущее выбранное значение (или массив значений).`,control:!1},defaultValue:{description:`Начальное значение для uncontrolled-режима.`,control:!1},disabled:{description:`Блокирует фокусировку, навигацию и изменение выбора.`,control:`boolean`},size:{description:`Ширина Listbox из общего контракта UiBaseProps.`,control:`select`,options:[`xs`,`sm`,`md`,`lg`,`xl`]},onChange:{description:`Вызывается при выборе опции.`,control:!1},focusOnMount:{description:`Автофокус списка при монтировании.`,control:`boolean`},renderItem:{description:`Кастомный рендер строки списка.`,control:!1},getKey:{description:`Функция генерации ключа для опции.`,control:!1}}},d={render:function(e){let[,t]=c(),n=typeof e.value==`string`?e.value:`medium`;return(0,s.jsxs)(`div`,{style:{display:`grid`,gap:12,maxWidth:280},children:[(0,s.jsx)(o,{...e,multiple:!1,value:n,onChange:(n,r)=>{typeof n==`string`&&(e.onChange?.(n,r),t({value:n}))}}),(0,s.jsxs)(`div`,{children:[`Выбрано: `,n]})]})}},f={render:function(e){let[,t]=c(),n=Array.isArray(e.value)?e.value:[`low`,`high`];return(0,s.jsxs)(`div`,{style:{display:`grid`,gap:12,maxWidth:320},children:[(0,s.jsx)(o,{...e,multiple:!0,value:n,onChange:(n,r)=>{Array.isArray(n)&&(e.onChange?.(n,r),t({value:n}))}}),(0,s.jsxs)(`div`,{children:[`Выбрано: `,n.join(`, `)||`пусто`]})]})},args:{multiple:!0}},p={render:function(e){let[,t]=c(),n=typeof e.value==`string`?e.value:`low`;return(0,s.jsx)(o,{...e,value:n,onChange:(n,r)=>{typeof n==`string`&&(e.onChange?.(n,r),t({value:n}))},renderItem:(e,t,n)=>(0,s.jsxs)(`div`,{style:{display:`flex`,justifyContent:`space-between`,width:`100%`,opacity:e.disabled?.5:1},children:[(0,s.jsx)(`span`,{children:e.label}),(0,s.jsx)(`span`,{children:t?`Выбрано`:n?`Фокус`:``})]})})}},m={args:{disabled:!0,value:`medium`},render:e=>(0,s.jsx)(o,{...e})},h={args:{label:void 0,description:void 0},render:e=>(0,s.jsx)(`div`,{style:{display:`grid`,gap:12},children:[`xs`,`sm`,`md`,`lg`,`xl`].map(t=>(0,s.jsx)(o,{...e,size:t,label:t},t))})},d.parameters={...d.parameters,docs:{...d.parameters?.docs,source:{originalSource:`{
|
|
2
2
|
render: function Render(args) {
|
|
3
3
|
const [, updateArgs] = useArgs<ComponentProps<typeof StringListbox>>();
|
|
4
4
|
const value = typeof args.value === "string" ? args.value : "medium";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{n as e}from"./rolldown-runtime-DkW27tQK.js";import{n as t}from"./iframe-
|
|
1
|
+
import{n as e}from"./rolldown-runtime-DkW27tQK.js";import{n as t}from"./iframe-CizMDlW9.js";import{i as n,r}from"./react-Bl2r1tuC.js";import{a as i,d as a,f as o,l as s,m as c,n as l,p as u,r as d,u as f}from"./blocks-D29TdvdI.js";import{a as p,i as m,n as h,o as g,r as _,s as v,t as y}from"./Modal.stories-BrUWLwmT.js";function b(e){let t={code:`code`,h2:`h2`,h3:`h3`,li:`li`,p:`p`,pre:`pre`,ul:`ul`,...n(),...e.components};return(0,S.jsxs)(S.Fragment,{children:[(0,S.jsx)(s,{of:h,parameters:{docs:{toc:!0}}}),`
|
|
2
2
|
`,(0,S.jsx)(u,{children:`Modal`}),`
|
|
3
3
|
`,(0,S.jsx)(o,{children:`Составная модалка с контентом, toolbar и footer для пользовательских диалоговых сценариев`}),`
|
|
4
4
|
`,(0,S.jsx)(t.p,{children:`Modal уже имеет живые stories, а эта страница собирает их в структурированную документацию с краткими рекомендациями, примерами подключения и API.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a as e,n as t}from"./rolldown-runtime-DkW27tQK.js";import{t as n}from"./react-BZJXY1be.js";import{n as r,t as i}from"./x-
|
|
1
|
+
import{a as e,n as t}from"./rolldown-runtime-DkW27tQK.js";import{t as n}from"./react-BZJXY1be.js";import{n as r,t as i}from"./x-Buig9MSV.js";import{n as a}from"./iframe-CizMDlW9.js";import{t as o}from"./react-dom-BzEl8usk.js";import{a as s,i as c}from"./utils-tg3ibbzi.js";import{a as ee,n as te,r as l,t as ne}from"./dom-D9_dPJ4G.js";import{n as u,t as d}from"./FlexContainer-BK3kWiEq.js";import{n as f,t as re}from"./Button-CdRjxwHf.js";import{a as p,c as m,l as h,n as ie,o as g,r as _,s as v,t as y}from"./react-DlE-cCYf.js";import{n as b,t as x}from"./GridContainer-Dx_kHFve.js";import{n as S,t as C}from"./Scrollable-SCMKAvuD.js";function ae(){!v.current&&p();let[e]=(0,w.useState)(h.current);return e}var w;function T(){return(T=t((()=>{m(),g(),w=n()})))()}var E,D,O,k,A,j,M,N,P,F,I,L;function R(){return(R=t((()=>{E=`vGPUKV`,D=`WhUkxm`,O=`JDlse5`,k=`FaDKSt`,A=`NDgdMi`,j=`O7gb7P`,M=`RVq8v3`,N=`PCSUAL`,P=`XDCHzq`,F=`t1kl8L`,I=`o3PEEB`,L={modal:E,header:D,headerText:O,headerButton:k,body:A,sm:j,md:M,lg:N,xl:P,xxl:F,inside:I}})))()}var z,B,V;function H(){return(H=t((()=>{z={hidden:{opacity:0,scale:.96,y:12},visible:{opacity:1,scale:1,y:0}},B={duration:.18,ease:[.22,1,.36,1]},V={duration:0}})))()}var U,W,G;function K(){return(K=t((()=>{U=n(),W=(0,U.createContext)({modals:[],openModal:()=>{},closeModal:()=>{},isTopModal:()=>!1}),G=()=>(0,U.useContext)(W)})))()}function q({children:e,className:t}){return(0,Q.jsx)(`div`,{className:s(`surface2 paddingMd borderBottom`,t),children:e})}function J({children:e,className:t,scrollable:n}){return(0,Q.jsx)(`div`,{className:s(`paddingMd h100 overflowHidden`,t),children:n?(0,Q.jsx)(C,{className:`h100`,children:e}):e})}function Y({children:e,className:t}){return(0,Q.jsx)(`div`,{className:s(`surface2 borderTop paddingMd`,t),children:(0,Q.jsx)(d,{gap:`sm`,align:`center`,justify:`end`,children:e})})}function oe({isOpen:e,title:t,size:n=`sm`,height:r,onClose:a,children:o}){let c=(0,X.useId)(),l=(0,X.useId)(),{modals:u,openModal:d,closeModal:f,isTopModal:p}=G(),m=ae(),h=(0,X.useRef)(null),g=(0,X.useRef)(0),v={"--modal-height":r},y=e&&(u.length===0||p(c));(0,X.useEffect)(()=>{e&&(h.current=document.activeElement instanceof HTMLElement?document.activeElement:null)},[e]);let b=ee({active:e||!1,trapFocus:!0,restoreFocus:!1});te({active:y||!1,onDismiss:a,containerRef:b}),(0,X.useEffect)(()=>{e&&d(c)},[e,c,d]),(0,X.useEffect)(()=>()=>{window.cancelAnimationFrame(g.current),f(c)},[f,c]);function S(){f(c);let e=h.current;g.current=window.requestAnimationFrame(()=>{e?.isConnected&&e.focus(),h.current=null})}let C=ne(`modal-root`);if(!C)return null;let w=null,T=null,E=null,D=X.Children.toArray(o);for(let e of D)switch(e.type.displayName){case q.displayName:if(w)throw Error(`Modal: duplicate <Toolbar> found`);w=e;break;case Y.displayName:if(E)throw Error(`Modal: duplicate <Footer> found`);E=e;break;case J.displayName:if(T)throw Error(`Modal: duplicate <Content> found`);T=e}return(0,Z.createPortal)((0,Q.jsx)(_,{onExitComplete:S,children:e?(0,Q.jsxs)(ie.div,{ref:b,className:s(L.modal,L[n]),style:v,role:`dialog`,"aria-modal":`true`,"aria-labelledby":l,"aria-describedby":`${l}-content`,initial:`hidden`,animate:`visible`,exit:`hidden`,variants:z,transition:m?V:B,children:[(0,Q.jsxs)(`div`,{className:s(L.header,w?``:`borderBottom`),children:[(0,Q.jsx)(`h3`,{className:L.headerText,id:l,children:t}),(0,Q.jsx)(re,{icon:(0,Q.jsx)(i,{}),className:L.headerButton,variant:`ghost`,"aria-label":`Закрыть модальное окно`,onClick:a})]}),(0,Q.jsxs)(x,{id:`${l}-content`,templateRows:`${w?`auto`:``} 1fr ${E?`auto`:``}`.trim(),className:L.body,children:[w,T,E]})]}):null}),C)}var X,Z,Q;function $(){return($=t((()=>{X=e(n(),1),l(),c(),r(),y(),Z=o(),f(),u(),b(),S(),R(),H(),K(),Q=a(),q.displayName=`Modal.Toolbar`,J.displayName=`Modal.Content`,Y.displayName=`Modal.Footer`,q.__docgenInfo={description:``,methods:[],displayName:`Modal.Toolbar`,props:{children:{required:!0,tsType:{name:`ReactReactNode`,raw:`React.ReactNode`},description:``},className:{required:!1,tsType:{name:`string`},description:``}}},J.__docgenInfo={description:``,methods:[],displayName:`Modal.Content`,props:{children:{required:!0,tsType:{name:`ReactReactNode`,raw:`React.ReactNode`},description:``},className:{required:!1,tsType:{name:`string`},description:``},scrollable:{required:!1,tsType:{name:`boolean`},description:``}}},Y.__docgenInfo={description:``,methods:[],displayName:`Modal.Footer`,props:{children:{required:!0,tsType:{name:`ReactReactNode`,raw:`React.ReactNode`},description:``},className:{required:!1,tsType:{name:`string`},description:``}}}})))()}export{$ as a,T as c,q as i,J as n,W as o,Y as r,K as s,oe as t};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{n as e,r as t}from"./rolldown-runtime-DkW27tQK.js";import{t as n}from"./react-BZJXY1be.js";import{n as r}from"./iframe-
|
|
1
|
+
import{n as e,r as t}from"./rolldown-runtime-DkW27tQK.js";import{t as n}from"./react-BZJXY1be.js";import{n as r}from"./iframe-CizMDlW9.js";import{n as i,t as a}from"./Button-CdRjxwHf.js";import{a as o,i as s,n as c,r as l,t as u}from"./Modal-Chsv1ktM.js";import{n as d,t as f}from"./ModalManagerProvider-Bzz6KbJq.js";import{l as p,t as m}from"./Input-BOFE5lvG.js";var h=t({Controlled:()=>w,ScrollableContent:()=>E,Sizes:()=>D,StackedModals:()=>O,WithToolbarAndFooter:()=>T,__namedExportsOrder:()=>k,default:()=>C});function g({children:e}){return(0,b.jsx)(`div`,{style:{minHeight:`60dvh`,padding:24,display:`flex`,alignItems:`center`,justifyContent:`center`},children:e})}function _(){let[e,t]=(0,y.useState)(`Алексей`),[n,r]=(0,y.useState)(`Департамент автоматизации бизнеса`);return(0,b.jsxs)(`div`,{style:{display:`grid`,gap:16},children:[(0,b.jsx)(m,{label:`Имя`,value:e,onChange:t,placeholder:`Введите имя`}),(0,b.jsx)(m,{label:`Подразделение`,value:n,onChange:r,placeholder:`Введите подразделение`}),(0,b.jsxs)(`div`,{style:{padding:12,borderRadius:8,background:`var(--surface-1)`,border:`1px solid var(--border-1)`},children:[`Текущие значения: `,e||`не указано`,`, `,n||`не указано`]})]})}function v(){let[e,t]=x();return{args:e,updateArgs:t,close:()=>{e.onClose(),t({isOpen:!1})}}}var y,b,x,S,C,w,T,E,D,O,k;function A(){return(A=e((()=>{y=n(),i(),p(),o(),d(),b=r(),{useArgs:x}=__STORYBOOK_MODULE_PREVIEW_API__,{fn:S}=__STORYBOOK_MODULE_TEST__,C={title:`UI/Modal`,component:u,parameters:{atomicCanvas:!0,layout:`fullscreen`,docs:{description:{component:"Композиционная модалка с `Toolbar`, `Content` и `Footer`, поддержкой focus trap, возврата фокуса, закрытия по `Escape` и менеджером стека через `ModalManagerProvider`."}}},decorators:[e=>(0,b.jsx)(f,{children:(0,b.jsx)(g,{children:e()})})],args:{isOpen:!1,title:`Редактирование профиля`,size:`md`,height:void 0,onClose:S(),children:(0,b.jsxs)(b.Fragment,{children:[(0,b.jsx)(c,{children:(0,b.jsx)(_,{})}),(0,b.jsxs)(l,{children:[(0,b.jsx)(a,{variant:`transparent`,children:`Отмена`}),(0,b.jsx)(a,{children:`Сохранить`})]})]})},argTypes:{isOpen:{description:`Управляет видимостью модального окна.`,control:`boolean`},title:{description:`Заголовок модального окна.`,control:`text`},size:{description:`Предустановленный размер модального окна.`,control:`inline-radio`,options:[`sm`,`md`,`lg`,`xl`,`xxl`,`inside`]},height:{description:`Явная высота модалки выше мобильного breakpoint. На мобильном модалка всегда занимает весь экран.`,control:`text`},onClose:{description:"Вызывается при закрытии по кнопке, `Escape` или пользовательскому действию.",control:!1},children:{description:"Композиция из `ModalToolbar`, `ModalContent`, `ModalFooter`.",control:!1}}},w={name:`Управляемая модалка`,render:function(){let{args:e,close:t,updateArgs:n}=v();return(0,b.jsxs)(b.Fragment,{children:[(0,b.jsx)(a,{onClick:()=>n({isOpen:!0}),children:`Открыть модалку`}),(0,b.jsxs)(u,{...e,isOpen:e.isOpen,onClose:t,children:[(0,b.jsx)(c,{children:(0,b.jsx)(_,{})}),(0,b.jsxs)(l,{children:[(0,b.jsx)(a,{variant:`transparent`,onClick:t,children:`Отмена`}),(0,b.jsx)(a,{onClick:t,children:`Сохранить`})]})]})]})}},T={name:`Полная композиция`,args:{title:`Редактирование профиля`,height:`min(34rem, 70dvh)`},render:function(){let{args:e,close:t,updateArgs:n}=v();return(0,b.jsxs)(b.Fragment,{children:[(0,b.jsx)(a,{onClick:()=>n({isOpen:!0}),children:`Открыть сценарий редактирования`}),(0,b.jsxs)(u,{...e,isOpen:e.isOpen,onClose:t,children:[(0,b.jsx)(s,{children:(0,b.jsxs)(`div`,{style:{display:`flex`,alignItems:`center`,justifyContent:`space-between`,gap:12,padding:12,borderRadius:8,background:`var(--surface-1)`,border:`1px solid var(--border-1)`},children:[(0,b.jsxs)(`div`,{children:[(0,b.jsx)(`div`,{style:{fontWeight:600},children:`Черновик обновлён автоматически`}),(0,b.jsx)(`div`,{style:{opacity:.72},children:`Последнее сохранение: 2 минуты назад`})]}),(0,b.jsx)(a,{variant:`transparent`,children:`Сбросить`})]})}),(0,b.jsx)(c,{children:(0,b.jsx)(_,{})}),(0,b.jsxs)(l,{children:[(0,b.jsx)(a,{variant:`transparent`,onClick:t,children:`Отмена`}),(0,b.jsx)(a,{variant:`success`,onClick:t,children:`Применить`})]})]})]})}},E={name:`Длинный контент`,args:{size:`lg`,title:`Журнал изменений`},render:function(){let{args:e,close:t,updateArgs:n}=v();return(0,b.jsxs)(b.Fragment,{children:[(0,b.jsx)(a,{onClick:()=>n({isOpen:!0}),children:`Открыть длинный контент`}),(0,b.jsxs)(u,{...e,isOpen:e.isOpen,onClose:t,children:[(0,b.jsx)(c,{scrollable:!0,children:(0,b.jsx)(`div`,{style:{display:`grid`,gap:12},children:Array.from({length:18},(e,t)=>(0,b.jsxs)(`div`,{style:{padding:12,borderRadius:8,border:`1px solid var(--border-1)`,background:`var(--surface-1)`},children:[(0,b.jsxs)(`div`,{style:{fontWeight:600},children:[`Событие #`,t+1]}),(0,b.jsx)(`div`,{style:{opacity:.72},children:`Пользователь обновил настройки карточки, изменил состав полей и подтвердил сохранение конфигурации.`})]},t))})}),(0,b.jsx)(l,{children:(0,b.jsx)(a,{onClick:t,children:`Закрыть`})})]})]})}},D={name:`Размеры`,args:{size:`sm`,title:`Размер SM`},render:function(){let{args:e,close:t,updateArgs:n}=v();return(0,b.jsxs)(b.Fragment,{children:[(0,b.jsx)(`div`,{style:{display:`flex`,flexWrap:`wrap`,gap:12,justifyContent:`center`},children:[`sm`,`md`,`lg`,`xl`,`xxl`,`inside`].map(e=>(0,b.jsx)(a,{variant:`transparent`,onClick:()=>n({isOpen:!0,size:e,title:`Размер ${e.toUpperCase()}`}),children:e.toUpperCase()},e))}),(0,b.jsxs)(u,{...e,isOpen:e.isOpen,onClose:t,children:[(0,b.jsx)(c,{children:(0,b.jsxs)(`div`,{style:{display:`grid`,gap:12},children:[(0,b.jsx)(`div`,{children:`Этот сценарий помогает быстро сравнить ширину и поведение модалки для разных размеров.`}),(0,b.jsx)(`div`,{style:{opacity:.72},children:"Проверьте отступы, читабельность и поведение при `Escape`."})]})}),(0,b.jsx)(l,{children:(0,b.jsx)(a,{onClick:t,children:`Понятно`})})]})]})}},O={name:`Стек модалок`,args:{size:`lg`,title:`Первая модалка`},render:function(){let{args:e,updateArgs:t}=v(),[n,r]=(0,y.useState)(!1),i=()=>{r(!1),e.onClose(),t({isOpen:!1})};return(0,b.jsxs)(b.Fragment,{children:[(0,b.jsx)(a,{onClick:()=>t({isOpen:!0}),children:`Открыть первую модалку`}),(0,b.jsxs)(u,{...e,isOpen:e.isOpen,onClose:i,children:[(0,b.jsx)(c,{children:(0,b.jsxs)(`div`,{style:{display:`grid`,gap:16},children:[(0,b.jsx)(`div`,{children:"Откройте вторую модалку и проверьте, что `Escape` закрывает только верхний слой."}),(0,b.jsx)(a,{variant:`transparent`,onClick:()=>r(!0),children:`Открыть вторую модалку`})]})}),(0,b.jsx)(l,{children:(0,b.jsx)(a,{variant:`transparent`,onClick:i,children:`Закрыть первую`})})]}),(0,b.jsxs)(u,{isOpen:n,onClose:()=>r(!1),size:`sm`,title:`Вторая модалка`,children:[(0,b.jsx)(c,{children:(0,b.jsxs)(`div`,{style:{display:`grid`,gap:12},children:[(0,b.jsx)(`div`,{children:`Эта модалка должна считаться верхней в стеке.`}),(0,b.jsx)(m,{label:`Короткое поле`,value:`Фокус внутри`,onChange:()=>{}})]})}),(0,b.jsx)(l,{children:(0,b.jsx)(a,{onClick:()=>r(!1),children:`Закрыть вторую`})})]})]})}},w.parameters={...w.parameters,docs:{...w.parameters?.docs,source:{originalSource:`{
|
|
2
2
|
name: "Управляемая модалка",
|
|
3
3
|
render: function Render() {
|
|
4
4
|
const {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a as e,n as t}from"./rolldown-runtime-DkW27tQK.js";import{t as n}from"./react-BZJXY1be.js";import{n as r}from"./iframe-
|
|
1
|
+
import{a as e,n as t}from"./rolldown-runtime-DkW27tQK.js";import{t as n}from"./react-BZJXY1be.js";import{n as r}from"./iframe-CizMDlW9.js";import{o as i,s as a}from"./Modal-Chsv1ktM.js";function o({children:e,compensateScrollbar:t=!1}){let[n,r]=(0,s.useState)([]),a=(0,s.useRef)(0),o=(0,s.useRef)(0),l=(0,s.useRef)(``),u=(0,s.useRef)(!1),d=(0,s.useCallback)(e=>{r(t=>[...t,e])},[]),f=(0,s.useCallback)(e=>{r(t=>t.filter(t=>t!==e))},[]),p=(0,s.useCallback)(e=>n[n.length-1]===e,[n]);return(0,s.useEffect)(()=>{let e=a.current===0;if(e&&n.length>0){let e=window.scrollY,r=document.querySelector(`#app-root`);o.current=Math.max(0,window.innerWidth-document.documentElement.clientWidth),l.current=document.body.style.paddingRight,document.body.style.position=`fixed`,document.body.style.top=`-${e}px`,document.body.style.width=`100%`,t&&(document.body.style.paddingRight=`${o.current}px`,u.current=!0),r?.setAttribute(`inert`,`true`),a.current=n.length;return}if(!e&&n.length>0&&t!==u.current&&(document.body.style.paddingRight=t?`${o.current}px`:l.current,u.current=t),!e&&n.length===0){let e=document.querySelector(`#app-root`),t=parseInt(document.body.style.top||`0`)*-1;document.body.style.position=``,document.body.style.top=``,document.body.style.width=``,u.current&&=(document.body.style.paddingRight=l.current,!1),e?.removeAttribute(`inert`),window.scrollTo({top:t,left:0,behavior:`instant`})}a.current=n.length},[t,n.length]),(0,c.jsx)(i.Provider,{value:{modals:n,openModal:d,closeModal:f,isTopModal:p},children:e})}var s,c;function l(){return(l=t((()=>{s=e(n(),1),a(),c=r(),o.__docgenInfo={description:`Провайдер для централизованного управления стеком модальных окон. Дает вложенным компонентам доступ к открытию и закрытию модалок через контекст.`,methods:[],displayName:`ModalManagerProvider`,props:{children:{required:!0,tsType:{name:`ReactReactNode`,raw:`React.ReactNode`},description:``},compensateScrollbar:{required:!1,tsType:{name:`boolean`},description:`Компенсирует исчезновение скроллбара правым padding у body.`,defaultValue:{value:`false`,computed:!1}}}}})))()}export{l as n,o as t};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{n as e}from"./rolldown-runtime-DkW27tQK.js";import{n as t}from"./iframe-
|
|
1
|
+
import{n as e}from"./rolldown-runtime-DkW27tQK.js";import{n as t}from"./iframe-CizMDlW9.js";import{i as n,r}from"./react-Bl2r1tuC.js";import{a as i,d as a,f as o,l as s,m as c,n as l,p as u,r as d,u as f}from"./blocks-D29TdvdI.js";import{a as p,i as m,n as h,o as g,r as _,t as v}from"./MultiSelect.stories-B2wnVhGS.js";function y(e){let t={code:`code`,h2:`h2`,h3:`h3`,li:`li`,p:`p`,pre:`pre`,ul:`ul`,...n(),...e.components};return(0,x.jsxs)(x.Fragment,{children:[(0,x.jsx)(s,{of:p,parameters:{docs:{toc:!0}}}),`
|
|
2
2
|
`,(0,x.jsx)(u,{children:`MultiSelect`}),`
|
|
3
3
|
`,(0,x.jsx)(o,{children:`Мультиселект для локальных коллекций с токенами, поиском и состояниями загрузки`}),`
|
|
4
4
|
`,(0,x.jsx)(t.p,{children:`MultiSelect уже имеет живые stories, а эта страница собирает их в структурированную документацию с краткими рекомендациями, примерами подключения и API.
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{a as e,n as t}from"./rolldown-runtime-DkW27tQK.js";import{t as n}from"./react-BZJXY1be.js";import{n as r,t as i}from"./CheckBox-
|
|
1
|
+
import{a as e,n as t}from"./rolldown-runtime-DkW27tQK.js";import{t as n}from"./react-BZJXY1be.js";import{n as r,t as i}from"./CheckBox-Dxyvwx9w.js";import{n as a}from"./iframe-CizMDlW9.js";import{n as o,t as s}from"./Text-IQqUM-6S.js";import{n as c,t as l}from"./ui.module-0uniSGT-.js";import{n as u,t as ee}from"./PickerField-BEMDq9NM.js";import{c as d,i as te,l as f,n as p,r as m,s as h,t as g,u as _}from"./usePickerTriggerController-BBzr2WZB.js";import{n as v,t as ne}from"./Separator-DOk-N_yT.js";import{n as y,t as re}from"./Option-DtZ6Qlvd.js";import{i as b,n as ie,r as x,t as S}from"./usePickerQuery-Dn0Nghs1.js";import{n as ae,t as C}from"./usePickerDefaultFilter-ien2ZY7g.js";import{a as oe,i as w,n as se,o as T,s as ce,t as le}from"./defaultRenderers-UxEpV_2H.js";import{n as ue,t as E}from"./OptionButton-BQo4zeny.js";var D,O,k,A;function j(){return(j=t((()=>{D=`_9oSdQi`,O=`d9SDKQ`,k=`xCo7w9`,A={multiSelect:D,optionCheckBox:O,optionActionCell:k}})))()}function M({text:e,isError:t}){return(0,N.jsxs)(`div`,{className:c.uiPopupOption,children:[(0,N.jsx)(`span`,{className:c.uiPopupOptionIcon}),(0,N.jsx)(s,{color:t?`error`:`primary`,children:e})]})}var N;function P(){return(P=t((()=>{o(),l(),N=a(),M.__docgenInfo={description:"Скелетон строки опции для `MultiSelect`. Используется во время загрузки или при отображении ошибок получения списка.",methods:[],displayName:`MultiSelectOptionSkeleton`,props:{text:{required:!0,tsType:{name:`string`},description:``},isError:{required:!1,tsType:{name:`boolean`},description:``}}}})))()}function de({isNoData:e,error:t,children:n}){return e?(0,R.jsx)(x,{emptyState:(0,R.jsx)(M,{text:`Нет данных`})}):t?(0,R.jsx)(x,{errorState:(0,R.jsx)(M,{isError:!0,text:`Ошибка загрузки`})}):(0,R.jsx)(R.Fragment,{children:n})}function F(e,t){return e[t]}function fe(e,t,n){return Array.from(new Set([e[n],e[t],...Object.values(e)]))}function pe(e,t,n){if(e.length!==t.length)return!1;let r=new Set(t.map(e=>F(e,n)));return e.every(e=>r.has(F(e,n)))}function me({entries:e,listId:t,activeIndex:n,selectedKeys:r,codeKey:a,query:o,highlightQuery:s,getOptionDisabled:c,getOptionId:l,setOptionRef:u,toggleOption:ee,selectOnlyOption:d,renderItem:te}){return e.map(({item:e,index:f})=>{let p=f===n,m=F(e,a),h=r.has(m),g=c?.(e)??!1,_=te(e,{selected:h,active:p,disabled:g,query:o,highlightQuery:s});return(0,R.jsxs)(re,{id:l(t,f),ref:e=>u(f,e),role:`row`,"aria-selected":h,"aria-disabled":g||void 0,selected:h,active:p,disabled:g,children:[(0,R.jsx)(`div`,{role:`gridcell`,className:A.optionCheckBox,onMouseDown:e=>e.stopPropagation(),onClick:e=>e.stopPropagation(),children:(0,R.jsx)(i,{value:h,disabled:g,"aria-label":`${h?`Убрать`:`Добавить`} «${_.text}» ${h?`из выбора`:`в выбор`}`,onChange:()=>ee(e)})}),(0,R.jsx)(`div`,{role:`gridcell`,className:A.optionActionCell,children:(0,R.jsx)(E,{tabIndex:-1,disabled:g,"aria-label":`Выбрать только «${_.text}»`,text:_.text,code:_.code,searchText:s,onMouseDown:e=>e.preventDefault(),onClick:()=>d(e)})})]},`${m}-${f}`)})}function I({ref:e,codeKey:t,textKey:n,hideCode:r,items:i,value:a,onChange:o,label:s,description:c,placeholder:l,size:u,query:d,defaultQuery:m,highlightQuery:g,onQuery:_,defaultFilter:v=!0,onOpen:y,onClose:re,getOptionDisabled:b,disabled:x,error:S,isLoading:C,renderToken:w,renderToolbar:T,renderItem:ue}){let E=(0,L.useRef)(null),[D,O]=(0,L.useState)(!1),k=`search-multi`,j=a??z,M=(0,L.useMemo)(()=>new Set(j.map(e=>F(e,t))),[t,j]),N=(0,L.useMemo)(()=>i.filter(e=>!M.has(F(e,t))),[t,M,i]),P=(0,L.useMemo)(()=>oe([...j,...i],t,n),[t,j,i,n]),{query:I,setQuery:B,resetQueryOnClose:he}=ie({query:d,defaultQuery:m,onQuery:_,triggerMode:k}),ge=e=>{D&&!e&&he&&B(``),O(e)},V=ae({options:j,query:I,enabled:v,getSearchText:e=>fe(e,t,P)}),H=ae({options:N,query:I,enabled:v,getSearchText:e=>fe(e,t,P)}),U=(0,L.useMemo)(()=>[...V,...H],[H,V]),_e=V.length>0?0:-1,{draftValue:W,setDraftValue:G,prepareOpen:ve}=ce({value:j,open:D,onCommit:o,onOpen:y,onClose:re,isEqual:(e,n)=>pe(e,n,t)}),K=(0,L.useMemo)(()=>new Set(W.map(e=>F(e,t))),[t,W]),q=(0,L.useMemo)(()=>({selectedItems:W,committedSelectedItems:j,selectedKeys:K,open:D}),[j,W,D,K]),J=(0,L.useCallback)(e=>b?.(e,q)??!1,[b,q]),{activeIndex:Y,context:ye,floatingStyles:be,getFloatingProps:xe,setReference:Se,setFloating:Ce,setOptionRef:we,close:Te,openList:Ee,toggleOpen:De,handleReferenceKeyDown:Oe,handleFloatingKeyDown:ke,getOptionId:Ae,getActiveOptionId:je}=te({options:U,selectedIndex:_e,open:D,onOpenChange:ge,onSelect:void 0,disabled:x,getOptionDisabled:J,closeOnSelect:!1,allowOpenWithoutOptions:!0,triggerMode:k}),Me=g??I,X=e=>{let n=F(e,t);G(r=>r.some(e=>F(e,t)===n)?r.filter(e=>F(e,t)!==n):J(e)?r:[...r,e])},Ne=t=>{if(E.current=t,typeof e==`function`){e(t);return}e&&(e.current=t)},Pe=()=>{G([]),D||o([])},Fe=()=>{G(e=>{let n=[...e],r=new Set(e.map(e=>F(e,t)));for(let e of U){let i=F(e,t);!r.has(i)&&!J(e)&&(r.add(i),n.push(e))}return n})},Ie=()=>{G([])},Z=e=>{J(e)||(G([e]),Te())},Le=D?W:j,Re=Le.length>0,ze={selectedItems:Le,committedSelectedItems:j,availableItems:H,query:I,open:D,clearSelection:Pe,selectAll:Fe,deselectAll:Ie},Be=w===void 0?se({codeKey:t,textKey:P}):w,Ve=ue??le({codeKey:t,textKey:P,hideCode:r}),He=typeof Be==`function`?Be(ze):null,Ue=typeof T==`function`?T(ze):T,Q=V.map((e,t)=>({item:e,index:t})),We=H.map((e,t)=>({item:e,index:t+Q.length})),Ge=!C&&!S&&U.length===0,$=p({mode:k,open:D,currentQuery:I,hasDisplayValue:!1,inputRef:E,setQuery:B,openList:Ee,close:Te,toggleOpen:De,onBeforeOpen:()=>{D||ve()}});return(0,R.jsx)(ee,{label:s,description:c,disabled:x,size:u,className:A.multiSelect,children:({controlId:e,labelId:n,describedBy:r})=>{let a=`${e}-grid`;return(0,R.jsxs)(R.Fragment,{children:[(0,R.jsx)(h,{ref:Ne,rootRef:Se,id:e,type:`text`,role:`combobox`,autoComplete:`off`,isLoading:C,disabled:x,open:D,optionCount:i.length,label:s,placeholder:l,placeholderFallback:`Выберите значения`,value:I,selectedValue:He,hasSelection:Re,showSelectedValue:Re&&I.length===0,clearable:!0,onClear:Pe,clearAriaLabel:`Очистить все`,onToggleMouseDown:$.handleToggleMouseDown,onToggleClick:$.handleToggleClick,"aria-labelledby":n,"aria-describedby":r,"aria-haspopup":`grid`,"aria-expanded":D,"aria-controls":D?a:void 0,"aria-autocomplete":`list`,"aria-activedescendant":D?je(a):void 0,rootClassName:`flex alignItemsCenter`,onChange:e=>{$.handleTriggerInputChange(e.target.value)},onClick:$.handleTriggerClick,onFocus:e=>{$.handleTriggerFocus(e.currentTarget)},onKeyDown:e=>{if(Oe(e),!e.defaultPrevented){if(D&&e.ctrlKey&&e.key===` `){e.preventDefault();let t=U[Y];t&&X(t);return}$.handleTriggerKeyDown({event:e,onActivateWhenOpen:()=>{let e=U[Y];e&&Z(e)},enableClosedArrowDownOpen:!0,suppressClosedArrowUp:!0})}}}),(0,R.jsx)(f,{open:D,context:ye,floatingStyles:be,listId:a,labelId:n,descriptionId:r,activeOptionId:D?je(a):void 0,ariaMultiselectable:!0,popupRole:`grid`,setFloating:Ce,getFloatingProps:xe,onKeyDown:ke,initialFocus:-1,returnFocus:!1,tabIndex:-1,toolbar:Ue,selectionActions:T===void 0?{onSelectAll:Fe,onDeselectAll:Ie}:void 0,children:(0,R.jsx)(de,{isNoData:Ge,error:S,children:(0,R.jsxs)(`div`,{role:`presentation`,className:`scrollable overscroll h100`,children:[(0,R.jsx)(me,{entries:Q,listId:a,activeIndex:Y,selectedKeys:K,codeKey:t,query:I,highlightQuery:Me,getOptionDisabled:J,getOptionId:Ae,setOptionRef:we,toggleOption:X,selectOnlyOption:Z,renderItem:Ve}),Q.length>0&&N.length>0&&(0,R.jsx)(ne,{"aria-hidden":`true`,className:`marginBlockSm`}),(0,R.jsx)(me,{entries:We,listId:a,activeIndex:Y,selectedKeys:K,codeKey:t,query:I,highlightQuery:Me,getOptionDisabled:J,getOptionId:Ae,setOptionRef:we,toggleOption:X,selectOnlyOption:Z,renderItem:Ve})]})})})]})}})}var L,R,z;function B(){return(B=t((()=>{L=e(n(),1),r(),y(),ue(),u(),_(),b(),d(),C(),m(),S(),T(),g(),v(),w(),j(),P(),R=a(),z=[],I.displayName=`MultiSelect`,I.__docgenInfo={description:`Поле множественного выбора с внутренним черновиком значений и подтверждением выбора при закрытии списка.
|
|
2
2
|
Подходит как для самостоятельного использования, так и как базовый слой для OData-оберток.`,methods:[],displayName:`MultiSelect`,props:{renderToken:{required:!1,tsType:{name:`union`,raw:`((context: TContext) => React.ReactNode) | null | false`,elements:[{name:`unknown`},{name:`null`},{name:`literal`,value:`false`}]},description:``},renderToolbar:{required:!1,tsType:{name:`union`,raw:`((context: TContext) => React.ReactNode) | null | false`,elements:[{name:`unknown`},{name:`null`},{name:`literal`,value:`false`}]},description:``},renderItem:{required:!1,tsType:{name:`signature`,type:`function`,raw:`(item: CollectionItem, state: MultiSelectItemState) => MultiSelectOptionContent`,signature:{arguments:[{type:{name:`CollectionItem`},name:`item`},{type:{name:`MultiSelectItemState`},name:`state`}],return:{name:`MultiSelectOptionContent`}}},description:``},label:{required:!1,tsType:{name:`ReactNode`},description:``},description:{required:!1,tsType:{name:`string`},description:``},placeholder:{required:!1,tsType:{name:`string`},description:``},disabled:{required:!1,tsType:{name:`boolean`},description:``},size:{required:!1,tsType:{name:`union`,raw:`"xs" | "sm" | "md" | "lg" | "xl"`,elements:[{name:`literal`,value:`"xs"`},{name:`literal`,value:`"sm"`},{name:`literal`,value:`"md"`},{name:`literal`,value:`"lg"`},{name:`literal`,value:`"xl"`}]},description:``},value:{required:!0,tsType:{name:`V`},description:"Если начальное состояние может быть `null | undefined`\nзначит `onChange` тоже должен ументь сбрасывать.\nПоэтому такой контрол явно должен передавать `UiBaseProps<AnyType | undefined>`"},onChange:{required:!0,tsType:{name:`signature`,type:`function`,raw:`(value: T) => void`,signature:{arguments:[{type:{name:`C`},name:`value`}],return:{name:`void`}}},description:``},codeKey:{required:!0,tsType:{name:`string`},description:``},textKey:{required:!1,tsType:{name:`string`},description:``},hideCode:{required:!1,tsType:{name:`boolean`},description:``},query:{required:!1,tsType:{name:`string`},description:``},defaultQuery:{required:!1,tsType:{name:`string`},description:``},highlightQuery:{required:!1,tsType:{name:`string`},description:``},onQuery:{required:!1,tsType:{name:`signature`,type:`function`,raw:`(value: string) => void`,signature:{arguments:[{type:{name:`string`},name:`value`}],return:{name:`void`}}},description:``},defaultFilter:{required:!1,tsType:{name:`boolean`},description:``,defaultValue:{value:`true`,computed:!1}},items:{required:!0,tsType:{name:`Array`,elements:[{name:`TOption`}],raw:`TOption[]`},description:``},getOptionDisabled:{required:!1,tsType:{name:`signature`,type:`function`,raw:`(item: TOption, context: MultiSelectOptionDisableContext) => boolean`,signature:{arguments:[{type:{name:`TOption`},name:`item`},{type:{name:`MultiSelectOptionDisableContext`},name:`context`}],return:{name:`boolean`}}},description:``},onOpen:{required:!1,tsType:{name:`signature`,type:`function`,raw:`() => void`,signature:{arguments:[],return:{name:`void`}}},description:``},onClose:{required:!1,tsType:{name:`signature`,type:`function`,raw:`(value: TOption[]) => void`,signature:{arguments:[{type:{name:`Array`,elements:[{name:`TOption`}],raw:`TOption[]`},name:`value`}],return:{name:`void`}}},description:``},error:{required:!1,tsType:{name:`string`},description:``},isLoading:{required:!1,tsType:{name:`boolean`},description:``},ref:{required:!1,tsType:{name:`Ref`,elements:[{name:`HTMLInputElement`}],raw:`Ref<HTMLInputElement>`},description:``}}}})))()}export{B as n,I as t};
|
package/storybook-static/assets/{MultiSelect.stories-DKHPBUWD.js → MultiSelect.stories-B2wnVhGS.js}
RENAMED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{n as e,r as t}from"./rolldown-runtime-DkW27tQK.js";import{t as n}from"./react-BZJXY1be.js";import{n as r}from"./iframe-
|
|
1
|
+
import{n as e,r as t}from"./rolldown-runtime-DkW27tQK.js";import{t as n}from"./react-BZJXY1be.js";import{n as r}from"./iframe-CizMDlW9.js";import{n as i,t as a}from"./MultiSelect-odpQ0Zm5.js";var o=t({Basic:()=>p,Empty:()=>g,ErrorState:()=>h,Loading:()=>m,__namedExportsOrder:()=>_,default:()=>f}),s,c,l,u,d,f,p,m,h,g,_;function v(){return(v=e((()=>{s=n(),i(),c=r(),{useArgs:l}=__STORYBOOK_MODULE_PREVIEW_API__,{fn:u}=__STORYBOOK_MODULE_TEST__,d=[{code:`MOW`,label:`Москва`},{code:`SPB`,label:`Санкт-Петербург`},{code:`EKB`,label:`Екатеринбург`},{code:`KZN`,label:`Казань`},{code:`NSK`,label:`Новосибирск`}],f={title:`UI/MultiSelect`,component:a,args:{label:`Города`,description:`Выберите несколько значений.`,placeholder:`Начните вводить`,value:[],onChange:u(),codeKey:`code`,textKey:`label`,items:d,query:``,onQuery:u(),onOpen:()=>{},onClose:u(),size:`md`,disabled:!1},parameters:{atomicCanvas:!0,layout:`padded`},argTypes:{label:{description:`Заголовок поля.`,control:`text`},description:{description:`Описание под полем.`,control:`text`},placeholder:{description:`Текст пустого поля.`,control:`text`},value:{description:`Контролируемый набор выбранных option.`,control:!1},onChange:{description:`Вызывается после подтверждения набора option.`,control:!1},codeKey:{description:`Имя поля option с уникальным ключом.`,control:`text`},textKey:{description:`Имя поля option с отображаемым текстом.`,control:`text`},hideCode:{description:`Скрывает код option в токенах и списке.`,control:`boolean`},items:{description:`Набор доступных option.`,control:!1},query:{description:`Контролируемый текст поиска.`,control:`text`},defaultQuery:{description:`Начальный текст поиска в uncontrolled-режиме.`,control:`text`},highlightQuery:{description:`Текст, который подсвечивается в option.`,control:`text`},onQuery:{description:`Вызывается при вводе поисковой строки.`,control:!1},defaultFilter:{description:`Включает встроенную фильтрацию option.`,control:`boolean`},getOptionDisabled:{description:`Блокирует отдельные option с учетом текущего выбора.`,control:!1},onOpen:{description:`Вызывается при открытии списка.`,control:!1},onClose:{description:`Вызывается при закрытии списка после commit.`,control:!1},error:{description:`Текст ошибки загрузки option.`,control:`text`},isLoading:{description:`Показывает состояние загрузки option.`,control:`boolean`},renderToken:{description:`Кастомный рендер выбранных токенов.`,control:!1},renderToolbar:{description:`Кастомный рендер toolbar popup.`,control:!1},renderItem:{description:`Возвращает text, code и searchText для общей композиции OptionButton.`,control:!1},disabled:{description:`Блокирует взаимодействие с полем.`,control:`boolean`},size:{description:`Размер поля и подписей.`,control:`select`,options:[`xs`,`sm`,`md`,`lg`,`xl`]}}},p={render:function(e){let[,t]=l(),n=e.value??[d[1]],r=e.query??``,i=(0,s.useMemo)(()=>{let e=r.trim().toLowerCase();return e?d.filter(t=>t.label.toLowerCase().includes(e)||t.code.toLowerCase().includes(e)):d},[r]);return(0,c.jsx)(a,{...e,value:n,items:i,query:r,onQuery:n=>{e.onQuery?.(n),t({query:n})},onChange:n=>{e.onChange(n),t({value:n})}})}},m={render:function(e){let[,t]=l();return(0,c.jsx)(a,{...e,value:e.value??[],items:[],isLoading:!0,onChange:n=>{e.onChange(n),t({value:n})}})}},h={render:function(e){let[,t]=l();return(0,c.jsx)(a,{...e,value:e.value??[],items:[],error:`Ошибка загрузки`,onChange:n=>{e.onChange(n),t({value:n})}})}},g={render:function(e){let[,t]=l();return(0,c.jsx)(a,{...e,value:e.value??[],items:[],onChange:n=>{e.onChange(n),t({value:n})}})}},p.parameters={...p.parameters,docs:{...p.parameters?.docs,source:{originalSource:`{
|
|
2
2
|
render: function Render(args) {
|
|
3
3
|
const [, updateArgs] = useArgs<React.ComponentProps<typeof MultiSelect>>();
|
|
4
4
|
const value = args.value ?? [catalog[1]!];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{n as e}from"./rolldown-runtime-DkW27tQK.js";import{n as t}from"./iframe-
|
|
1
|
+
import{n as e}from"./rolldown-runtime-DkW27tQK.js";import{n as t}from"./iframe-CizMDlW9.js";import{a as n,i as r}from"./utils-tg3ibbzi.js";import{n as i,t as a}from"./Text-IQqUM-6S.js";function o({className:e,minHeight:t,children:r,style:i,...a}){let o=t===void 0?i:{...i,minHeight:t};return(0,s.jsx)(`div`,{...a,className:n(`flexCenter h100`,e),style:o,children:r})}var s;function c(){return(c=e((()=>{r(),s=t(),o.__docgenInfo={description:``,methods:[],displayName:`FlexCenter`,props:{children:{required:!1,tsType:{name:`ReactNode`},description:``},minHeight:{required:!1,tsType:{name:`union`,raw:`string | number`,elements:[{name:`string`},{name:`number`}]},description:``}},composes:[`Omit`]}})))()}var l,u;function d(){return(d=e((()=>{l=`qgIKVo`,u={componentLoader:l}})))()}function f({className:e,children:t,color:r=`muted`,role:i,minHeight:s,uppercase:c=!0}){return(0,p.jsx)(o,{className:n(`paddingMd textCenter`,e),minHeight:s,children:(0,p.jsx)(a,{as:`p`,weight:`bold`,color:r,uppercase:c,role:i,children:t})})}var p;function m(){return(m=e((()=>{r(),c(),i(),p=t(),f.__docgenInfo={description:``,methods:[],displayName:`Message`,props:{className:{required:!1,tsType:{name:`string`},description:``},color:{required:!1,tsType:{name:`union`,raw:`"primary" | "secondary" | "muted" | "error" | "warning" | "success" | "info" | "brand" | "accent"`,elements:[{name:`literal`,value:`"primary"`},{name:`literal`,value:`"secondary"`},{name:`literal`,value:`"muted"`},{name:`literal`,value:`"error"`},{name:`literal`,value:`"warning"`},{name:`literal`,value:`"success"`},{name:`literal`,value:`"info"`},{name:`literal`,value:`"brand"`},{name:`literal`,value:`"accent"`}]},description:``,defaultValue:{value:`"muted"`,computed:!1}},minHeight:{required:!1,tsType:{name:`union`,raw:`string | number`,elements:[{name:`string`},{name:`number`}]},description:``},uppercase:{required:!1,tsType:{name:`boolean`},description:``,defaultValue:{value:`true`,computed:!1}},role:{required:!1,tsType:{name:`AriaRole`},description:``}},composes:[`PropsWithChildren`]}})))()}function h({className:e,logo:t,text:r}){return(0,g.jsxs)(f,{className:n(u.componentLoader,t?void 0:`skeletonLine`,e),children:[t,r||`Загрузка...`]})}var g;function _(){return(_=e((()=>{r(),d(),m(),g=t(),h.__docgenInfo={description:``,methods:[],displayName:`LoadingMessage`,props:{className:{required:!1,tsType:{name:`string`},description:``},logo:{required:!1,tsType:{name:`ReactNode`},description:`Готовый брендовый знак, которым host-проект при необходимости дополняет сообщение о загрузке.`},text:{required:!1,tsType:{name:`string`},description:``}}}})))()}function v({className:e,text:t,role:n,minHeight:r=`5em`}){return(0,y.jsx)(f,{className:e,color:`muted`,minHeight:r,role:n,children:t||`Нет данных`})}var y;function b(){return(b=e((()=>{m(),y=t(),v.__docgenInfo={description:``,methods:[],displayName:`NoData`,props:{className:{required:!1,tsType:{name:`string`},description:``},text:{required:!1,tsType:{name:`string`},description:``},minHeight:{required:!1,tsType:{name:`union`,raw:`string | number`,elements:[{name:`string`},{name:`number`}]},description:``,defaultValue:{value:`"5em"`,computed:!1}},role:{required:!1,tsType:{name:`AriaRole`},description:``}}}})))()}export{_ as i,b as n,h as r,v as t};
|
package/storybook-static/assets/{NotificationsHost-d770FjSM.js → NotificationsHost-Bp69wBpO.js}
RENAMED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import{n as e}from"./rolldown-runtime-DkW27tQK.js";import{i as t,n,r,t as i}from"./NotificationsHost.stories-
|
|
1
|
+
import{n as e}from"./rolldown-runtime-DkW27tQK.js";import{i as t,n,r,t as i}from"./NotificationsHost.stories-H0M2_6Ql.js";import{n as a}from"./iframe-CizMDlW9.js";import{i as o,r as s}from"./react-Bl2r1tuC.js";import{a as c,d as l,f as u,l as d,m as f,n as p,p as m,r as h,u as g}from"./blocks-D29TdvdI.js";function _(e){let t={code:`code`,h2:`h2`,h3:`h3`,li:`li`,p:`p`,pre:`pre`,ul:`ul`,...o(),...e.components};return(0,y.jsxs)(y.Fragment,{children:[(0,y.jsx)(d,{of:n,parameters:{docs:{toc:!0}}}),`
|
|
2
2
|
`,(0,y.jsx)(m,{children:`NotificationsHost`}),`
|
|
3
|
-
`,(0,y.jsx)(u,{children
|
|
3
|
+
`,(0,y.jsx)(u,{children:`Активный toast-стек и headless-доступ к полной истории уведомлений`}),`
|
|
4
4
|
`,(0,y.jsx)(t.p,{children:`NotificationsHost уже имеет живые stories, а эта страница собирает их в структурированную документацию с краткими рекомендациями, примерами подключения и API.
|
|
5
5
|
Ниже можно быстро проверить базовый сценарий, а затем перейти к отдельным режимам использования и состояниям компонента.`}),`
|
|
6
6
|
`,(0,y.jsx)(t.h2,{id:`основной-сценарий`,children:`Основной сценарий`}),`
|
|
@@ -26,6 +26,34 @@ export function Example() {
|
|
|
26
26
|
);
|
|
27
27
|
}
|
|
28
28
|
`})}),`
|
|
29
|
+
`,(0,y.jsx)(t.h2,{id:`отдельный-центр-уведомлений`,children:`Отдельный центр уведомлений`}),`
|
|
30
|
+
`,(0,y.jsxs)(t.p,{children:[(0,y.jsx)(t.code,{children:`NotificationsHost`}),` отвечает только за краткоживущий toast-стек. Все созданные уведомления остаются в store и доступны через `,(0,y.jsx)(t.code,{children:`useNotificationHistory()`}),`, даже если toast был закрыт вручную, истёк по TTL или вытеснен лимитом из шести элементов.`]}),`
|
|
31
|
+
`,(0,y.jsxs)(t.p,{children:[`Hook возвращает только данные и не навязывает UI. Host-проект сам решает, где и как показать историю: на отдельной странице, внутри `,(0,y.jsx)(t.code,{children:`Dialog`}),`, `,(0,y.jsx)(t.code,{children:`Modal`}),` или другого собственного контейнера.`]}),`
|
|
32
|
+
`,(0,y.jsx)(t.pre,{children:(0,y.jsx)(t.code,{className:`language-tsx`,children:`import { Button } from "@ryuzaki13/react-foundation-ui/button";
|
|
33
|
+
import { useNotificationHistory, useNotify } from "@ryuzaki13/react-foundation-ui/notifications";
|
|
34
|
+
|
|
35
|
+
export function NotificationsHistoryContent() {
|
|
36
|
+
const history = useNotificationHistory();
|
|
37
|
+
const { clearHistory } = useNotify();
|
|
38
|
+
|
|
39
|
+
return (
|
|
40
|
+
<section aria-labelledby="notifications-history-title">
|
|
41
|
+
<h2 id="notifications-history-title">Все уведомления</h2>
|
|
42
|
+
<Button onClick={clearHistory}>Очистить историю</Button>
|
|
43
|
+
|
|
44
|
+
<ul>
|
|
45
|
+
{history.map((notification) => (
|
|
46
|
+
<li key={notification.id}>
|
|
47
|
+
<strong>{notification.title}</strong>
|
|
48
|
+
<div>{notification.message}</div>
|
|
49
|
+
</li>
|
|
50
|
+
))}
|
|
51
|
+
</ul>
|
|
52
|
+
</section>
|
|
53
|
+
);
|
|
54
|
+
}
|
|
55
|
+
`})}),`
|
|
56
|
+
`,(0,y.jsxs)(t.p,{children:[(0,y.jsx)(t.code,{children:`useNotifications()`}),` возвращает только активные toast-уведомления. `,(0,y.jsx)(t.code,{children:`clear()`}),` скрывает toast-стек, сохраняя историю; `,(0,y.jsx)(t.code,{children:`clearHistory()`}),` очищает историю, не закрывая активные toast.`]}),`
|
|
29
57
|
`,(0,y.jsx)(t.h2,{id:`практические-рекомендации`,children:`Практические рекомендации`}),`
|
|
30
58
|
`,(0,y.jsxs)(t.ul,{children:[`
|
|
31
59
|
`,(0,y.jsx)(t.li,{children:`Хост объявляется именованной областью «Область уведомлений», чтобы пользователь assistive technologies мог найти текущие сообщения.`}),`
|