@ryuzaki13/react-foundation-ui 3.10.1 → 3.11.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +11 -0
- package/dist/floating-windows/FloatingWindow.d.ts +19 -0
- package/dist/floating-windows/FloatingWindow.d.ts.map +1 -0
- package/dist/floating-windows/FloatingWindowHeader.d.ts +14 -0
- package/dist/floating-windows/FloatingWindowHeader.d.ts.map +1 -0
- package/dist/floating-windows/FloatingWindows.d.ts +16 -0
- package/dist/floating-windows/FloatingWindows.d.ts.map +1 -0
- package/dist/floating-windows/FloatingWindowsBoundary.d.ts +10 -0
- package/dist/floating-windows/FloatingWindowsBoundary.d.ts.map +1 -0
- package/dist/floating-windows/FloatingWindowsProvider.d.ts +11 -0
- package/dist/floating-windows/FloatingWindowsProvider.d.ts.map +1 -0
- package/dist/floating-windows/index.d.ts +4 -0
- package/dist/floating-windows/index.d.ts.map +1 -0
- package/dist/floating-windows/index.js +576 -0
- package/dist/floating-windows/index.js.map +1 -0
- package/dist/floating-windows/lib/constrainFloatingWindowPosition.d.ts +8 -0
- package/dist/floating-windows/lib/constrainFloatingWindowPosition.d.ts.map +1 -0
- package/dist/floating-windows/lib/floatingWindowsStorage.d.ts +10 -0
- package/dist/floating-windows/lib/floatingWindowsStorage.d.ts.map +1 -0
- package/dist/floating-windows/lib/getFloatingWindowStyle.d.ts +5 -0
- package/dist/floating-windows/lib/getFloatingWindowStyle.d.ts.map +1 -0
- package/dist/floating-windows/lib/isFloatingWindowId.d.ts +3 -0
- package/dist/floating-windows/lib/isFloatingWindowId.d.ts.map +1 -0
- package/dist/floating-windows/lib/selectFloatingWindowCascadePosition.d.ts +8 -0
- package/dist/floating-windows/lib/selectFloatingWindowCascadePosition.d.ts.map +1 -0
- package/dist/floating-windows/lib/selectFloatingWindowRestoreFocus.d.ts +3 -0
- package/dist/floating-windows/lib/selectFloatingWindowRestoreFocus.d.ts.map +1 -0
- package/dist/floating-windows/model/FloatingWindowsContext.d.ts +4 -0
- package/dist/floating-windows/model/FloatingWindowsContext.d.ts.map +1 -0
- package/dist/floating-windows/model/createFloatingWindowsStore.d.ts +8 -0
- package/dist/floating-windows/model/createFloatingWindowsStore.d.ts.map +1 -0
- package/dist/floating-windows/model/floatingWindowMoveTypes.d.ts +27 -0
- package/dist/floating-windows/model/floatingWindowMoveTypes.d.ts.map +1 -0
- package/dist/floating-windows/model/floatingWindowsTypes.d.ts +40 -0
- package/dist/floating-windows/model/floatingWindowsTypes.d.ts.map +1 -0
- package/dist/floating-windows/model/useFloatingWindowFocus.d.ts +4 -0
- package/dist/floating-windows/model/useFloatingWindowFocus.d.ts.map +1 -0
- package/dist/floating-windows/model/useFloatingWindowMeasurements.d.ts +5 -0
- package/dist/floating-windows/model/useFloatingWindowMeasurements.d.ts.map +1 -0
- package/dist/floating-windows/model/useFloatingWindowMove.d.ts +4 -0
- package/dist/floating-windows/model/useFloatingWindowMove.d.ts.map +1 -0
- package/dist/floating-windows/model/useFloatingWindowSnapshot.d.ts +4 -0
- package/dist/floating-windows/model/useFloatingWindowSnapshot.d.ts.map +1 -0
- package/dist/floating-windows/model/useFloatingWindowsBounds.d.ts +4 -0
- package/dist/floating-windows/model/useFloatingWindowsBounds.d.ts.map +1 -0
- package/dist/floating-windows/model/useFloatingWindowsPersistence.d.ts +4 -0
- package/dist/floating-windows/model/useFloatingWindowsPersistence.d.ts.map +1 -0
- package/dist/floating-windows/model/useFloatingWindowsStore.d.ts +4 -0
- package/dist/floating-windows/model/useFloatingWindowsStore.d.ts.map +1 -0
- package/dist/notifications/index.js +9 -9
- package/dist/styles.css +1 -1
- package/package.json +5 -1
- package/storybook-static/assets/{Badge-7nsS5Yyj.js → Badge-CVgLMAJT.js} +1 -1
- package/storybook-static/assets/{Badge.stories-BzQKeDqC.js → Badge.stories-KeadkKsz.js} +1 -1
- package/storybook-static/assets/{BadgeList-WzFV9MB1.js → BadgeList-_jBtMkE3.js} +1 -1
- package/storybook-static/assets/{BarcodeScannerDialog.stories-Ci8Mf9WX.js → BarcodeScannerDialog.stories-J9XDExKK.js} +1 -1
- package/storybook-static/assets/{Button-DqsSng-I.js → Button-C-uRygWz.js} +1 -1
- package/storybook-static/assets/{Button-6F3OVyTc.js → Button-DegBPiAl.js} +1 -1
- package/storybook-static/assets/{Button.stories-PNc3lIYB.js → Button.stories-Ds4zCq_9.js} +1 -1
- package/storybook-static/assets/{CalendarView-BT9X9tky.js → CalendarView-iyr_ipPy.js} +1 -1
- package/storybook-static/assets/{CheckBox-BasxUZYS.js → CheckBox-B0zrARHA.js} +1 -1
- package/storybook-static/assets/{CheckBox-BJhTyl1K.js → CheckBox-nBqHJGY9.js} +1 -1
- package/storybook-static/assets/{CheckBox.stories-DLRA5q3H.js → CheckBox.stories-CxO9FwA7.js} +1 -1
- package/storybook-static/assets/Color-6AOWCN3U-Dzuzn5Yr.js +1 -0
- package/storybook-static/assets/{ContextMenu-BckwURZg.js → ContextMenu-BC5OXqVj.js} +1 -1
- package/storybook-static/assets/{ContextMenu-OOsbvmOa.js → ContextMenu-CnZu58rQ.js} +1 -1
- package/storybook-static/assets/{ContextMenu.stories-BD-wMDNw.js → ContextMenu.stories-CPdTdVV7.js} +1 -1
- package/storybook-static/assets/{DateInput-DT6btAWU.js → DateInput-B5j7kofa.js} +1 -1
- package/storybook-static/assets/{DateInput-B5MxQUHL.js → DateInput-CuYe4WXO.js} +1 -1
- package/storybook-static/assets/{DateInput.stories-BK2brwe_.js → DateInput.stories-C4ZaIPUG.js} +1 -1
- package/storybook-static/assets/{DateRangePresetSelect-Dplr79Cm.js → DateRangePresetSelect-CbDK9t1J.js} +1 -1
- package/storybook-static/assets/{DateRangePresetSelect-gRdIuTx9.js → DateRangePresetSelect-Cg6yPY0K.js} +1 -1
- package/storybook-static/assets/{DateRangePresetSelect.stories-BRksGdxw.js → DateRangePresetSelect.stories-DPWUHjXu.js} +1 -1
- package/storybook-static/assets/{DeprecatedMultiSelect-BOxmEW2D.js → DeprecatedMultiSelect-DCReLsN-.js} +1 -1
- package/storybook-static/assets/{DeprecatedMultiSelect-1MSPac-V.js → DeprecatedMultiSelect-DkGsEVRD.js} +1 -1
- package/storybook-static/assets/{DeprecatedMultiSelect.stories-Ax0zv6Kb.js → DeprecatedMultiSelect.stories-tbYFDSML.js} +1 -1
- package/storybook-static/assets/{Detail-_5TyqOha.js → Detail-CtVpK6xU.js} +1 -1
- package/storybook-static/assets/{Detail.stories-CJbeEBiY.js → Detail.stories-zAQfXGuT.js} +1 -1
- package/storybook-static/assets/{Dialog-HBOYhMQq.js → Dialog-B9ltl4hS.js} +1 -1
- package/storybook-static/assets/{Dialog-BodfEiIi.js → Dialog-JetMtpYt.js} +1 -1
- package/storybook-static/assets/{Dialog.stories-Ds4F0ZoJ.js → Dialog.stories-tJymN3yq.js} +1 -1
- package/storybook-static/assets/{Disclosure-BbvtIOyN.js → Disclosure-j-RCrVFs.js} +1 -1
- package/storybook-static/assets/{Disclosure.stories-CnSK79hZ.js → Disclosure.stories-4Jj2XNlo.js} +1 -1
- package/storybook-static/assets/{DisclosureGroup-Dd0BeL4o.js → DisclosureGroup-CM7GlGI4.js} +1 -1
- package/storybook-static/assets/{DocsRenderer-JROSPFPF-BX-ThlFg.js → DocsRenderer-JROSPFPF-DevtpZi5.js} +1 -1
- package/storybook-static/assets/{DropZone-DPqYieZH.js → DropZone-Bwo7NG5D.js} +1 -1
- package/storybook-static/assets/{DropZone-CCkHaYAD.js → DropZone-CPrhOtX-.js} +1 -1
- package/storybook-static/assets/{DropZone.stories-lfKkNIIl.js → DropZone.stories-VyNhIaxw.js} +1 -1
- package/storybook-static/assets/{DropdownMenu-QWp-lSol.js → DropdownMenu-DMWZzFK1.js} +1 -1
- package/storybook-static/assets/{ExpandableActionPanel-DxPp3zYd.js → ExpandableActionPanel-DmKB3xVB.js} +1 -1
- package/storybook-static/assets/{ExpandableActionPanel.stories-BiklI55p.js → ExpandableActionPanel.stories-Kh_OSEIl.js} +1 -1
- package/storybook-static/assets/{Flex-S4mwRnc2.js → Flex-BZKhuaao.js} +1 -1
- package/storybook-static/assets/{Flex.stories-DRBLrgrW.js → Flex.stories-CrHxjVCH.js} +1 -1
- package/storybook-static/assets/{FlexContainer-4Ap7vbIt.js → FlexContainer-DGc37vCr.js} +1 -1
- package/storybook-static/assets/{FlexItem-Dwqi7KeT.js → FlexItem-DYv72TvP.js} +1 -1
- package/storybook-static/assets/{FloatingPopover-D8FScEoc.js → FloatingPopover-Bd3b1U8c.js} +1 -1
- package/storybook-static/assets/FloatingWindows-C2FJO6ij.css +1 -0
- package/storybook-static/assets/FloatingWindows.stories-Cs_i092m.js +13 -0
- package/storybook-static/assets/FormattedTableCell-CdlWquoj.js +15 -0
- package/storybook-static/assets/{Grid-DIYjEdUA.js → Grid-DIKudfVu.js} +1 -1
- package/storybook-static/assets/{Grid-CJ5RLrgv.js → Grid-DUcSdqsI.js} +1 -1
- package/storybook-static/assets/{Grid.stories-Bl35lMkU.js → Grid.stories-sZUaIp7v.js} +1 -1
- package/storybook-static/assets/{GridContainer-B2iAnXeB.js → GridContainer-C5r-VTTG.js} +1 -1
- package/storybook-static/assets/{ImageCropper.stories--E79MUTS.js → ImageCropper.stories-Bk3SF90a.js} +1 -1
- package/storybook-static/assets/{ImageRenderer-D0stahXz.js → ImageRenderer-CM-YetP0.js} +1 -1
- package/storybook-static/assets/{ImageRenderer.stories-C_Ir6A3m.js → ImageRenderer.stories-CMqKyVuX.js} +1 -1
- package/storybook-static/assets/{ImageView.stories-DbY7pwWs.js → ImageView.stories-9IjWDUev.js} +1 -1
- package/storybook-static/assets/{ImageViewer.stories-D2jfTzCV.js → ImageViewer.stories-D-Zzvzh3.js} +2 -2
- package/storybook-static/assets/{ImageViewerRuntime-DlvGnNv4.js → ImageViewerRuntime-BRWmVnG3.js} +1 -1
- package/storybook-static/assets/{Input-av5ktymr.js → Input-BaEhNNL0.js} +1 -1
- package/storybook-static/assets/{Input-CzvWPW0I.js → Input-YuUUu0DD.js} +1 -1
- package/storybook-static/assets/{Input.stories-CvLnu270.js → Input.stories-CoJY4vR8.js} +1 -1
- package/storybook-static/assets/{InputDateTime-D5bQuB9a.js → InputDateTime-CPlDTMTI.js} +1 -1
- package/storybook-static/assets/{InputDateTime.stories-BD9Pt7vB.js → InputDateTime.stories-DaOA4pFM.js} +1 -1
- package/storybook-static/assets/{InputFile-C3nj3qsi.js → InputFile-7PMO3B4Q.js} +1 -1
- package/storybook-static/assets/{InputFile-ulrG6ECh.js → InputFile-D2HPvbt_.js} +1 -1
- package/storybook-static/assets/{InputFile.stories-CEewSWb_.js → InputFile.stories-CD4sJtXF.js} +1 -1
- package/storybook-static/assets/{InputFiles-lF7Ys1hh.js → InputFiles-DSOs_hpc.js} +1 -1
- package/storybook-static/assets/{InputFiles-DZ1nUYOE.js → InputFiles-DwgBtqPe.js} +1 -1
- package/storybook-static/assets/{InputFiles.stories-CCptKLDn.js → InputFiles.stories-B2zPOUXW.js} +1 -1
- package/storybook-static/assets/{InputFilesList-DTJkMHNI.js → InputFilesList-DWtH6HFC.js} +1 -1
- package/storybook-static/assets/{InputImage-lDHbW_ac.js → InputImage-Cke0I8XV.js} +1 -1
- package/storybook-static/assets/{InputImage-CIPZL6uS.js → InputImage-CnTU-bKF.js} +1 -1
- package/storybook-static/assets/{InputImage.stories-CQ2BBGf-.js → InputImage.stories-CadyFqUh.js} +1 -1
- package/storybook-static/assets/{InteractiveComponents-DD7TZeA4.js → InteractiveComponents-cNgymLXT.js} +1 -1
- package/storybook-static/assets/{InteractiveComponents.stories-Bbo3l8WO.js → InteractiveComponents.stories-c5kIdj-d.js} +1 -1
- package/storybook-static/assets/{LayoutPicker-A7VlDbc0.js → LayoutPicker-BydBdeCh.js} +1 -1
- package/storybook-static/assets/{LayoutPicker-uw1knHzA.js → LayoutPicker-u5tv4tmF.js} +1 -1
- package/storybook-static/assets/{LayoutPicker.stories-DDR6oiSN.js → LayoutPicker.stories-ZcTgJxX5.js} +1 -1
- package/storybook-static/assets/{Listbox-CmkI7dm_.js → Listbox-CaBDvhDA.js} +1 -1
- package/storybook-static/assets/{Listbox-CO1BjyFs.js → Listbox-CzmfAAEG.js} +1 -1
- package/storybook-static/assets/{Listbox.stories-BIPmBbuG.js → Listbox.stories-B_tFWmxp.js} +1 -1
- package/storybook-static/assets/{Modal-C3JdXj6Q.js → Modal-CIptTLdh.js} +1 -1
- package/storybook-static/assets/{Modal-IXMZUaaw.js → Modal-DIJuHLSp.js} +1 -1
- package/storybook-static/assets/{Modal.stories-BD-UnVeM.js → Modal.stories-BAh1Lzf0.js} +1 -1
- package/storybook-static/assets/{ModalManagerProvider-zJVg8-dg.js → ModalManagerProvider-DH2lt3jw.js} +1 -1
- package/storybook-static/assets/{MultiSelect-DZKjK53B.js → MultiSelect-CbcU2Cam.js} +1 -1
- package/storybook-static/assets/{MultiSelect-CGoyA8-m.js → MultiSelect-OPkS-VFp.js} +1 -1
- package/storybook-static/assets/{MultiSelect.stories-D65mpYYt.js → MultiSelect.stories-jghnBwe0.js} +1 -1
- package/storybook-static/assets/{MultiSelectCore-ih1pgvuq.js → MultiSelectCore-AgK9lN-8.js} +1 -1
- package/storybook-static/assets/{NoData-32gM9qt4.js → NoData-CRi9NzcI.js} +1 -1
- package/storybook-static/assets/{NotificationsHost-pkEhxgz2.js → NotificationsHost-C8sCDEzY.js} +9 -9
- package/storybook-static/assets/{NotificationsHost.stories-BqIayryx.js → NotificationsHost.stories-BxpWtMHl.js} +1 -1
- package/storybook-static/assets/{ODataMultiSelect-D42gAcHg.js → ODataMultiSelect-Cjptiw3k.js} +1 -1
- package/storybook-static/assets/{ODataMultiSelect.stories-DfAkKAsG.js → ODataMultiSelect.stories-B-tBcHkU.js} +2 -2
- package/storybook-static/assets/{ODataSelect-DPOMWPKO.js → ODataSelect-BdVlf2WW.js} +1 -1
- package/storybook-static/assets/{ODataSelect.stories-DHs3wp7E.js → ODataSelect.stories-DZv8DgW4.js} +2 -2
- package/storybook-static/assets/{ODataTreeMultiSelect-CC8yuaVP.js → ODataTreeMultiSelect-B83uLKnT.js} +1 -1
- package/storybook-static/assets/{ODataTreeMultiSelect.stories-BtwLdGK6.js → ODataTreeMultiSelect.stories-k92VjXYz.js} +1 -1
- package/storybook-static/assets/{ODataTreeSelect-qcitpYxj.js → ODataTreeSelect-CkZeBBoA.js} +1 -1
- package/storybook-static/assets/{ODataTreeSelect.stories-1r_tkUVi.js → ODataTreeSelect.stories-COweaWEr.js} +1 -1
- package/storybook-static/assets/{OneStepScroller-wz4Qujpx.js → OneStepScroller-dD9RSWvg.js} +1 -1
- package/storybook-static/assets/{Option-Beom2xTg.js → Option-lTkoUcHa.js} +1 -1
- package/storybook-static/assets/{OptionButton-D_ZCVbsd.js → OptionButton-Bt6YtqRZ.js} +1 -1
- package/storybook-static/assets/{OptionContent-FZ-u9L1s.js → OptionContent-C7Zoef1L.js} +1 -1
- package/storybook-static/assets/{OptionContentContainer-HVNOgpjm.js → OptionContentContainer-xpO-es_t.js} +1 -1
- package/storybook-static/assets/{PeriodSelect-qevVtoSU.js → PeriodSelect-CmGjITS0.js} +1 -1
- package/storybook-static/assets/{PeriodSelect-DbdeznMQ.js → PeriodSelect-DkGZmPFu.js} +1 -1
- package/storybook-static/assets/{PeriodSelect.stories-BLi_6rpY.js → PeriodSelect.stories-BxkZen1s.js} +1 -1
- package/storybook-static/assets/{PickerField-BHSRcQY6.js → PickerField-vwGcXNU3.js} +1 -1
- package/storybook-static/assets/{PickerTriggerActions-Cxk3YQGF.js → PickerTriggerActions-BVO2pwu2.js} +1 -1
- package/storybook-static/assets/{Popover-BosMVXTI.js → Popover-DU0wD6MT.js} +1 -1
- package/storybook-static/assets/{Popover-De2fvkIB.js → Popover-PRWJVARx.js} +1 -1
- package/storybook-static/assets/{Popover.stories-DM-Plj05.js → Popover.stories-CXKDCIfT.js} +1 -1
- package/storybook-static/assets/{PresetRangeDateInput-jersOEYO.js → PresetRangeDateInput-B1oR9Z-A.js} +1 -1
- package/storybook-static/assets/{PresetRangeDateInput-CCQuBkJj.js → PresetRangeDateInput-DUcxF5lh.js} +1 -1
- package/storybook-static/assets/{PresetRangeDateInput.stories-DwqDWXX9.js → PresetRangeDateInput.stories-CAPHV6_P.js} +1 -1
- package/storybook-static/assets/{PresetSelect-BhwHbWmS.js → PresetSelect-Hrow5Qbz.js} +1 -1
- package/storybook-static/assets/{README-DmJq-c8n.js → README-AWtoYOeO.js} +1 -1
- package/storybook-static/assets/{README-D09okhy9.js → README-BB_tSzAG.js} +1 -1
- package/storybook-static/assets/{README-1UUrJXjZ.js → README-BCBBtU0T.js} +1 -1
- package/storybook-static/assets/{README-BfRKdJtw.js → README-BCXjh3I1.js} +1 -1
- package/storybook-static/assets/{README-33qTnj5l.js → README-BDdhvdKa.js} +1 -1
- package/storybook-static/assets/{README-DNeDK1_H.js → README-BEUQd7JO.js} +1 -1
- package/storybook-static/assets/{README-o4PUljT6.js → README-BIHT1kGT.js} +1 -1
- package/storybook-static/assets/{README-O9BJmE-H.js → README-BJXCE3us.js} +1 -1
- package/storybook-static/assets/{README-BzVVPLXk.js → README-BLog3wnj.js} +1 -1
- package/storybook-static/assets/{README-DK5aZdOt.js → README-BPOSX1IH.js} +1 -1
- package/storybook-static/assets/{README-B_tg7QVI.js → README-BwSjP1rm.js} +1 -1
- package/storybook-static/assets/{README-DzASMBMv.js → README-C8-H1dVZ.js} +1 -1
- package/storybook-static/assets/{README-BIvHy4kr.js → README-CDYORt73.js} +1 -1
- package/storybook-static/assets/{README-D_d6frx1.js → README-CDq7upsw.js} +1 -1
- package/storybook-static/assets/{README-ECCgQcGo.js → README-CF5B-uBm.js} +1 -1
- package/storybook-static/assets/{README-By0zyJQ-.js → README-CF79JAmm.js} +1 -1
- package/storybook-static/assets/{README-CJ6rsYUk.js → README-CGalXaw7.js} +1 -1
- package/storybook-static/assets/{README-Dc2qBccm.js → README-CHgqsGMV.js} +1 -1
- package/storybook-static/assets/{README-DKI2c8YJ.js → README-COzEPNJ8.js} +1 -1
- package/storybook-static/assets/{README-CvzdarfH.js → README-CRfg4Opx.js} +1 -1
- package/storybook-static/assets/{README-B5rmNIab.js → README-CRk_ElRL.js} +1 -1
- package/storybook-static/assets/{README-bWB0c7pN.js → README-CTbRRHIT.js} +1 -1
- package/storybook-static/assets/{README-BPSG9KrB.js → README-C_hI3IVn.js} +1 -1
- package/storybook-static/assets/{README-29WDFTDH.js → README-CbCzYjzO.js} +1 -1
- package/storybook-static/assets/{README-D5YLxtgR.js → README-Cb_U_ZYK.js} +1 -1
- package/storybook-static/assets/{README-Rk3Krdys.js → README-CdDd6nD8.js} +1 -1
- package/storybook-static/assets/{README-Cz14JUTC.js → README-Cu3r4RYC.js} +1 -1
- package/storybook-static/assets/{README-CPZBUXWs.js → README-CxBqJjI3.js} +1 -1
- package/storybook-static/assets/{README-NHHRscRF.js → README-D0EguYwa.js} +1 -1
- package/storybook-static/assets/{README-CmzO6bzh.js → README-DA8e0atn.js} +1 -1
- package/storybook-static/assets/{README-DT96eoyc.js → README-DUVORqie.js} +1 -1
- package/storybook-static/assets/{README-CJFgcV8C.js → README-DYjyXvbd.js} +1 -1
- package/storybook-static/assets/{README-Df8F75dr.js → README-D_iA9J4Q.js} +1 -1
- package/storybook-static/assets/{README-sPm51M3K.js → README-De02nG6s.js} +1 -1
- package/storybook-static/assets/{README-CrhHHw0i.js → README-DjM1av8U.js} +1 -1
- package/storybook-static/assets/{README-BKLeD4y3.js → README-DmT1wyUb.js} +1 -1
- package/storybook-static/assets/{README-LWfExOhc.js → README-DnpmMCNN.js} +1 -1
- package/storybook-static/assets/{README-CioPc-xb.js → README-FJ4JNfan.js} +1 -1
- package/storybook-static/assets/{README-BCEKAY_J.js → README-JqCoy91R.js} +1 -1
- package/storybook-static/assets/{README-DQl_3tX1.js → README-JrppLPED.js} +1 -1
- package/storybook-static/assets/{README-BK8k_Q4m.js → README-MUzkojYd.js} +1 -1
- package/storybook-static/assets/{README-B5eMX8_9.js → README-O1ww7U1S.js} +1 -1
- package/storybook-static/assets/{README-DeHGaTaW.js → README-SkcZXYo1.js} +1 -1
- package/storybook-static/assets/{README-Cpk-Tr_W.js → README-UfCsOg0n.js} +1 -1
- package/storybook-static/assets/{README-BNsU3Cqx.js → README-Xu3cmYZg.js} +1 -1
- package/storybook-static/assets/{README-BQDFmWGi.js → README-bcnh89ek.js} +1 -1
- package/storybook-static/assets/{README-CHllxFPj.js → README-ctVjdbq7.js} +1 -1
- package/storybook-static/assets/{README-DzrrH56m.js → README-diVWU6bQ.js} +1 -1
- package/storybook-static/assets/{README-BoJXfTe6.js → README-f5UPnPkY.js} +1 -1
- package/storybook-static/assets/{README-CvReVgGJ.js → README-mq6pyk4G.js} +1 -1
- package/storybook-static/assets/{README-DS63ZnOT.js → README-o-a96Aib.js} +1 -1
- package/storybook-static/assets/{README-BAlXRtAz.js → README-w3_FegOo.js} +1 -1
- package/storybook-static/assets/{README-BD5f1if4.js → README-zelg96nd.js} +1 -1
- package/storybook-static/assets/{RadioButton-BZiBFXe1.js → RadioButton-BztQMLNR.js} +1 -1
- package/storybook-static/assets/{RadioButton-CBLdgMz4.js → RadioButton-DUOPHyRt.js} +1 -1
- package/storybook-static/assets/{RadioButton.stories-BP5yM5qg.js → RadioButton.stories-BOE5cGej.js} +1 -1
- package/storybook-static/assets/{RadioGroup-DYRfZVGC.js → RadioGroup-CDqbnv4J.js} +1 -1
- package/storybook-static/assets/{RadioGroup-epjQdSZn.js → RadioGroup-QICEWbjz.js} +1 -1
- package/storybook-static/assets/{RadioGroup.stories-UOjXIk6v.js → RadioGroup.stories-f2qU7hhM.js} +1 -1
- package/storybook-static/assets/{ResponsiveLayoutPreview-BHBxtn2W.js → ResponsiveLayoutPreview-BWBLsr8u.js} +1 -1
- package/storybook-static/assets/{Scrollable-DKQa75cf.js → Scrollable-CAnjXb6_.js} +1 -1
- package/storybook-static/assets/{Scrollable-BBYov1Hn.js → Scrollable-Cc641kuG.js} +1 -1
- package/storybook-static/assets/{Scrollable.stories-BH1-i6nI.js → Scrollable.stories-ZQT-1f1f.js} +1 -1
- package/storybook-static/assets/{Select-DYOCTPiv.js → Select-BeoH_3V4.js} +1 -1
- package/storybook-static/assets/{Select-DU6Eh0Lt.js → Select-D6RLm9D5.js} +1 -1
- package/storybook-static/assets/{Select.stories-BF3svbAH.js → Select.stories-DI6pVDzi.js} +1 -1
- package/storybook-static/assets/{Separator-_gvt1sqm.js → Separator-De9vEg4j.js} +1 -1
- package/storybook-static/assets/{Separator-CxviJxG5.js → Separator-tkZoR8Ft.js} +1 -1
- package/storybook-static/assets/{Separator.stories-DN6hlZl5.js → Separator.stories-CGZrsdLJ.js} +1 -1
- package/storybook-static/assets/{SerializableSelect-BVTOrYLs.js → SerializableSelect-BWgkYLIe.js} +1 -1
- package/storybook-static/assets/{SerializableSelect.stories-pcWq603M.js → SerializableSelect.stories-BfGg_SmN.js} +1 -1
- package/storybook-static/assets/{ShimmerText-BDDa_Wf7.js → ShimmerText-D1ygdKrh.js} +1 -1
- package/storybook-static/assets/{ShimmerText.stories-DdZPIKwl.js → ShimmerText.stories-D5AB85Hj.js} +1 -1
- package/storybook-static/assets/{SingleDateTimeInput-sGTkT8ZA.js → SingleDateTimeInput-Bf2RpSbC.js} +1 -1
- package/storybook-static/assets/{SingleDateTimeInput-q-eu2xUU.js → SingleDateTimeInput-C2O-fXgE.js} +1 -1
- package/storybook-static/assets/{SingleDateTimeInput.stories-X7CMAFsq.js → SingleDateTimeInput.stories-BUbSA1UY.js} +1 -1
- package/storybook-static/assets/{Slider-CaKY8LIJ.js → Slider-BhfM7XZ9.js} +1 -1
- package/storybook-static/assets/{Slider-CqNWljkT.js → Slider-CVPKS3XB.js} +1 -1
- package/storybook-static/assets/{Slider.stories-CMxutCGM.js → Slider.stories-C6ZUJc4b.js} +1 -1
- package/storybook-static/assets/{SliderInput-HUUN5_IF.js → SliderInput-MMUGLDDl.js} +1 -1
- package/storybook-static/assets/{SliderInput-scYwk-4g.js → SliderInput-PwHeDeo2.js} +1 -1
- package/storybook-static/assets/{SliderInput.stories-CDhgeql1.js → SliderInput.stories-zBDRonPh.js} +1 -1
- package/storybook-static/assets/{Sortable-CaysnUNW.js → Sortable-BKNLJGIe.js} +1 -1
- package/storybook-static/assets/{Sortable.stories-C4gHc5ka.js → Sortable.stories-CLY263mj.js} +1 -1
- package/storybook-static/assets/{Splitter-6cU1s7Qr.js → Splitter-PyZco_V_.js} +1 -1
- package/storybook-static/assets/{Splitter.stories-CA9A-CZ-.js → Splitter.stories-CY3Itq_G.js} +1 -1
- package/storybook-static/assets/{StateSelect-BAqjdi4g.js → StateSelect-BlEIRWer.js} +1 -1
- package/storybook-static/assets/{StateSelect-OHl6KWge.js → StateSelect-DfUif3cG.js} +1 -1
- package/storybook-static/assets/{StateSelect.stories-xX3ujKGO.js → StateSelect.stories-ClSYkdz8.js} +1 -1
- package/storybook-static/assets/{StatusIndicator-C_7dWY2t.js → StatusIndicator-CL-WMBHT.js} +1 -1
- package/storybook-static/assets/{StatusIndicator.stories-BRlVzKf7.js → StatusIndicator.stories-BbpEocDe.js} +1 -1
- package/storybook-static/assets/{StringToggle.stories-DFPLwtHW.js → StringToggle.stories-0r9TfflS.js} +1 -1
- package/storybook-static/assets/{Switch-CrlrIm3t.js → Switch-AoVSoc9P.js} +1 -1
- package/storybook-static/assets/{Switch-DHcMczAC.js → Switch-HAWn3D1c.js} +1 -1
- package/storybook-static/assets/{Switch.stories-LhTPX_R-.js → Switch.stories-D1VJIWsC.js} +1 -1
- package/storybook-static/assets/{Table-Ct8iqJEY.js → Table-CyX8frK4.js} +1 -1
- package/storybook-static/assets/Table.stories-DoGpFMZB.js +184 -0
- package/storybook-static/assets/{TableEditor.stories-Qtqr_l4g.js → TableEditor.stories-Mh6q2awx.js} +1 -1
- package/storybook-static/assets/{Tabs-CC0IIQwl.js → Tabs-BZfNXmy0.js} +1 -1
- package/storybook-static/assets/{Tabs.stories-Bo_Y-dq8.js → Tabs.stories-C9L4pJDb.js} +1 -1
- package/storybook-static/assets/{TabsBox-BMNvHsCH.js → TabsBox-qRCIBtqi.js} +1 -1
- package/storybook-static/assets/{TagInput-BLwbzCit.js → TagInput-CPB6lb2J.js} +1 -1
- package/storybook-static/assets/{TagInput.stories-DNcD4tn4.js → TagInput.stories-CT6B8CVV.js} +1 -1
- package/storybook-static/assets/{Text-Bih-aO3C.js → Text-AbSWZQO3.js} +1 -1
- package/storybook-static/assets/{Textarea-D3os1biP.js → Textarea-BY51Li7J.js} +1 -1
- package/storybook-static/assets/{Textarea-DCnLF4aj.js → Textarea-Bz9O1y1I.js} +1 -1
- package/storybook-static/assets/{Textarea.stories-CIFzZQ5Z.js → Textarea.stories-CJbv3jrK.js} +1 -1
- package/storybook-static/assets/{TimePanel-BcVGesht.js → TimePanel-Wn5lUiwx.js} +1 -1
- package/storybook-static/assets/{TimePanel.stories-C6_xVdCq.js → TimePanel.stories-dF5kTdp1.js} +1 -1
- package/storybook-static/assets/{Toggle-CtABgcO5.js → Toggle-BpDn9f6k.js} +1 -1
- package/storybook-static/assets/{Toggle-BD0YAuO2.js → Toggle-CUO99pvo.js} +1 -1
- package/storybook-static/assets/{Toggle.stories-DnTnFcGB.js → Toggle.stories-T1Hk_etn.js} +1 -1
- package/storybook-static/assets/{TreeMultiSelect-DHk_QP2h.js → TreeMultiSelect-DEsECkRj.js} +1 -1
- package/storybook-static/assets/{TreeMultiSelect-Bp_Akwgc.js → TreeMultiSelect-bqQExCm8.js} +1 -1
- package/storybook-static/assets/{TreeMultiSelect.stories-CBVQbR1c.js → TreeMultiSelect.stories-DyK7bWZu.js} +1 -1
- package/storybook-static/assets/{TreePickerBase-BhWXyIoO.js → TreePickerBase-BCbV37dL.js} +1 -1
- package/storybook-static/assets/{TreeSelect-DleoF0hJ.js → TreeSelect-CTvlmF81.js} +1 -1
- package/storybook-static/assets/{TreeSelect-HNbghKYG.js → TreeSelect-Cepr58wS.js} +1 -1
- package/storybook-static/assets/{TreeSelect.stories-BigcPfEn.js → TreeSelect.stories-RVPMBCd_.js} +1 -1
- package/storybook-static/assets/{TreeTable-BNkuyFKP.js → TreeTable-DznOmuAD.js} +1 -1
- package/storybook-static/assets/TreeTable.stories-Lx2ImfgC.js +138 -0
- package/storybook-static/assets/blocks-u0CCD6I1.js +287 -0
- package/storybook-static/assets/{check-DRMDOowi.js → check-CHvYWZD5.js} +1 -1
- package/storybook-static/assets/{chevron-down-D0ohA4RZ.js → chevron-down-DqHAghNU.js} +1 -1
- package/storybook-static/assets/{chevron-left-CLqpYqDQ.js → chevron-left-Bj7vIyg-.js} +1 -1
- package/storybook-static/assets/{chevron-right-CXryGzSx.js → chevron-right-BUqG0v39.js} +1 -1
- package/storybook-static/assets/{chunk-W22LQPXL-CxLeSIMq.js → chunk-W22LQPXL-BSczDjJT.js} +1 -1
- package/storybook-static/assets/{circle-alert-l6NwXGUY.js → circle-alert-DXUFM6uc.js} +1 -1
- package/storybook-static/assets/{circle-check-B-r716dD.js → circle-check-0x9vHUU_.js} +1 -1
- package/storybook-static/assets/{contextMenu-Br4n839h.js → contextMenu-D8PjjiwD.js} +1 -1
- package/storybook-static/assets/{download-DqFSGBvN.js → download-15Eb3eUj.js} +1 -1
- package/storybook-static/assets/{floating-ui.react-B-qFeMZZ.js → floating-ui.react-CypKyrM4.js} +1 -1
- package/storybook-static/assets/{foundationApi-DxO3oR-c.js → foundationApi-dmPNotab.js} +1 -1
- package/storybook-static/assets/{foundationLib-CTFFCQvn.js → foundationLib-CyrgF87o.js} +1 -1
- package/storybook-static/assets/{hooks-CAgVZJ-F.js → hooks-DM8_3IU2.js} +1 -1
- package/storybook-static/assets/{iframe-E950Ehp0.js → iframe-BmGorvhi.js} +4 -4
- package/storybook-static/assets/iframe-WuXBbC_P.js +1 -0
- package/storybook-static/assets/{info-Dp6XZGwP.js → info-HMSnCOw2.js} +1 -1
- package/storybook-static/assets/isRecord-DXDTW-jA-DtM9YD3V.js +1 -0
- package/storybook-static/assets/odata-DLogt0PY.js +1 -0
- package/storybook-static/assets/{odataStoryFixtures-CDArjyM7.js → odataStoryFixtures-DiC-gXoK.js} +1 -1
- package/storybook-static/assets/{react-CGpO0FqR.js → react-BLxZ0fqY.js} +1 -1
- package/storybook-static/assets/{refresh-cw-dMgbnEda.js → refresh-cw-Obk3FkLO.js} +1 -1
- package/storybook-static/assets/{settings-2-CmW1dpao.js → settings-2-BQ2LYeiA.js} +1 -1
- package/storybook-static/assets/{sortable-D7TAXZBK.js → sortable-BrLDYUp8.js} +1 -1
- package/storybook-static/assets/{syntaxhighlighter-QEQV7K2Y-ok7zY4QK.js → syntaxhighlighter-QEQV7K2Y-JUCJEf5U.js} +1 -1
- package/storybook-static/assets/{trash-2-5v1tbQ2V.js → trash-2-CzXfDl_F.js} +1 -1
- package/storybook-static/assets/{triangle-alert-CVLPpc5j.js → triangle-alert-Ww2Tuzxk.js} +1 -1
- package/storybook-static/assets/{useODataSelectBase-Bkht6gRs.js → useODataSelectBase-DIZSERuU.js} +1 -1
- package/storybook-static/assets/useODataTreeData-DLgIiNMG.js +1 -0
- package/storybook-static/assets/{usePickerQuery-BmoBHlzm.js → usePickerQuery-BZ1Hrn2J.js} +1 -1
- package/storybook-static/assets/{usePickerTriggerController-Dvt7LsFZ.js → usePickerTriggerController-BIarg6M4.js} +1 -1
- package/storybook-static/assets/{x-DZpfbNy0.js → x-BmlmEU-a.js} +1 -1
- package/storybook-static/iframe.html +2 -2
- package/storybook-static/index.json +1 -1
- package/storybook-static/project.json +1 -1
- package/storybook-static/assets/Color-6AOWCN3U-C4R02nIA.js +0 -1
- package/storybook-static/assets/FormattedTableCell-BKSpyxnu.js +0 -15
- package/storybook-static/assets/Table.stories-DO30v6VO.js +0 -184
- package/storybook-static/assets/TreeTable.stories-Bdx3y7Yb.js +0 -138
- package/storybook-static/assets/blocks-DGivDYe5.js +0 -48
- package/storybook-static/assets/components-Vmrwp1qC.js +0 -241
- package/storybook-static/assets/iframe-dKozSQh6.js +0 -1
- package/storybook-static/assets/odata-DuJbgix6.js +0 -1
- package/storybook-static/assets/useODataTreeData-DTWPuC9Y.js +0 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["./react-Bl2r1tuC.js","./rolldown-runtime-DkW27tQK.js","./react-BZJXY1be.js"])))=>i.map(i=>d[i]);
|
|
2
|
-
import{a as e,n as t}from"./rolldown-runtime-DkW27tQK.js";import{n,t as r}from"./preload-helper-wdlQj8DP.js";import{t as i}from"./react-BZJXY1be.js";import{i as a,m as o,o as s,s as c,t as l}from"./blocks-
|
|
2
|
+
import{a as e,n as t}from"./rolldown-runtime-DkW27tQK.js";import{n,t as r}from"./preload-helper-wdlQj8DP.js";import{t as i}from"./react-BZJXY1be.js";import{i as a,m as o,o as s,s as c,t as l}from"./blocks-u0CCD6I1.js";import{i as u,r as d,t as f}from"./react-18-EmNFJX4V.js";var p,m,h,g;function _(){return(_=t((()=>{p=e(i(),1),f(),o(),n(),m={code:a,a:l,...c},h=class extends p.Component{constructor(){super(...arguments),this.state={hasError:!1}}static getDerivedStateFromError(){return{hasError:!0}}componentDidCatch(e){let{showException:t}=this.props;t(e)}render(){let{hasError:e}=this.state,{children:t}=this.props;return e?null:p.createElement(p.Fragment,null,t)}},g=class{constructor(){this.render=async(e,t,n)=>{let i={...m,...t?.components},a=s;return new Promise((o,s)=>{r(async()=>{let{MDXProvider:e}=await import(`./react-Bl2r1tuC.js`).then(e=>(e.t(),e.n));return{MDXProvider:e}},__vite__mapDeps([0,1,2]),import.meta.url).then(({MDXProvider:r})=>d(p.createElement(h,{showException:s,key:Math.random()},p.createElement(r,{components:i},p.createElement(a,{context:e,docsParameter:t}))),n)).then(()=>o())})},this.unmount=e=>{u(e)}}}})))()}function v(){return(v=t((()=>{_()})))()}v();export{g as DocsRenderer};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{n as e}from"./rolldown-runtime-DkW27tQK.js";import{t}from"./react-BZJXY1be.js";import{i as n,n as r,r as i}from"./iframe-
|
|
1
|
+
import{n as e}from"./rolldown-runtime-DkW27tQK.js";import{t}from"./react-BZJXY1be.js";import{i as n,n as r,r as i}from"./iframe-BmGorvhi.js";import{a,i as o,n as s}from"./utils-tg3ibbzi.js";import{a as c,i as l,o as u,r as d,s as f}from"./file-CwRoWxeB.js";import{n as p,t as m}from"./InputFilesList-DWtH6HFC.js";var h,g;function _(){return(_=e((()=>{n(),h=[[`path`,{d:`M12 3v12`,key:`1x0j5s`}],[`path`,{d:`m17 8-5-5-5 5`,key:`7q97r8`}],[`path`,{d:`M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4`,key:`ih7n3h`}]],g=i(`upload`,h)})))()}var v,y,b,x,S,C;function w(){return(w=e((()=>{v=`q2D6Pw`,y=`QVgB0d`,b=`-nyQKp`,x=`kY0O9g`,S=`F5K1bE`,C={zone:v,dragOver:y,disabled:b,icon:x,hint:S}})))()}function T({value:e,onChange:t,onChangeError:n,accept:r,allowedMime:i,maxBytes:o,readMode:l,multiple:p=!0,disabled:h,className:_,children:v}){c(i),u(r);let y=(0,E.useRef)(0),b=(0,E.useRef)(null),[x,S]=(0,E.useState)(!1),w=(0,E.useMemo)(()=>r&&r.length>0?r.join(`,`):i&&i.length>0?i.join(`,`):`*`,[i,r]),T=(0,E.useCallback)(e=>l===`array-buffer`?f(e,{allowedMime:i,maxBytes:o,mode:`array-buffer`}):f(e,{allowedMime:i,maxBytes:o}),[i,o,l]),O=(0,E.useCallback)(async e=>{if(h||e.length===0)return;let r=p?e:e.slice(0,1),i=[];for(let e of r)try{let t=await T(e);i.push(t)}catch(e){e instanceof d&&n&&n(e)}i.length>0&&t(i)},[h,p,t,n,T]),k=(0,E.useCallback)(()=>{h||b.current?.click()},[h]),A=(0,E.useCallback)(e=>{e.preventDefault(),e.stopPropagation(),!h&&(y.current+=1,y.current===1&&S(!0))},[h]),j=(0,E.useCallback)(e=>{e.preventDefault(),e.stopPropagation(),!h&&(e.dataTransfer.dropEffect=`copy`)},[h]),M=(0,E.useCallback)(e=>{e.preventDefault(),e.stopPropagation(),!h&&(--y.current,y.current===0&&S(!1))},[h]),N=(0,E.useCallback)(async e=>{if(e.preventDefault(),e.stopPropagation(),y.current=0,S(!1),h)return;let t=Array.from(e.dataTransfer.files);await O(t)},[h,O]),P=(0,E.useCallback)(async e=>{let t=Array.from(e.target.files??[]);await O(t),e.target.value=``},[O]),F=(0,E.useCallback)(e=>{s(e,k,{disabled:h})},[h,k]);return(0,D.jsxs)(`div`,{children:[(0,D.jsx)(`input`,{ref:b,type:`file`,hidden:!0,disabled:h,multiple:p,accept:w,onChange:P}),(0,D.jsx)(`div`,{className:a(C.zone,x&&C.dragOver,h&&C.disabled,_),onClick:k,onKeyDown:F,onDragEnter:A,onDragOver:j,onDragLeave:M,onDrop:N,role:`button`,tabIndex:h?-1:0,"aria-disabled":h,children:v??(0,D.jsxs)(D.Fragment,{children:[(0,D.jsx)(g,{className:C.icon}),(0,D.jsx)(`span`,{className:C.hint,children:p?`Перетащите файлы сюда или нажмите для выбора`:`Перетащите файл сюда или нажмите для выбора`})]})}),(0,D.jsx)(m,{files:e,onChange:t})]})}var E,D;function O(){return(O=e((()=>{E=t(),l(),o(),_(),p(),w(),D=r(),T.__docgenInfo={description:`DropZone — зона для перетаскивания файлов и выбора по клику.
|
|
2
2
|
|
|
3
3
|
При наведении файла зона подсвечивается (пунктирная рамка меняет цвет).
|
|
4
4
|
При сбросе файлов каждый читается через readFile, успешные результаты
|
|
@@ -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-BmGorvhi.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-u0CCD6I1.js";import{a as p,i as m,n as h,r as g,t as _}from"./DropZone.stories-VyNhIaxw.js";function v(e){let t={code:`code`,h2:`h2`,h3:`h3`,li:`li`,p:`p`,pre:`pre`,ul:`ul`,...n(),...e.components};return(0,b.jsxs)(b.Fragment,{children:[(0,b.jsx)(s,{of:g,parameters:{docs:{toc:!0}}}),`
|
|
2
2
|
`,(0,b.jsx)(u,{children:`DropZone`}),`
|
|
3
3
|
`,(0,b.jsx)(o,{children:`Зона drag-and-drop для загрузки файлов кликом или перетаскиванием`}),`
|
|
4
4
|
`,(0,b.jsx)(t.p,{children:`DropZone уже имеет живые stories, а эта страница собирает их в структурированную документацию с краткими рекомендациями, примерами подключения и API.
|
package/storybook-static/assets/{DropZone.stories-lfKkNIIl.js → DropZone.stories-VyNhIaxw.js}
RENAMED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{n as e,r as t}from"./rolldown-runtime-DkW27tQK.js";import{n,t as r}from"./DropZone-
|
|
1
|
+
import{n as e,r as t}from"./rolldown-runtime-DkW27tQK.js";import{n,t as r}from"./DropZone-Bwo7NG5D.js";import{i,n as a,r as o}from"./iframe-BmGorvhi.js";import{n as s,t as c}from"./createControlledStoryRender-BouhvX-R.js";var l,u;function d(){return(d=e((()=>{i(),l=[[`path`,{d:`M12 13v8`,key:`1l5pq0`}],[`path`,{d:`M4 14.899A7 7 0 1 1 15.71 8h1.79a4.5 4.5 0 0 1 2.5 8.242`,key:`1pljnt`}],[`path`,{d:`m8 17 4-4 4 4`,key:`1quai1`}]],u=o(`cloud-upload`,l)})))()}var f=t({Basic:()=>_,Disabled:()=>y,SingleFile:()=>v,__namedExportsOrder:()=>b,default:()=>g});function p({showStatus:e=!1,children:t}={}){return c((n,i)=>(0,m.jsxs)(`div`,{style:{display:`grid`,gap:12},children:[(0,m.jsx)(r,{...n,onChange:e=>{n.onChange(e),i({value:e})},children:t??n.children}),e&&(0,m.jsx)(`div`,{style:{fontSize:14},children:n.value.length>0?`Получено файлов: ${n.value.length}`:`Перетащите файл(ы) в область выше`})]}))}var m,h,g,_,v,y,b;function x(){return(x=e((()=>{d(),s(),n(),m=a(),{fn:h}=__STORYBOOK_MODULE_TEST__,g={title:`UI/DropZone`,component:r,args:{value:[],onChange:h(),onChangeError:h(),multiple:!0,readMode:`data-url`,disabled:!1},parameters:{atomicCanvas:!0,layout:`padded`},argTypes:{value:{description:`Текущий массив успешно прочитанных файлов.`,control:!1},onChange:{description:`Вызывается с массивом успешно прочитанных файлов.`,control:!1},onChangeError:{description:`Вызывается при ошибке валидации или чтения файла.`,control:!1},accept:{description:`Допустимые расширения или MIME-типы для нативного input.`,control:`object`},allowedMime:{description:`Список допустимых MIME-типов для проверки.`,control:`object`},maxBytes:{description:`Максимальный размер одного файла в байтах.`,control:`number`},readMode:{description:`Режим чтения файлов: data-url или array-buffer.`,control:`inline-radio`,options:[`data-url`,`array-buffer`]},multiple:{description:`Разрешает принимать несколько файлов за один drop.`,control:`boolean`},disabled:{description:`Блокирует зону и обработку drop-событий.`,control:`boolean`},children:{description:`Кастомный контент внутри drop-зоны.`,control:!1}}},_={render:p({showStatus:!0})},v={render:p({children:(0,m.jsxs)(`div`,{style:{display:`grid`,placeItems:`center`,gap:6,minHeight:120},children:[(0,m.jsx)(u,{}),(0,m.jsx)(`span`,{children:`Перетащите один файл`})]})}),args:{multiple:!1}},y={render:p(),args:{disabled:!0,multiple:!0}},_.parameters={..._.parameters,docs:{..._.parameters?.docs,source:{originalSource:`{
|
|
2
2
|
render: createDropZoneStoryRender({
|
|
3
3
|
showStatus: true
|
|
4
4
|
})
|
|
@@ -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-BmGorvhi.js";import{_ as r,a as i,c as a,d as o,f as s,g as c,h as l,i as u,l as d,m as f,o as p,p as m,r as h,s as g,u as _}from"./ContextMenu-BC5OXqVj.js";function v({children:e}){let{mode:t,open:n,menuId:i,triggerId:a,registerTriggerElement:o,onTriggerClick:s,onTriggerKeyDown:u}=f();if(t!==`click`)throw Error(`DropdownMenu.Trigger must be used within <DropdownMenu>`);return(0,y.cloneElement)(e,{id:e.props.id??a,ref:t=>{let n=e.props.ref;l(n,t),o(t)},"aria-haspopup":`menu`,"aria-expanded":n,"aria-controls":n?i:void 0,onClick:r(e.props.onClick,s),onKeyDown:c(e.props.onKeyDown,u)})}var y;function b(){return(b=e((()=>{y=t(),m(),v.__docgenInfo={description:``,methods:[],displayName:`DropdownMenuTrigger`,props:{children:{required:!0,tsType:{name:`ReactElement`,elements:[{name:`intersection`,raw:`HTMLAttributes<HTMLElement> & { ref?: Ref<HTMLElement> }`,elements:[{name:`HTMLAttributes`,elements:[{name:`HTMLElement`}],raw:`HTMLAttributes<HTMLElement>`},{name:`signature`,type:`object`,raw:`{ ref?: Ref<HTMLElement> }`,signature:{properties:[{key:`ref`,value:{name:`Ref`,elements:[{name:`HTMLElement`}],raw:`Ref<HTMLElement>`,required:!1}}]}}]}],raw:`ReactElement<HTMLAttributes<HTMLElement> & { ref?: Ref<HTMLElement> }>`},description:``}}}})))()}function x({children:e,placement:t,open:n,defaultOpen:r,onOpenChange:a}){return(0,S.jsx)(i,{mode:`click`,placement:t,open:n,defaultOpen:r,onOpenChange:a,children:e})}var S;function C(){return(C=e((()=>{t(),b(),s(),_(),a(),p(),u(),S=n(),x.Trigger=v,x.Content=o,x.Item=g,x.Separator=h,x.GroupLabel=d,x.__docgenInfo={description:``,methods:[{name:`Trigger`,docblock:null,modifiers:[`static`],params:[{name:`{ children }: DropdownMenuTriggerProps`,optional:!1,type:{name:`DropdownMenuTriggerProps`,alias:`DropdownMenuTriggerProps`}}],returns:null},{name:`Content`,docblock:null,modifiers:[`static`],params:[{name:`{
|
|
2
2
|
children,
|
|
3
3
|
className,
|
|
4
4
|
"aria-label": ariaLabel,
|
|
@@ -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{i as r,n as i,r as a}from"./iframe-
|
|
1
|
+
import{a as e,n as t}from"./rolldown-runtime-DkW27tQK.js";import{t as n}from"./react-BZJXY1be.js";import{i as r,n as i,r as a}from"./iframe-BmGorvhi.js";import{a as o,i as s}from"./utils-tg3ibbzi.js";import{n as c,t as l}from"./Button-C-uRygWz.js";import{n as u,t as d}from"./OneStepScroller-dD9RSWvg.js";var f,p;function m(){return(m=t((()=>{r(),f=[[`path`,{d:`m11 17-5-5 5-5`,key:`13zhaf`}],[`path`,{d:`m18 17-5-5 5-5`,key:`h8a8et`}]],p=a(`chevrons-left`,f)})))()}var h,g;function _(){return(_=t((()=>{r(),h=[[`path`,{d:`m6 17 5-5-5-5`,key:`xnjwq`}],[`path`,{d:`m13 17 5-5-5-5`,key:`17xmmf`}]],g=a(`chevrons-right`,h)})))()}var v,y,b,x,S,C,w;function T(){return(T=t((()=>{v=`sj-rIq`,y=`_3anR7j`,b=`gMRIsT`,x=`f5Pv1e`,S=`q7eZzv`,C=`maUL24`,w={expandableActionPanel:v,content:y,contentScroller:b,labeledPanel:x,label:S,labeledActionPanel:C}})))()}function E({children:e,className:t,contentClassName:n,toggleClassName:r,open:i,defaultOpen:a=!1,disabled:s,onOpenChange:c,expandLabel:u=`Раскрыть панель действий влево`,collapseLabel:f=`Свернуть панель действий`,panelLabel:m=`Действия панели`,itemSelector:h,scrollPadding:_,smoothScroll:v}){let[y,b]=(0,D.useState)(a),x=(0,D.useId)(),S=i!==void 0,C=S?i:y,T=(0,D.useCallback)(e=>{let t=typeof e==`function`?e(C):e;S||b(t),c?.(t)},[S,c,C]),E=()=>T(e=>!e),k=C?g:p;return(0,O.jsxs)(`div`,{className:o(w.expandableActionPanel,t),"data-ui":`expandable-action-panel`,"data-open":C?``:void 0,children:[(0,O.jsx)(l,{className:r,icon:(0,O.jsx)(k,{}),title:C?f:u,disabled:s,variant:`neutralOutline`,"aria-expanded":C,"aria-controls":x,"data-ui":`expandable-action-panel-toggle`,"data-action":C?`collapse-action-panel`:`expand-action-panel`,onClick:E}),C&&(0,O.jsx)(`div`,{id:x,role:`group`,"aria-label":m,className:o(w.content,n),children:(0,O.jsx)(d,{className:w.contentScroller,itemSelector:h,scrollPadding:_,smooth:v,children:e})})]})}var D,O;function k(){return(k=t((()=>{D=e(n(),1),s(),m(),_(),c(),u(),T(),O=i(),E.__docgenInfo={description:`Горизонтальная раскрывающаяся панель действий.
|
|
2
2
|
Не знает о внешнем layout и может использоваться рядом с любым содержимым.`,methods:[],displayName:`ExpandableActionPanel`,props:{className:{required:!1,tsType:{name:`string`},description:``},contentClassName:{required:!1,tsType:{name:`string`},description:``},toggleClassName:{required:!1,tsType:{name:`string`},description:``},open:{required:!1,tsType:{name:`boolean`},description:``},defaultOpen:{required:!1,tsType:{name:`boolean`},description:``,defaultValue:{value:`false`,computed:!1}},disabled:{required:!1,tsType:{name:`boolean`},description:``},onOpenChange:{required:!1,tsType:{name:`signature`,type:`function`,raw:`(open: boolean) => void`,signature:{arguments:[{type:{name:`boolean`},name:`open`}],return:{name:`void`}}},description:``},expandLabel:{required:!1,tsType:{name:`string`},description:``,defaultValue:{value:`"Раскрыть панель действий влево"`,computed:!1}},collapseLabel:{required:!1,tsType:{name:`string`},description:``,defaultValue:{value:`"Свернуть панель действий"`,computed:!1}},panelLabel:{required:!1,tsType:{name:`string`},description:``,defaultValue:{value:`"Действия панели"`,computed:!1}},itemSelector:{required:!1,tsType:{name:`string`},description:``},scrollPadding:{required:!1,tsType:{name:`number`},description:``},smoothScroll:{required:!1,tsType:{name:`boolean`},description:``}},composes:[`PropsWithChildren`]}})))()}export{T as i,k as n,w as r,E 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,t as i}from"./check-
|
|
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,t as i}from"./check-CHvYWZD5.js";import{i as a,n as o,r as s,t as c}from"./ExpandableActionPanel-DmKB3xVB.js";import{n as l,t as u}from"./CheckBox-nBqHJGY9.js";import{n as d,t as f}from"./refresh-cw-Obk3FkLO.js";import{n as p,t as m}from"./settings-2-BQ2LYeiA.js";import{i as h,n as g,r as _}from"./iframe-BmGorvhi.js";import{a as v,i as y}from"./utils-tg3ibbzi.js";import{n as b,t as x}from"./Button-C-uRygWz.js";import{n as S,t as C}from"./createControlledStoryRender-BouhvX-R.js";import{l as w,o as T}from"./Input-YuUUu0DD.js";import{n as E,t as D}from"./Select-BeoH_3V4.js";var O,k;function A(){return(A=e((()=>{h(),O=[[`path`,{d:`m21 21-4.34-4.34`,key:`14j7rj`}],[`circle`,{cx:`11`,cy:`11`,r:`8`,key:`4ej97u`}]],k=_(`search`,O)})))()}function j({label:e,className:t,labelClassName:n,labelStyle:r,labelMinWidth:i=`12em`,panelClassName:a,open:o,defaultOpen:l,...u}){let d={...r,minWidth:i},f=typeof e==`string`?e:void 0;return(0,M.jsxs)(`div`,{className:v(s.labeledPanel,t),"data-ui":`labeled-expandable-action-panel`,children:[(0,M.jsx)(`div`,{className:v(`flexEllipsis`,s.label,n),style:d,title:f,children:e}),(0,M.jsx)(c,{...u,open:o,defaultOpen:l,className:v(s.labeledActionPanel,a)})]})}var M;function N(){return(N=e((()=>{n(),y(),o(),a(),M=g(),j.__docgenInfo={description:"Раскрывающаяся панель действий с левым текстом, который сжимается через `flexEllipsis`.",methods:[],displayName:`LabeledExpandableActionPanel`,props:{label:{required:!0,tsType:{name:`ReactReactNode`,raw:`React.ReactNode`},description:``},className:{required:!1,tsType:{name:`string`},description:``},labelClassName:{required:!1,tsType:{name:`string`},description:``},labelStyle:{required:!1,tsType:{name:`ReactCSSProperties`,raw:`React.CSSProperties`},description:``},labelMinWidth:{required:!1,tsType:{name:`ReactCSSProperties["minWidth"]`,raw:`React.CSSProperties["minWidth"]`},description:``,defaultValue:{value:`"12em"`,computed:!1}},panelClassName:{required:!1,tsType:{name:`string`},description:``}},composes:[`Omit`]}})))()}var P=t({BasePanel:()=>W,Labeled:()=>U,__namedExportsOrder:()=>G,default:()=>z});function F(){let[e,t]=(0,I.useState)(``),[n,r]=(0,I.useState)(!1),[a,o]=(0,I.useState)(`Все`);return(0,L.jsxs)(L.Fragment,{children:[(0,L.jsx)(`div`,{style:{width:`calc(14em + var(--width-add))`},children:(0,L.jsx)(T,{placeholder:`Поиск`,value:e,onChange:t,endAdornment:(0,L.jsx)(k,{})})}),(0,L.jsx)(`div`,{style:{width:`calc(12em + var(--width-add))`},children:(0,L.jsx)(D,{placeholder:`Статус`,options:B,value:a,onChange:o,getOptionKey:e=>e,getOptionLabel:e=>e})}),(0,L.jsx)(u,{placeholder:`Только мои`,value:n,onChange:r,noWrap:!0}),(0,L.jsx)(x,{icon:(0,L.jsx)(f,{}),title:`Обновить`}),(0,L.jsx)(x,{icon:(0,L.jsx)(m,{}),title:`Настроить`}),(0,L.jsx)(x,{icon:(0,L.jsx)(i,{}),tone:`success`,appearance:`solid`,children:`Применить`})]})}var I,L,R,z,B,V,H,U,W,G;function K(){return(K=e((()=>{I=n(),r(),d(),A(),p(),b(),l(),S(),w(),E(),o(),N(),L=g(),{fn:R}=__STORYBOOK_MODULE_TEST__,z={title:`UI/ExpandableActionPanel`,component:j,args:{label:`Длинное название строки с результатами расчёта и параметрами отбора`,labelMinWidth:`18em`,open:!1,defaultOpen:!1,disabled:!1,onOpenChange:R(),expandLabel:`Раскрыть панель действий влево`,collapseLabel:`Свернуть панель действий`,panelLabel:`Действия панели`,smoothScroll:!1,children:null},parameters:{atomicCanvas:!0,layout:`padded`},argTypes:{label:{description:`Текст или ReactNode слева от панели.`,control:`text`},labelMinWidth:{description:"Минимальная ширина `flexEllipsis`-текста.",control:`text`},labelClassName:{description:`Дополнительный CSS-класс области подписи.`,control:`text`},labelStyle:{description:`Inline-стили области подписи.`,control:`object`},panelClassName:{description:`Дополнительный CSS-класс внутренней ExpandableActionPanel.`,control:`text`},contentClassName:{description:`Дополнительный CSS-класс раскрываемого контейнера действий.`,control:`text`},toggleClassName:{description:`Дополнительный CSS-класс кнопки раскрытия.`,control:`text`},open:{description:`Контролируемое состояние раскрытия.`,control:`boolean`},defaultOpen:{description:`Начальное состояние раскрытия в uncontrolled-режиме.`,control:`boolean`},disabled:{description:`Блокирует кнопку раскрытия.`,control:`boolean`},onOpenChange:{description:`Вызывается при раскрытии или сворачивании панели.`,control:!1},expandLabel:{description:`Tooltip и доступное имя кнопки в закрытом состоянии.`,control:`text`},collapseLabel:{description:`Tooltip и доступное имя кнопки в раскрытом состоянии.`,control:`text`},panelLabel:{description:`Доступное имя раскрытой группы действий.`,control:`text`},itemSelector:{description:`CSS-селектор элементов для пошаговой прокрутки.`,control:`text`},scrollPadding:{description:`Отступ пошаговой прокрутки в пикселях.`,control:{type:`number`,min:0,step:1}},smoothScroll:{description:`Включает плавную пошаговую прокрутку.`,control:`boolean`},children:{description:`Набор действий внутри раскрываемой панели.`,control:!1}}},B=[`Все`,`Активные`,`Архив`],V=C((e,t)=>(0,L.jsx)(`div`,{style:{width:`min(100%, 920px)`},children:(0,L.jsx)(j,{...e,open:e.open,onOpenChange:n=>{e.onOpenChange?.(n),t({open:n})},children:e.children??(0,L.jsx)(F,{})})})),H=C((e,t)=>(0,L.jsx)(`div`,{style:{width:`min(100%, 720px)`,display:`flex`,justifyContent:`flex-end`},children:(0,L.jsx)(c,{...e,open:e.open,onOpenChange:n=>{e.onOpenChange?.(n),t({open:n})},children:e.children??(0,L.jsx)(F,{})})})),U={render:V},W={args:{open:!0,panelLabel:`Действия панели`},render:H},U.parameters={...U.parameters,docs:{...U.parameters?.docs,source:{originalSource:`{
|
|
2
2
|
render: renderLabeledPanelStory
|
|
3
3
|
}`,...U.parameters?.docs?.source}}},W.parameters={...W.parameters,docs:{...W.parameters?.docs,source:{originalSource:`{
|
|
4
4
|
args: {
|
|
@@ -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-BmGorvhi.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-u0CCD6I1.js";import{a as p,c as m,d as h,f as g,g as _,h as v,i as y,l as b,m as x,n as S,o as C,p as w,r as T,s as E,t as D,u as O}from"./Flex.stories-CrHxjVCH.js";function k(e){let t={code:`code`,h2:`h2`,h3:`h3`,li:`li`,p:`p`,pre:`pre`,ul:`ul`,...n(),...e.components};return(0,j.jsxs)(j.Fragment,{children:[(0,j.jsx)(s,{of:C,parameters:{docs:{toc:!0}}}),`
|
|
2
2
|
`,(0,j.jsx)(u,{children:`Flex`}),`
|
|
3
3
|
`,(0,j.jsx)(o,{children:`Набор flex-layout примитивов для строк, колонок и быстрых компоновок интерфейса`}),`
|
|
4
4
|
`,(0,j.jsx)(t.p,{children:`Flex уже имеет живые stories, а эта страница собирает их в структурированную документацию с краткими рекомендациями, примерами подключения и API.
|
|
@@ -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-E950Ehp0.js";import{i,r as a}from"./getFlexClasses-DOf6NlyJ.js";import{n as o,t as s}from"./FlexContainer-4Ap7vbIt.js";import{n as c,t as l}from"./FlexItem-Dwqi7KeT.js";import{n as u,t as d}from"./ResponsiveLayoutPreview-BHBxtn2W.js";function f({ref:e,variant:t,children:n,className:r=``,...i}){let o=[a(t??``),r].filter(Boolean).join(` `);return(0,p.jsx)(s,{ref:e,className:o,...i,children:n})}var p;function m(){return(m=e((()=>{o(),i(),p=r(),f.displayName=`PredefinedFlex`,f.__docgenInfo={description:``,methods:[],displayName:`PredefinedFlex`,props:{variant:{required:!1,tsType:{name:`union`,raw:`"center" | "centerBetween" | "columnCenter"`,elements:[{name:`literal`,value:`"center"`},{name:`literal`,value:`"centerBetween"`},{name:`literal`,value:`"columnCenter"`}]},description:``},ref:{required:!1,tsType:{name:`Ref`,elements:[{name:`HTMLElement`}],raw:`Ref<HTMLElement>`},description:``},className:{defaultValue:{value:`""`,computed:!1},required:!1}},composes:[`Omit`]}})))()}var h;function g(){return(g=e((()=>{o(),c(),m(),h={Container:s,Item:l,Predefined:f}})))()}var _=t({AlignItems:()=>O,BasicColumn:()=>T,BasicRow:()=>w,Directions:()=>E,FlexItems:()=>j,Gaps:()=>A,InlineFlex:()=>N,JustifyContent:()=>D,Predefined:()=>M,RealWorld:()=>P,ResponsiveContainer:()=>F,ResponsiveItems:()=>L,ResponsiveWrapping:()=>I,Wrapping:()=>k,__namedExportsOrder:()=>R,default:()=>C});function v({children:e,index:t=0}){return(0,y.jsx)(h.Item,{style:{...x.item,backgroundColor:S(t)},children:e})}var y,b,x,S,C,w,T,E,D,O,k,A,j,M,N,P,F,I,L,R;function z(){return(z=e((()=>{n(),u(),g(),y=r(),{useArgs:b}=__STORYBOOK_MODULE_PREVIEW_API__,x={container:{border:`2px dashed var(--border-0)`,padding:`2em`,marginBlock:`1em`},item:{padding:`16px`,textAlign:`center`,fontWeight:`bold`,color:`white`,minHeight:`5em`,minWidth:`10em`,display:`flex`,alignItems:`center`,justifyContent:`center`},itemColors:[`#ff6b6b`,`#4ecdc4`,`#45b7d1`,`#96ceb4`,`#feca57`,`#ff9ff3`]},S=e=>x.itemColors[e%x.itemColors.length],C={title:`Layout/Flex`,component:h.Container,args:{row:!0,gap:`md`},parameters:{layout:`padded`},decorators:[e=>{let[t]=b();return(0,y.jsx)(e,{args:t})}],argTypes:{inline:{description:`Использует inline-flex вместо flex.`,control:`boolean`},row:{description:`Направляет элементы по строке.`,control:`boolean`},column:{description:`Направляет элементы по колонке.`,control:`boolean`},rowReverse:{description:`Разворачивает порядок строки.`,control:`boolean`},columnReverse:{description:`Разворачивает порядок колонки.`,control:`boolean`},wrap:{description:`Разрешает перенос элементов.`,control:`boolean`},nowrap:{description:`Запрещает перенос элементов.`,control:`boolean`},wrapReverse:{description:`Разворачивает направление строк при переносе.`,control:`boolean`},align:{description:`Выравнивание по поперечной оси.`,control:`select`,options:[`start`,`center`,`end`,`stretch`,`baseline`]},justify:{description:`Выравнивание по главной оси.`,control:`select`,options:[`start`,`center`,`end`,`stretch`,`between`,`around`,`evenly`]},alignContent:{description:`Распределение строк по поперечной оси.`,control:`select`,options:[`start`,`center`,`end`,`stretch`,`between`,`around`,`evenly`]},gap:{description:`Общий интервал между элементами.`,control:`select`,options:[`none`,`xs`,`sm`,`md`,`lg`,`xl`]},gapRow:{description:`Интервал между строками.`,control:`select`,options:[`xs`,`sm`,`md`,`lg`,`xl`]},gapColumn:{description:`Интервал между колонками.`,control:`select`,options:[`xs`,`sm`,`md`,`lg`,`xl`]},as:{description:`Семантический HTML-тег контейнера.`,control:`select`,options:[`div`,`section`,`main`,`nav`,`ul`]},children:{description:`Содержимое flex-контейнера.`,control:!1}}},w={render:e=>(0,y.jsx)(h.Container,{...e,style:x.container}),args:{children:(0,y.jsxs)(y.Fragment,{children:[(0,y.jsx)(v,{index:0,children:`Item 1`}),(0,y.jsx)(v,{index:1,children:`Item 2`}),(0,y.jsx)(v,{index:2,children:`Item 3`})]}),row:!0}},T={render:e=>(0,y.jsx)(h.Container,{...e,style:x.container}),args:{children:(0,y.jsxs)(y.Fragment,{children:[(0,y.jsx)(v,{index:0,children:`Header`}),(0,y.jsx)(v,{index:1,children:`Content`}),(0,y.jsx)(v,{index:2,children:`Footer`})]}),column:!0}},E={render:()=>(0,y.jsxs)(`div`,{children:[(0,y.jsx)(`h3`,{children:`Row (default)`}),(0,y.jsxs)(h.Container,{row:!0,style:x.container,children:[(0,y.jsx)(v,{index:0,children:`1`}),(0,y.jsx)(v,{index:1,children:`2`}),(0,y.jsx)(v,{index:2,children:`3`})]}),(0,y.jsx)(`h3`,{children:`Row Reverse`}),(0,y.jsxs)(h.Container,{rowReverse:!0,style:x.container,children:[(0,y.jsx)(v,{index:0,children:`1`}),(0,y.jsx)(v,{index:1,children:`2`}),(0,y.jsx)(v,{index:2,children:`3`})]}),(0,y.jsx)(`h3`,{children:`Column`}),(0,y.jsxs)(h.Container,{column:!0,style:x.container,children:[(0,y.jsx)(v,{index:0,children:`1`}),(0,y.jsx)(v,{index:1,children:`2`}),(0,y.jsx)(v,{index:2,children:`3`})]}),(0,y.jsx)(`h3`,{children:`Column Reverse`}),(0,y.jsxs)(h.Container,{columnReverse:!0,style:x.container,children:[(0,y.jsx)(v,{index:0,children:`1`}),(0,y.jsx)(v,{index:1,children:`2`}),(0,y.jsx)(v,{index:2,children:`3`})]})]}),args:{children:void 0}},D={render:()=>(0,y.jsx)(`div`,{children:[`start`,`center`,`end`,`between`,`around`,`evenly`].map(e=>(0,y.jsxs)(`div`,{children:[(0,y.jsxs)(`h3`,{children:[`Justify: `,e]}),(0,y.jsxs)(h.Container,{row:!0,justify:e,style:x.container,children:[(0,y.jsx)(v,{index:0,children:`Item 1`}),(0,y.jsx)(v,{index:1,children:`Item 2`}),(0,y.jsx)(v,{index:2,children:`Item 3`})]})]},e))}),args:{children:void 0}},O={render:()=>(0,y.jsx)(`div`,{children:[`start`,`center`,`end`,`stretch`,`baseline`].map(e=>(0,y.jsxs)(`div`,{children:[(0,y.jsxs)(`h3`,{children:[`Align: `,e]}),(0,y.jsxs)(h.Container,{row:!0,align:e,style:{...x.container,height:`120px`},children:[(0,y.jsx)(v,{index:0,children:(0,y.jsx)(`div`,{children:`Short`})}),(0,y.jsx)(v,{index:1,children:(0,y.jsx)(`div`,{style:{padding:`40px`},children:`Tall`})}),(0,y.jsx)(v,{index:2,children:(0,y.jsx)(`div`,{style:{padding:`24px`},children:`Medium`})})]})]},e))}),args:{children:void 0}},k={render:()=>(0,y.jsxs)(`div`,{children:[(0,y.jsx)(`h3`,{children:`No Wrap (default)`}),(0,y.jsx)(h.Container,{row:!0,nowrap:!0,style:x.container,children:[1,2,3,4,5,6,7,8,9,10,11,12].map(e=>(0,y.jsxs)(v,{index:e,children:[`Item `,e]},e))}),(0,y.jsx)(`h3`,{children:`Wrap`}),(0,y.jsx)(h.Container,{row:!0,wrap:!0,style:x.container,children:[1,2,3,4,5,6,7,8,9,10,11,12].map(e=>(0,y.jsxs)(v,{index:e,children:[`Item `,e]},e))}),(0,y.jsx)(`h3`,{children:`Wrap Reverse`}),(0,y.jsx)(h.Container,{row:!0,wrapReverse:!0,style:x.container,children:[1,2,3,4,5,6,7,8,9,10,11,12].map(e=>(0,y.jsxs)(v,{index:e,children:[`Item `,e]},e))})]}),args:{children:void 0}},A={render:()=>(0,y.jsxs)(`div`,{children:[[`xs`,`sm`,`md`,`lg`,`xl`].map(e=>(0,y.jsxs)(`div`,{children:[(0,y.jsxs)(`h3`,{children:[`Gap: `,e]}),(0,y.jsx)(h.Container,{row:!0,wrap:!0,gap:e,style:x.container,children:[1,2,3,4,5,6].map(e=>(0,y.jsxs)(v,{index:e,children:[`Item `,e]},e))})]},e)),(0,y.jsx)(`h3`,{children:`Different Row and Column Gaps`}),(0,y.jsx)(h.Container,{row:!0,wrap:!0,gapRow:`lg`,gapColumn:`sm`,style:x.container,children:[1,2,3,4,5,6,7,8,9,10,11,12].map(e=>(0,y.jsxs)(v,{index:e,children:[`Item `,e]},e))})]}),args:{children:void 0}},j={render:()=>(0,y.jsxs)(`div`,{children:[(0,y.jsx)(`h3`,{children:`Grow Properties`}),(0,y.jsxs)(h.Container,{row:!0,style:x.container,children:[(0,y.jsx)(v,{index:0,children:`Default`}),(0,y.jsx)(h.Item,{grow:!0,children:(0,y.jsx)(`div`,{style:{...x.item,backgroundColor:S(1)},children:`Grow`})}),(0,y.jsx)(v,{index:2,children:`Default`})]}),(0,y.jsx)(`h3`,{children:`Shrink Properties`}),(0,y.jsxs)(h.Container,{row:!0,style:{...x.container,width:`300px`},children:[(0,y.jsx)(h.Item,{shrink:!1,children:(0,y.jsx)(`div`,{style:{...x.item,backgroundColor:S(0),width:`150px`},children:`No Shrink`})}),(0,y.jsx)(h.Item,{children:(0,y.jsx)(`div`,{style:{...x.item,backgroundColor:S(1),width:`150px`},children:`Shrink (default)`})})]}),(0,y.jsx)(`h3`,{children:`Composite Classes`}),(0,y.jsxs)(h.Container,{row:!0,style:x.container,children:[(0,y.jsx)(h.Item,{flex0:!0,children:(0,y.jsx)(`div`,{style:{...x.item,backgroundColor:S(0)},children:`flex0`})}),(0,y.jsx)(h.Item,{flex1:!0,children:(0,y.jsx)(`div`,{style:{...x.item,backgroundColor:S(1)},children:`flex1`})}),(0,y.jsx)(h.Item,{flex0:!0,children:(0,y.jsx)(`div`,{style:{...x.item,backgroundColor:S(2)},children:`flex0`})})]})]}),args:{children:void 0}},M={render:()=>(0,y.jsxs)(`div`,{children:[(0,y.jsx)(`h3`,{children:`Center`}),(0,y.jsx)(h.Predefined,{variant:`center`,style:{...x.container,height:`100px`},children:(0,y.jsx)(v,{index:0,children:`Centered Content`})}),(0,y.jsx)(`h3`,{children:`Center Between`}),(0,y.jsxs)(h.Predefined,{variant:`centerBetween`,style:x.container,children:[(0,y.jsx)(v,{index:0,children:`Left`}),(0,y.jsx)(v,{index:1,children:`Right`})]})]}),args:{children:void 0}},N={render:()=>(0,y.jsxs)(`div`,{children:[(0,y.jsxs)(`p`,{children:[`This is text with`,(0,y.jsxs)(h.Container,{inline:!0,align:`center`,gap:`sm`,style:{margin:`0 8px`},children:[(0,y.jsx)(v,{index:0,children:`inline`}),(0,y.jsx)(v,{index:1,children:`flex`})]}),`elements inside.`]}),(0,y.jsxs)(`p`,{children:[`Another example with`,(0,y.jsxs)(h.Container,{inline:!0,column:!0,gap:`xs`,style:{margin:`0 8px`},children:[(0,y.jsx)(v,{index:2,children:`vertical`}),(0,y.jsx)(v,{index:3,children:`inline`})]}),`flex.`]})]}),args:{children:void 0}},P={render:()=>(0,y.jsxs)(`div`,{children:[(0,y.jsx)(`h3`,{children:`Navigation Bar`}),(0,y.jsxs)(h.Predefined,{variant:`centerBetween`,style:x.container,children:[(0,y.jsxs)(h.Container,{row:!0,align:`center`,gap:`md`,children:[(0,y.jsx)(v,{index:0,children:`Logo`}),(0,y.jsx)(v,{index:1,children:`Home`}),(0,y.jsx)(v,{index:2,children:`About`}),(0,y.jsx)(v,{index:3,children:`Contact`})]}),(0,y.jsx)(v,{index:4,children:`Login`})]}),(0,y.jsx)(`h3`,{children:`Card Layout`}),(0,y.jsx)(h.Container,{row:!0,wrap:!0,gap:`lg`,style:x.container,children:[1,2,3,4].map(e=>(0,y.jsx)(h.Item,{flex1:!0,style:{minWidth:`200px`},children:(0,y.jsxs)(`div`,{style:{border:`1px solid #ddd`,borderRadius:`8px`,padding:`16px`,textAlign:`center`,backgroundColor:S(e)},children:[(0,y.jsxs)(`h4`,{children:[`Card `,e]}),(0,y.jsx)(`p`,{children:`Card content goes here`})]})},e))}),(0,y.jsx)(`h3`,{children:`Form Layout`}),(0,y.jsxs)(h.Container,{column:!0,gap:`md`,style:x.container,children:[(0,y.jsxs)(h.Container,{row:!0,gap:`md`,children:[(0,y.jsx)(h.Item,{flex1:!0,children:(0,y.jsx)(v,{index:0,children:`First Name`})}),(0,y.jsx)(h.Item,{flex1:!0,children:(0,y.jsx)(v,{index:1,children:`Last Name`})})]}),(0,y.jsx)(v,{index:2,children:`Email`}),(0,y.jsx)(v,{index:3,children:`Message`})]})]}),args:{children:void 0}},F={name:`Responsive: контейнер`,render:()=>(0,y.jsx)(d,{title:`Направление, выравнивание и общий gap`,description:`Изменяйте ширину canvas: DOM остаётся тем же, а режим выбирают media mixins до hydration.`,legend:[`laptop — строка, элементы у нижнего края, распределение between, gap xl`,`tablet — строка, центрирование, gap md`,`mobile — колонка, растяжение по ширине, gap sm`],children:(0,y.jsxs)(h.Container,{row:{mobile:!1,tablet:!0},column:{mobile:!0,tablet:!1},align:{mobile:`stretch`,tablet:`center`,laptop:`end`},justify:{mobile:`start`,tablet:`center`,laptop:`between`},gap:{mobile:`sm`,tablet:`md`,laptop:`xl`},style:{...x.container,minHeight:`14em`},children:[(0,y.jsx)(v,{index:0,children:`Первый`}),(0,y.jsx)(v,{index:1,children:`Второй`}),(0,y.jsx)(v,{index:2,children:`Третий`})]})}),args:{children:void 0},parameters:{docs:{description:{story:"Проверяет исходный сценарий `column={{ mobile: true, tablet: false }}` вместе с responsive row, align, justify и gap."}}}},I={name:`Responsive: перенос и интервалы`,render:()=>(0,y.jsx)(d,{title:`Wrap, alignContent, row-gap и column-gap`,description:`Высота контейнера зафиксирована только для наглядности распределения нескольких строк.`,legend:[`laptop — nowrap, интервалы xl/sm`,`tablet — wrap, строки распределены between, интервалы lg/md`,`mobile — wrap-reverse, строки центрированы, интервалы sm/xs`],children:(0,y.jsx)(h.Container,{row:!0,nowrap:{mobile:!1,tablet:!1,laptop:!0},wrap:{mobile:!1,tablet:!0,laptop:!1},wrapReverse:{mobile:!0,tablet:!1},alignContent:{mobile:`center`,tablet:`between`,laptop:`stretch`},gapRow:{mobile:`sm`,tablet:`lg`,laptop:`xl`},gapColumn:{mobile:`xs`,tablet:`md`,laptop:`sm`},style:{...x.container,height:`26em`,overflow:`auto`},children:[1,2,3,4,5,6].map(e=>(0,y.jsxs)(v,{index:e,children:[`Элемент `,e]},e))})}),args:{children:void 0}},L={name:`Responsive: элементы`,render:()=>(0,y.jsx)(d,{title:`Flex.Item: flex, grow, shrink, basis и alignSelf`,description:`Пример позволяет отдельно увидеть переходы поведения дочерних элементов без JavaScript-наблюдателя.`,legend:[`laptop — центральный элемент flex1, крайние выровнены по start/end`,`tablet — элементы используют grow и basis 0`,`mobile — фиксированное поведение flex0 и растяжение по ширине`],children:(0,y.jsxs)(h.Container,{row:{mobile:!1,tablet:!0},column:{mobile:!0,tablet:!1},align:`stretch`,gap:`md`,style:{...x.container,minHeight:`16em`},children:[(0,y.jsx)(h.Item,{flex0:{mobile:!0,tablet:!1},grow:{mobile:!1,tablet:!0,laptop:!1},basis:{mobile:`auto`,tablet:`0`,laptop:`auto`},alignSelf:{mobile:`stretch`,tablet:`center`,laptop:`start`},children:(0,y.jsx)(`div`,{style:{...x.item,backgroundColor:S(0)},children:`Первый`})}),(0,y.jsx)(h.Item,{flex1:{mobile:!1,tablet:!1,laptop:!0},grow:{mobile:!1,tablet:!0,laptop:!1},shrink:{mobile:!1,tablet:!0},basis:{mobile:`auto`,tablet:`0`,laptop:`auto`},alignSelf:{mobile:`stretch`,tablet:`stretch`,laptop:`center`},children:(0,y.jsx)(`div`,{style:{...x.item,minWidth:0,backgroundColor:S(1)},children:`Изменяемый`})}),(0,y.jsx)(h.Item,{alignSelf:{mobile:`stretch`,tablet:`center`,laptop:`end`},children:(0,y.jsx)(`div`,{style:{...x.item,backgroundColor:S(2)},children:`Третий`})})]})}),args:{children:void 0}},w.parameters={...w.parameters,docs:{...w.parameters?.docs,source:{originalSource:`{
|
|
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-BmGorvhi.js";import{i,r as a}from"./getFlexClasses-DOf6NlyJ.js";import{n as o,t as s}from"./FlexContainer-DGc37vCr.js";import{n as c,t as l}from"./FlexItem-DYv72TvP.js";import{n as u,t as d}from"./ResponsiveLayoutPreview-BWBLsr8u.js";function f({ref:e,variant:t,children:n,className:r=``,...i}){let o=[a(t??``),r].filter(Boolean).join(` `);return(0,p.jsx)(s,{ref:e,className:o,...i,children:n})}var p;function m(){return(m=e((()=>{o(),i(),p=r(),f.displayName=`PredefinedFlex`,f.__docgenInfo={description:``,methods:[],displayName:`PredefinedFlex`,props:{variant:{required:!1,tsType:{name:`union`,raw:`"center" | "centerBetween" | "columnCenter"`,elements:[{name:`literal`,value:`"center"`},{name:`literal`,value:`"centerBetween"`},{name:`literal`,value:`"columnCenter"`}]},description:``},ref:{required:!1,tsType:{name:`Ref`,elements:[{name:`HTMLElement`}],raw:`Ref<HTMLElement>`},description:``},className:{defaultValue:{value:`""`,computed:!1},required:!1}},composes:[`Omit`]}})))()}var h;function g(){return(g=e((()=>{o(),c(),m(),h={Container:s,Item:l,Predefined:f}})))()}var _=t({AlignItems:()=>O,BasicColumn:()=>T,BasicRow:()=>w,Directions:()=>E,FlexItems:()=>j,Gaps:()=>A,InlineFlex:()=>N,JustifyContent:()=>D,Predefined:()=>M,RealWorld:()=>P,ResponsiveContainer:()=>F,ResponsiveItems:()=>L,ResponsiveWrapping:()=>I,Wrapping:()=>k,__namedExportsOrder:()=>R,default:()=>C});function v({children:e,index:t=0}){return(0,y.jsx)(h.Item,{style:{...x.item,backgroundColor:S(t)},children:e})}var y,b,x,S,C,w,T,E,D,O,k,A,j,M,N,P,F,I,L,R;function z(){return(z=e((()=>{n(),u(),g(),y=r(),{useArgs:b}=__STORYBOOK_MODULE_PREVIEW_API__,x={container:{border:`2px dashed var(--border-0)`,padding:`2em`,marginBlock:`1em`},item:{padding:`16px`,textAlign:`center`,fontWeight:`bold`,color:`white`,minHeight:`5em`,minWidth:`10em`,display:`flex`,alignItems:`center`,justifyContent:`center`},itemColors:[`#ff6b6b`,`#4ecdc4`,`#45b7d1`,`#96ceb4`,`#feca57`,`#ff9ff3`]},S=e=>x.itemColors[e%x.itemColors.length],C={title:`Layout/Flex`,component:h.Container,args:{row:!0,gap:`md`},parameters:{layout:`padded`},decorators:[e=>{let[t]=b();return(0,y.jsx)(e,{args:t})}],argTypes:{inline:{description:`Использует inline-flex вместо flex.`,control:`boolean`},row:{description:`Направляет элементы по строке.`,control:`boolean`},column:{description:`Направляет элементы по колонке.`,control:`boolean`},rowReverse:{description:`Разворачивает порядок строки.`,control:`boolean`},columnReverse:{description:`Разворачивает порядок колонки.`,control:`boolean`},wrap:{description:`Разрешает перенос элементов.`,control:`boolean`},nowrap:{description:`Запрещает перенос элементов.`,control:`boolean`},wrapReverse:{description:`Разворачивает направление строк при переносе.`,control:`boolean`},align:{description:`Выравнивание по поперечной оси.`,control:`select`,options:[`start`,`center`,`end`,`stretch`,`baseline`]},justify:{description:`Выравнивание по главной оси.`,control:`select`,options:[`start`,`center`,`end`,`stretch`,`between`,`around`,`evenly`]},alignContent:{description:`Распределение строк по поперечной оси.`,control:`select`,options:[`start`,`center`,`end`,`stretch`,`between`,`around`,`evenly`]},gap:{description:`Общий интервал между элементами.`,control:`select`,options:[`none`,`xs`,`sm`,`md`,`lg`,`xl`]},gapRow:{description:`Интервал между строками.`,control:`select`,options:[`xs`,`sm`,`md`,`lg`,`xl`]},gapColumn:{description:`Интервал между колонками.`,control:`select`,options:[`xs`,`sm`,`md`,`lg`,`xl`]},as:{description:`Семантический HTML-тег контейнера.`,control:`select`,options:[`div`,`section`,`main`,`nav`,`ul`]},children:{description:`Содержимое flex-контейнера.`,control:!1}}},w={render:e=>(0,y.jsx)(h.Container,{...e,style:x.container}),args:{children:(0,y.jsxs)(y.Fragment,{children:[(0,y.jsx)(v,{index:0,children:`Item 1`}),(0,y.jsx)(v,{index:1,children:`Item 2`}),(0,y.jsx)(v,{index:2,children:`Item 3`})]}),row:!0}},T={render:e=>(0,y.jsx)(h.Container,{...e,style:x.container}),args:{children:(0,y.jsxs)(y.Fragment,{children:[(0,y.jsx)(v,{index:0,children:`Header`}),(0,y.jsx)(v,{index:1,children:`Content`}),(0,y.jsx)(v,{index:2,children:`Footer`})]}),column:!0}},E={render:()=>(0,y.jsxs)(`div`,{children:[(0,y.jsx)(`h3`,{children:`Row (default)`}),(0,y.jsxs)(h.Container,{row:!0,style:x.container,children:[(0,y.jsx)(v,{index:0,children:`1`}),(0,y.jsx)(v,{index:1,children:`2`}),(0,y.jsx)(v,{index:2,children:`3`})]}),(0,y.jsx)(`h3`,{children:`Row Reverse`}),(0,y.jsxs)(h.Container,{rowReverse:!0,style:x.container,children:[(0,y.jsx)(v,{index:0,children:`1`}),(0,y.jsx)(v,{index:1,children:`2`}),(0,y.jsx)(v,{index:2,children:`3`})]}),(0,y.jsx)(`h3`,{children:`Column`}),(0,y.jsxs)(h.Container,{column:!0,style:x.container,children:[(0,y.jsx)(v,{index:0,children:`1`}),(0,y.jsx)(v,{index:1,children:`2`}),(0,y.jsx)(v,{index:2,children:`3`})]}),(0,y.jsx)(`h3`,{children:`Column Reverse`}),(0,y.jsxs)(h.Container,{columnReverse:!0,style:x.container,children:[(0,y.jsx)(v,{index:0,children:`1`}),(0,y.jsx)(v,{index:1,children:`2`}),(0,y.jsx)(v,{index:2,children:`3`})]})]}),args:{children:void 0}},D={render:()=>(0,y.jsx)(`div`,{children:[`start`,`center`,`end`,`between`,`around`,`evenly`].map(e=>(0,y.jsxs)(`div`,{children:[(0,y.jsxs)(`h3`,{children:[`Justify: `,e]}),(0,y.jsxs)(h.Container,{row:!0,justify:e,style:x.container,children:[(0,y.jsx)(v,{index:0,children:`Item 1`}),(0,y.jsx)(v,{index:1,children:`Item 2`}),(0,y.jsx)(v,{index:2,children:`Item 3`})]})]},e))}),args:{children:void 0}},O={render:()=>(0,y.jsx)(`div`,{children:[`start`,`center`,`end`,`stretch`,`baseline`].map(e=>(0,y.jsxs)(`div`,{children:[(0,y.jsxs)(`h3`,{children:[`Align: `,e]}),(0,y.jsxs)(h.Container,{row:!0,align:e,style:{...x.container,height:`120px`},children:[(0,y.jsx)(v,{index:0,children:(0,y.jsx)(`div`,{children:`Short`})}),(0,y.jsx)(v,{index:1,children:(0,y.jsx)(`div`,{style:{padding:`40px`},children:`Tall`})}),(0,y.jsx)(v,{index:2,children:(0,y.jsx)(`div`,{style:{padding:`24px`},children:`Medium`})})]})]},e))}),args:{children:void 0}},k={render:()=>(0,y.jsxs)(`div`,{children:[(0,y.jsx)(`h3`,{children:`No Wrap (default)`}),(0,y.jsx)(h.Container,{row:!0,nowrap:!0,style:x.container,children:[1,2,3,4,5,6,7,8,9,10,11,12].map(e=>(0,y.jsxs)(v,{index:e,children:[`Item `,e]},e))}),(0,y.jsx)(`h3`,{children:`Wrap`}),(0,y.jsx)(h.Container,{row:!0,wrap:!0,style:x.container,children:[1,2,3,4,5,6,7,8,9,10,11,12].map(e=>(0,y.jsxs)(v,{index:e,children:[`Item `,e]},e))}),(0,y.jsx)(`h3`,{children:`Wrap Reverse`}),(0,y.jsx)(h.Container,{row:!0,wrapReverse:!0,style:x.container,children:[1,2,3,4,5,6,7,8,9,10,11,12].map(e=>(0,y.jsxs)(v,{index:e,children:[`Item `,e]},e))})]}),args:{children:void 0}},A={render:()=>(0,y.jsxs)(`div`,{children:[[`xs`,`sm`,`md`,`lg`,`xl`].map(e=>(0,y.jsxs)(`div`,{children:[(0,y.jsxs)(`h3`,{children:[`Gap: `,e]}),(0,y.jsx)(h.Container,{row:!0,wrap:!0,gap:e,style:x.container,children:[1,2,3,4,5,6].map(e=>(0,y.jsxs)(v,{index:e,children:[`Item `,e]},e))})]},e)),(0,y.jsx)(`h3`,{children:`Different Row and Column Gaps`}),(0,y.jsx)(h.Container,{row:!0,wrap:!0,gapRow:`lg`,gapColumn:`sm`,style:x.container,children:[1,2,3,4,5,6,7,8,9,10,11,12].map(e=>(0,y.jsxs)(v,{index:e,children:[`Item `,e]},e))})]}),args:{children:void 0}},j={render:()=>(0,y.jsxs)(`div`,{children:[(0,y.jsx)(`h3`,{children:`Grow Properties`}),(0,y.jsxs)(h.Container,{row:!0,style:x.container,children:[(0,y.jsx)(v,{index:0,children:`Default`}),(0,y.jsx)(h.Item,{grow:!0,children:(0,y.jsx)(`div`,{style:{...x.item,backgroundColor:S(1)},children:`Grow`})}),(0,y.jsx)(v,{index:2,children:`Default`})]}),(0,y.jsx)(`h3`,{children:`Shrink Properties`}),(0,y.jsxs)(h.Container,{row:!0,style:{...x.container,width:`300px`},children:[(0,y.jsx)(h.Item,{shrink:!1,children:(0,y.jsx)(`div`,{style:{...x.item,backgroundColor:S(0),width:`150px`},children:`No Shrink`})}),(0,y.jsx)(h.Item,{children:(0,y.jsx)(`div`,{style:{...x.item,backgroundColor:S(1),width:`150px`},children:`Shrink (default)`})})]}),(0,y.jsx)(`h3`,{children:`Composite Classes`}),(0,y.jsxs)(h.Container,{row:!0,style:x.container,children:[(0,y.jsx)(h.Item,{flex0:!0,children:(0,y.jsx)(`div`,{style:{...x.item,backgroundColor:S(0)},children:`flex0`})}),(0,y.jsx)(h.Item,{flex1:!0,children:(0,y.jsx)(`div`,{style:{...x.item,backgroundColor:S(1)},children:`flex1`})}),(0,y.jsx)(h.Item,{flex0:!0,children:(0,y.jsx)(`div`,{style:{...x.item,backgroundColor:S(2)},children:`flex0`})})]})]}),args:{children:void 0}},M={render:()=>(0,y.jsxs)(`div`,{children:[(0,y.jsx)(`h3`,{children:`Center`}),(0,y.jsx)(h.Predefined,{variant:`center`,style:{...x.container,height:`100px`},children:(0,y.jsx)(v,{index:0,children:`Centered Content`})}),(0,y.jsx)(`h3`,{children:`Center Between`}),(0,y.jsxs)(h.Predefined,{variant:`centerBetween`,style:x.container,children:[(0,y.jsx)(v,{index:0,children:`Left`}),(0,y.jsx)(v,{index:1,children:`Right`})]})]}),args:{children:void 0}},N={render:()=>(0,y.jsxs)(`div`,{children:[(0,y.jsxs)(`p`,{children:[`This is text with`,(0,y.jsxs)(h.Container,{inline:!0,align:`center`,gap:`sm`,style:{margin:`0 8px`},children:[(0,y.jsx)(v,{index:0,children:`inline`}),(0,y.jsx)(v,{index:1,children:`flex`})]}),`elements inside.`]}),(0,y.jsxs)(`p`,{children:[`Another example with`,(0,y.jsxs)(h.Container,{inline:!0,column:!0,gap:`xs`,style:{margin:`0 8px`},children:[(0,y.jsx)(v,{index:2,children:`vertical`}),(0,y.jsx)(v,{index:3,children:`inline`})]}),`flex.`]})]}),args:{children:void 0}},P={render:()=>(0,y.jsxs)(`div`,{children:[(0,y.jsx)(`h3`,{children:`Navigation Bar`}),(0,y.jsxs)(h.Predefined,{variant:`centerBetween`,style:x.container,children:[(0,y.jsxs)(h.Container,{row:!0,align:`center`,gap:`md`,children:[(0,y.jsx)(v,{index:0,children:`Logo`}),(0,y.jsx)(v,{index:1,children:`Home`}),(0,y.jsx)(v,{index:2,children:`About`}),(0,y.jsx)(v,{index:3,children:`Contact`})]}),(0,y.jsx)(v,{index:4,children:`Login`})]}),(0,y.jsx)(`h3`,{children:`Card Layout`}),(0,y.jsx)(h.Container,{row:!0,wrap:!0,gap:`lg`,style:x.container,children:[1,2,3,4].map(e=>(0,y.jsx)(h.Item,{flex1:!0,style:{minWidth:`200px`},children:(0,y.jsxs)(`div`,{style:{border:`1px solid #ddd`,borderRadius:`8px`,padding:`16px`,textAlign:`center`,backgroundColor:S(e)},children:[(0,y.jsxs)(`h4`,{children:[`Card `,e]}),(0,y.jsx)(`p`,{children:`Card content goes here`})]})},e))}),(0,y.jsx)(`h3`,{children:`Form Layout`}),(0,y.jsxs)(h.Container,{column:!0,gap:`md`,style:x.container,children:[(0,y.jsxs)(h.Container,{row:!0,gap:`md`,children:[(0,y.jsx)(h.Item,{flex1:!0,children:(0,y.jsx)(v,{index:0,children:`First Name`})}),(0,y.jsx)(h.Item,{flex1:!0,children:(0,y.jsx)(v,{index:1,children:`Last Name`})})]}),(0,y.jsx)(v,{index:2,children:`Email`}),(0,y.jsx)(v,{index:3,children:`Message`})]})]}),args:{children:void 0}},F={name:`Responsive: контейнер`,render:()=>(0,y.jsx)(d,{title:`Направление, выравнивание и общий gap`,description:`Изменяйте ширину canvas: DOM остаётся тем же, а режим выбирают media mixins до hydration.`,legend:[`laptop — строка, элементы у нижнего края, распределение between, gap xl`,`tablet — строка, центрирование, gap md`,`mobile — колонка, растяжение по ширине, gap sm`],children:(0,y.jsxs)(h.Container,{row:{mobile:!1,tablet:!0},column:{mobile:!0,tablet:!1},align:{mobile:`stretch`,tablet:`center`,laptop:`end`},justify:{mobile:`start`,tablet:`center`,laptop:`between`},gap:{mobile:`sm`,tablet:`md`,laptop:`xl`},style:{...x.container,minHeight:`14em`},children:[(0,y.jsx)(v,{index:0,children:`Первый`}),(0,y.jsx)(v,{index:1,children:`Второй`}),(0,y.jsx)(v,{index:2,children:`Третий`})]})}),args:{children:void 0},parameters:{docs:{description:{story:"Проверяет исходный сценарий `column={{ mobile: true, tablet: false }}` вместе с responsive row, align, justify и gap."}}}},I={name:`Responsive: перенос и интервалы`,render:()=>(0,y.jsx)(d,{title:`Wrap, alignContent, row-gap и column-gap`,description:`Высота контейнера зафиксирована только для наглядности распределения нескольких строк.`,legend:[`laptop — nowrap, интервалы xl/sm`,`tablet — wrap, строки распределены between, интервалы lg/md`,`mobile — wrap-reverse, строки центрированы, интервалы sm/xs`],children:(0,y.jsx)(h.Container,{row:!0,nowrap:{mobile:!1,tablet:!1,laptop:!0},wrap:{mobile:!1,tablet:!0,laptop:!1},wrapReverse:{mobile:!0,tablet:!1},alignContent:{mobile:`center`,tablet:`between`,laptop:`stretch`},gapRow:{mobile:`sm`,tablet:`lg`,laptop:`xl`},gapColumn:{mobile:`xs`,tablet:`md`,laptop:`sm`},style:{...x.container,height:`26em`,overflow:`auto`},children:[1,2,3,4,5,6].map(e=>(0,y.jsxs)(v,{index:e,children:[`Элемент `,e]},e))})}),args:{children:void 0}},L={name:`Responsive: элементы`,render:()=>(0,y.jsx)(d,{title:`Flex.Item: flex, grow, shrink, basis и alignSelf`,description:`Пример позволяет отдельно увидеть переходы поведения дочерних элементов без JavaScript-наблюдателя.`,legend:[`laptop — центральный элемент flex1, крайние выровнены по start/end`,`tablet — элементы используют grow и basis 0`,`mobile — фиксированное поведение flex0 и растяжение по ширине`],children:(0,y.jsxs)(h.Container,{row:{mobile:!1,tablet:!0},column:{mobile:!0,tablet:!1},align:`stretch`,gap:`md`,style:{...x.container,minHeight:`16em`},children:[(0,y.jsx)(h.Item,{flex0:{mobile:!0,tablet:!1},grow:{mobile:!1,tablet:!0,laptop:!1},basis:{mobile:`auto`,tablet:`0`,laptop:`auto`},alignSelf:{mobile:`stretch`,tablet:`center`,laptop:`start`},children:(0,y.jsx)(`div`,{style:{...x.item,backgroundColor:S(0)},children:`Первый`})}),(0,y.jsx)(h.Item,{flex1:{mobile:!1,tablet:!1,laptop:!0},grow:{mobile:!1,tablet:!0,laptop:!1},shrink:{mobile:!1,tablet:!0},basis:{mobile:`auto`,tablet:`0`,laptop:`auto`},alignSelf:{mobile:`stretch`,tablet:`stretch`,laptop:`center`},children:(0,y.jsx)(`div`,{style:{...x.item,minWidth:0,backgroundColor:S(1)},children:`Изменяемый`})}),(0,y.jsx)(h.Item,{alignSelf:{mobile:`stretch`,tablet:`center`,laptop:`end`},children:(0,y.jsx)(`div`,{style:{...x.item,backgroundColor:S(2)},children:`Третий`})})]})}),args:{children:void 0}},w.parameters={...w.parameters,docs:{...w.parameters?.docs,source:{originalSource:`{
|
|
2
2
|
render: args => <Flex.Container {...args} style={demoStyles.container} />,
|
|
3
3
|
args: {
|
|
4
4
|
children: <>
|
|
@@ -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-BmGorvhi.js";import{n,t as r}from"./PolymorphicComponent-NBvIz9JD.js";import{i,t as a}from"./getFlexClasses-DOf6NlyJ.js";function o({ref:e,children:t,className:n=``,as:i,style:o,inline:c,row:l,column:u,rowReverse:d,columnReverse:f,wrap:p,nowrap:m,wrapReverse:h,align:g,justify:_,alignContent:v,gap:y,gapRow:b,gapColumn:x,...S}){let C=[a({inline:c,row:l,column:u,rowReverse:d,columnReverse:f,wrap:p,nowrap:m,wrapReverse:h,align:g,justify:_,alignContent:v,gap:y,gapRow:b,gapColumn:x}),n].filter(Boolean).join(` `);return(0,s.jsx)(r,{as:i,...S,ref:e,className:C,style:o,children:t})}var s;function c(){return(c=e((()=>{n(),i(),s=t(),o.displayName=`FlexContainer`,o.__docgenInfo={description:``,methods:[],displayName:`FlexContainer`,props:{inline:{required:!1,tsType:{name:`ResponsiveValue`,elements:[{name:`boolean`}],raw:`ResponsiveValue<boolean>`},description:"Тип display `flex | inline-flex`"},row:{required:!1,tsType:{name:`ResponsiveValue`,elements:[{name:`boolean`}],raw:`ResponsiveValue<boolean>`},description:`Направление flex-контейнера`},column:{required:!1,tsType:{name:`ResponsiveValue`,elements:[{name:`boolean`}],raw:`ResponsiveValue<boolean>`},description:``},rowReverse:{required:!1,tsType:{name:`ResponsiveValue`,elements:[{name:`boolean`}],raw:`ResponsiveValue<boolean>`},description:``},columnReverse:{required:!1,tsType:{name:`ResponsiveValue`,elements:[{name:`boolean`}],raw:`ResponsiveValue<boolean>`},description:``},wrap:{required:!1,tsType:{name:`ResponsiveValue`,elements:[{name:`boolean`}],raw:`ResponsiveValue<boolean>`},description:`Перенос элементов`},nowrap:{required:!1,tsType:{name:`ResponsiveValue`,elements:[{name:`boolean`}],raw:`ResponsiveValue<boolean>`},description:``},wrapReverse:{required:!1,tsType:{name:`ResponsiveValue`,elements:[{name:`boolean`}],raw:`ResponsiveValue<boolean>`},description:``},align:{required:!1,tsType:{name:`ResponsiveValue`,elements:[{name:`union`,raw:`"start" | "center" | "end" | "stretch" | "baseline"`,elements:[{name:`literal`,value:`"start"`},{name:`literal`,value:`"center"`},{name:`literal`,value:`"end"`},{name:`literal`,value:`"stretch"`},{name:`literal`,value:`"baseline"`}]}],raw:`ResponsiveValue<FlexAlign>`},description:`Выравнивание по поперечной оси`},justify:{required:!1,tsType:{name:`ResponsiveValue`,elements:[{name:`union`,raw:`"start" | "center" | "end" | "stretch" | "between" | "around" | "evenly"`,elements:[{name:`literal`,value:`"start"`},{name:`literal`,value:`"center"`},{name:`literal`,value:`"end"`},{name:`literal`,value:`"stretch"`},{name:`literal`,value:`"between"`},{name:`literal`,value:`"around"`},{name:`literal`,value:`"evenly"`}]}],raw:`ResponsiveValue<FlexJustify>`},description:`Выравнивание по главной оси`},alignContent:{required:!1,tsType:{name:`ResponsiveValue`,elements:[{name:`union`,raw:`"start" | "center" | "end" | "stretch" | "between" | "around" | "evenly"`,elements:[{name:`literal`,value:`"start"`},{name:`literal`,value:`"center"`},{name:`literal`,value:`"end"`},{name:`literal`,value:`"stretch"`},{name:`literal`,value:`"between"`},{name:`literal`,value:`"around"`},{name:`literal`,value:`"evenly"`}]}],raw:`ResponsiveValue<FlexJustify>`},description:`Выравнивание контента`},gap:{required:!1,tsType:{name:`ResponsiveValue`,elements:[{name:`union`,raw:`"none" | "xs" | "sm" | "md" | "lg" | "xl"`,elements:[{name:`literal`,value:`"none"`},{name:`literal`,value:`"xs"`},{name:`literal`,value:`"sm"`},{name:`literal`,value:`"md"`},{name:`literal`,value:`"lg"`},{name:`literal`,value:`"xl"`}]}],raw:`ResponsiveValue<FlexGap>`},description:`Gap`},gapRow:{required:!1,tsType:{name:`ResponsiveValue`,elements:[{name:`Exclude`,elements:[{name:`union`,raw:`"none" | "xs" | "sm" | "md" | "lg" | "xl"`,elements:[{name:`literal`,value:`"none"`},{name:`literal`,value:`"xs"`},{name:`literal`,value:`"sm"`},{name:`literal`,value:`"md"`},{name:`literal`,value:`"lg"`},{name:`literal`,value:`"xl"`}]},{name:`literal`,value:`"none"`}],raw:`Exclude<FlexGap, "none">`}],raw:`ResponsiveValue<Exclude<FlexGap, "none">>`},description:`Row gap`},gapColumn:{required:!1,tsType:{name:`ResponsiveValue`,elements:[{name:`Exclude`,elements:[{name:`union`,raw:`"none" | "xs" | "sm" | "md" | "lg" | "xl"`,elements:[{name:`literal`,value:`"none"`},{name:`literal`,value:`"xs"`},{name:`literal`,value:`"sm"`},{name:`literal`,value:`"md"`},{name:`literal`,value:`"lg"`},{name:`literal`,value:`"xl"`}]},{name:`literal`,value:`"none"`}],raw:`Exclude<FlexGap, "none">`}],raw:`ResponsiveValue<Exclude<FlexGap, "none">>`},description:`Column gap`},children:{required:!0,tsType:{name:`ReactReactNode`,raw:`React.ReactNode`},description:`Дочерние элементы`},className:{required:!1,tsType:{name:`string`},description:`CSS класс`,defaultValue:{value:`""`,computed:!1}},as:{required:!1,tsType:{name:`JSX.IntrinsicElements`},description:`HTML тег`},style:{required:!1,tsType:{name:`CSSProperties`},description:`Inline styles`},ref:{required:!1,tsType:{name:`Ref`,elements:[{name:`HTMLElement`}],raw:`Ref<HTMLElement>`},description:``}},composes:[`HTMLAttributes`]}})))()}export{c as n,o as t};
|
|
@@ -1,3 +1,3 @@
|
|
|
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-BmGorvhi.js";import{n,t as r}from"./PolymorphicComponent-NBvIz9JD.js";import{i,n as a}from"./getFlexClasses-DOf6NlyJ.js";function o({ref:e,children:t,className:n=``,as:i,style:o,flex0:c,flex1:l,grow:u,shrink:d,basis:f,alignSelf:p,justifySelf:m,...h}){let g=[a({flex0:c,flex1:l,grow:u,shrink:d,basis:f,alignSelf:p,justifySelf:m}),n].filter(Boolean).join(` `);return(0,s.jsx)(r,{as:i,...h,ref:e,className:g,style:o,children:t})}var s;function c(){return(c=e((()=>{n(),i(),s=t(),o.displayName=`FlexItem`,o.__docgenInfo={description:``,methods:[],displayName:`FlexItem`,props:{grow:{required:!1,tsType:{name:`ResponsiveValue`,elements:[{name:`boolean`}],raw:`ResponsiveValue<boolean>`},description:`Способность расти
|
|
2
2
|
@default false = 0`},shrink:{required:!1,tsType:{name:`ResponsiveValue`,elements:[{name:`boolean`}],raw:`ResponsiveValue<boolean>`},description:`Способность сжиматься
|
|
3
3
|
@default true = 1`},flex0:{required:!1,tsType:{name:`ResponsiveValue`,elements:[{name:`boolean`}],raw:`ResponsiveValue<boolean>`},description:`Использовать составной класс flex0`},flex1:{required:!1,tsType:{name:`ResponsiveValue`,elements:[{name:`boolean`}],raw:`ResponsiveValue<boolean>`},description:`Использовать составной класс flex1`},basis:{required:!1,tsType:{name:`ResponsiveValue`,elements:[{name:`union`,raw:`"0" | "auto"`,elements:[{name:`literal`,value:`"0"`},{name:`literal`,value:`"auto"`}]}],raw:`ResponsiveValue<FlexBasis>`},description:`Базовый размер`},alignSelf:{required:!1,tsType:{name:`ResponsiveValue`,elements:[{name:`union`,raw:`"start" | "center" | "end" | "stretch" | "baseline"`,elements:[{name:`literal`,value:`"start"`},{name:`literal`,value:`"center"`},{name:`literal`,value:`"end"`},{name:`literal`,value:`"stretch"`},{name:`literal`,value:`"baseline"`}]}],raw:`ResponsiveValue<FlexAlign>`},description:`Выравнивание отдельного элемента`},justifySelf:{required:!1,tsType:{name:`ResponsiveValue`,elements:[{name:`Exclude`,elements:[{name:`union`,raw:`"start" | "center" | "end" | "stretch" | "between" | "around" | "evenly"`,elements:[{name:`literal`,value:`"start"`},{name:`literal`,value:`"center"`},{name:`literal`,value:`"end"`},{name:`literal`,value:`"stretch"`},{name:`literal`,value:`"between"`},{name:`literal`,value:`"around"`},{name:`literal`,value:`"evenly"`}]},{name:`union`,raw:`"between" | "around" | "evenly"`,elements:[{name:`literal`,value:`"between"`},{name:`literal`,value:`"around"`},{name:`literal`,value:`"evenly"`}]}],raw:`Exclude<FlexJustify, "between" | "around" | "evenly">`}],raw:`ResponsiveValue<Exclude<FlexJustify, "between" | "around" | "evenly">>`},description:`Justify-self для grid-like выравнивания`},children:{required:!1,tsType:{name:`ReactReactNode`,raw:`React.ReactNode`},description:`Дочерние элементы`},className:{required:!1,tsType:{name:`string`},description:`CSS класс`,defaultValue:{value:`""`,computed:!1}},as:{required:!1,tsType:{name:`JSX.IntrinsicElements`},description:`HTML тег`},style:{required:!1,tsType:{name:`CSSProperties`},description:`Inline styles`},ref:{required:!1,tsType:{name:`Ref`,elements:[{name:`HTMLElement`}],raw:`Ref<HTMLElement>`},description:``}},composes:[`HTMLAttributes`]}})))()}export{c as n,o as t};
|
|
@@ -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-BmGorvhi.js";import{t as i}from"./react-dom-BzEl8usk.js";import{a,i as o}from"./utils-tg3ibbzi.js";import{_ as s,a as c,c as l,f as u,h as d,i as f,l as p,m,o as h,r as g,s as _,u as v}from"./floating-ui.react-CypKyrM4.js";function y(e,t){if(!t?.arrow)return{};let{x:n,y:r}=t.arrow,i=e.split(`-`)[0],a={top:`bottom`,right:`left`,bottom:`top`,left:`right`}[i],o={top:`rotate(180deg)`,right:`rotate(-90deg)`,bottom:`rotate(0deg)`,left:`rotate(90deg)`}[i];return{pointerEvents:`none`,position:`absolute`,zIndex:-5,width:`16px`,height:`16px`,left:n==null?``:`${n}px`,top:r==null?``:`${r}px`,transform:o,[a]:`-16px`}}function b({ref:e,placement:t,middlewareData:n}){return(0,x.jsx)(`div`,{ref:e,style:y(t,n),children:(0,x.jsx)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 16 16`,fill:`var(--border-2)`,stroke:`var(--border-2)`,strokeWidth:`var(--border-width)`,style:{display:`block`},children:(0,x.jsx)(`polygon`,{points:`8,8 16,16 0,16`})})})}var x;function S(){return(S=t((()=>{x=r(),b.__docgenInfo={description:``,methods:[],displayName:`FloatingArrow`,props:{placement:{required:!0,tsType:{name:`Placement`},description:``},middlewareData:{required:!0,tsType:{name:`MiddlewareData`},description:``},ref:{required:!1,tsType:{name:`Ref`,elements:[{name:`HTMLDivElement`}],raw:`Ref<HTMLDivElement>`},description:``}}}})))()}var C,w,T,E,D,O,k,A;function j(){return(j=t((()=>{C=`sZ0x6w`,w=`_538Ejd`,T=`fqciCO`,E=`sHkUiQ`,D=`bpGNoX`,O=`tYnRg-`,k=`_8lflEh`,A={tooltipPanel:C,tooltip:w,negative:T,information:E,error:D,warning:O,success:k}})))()}function M({content:e,children:t,openOnHover:n=!0,placement:r=`bottom`,openDelay:i=200,closeDelay:o=100,maxWidth:g,state:y,tooltip:x,positionUpdateKey:S}){let[C,w]=(0,N.useState)(!1),T=(0,N.useRef)(null),{refs:E,floatingStyles:D,middlewareData:O,context:k,placement:j,update:M}=c({open:C,onOpenChange:w,placement:r,middleware:[m(8),u({fallbackAxisSideDirection:`end`,fallbackPlacements:[`top`,`right`,`bottom`]}),d({padding:8}),v({element:T,padding:8})],whileElementsMounted:s});(0,N.useLayoutEffect)(()=>{C&&M()},[C,S,M]);let I=_(k,{enabled:n,move:!1,delay:{open:i,close:o}}),L=h(k,{enabled:n}),R=f(k),z=p(k,{role:`tooltip`}),{getReferenceProps:B,getFloatingProps:V}=l([I,L,R,z]);return(0,F.jsxs)(F.Fragment,{children:[(0,F.jsx)(`span`,{ref:E.setReference,...B(),style:{lineHeight:1},children:t}),C&&(0,P.createPortal)((0,F.jsxs)(`div`,{ref:E.setFloating,style:{...D,zIndex:`var(--z-tooltip)`,maxWidth:g?`${g}em`:void 0},...V(),role:`tooltip`,className:a(A.tooltipPanel,x&&A.tooltip,y&&A[y]),children:[e,(0,F.jsx)(b,{ref:T,placement:j,middlewareData:O})]}),document.body)]})}var N,P,F;function I(){return(I=t((()=>{N=e(n(),1),g(),o(),P=i(),S(),j(),F=r(),M.__docgenInfo={description:``,methods:[],displayName:`FloatingPopover`,props:{content:{required:!0,tsType:{name:`ReactReactNode`,raw:`React.ReactNode`},description:``},children:{required:!0,tsType:{name:`ReactReactNode`,raw:`React.ReactNode`},description:``},openOnHover:{required:!1,tsType:{name:`boolean`},description:``,defaultValue:{value:`true`,computed:!1}},placement:{required:!1,tsType:{name:`Placement`},description:``,defaultValue:{value:`"bottom"`,computed:!1}},openDelay:{required:!1,tsType:{name:`number`},description:``,defaultValue:{value:`200`,computed:!1}},closeDelay:{required:!1,tsType:{name:`number`},description:``,defaultValue:{value:`100`,computed:!1}},maxWidth:{required:!1,tsType:{name:`number`},description:``},state:{required:!1,tsType:{name:`union`,raw:`"information" | "error" | "warning" | "success" | "negative"`,elements:[{name:`literal`,value:`"information"`},{name:`literal`,value:`"error"`},{name:`literal`,value:`"warning"`},{name:`literal`,value:`"success"`},{name:`literal`,value:`"negative"`}]},description:``},tooltip:{required:!1,tsType:{name:`literal`,value:`true`},description:``},positionUpdateKey:{required:!1,tsType:{name:`unknown`},description:"Изменяется вместе с CSS-координатой trigger, когда её изменение не отслеживается `autoUpdate`.\nПосле commit React выполняется повторный расчёт позиции открытой floating-панели."}}}})))()}export{S as i,I as n,b as r,M as t};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.k9WITw,.QIQYat,._7-j1qT,.r0aEv3,.PZ5cL0{min-width:0}.k9WITw,.QIQYat,.PZ5cL0{min-height:0}.k9WITw,.QIQYat{overflow:hidden}.k9WITw{isolation:isolate;pointer-events:none;width:100%;height:100%;position:relative}.QIQYat{box-sizing:border-box;border:var(--border);pointer-events:auto;max-width:100%;max-height:100%;position:absolute}._7-j1qT{padding:var(--space-xs);border-bottom:var(--border);flex:none}.r0aEv3{text-align:start;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;flex:auto}.r0aEv3[aria-pressed=true]{cursor:grabbing}.PZ5cL0{padding:var(--space-md);overscroll-behavior:contain;overflow-wrap:anywhere;flex:auto;overflow:auto}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import{n as e}from"./rolldown-runtime-DkW27tQK.js";import{t}from"./react-BZJXY1be.js";import{n,t as r}from"./x-BmlmEU-a.js";import{i,n as a,r as o}from"./iframe-BmGorvhi.js";import{r as s}from"./isRecord-DXDTW-jA-DtM9YD3V.js";import{a as c,i as l}from"./utils-tg3ibbzi.js";import{a as u,i as d,n as f,r as p}from"./react-GkniIHEK.js";import{t as m}from"./validators-D82aYLRK.js";import{a as h,r as ee}from"./dom-D9_dPJ4G.js";import{n as te}from"./error-De9R4E_F.js";import{n as g,t as _}from"./FlexContainer-DGc37vCr.js";import{n as v,t as y}from"./Button-C-uRygWz.js";import{n as ne,t as re}from"./GridContainer-C5r-VTTG.js";import{l as ie,o as ae}from"./Input-YuUUu0DD.js";import{u as oe}from"./number-scale-D2KTkjVQ.js";import{n as se,t as ce}from"./Textarea-Bz9O1y1I.js";var le,ue;function de(){return(de=e((()=>{i(),le=[[`path`,{d:`M12 2v20`,key:`t6zp3m`}],[`path`,{d:`m15 19-3 3-3-3`,key:`11eu04`}],[`path`,{d:`m19 9 3 3-3 3`,key:`1mg7y2`}],[`path`,{d:`M2 12h20`,key:`9i4pu4`}],[`path`,{d:`m5 9-3 3 3 3`,key:`j64kie`}],[`path`,{d:`m9 5 3-3 3 3`,key:`l8vdw6`}]],ue=o(`move`,le)})))()}var fe,pe,me,he,ge,b;function x(){return(x=e((()=>{fe=`k9WITw`,pe=`QIQYat`,me=`_7-j1qT`,he=`r0aEv3`,ge=`PZ5cL0`,b={boundary:fe,window:pe,header:me,handle:he,content:ge}})))()}function _e(e){let t=(0,S.useRef)(null);return(0,S.useEffect)(()=>{let n=t.current;if(!n)return;let r=()=>{e.getState().setBounds({width:n.clientWidth,height:n.clientHeight})};if(r(),typeof ResizeObserver>`u`)return;let i=new ResizeObserver(r);return i.observe(n),()=>i.disconnect()},[e]),t}var S;function ve(){return(ve=e((()=>{S=t()})))()}var ye,C;function w(){return(w=e((()=>{ye=t(),C=(0,ye.createContext)(null)})))()}function be(){let e=(0,xe.useContext)(C);if(!e)throw te({hookName:`useFloatingWindowsStore`,providerName:`FloatingWindows`});return e}var xe;function T(){return(T=e((()=>{xe=t(),w()})))()}function Se({children:e,className:t,style:n}){let r=_e(be());return(0,Ce.jsx)(`div`,{ref:r,className:c(b.boundary,t),style:n,"data-floating-windows":``,children:e})}var Ce;function we(){return(we=e((()=>{l(),x(),ve(),T(),Ce=a(),Se.__docgenInfo={description:`Измеряемый containing block не перехватывает события страницы за пределами самих окон.`,methods:[],displayName:`FloatingWindowsBoundary`}})))()}function E(e,t,n){if(!Number.isFinite(e.x)||!Number.isFinite(e.y))throw RangeError(`Координаты плавающего окна должны быть конечными числами.`);for(let e of[t,n])if(e!==null&&(!Number.isFinite(e.width)||!Number.isFinite(e.height)||e.width<0||e.height<0))throw RangeError(`Размер окна и рабочей области должен состоять из конечных неотрицательных чисел.`);if(t===null||n===null||n.width===0||n.height===0)return e;let r=oe(e.x,0,Math.max(0,n.width-t.width)),i=oe(e.y,0,Math.max(0,n.height-t.height));return r===e.x&&i===e.y?e:{x:r,y:i}}function D(){return(D=e((()=>{})))()}function O(e){return typeof e==`string`&&e.trim().length>0&&e.length<=256}function Te(e,t,n=24){if(!Number.isFinite(n)||n<0)throw RangeError(`Смещение каскада должно быть конечным неотрицательным числом.`);for(let n of[e,...t])if(!Number.isFinite(n.x)||!Number.isFinite(n.y))throw RangeError(`Координаты каскада плавающих окон должны быть конечными числами.`);if(n===0)return e;let r=e;for(let e=0;e<t.length;e+=1){if(!t.some(e=>e.x===r.x&&e.y===r.y))return r;let e=r.x+n,i=r.y+n;if(!Number.isFinite(e)||!Number.isFinite(i))throw RangeError(`Координаты каскада вышли за пределы конечных чисел.`);r={x:e,y:i}}return r}function Ee({cascadeOffset:e=24}={}){if(!Number.isFinite(e)||e<0)throw RangeError(`Смещение каскада должно быть конечным неотрицательным числом.`);return d()((t,n)=>({windows:new Map,positions:new Map,order:[],bounds:null,register:(r,i={x:24,y:24})=>{if(!O(r))throw Error(`Идентификатор плавающего окна должен содержать от 1 до 256 символов и не состоять из пробелов.`);let a=n();if(a.windows.has(r))throw Error(`Плавающее окно с идентификатором «${r}» уже открыто в этой рабочей области.`);E(i,null,null);let o=a.positions.get(r),s=o??Te(i,Array.from(a.windows.values(),e=>e.position),e),c=[...a.order,r],l=new Map(a.windows);l.set(r,{position:s,size:null,layer:c.length}),t({windows:l,positions:o?a.positions:new Map(a.positions).set(r,s),order:c});let u=!0;return()=>{u&&(u=!1,t(e=>{let t=e.order.filter(e=>e!==r),n=new Map(e.windows);return n.delete(r),t.forEach((e,t)=>{let r=n.get(e);r&&r.layer!==t+1&&n.set(e,{...r,layer:t+1})}),{windows:n,order:t}}))}},setPosition:(e,n)=>{t(t=>{let r=t.windows.get(e);if(!r)return t;let i=E(n,r.size,t.bounds);return r.position.x===i.x&&r.position.y===i.y?t:{windows:new Map(t.windows).set(e,{...r,position:i}),positions:new Map(t.positions).set(e,i)}})},setSize:(e,n)=>{t(t=>{let r=t.windows.get(e);if(!r)return t;let i=E(r.position,n,t.bounds);return r.size?.width===n.width&&r.size.height===n.height&&i===r.position?t:{windows:new Map(t.windows).set(e,{...r,position:i,size:n}),positions:i===r.position?t.positions:new Map(t.positions).set(e,i)}})},setBounds:e=>{E({x:0,y:0},null,e),t(t=>{if(t.bounds?.width===e?.width&&t.bounds?.height===e?.height)return t;let n=new Map(t.windows),r=new Map(t.positions),i=!1;for(let[a,o]of t.windows){let t=E(o.position,o.size,e);t!==o.position&&(i=!0,n.set(a,{...o,position:t}),r.set(a,t))}return{bounds:e,windows:i?n:t.windows,positions:i?r:t.positions}})},bringToFront:e=>{t(t=>{if(!t.windows.has(e)||t.order.at(-1)===e)return t;let n=[...t.order.filter(t=>t!==e),e],r=new Map(t.windows);return n.forEach((e,t)=>{let n=r.get(e);n&&n.layer!==t+1&&r.set(e,{...n,layer:t+1})}),{windows:r,order:n}})},restorePositions:e=>{for(let[t,n]of e){if(!O(t))throw Error(`Идентификатор плавающего окна должен содержать от 1 до 256 символов и не состоять из пробелов.`);E(n,null,null)}t(t=>{let n=new Map;for(let[r,i]of e){let e=t.positions.get(r);n.set(r,e&&e.x===i.x&&e.y===i.y?e:i)}let r=new Map(t.windows),i=!1;for(let[e,a]of t.windows){let o=E(n.get(e)??a.position,a.size,t.bounds),s=o.x===a.position.x&&o.y===a.position.y,c=s?a.position:o;n.set(e,c),!s&&(i=!0,r.set(e,{...a,position:c}))}let a=n.size===t.positions.size&&Array.from(n).every(([e,n])=>t.positions.get(e)===n);return!i&&a?t:{windows:i?r:t.windows,positions:a?t.positions:n}})}}))}function De(){return(De=e((()=>{u(),D()})))()}function Oe(e){if(e.length>k)throw Error(`Сохранённые позиции окон превышают допустимый размер.`);let t=JSON.parse(e);if(!s(t)||t.version!==1||!Array.isArray(t.positions)||t.positions.length>Ae)throw Error(`Неизвестный формат сохранённых позиций окон.`);let n=new Map;for(let e of t.positions){if(!s(e)||!O(e.id)||n.has(e.id)||typeof e.x!=`number`||!Number.isFinite(e.x)||typeof e.y!=`number`||!Number.isFinite(e.y))throw Error(`Сохранённая позиция окна не прошла проверку.`);n.set(e.id,{x:e.x,y:e.y})}return n}function ke(e){let t=[...e].slice(-200),n=[],r=28;for(let e=t.length-1;e>=0;--e){let[i,a]=t[e];if(!O(i)||!Number.isFinite(a.x)||!Number.isFinite(a.y))throw Error(`Сохранённая позиция окна не прошла проверку.`);let o=JSON.stringify({id:i,x:a.x,y:a.y}),s=r+o.length+(n.length===0?0:1);if(s>k)break;n.push(o),r=s}return`{"version":1,"positions":[${n.reverse().join(`,`)}]}`}var Ae,k;function je(){return(je=e((()=>{m(),Ae=200,k=65536})))()}function Me(e,t,n){let r=(0,A.useEffectEvent)(e=>n?.(e));(0,A.useEffect)(()=>{if(!t)return;let n;try{n=window.localStorage;let r=n.getItem(t);r!==null&&e.getState().restorePositions(Oe(r))}catch(e){r(e);return}let i=!0,a=()=>{if(i)try{n.setItem(t,ke(e.getState().positions))}catch(e){i=!1,r(e)}};return a(),e.subscribe((e,t)=>{e.positions!==t.positions&&a()})},[e,t])}var A;function Ne(){return(Ne=e((()=>{A=t(),je()})))()}function Pe({children:e,cascadeOffset:t,storageKey:n,onStorageError:r}){let[i]=(0,Fe.useState)(()=>Ee({cascadeOffset:t}));return Me(i,n,r),(0,Ie.jsx)(C,{value:i,children:e})}var Fe,Ie;function Le(){return(Le=e((()=>{Fe=t(),De(),w(),Ne(),Ie=a(),Pe.__docgenInfo={description:`Один экземпляр области — один store. Провайдер компонует владельцев state/persistence, не реализуя их алгоритмы.`,methods:[],displayName:`FloatingWindowsProvider`}})))()}function j({children:e,className:t,style:n,storageKey:r,cascadeOffset:i,onStorageError:a}){if(r!==void 0&&!r.trim())throw Error(`Ключ сохранения области окон не может быть пустым.`);return(0,M.jsx)(Pe,{storageKey:r,cascadeOffset:i,onStorageError:a,children:(0,M.jsx)(Se,{className:t,style:n,children:e})},r)}var M;function N(){return(N=e((()=>{we(),Le(),M=a(),j.__docgenInfo={description:`Независимая немодальная область для свободно размещаемых окон; контент не анализируется и не клонируется.`,methods:[],displayName:`FloatingWindows`}})))()}function Re({title:e,titleId:t,instructionId:n,actions:i,onClose:a,move:o}){return(0,P.jsxs)(_,{row:!0,align:`center`,gap:`xs`,className:b.header,children:[(0,P.jsx)(y,{appearance:`ghost`,icon:(0,P.jsx)(ue,{size:16}),className:b.handle,"aria-label":`Переместить окно «${e}»`,"aria-describedby":n,"aria-pressed":o.moving,"data-floating-window-action":`move`,...o.handleProps,children:(0,P.jsx)(`span`,{id:t,children:e})}),i,a&&(0,P.jsx)(y,{icon:(0,P.jsx)(r,{size:16}),appearance:`ghost`,"aria-label":`Закрыть окно «${e}»`,"data-floating-window-action":`close`,onClick:a})]})}var P;function ze(){return(ze=e((()=>{de(),n(),v(),g(),x(),P=a(),Re.__docgenInfo={description:`Handle — самостоятельная кнопка: действия и закрытие не становятся вложенными interactive controls.`,methods:[],displayName:`FloatingWindowHeader`}})))()}function Be(e,t,n){let r=e.size?.width??(typeof t==`number`?t:null),i=e.size?.height??(typeof n==`number`?n:null);return{width:t,height:n,zIndex:e.layer,left:r===null?0:`clamp(0px, ${e.position.x}px, max(0px, calc(100% - ${r}px)))`,top:i===null?0:`clamp(0px, ${e.position.y}px, max(0px, calc(100% - ${i}px)))`}}function Ve(e){let t=document.activeElement;return t instanceof HTMLElement&&t!==document.body&&!e?.contains(t)?t:void 0}function He(e){let t=(0,Ue.useRef)(null);h({active:!0,trapFocus:!1,containerRef:e,initialFocus:e=>(t.current=e,e),restoreFocusTarget:()=>Ve(t.current)})}var Ue;function We(){return(We=e((()=>{Ue=t(),ee()})))()}function Ge(e,t,n){(0,Ke.useEffect)(()=>{let r=n.current;if(!r)return;let i=()=>{let n=r.offsetWidth,i=r.offsetHeight;n>0&&i>0&&e.getState().setSize(t,{width:n,height:i})};if(i(),typeof ResizeObserver>`u`)return;let a=new ResizeObserver(i);return a.observe(r),()=>a.disconnect()},[e,t,n])}var Ke;function F(){return(F=e((()=>{Ke=t()})))()}function qe({id:e,store:t,panelRef:n,onPositionChange:r}){let i=(0,I.useRef)(null),a=(0,I.useRef)(null),[o,s]=(0,I.useState)(!1),c=()=>{a.current!==null&&cancelAnimationFrame(a.current),a.current=null,n.current?.style.removeProperty(`transform`)},l=e=>{e?.pointer?.target.hasPointerCapture(e.pointer.id)&&e.pointer.target.releasePointerCapture(e.pointer.id)},u=n=>{let a=i.current;if(!a||(i.current=null,c(),l(a),s(!1),!n))return;t.getState().setPosition(e,a.position);let o=t.getState().windows.get(e)?.position;o&&(o.x!==a.origin.x||o.y!==a.origin.y)&&r?.(o)},d=r=>{let o=i.current;if(!o)return;let s=t.getState();o.position=E(r,s.windows.get(e)?.size??null,s.bounds),a.current===null&&(a.current=requestAnimationFrame(()=>{a.current=null;let e=i.current;e&&n.current&&(n.current.style.transform=`translate(${e.position.x-e.origin.x}px, ${e.position.y-e.origin.y}px)`)}))},f=n=>{if(i.current)return;let r=t.getState().windows.get(e);r&&(t.getState().bringToFront(e),i.current={origin:r.position,position:r.position,pointer:n},s(!0))},p=(0,I.useEffectEvent)(()=>u(!1)),m=(0,I.useEffectEvent)(()=>{let e=i.current;i.current=null,c(),l(e)});return(0,I.useEffect)(()=>{let n=t.subscribe((t,n)=>{let r=n.windows.get(e),i=t.windows.get(e);(t.bounds!==n.bounds||r?.size!==i?.size||r?.position!==i?.position)&&p()});return()=>{n(),m()}},[t,e]),{moving:o,handleProps:{onClick:e=>{e.detail!==0||i.current?.pointer||(i.current?u(!0):f(null))},onPointerDown:e=>{if(e.button!==0||!e.isPrimary||i.current)return;e.preventDefault(),e.currentTarget.focus({preventScroll:!0});let t=n.current;if(!t)return;let r=t.getBoundingClientRect();f({id:e.pointerId,x:e.clientX,y:e.clientY,target:e.currentTarget,scaleX:t.offsetWidth>0&&r.width>0?r.width/t.offsetWidth:1,scaleY:t.offsetHeight>0&&r.height>0?r.height/t.offsetHeight:1}),e.currentTarget.setPointerCapture(e.pointerId)},onPointerMove:e=>{let t=i.current;!t?.pointer||t.pointer.id!==e.pointerId||d({x:t.origin.x+(e.clientX-t.pointer.x)/t.pointer.scaleX,y:t.origin.y+(e.clientY-t.pointer.y)/t.pointer.scaleY})},onPointerUp:e=>{let t=i.current;!t?.pointer||t.pointer.id!==e.pointerId||(d({x:t.origin.x+(e.clientX-t.pointer.x)/t.pointer.scaleX,y:t.origin.y+(e.clientY-t.pointer.y)/t.pointer.scaleY}),u(!0))},onPointerCancel:e=>{i.current?.pointer?.id===e.pointerId&&u(!1)},onLostPointerCapture:e=>{i.current?.pointer?.id===e.pointerId&&u(!1)},onBlur:()=>u(!1),onKeyDown:e=>{if(e.defaultPrevented)return;if(e.key===`Escape`&&i.current){e.preventDefault(),e.stopPropagation(),u(!1);return}if((e.key===` `||e.key===`Enter`)&&!i.current?.pointer){if(e.preventDefault(),e.repeat)return;i.current?u(!0):f(null);return}let t=i.current;if(!t||t.pointer)return;let n=e.shiftKey?1:10,r=e.key===`ArrowLeft`?-n:e.key===`ArrowRight`?n:0,a=e.key===`ArrowUp`?-n:e.key===`ArrowDown`?n:0;(r||a)&&(e.preventDefault(),d({x:t.position.x+r,y:t.position.y+a}))}}}}var I;function Je(){return(Je=e((()=>{I=t(),D()})))()}function Ye(e,t,n){let r=n?.x??24,i=n?.y??24,a=(0,L.useMemo)(()=>({position:{x:r,y:i},size:null,layer:0}),[r,i]),o=p(e,e=>e.windows.get(t)??a),s=(0,L.useEffectEvent)(()=>e.getState().register(t,{x:r,y:i}));return(0,L.useEffect)(()=>s(),[e,t]),o}var L;function Xe(){return(Xe=e((()=>{L=t(),f()})))()}function R({id:e,title:t,children:n,defaultPosition:r,width:i=360,height:a=300,actions:o,onClose:s,onPositionChange:l,className:u}){let d=be(),f=Ye(d,e,r),p=(0,z.useRef)(null),m=(0,z.useId)(),h=(0,z.useId)();Ge(d,e,p),He(p);let ee=qe({id:e,store:d,panelRef:p,onPositionChange:l});return(0,B.jsxs)(_,{column:!0,ref:p,role:`dialog`,"aria-labelledby":m,tabIndex:-1,"data-floating-window-id":e,className:c(`surface0 radiusMd shadowLg`,b.window,u),style:Be(f,i,a),onPointerDownCapture:()=>d.getState().bringToFront(e),onFocusCapture:()=>d.getState().bringToFront(e),onKeyDown:t=>{t.key!==`Escape`||t.defaultPrevented||d.getState().order.at(-1)!==e||!s||(t.preventDefault(),t.stopPropagation(),s())},children:[(0,B.jsx)(Re,{title:t,titleId:m,instructionId:h,actions:o,onClose:s,move:ee}),(0,B.jsx)(`span`,{id:h,className:`visuallyHidden`,children:`Для перемещения нажмите Enter или пробел, затем используйте стрелки. Shift — шаг 1 пиксель. Enter или пробел — сохранить, Escape — отменить.`}),(0,B.jsx)(`div`,{className:b.content,children:n})]})}var z,B;function V(){return(V=e((()=>{z=t(),l(),g(),ze(),x(),We(),F(),Je(),Xe(),T(),B=a(),R.__docgenInfo={description:`Немодальное окно: host управляет его существованием, primitive — геометрией, движением и локальным порядком.`,methods:[],displayName:`FloatingWindow`,props:{width:{defaultValue:{value:`360`,computed:!1},required:!1},height:{defaultValue:{value:`300`,computed:!1},required:!1}}}})))()}function Ze(){return(0,H.jsxs)(_,{column:!0,gap:`md`,children:[(0,H.jsx)(`p`,{children:`Обе области содержат окно с ID shared-window. Перемещение в одной области не меняет другую.`}),(0,H.jsxs)(re,{gap:`md`,templateColumns:`repeat(auto-fit, minmax(min(100%, 22rem), 1fr))`,children:[(0,H.jsxs)(_,{as:`section`,column:!0,gap:`sm`,"aria-label":`Первая область`,"data-floating-windows-example-host":`first`,children:[(0,H.jsx)(`h3`,{children:`Первая область`}),(0,H.jsx)(j,{style:{height:`22rem`,background:`var(--surface-2)`},children:(0,H.jsx)(R,{id:`shared-window`,title:`Окно первой области`,width:`17rem`,height:`12rem`,defaultPosition:{x:16,y:16},children:(0,H.jsx)(`p`,{children:`Фокус и порядок наложения ограничены этим контейнером.`})})})]}),(0,H.jsxs)(_,{as:`section`,column:!0,gap:`sm`,"aria-label":`Вторая область`,"data-floating-windows-example-host":`second`,children:[(0,H.jsx)(`h3`,{children:`Вторая область`}),(0,H.jsx)(j,{style:{height:`22rem`,background:`var(--surface-2)`},children:(0,H.jsx)(R,{id:`shared-window`,title:`Окно второй области`,width:`17rem`,height:`12rem`,defaultPosition:{x:40,y:64},children:(0,H.jsx)(`p`,{children:`Общий module-level реестр для этих окон не нужен.`})})})]})]})]})}var H;function Qe(){return(Qe=e((()=>{g(),ne(),V(),N(),H=a(),Ze.__docgenInfo={description:`Одинаковый ID допустим в разных host: координаты и порядок принадлежат каждому контейнеру.`,methods:[],displayName:`IndependentFloatingWindowsExample`}})))()}function $e(){let[e,t]=(0,U.useState)(!0),[n,r]=(0,U.useState)(!0),[i,a]=(0,U.useState)(`Проверьте ввод текста, выделение и прокрутку независимо от перемещения окна.`),[o,s]=(0,U.useState)(`Рабочий набросок`),[c,l]=(0,U.useState)(!1);return(0,W.jsxs)(_,{column:!0,gap:`md`,children:[(0,W.jsx)(`p`,{children:`Перемещайте окна за кнопку в заголовке. С клавиатуры: Space или Enter включает перемещение, стрелки меняют положение, Shift уменьшает шаг, Escape отменяет перемещение.`}),(0,W.jsxs)(_,{wrap:!0,gap:`sm`,children:[(0,W.jsx)(y,{type:`button`,"data-floating-windows-example-action":`open-notes`,disabled:e,onClick:()=>t(!0),children:`Открыть заметки`}),(0,W.jsx)(y,{type:`button`,"data-floating-windows-example-action":`open-details`,disabled:n,onClick:()=>r(!0),children:`Открыть сведения`})]}),(0,W.jsxs)(j,{style:{height:`min(70dvh, 36rem)`,background:`var(--surface-2)`},children:[e&&(0,W.jsx)(R,{id:`notes`,title:`Заметки`,width:`24rem`,height:`21rem`,defaultPosition:{x:20,y:24},onClose:()=>t(!1),actions:(0,W.jsx)(y,{type:`button`,appearance:`ghost`,"data-floating-windows-example-action":`clear-notes`,onClick:()=>a(``),children:`Очистить`}),children:(0,W.jsxs)(_,{column:!0,gap:`md`,children:[(0,W.jsx)(ce,{label:`Текст заметки`,value:i,onChange:a,rows:5,"data-floating-windows-example-field":`notes`}),(0,W.jsx)(`p`,{children:`Закройте окно и откройте снова: черновик остаётся у владельца этого примера.`})]})}),n&&(0,W.jsx)(R,{id:`details`,title:`Сведения`,width:`22rem`,height:`19rem`,defaultPosition:{x:320,y:120},onClose:()=>r(!1),children:(0,W.jsxs)(_,{column:!0,gap:`md`,children:[(0,W.jsx)(ae,{label:`Название`,value:o,onChange:s,"data-floating-windows-example-field":`name`}),(0,W.jsx)(y,{type:`button`,"data-floating-windows-example-action":`save-details`,onClick:()=>l(!0),children:`Сохранить в примере`}),(0,W.jsx)(`p`,{role:`status`,children:c?`Изменения отмечены как сохранённые.`:`Поля и кнопки остаются интерактивными.`})]})})]})]})}var U,W;function et(){return(et=e((()=>{U=t(),v(),g(),ie(),se(),V(),N(),W=a(),$e.__docgenInfo={description:`Сценарий хранит черновики снаружи окон, чтобы закрытие панели не удаляло введённый текст.`,methods:[],displayName:`InteractiveFloatingWindowsExample`}})))()}function tt(){let[e,t]=(0,G.useState)(!1),[n,r]=(0,G.useState)(``);return(0,K.jsxs)(_,{column:!0,gap:`md`,children:[(0,K.jsx)(`p`,{children:`Окно запрашивает 42 × 36 rem. Контейнер сужает его, а длинное содержимое прокручивается внутри.`}),(0,K.jsx)(y,{type:`button`,"data-floating-windows-example-action":`resize-host`,onClick:()=>t(e=>!e),children:e?`Увеличить область`:`Уменьшить область`}),(0,K.jsx)(j,{style:{width:`100%`,maxWidth:e?`17rem`:`24rem`,height:e?`18rem`:`27rem`,background:`var(--surface-2)`},children:(0,K.jsx)(R,{id:`narrow-content`,title:`Длинное содержимое в узкой области`,width:`42rem`,height:`36rem`,defaultPosition:{x:200,y:160},children:(0,K.jsxs)(_,{column:!0,gap:`md`,children:[(0,K.jsx)(ae,{label:`Поле в начале`,value:n,onChange:r,"data-floating-windows-example-field":`narrow`}),Array.from({length:12},(e,t)=>(0,K.jsxs)(`p`,{children:[`Раздел `,t+1,`. Содержимое панели остаётся доступным при уменьшении области. Прокрутка текста не запускает перемещение окна.`]},t)),(0,K.jsx)(y,{type:`button`,"data-floating-windows-example-action":`clear-narrow`,onClick:()=>r(``),children:`Очистить поле в начале`})]})})})]})}var G,K;function nt(){return(nt=e((()=>{G=t(),v(),g(),ie(),V(),N(),K=a(),tt.__docgenInfo={description:`Большие запрошенные размеры проверяют ограничение реальным размером контейнера.`,methods:[],displayName:`NarrowFloatingWindowsExample`}})))()}function rt(){let[e,t]=(0,q.useState)(0),[n,r]=(0,q.useState)(``),i=`foundation-ui-storybook:floating-windows:positions`;return(0,J.jsxs)(_,{column:!0,gap:`md`,children:[(0,J.jsx)(`p`,{children:`Переместите окно и пересоздайте область: координаты восстановятся из localStorage.`}),(0,J.jsxs)(_,{wrap:!0,gap:`sm`,children:[(0,J.jsx)(y,{type:`button`,"data-floating-windows-example-action":`remount-persisted-host`,onClick:()=>t(e=>e+1),children:`Пересоздать область`}),(0,J.jsx)(y,{type:`button`,"data-floating-windows-example-action":`reset-persisted-positions`,onClick:()=>{try{window.localStorage.removeItem(i),r(`Сохранённые координаты этого примера удалены.`),t(e=>e+1)}catch{r(`Браузер не разрешил очистить сохранённые координаты.`)}},children:`Сбросить координаты примера`})]}),(0,J.jsx)(`p`,{role:`status`,children:n||`Сохраняются только координаты; состав окон задаёт приложение.`}),(0,J.jsx)(j,{storageKey:i,onStorageError:()=>r(`Сохранение недоступно; окна продолжают работать в текущей области.`),style:{height:`min(70dvh, 30rem)`,background:`var(--surface-2)`},children:(0,J.jsx)(R,{id:`persisted-notes`,title:`Сохранённое положение`,width:`23rem`,height:`14rem`,defaultPosition:{x:24,y:24},children:(0,J.jsx)(`p`,{children:`После восстановления положение ограничивается текущими размерами контейнера.`})})},e)]})}var q,J;function it(){return(it=e((()=>{q=t(),v(),g(),V(),N(),J=a(),rt.__docgenInfo={description:`Явный сброс затрагивает только ключ этого примера и пересоздаёт его локальную область.`,methods:[],displayName:`PersistentFloatingWindowsExample`}})))()}var at,Y,X,Z,Q,ot;function $(){return($=e((()=>{N(),Qe(),et(),nt(),it(),at={title:`Layout/FloatingWindows`,component:j,args:{children:null},parameters:{atomicCanvas:!0,layout:`padded`,controls:{disable:!0},docs:{description:{component:`Немодальные перемещаемые окна внутри явно заданной области. Состав окон и их содержимое принадлежат приложению; контейнер управляет координатами и порядком наложения. Полный контракт находится в src/floating-windows/README.md.`}}}},Y={name:`Два интерактивных окна`,render:$e},X={name:`Узкая область и длинное содержимое`,render:tt},Z={name:`Независимые области`,render:Ze},Q={name:`Сохранение координат`,render:rt},Y.parameters={...Y.parameters,docs:{...Y.parameters?.docs,source:{originalSource:`{
|
|
2
|
+
name: "Два интерактивных окна",
|
|
3
|
+
render: InteractiveFloatingWindowsExample
|
|
4
|
+
}`,...Y.parameters?.docs?.source}}},X.parameters={...X.parameters,docs:{...X.parameters?.docs,source:{originalSource:`{
|
|
5
|
+
name: "Узкая область и длинное содержимое",
|
|
6
|
+
render: NarrowFloatingWindowsExample
|
|
7
|
+
}`,...X.parameters?.docs?.source}}},Z.parameters={...Z.parameters,docs:{...Z.parameters?.docs,source:{originalSource:`{
|
|
8
|
+
name: "Независимые области",
|
|
9
|
+
render: IndependentFloatingWindowsExample
|
|
10
|
+
}`,...Z.parameters?.docs?.source}}},Q.parameters={...Q.parameters,docs:{...Q.parameters?.docs,source:{originalSource:`{
|
|
11
|
+
name: "Сохранение координат",
|
|
12
|
+
render: PersistentFloatingWindowsExample
|
|
13
|
+
}`,...Q.parameters?.docs?.source}}},ot=[`InteractiveWindows`,`NarrowHost`,`IndependentHosts`,`PersistedPositions`]})))()}$();export{Z as IndependentHosts,Y as InteractiveWindows,X as NarrowHost,Q as PersistedPositions,ot as __namedExportsOrder,at as default};
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import{n as e}from"./rolldown-runtime-DkW27tQK.js";import{t}from"./react-BZJXY1be.js";import{n,t as r}from"./circle-alert-DXUFM6uc.js";import{n as i,t as a}from"./circle-check-0x9vHUU_.js";import{i as o,n as s,r as c,t as l}from"./info-HMSnCOw2.js";import{n as u,r as d,t as f}from"./sortable-BrLDYUp8.js";import{n as p}from"./iframe-BmGorvhi.js";import{a as m,i as h,n as g}from"./utils-tg3ibbzi.js";import{a as _,n as v,o as y}from"./array-D-_yMMUK-BBmW5vUr.js";import{h as ee,l as te,y as ne}from"./formatters-DVE1YVNQ-CJCkXjuI.js";import{i as b,n as x,r as re,t as ie}from"./NoData-CRi9NzcI.js";import{n as S,t as ae}from"./GridContainer-C5r-VTTG.js";import{c as C,m as w,n as oe,o as T,p as se,r as E}from"./hooks-DM8_3IU2.js";import{i as D,r as ce}from"./useTable-CK68Q4S4.js";import{n as le,t as ue}from"./Scrollable-Cc641kuG.js";import{n as O,t as de}from"./ContextMenu-BC5OXqVj.js";import{C as k,S as A,b as j,c as M,f as fe,l as pe,m as N,p as me,u as he,v as P,w as ge,x as _e,y as ve}from"./odata-DLogt0PY.js";import{At as F,Mt as I}from"./tableFeatures-Dx3U-F9E.js";var L,R,ye,z,be,xe,B,V;function Se(){return(Se=e((()=>{L=`UMTbLD`,R=`cz57Fx`,ye=`oPzAxu`,z=`MBu26r`,be=`_03z-1l`,xe=`_0RqsqJ`,B=`mXkUoM`,V={stateWrapper:L,status:R,information:ye,success:z,warning:be,error:xe,state:B}})))()}function Ce({state:e}){switch(e){case`error`:return(0,H.jsx)(we,{});case`warning`:return(0,H.jsx)(Te,{});case`success`:return(0,H.jsx)(Ee,{});case`information`:return(0,H.jsx)(De,{});default:return null}}function we(){return(0,H.jsx)(c,{className:m(V.state,V.error)})}function Te(){return(0,H.jsx)(r,{className:m(V.state,V.warning)})}function Ee(){return(0,H.jsx)(a,{className:m(V.state,V.success)})}function De(){return(0,H.jsx)(l,{className:m(V.state,V.information)})}var H;function Oe(){return(Oe=e((()=>{h(),n(),i(),o(),s(),Se(),H=p(),Ce.__docgenInfo={description:``,methods:[],displayName:`RenderStateIcon`,props:{state:{required:!1,tsType:{name:`State`},description:``}}},we.__docgenInfo={description:``,methods:[],displayName:`ErrorIcon`},Te.__docgenInfo={description:``,methods:[],displayName:`WarningIcon`},Ee.__docgenInfo={description:``,methods:[],displayName:`SuccessIcon`},De.__docgenInfo={description:``,methods:[],displayName:`InformationIcon`}})))()}var ke,Ae;function je(){return(je=e((()=>{ke=`YJUVjb`,Ae={resizeHandle:ke}})))()}function Me(e,t){let n=e.closest(`th`)?.getBoundingClientRect().width;return k(typeof n==`number`&&Number.isFinite(n)?n:t,t)}function Ne({columnId:e,className:t,minWidth:n,keyboardStep:r=Fe,ariaLabel:i=`Изменить ширину колонки`,getStartWidth:a,onResize:o,onResizeEnd:s,onReset:c}){let l=n??60,u=(0,U.useRef)(0),d=(0,U.useRef)(0),f=(0,U.useRef)(0),p=(0,U.useRef)(!1),h=(0,U.useRef)(!1),g=t=>{let n=a?.(e,t)??Me(t,l);return k(n,l)},_=e=>{(e.button===0||e.pointerType!==`mouse`)&&(p.current=!0,h.current=!1,u.current=e.clientX,d.current=g(e.currentTarget),f.current=d.current,e.currentTarget.setPointerCapture(e.pointerId),e.preventDefault(),e.stopPropagation())},v=t=>{if(!p.current)return;let n=k(d.current+t.clientX-u.current,l);f.current=n,h.current=!0,o(e,n),t.preventDefault(),t.stopPropagation()},y=t=>{if(p.current){p.current=!1,h.current&&s?.(e,f.current);try{t.currentTarget.releasePointerCapture(t.pointerId)}catch{}t.preventDefault(),t.stopPropagation()}};return(0,Pe.jsx)(`div`,{role:`separator`,"aria-label":i,"aria-orientation":`vertical`,tabIndex:0,onPointerDown:_,onPointerMove:v,onPointerUp:y,onPointerCancel:y,onKeyDown:t=>{if(t.key!==`ArrowLeft`&&t.key!==`ArrowRight`&&t.key!==`Home`)return;if(t.preventDefault(),t.stopPropagation(),t.key===`Home`){c?.(e);return}let n=t.key===`ArrowRight`?1:-1,i=g(t.currentTarget),a=k(i+n*r,l);o(e,a),s?.(e,a)},onDoubleClick:t=>{t.preventDefault(),t.stopPropagation(),c?.(e)},className:m(Ae.resizeHandle,t)})}var U,Pe,Fe;function Ie(){return(Ie=e((()=>{U=t(),j(),h(),je(),Pe=p(),Fe=8,Ne.__docgenInfo={description:``,methods:[],displayName:`TableColumnResizeHandle`,props:{columnId:{required:!0,tsType:{name:`string`},description:``},className:{required:!1,tsType:{name:`string`},description:``},minWidth:{required:!1,tsType:{name:`number`},description:``},keyboardStep:{required:!1,tsType:{name:`number`},description:``,defaultValue:{value:`8`,computed:!1}},ariaLabel:{required:!1,tsType:{name:`string`},description:``,defaultValue:{value:`"Изменить ширину колонки"`,computed:!1}},getStartWidth:{required:!1,tsType:{name:`signature`,type:`function`,raw:`(columnId: string, element: HTMLElement) => number`,signature:{arguments:[{type:{name:`string`},name:`columnId`},{type:{name:`HTMLElement`},name:`element`}],return:{name:`number`}}},description:``},onResize:{required:!0,tsType:{name:`signature`,type:`function`,raw:`(columnId: string, width: number) => void`,signature:{arguments:[{type:{name:`string`},name:`columnId`},{type:{name:`number`},name:`width`}],return:{name:`void`}}},description:``},onResizeEnd:{required:!1,tsType:{name:`signature`,type:`function`,raw:`(columnId: string, width: number) => void`,signature:{arguments:[{type:{name:`string`},name:`columnId`},{type:{name:`number`},name:`width`}],return:{name:`void`}}},description:``},onReset:{required:!1,tsType:{name:`signature`,type:`function`,raw:`(columnId: string) => void`,signature:{arguments:[{type:{name:`string`},name:`columnId`}],return:{name:`void`}}},description:``}}}})))()}function Le(e,t){return typeof e==`function`?e(t):e}function Re({columnId:e,children:t,dragDisabled:n=!1,draggingClassName:r,resizeHandle:i,className:a,style:o,...s}){let{attributes:c,listeners:l,setActivatorNodeRef:u,setNodeRef:d,transform:f,isDragging:p,rect:h}=C({id:e,disabled:n}),g=p?h.current?.width:void 0,_={transform:se.Translate.toString(f),zIndex:p?`calc(var(--z-header) + 1)`:void 0,...g?{width:g,minWidth:g}:{},...o},v={attributes:c,listeners:l,setActivatorElement:u,disabled:n,isDragging:p};return(0,ze.jsxs)(`th`,{...s,ref:d,className:m(a,p&&r),style:_,children:[Le(t,v),i?(0,ze.jsx)(Ne,{...i}):null]})}var ze;function Be(){return(Be=e((()=>{T(),w(),h(),Ie(),ze=p(),Re.__docgenInfo={description:``,methods:[],displayName:`TableHeaderInteractionCell`,props:{columnId:{required:!0,tsType:{name:`UniqueIdentifier`},description:``},children:{required:!0,tsType:{name:`union`,raw:`ReactNode | ((dragState: TableHeaderCellDragState) => ReactNode)`,elements:[{name:`ReactNode`},{name:`unknown`}]},description:``},dragDisabled:{required:!1,tsType:{name:`boolean`},description:``,defaultValue:{value:`false`,computed:!1}},draggingClassName:{required:!1,tsType:{name:`string`},description:``},resizeHandle:{required:!1,tsType:{name:`signature`,type:`object`,raw:`{
|
|
2
|
+
columnId: string;
|
|
3
|
+
className?: string;
|
|
4
|
+
minWidth?: number;
|
|
5
|
+
keyboardStep?: number;
|
|
6
|
+
ariaLabel?: string;
|
|
7
|
+
getStartWidth?: (columnId: string, element: HTMLElement) => number;
|
|
8
|
+
onResize: (columnId: string, width: number) => void;
|
|
9
|
+
onResizeEnd?: (columnId: string, width: number) => void;
|
|
10
|
+
onReset?: (columnId: string) => void;
|
|
11
|
+
}`,signature:{properties:[{key:`columnId`,value:{name:`string`,required:!0}},{key:`className`,value:{name:`string`,required:!1}},{key:`minWidth`,value:{name:`number`,required:!1}},{key:`keyboardStep`,value:{name:`number`,required:!1}},{key:`ariaLabel`,value:{name:`string`,required:!1}},{key:`getStartWidth`,value:{name:`signature`,type:`function`,raw:`(columnId: string, element: HTMLElement) => number`,signature:{arguments:[{type:{name:`string`},name:`columnId`},{type:{name:`HTMLElement`},name:`element`}],return:{name:`number`}},required:!1}},{key:`onResize`,value:{name:`signature`,type:`function`,raw:`(columnId: string, width: number) => void`,signature:{arguments:[{type:{name:`string`},name:`columnId`},{type:{name:`number`},name:`width`}],return:{name:`void`}},required:!0}},{key:`onResizeEnd`,value:{name:`signature`,type:`function`,raw:`(columnId: string, width: number) => void`,signature:{arguments:[{type:{name:`string`},name:`columnId`},{type:{name:`number`},name:`width`}],return:{name:`void`}},required:!1}},{key:`onReset`,value:{name:`signature`,type:`function`,raw:`(columnId: string) => void`,signature:{arguments:[{type:{name:`string`},name:`columnId`}],return:{name:`void`}},required:!1}}]}},description:``}}}})))()}function Ve(e){return{start:Array.from(new Set((e?.start??[]).filter(e=>typeof e==`string`&&e.trim().length>0))),end:[]}}function He(e,t){let n=t?.[e.id];if(typeof n==`number`&&Number.isFinite(n)&&n>0)return`${Math.floor(n)}px`;let r=fe(e.columnDef)?.width??4;return typeof r==`number`&&(r=Math.max(r,4)),ve(r)}function Ue(e,t){let n=e.getAllLeafColumns().filter(e=>e.getIsVisible()),r=new Map(n.map(e=>[e.id,e])),i=n.map(e=>e.id),a=v(t.columnPinning.start,i),o=v(t.columnPinning.end,i),s=new Set([...a,...o]),c=[];for(let e of n)s.has(e.id)||c.push(e.id);let l=P({ids:c,order:t.columnOrder});return y([...a,...l,...o],r)}function We(e,t){let n=Ue(e,t),r=new Map(n.map(e=>[e.id,e]));return A({ids:n.map(e=>e.id),getWidth:e=>{let n=r.get(e);return n?He(n,t.columnSizing):`0px`}}).flatMap(e=>{let t=r.get(e.id);return t?[{...e,column:t}]:[]})}function Ge(e,t){let n={},r=[];for(let i of Ue(e,t))i.getIsPinned()===`start`&&(n[i.id]=Ke(r),r.push(He(i,t.columnSizing)));return n}function Ke(e){return e.length===0?`0px`:e.length===1?e[0]:`calc(${e.join(` + `)})`}function W(){return(W=e((()=>{_(),j()})))()}function qe(e){if(typeof e.id==`string`&&e.id.trim())return e.id;if(`accessorKey`in e&&typeof e.accessorKey==`string`&&e.accessorKey.trim())return e.accessorKey}function Je(e){return`cell`in e&&e.cell!=null}function Ye(e,t){for(let n of e){if(`columns`in n&&Array.isArray(n.columns)&&n.columns.length>0){Ye(n.columns,t);continue}t(n)}}function Xe(e){let t={},n=new Set;return Ye(e,e=>{let r=qe(e);if(!r)return;Je(e)&&n.add(r);let i=M(e);i&&(t[r]={...i,id:i.id??r,role:i.role??`dimension`,type:i.type??`string`})}),{runtimeByColumnId:te(t),customCellColumnIds:n}}function Ze(e){return!e.customCellColumnIds.has(e.columnId)&&!!e.runtimeByColumnId[e.columnId]}function Qe(){return(Qe=e((()=>{ee(),j()})))()}function $e(e){return e!=null&&e!==``}function et(e,t){return e.map(e=>({row:e,boundaryKey:t(e),cellByColumnId:new Map(e.getVisibleCells().map(e=>[e.column.id,e]))}))}function tt({rows:e,columns:t,resolveRowBoundaryKey:n=()=>`__all_rows__`,excludeColumnIds:r}){let i=t.filter(e=>!r?.has(e.id)&&fe(e.columnDef)?.mergeDuplicates===!0);if(e.length===0||i.length===0)return new Map;let a=et(e,n),o=new Map;for(let e of i){let t=-1,n,r,i=i=>{if(t!==-1){if(i-t<=1){t=-1,n=void 0,r=void 0;return}for(let n=t;n<i;n+=1){let r=a[n]?.cellByColumnId.get(e.id)?.id;r&&o.set(r,{hideContent:n>t,mergeWithNext:n<i-1})}t=-1,n=void 0,r=void 0}};for(let o=0;o<a.length;o+=1){let s=a[o],c=s?.cellByColumnId.get(e.id),l=c?.getValue();if(!c||!$e(l)){i(o);continue}if(t===-1){t=o,n=l,r=s?.boundaryKey;continue}(!Object.is(r,s?.boundaryKey)||!Object.is(n,l))&&(i(o),t=o,n=l,r=s?.boundaryKey)}i(a.length)}return o}function nt(){return(nt=e((()=>{j()})))()}function rt({columnOrder:e,defaultColumnOrder:t,onColumnOrderChange:n}){let[r,i]=(0,G.useState)(void 0),a=(0,G.useMemo)(()=>ge(e??r??t),[e,t,r]);return{columnOrder:a,onColumnOrderChange:(0,G.useCallback)(t=>{let r=ge(F(t,a));e===void 0&&i(r),n?.(r)},[e,n,a])}}var G;function it(){return(it=e((()=>{G=t(),j(),I()})))()}function at({columnPinning:e,defaultColumnPinning:t,onColumnPinningChange:n}){let[r,i]=(0,K.useState)(void 0),a=(0,K.useMemo)(()=>Ve(e??r??t),[e,t,r]);return{columnPinning:a,onColumnPinningChange:(0,K.useCallback)(t=>{let r={start:Ve(F(t,a)).start};e===void 0&&i(r),n?.(r)},[e,n,a])}}var K;function ot(){return(ot=e((()=>{K=t(),I(),W()})))()}function st({columnSizing:e,defaultColumnSizing:t,columnResizeMinWidth:n,onColumnSizingChange:r}){let[i,a]=(0,q.useState)(void 0),o=(0,q.useMemo)(()=>N(e??i??t,n),[n,e,t,i]);return{columnSizing:o,onColumnSizingChange:(0,q.useCallback)(t=>{let i=N(F(t,o),n);e===void 0&&a(i),r?.(i)},[n,e,r,o])}}var q;function ct(){return(ct=e((()=>{q=t(),j(),I()})))()}function lt({columnVisibility:e,defaultColumnVisibility:t,onColumnVisibilityChange:n}){let[r,i]=(0,J.useState)(void 0),a=(0,J.useMemo)(()=>e??r??t??{},[e,t,r]);return{columnVisibility:a,onColumnVisibilityChange:(0,J.useCallback)(t=>{let r=F(t,a);e===void 0&&i(r),n?.(r)},[e,n,a])}}var J;function ut(){return(ut=e((()=>{J=t(),I()})))()}var dt,ft;function pt(){return(pt=e((()=>{w(),dt=e=>{let{transform:t}=e;return{...t,y:0}},ft=e=>{let{transform:t}=e;return{...t,x:0}}})))()}var mt,ht,gt,_t,vt,yt,bt,xt,St,Ct,wt,Tt,Et,Dt,Ot,kt,At,jt,Mt,Nt,Y;function Pt(){return(Pt=e((()=>{mt=`_0rNBMr`,ht=`gp-7Db`,gt=`Ck-sXP`,_t=`-F3gli`,vt=`V5tPM-`,yt=`_2VJbvj`,bt=`AD8NkG`,xt=`qqixKn`,St=`dVDRNv`,Ct=`klOoMz`,wt=`fJvFJA`,Tt=`_7D8xa9`,Et=`_3j87pS`,Dt=`uwojkJ`,Ot=`lLsmW6`,kt=`uYvZ5P`,At=`QIS3xA`,jt=`a580w0`,Mt=`UOhaMF`,Nt=`DtKAgs`,Y={root:mt,headerContextMenuTrigger:ht,table:gt,head:_t,pinnedStartBoundary:vt,headerRow:yt,headerCell:bt,headerCellContent:xt,headerCellDraggable:St,headerCellDragging:Ct,headerCellPinnedStart:wt,bodyRow:Tt,bodyRowInteractive:Et,bodyCell:Dt,bodyRowSelected:Ot,bodyCellPinnedStart:kt,bodyCellMergedWithNext:At,feedbackCell:jt,fetchingRow:Mt,noData:Nt}})))()}function Ft({header:e,isPinnedStart:t,insetInlineStart:n,isPinnedBoundary:r,isDragDisabled:i,enableColumnResizing:a,enableColumnReordering:o,columnResizeMinWidth:s,renderHeaderContent:c,onResizeColumn:l,onResetColumnWidth:u}){return(0,It.jsx)(Re,{columnId:e.column.id,colSpan:e.colSpan,dragDisabled:!o||i,draggingClassName:Y.headerCellDragging,className:m(Y.headerCell,t&&Y.headerCellPinnedStart,r&&Y.pinnedStartBoundary),style:{...t?{insetInlineStart:n}:{}},resizeHandle:a&&!e.isPlaceholder?{columnId:e.column.id,minWidth:s,onResize:l,onReset:u}:void 0,children:({listeners:t,setActivatorElement:n})=>(0,It.jsx)(`div`,{ref:o&&!i?n:void 0,className:m(Y.headerCellContent,o&&!i&&Y.headerCellDraggable),...o&&!i?t??{}:{},children:c(e)})})}var It;function Lt(){return(Lt=e((()=>{h(),Be(),Pt(),It=p(),Ft.__docgenInfo={description:``,methods:[],displayName:`BaseTableHeaderCell`,props:{header:{required:!0,tsType:{name:`FoundationTableHeader`,elements:[{name:`TData`}],raw:`FoundationTableHeader<TData>`},description:``},isPinnedStart:{required:!0,tsType:{name:`boolean`},description:``},insetInlineStart:{required:!1,tsType:{name:`string`},description:``},isPinnedBoundary:{required:!0,tsType:{name:`boolean`},description:``},isDragDisabled:{required:!0,tsType:{name:`boolean`},description:``},enableColumnResizing:{required:!0,tsType:{name:`boolean`},description:``},enableColumnReordering:{required:!0,tsType:{name:`boolean`},description:``},columnResizeMinWidth:{required:!0,tsType:{name:`union`,raw:`number | undefined`,elements:[{name:`number`},{name:`undefined`}]},description:``},renderHeaderContent:{required:!0,tsType:{name:`signature`,type:`function`,raw:`(header: FoundationTableHeader<TData>) => ReactNode`,signature:{arguments:[{type:{name:`FoundationTableHeader`,elements:[{name:`TData`}],raw:`FoundationTableHeader<TData>`},name:`header`}],return:{name:`ReactNode`}}},description:``},onResizeColumn:{required:!0,tsType:{name:`signature`,type:`function`,raw:`(columnId: string, width: number) => void`,signature:{arguments:[{type:{name:`string`},name:`columnId`},{type:{name:`number`},name:`width`}],return:{name:`void`}}},description:``},onResetColumnWidth:{required:!0,tsType:{name:`signature`,type:`function`,raw:`(columnId: string) => void`,signature:{arguments:[{type:{name:`string`},name:`columnId`}],return:{name:`void`}}},description:``}}}})))()}function Rt(e,t){let n=e.getLeafHeaders().map(e=>t.get(e.column.id)).filter(e=>typeof e==`number`);return n.length?Math.min(...n):2**53-1}function zt(e,t){let n=e.getStartHeaderGroups(),r=e.getCenterHeaderGroups(),i=e.getEndHeaderGroups(),a=Math.max(n.length,r.length,i.length);return Array.from({length:a},(e,a)=>[...n[a]?.headers??[],...r[a]?.headers??[],...i[a]?.headers??[]].filter(e=>e.isPlaceholder?!0:e.getLeafHeaders().some(e=>t.has(e.column.id))).sort((e,n)=>Rt(e,t)-Rt(n,t)))}function Bt(e,t,n){let r=e.getLeafHeaders().map(e=>e.column.id);return r.length>0&&r.every(e=>e in t)?{isPinnedStart:!0,insetInlineStart:t[r[0]]??`0px`,isPinnedBoundary:!!(n&&r.includes(n))}:{isPinnedStart:!1,isPinnedBoundary:!1}}function Vt(e,t){let n=e.getAllLeafColumns().map(e=>e.id);return P({ids:n,order:t.columnOrder})}function Ht({table:e,columnState:t,title:n,isLoading:r,isFetching:i,className:a,minHeight:o=`15em`,tableClassName:s,selectionMode:c=`none`,scrollableRef:l,interactiveElementSelector:u,onActivateRow:p,isRowInteractive:h,getRowClassName:_,getCellClassName:v,getCellStyle:y,getCellLayout:ee,renderCellContent:te,renderHeaderContextMenu:ne,enableColumnResizing:b=!1,enableColumnReordering:x=!1,rowReordering:S,columnResizeMinWidth:C,afterTableContent:w}){let T=We(e,t),se=(0,X.useMemo)(()=>T.map(e=>e.column),[T]),E=(0,X.useMemo)(()=>T.map(e=>e.id),[T]),D=(0,X.useMemo)(()=>new Map(E.map((e,t)=>[e,t])),[E]),le=(0,X.useMemo)(()=>new Set(E),[E]),O=oe({activationDistance:8}),k=zt(e,D),A=Ge(e,t),j=se.filter(e=>e.getIsPinned()===`start`).at(-1)?.id,M=(0,X.useMemo)(()=>t.columnPinning.start??[],[t.columnPinning.start]),N=(0,X.useMemo)(()=>new Set(M),[M]),P=e.getRowModel(),ge=(0,X.useMemo)(()=>P.rows.map(e=>e.id),[P.rows]),ve=!!n,F=P.rows.length>0,I=(0,X.useCallback)(e=>[...e].sort((e,t)=>(D.get(e.column.id)??2**53-1)-(D.get(t.column.id)??2**53-1)),[D]),L=(0,X.useCallback)((t,n)=>{e.setColumnSizing(e=>he(e,t,n,C))},[C,e]),R=(0,X.useCallback)(t=>{e.setColumnSizing(e=>pe(e,t))},[e]),ye=(0,X.useCallback)(n=>{let r=d({event:n,items:E});if(!r)return;let i=Vt(e,t),a=me({order:i,headerIds:E,pinnedIds:M,activeId:String(r.activeId),overId:String(r.overId)});a&&e.setColumnOrder(a)},[t,M,e,E]),z=e=>{if(e.isPlaceholder)return null;let t=ce(e.column.columnDef.header,e.getContext()),n=ne?.(e);return n?(0,Z.jsxs)(de,{children:[(0,Z.jsx)(de.Trigger,{children:(0,Z.jsx)(`div`,{className:Y.headerContextMenuTrigger,tabIndex:0,children:t})}),(0,Z.jsx)(de.Content,{children:n})]}):t},be=(e,t)=>{!(h?.(t)??!!p)||!p||_e(e.target,u)||p(t)},xe=(e,t)=>{!(h?.(t)??!!p)||!p||_e(e.target,u)||g(e,()=>p(t))},B=e=>{let t=h?.(e)??!!p,n=I([...e.getStartVisibleCells(),...e.getCenterVisibleCells(),...e.getEndVisibleCells()]).map(t=>{let n=fe(t.column.columnDef),r=ce(t.column.columnDef.cell,t.getContext()),i={row:e,cell:t,defaultContent:r,columnMeta:n},a=ee?.(i),o=t.column.getIsPinned()===`start`,s=t.column.id===j,c={...n?.align?{textAlign:n.align}:{},...o?{insetInlineStart:A[t.column.id]??`0px`}:{},...y?.(i)??{}};return(0,Z.jsx)(`td`,{className:m(Y.bodyCell,o&&Y.bodyCellPinnedStart,s&&Y.pinnedStartBoundary,a?.mergeWithNext&&Y.bodyCellMergedWithNext,v?.(i)),style:c,children:a?.hideContent?null:te?te(i):r},t.id)}),r={className:m(Y.bodyRow,t&&Y.bodyRowInteractive,e.getIsSelected()&&Y.bodyRowSelected,_?.(e)),"aria-selected":c===`none`?void 0:e.getIsSelected(),tabIndex:t?0:void 0,onClick:t=>be(t,e),onKeyDown:t=>xe(t,e)};return S?(0,Z.jsx)(f.Item,{as:`tr`,id:e.id,disabled:S.disabled,...r,children:n},e.id):(0,Z.jsx)(`tr`,{...r,children:n},e.id)};return(0,Z.jsxs)(ae,{templateRows:ve?`auto 1fr`:`1fr`,className:m(`overflowHidden w100 h100`,Y.root,a),style:{minHeight:o},children:[ve&&(0,Z.jsx)(`h3`,{className:`marginBottomXs`,children:n}),(0,Z.jsxs)(`div`,{className:`surface0 overflowHidden relative w100 h100`,children:[(0,Z.jsx)(ue,{ref:l,className:`w100 h100`,children:(0,Z.jsxs)(Z.Fragment,{children:[(0,Z.jsxs)(`table`,{className:m(Y.table,s),children:[(0,Z.jsx)(`colgroup`,{children:T.map(e=>(0,Z.jsx)(`col`,{style:e.width?{width:e.width}:void 0},e.id))}),(0,Z.jsx)(`thead`,{className:m(`stickyTop`,Y.head),children:x?(0,Z.jsx)(f.Root,{sensors:O,modifiers:[dt],onDragEnd:ye,children:(0,Z.jsx)(f.Container,{containerId:`base-table-header`,items:E,layout:`horizontal`,children:k.map((e,t)=>(0,Z.jsx)(`tr`,{className:Y.headerRow,children:e.map(e=>{let{isPinnedStart:t,insetInlineStart:n,isPinnedBoundary:r}=Bt(e,A,j),i=e.isPlaceholder||!le.has(e.column.id)||N.has(e.column.id);return(0,Z.jsx)(Ft,{header:e,isPinnedStart:t,insetInlineStart:n,isPinnedBoundary:r,isDragDisabled:i,enableColumnResizing:b,enableColumnReordering:x,columnResizeMinWidth:C,renderHeaderContent:z,onResizeColumn:L,onResetColumnWidth:R},e.id)})},`header-group-${t}`))})}):k.map((e,t)=>(0,Z.jsx)(`tr`,{className:Y.headerRow,children:e.map(e=>{let{isPinnedStart:t,insetInlineStart:n,isPinnedBoundary:r}=Bt(e,A,j);return(0,Z.jsx)(Ft,{header:e,isPinnedStart:t,insetInlineStart:n,isPinnedBoundary:r,isDragDisabled:!0,enableColumnResizing:b,enableColumnReordering:x,columnResizeMinWidth:C,renderHeaderContent:z,onResizeColumn:L,onResetColumnWidth:R},e.id)})},`header-group-${t}`))}),(0,Z.jsxs)(`tbody`,{children:[S?(0,Z.jsx)(f.Root,{sensors:O,modifiers:[ft],onDragEnd:S.onDragEnd,children:(0,Z.jsx)(f.Container,{containerId:S.containerId??`base-table-body`,items:ge,layout:`vertical`,children:P.rows.map(B)})}):P.rows.map(B),i&&F&&(0,Z.jsx)(`tr`,{className:Y.fetchingRow,children:(0,Z.jsx)(`td`,{colSpan:Math.max(se.length,1),className:Y.feedbackCell,children:(0,Z.jsx)(re,{})})})]})]}),w]})}),(0,Z.jsxs)(`div`,{className:`absolute inset0 border`,style:{pointerEvents:`none`,zIndex:20},children:[!r&&!i&&!F&&(0,Z.jsx)(ie,{className:Y.noData}),r&&!F&&(0,Z.jsx)(re,{className:`h100 w100`})]})]})]})}var X,Z;function Ut(){return(Ut=e((()=>{X=t(),pt(),E(),j(),h(),D(),O(),S(),b(),x(),le(),u(),W(),Pt(),Lt(),Z=p(),Ht.__docgenInfo={description:"Базовая таблица с общим UI-каркасом для Table и TreeTable.\n\n@NOTE: не для использования напрямую, это база для `Table` и `TreeTable`",methods:[],displayName:`BaseTable`,props:{table:{required:!0,tsType:{name:`FoundationTableInstance`,elements:[{name:`TData`}],raw:`FoundationTableInstance<TData>`},description:``},columnState:{required:!0,tsType:{name:`Pick`,elements:[{name:`FoundationTableState`},{name:`union`,raw:`"columnOrder" | "columnPinning" | "columnSizing" | "columnVisibility"`,elements:[{name:`literal`,value:`"columnOrder"`},{name:`literal`,value:`"columnPinning"`},{name:`literal`,value:`"columnSizing"`},{name:`literal`,value:`"columnVisibility"`}]}],raw:`Pick<FoundationTableState, "columnOrder" | "columnPinning" | "columnSizing" | "columnVisibility">`},description:``},title:{required:!1,tsType:{name:`string`},description:``},isLoading:{required:!1,tsType:{name:`boolean`},description:``},isFetching:{required:!1,tsType:{name:`boolean`},description:``},className:{required:!1,tsType:{name:`string`},description:``},minHeight:{required:!1,tsType:{name:`union`,raw:"`${number}em` | `${number}%`",elements:[{name:`literal`,value:"`${number}em`"},{name:`literal`,value:"`${number}%`"}]},description:``,defaultValue:{value:`"15em"`,computed:!1}},tableClassName:{required:!1,tsType:{name:`string`},description:``},selectionMode:{required:!1,tsType:{name:`TableSelectionMode`},description:``,defaultValue:{value:`"none"`,computed:!1}},scrollableRef:{required:!1,tsType:{name:`Ref`,elements:[{name:`HTMLDivElement`}],raw:`Ref<HTMLDivElement>`},description:``},interactiveElementSelector:{required:!1,tsType:{name:`string`},description:``},onActivateRow:{required:!1,tsType:{name:`signature`,type:`function`,raw:`(row: FoundationTableRow<TData>) => void`,signature:{arguments:[{type:{name:`FoundationTableRow`,elements:[{name:`TData`}],raw:`FoundationTableRow<TData>`},name:`row`}],return:{name:`void`}}},description:``},isRowInteractive:{required:!1,tsType:{name:`signature`,type:`function`,raw:`(row: FoundationTableRow<TData>) => boolean`,signature:{arguments:[{type:{name:`FoundationTableRow`,elements:[{name:`TData`}],raw:`FoundationTableRow<TData>`},name:`row`}],return:{name:`boolean`}}},description:``},getRowClassName:{required:!1,tsType:{name:`signature`,type:`function`,raw:`(row: FoundationTableRow<TData>) => string | undefined`,signature:{arguments:[{type:{name:`FoundationTableRow`,elements:[{name:`TData`}],raw:`FoundationTableRow<TData>`},name:`row`}],return:{name:`union`,raw:`string | undefined`,elements:[{name:`string`},{name:`undefined`}]}}},description:``},getCellClassName:{required:!1,tsType:{name:`signature`,type:`function`,raw:`(args: BaseTableCellRenderArgs<TData>) => string | undefined`,signature:{arguments:[{type:{name:`BaseTableCellRenderArgs`,elements:[{name:`TData`}],raw:`BaseTableCellRenderArgs<TData>`},name:`args`}],return:{name:`union`,raw:`string | undefined`,elements:[{name:`string`},{name:`undefined`}]}}},description:``},getCellStyle:{required:!1,tsType:{name:`signature`,type:`function`,raw:`(args: BaseTableCellRenderArgs<TData>) => CSSProperties | undefined`,signature:{arguments:[{type:{name:`BaseTableCellRenderArgs`,elements:[{name:`TData`}],raw:`BaseTableCellRenderArgs<TData>`},name:`args`}],return:{name:`union`,raw:`CSSProperties | undefined`,elements:[{name:`CSSProperties`},{name:`undefined`}]}}},description:``},getCellLayout:{required:!1,tsType:{name:`signature`,type:`function`,raw:`(args: BaseTableCellRenderArgs<TData>) => BaseTableCellLayout | undefined`,signature:{arguments:[{type:{name:`BaseTableCellRenderArgs`,elements:[{name:`TData`}],raw:`BaseTableCellRenderArgs<TData>`},name:`args`}],return:{name:`union`,raw:`BaseTableCellLayout | undefined`,elements:[{name:`BaseTableCellLayout`},{name:`undefined`}]}}},description:``},renderCellContent:{required:!1,tsType:{name:`signature`,type:`function`,raw:`(args: BaseTableCellRenderArgs<TData>) => ReactNode`,signature:{arguments:[{type:{name:`BaseTableCellRenderArgs`,elements:[{name:`TData`}],raw:`BaseTableCellRenderArgs<TData>`},name:`args`}],return:{name:`ReactNode`}}},description:``},renderHeaderContextMenu:{required:!1,tsType:{name:`signature`,type:`function`,raw:`(header: FoundationTableHeader<TData>) => ReactNode`,signature:{arguments:[{type:{name:`FoundationTableHeader`,elements:[{name:`TData`}],raw:`FoundationTableHeader<TData>`},name:`header`}],return:{name:`ReactNode`}}},description:`Общий слот контекстного меню заголовка.
|
|
12
|
+
|
|
13
|
+
BaseTable намеренно не знает про сортировку, группировку или доменные
|
|
14
|
+
действия. Он только сохраняет единый доступный способ открыть меню для
|
|
15
|
+
\`Table\` и \`TreeTable\`, а содержимое передает потребитель.`},enableColumnResizing:{required:!1,tsType:{name:`boolean`},description:``,defaultValue:{value:`false`,computed:!1}},enableColumnReordering:{required:!1,tsType:{name:`boolean`},description:``,defaultValue:{value:`false`,computed:!1}},rowReordering:{required:!1,tsType:{name:`BaseTableRowReordering`},description:``},columnResizeMinWidth:{required:!1,tsType:{name:`number`},description:``},afterTableContent:{required:!1,tsType:{name:`ReactNode`},description:``}}}})))()}var Wt,Gt,Kt,Q;function qt(){return(qt=e((()=>{Wt=`jPPyP7`,Gt=`Oa7e5P`,Kt=`KhQtgF`,Q={formattedCellValue:Wt,formattedCell:Gt,formattedCellInner:Kt}})))()}function Jt({displayValue:e,align:t=`left`}){let n=(0,Yt.useRef)(null),r=e.showValue,i=e.showIcon?e.icon:void 0,a=r&&e.value!=null?String(e.value):``,o=ne(e.state),s=t===`right`?`flex-end`:t===`center`?`center`:`flex-start`,c=t===`center`?`center`:t===`right`?`right`:`left`;return(0,Yt.useEffect)(()=>{let t=n.current;if(!t)return;let r=()=>{if(!e.overflowTooltip||!a){t.removeAttribute(`title`);return}if(t.scrollWidth>t.clientWidth+1){t.setAttribute(`title`,a);return}t.removeAttribute(`title`)};if(r(),typeof ResizeObserver>`u`)return;let i=new ResizeObserver(r);return i.observe(t),()=>{i.disconnect()}},[e.overflowTooltip,a]),(0,$.jsx)(`div`,{className:m(Q.formattedCell,o),children:(0,$.jsxs)(`div`,{className:Q.formattedCellInner,style:{justifyContent:s},children:[e.iconPosition===`left`?(0,$.jsx)(Ce,{state:i}):null,r?(0,$.jsx)(`span`,{ref:n,className:m(`textOverflow`,Q.formattedCellValue),style:{textAlign:c},children:a}):null,e.iconPosition===`right`?(0,$.jsx)(Ce,{state:i}):null]})})}var Yt,$;function Xt(){return(Xt=e((()=>{Yt=t(),ee(),h(),Oe(),qt(),$=p(),Jt.__docgenInfo={description:"Общий renderer форматированной ячейки для `Table` и будущего `TreeTable`.\n\nКомпонент отвечает только за UI-отрисовку уже вычисленного display-result:\nruntime и бизнес-логика вычисления значения в него не входят.",methods:[],displayName:`FormattedTableCell`,props:{displayValue:{required:!0,tsType:{name:`FormattersPipelineDisplayValue`},description:`Нормализованный display-result из formatting-runtime.`},align:{required:!1,tsType:{name:`TableColumnAlign`},description:`Табличное выравнивание содержимого.`,defaultValue:{value:`"left"`,computed:!1}}}}})))()}export{Ze as _,ut as a,st as c,it as d,rt as f,Qe as g,Xe as h,Ut as i,ot as l,nt as m,Xt as n,lt as o,tt as p,Ht as r,ct as s,Jt as t,at as u,Ue as v,W as y};
|
|
@@ -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-BmGorvhi.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-u0CCD6I1.js";import{a as p,c as m,d as h,f as g,g as _,h as v,i as y,l as b,m as x,n as S,o as C,p as w,r as T,s as E,t as D,u as O}from"./Grid.stories-sZUaIp7v.js";function k(e){let t={code:`code`,h2:`h2`,h3:`h3`,li:`li`,p:`p`,pre:`pre`,ul:`ul`,...n(),...e.components};return(0,j.jsxs)(j.Fragment,{children:[(0,j.jsx)(s,{of:E,parameters:{docs:{toc:!0}}}),`
|
|
2
2
|
`,(0,j.jsx)(u,{children:`Grid`}),`
|
|
3
3
|
`,(0,j.jsx)(o,{children:`Композиция для построения grid-раскладок с управлением колонками, строками и позиционированием элементов`}),`
|
|
4
4
|
`,(0,j.jsx)(t.p,{children:`Grid уже имеет живые stories, а эта страница собирает их в структурированную документацию с краткими рекомендациями, примерами подключения и API.
|
|
@@ -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-BmGorvhi.js";import{n,t as r}from"./PolymorphicComponent-NBvIz9JD.js";import{a as i,i as a,n as o,r as s,t as c}from"./GridContainer-C5r-VTTG.js";function l({ref:e,children:t,className:n=``,as:i,style:o,area:c,column:l,row:d,alignSelf:f,justifySelf:p,...m}){let h=s({alignSelf:f,justifySelf:p}),g=a({area:c,column:l,row:d}),_=[h,g.className,n].filter(Boolean).join(` `),v={...g.style,...o};return(0,u.jsx)(r,{as:i,...m,ref:e,className:_,style:v,children:t})}var u;function d(){return(d=e((()=>{n(),i(),u=t(),l.displayName=`GridItem`,l.__docgenInfo={description:``,methods:[],displayName:`GridItem`,props:{area:{required:!1,tsType:{name:`ResponsiveValue`,elements:[{name:`string`}],raw:`ResponsiveValue<string>`},description:`Именованная область для размещения элемента
|
|
2
2
|
|
|
3
3
|
Связывает элемент с областью объявленной в GridContainer areas.
|
|
4
4
|
Самый простой способ позиционирования в сложных макетах.
|
|
@@ -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-BmGorvhi.js";import{n as i,t as a}from"./Grid-DUcSdqsI.js";import{n as o,t as s}from"./ResponsiveLayoutPreview-BWBLsr8u.js";var c=t({Alignment:()=>_,AutoFlow:()=>g,BasicGrid:()=>h,ComplexTemplates:()=>b,Gaps:()=>v,GridAreas:()=>x,InlineGrid:()=>C,IntrinsicResponsive:()=>O,ItemPlacement:()=>S,PredefinedVariants:()=>y,RealWorld:()=>w,ResponsiveAreas:()=>E,ResponsiveItemPlacement:()=>D,ResponsiveTemplates:()=>T,__namedExportsOrder:()=>k,default:()=>m});function l({children:e,index:t=0,style:n}){return(0,u.jsx)(a.Item,{style:{...f.item,backgroundColor:p(t),...n},children:e})}var u,d,f,p,m,h,g,_,v,y,b,x,S,C,w,T,E,D,O,k;function A(){return(A=e((()=>{n(),o(),i(),u=r(),{useArgs:d}=__STORYBOOK_MODULE_PREVIEW_API__,f={container:{border:`2px dashed var(--border-0)`,padding:`2em`,marginBlock:`1em`},item:{textAlign:`center`,fontWeight:`bold`,color:`white`,minHeight:`5em`,minWidth:`10em`,display:`flex`,alignItems:`center`,justifyContent:`center`},itemColors:[`#ff6b6b`,`#4ecdc4`,`#45b7d1`,`#96ceb4`,`#feca57`,`#ff9ff3`,`#54a0ff`,`#5f27cd`]},p=e=>f.itemColors[e%f.itemColors.length],m={title:`Layout/Grid`,component:a.Container,args:{gap:`md`},parameters:{layout:`padded`},decorators:[e=>{let[t]=d();return(0,u.jsx)(e,{args:t})}],argTypes:{inline:{description:`Использует inline-grid вместо grid.`,control:`boolean`},row:{description:`Автоматически размещает элементы по строкам.`,control:`boolean`},column:{description:`Автоматически размещает элементы по колонкам.`,control:`boolean`},dense:{description:`Заполняет свободные ячейки плотным auto-flow.`,control:`boolean`},gap:{description:`Общий интервал между ячейками.`,control:`select`,options:[`none`,`xs`,`sm`,`md`,`lg`,`xl`]},gapRow:{description:`Интервал между строками.`,control:`select`,options:[`xs`,`sm`,`md`,`lg`,`xl`]},gapColumn:{description:`Интервал между колонками.`,control:`select`,options:[`xs`,`sm`,`md`,`lg`,`xl`]},align:{description:`Выравнивание содержимого ячеек по вертикали.`,control:`select`,options:[`start`,`center`,`end`,`stretch`,`baseline`]},justify:{description:`Выравнивание содержимого ячеек по горизонтали.`,control:`select`,options:[`start`,`center`,`end`,`stretch`]},alignContent:{description:`Распределение всей сетки по вертикали.`,control:`select`,options:[`start`,`center`,`end`,`stretch`,`between`,`around`,`evenly`]},justifyContent:{description:`Распределение всей сетки по горизонтали.`,control:`select`,options:[`start`,`center`,`end`,`stretch`,`between`,`around`,`evenly`]},templateColumns:{description:`Шаблон колонок CSS Grid.`,control:`text`},templateRows:{description:`Шаблон строк CSS Grid.`,control:`text`},autoColumns:{description:`Размер автоматически созданных колонок.`,control:`text`},autoRows:{description:`Размер автоматически созданных строк.`,control:`text`},areas:{description:`Именованные области grid-template-areas.`,control:`text`},variant:{description:`Готовый вариант раскладки.`,control:`select`,options:[`single-column`,`auto-1fr`,`auto1fr-rows-auto`]},as:{description:`Семантический HTML-тег контейнера.`,control:`select`,options:[`div`,`section`,`main`,`nav`,`ul`]},children:{description:`Содержимое grid-контейнера.`,control:!1}}},h={render:({children:e,...t})=>(0,u.jsx)(a.Container,{...t,templateColumns:`1fr 1fr 1fr`,style:f.container,children:e}),args:{children:(0,u.jsxs)(u.Fragment,{children:[(0,u.jsx)(l,{index:0,children:`1`}),(0,u.jsx)(l,{index:1,children:`2`}),(0,u.jsx)(l,{index:2,children:`3`}),(0,u.jsx)(l,{index:3,children:`4`}),(0,u.jsx)(l,{index:4,children:`5`}),(0,u.jsx)(l,{index:5,children:`6`})]})}},g={render:()=>(0,u.jsxs)(`div`,{children:[(0,u.jsx)(`h3`,{children:`Row (default)`}),(0,u.jsxs)(a.Container,{templateColumns:`repeat(3, 100px)`,templateRows:`repeat(2, 60px)`,gap:`sm`,style:f.container,children:[(0,u.jsx)(l,{index:0,children:`1`}),(0,u.jsx)(l,{index:1,children:`2`}),(0,u.jsx)(l,{index:2,children:`3`}),(0,u.jsx)(l,{index:3,children:`4`}),(0,u.jsx)(l,{index:4,children:`5`}),(0,u.jsx)(l,{index:5,children:`6`})]}),(0,u.jsx)(`h3`,{children:`Column`}),(0,u.jsxs)(a.Container,{templateColumns:`repeat(2, 100px)`,templateRows:`repeat(3, 60px)`,column:!0,gap:`sm`,style:f.container,children:[(0,u.jsx)(l,{index:0,children:`1`}),(0,u.jsx)(l,{index:1,children:`2`}),(0,u.jsx)(l,{index:2,children:`3`}),(0,u.jsx)(l,{index:3,children:`4`}),(0,u.jsx)(l,{index:4,children:`5`}),(0,u.jsx)(l,{index:5,children:`6`})]}),(0,u.jsx)(`h3`,{children:`Dense`}),(0,u.jsxs)(a.Container,{templateColumns:`repeat(4, 80px)`,templateRows:`repeat(3, 60px)`,dense:!0,gap:`sm`,style:f.container,children:[(0,u.jsx)(l,{index:0,style:{gridColumn:`span 2`},children:`Span 2`}),(0,u.jsx)(l,{index:1,children:`2`}),(0,u.jsx)(l,{index:2,style:{gridRow:`span 2`},children:`Span 2`}),(0,u.jsx)(l,{index:3,children:`4`}),(0,u.jsx)(l,{index:4,children:`5`}),(0,u.jsx)(l,{index:5,children:`6`}),(0,u.jsx)(l,{index:6,children:`7`})]})]}),args:{children:void 0}},_={render:()=>(0,u.jsxs)(`div`,{children:[(0,u.jsx)(`h3`,{style:{marginBlock:`1em`},children:`Align Items`}),[`start`,`center`,`end`,`stretch`].map(e=>(0,u.jsxs)(`div`,{children:[(0,u.jsx)(`h4`,{children:e}),(0,u.jsxs)(a.Container,{templateColumns:`repeat(3, 1fr)`,align:e,gap:`sm`,style:f.container,children:[(0,u.jsx)(l,{index:0,style:{height:e===`stretch`?`auto`:`5em`},children:`Short`}),(0,u.jsx)(l,{index:1,style:{height:e===`stretch`?`auto`:`10em`},children:`Tall`}),(0,u.jsx)(l,{index:2,style:{height:e===`stretch`?`auto`:`8em`},children:`Medium`})]})]},e)),(0,u.jsx)(`h3`,{style:{marginBlock:`1em`},children:`Justify Items`}),[`start`,`center`,`end`,`stretch`].map(e=>(0,u.jsxs)(`div`,{children:[(0,u.jsx)(`h4`,{children:e}),(0,u.jsxs)(a.Container,{templateColumns:`repeat(3, 20em)`,justify:e,gap:`sm`,style:f.container,children:[(0,u.jsx)(l,{index:0,style:{width:e===`stretch`?`auto`:`10em`},children:`Item`}),(0,u.jsx)(l,{index:1,style:{width:e===`stretch`?`auto`:`10em`},children:`Item`}),(0,u.jsx)(l,{index:2,style:{width:e===`stretch`?`auto`:`10em`},children:`Item`})]})]},e))]}),args:{children:void 0}},v={render:()=>(0,u.jsxs)(`div`,{children:[[`xs`,`sm`,`md`,`lg`,`xl`].map(e=>(0,u.jsxs)(`div`,{children:[(0,u.jsxs)(`h3`,{children:[`Gap: `,e]}),(0,u.jsx)(a.Container,{templateColumns:`repeat(3, 1fr)`,gap:e,style:f.container,children:[1,2,3,4,5,6].map(e=>(0,u.jsxs)(l,{index:e,children:[`Item `,e]},e))})]},e)),(0,u.jsx)(`h3`,{children:`Different Row and Column Gaps`}),(0,u.jsx)(a.Container,{templateColumns:`repeat(3, 1fr)`,gapRow:`lg`,gapColumn:`sm`,style:f.container,children:[1,2,3,4,5,6].map(e=>(0,u.jsxs)(l,{index:e,children:[`Item `,e]},e))})]}),args:{children:void 0}},y={render:()=>(0,u.jsxs)(`div`,{children:[(0,u.jsx)(`h3`,{children:`Single Column (grid-template-columns: 100%; grid-auto-rows: auto 1fr)`}),(0,u.jsxs)(a.Container,{variant:`single-column`,style:{...f.container,height:`200px`},children:[(0,u.jsx)(l,{index:0,children:`Header (auto)`}),(0,u.jsx)(l,{index:1,children:`Content (1fr)`})]}),(0,u.jsx)(`h3`,{children:`Auto 1fr Rows (grid-auto-rows: 1fr)`}),(0,u.jsxs)(a.Container,{variant:`auto-1fr`,templateColumns:`1fr 1fr`,style:{...f.container,height:`150px`},children:[(0,u.jsx)(l,{index:0,children:`Equal`}),(0,u.jsx)(l,{index:1,children:`Height`})]}),(0,u.jsx)(`h3`,{children:`Auto 1fr Columns (grid-template-columns: auto 1fr; grid-auto-rows: auto)`}),(0,u.jsxs)(a.Container,{variant:`auto1fr-rows-auto`,gap:`sm`,style:f.container,children:[(0,u.jsx)(l,{index:0,children:`Label`}),(0,u.jsx)(l,{index:1,children:`Content that takes remaining space`}),(0,u.jsx)(l,{index:2,children:`Another`}),(0,u.jsx)(l,{index:3,children:`More content here`})]})]}),args:{children:void 0}},b={render:()=>(0,u.jsxs)(`div`,{children:[(0,u.jsx)(`h3`,{children:`Auto-fit with Minmax`}),(0,u.jsx)(a.Container,{templateColumns:`repeat(auto-fit, minmax(150px, 1fr))`,gap:`md`,style:f.container,children:[1,2,3,4,5,6].map(e=>(0,u.jsxs)(l,{index:e,children:[`Card `,e]},e))}),(0,u.jsx)(`h3`,{children:`Fixed and Flexible Columns`}),(0,u.jsxs)(a.Container,{templateColumns:`200px 1fr 100px`,gap:`sm`,style:f.container,children:[(0,u.jsx)(l,{index:0,children:`Sidebar`}),(0,u.jsx)(l,{index:1,children:`Main Content`}),(0,u.jsx)(l,{index:2,children:`Tools`})]}),(0,u.jsx)(`h3`,{children:`Masonry-like Layout`}),(0,u.jsxs)(a.Container,{templateColumns:`repeat(4, 1fr)`,autoRows:`100px`,gap:`sm`,style:f.container,children:[(0,u.jsx)(l,{index:0,style:{gridRow:`span 2`},children:`Tall`}),(0,u.jsx)(l,{index:1,children:`Normal`}),(0,u.jsx)(l,{index:2,children:`Normal`}),(0,u.jsx)(l,{index:3,style:{gridRow:`span 3`},children:`Very Tall`}),(0,u.jsx)(l,{index:4,children:`Normal`}),(0,u.jsx)(l,{index:5,style:{gridRow:`span 2`},children:`Tall`}),(0,u.jsx)(l,{index:6,children:`Normal`}),(0,u.jsx)(l,{index:7,children:`Normal`})]})]}),args:{children:void 0}},x={render:()=>(0,u.jsxs)(`div`,{children:[(0,u.jsx)(`h3`,{children:`Basic Layout with Areas`}),(0,u.jsxs)(a.Container,{areas:`
|
|
2
2
|
"header header"
|
|
3
3
|
"nav main"
|
|
4
4
|
"footer footer"
|